/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

/**
 * Remove default margin.
 */
body {
  margin: 0; }

/* HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block; }

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */ }

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0; }

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none; }

/* Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background: transparent; }

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0; }

/* Text-level semantics
   ========================================================================== */
/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted; }

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */
b,
strong {
  font-weight: bold; }

/**
 * Address styling not present in Safari and Chrome.
 */
dfn {
  font-style: italic; }

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0; }

/**
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000; }

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%; }

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

/* Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9/10.
 */
img {
  border: 0; }

/**
 * Correct overflow not hidden in IE 9/10/11.
 */
svg:not(:root) {
  overflow: hidden; }

/* Grouping content
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
figure {
  margin: 1em 40px; }

/**
 * Address differences between Firefox and other browsers.
 */
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0; }

/**
 * Contain overflow in all browsers.
 */
pre {
  overflow: auto; }

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em; }

/* Forms
   ========================================================================== */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  /* 1 */
  font: inherit;
  /* 2 */
  margin: 0;
  /* 3 */ }

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */
button {
  overflow: visible; }

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */
button,
select {
  text-transform: none; }

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */ }

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default; }

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0; }

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
input {
  line-height: normal; }

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto; }

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
 *    (include `-moz` to future-proof).
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  /* 2 */
  box-sizing: content-box; }

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em; }

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
  overflow: auto; }

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
  font-weight: bold; }

/* Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0; }

td,
th {
  padding: 0; }

/**
 *   Exports
 *   Outputs the chunk of content passed if component $name hasn't yet been output.
 *   This prevents code duplication by keeping track of which components have already been output.
 *
 *   @param {string} $name - Name of component to output
 *
 *   @output The content passed, if the component has not yet been referenced.
 */
/**
 *
 *   Map Serialize
 *   Convert a map to JSON. Don't you even try to get fancy with this just yet.
 *
 *   @param {map} $map - Map to convert.
 *
 *   @return A string with a map converted to JSON.
 */
/**
 *   Map Next
 *   Find the next key in a map.
 *
 *   @param {map} $map - Map to traverse.
 *   @param {mixed} $key - Key to use as a starting point.
 *
 *   @return The value for the key after $key if $key was found. If $key was not found, or $key was
 *     the last value in the map, returns null.
 */
/**
 *   Is It Light?
 *   Checks the lightness of $color, and if it passes the $threshold of lightness, it returns the $yes color.
 *   Otherwise, it returns the $no color. Use this function to dynamically output a foreground color based on
 *   a given background color.
 *
 *   @param {color} $color - Color to check the lightness of.
 *   @param {color} $yes - Color to return if $color is light.
 *   @param {color} $no - Color to return if $color is dark.
 *   @param {percentage} $threshold - Threshold of lightness to check against.
 *
 *   @return The $yes color or $no color.
 */
/**
 *   Smart Scale
 *   Scales a color to be lighter if it's light, or darker if it's dark.
 *   Use this function to "fade" a color appropriate to its lightness.
 *
 *   @param {color} $color - Color to scale.
 *   @param {percentage} $scale - Amount to scale up or down.
 *   @param {percentage} $threshold - Threshold of lightness to check against.
 *
 *   @return A scaled color.
 */
/**
 *   Has Value
 *   Returns true if a value is not 0, null, or none.
 *   Use this function to check for values like border: 0 or box-shadow: none.
 *
 *   @param $val - Value to check.
 *
 *   @return True if $val is not 0, null, or none.
 */
/**
 *   Get Side
 *   Determine a top/right/bottom/right value on a padding, margin, etc. property, no matter how many values were passed in.
 *   Use this function if you need to know the specific side of a value, but don't know if the value is using shorthand.
 *
 *   @param {list|number} $val - Value to analyze. Should be a shorthand sizing property, e.g. "1em 2em 1em"
 *   @param {keyword} $side - Side to return. Should be top, right, bottom, or left.
 *
 *   @return A single value based on $val and $side.
 */
/**
 *   Get Border Value
 *   Given border $val, find a specific element of the border, which is $elem.
 *   Possible values for $elem are width, style, and color.
 *
 *   @param {list} $val - Border value to find a value in.
 *   @param {keyword} $elem - Border component to extract.
 *
 *   @param If the value exists, returns the value. If the value is not in the border definition,
 *     the function will return a 0px width, solid style, or black border.
 */
/**
 *   Get Shadow Value
 *   Given shadow value $val, find a specific element of the shadow, which is $elem.
 *   Possible values for $elem are x, y, size, spread, color, and offset.
 *
 *   @param {list} $val - Shadow value to find a value in.
 *   @param {keyword} $elem - Shadow component to extract.
 *
 *   @return If the value exists, returns the value. If the value is not set, returns false.
 *     If $elem is "inset", returns true, otherwise false.
**/
/**
 *   Strip Unit
 *   Removes the unit (e.g. px, em, rem) from a value, returning the number only.
 *
 *   @param {number} $num - Number to strip unit from.
 *
 *   @return The same number, sans unit.
 */
/*
  BREAKPOINTS
  -----------

  Foundation for Apps has three core breakpoints: small (> 0), medium (>= 640), and large (>= 1024).
  There are two additional breakpoints, xlarge, and xxlarge, which (by default) do not
  output as sizing classes.

  Access named breakpoints using the mixin breakpoint($size), where $size is a breakpoint value.
  You can also pass an em, rem, or pixel value into this mixin to generate an em-based media
  query.

  Create new named breakpoints using the $breakpoints map. Change which named breakpoints get
  their own classes by modifying the $breakpoint-classes map.

  NOTE: If you change the $breakpoints map, know that all values must be ordered by width, smallest
  width first. So 0 is always your first value.
*/
/*
  Breakpoint
  Wraps a media query around the content you put inside the mixin. This mixin accepts
  a number of values:
   - If a string is passed, the mixin will look for it in the $breakpoints map, and use
     a media query there.
   - If a pixel value is passed, it will be converted to an em value using $rem-base.
   - If a rem value is passed, the unit will be changed to em.
   - If an em value is passed, the value will be used as-is.
*/
/*
  Each Breakpoint
  Prefixes selector $class with breakpoint keywords, allowing you to create a batch of
  breakpoint classes with one chunk of code. If you want to skip a breakpoint (like small,
  because mobile first and all that), add values to the $omit parameter.

  $class - Class to prefix with the breakpoint name and a hyphen.
  $omit - Named breakpoints to skip. No class will be added with breakpoints in this list.
*/
/*
  CSS Output
*/
meta.foundation-version {
  font-family: "0.0.1"; }

meta.foundation-mq {
  font-family: '{"small": "0", "medium": "40rem", "large": "75rem", "xlarge": "90rem", "xxlarge": "120rem"}'; }

/*
  Legacy variables
  Need to convert all references to a newer style eventually
*/
/*
  GLOBAL
  ------

  Global styles and settings for Foundation for Apps are stored here. This file must always
  be imported, no matter what.

  Includes:
   -
*/
html, body {
  height: 100%;
  font-size: 100%; }

html {
  box-sizing: border-box; }

*, *:before, *:after {
  box-sizing: inherit; }

body {
  background: #fff;
  color: #222;
  padding: 0;
  margin: 0;
  font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  font-weight: normal;
  font-style: normal;
  line-height: 1;
  position: relative;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

img {
  max-width: 100%;
  height: auto;
  -ms-interpolation-mode: bicubic;
  display: inline-block;
  vertical-align: middle; }

#map_canvas img,
#map_canvas embed,
#map_canvas object,
.map_canvas img,
.map_canvas embed,
.map_canvas object {
  max-width: none !important; }

.padding {
  padding: 1rem; }

.iconic {
  width: 1rem;
  height: 1rem;
  vertical-align: middle; }
  a > .iconic {
    margin-top: -2px;
    margin-right: 0.25rem; }
    a > .iconic * {
      fill: #00558b;
      stroke: #00558b; }
      a > .iconic *.iconic-property-accent {
        fill: #00558b;
        stroke: #00558b; }

.iconic * {
  fill: #00558b;
  stroke: #00558b; }
  .iconic *.iconic-property-accent {
    fill: #00558b;
    stroke: #00558b; }

.iconic-color-primary * {
  fill: #00558b;
  stroke: #00558b; }
  .iconic-color-primary *.iconic-property-accent {
    fill: #00558b;
    stroke: #00558b; }

.iconic-color-success * {
  fill: #43AC6A;
  stroke: #43AC6A; }
  .iconic-color-success *.iconic-property-accent {
    fill: #43AC6A;
    stroke: #43AC6A; }

.iconic-color-warning * {
  fill: #F08A24;
  stroke: #F08A24; }
  .iconic-color-warning *.iconic-property-accent {
    fill: #F08A24;
    stroke: #F08A24; }

.iconic-color-alert * {
  fill: #F04124;
  stroke: #F04124; }
  .iconic-color-alert *.iconic-property-accent {
    fill: #F04124;
    stroke: #F04124; }

.iconic-color-dark * {
  fill: #232323;
  stroke: #232323; }
  .iconic-color-dark *.iconic-property-accent {
    fill: #232323;
    stroke: #232323; }

/*
  ACTION SHEET
  ------------

  A dropdown menu that sticks to the bottom of the screen on small devices, and becomes a dropdown menu on larger devices.
*/
/*
  Styles for the list inside an action sheet.
  Don't include this mixin if you want to build custom controls inside the sheet.
*/
/*
  Styles for the action sheet container. Action sheets pin to the top or bottom of the screen.
*/
.action-sheet-container {
  position: relative;
  display: inline-block; }

.action-sheet {
  position: fixed;
  left: 0;
  z-index: 1000;
  width: 100%;
  padding: 1rem;
  background: white;
  text-align: center;
  transition-property: transform opacity;
  transition-duration: 0.25s;
  transition-timing-function: ease-out;
  box-shadow: 0 -3px 10px rgba(0, 0, 0, 0.25);
  bottom: 0;
  transform: translateY(100%); }
  .action-sheet.is-active {
    transform: translateY(0%); }
  .action-sheet ul {
    margin: -1rem;
    margin-top: 0;
    list-style-type: none;
    user-select: none; }
    .action-sheet ul:first-child {
      margin-top: -1rem; }
      .action-sheet ul:first-child li:first-child {
        border-top: 0; }
    .action-sheet ul a {
      display: block;
      padding: 0.8rem;
      line-height: 1;
      color: #000;
      border-top: 1px solid #ccc; }
      .action-sheet ul a:hover {
        color: #000;
        background: #f2f2f2; }
    .action-sheet ul .alert > a {
      color: #F04124; }
    .action-sheet ul .disabled > a {
      pointer-events: none;
      color: #999; }
  @media only screen and (min-width: 40em) {
    .action-sheet {
      /*
        Core styles
      */
      position: absolute;
      left: 50%;
      width: 300px;
      border-radius: 4px;
      opacity: 0;
      pointer-events: none;
      /*
        Menu shadow
      */
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
      /*
        Active state
      */
      /*
        Menu tail
      */
      /*
        Positioning
      */
      top: auto;
      bottom: 0;
      transform: translateX(-50%) translateY(110%); }
      .action-sheet.is-active {
        opacity: 1;
        pointer-events: auto; }
      .action-sheet::before, .action-sheet::after {
        content: '';
        position: absolute;
        left: 50%;
        display: block;
        width: 0px;
        height: 0px;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        margin-left: -10px; }
      .action-sheet.is-active {
        transform: translateX(-50%) translateY(100%); }
      .action-sheet::before, .action-sheet::after {
        top: -10px;
        bottom: auto;
        border-top: 0;
        border-bottom: 10px solid white; }
      .action-sheet::before {
        top: -12px;
        border-bottom-color: rgba(0, 0, 0, 0.15); }
      .action-sheet.top {
        /*
          Core styles
        */
        position: absolute;
        left: 50%;
        width: 300px;
        border-radius: 4px;
        opacity: 0;
        pointer-events: none;
        /*
          Menu shadow
        */
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
        /*
          Active state
        */
        /*
          Menu tail
        */
        /*
          Positioning
        */
        top: 0;
        bottom: auto;
        transform: translateX(-50%) translateY(-120%); }
        .action-sheet.top.is-active {
          opacity: 1;
          pointer-events: auto; }
        .action-sheet.top::before, .action-sheet.top::after {
          content: '';
          position: absolute;
          left: 50%;
          display: block;
          width: 0px;
          height: 0px;
          border-left: 10px solid transparent;
          border-right: 10px solid transparent;
          margin-left: -10px; }
        .action-sheet.top.is-active {
          transform: translateX(-50%) translateY(-110%); }
        .action-sheet.top::before, .action-sheet.top::after {
          top: auto;
          bottom: -10px;
          border-top: 10px solid white;
          border-bottom: 0; }
        .action-sheet.top::before {
          bottom: -12px;
          border-top-color: rgba(0, 0, 0, 0.15); } }
  .action-sheet.primary {
    background: #00558b;
    color: #fff;
    border: 0; }
    .action-sheet.primary::before {
      display: none; }
    .action-sheet.primary::before, .action-sheet.primary::after {
      border-top-color: #00558b; }
    .action-sheet.primary.top::before, .action-sheet.primary.top::after {
      border-bottom-color: #00558b; }
    .action-sheet.primary ul {
      margin: -1rem;
      margin-top: 0;
      list-style-type: none;
      user-select: none; }
      .action-sheet.primary ul:first-child {
        margin-top: -1rem; }
        .action-sheet.primary ul:first-child li:first-child {
          border-top: 0; }
      .action-sheet.primary ul a {
        display: block;
        padding: 0.8rem;
        line-height: 1;
        color: #fff;
        border-top: 1px solid #006cb0; }
        .action-sheet.primary ul a:hover {
          color: #fff;
          background: #00609e; }
      .action-sheet.primary ul .alert > a {
        color: #F04124; }
      .action-sheet.primary ul .disabled > a {
        pointer-events: none;
        color: #999; }
  .action-sheet.dark {
    background: #232323;
    color: #fff;
    border: 0; }
    .action-sheet.dark::before {
      display: none; }
    .action-sheet.dark::before, .action-sheet.dark::after {
      border-top-color: #232323; }
    .action-sheet.dark.top::before, .action-sheet.dark.top::after {
      border-bottom-color: #232323; }
    .action-sheet.dark ul {
      margin: -1rem;
      margin-top: 0;
      list-style-type: none;
      user-select: none; }
      .action-sheet.dark ul:first-child {
        margin-top: -1rem; }
        .action-sheet.dark ul:first-child li:first-child {
          border-top: 0; }
      .action-sheet.dark ul a {
        display: block;
        padding: 0.8rem;
        line-height: 1;
        color: #fff;
        border-top: 1px solid #393939; }
        .action-sheet.dark ul a:hover {
          color: #fff;
          background: #2e2e2e; }
      .action-sheet.dark ul .alert > a {
        color: #F04124; }
      .action-sheet.dark ul .disabled > a {
        pointer-events: none;
        color: #999; }

/*
  BLOCK LIST
  ----------

  A generic list component that can accomodate a variety of styles and controls.

  Features:
   - Icons
   - Labels
   - Chevrons
   - Text fields
   - Dropdown menus
   - Checkbox/radio inputs
*/
/*
  Adds styles for a block list container.

  $font-size: global font size for the list.
  $full-bleed: when "true", the margins of the list invert to line it up with the edge of a padded element.
*/
.block-list {
  margin-bottom: 1rem;
  line-height: 1;
  user-select: none; }
  .block-list, .block-list ul {
    list-style-type: none; }
  .block-list ul {
    margin-left: 0; }

/*
  Styles block list headers on the selector you include this mixin in (normally a <header>).

  $color - color of the header.
  $font-size - font size of the header.
  $offset - left margin to add to the header, to line it up with the list items.
*/
/*
  Styles block list items on the selector you include this mixin in (normally an <li>).

  $color - color of items.
  $color-hover - color of items on hover.
  $background - background of items.
  $background-hover - background of items on hover.
  $border - border between items.
  $padding - padding on items.
*/
/*
  Adds label styles to the class you include this mixin in.

  $color - color of the label.
  $left-class - extra class to flip the orientation of the label.
  $left-padding - left padding to use for left-hand labels.
*/
/*
  Adds support for chevrons, which appear on the right-hand side of the item.

  $color - color of the chevron.
  $padding - include the global padding of block list items here.
*/
/*
  Adds icon styles. Call this mixin on a block list container.

  $size - size of the icon as a percentage (decimal) of the list item's height.
  $item-selector - overrides the 'li' selector used for list items.
*/
/*
  Adds support for text fields, select menus, and checkbox/radio groups in block lists.

  $color - color of select menu arrow.
  $background-hover - color of select menu when hovered over.
  $padding - include the global padding of block list items here.
  $dropdown-class - class to use for list items that contain a dropdown.
  $switch-class - class to use for switches inside list items.
*/
.block-list {
  font-size: 1rem;
  margin-left: -1rem;
  margin-right: -1rem; }
  .block-list [type="text"], .block-list input[type="password"], .block-list input[type="date"], .block-list input[type="datetime"], .block-list input[type="datetime-local"], .block-list input[type="month"], .block-list input[type="week"], .block-list input[type="email"], .block-list input[type="number"], .block-list input[type="search"], .block-list input[type="tel"], .block-list input[type="time"], .block-list input[type="url"], .block-list input[type="color"], .block-list textarea {
    margin: 0;
    border: 0;
    line-height: 1;
    height: auto;
    padding: 0.8rem 1rem;
    color: inherit; }
    .block-list [type="text"]:hover, .block-list [type="text"]:focus, .block-list input[type="password"]:hover, .block-list input[type="password"]:focus, .block-list input[type="date"]:hover, .block-list input[type="date"]:focus, .block-list input[type="datetime"]:hover, .block-list input[type="datetime"]:focus, .block-list input[type="datetime-local"]:hover, .block-list input[type="datetime-local"]:focus, .block-list input[type="month"]:hover, .block-list input[type="month"]:focus, .block-list input[type="week"]:hover, .block-list input[type="week"]:focus, .block-list input[type="email"]:hover, .block-list input[type="email"]:focus, .block-list input[type="number"]:hover, .block-list input[type="number"]:focus, .block-list input[type="search"]:hover, .block-list input[type="search"]:focus, .block-list input[type="tel"]:hover, .block-list input[type="tel"]:focus, .block-list input[type="time"]:hover, .block-list input[type="time"]:focus, .block-list input[type="url"]:hover, .block-list input[type="url"]:focus, .block-list input[type="color"]:hover, .block-list input[type="color"]:focus, .block-list textarea:hover, .block-list textarea:focus {
      border: 0; }
  .block-list li > input[type="checkbox"], .block-list li > input[type="radio"] {
    position: absolute;
    left: -9999px; }
    .block-list li > input[type="checkbox"] + label, .block-list li > input[type="radio"] + label {
      font-size: 1rem;
      margin: 0; }
    .block-list li > input[type="checkbox"]:checked + label::before, .block-list li > input[type="radio"]:checked + label::before {
      content: '';
      background-size: 100% 100%;
      width: 1.5em;
      height: 1.5em;
      color: #00558b;
      float: right;
      pointer-events: none;
      margin-top: -0.25em;
      background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="32" height="32" viewBox="0 0 32 32"><path d="M16 0c-8.837 0-16 7.163-16 16s7.163 16 16 16 16-7.163 16-16-7.163-16-16-16zm6.906 8.875l2.219 2.031-12.063 13.281-6.188-6.188 2.125-2.125 3.938 3.938 9.969-10.938z" /></svg>'); }
  .block-list .with-dropdown {
    color: inherit; }
    .block-list .with-dropdown select {
      -webkit-appearance: none;
      -moz-appearance: none;
      outline: 0;
      background: 0;
      border: 0;
      height: auto;
      padding: 0.8rem 1rem;
      margin: 0;
      font-size: 1em;
      line-height: 1;
      color: inherit;
      background-color: transparent; }
  .block-list .switch {
    position: absolute;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%); }
  .block-list.with-icons li > a, .block-list.with-icons li > span, .block-list.with-icons li > label {
    padding-left: 2.8rem; }
  .block-list.with-icons li img, .block-list.with-icons li .iconic {
    position: absolute;
    top: 0.26rem;
    left: 0.26rem;
    width: 2.08rem;
    height: 2.08rem;
    border-radius: 8px;
    pointer-events: none; }
  .block-list header {
    margin-top: 1em;
    color: #666666;
    font-weight: bold;
    margin-bottom: 0.5em;
    margin-left: 1rem;
    font-size: 0.8em;
    cursor: default;
    text-transform: uppercase; }
  .block-list li {
    position: relative;
    border-bottom: 1px solid #d0d0d0; }
    .block-list li:first-child {
      border-top: 1px solid #d0d0d0; }
    .block-list li > a, .block-list li > span, .block-list li > label {
      display: block;
      padding: 0.8rem 1rem;
      padding-left: 1rem;
      color: #000;
      line-height: 1; }
    .block-list li > span {
      cursor: default; }
    .block-list li > a, .block-list li > label {
      cursor: pointer; }
      .block-list li > a:hover, .block-list li > label:hover {
        color: #000; }
    .block-list li > a:hover, .block-list li > label:hover, .block-list li select:hover {
      background: #f4f4f4; }
    .block-list li.caution > a, .block-list li.caution > a:hover {
      color: #F04124; }
    .block-list li.disabled > a {
      cursor: default; }
      .block-list li.disabled > a, .block-list li.disabled > a:hover {
        color: #999; }
      .block-list li.disabled > a:hover {
        background: transparent; }
    .block-list li.with-chevron::after {
      content: '\203A';
      display: block;
      position: absolute;
      right: 1rem;
      top: 50%;
      transform: translateY(-50%);
      font-weight: bold;
      color: #666666;
      font-size: 2em; }
    .block-list li.with-chevron .block-list-label {
      padding-right: 1.5rem; }
    .block-list li .block-list-label {
      display: inline-block;
      float: right;
      padding: 0;
      color: #999999;
      pointer-events: none; }
      .block-list li .block-list-label.left {
        margin-left: 0.8rem;
        float: none; }

.button, button, .button-group > li > a,
.button-group > li > label {
  display: inline-block;
  border: 0;
  text-align: center;
  line-height: 1;
  cursor: pointer;
  -webkit-appearance: none;
  -webkit-font-smoothing: antialiased;
  transition: background 0.25s ease-out;
  vertical-align: middle;
  padding: 0.85em 1em;
  margin: 0 1rem 1rem 0;
  font-weight: 0.9rem;
  border-radius: 0; }
  [data-popup-toggle].button, button[data-popup-toggle], .button-group > li > a[data-popup-toggle],
  .button-group > li > label[data-popup-toggle] {
    position: relative;
    padding-right: 2em; }
    [data-popup-toggle].button::after, button[data-popup-toggle]::after, .button-group > li > a[data-popup-toggle]::after,
    .button-group > li > label[data-popup-toggle]::after {
      content: "";
      display: block;
      width: 0;
      height: 0;
      border: inset 6px;
      border-color: black transparent transparent transparent;
      border-top-style: solid;
      position: absolute;
      right: 0.7em;
      top: 50%;
      margin-top: -3px; }

.button, button {
  font-size: 0.9rem;
  display: inline-block;
  margin: 0 1rem 1rem 0;
  background: #00558b;
  color: #fff; }
  .button .iconic, button .iconic {
    width: 1em;
    height: 1em;
    vertical-align: middle;
    margin-right: 0.25em;
    margin-top: -2px; }
  .button:hover, button:hover {
    background: #004876;
    color: #fff; }
  .button[data-popup-toggle]::after, button[data-popup-toggle]::after {
    border-top-color: #fff; }
  .button .iconic *, button .iconic * {
    fill: #fff;
    stroke: #fff; }
    .button .iconic *.iconic-property-accent, button .iconic *.iconic-property-accent {
      fill: #fff;
      stroke: #fff; }
  .button.tiny, button.tiny {
    font-size: 0.63rem; }
    .button.tiny .iconic, button.tiny .iconic {
      width: 1em;
      height: 1em;
      vertical-align: middle;
      margin-right: 0.25em;
      margin-top: -2px; }
  .button.small, button.small {
    font-size: 0.72rem; }
    .button.small .iconic, button.small .iconic {
      width: 1em;
      height: 1em;
      vertical-align: middle;
      margin-right: 0.25em;
      margin-top: -2px; }
  .button.large, button.large {
    font-size: 1.17rem; }
    .button.large .iconic, button.large .iconic {
      width: 1em;
      height: 1em;
      vertical-align: middle;
      margin-right: 0.25em;
      margin-top: -2px; }
  .button.expand, button.expand {
    display: block;
    margin-left: 0;
    margin-right: 0; }
  .button.secondary, button.secondary {
    background: #f1f1f1;
    color: #000; }
    .button.secondary:hover, button.secondary:hover {
      background: #cdcdcd;
      color: #000; }
    .button.secondary[data-popup-toggle]::after, button.secondary[data-popup-toggle]::after {
      border-top-color: #000; }
    .button.secondary .iconic *, button.secondary .iconic * {
      fill: #000;
      stroke: #000; }
      .button.secondary .iconic *.iconic-property-accent, button.secondary .iconic *.iconic-property-accent {
        fill: #000;
        stroke: #000; }
  .button.success, button.success {
    background: #43AC6A;
    color: #fff; }
    .button.success:hover, button.success:hover {
      background: #39925a;
      color: #fff; }
    .button.success[data-popup-toggle]::after, button.success[data-popup-toggle]::after {
      border-top-color: #fff; }
    .button.success .iconic *, button.success .iconic * {
      fill: #fff;
      stroke: #fff; }
      .button.success .iconic *.iconic-property-accent, button.success .iconic *.iconic-property-accent {
        fill: #fff;
        stroke: #fff; }
  .button.warning, button.warning {
    background: #F08A24;
    color: #fff; }
    .button.warning:hover, button.warning:hover {
      background: #dc750f;
      color: #fff; }
    .button.warning[data-popup-toggle]::after, button.warning[data-popup-toggle]::after {
      border-top-color: #fff; }
    .button.warning .iconic *, button.warning .iconic * {
      fill: #fff;
      stroke: #fff; }
      .button.warning .iconic *.iconic-property-accent, button.warning .iconic *.iconic-property-accent {
        fill: #fff;
        stroke: #fff; }
  .button.alert, button.alert {
    background: #F04124;
    color: #fff; }
    .button.alert:hover, button.alert:hover {
      background: #dc2c0f;
      color: #fff; }
    .button.alert[data-popup-toggle]::after, button.alert[data-popup-toggle]::after {
      border-top-color: #fff; }
    .button.alert .iconic *, button.alert .iconic * {
      fill: #fff;
      stroke: #fff; }
      .button.alert .iconic *.iconic-property-accent, button.alert .iconic *.iconic-property-accent {
        fill: #fff;
        stroke: #fff; }
  .button.hollow, button.hollow {
    border: 1px solid #00558b;
    background: transparent;
    color: #00558b; }
    .button.hollow:hover, button.hollow:hover {
      border-color: #008ee8;
      background: transparent;
      color: #008ee8; }
    .button.hollow[data-popup-toggle]::after, button.hollow[data-popup-toggle]::after {
      border-top-color: #00558b; }
    .button.hollow .iconic *, button.hollow .iconic * {
      fill: #00558b;
      stroke: #00558b; }
      .button.hollow .iconic *.iconic-property-accent, button.hollow .iconic *.iconic-property-accent {
        fill: #00558b;
        stroke: #00558b; }
    .button.hollow:hover .iconic *, button.hollow:hover .iconic * {
      fill: #008ee8;
      stroke: #008ee8; }
      .button.hollow:hover .iconic *.iconic-property-accent, button.hollow:hover .iconic *.iconic-property-accent {
        fill: #008ee8;
        stroke: #008ee8; }
    .button.hollow.secondary, button.hollow.secondary {
      border: 1px solid #f1f1f1;
      background: transparent;
      color: #f1f1f1; }
      .button.hollow.secondary:hover, button.hollow.secondary:hover {
        border-color: #f4f4f4;
        background: transparent;
        color: #f4f4f4; }
      .button.hollow.secondary[data-popup-toggle]::after, button.hollow.secondary[data-popup-toggle]::after {
        border-top-color: #f1f1f1; }
      .button.hollow.secondary .iconic *, button.hollow.secondary .iconic * {
        fill: #f1f1f1;
        stroke: #f1f1f1; }
        .button.hollow.secondary .iconic *.iconic-property-accent, button.hollow.secondary .iconic *.iconic-property-accent {
          fill: #f1f1f1;
          stroke: #f1f1f1; }
      .button.hollow.secondary:hover .iconic *, button.hollow.secondary:hover .iconic * {
        fill: #f4f4f4;
        stroke: #f4f4f4; }
        .button.hollow.secondary:hover .iconic *.iconic-property-accent, button.hollow.secondary:hover .iconic *.iconic-property-accent {
          fill: #f4f4f4;
          stroke: #f4f4f4; }
    .button.hollow.success, button.hollow.success {
      border: 1px solid #43AC6A;
      background: transparent;
      color: #43AC6A; }
      .button.hollow.success:hover, button.hollow.success:hover {
        border-color: #6dc68e;
        background: transparent;
        color: #6dc68e; }
      .button.hollow.success[data-popup-toggle]::after, button.hollow.success[data-popup-toggle]::after {
        border-top-color: #43AC6A; }
      .button.hollow.success .iconic *, button.hollow.success .iconic * {
        fill: #43AC6A;
        stroke: #43AC6A; }
        .button.hollow.success .iconic *.iconic-property-accent, button.hollow.success .iconic *.iconic-property-accent {
          fill: #43AC6A;
          stroke: #43AC6A; }
      .button.hollow.success:hover .iconic *, button.hollow.success:hover .iconic * {
        fill: #6dc68e;
        stroke: #6dc68e; }
        .button.hollow.success:hover .iconic *.iconic-property-accent, button.hollow.success:hover .iconic *.iconic-property-accent {
          fill: #6dc68e;
          stroke: #6dc68e; }
    .button.hollow.warning, button.hollow.warning {
      border: 1px solid #F08A24;
      background: transparent;
      color: #F08A24; }
      .button.hollow.warning:hover, button.hollow.warning:hover {
        border-color: #f4a75b;
        background: transparent;
        color: #f4a75b; }
      .button.hollow.warning[data-popup-toggle]::after, button.hollow.warning[data-popup-toggle]::after {
        border-top-color: #F08A24; }
      .button.hollow.warning .iconic *, button.hollow.warning .iconic * {
        fill: #F08A24;
        stroke: #F08A24; }
        .button.hollow.warning .iconic *.iconic-property-accent, button.hollow.warning .iconic *.iconic-property-accent {
          fill: #F08A24;
          stroke: #F08A24; }
      .button.hollow.warning:hover .iconic *, button.hollow.warning:hover .iconic * {
        fill: #f4a75b;
        stroke: #f4a75b; }
        .button.hollow.warning:hover .iconic *.iconic-property-accent, button.hollow.warning:hover .iconic *.iconic-property-accent {
          fill: #f4a75b;
          stroke: #f4a75b; }
    .button.hollow.alert, button.hollow.alert {
      border: 1px solid #F04124;
      background: transparent;
      color: #F04124; }
      .button.hollow.alert:hover, button.hollow.alert:hover {
        border-color: #f4715b;
        background: transparent;
        color: #f4715b; }
      .button.hollow.alert[data-popup-toggle]::after, button.hollow.alert[data-popup-toggle]::after {
        border-top-color: #F04124; }
      .button.hollow.alert .iconic *, button.hollow.alert .iconic * {
        fill: #F04124;
        stroke: #F04124; }
        .button.hollow.alert .iconic *.iconic-property-accent, button.hollow.alert .iconic *.iconic-property-accent {
          fill: #F04124;
          stroke: #F04124; }
      .button.hollow.alert:hover .iconic *, button.hollow.alert:hover .iconic * {
        fill: #f4715b;
        stroke: #f4715b; }
        .button.hollow.alert:hover .iconic *.iconic-property-accent, button.hollow.alert:hover .iconic *.iconic-property-accent {
          fill: #f4715b;
          stroke: #f4715b; }
  .button.disabled, button.disabled {
    opacity: 0.8;
    pointer-events: none; }
    .button.disabled.secondary, button.disabled.secondary {
      opacity: 0.8;
      pointer-events: none; }
    .button.disabled.success, button.disabled.success {
      opacity: 0.8;
      pointer-events: none; }
    .button.disabled.warning, button.disabled.warning {
      opacity: 0.8;
      pointer-events: none; }
    .button.disabled.alert, button.disabled.alert {
      opacity: 0.8;
      pointer-events: none; }

.button-group {
  margin: 0;
  margin-bottom: 1rem;
  list-style-type: none;
  display: inline-flex;
  border-radius: 0;
  overflow: hidden; }
  .button-group > li {
    flex: 0 0 auto; }
    .button-group > li > a,
    .button-group > li > label {
      border-radius: 0;
      display: block;
      margin: 0; }
    .button-group > li:not(:last-child) > a, .button-group > li:not(:last-child) > label {
      border-right: 1px solid #004068; }
  .button-group .iconic {
    width: 1em;
    height: 1em;
    vertical-align: middle;
    margin-right: 0.25em;
    margin-top: -2px; }

.button-group.segmented, .button-group.segmented.secondary, .button-group.segmented.success, .button-group.segmented.warning, .button-group.segmented.alert {
  border: 1px solid #00558b;
  transition-property: background color; }
  .button-group.segmented > li > input[type="radio"] {
    position: absolute;
    left: -9999px; }
  .button-group.segmented > li > a, .button-group.segmented.secondary > li > a, .button-group.segmented.success > li > a, .button-group.segmented.warning > li > a, .button-group.segmented.alert > li > a,
  .button-group.segmented > li > label,
  .button-group.segmented.secondary > li > label,
  .button-group.segmented.success > li > label,
  .button-group.segmented.warning > li > label,
  .button-group.segmented.alert > li > label {
    border: 0;
    margin-right: 0;
    background: transparent; }

.button-group {
  display: inline-flex;
  border-radius: 0; }
  .button-group > li {
    flex: 0 0 auto; }
  .button-group > li > a, .button-group > li > label {
    background: #00558b;
    color: #fff;
    border-color: #004876; }
    .button-group > li > a:hover, .button-group > li > label:hover {
      background: #004876;
      color: #fff; }
    .button-group > li > a[data-popup-toggle]::after, .button-group > li > label[data-popup-toggle]::after {
      border-top-color: #fff; }
    .button-group > li > a .iconic *, .button-group > li > label .iconic * {
      fill: #fff;
      stroke: #fff; }
      .button-group > li > a .iconic *.iconic-property-accent, .button-group > li > label .iconic *.iconic-property-accent {
        fill: #fff;
        stroke: #fff; }
  .button-group > li.is-active > a, .button-group > li.is-active > label {
    background: #004876; }
  .button-group.secondary > li > a, .button-group.secondary > li > label {
    background: #f1f1f1;
    color: #fff;
    border-color: #cdcdcd; }
    .button-group.secondary > li > a:hover, .button-group.secondary > li > label:hover {
      background: #cdcdcd;
      color: #fff; }
    .button-group.secondary > li > a[data-popup-toggle]::after, .button-group.secondary > li > label[data-popup-toggle]::after {
      border-top-color: #fff; }
    .button-group.secondary > li > a .iconic *, .button-group.secondary > li > label .iconic * {
      fill: #fff;
      stroke: #fff; }
      .button-group.secondary > li > a .iconic *.iconic-property-accent, .button-group.secondary > li > label .iconic *.iconic-property-accent {
        fill: #fff;
        stroke: #fff; }
  .button-group.secondary > li.is-active > a, .button-group.secondary > li.is-active > label {
    background: #cdcdcd; }
  .button-group.success > li > a, .button-group.success > li > label {
    background: #43AC6A;
    color: #fff;
    border-color: #39925a; }
    .button-group.success > li > a:hover, .button-group.success > li > label:hover {
      background: #39925a;
      color: #fff; }
    .button-group.success > li > a[data-popup-toggle]::after, .button-group.success > li > label[data-popup-toggle]::after {
      border-top-color: #fff; }
    .button-group.success > li > a .iconic *, .button-group.success > li > label .iconic * {
      fill: #fff;
      stroke: #fff; }
      .button-group.success > li > a .iconic *.iconic-property-accent, .button-group.success > li > label .iconic *.iconic-property-accent {
        fill: #fff;
        stroke: #fff; }
  .button-group.success > li.is-active > a, .button-group.success > li.is-active > label {
    background: #39925a; }
  .button-group.warning > li > a, .button-group.warning > li > label {
    background: #F08A24;
    color: #fff;
    border-color: #dc750f; }
    .button-group.warning > li > a:hover, .button-group.warning > li > label:hover {
      background: #dc750f;
      color: #fff; }
    .button-group.warning > li > a[data-popup-toggle]::after, .button-group.warning > li > label[data-popup-toggle]::after {
      border-top-color: #fff; }
    .button-group.warning > li > a .iconic *, .button-group.warning > li > label .iconic * {
      fill: #fff;
      stroke: #fff; }
      .button-group.warning > li > a .iconic *.iconic-property-accent, .button-group.warning > li > label .iconic *.iconic-property-accent {
        fill: #fff;
        stroke: #fff; }
  .button-group.warning > li.is-active > a, .button-group.warning > li.is-active > label {
    background: #dc750f; }
  .button-group.alert > li > a, .button-group.alert > li > label {
    background: #F04124;
    color: #fff;
    border-color: #dc2c0f; }
    .button-group.alert > li > a:hover, .button-group.alert > li > label:hover {
      background: #dc2c0f;
      color: #fff; }
    .button-group.alert > li > a[data-popup-toggle]::after, .button-group.alert > li > label[data-popup-toggle]::after {
      border-top-color: #fff; }
    .button-group.alert > li > a .iconic *, .button-group.alert > li > label .iconic * {
      fill: #fff;
      stroke: #fff; }
      .button-group.alert > li > a .iconic *.iconic-property-accent, .button-group.alert > li > label .iconic *.iconic-property-accent {
        fill: #fff;
        stroke: #fff; }
  .button-group.alert > li.is-active > a, .button-group.alert > li.is-active > label {
    background: #dc2c0f; }
  .button-group > li.secondary > a {
    background: #f1f1f1;
    color: #000;
    border-color: #f1f1f1; }
    .button-group > li.secondary > a:hover {
      background: #cdcdcd;
      color: #000; }
    .button-group > li.secondary > a[data-popup-toggle]::after {
      border-top-color: #000; }
    .button-group > li.secondary > a:hover {
      border-color: #b5b5b5; }
    .button-group > li.secondary > a .iconic * {
      fill: #000;
      stroke: #000; }
      .button-group > li.secondary > a .iconic *.iconic-property-accent {
        fill: #000;
        stroke: #000; }
  .button-group > li.success > a {
    background: #43AC6A;
    color: #fff;
    border-color: #43AC6A; }
    .button-group > li.success > a:hover {
      background: #39925a;
      color: #fff; }
    .button-group > li.success > a[data-popup-toggle]::after {
      border-top-color: #fff; }
    .button-group > li.success > a:hover {
      border-color: #32814f; }
    .button-group > li.success > a .iconic * {
      fill: #fff;
      stroke: #fff; }
      .button-group > li.success > a .iconic *.iconic-property-accent {
        fill: #fff;
        stroke: #fff; }
  .button-group > li.warning > a {
    background: #F08A24;
    color: #fff;
    border-color: #F08A24; }
    .button-group > li.warning > a:hover {
      background: #dc750f;
      color: #fff; }
    .button-group > li.warning > a[data-popup-toggle]::after {
      border-top-color: #fff; }
    .button-group > li.warning > a:hover {
      border-color: #c2670d; }
    .button-group > li.warning > a .iconic * {
      fill: #fff;
      stroke: #fff; }
      .button-group > li.warning > a .iconic *.iconic-property-accent {
        fill: #fff;
        stroke: #fff; }
  .button-group > li.alert > a {
    background: #F04124;
    color: #fff;
    border-color: #F04124; }
    .button-group > li.alert > a:hover {
      background: #dc2c0f;
      color: #fff; }
    .button-group > li.alert > a[data-popup-toggle]::after {
      border-top-color: #fff; }
    .button-group > li.alert > a:hover {
      border-color: #c2270d; }
    .button-group > li.alert > a .iconic * {
      fill: #fff;
      stroke: #fff; }
      .button-group > li.alert > a .iconic *.iconic-property-accent {
        fill: #fff;
        stroke: #fff; }
  .button-group.segmented {
    border-color: #00558b; }
    .button-group.segmented > li > a, .button-group.segmented > li > label {
      border-color: #00558b;
      color: #00558b; }
      .button-group.segmented > li > a:hover, .button-group.segmented > li > label:hover {
        background: rgba(0, 85, 139, 0.25);
        color: #00558b; }
      .button-group.segmented > li > a .iconic *, .button-group.segmented > li > label .iconic * {
        fill: #00558b;
        stroke: #00558b; }
        .button-group.segmented > li > a .iconic *.iconic-property-accent, .button-group.segmented > li > label .iconic *.iconic-property-accent {
          fill: #00558b;
          stroke: #00558b; }
    .button-group.segmented > li.is-active > a, .button-group.segmented > li.is-active > a:hover,
    .button-group.segmented > li > input:checked + label,
    .button-group.segmented > li > input:checked + label:hover {
      background: #00558b;
      color: #fff; }
    .button-group.segmented > li.is-active > a .iconic *,
    .button-group.segmented > li > input:checked + label .iconic * {
      fill: #fff;
      stroke: #fff; }
      .button-group.segmented > li.is-active > a .iconic *.iconic-property-accent,
      .button-group.segmented > li > input:checked + label .iconic *.iconic-property-accent {
        fill: #fff;
        stroke: #fff; }
    .button-group.segmented.secondary {
      border-color: #f1f1f1; }
      .button-group.segmented.secondary > li > a, .button-group.segmented.secondary > li > label {
        border-color: #f1f1f1;
        color: #f1f1f1; }
        .button-group.segmented.secondary > li > a:hover, .button-group.segmented.secondary > li > label:hover {
          background: rgba(241, 241, 241, 0.25);
          color: #f1f1f1; }
        .button-group.segmented.secondary > li > a .iconic *, .button-group.segmented.secondary > li > label .iconic * {
          fill: #f1f1f1;
          stroke: #f1f1f1; }
          .button-group.segmented.secondary > li > a .iconic *.iconic-property-accent, .button-group.segmented.secondary > li > label .iconic *.iconic-property-accent {
            fill: #f1f1f1;
            stroke: #f1f1f1; }
      .button-group.segmented.secondary > li.is-active > a, .button-group.segmented.secondary > li.is-active > a:hover,
      .button-group.segmented.secondary > li > input:checked + label,
      .button-group.segmented.secondary > li > input:checked + label:hover {
        background: #f1f1f1;
        color: #000; }
      .button-group.segmented.secondary > li.is-active > a .iconic *,
      .button-group.segmented.secondary > li > input:checked + label .iconic * {
        fill: #000;
        stroke: #000; }
        .button-group.segmented.secondary > li.is-active > a .iconic *.iconic-property-accent,
        .button-group.segmented.secondary > li > input:checked + label .iconic *.iconic-property-accent {
          fill: #000;
          stroke: #000; }
    .button-group.segmented.success {
      border-color: #43AC6A; }
      .button-group.segmented.success > li > a, .button-group.segmented.success > li > label {
        border-color: #43AC6A;
        color: #43AC6A; }
        .button-group.segmented.success > li > a:hover, .button-group.segmented.success > li > label:hover {
          background: rgba(67, 172, 106, 0.25);
          color: #43AC6A; }
        .button-group.segmented.success > li > a .iconic *, .button-group.segmented.success > li > label .iconic * {
          fill: #43AC6A;
          stroke: #43AC6A; }
          .button-group.segmented.success > li > a .iconic *.iconic-property-accent, .button-group.segmented.success > li > label .iconic *.iconic-property-accent {
            fill: #43AC6A;
            stroke: #43AC6A; }
      .button-group.segmented.success > li.is-active > a, .button-group.segmented.success > li.is-active > a:hover,
      .button-group.segmented.success > li > input:checked + label,
      .button-group.segmented.success > li > input:checked + label:hover {
        background: #43AC6A;
        color: #fff; }
      .button-group.segmented.success > li.is-active > a .iconic *,
      .button-group.segmented.success > li > input:checked + label .iconic * {
        fill: #fff;
        stroke: #fff; }
        .button-group.segmented.success > li.is-active > a .iconic *.iconic-property-accent,
        .button-group.segmented.success > li > input:checked + label .iconic *.iconic-property-accent {
          fill: #fff;
          stroke: #fff; }
    .button-group.segmented.warning {
      border-color: #F08A24; }
      .button-group.segmented.warning > li > a, .button-group.segmented.warning > li > label {
        border-color: #F08A24;
        color: #F08A24; }
        .button-group.segmented.warning > li > a:hover, .button-group.segmented.warning > li > label:hover {
          background: rgba(240, 138, 36, 0.25);
          color: #F08A24; }
        .button-group.segmented.warning > li > a .iconic *, .button-group.segmented.warning > li > label .iconic * {
          fill: #F08A24;
          stroke: #F08A24; }
          .button-group.segmented.warning > li > a .iconic *.iconic-property-accent, .button-group.segmented.warning > li > label .iconic *.iconic-property-accent {
            fill: #F08A24;
            stroke: #F08A24; }
      .button-group.segmented.warning > li.is-active > a, .button-group.segmented.warning > li.is-active > a:hover,
      .button-group.segmented.warning > li > input:checked + label,
      .button-group.segmented.warning > li > input:checked + label:hover {
        background: #F08A24;
        color: #fff; }
      .button-group.segmented.warning > li.is-active > a .iconic *,
      .button-group.segmented.warning > li > input:checked + label .iconic * {
        fill: #fff;
        stroke: #fff; }
        .button-group.segmented.warning > li.is-active > a .iconic *.iconic-property-accent,
        .button-group.segmented.warning > li > input:checked + label .iconic *.iconic-property-accent {
          fill: #fff;
          stroke: #fff; }
    .button-group.segmented.alert {
      border-color: #F04124; }
      .button-group.segmented.alert > li > a, .button-group.segmented.alert > li > label {
        border-color: #F04124;
        color: #F04124; }
        .button-group.segmented.alert > li > a:hover, .button-group.segmented.alert > li > label:hover {
          background: rgba(240, 65, 36, 0.25);
          color: #F04124; }
        .button-group.segmented.alert > li > a .iconic *, .button-group.segmented.alert > li > label .iconic * {
          fill: #F04124;
          stroke: #F04124; }
          .button-group.segmented.alert > li > a .iconic *.iconic-property-accent, .button-group.segmented.alert > li > label .iconic *.iconic-property-accent {
            fill: #F04124;
            stroke: #F04124; }
      .button-group.segmented.alert > li.is-active > a, .button-group.segmented.alert > li.is-active > a:hover,
      .button-group.segmented.alert > li > input:checked + label,
      .button-group.segmented.alert > li > input:checked + label:hover {
        background: #F04124;
        color: #fff; }
      .button-group.segmented.alert > li.is-active > a .iconic *,
      .button-group.segmented.alert > li > input:checked + label .iconic * {
        fill: #fff;
        stroke: #fff; }
        .button-group.segmented.alert > li.is-active > a .iconic *.iconic-property-accent,
        .button-group.segmented.alert > li > input:checked + label .iconic *.iconic-property-accent {
          fill: #fff;
          stroke: #fff; }
  .button-group.tiny {
    font-size: 0.63rem; }
  .button-group.small {
    font-size: 0.72rem; }
  .button-group.large {
    font-size: 1.17rem; }
  .button-group.expand {
    display: flex; }
    .button-group.expand > li {
      flex: 1; }
      .button-group.expand > li > a, .button-group.expand > li > label {
        display: block;
        margin-left: 0;
        margin-right: 0; }

/*
  Cards

  Structure:

  titles
  lists
*/
.card {
  border: 1px solid #ededed;
  margin-bottom: 0.5rem;
  background: #fff;
  color: #000;
  border-radius: 4px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  overflow: hidden; }
  .card h1, .card h2, .card h3, .card h4, .card h5, .card h6 {
    color: inherit; }
  .card ul {
    margin-bottom: 0; }
  .card.primary {
    border: 0;
    margin-bottom: 0.5rem;
    background: #00558b;
    color: #fff;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    overflow: hidden; }
    .card.primary h1, .card.primary h2, .card.primary h3, .card.primary h4, .card.primary h5, .card.primary h6 {
      color: inherit; }
    .card.primary ul {
      margin-bottom: 0; }
    .card.primary .card-divider {
      background: #0065a5;
      padding: 1rem; }
  .card.success {
    border: 0;
    margin-bottom: 0.5rem;
    background: #43AC6A;
    color: #fff;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    overflow: hidden; }
    .card.success h1, .card.success h2, .card.success h3, .card.success h4, .card.success h5, .card.success h6 {
      color: inherit; }
    .card.success ul {
      margin-bottom: 0; }
    .card.success .card-divider {
      background: #4ab873;
      padding: 1rem; }
  .card.warning {
    border: 0;
    margin-bottom: 0.5rem;
    background: #F08A24;
    color: #fff;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    overflow: hidden; }
    .card.warning h1, .card.warning h2, .card.warning h3, .card.warning h4, .card.warning h5, .card.warning h6 {
      color: inherit; }
    .card.warning ul {
      margin-bottom: 0; }
    .card.warning .card-divider {
      background: #f19233;
      padding: 1rem; }
  .card.alert {
    border: 0;
    margin-bottom: 0.5rem;
    background: #F04124;
    color: #fff;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    overflow: hidden; }
    .card.alert h1, .card.alert h2, .card.alert h3, .card.alert h4, .card.alert h5, .card.alert h6 {
      color: inherit; }
    .card.alert ul {
      margin-bottom: 0; }
    .card.alert .card-divider {
      background: #f14e33;
      padding: 1rem; }
  .card.dark {
    border: 0;
    margin-bottom: 0.5rem;
    background: #232323;
    color: #fff;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    overflow: hidden; }
    .card.dark h1, .card.dark h2, .card.dark h3, .card.dark h4, .card.dark h5, .card.dark h6 {
      color: inherit; }
    .card.dark ul {
      margin-bottom: 0; }
    .card.dark .card-divider {
      background: #323232;
      padding: 1rem; }

.card-divider {
  background: #ededed;
  padding: 1rem; }

.card-section {
  padding: 1rem; }

/*
  Odds and ends.
*/
.close-button {
  position: absolute;
  color: #999;
  top: 1rem;
  right: 1rem;
  font-size: 2em;
  line-height: 0.5;
  cursor: pointer; }
  .close-button:hover {
    color: #333; }

.thumbnail, ul.thumbnails > li img {
  padding: 0.5rem;
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.25); }

/*
  FORMS
  -----

  Our form styles include basic resets for text fields, select menus, and so on, along with some of our own custom components.

  Includes:
   - Text fields
   - Text areas
   - Select menus
   - Checkboxes and radio buttons
   - Range slider
   - Progress bars and meters
*/
[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], textarea {
  display: block;
  width: 100%;
  padding: 0.5rem;
  margin: 0 0 1rem 0;
  border: 1px solid #ccc;
  background: #fff;
  color: #000;
  font-size: 1rem;
  line-height: 1;
  -webkit-font-smoothing: antialiased; }
  [type="text"]:hover, input[type="password"]:hover, input[type="date"]:hover, input[type="datetime"]:hover, input[type="datetime-local"]:hover, input[type="month"]:hover, input[type="week"]:hover, input[type="email"]:hover, input[type="number"]:hover, input[type="search"]:hover, input[type="tel"]:hover, input[type="time"]:hover, input[type="url"]:hover, input[type="color"]:hover, textarea:hover {
    border: 1px solid #bbb;
    background: #fff;
    color: #000; }
  [type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, input[type="color"]:focus, textarea:focus {
    outline: 0;
    border: 1px solid #999;
    background: #fff;
    color: #000; }
  label > [type="text"], label > input[type="password"], label > input[type="date"], label > input[type="datetime"], label > input[type="datetime-local"], label > input[type="month"], label > input[type="week"], label > input[type="email"], label > input[type="number"], label > input[type="search"], label > input[type="tel"], label > input[type="time"], label > input[type="url"], label > input[type="color"], label > textarea {
    margin-top: 0.5rem; }

label {
  display: block;
  font-size: 0.9rem;
  margin-bottom: 0.5rem;
  color: #333; }
  label > input, label > textarea {
    margin-top: 0.5rem; }

.inline-label {
  display: flex;
  flex-flow: row nowrap;
  align-items: stretch;
  margin-bottom: 1rem; }
  label > .inline-label {
    margin-top: 0.5rem; }
  .inline-label > input, .inline-label > select {
    flex: 1;
    margin: 0; }
  .inline-label > .form-label {
    flex: 0 0 auto;
    background: #eee;
    color: #333;
    border: 1px solid #ccc;
    padding: 0 0.5rem;
    display: flex;
    align-items: center; }
    .inline-label > .form-label:first-child {
      border-right: 0; }
    .inline-label > .form-label:last-child {
      border-left: 0; }
  .inline-label > a {
    display: flex;
    align-items: center;
    padding-top: 0;
    padding-bottom: 0;
    margin: 0;
    border-radius: 0; }

textarea {
  height: auto;
  width: 100%;
  min-height: 50px; }

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  display: block;
  width: 100%;
  padding: 0.5rem;
  margin: 0 0 1rem 0;
  font-size: 1rem;
  color: #000;
  border-radius: 0;
  background: #fafafa url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="32" height="24" viewBox="0 0 32 24"><polygon points="0,0 32,0 16,24" style="fill: #000"></polygon></svg>') right 10px center no-repeat;
  background-size: 8px 8px; }
  select:hover {
    background-color: #f0f0f0; }
  select:focus {
    outline: 0; }

input[type="range"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  display: block;
  width: 100%;
  height: 1rem;
  background: #ddd;
  cursor: pointer;
  overflow: visible;
  margin-top: 0.25rem;
  margin-bottom: 0.25rem; }
  input[type="range"]:focus {
    outline: 0; }
  input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    background: #00558b;
    width: 1.5rem;
    height: 1.5rem; }
  input[type="range"]::-moz-range-track {
    -moz-appearance: none;
    max-width: 300px;
    height: 4px;
    background: #ccc;
    cursor: pointer; }
  input[type="range"]::-moz-range-thumb {
    -moz-appearance: none;
    background: #00558b;
    width: 1.5rem;
    height: 1.5rem; }
  input[type="range"]::-ms-track {
    max-width: 300px;
    height: 4px;
    background: #ccc;
    cursor: pointer; }
  input[type="range"]::-ms-thumb {
    background: #00558b;
    width: 1.5rem;
    height: 1.5rem; }

output {
  line-height: 1.5rem;
  vertical-align: middle;
  margin-left: 0.5em; }

input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  background: #00558b; }

progress, meter {
  -webkit-appearance: none;
  -moz-appearance: none;
  display: block;
  width: 100%;
  height: 1.5rem;
  margin-bottom: 1rem;
  background: #ccc;
  border: 0; }

progress::-webkit-progress-bar {
  background: #ccc; }
progress::-webkit-progress-value {
  background: #00558b; }
progress::-moz-progress-bar {
  background: #00558b; }
progress.high::-webkit-progress-value {
  background: #43AC6A; }
progress.high::-moz-progress-bar {
  background: #43AC6A; }
progress.medium::-webkit-progress-value {
  background: #e7cf00; }
progress.medium::-moz-progress-bar {
  background: #e7cf00; }
progress.low::-webkit-progress-value {
  background: #F04124; }
progress.low::-moz-progress-bar {
  background: #F04124; }

meter {
  background: #ccc; }
  meter::-webkit-meter-bar {
    background: #ccc; }
  meter::-webkit-meter-optimum-value {
    background: #43AC6A; }
  meter::-webkit-meter-suboptimum-value {
    background: #e7cf00; }
  meter::-webkit-meter-even-less-good-value {
    background: #F04124; }
  meter::-moz-meter-bar {
    background: #00558b; }
  meter:-moz-meter-optimum::-moz-meter-bar {
    background: #43AC6A; }
  meter:-moz-meter-sub-optimum::-moz-meter-bar {
    background: #e7cf00; }
  meter:-moz-meter-sub-sub-optimum::-moz-meter-bar {
    background: #F04124; }

/*
  PANEL
  -----

  The friendly panel is an all-purpose container for hiding content off-screen.

  Features:
   - Position at top, right, bottom, or left
   - Anchor to grid block or window
   - Define max width or height
   - Transform into grid block depending on screen size
*/
.panel {
  display: block;
  position: absolute;
  z-index: 100;
  overflow-y: auto;
  display: none; }
  .is-active.panel {
    display: block; }

.panel {
  /*
    Basic styles
  */
  padding: 0;
  background: #fff; }

.panel-top {
  /*
    Direction
  */
  top: 0;
  left: 0;
  width: 100%;
  /*
    Sizing
  */
  height: 300px;
  /*
    Shadows
  */ }
  .panel-top.is-active {
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.25); }

.panel-right {
  /*
    Direction
  */
  top: 0;
  right: 0;
  height: 100%;
  /*
    Sizing
  */
  width: 100%;
  /*
    Shadows
  */ }
  @media only screen and (min-width: 18.75em) {
    .panel-right {
      width: 300px; } }
  .panel-right.is-active {
    box-shadow: -3px 0 10px rgba(0, 0, 0, 0.25); }

.panel-bottom {
  /*
    Direction
  */
  bottom: 0;
  left: 0;
  width: 100%;
  /*
    Sizing
  */
  height: 300px;
  /*
    Shadows
  */ }
  .panel-bottom.is-active {
    box-shadow: -3px 10px rgba(0, 0, 0, 0.25); }

.panel-left {
  /*
    Direction
  */
  top: 0;
  left: 0;
  height: 100%;
  /*
    Sizing
  */
  width: 100%;
  /*
    Shadows
  */ }
  @media only screen and (min-width: 18.75em) {
    .panel-left {
      width: 300px; } }
  .panel-left.is-active {
    box-shadow: 3px 0 10px rgba(0, 0, 0, 0.25); }

.panel-fixed {
  position: fixed; }

/*
	THE GRID
  --------

  Foundation's magical, flexbox-powered grid.

  Features:
   - Horizontal or vertical grids
   - Auto-sizing or percentage width grid blocks
   - Independently-scrollable blocks
   - Column alignment
   - Source ordering
   - Offsets
*/
/*
  Define the size of a grid block. Blocks are flex items. By default, they stretch to fill all available space, based on the size of sibling blocks. This is the "expand" behavior.

  If set to "shrink", the block will contract and only fill as much space as it needs for its content.

  If set to a number, the block will be given a percentage width, based on the total number of columns (12 by default). Percentage widths don't work if a block is inside a vertical grid.

  @group grid

  @param {number|string} $size - Sizing behavior of the block. Should be expand, shrink, or a number.

  @output The flex-basis, flex-grow, and flex-shrink properties.
*/
/*
  Set the orientation of blocks within this block. The grid is re-oriented by changing the flex direction of the block.

  @group grid

  @param {string} $direction - Direction of the grid, either horizontal or vertical.

  @output A flex-flow property to match the direction given.
*/
/*
  Stretch a grid's child blocks across its cross-axis, making every column appear to have the same height.

  @group grid

  @param {bool} $stretch - Stretch blocks if true, or align blocks to top if false.

  @output Sets align-items to "stretch" if $stretch is true, or "flex-start" (the default value) if false.
*/
/*
  Set the alignment of blocks within a grid.

  left: Items align to the left.
  right: Items align to the right.
  center: Items align to the center.
  justify: Items are spaced equally apart so they occupy the space of the entire grid.
  spaced: Items are given equal space to their left and right.

  @group grid

  @param {string} $align - Alignment to use.

  @output An appropriate justify-content value.
*/
/*
  Set the source order of a block. Items with lower numbers appear first. If multiple items have the same number, the one in the HTML first will appear first.

  @group grid

  @param {number} $order - Position in source order.

  @output An order property.
*/
/*
  Collapse a content block by removing the padding.

  @group grid

  @param {bool} $collapse - Collapses the block if true.

  @output A padding value.

  @todo No way to reverse collapse using this mixin. Solution:
    - If true, add padding: 0;
    - If false, add padding: 1rem;
    - If null, add nothing, to cut down on CSS output
    - Make null the default value
*/
/*
  Constrain the size of a block to the size of the average grid row, and center-align it. This imitates the behavior of ordinary Foundation rows.

  @group grid

  @param {bool} $container - Adds container styles if true.

  @output A maximum width and the good old margin: 0 auto for center alignment.
*/
/*
  Add negative margins to a block, equal to the padding of a content block. This aligns the edges of a block nested inside a content block.

  @group grid

  @param {bool} $nest - Adds negative margins if true.

  @output Negative margin values.
*/
/*
  Offset a block by adding a left margin.

  @group grid

  @param {number | bool} $offset - If false, nothing is output. If a number, offsets the column by the specified number of columns.

  @output A left margin based on the number of columns specified, and the global number of columns.
*/
/*
  Resets styles set by panels. Use this when a panel transforms into a block on larger screens.

  @group grid

  @output Resets to transform, position, and a few visual styles.
*/
/*
	Frames are containers that stretch to the full dimmensions of the browser window.
*/
/*
	Groups are collections of content items. They're the "rows" of Foundation for Apps.
*/
/*
	Blocks are containers for actual content. They're the "columns" of Foundation for Apps.
*/
/*
	CSS Output
*/
/*
  Shared styles for frames and blocks (parent elements)
*/
.grid-frame, .grid-block, .small-grid-block, .medium-grid-block, .large-grid-block {
  backface-visibility: hidden; }
  .vertical.grid-frame, .vertical.grid-block, .vertical.small-grid-block, .vertical.medium-grid-block, .vertical.large-grid-block {
    flex-flow: column nowrap;
    align-items: stretch; }
  .small-vertical.grid-frame, .small-vertical.grid-block, .small-vertical.small-grid-block, .small-vertical.medium-grid-block, .small-vertical.large-grid-block {
    flex-flow: column nowrap;
    align-items: stretch; }
  .small-horizontal.grid-frame, .small-horizontal.grid-block, .small-horizontal.small-grid-block, .small-horizontal.medium-grid-block, .small-horizontal.large-grid-block {
    flex-flow: row wrap; }
  @media only screen and (min-width: 40em) {
    .medium-vertical.grid-frame, .medium-vertical.grid-block, .medium-vertical.small-grid-block, .medium-vertical.medium-grid-block, .medium-vertical.large-grid-block {
      flex-flow: column nowrap;
      align-items: stretch; }
    .medium-horizontal.grid-frame, .medium-horizontal.grid-block, .medium-horizontal.small-grid-block, .medium-horizontal.medium-grid-block, .medium-horizontal.large-grid-block {
      flex-flow: row wrap; } }
  @media only screen and (min-width: 75em) {
    .large-vertical.grid-frame, .large-vertical.grid-block, .large-vertical.small-grid-block, .large-vertical.medium-grid-block, .large-vertical.large-grid-block {
      flex-flow: column nowrap;
      align-items: stretch; }
    .large-horizontal.grid-frame, .large-horizontal.grid-block, .large-horizontal.small-grid-block, .large-horizontal.medium-grid-block, .large-horizontal.large-grid-block {
      flex-flow: row wrap; } }
  .align-right.grid-frame, .align-right.grid-block, .align-right.small-grid-block, .align-right.medium-grid-block, .align-right.large-grid-block {
    justify-content: flex-end; }
  .align-center.grid-frame, .align-center.grid-block, .align-center.small-grid-block, .align-center.medium-grid-block, .align-center.large-grid-block {
    justify-content: center; }
  .align-justify.grid-frame, .align-justify.grid-block, .align-justify.small-grid-block, .align-justify.medium-grid-block, .align-justify.large-grid-block {
    justify-content: space-between; }
  .align-spaced.grid-frame, .align-spaced.grid-block, .align-spaced.small-grid-block, .align-spaced.medium-grid-block, .align-spaced.large-grid-block {
    justify-content: space-around; }
  .wrap.grid-frame, .wrap.grid-block, .wrap.small-grid-block, .wrap.medium-grid-block, .wrap.large-grid-block {
    flex-wrap: wrap;
    align-items: flex-start; }

/*
  Shared styles for blocks and content blocks (child elements)
*/
.shrink.grid-block, .shrink.grid-content, .shrink.small-grid-block, .shrink.small-grid-content, .shrink.medium-grid-block, .shrink.medium-grid-content, .shrink.large-grid-block, .shrink.large-grid-content {
  flex: 0 0 auto; }

/*
  The core grid elements:
   - Frame
   - Block
   - Content block
   - Container
*/
.grid-frame {
  display: flex;
  height: 100vh;
  position: relative;
  overflow: hidden;
  flex: 1 1;
  flex-flow: row wrap;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: flex-start;
  order: 0; }

.grid-block {
  display: flex;
  height: 100vh;
  position: relative;
  overflow: hidden;
  flex: 1 1;
  flex-flow: row wrap;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: flex-start;
  order: 0;
  height: auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar; }
  .grid-content .grid-block {
    margin-left: -1rem;
    margin-right: -1rem; }

.grid-content {
  display: block;
  padding: 0 1rem;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  flex: 1 1; }
  .grid-content.collapse {
    padding: 0; }

.grid-container {
  max-width: 56.25rem;
  margin: 0 auto; }
  .grid-container.contain-left {
    max-width: 56.25rem;
    margin: 0 auto 0 0; }
  .grid-container.contain-right {
    max-width: 56.25rem;
    margin: 0 0 0 auto; }

/*
  Breakpoint classes for blocks
*/
.small-grid-block {
  display: flex;
  height: 100vh;
  position: relative;
  overflow: hidden;
  flex: 1 1;
  flex-flow: row wrap;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: flex-start;
  order: 0;
  height: auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar; }
  .small-grid-block.panel {
    transform: none;
    position: relative;
    width: auto;
    height: auto;
    z-index: auto;
    box-shadow: none;
    background: transparent;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto; }

.small-grid-content {
  display: block;
  padding: 0 1rem;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  flex: 1 1; }
  .small-grid-content.panel {
    transform: none;
    position: relative;
    width: auto;
    height: auto;
    z-index: auto;
    box-shadow: none;
    background: transparent;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto; }

@media only screen and (min-width: 40em) {
  .medium-grid-block {
    display: flex;
    height: 100vh;
    position: relative;
    overflow: hidden;
    flex: 1 1;
    flex-flow: row wrap;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: flex-start;
    order: 0;
    height: auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar; }
    .medium-grid-block.panel {
      transform: none;
      position: relative;
      width: auto;
      height: auto;
      z-index: auto;
      box-shadow: none;
      background: transparent;
      top: auto;
      right: auto;
      bottom: auto;
      left: auto; } }

@media only screen and (min-width: 40em) {
  .medium-grid-content {
    display: block;
    padding: 0 1rem;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    flex: 1 1; }
    .medium-grid-content.panel {
      transform: none;
      position: relative;
      width: auto;
      height: auto;
      z-index: auto;
      box-shadow: none;
      background: transparent;
      top: auto;
      right: auto;
      bottom: auto;
      left: auto; } }

@media only screen and (min-width: 75em) {
  .large-grid-block {
    display: flex;
    height: 100vh;
    position: relative;
    overflow: hidden;
    flex: 1 1;
    flex-flow: row wrap;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: flex-start;
    order: 0;
    height: auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar; }
    .large-grid-block.panel {
      transform: none;
      position: relative;
      width: auto;
      height: auto;
      z-index: auto;
      box-shadow: none;
      background: transparent;
      top: auto;
      right: auto;
      bottom: auto;
      left: auto; } }

@media only screen and (min-width: 75em) {
  .large-grid-content {
    display: block;
    padding: 0 1rem;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    flex: 1 1; }
    .large-grid-content.panel {
      transform: none;
      position: relative;
      width: auto;
      height: auto;
      z-index: auto;
      box-shadow: none;
      background: transparent;
      top: auto;
      right: auto;
      bottom: auto;
      left: auto; } }

/*
	Sizing and ordering classes
*/
.order-1 {
  order: 1; }

.order-2 {
  order: 2; }

.order-3 {
  order: 3; }

.order-4 {
  order: 4; }

.order-5 {
  order: 5; }

.order-6 {
  order: 6; }

.order-7 {
  order: 7; }

.order-8 {
  order: 8; }

.order-9 {
  order: 9; }

.order-10 {
  order: 10; }

.order-11 {
  order: 11; }

.order-12 {
  order: 12; }

.small-1 {
  flex: 0 0 8.33333%; }

.small-order-1 {
  order: 1; }

.small-offset-1 {
  margin-left: 8.33333%; }

.small-up-1 {
  flex-flow: row wrap;
  overflow: visible;
  list-style-type: none; }
  .small-up-1 > li, .small-up-1 > div, .small-up-1 > section {
    padding: 0 1rem 1rem;
    flex: 0 0 100%; }

.small-2 {
  flex: 0 0 16.66667%; }

.small-order-2 {
  order: 2; }

.small-offset-2 {
  margin-left: 16.66667%; }

.small-up-2 {
  flex-flow: row wrap;
  overflow: visible;
  list-style-type: none; }
  .small-up-2 > li, .small-up-2 > div, .small-up-2 > section {
    padding: 0 1rem 1rem;
    flex: 0 0 50%; }

.small-3 {
  flex: 0 0 25%; }

.small-order-3 {
  order: 3; }

.small-offset-3 {
  margin-left: 25%; }

.small-up-3 {
  flex-flow: row wrap;
  overflow: visible;
  list-style-type: none; }
  .small-up-3 > li, .small-up-3 > div, .small-up-3 > section {
    padding: 0 1rem 1rem;
    flex: 0 0 33.33333%; }

.small-4 {
  flex: 0 0 33.33333%; }

.small-order-4 {
  order: 4; }

.small-offset-4 {
  margin-left: 33.33333%; }

.small-up-4 {
  flex-flow: row wrap;
  overflow: visible;
  list-style-type: none; }
  .small-up-4 > li, .small-up-4 > div, .small-up-4 > section {
    padding: 0 1rem 1rem;
    flex: 0 0 25%; }

.small-5 {
  flex: 0 0 41.66667%; }

.small-order-5 {
  order: 5; }

.small-offset-5 {
  margin-left: 41.66667%; }

.small-up-5 {
  flex-flow: row wrap;
  overflow: visible;
  list-style-type: none; }
  .small-up-5 > li, .small-up-5 > div, .small-up-5 > section {
    padding: 0 1rem 1rem;
    flex: 0 0 20%; }

.small-6 {
  flex: 0 0 50%; }

.small-order-6 {
  order: 6; }

.small-offset-6 {
  margin-left: 50%; }

.small-up-6 {
  flex-flow: row wrap;
  overflow: visible;
  list-style-type: none; }
  .small-up-6 > li, .small-up-6 > div, .small-up-6 > section {
    padding: 0 1rem 1rem;
    flex: 0 0 16.66667%; }

.small-7 {
  flex: 0 0 58.33333%; }

.small-order-7 {
  order: 7; }

.small-offset-7 {
  margin-left: 58.33333%; }

.small-up-7 {
  flex-flow: row wrap;
  overflow: visible;
  list-style-type: none; }
  .small-up-7 > li, .small-up-7 > div, .small-up-7 > section {
    padding: 0 1rem 1rem;
    flex: 0 0 14.28571%; }

.small-8 {
  flex: 0 0 66.66667%; }

.small-order-8 {
  order: 8; }

.small-offset-8 {
  margin-left: 66.66667%; }

.small-up-8 {
  flex-flow: row wrap;
  overflow: visible;
  list-style-type: none; }
  .small-up-8 > li, .small-up-8 > div, .small-up-8 > section {
    padding: 0 1rem 1rem;
    flex: 0 0 12.5%; }

.small-9 {
  flex: 0 0 75%; }

.small-order-9 {
  order: 9; }

.small-offset-9 {
  margin-left: 75%; }

.small-up-9 {
  flex-flow: row wrap;
  overflow: visible;
  list-style-type: none; }
  .small-up-9 > li, .small-up-9 > div, .small-up-9 > section {
    padding: 0 1rem 1rem;
    flex: 0 0 11.11111%; }

.small-10 {
  flex: 0 0 83.33333%; }

.small-order-10 {
  order: 10; }

.small-offset-10 {
  margin-left: 83.33333%; }

.small-up-10 {
  flex-flow: row wrap;
  overflow: visible;
  list-style-type: none; }
  .small-up-10 > li, .small-up-10 > div, .small-up-10 > section {
    padding: 0 1rem 1rem;
    flex: 0 0 10%; }

.small-11 {
  flex: 0 0 91.66667%; }

.small-order-11 {
  order: 11; }

.small-offset-11 {
  margin-left: 91.66667%; }

.small-up-11 {
  flex-flow: row wrap;
  overflow: visible;
  list-style-type: none; }
  .small-up-11 > li, .small-up-11 > div, .small-up-11 > section {
    padding: 0 1rem 1rem;
    flex: 0 0 9.09091%; }

.small-12 {
  flex: 0 0 100%; }

.small-order-12 {
  order: 12; }

.small-offset-12 {
  margin-left: 100%; }

.small-up-12 {
  flex-flow: row wrap;
  overflow: visible;
  list-style-type: none; }
  .small-up-12 > li, .small-up-12 > div, .small-up-12 > section {
    padding: 0 1rem 1rem;
    flex: 0 0 8.33333%; }

@media only screen and (min-width: 40em) {
  .medium-1 {
    flex: 0 0 8.33333%; }

  .medium-order-1 {
    order: 1; }

  .medium-offset-1 {
    margin-left: 8.33333%; }

  .medium-up-1 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .medium-up-1 > li, .medium-up-1 > div, .medium-up-1 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 100%; } }
@media only screen and (min-width: 40em) {
  .medium-2 {
    flex: 0 0 16.66667%; }

  .medium-order-2 {
    order: 2; }

  .medium-offset-2 {
    margin-left: 16.66667%; }

  .medium-up-2 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .medium-up-2 > li, .medium-up-2 > div, .medium-up-2 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 50%; } }
@media only screen and (min-width: 40em) {
  .medium-3 {
    flex: 0 0 25%; }

  .medium-order-3 {
    order: 3; }

  .medium-offset-3 {
    margin-left: 25%; }

  .medium-up-3 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .medium-up-3 > li, .medium-up-3 > div, .medium-up-3 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 33.33333%; } }
@media only screen and (min-width: 40em) {
  .medium-4 {
    flex: 0 0 33.33333%; }

  .medium-order-4 {
    order: 4; }

  .medium-offset-4 {
    margin-left: 33.33333%; }

  .medium-up-4 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .medium-up-4 > li, .medium-up-4 > div, .medium-up-4 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 25%; } }
@media only screen and (min-width: 40em) {
  .medium-5 {
    flex: 0 0 41.66667%; }

  .medium-order-5 {
    order: 5; }

  .medium-offset-5 {
    margin-left: 41.66667%; }

  .medium-up-5 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .medium-up-5 > li, .medium-up-5 > div, .medium-up-5 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 20%; } }
@media only screen and (min-width: 40em) {
  .medium-6 {
    flex: 0 0 50%; }

  .medium-order-6 {
    order: 6; }

  .medium-offset-6 {
    margin-left: 50%; }

  .medium-up-6 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .medium-up-6 > li, .medium-up-6 > div, .medium-up-6 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 16.66667%; } }
@media only screen and (min-width: 40em) {
  .medium-7 {
    flex: 0 0 58.33333%; }

  .medium-order-7 {
    order: 7; }

  .medium-offset-7 {
    margin-left: 58.33333%; }

  .medium-up-7 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .medium-up-7 > li, .medium-up-7 > div, .medium-up-7 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 14.28571%; } }
@media only screen and (min-width: 40em) {
  .medium-8 {
    flex: 0 0 66.66667%; }

  .medium-order-8 {
    order: 8; }

  .medium-offset-8 {
    margin-left: 66.66667%; }

  .medium-up-8 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .medium-up-8 > li, .medium-up-8 > div, .medium-up-8 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 12.5%; } }
@media only screen and (min-width: 40em) {
  .medium-9 {
    flex: 0 0 75%; }

  .medium-order-9 {
    order: 9; }

  .medium-offset-9 {
    margin-left: 75%; }

  .medium-up-9 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .medium-up-9 > li, .medium-up-9 > div, .medium-up-9 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 11.11111%; } }
@media only screen and (min-width: 40em) {
  .medium-10 {
    flex: 0 0 83.33333%; }

  .medium-order-10 {
    order: 10; }

  .medium-offset-10 {
    margin-left: 83.33333%; }

  .medium-up-10 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .medium-up-10 > li, .medium-up-10 > div, .medium-up-10 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 10%; } }
@media only screen and (min-width: 40em) {
  .medium-11 {
    flex: 0 0 91.66667%; }

  .medium-order-11 {
    order: 11; }

  .medium-offset-11 {
    margin-left: 91.66667%; }

  .medium-up-11 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .medium-up-11 > li, .medium-up-11 > div, .medium-up-11 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 9.09091%; } }
@media only screen and (min-width: 40em) {
  .medium-12 {
    flex: 0 0 100%; }

  .medium-order-12 {
    order: 12; }

  .medium-offset-12 {
    margin-left: 100%; }

  .medium-up-12 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .medium-up-12 > li, .medium-up-12 > div, .medium-up-12 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 8.33333%; } }
@media only screen and (min-width: 75em) {
  .large-1 {
    flex: 0 0 8.33333%; }

  .large-order-1 {
    order: 1; }

  .large-offset-1 {
    margin-left: 8.33333%; }

  .large-up-1 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .large-up-1 > li, .large-up-1 > div, .large-up-1 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 100%; } }
@media only screen and (min-width: 75em) {
  .large-2 {
    flex: 0 0 16.66667%; }

  .large-order-2 {
    order: 2; }

  .large-offset-2 {
    margin-left: 16.66667%; }

  .large-up-2 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .large-up-2 > li, .large-up-2 > div, .large-up-2 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 50%; } }
@media only screen and (min-width: 75em) {
  .large-3 {
    flex: 0 0 25%; }

  .large-order-3 {
    order: 3; }

  .large-offset-3 {
    margin-left: 25%; }

  .large-up-3 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .large-up-3 > li, .large-up-3 > div, .large-up-3 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 33.33333%; } }
@media only screen and (min-width: 75em) {
  .large-4 {
    flex: 0 0 33.33333%; }

  .large-order-4 {
    order: 4; }

  .large-offset-4 {
    margin-left: 33.33333%; }

  .large-up-4 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .large-up-4 > li, .large-up-4 > div, .large-up-4 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 25%; } }
@media only screen and (min-width: 75em) {
  .large-5 {
    flex: 0 0 41.66667%; }

  .large-order-5 {
    order: 5; }

  .large-offset-5 {
    margin-left: 41.66667%; }

  .large-up-5 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .large-up-5 > li, .large-up-5 > div, .large-up-5 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 20%; } }
@media only screen and (min-width: 75em) {
  .large-6 {
    flex: 0 0 50%; }

  .large-order-6 {
    order: 6; }

  .large-offset-6 {
    margin-left: 50%; }

  .large-up-6 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .large-up-6 > li, .large-up-6 > div, .large-up-6 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 16.66667%; } }
@media only screen and (min-width: 75em) {
  .large-7 {
    flex: 0 0 58.33333%; }

  .large-order-7 {
    order: 7; }

  .large-offset-7 {
    margin-left: 58.33333%; }

  .large-up-7 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .large-up-7 > li, .large-up-7 > div, .large-up-7 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 14.28571%; } }
@media only screen and (min-width: 75em) {
  .large-8 {
    flex: 0 0 66.66667%; }

  .large-order-8 {
    order: 8; }

  .large-offset-8 {
    margin-left: 66.66667%; }

  .large-up-8 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .large-up-8 > li, .large-up-8 > div, .large-up-8 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 12.5%; } }
@media only screen and (min-width: 75em) {
  .large-9 {
    flex: 0 0 75%; }

  .large-order-9 {
    order: 9; }

  .large-offset-9 {
    margin-left: 75%; }

  .large-up-9 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .large-up-9 > li, .large-up-9 > div, .large-up-9 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 11.11111%; } }
@media only screen and (min-width: 75em) {
  .large-10 {
    flex: 0 0 83.33333%; }

  .large-order-10 {
    order: 10; }

  .large-offset-10 {
    margin-left: 83.33333%; }

  .large-up-10 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .large-up-10 > li, .large-up-10 > div, .large-up-10 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 10%; } }
@media only screen and (min-width: 75em) {
  .large-11 {
    flex: 0 0 91.66667%; }

  .large-order-11 {
    order: 11; }

  .large-offset-11 {
    margin-left: 91.66667%; }

  .large-up-11 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .large-up-11 > li, .large-up-11 > div, .large-up-11 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 9.09091%; } }
@media only screen and (min-width: 75em) {
  .large-12 {
    flex: 0 0 100%; }

  .large-order-12 {
    order: 12; }

  .large-offset-12 {
    margin-left: 100%; }

  .large-up-12 {
    flex-flow: row wrap;
    overflow: visible;
    list-style-type: none; }
    .large-up-12 > li, .large-up-12 > div, .large-up-12 > section {
      padding: 0 1rem 1rem;
      flex: 0 0 8.33333%; } }
/*
  TITLE BAR
  ---------

  A navigational component which can display the current screen the user is on, along with additional controls or menu items.

  The title bar includes classes to create center, left, and right sections, which can be used in any combination. However, in the markup, the sections must come in this order:
   - Center
   - Left
   - Right
*/
.title-bar {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-start;
  overflow: visible; }
  .title-bar .title {
    font-weight: bold; }
  .title-bar .left, .title-bar .center, .title-bar .right {
    white-space: nowrap;
    overflow: visible; }
    .title-bar .left:first-child:last-child, .title-bar .center:first-child:last-child, .title-bar .right:first-child:last-child {
      flex: 1;
      margin: 0; }
  .title-bar .left {
    order: 1;
    flex: 0 0 25%; }
  .title-bar .center {
    order: 2;
    flex: 0 0 50%;
    text-align: center; }
  .title-bar .right {
    order: 3;
    flex: 0 0 25%;
    text-align: right; }
  .title-bar .left:first-child {
    flex: 1 1 auto; }
  .title-bar .left:first-child + .right:last-child {
    flex: 1 1 auto; }
  .title-bar .center:first-child:not(:last-child) {
    margin-left: 25%; }
  .title-bar .center + .left {
    margin-right: -25%; }

.title-bar {
  background: #eee;
  color: #000;
  padding: 1rem;
  border-bottom: 1px solid #ccc; }
  .title-bar.primary {
    background: #00558b;
    color: #fff;
    padding: 1rem;
    border-bottom: 1px solid #ccc; }
    .title-bar.primary a, .title-bar.primary a:hover {
      color: #fff; }
    .title-bar.primary .iconic * {
      fill: #fff;
      stroke: #fff; }
      .title-bar.primary .iconic *.iconic-property-accent {
        fill: #fff;
        stroke: #fff; }
  .title-bar.dark {
    background: #232323;
    color: #fff;
    padding: 1rem;
    border-bottom: 1px solid #ccc; }
    .title-bar.dark a, .title-bar.dark a:hover {
      color: #fff; }
    .title-bar.dark .iconic * {
      fill: #fff;
      stroke: #fff; }
      .title-bar.dark .iconic *.iconic-property-accent {
        fill: #fff;
        stroke: #fff; }

.title-bar-bottom {
  border-bottom: 0;
  border-top: 1px solid #ccc; }

/*
  Label
*/
.label {
  line-height: 1;
  white-space: nowrap;
  display: inline-block;
  cursor: default; }

.label {
  font-size: 0.9rem;
  padding: 0.33333rem 0.5rem;
  background: #00558b;
  border-radius: 0;
  color: #333; }
  .label.primary {
    background: #00558b;
    border-radius: 0;
    color: #fff; }
  .label.success {
    background: #43AC6A;
    border-radius: 0;
    color: #fff; }
  .label.warning {
    background: #F08A24;
    border-radius: 0;
    color: #fff; }
  .label.alert {
    background: #F04124;
    border-radius: 0;
    color: #fff; }
  .label.dark {
    background: #232323;
    border-radius: 0;
    color: #fff; }

/*
  Badge
*/
.badge {
  align-items: center;
  position: absolute;
  display: inline-flex;
  min-width: 1.75em; }

.badge {
  font-size: 1em;
  padding: 0.1em 0.61em;
  background: #00558b;
  border-radius: 1000px;
  color: #fff; }
  .badge.primary {
    background: #00558b;
    border-radius: 1000px;
    color: #fff; }
  .badge.success {
    background: #43AC6A;
    border-radius: 1000px;
    color: #fff; }
  .badge.warning {
    background: #F08A24;
    border-radius: 1000px;
    color: #fff; }
  .badge.alert {
    background: #F04124;
    border-radius: 1000px;
    color: #fff; }
  .badge.dark {
    background: #232323;
    border-radius: 1000px;
    color: #fff; }

.inline-list {
  list-style-type: none;
  text-align: left; }
  .inline-list li, .inline-list dt, .inline-list dd {
    display: inline-block;
    margin-left: -2px;
    margin-right: -2px; }
  .inline-list li {
    margin-right: 1rem;
    margin-left: 0; }

/*
  MENU BAR
  --------

  A generic, flexible menu component.

  Features:
   - Orient horizontally and vertically
     - Change orientation at certain breakpoints
   - Items with icons above, below, or to the left or right
   - Text labels for vertical menus and badges for horizontal menus
*/
.menu-bar {
  display: flex;
  align-items: stretch;
  margin: 0;
  list-style-type: none;
  margin-bottom: 1rem; }
  .menu-bar li {
    flex: 1 0 auto;
    align-items: center; }
    .menu-bar li a {
      display: flex;
      flex-flow: column nowrap;
      align-items: center;
      padding: 1rem;
      font-size: 1rem;
      line-height: 1; }

/*
  CSS output
*/
.menu-bar {
  background: #fff; }
  .menu-bar a {
    color: #000; }
    .menu-bar a:hover {
      background: #ededed;
      color: #000; }
  .menu-bar .is-active > a {
    background: #ededed;
    color: #000; }
  .menu-bar .iconic * {
    fill: #000;
    stroke: #000; }
    .menu-bar .iconic *.iconic-property-accent {
      fill: #000;
      stroke: #000; }
  .menu-bar, .menu-bar.horizontal {
    /*
      Orientation
    */
    flex-flow: row nowrap;
    /*
      Stretch
    */ }
    .menu-bar a, .menu-bar.horizontal a {
      flex-flow: column nowrap; }
  .menu-bar.vertical {
    /*
      Orientation
    */
    flex-flow: column nowrap;
    /*
      Stretch
    */ }
    .menu-bar.vertical a {
      flex-flow: row nowrap; }
  .menu-bar.condense li {
    flex: 0 0 auto; }
  .menu-bar.small-horizontal {
    /*
      Orientation
    */
    flex-flow: row nowrap;
    /*
      Stretch
    */ }
    .menu-bar.small-horizontal a {
      flex-flow: column nowrap; }
  .menu-bar.small-vertical {
    /*
      Orientation
    */
    flex-flow: column nowrap;
    /*
      Stretch
    */ }
    .menu-bar.small-vertical a {
      flex-flow: row nowrap; }
  @media only screen and (min-width: 40em) {
    .menu-bar.medium-horizontal {
      /*
        Orientation
      */
      flex-flow: row nowrap;
      /*
        Stretch
      */ }
      .menu-bar.medium-horizontal a {
        flex-flow: column nowrap; }
    .menu-bar.medium-vertical {
      /*
        Orientation
      */
      flex-flow: column nowrap;
      /*
        Stretch
      */ }
      .menu-bar.medium-vertical a {
        flex-flow: row nowrap; } }
  @media only screen and (min-width: 75em) {
    .menu-bar.large-horizontal {
      /*
        Orientation
      */
      flex-flow: row nowrap;
      /*
        Stretch
      */ }
      .menu-bar.large-horizontal a {
        flex-flow: column nowrap; }
    .menu-bar.large-vertical {
      /*
        Orientation
      */
      flex-flow: column nowrap;
      /*
        Stretch
      */ }
      .menu-bar.large-vertical a {
        flex-flow: row nowrap; } }
  .menu-bar li img, .menu-bar li .iconic, .menu-bar.icon-top li img, .menu-bar.icon-top li .iconic {
    margin: 0;
    width: 25px;
    height: 25px; }
  .menu-bar li a, .menu-bar.icon-top li a {
    flex-flow: column nowrap; }
    .menu-bar li a img, .menu-bar li a .iconic, .menu-bar.icon-top li a img, .menu-bar.icon-top li a .iconic {
      margin: 0 0 1rem 0; }
  .menu-bar.icon-right li img, .menu-bar.icon-right li .iconic {
    margin: 0;
    width: 25px;
    height: 25px; }
  .menu-bar.icon-right li a {
    flex-flow: row-reverse nowrap; }
    .menu-bar.icon-right li a img, .menu-bar.icon-right li a .iconic {
      margin: 0 0 0 1rem; }
  .menu-bar.icon-bottom li img, .menu-bar.icon-bottom li .iconic {
    margin: 0;
    width: 25px;
    height: 25px; }
  .menu-bar.icon-bottom li a {
    flex-flow: column-reverse nowrap; }
    .menu-bar.icon-bottom li a img, .menu-bar.icon-bottom li a .iconic {
      margin: 1rem 0 0 0; }
  .menu-bar.icon-left li img, .menu-bar.icon-left li .iconic {
    margin: 0;
    width: 25px;
    height: 25px; }
  .menu-bar.icon-left li a {
    flex-flow: row nowrap;
    align-items: center; }
    .menu-bar.icon-left li a img, .menu-bar.icon-left li a .iconic {
      margin: 0 1rem 0 0; }
  .menu-bar.small-icon-top li img, .menu-bar.small-icon-top li .iconic {
    margin: 0;
    width: 25px;
    height: 25px; }
  .menu-bar.small-icon-top li a {
    flex-flow: column nowrap; }
    .menu-bar.small-icon-top li a img, .menu-bar.small-icon-top li a .iconic {
      margin: 0 0 1rem 0; }
  .menu-bar.small-icon-right li img, .menu-bar.small-icon-right li .iconic {
    margin: 0;
    width: 25px;
    height: 25px; }
  .menu-bar.small-icon-right li a {
    flex-flow: row-reverse nowrap; }
    .menu-bar.small-icon-right li a img, .menu-bar.small-icon-right li a .iconic {
      margin: 0 0 0 1rem; }
  .menu-bar.small-icon-bottom li img, .menu-bar.small-icon-bottom li .iconic {
    margin: 0;
    width: 25px;
    height: 25px; }
  .menu-bar.small-icon-bottom li a {
    flex-flow: column-reverse nowrap; }
    .menu-bar.small-icon-bottom li a img, .menu-bar.small-icon-bottom li a .iconic {
      margin: 1rem 0 0 0; }
  .menu-bar.small-icon-left li img, .menu-bar.small-icon-left li .iconic {
    margin: 0;
    width: 25px;
    height: 25px; }
  .menu-bar.small-icon-left li a {
    flex-flow: row nowrap;
    align-items: center; }
    .menu-bar.small-icon-left li a img, .menu-bar.small-icon-left li a .iconic {
      margin: 0 1rem 0 0; }
  @media only screen and (min-width: 40em) {
    .menu-bar.medium-icon-top li img, .menu-bar.medium-icon-top li .iconic {
      margin: 0;
      width: 25px;
      height: 25px; }
    .menu-bar.medium-icon-top li a {
      flex-flow: column nowrap; }
      .menu-bar.medium-icon-top li a img, .menu-bar.medium-icon-top li a .iconic {
        margin: 0 0 1rem 0; } }
  @media only screen and (min-width: 40em) {
    .menu-bar.medium-icon-right li img, .menu-bar.medium-icon-right li .iconic {
      margin: 0;
      width: 25px;
      height: 25px; }
    .menu-bar.medium-icon-right li a {
      flex-flow: row-reverse nowrap; }
      .menu-bar.medium-icon-right li a img, .menu-bar.medium-icon-right li a .iconic {
        margin: 0 0 0 1rem; } }
  @media only screen and (min-width: 40em) {
    .menu-bar.medium-icon-bottom li img, .menu-bar.medium-icon-bottom li .iconic {
      margin: 0;
      width: 25px;
      height: 25px; }
    .menu-bar.medium-icon-bottom li a {
      flex-flow: column-reverse nowrap; }
      .menu-bar.medium-icon-bottom li a img, .menu-bar.medium-icon-bottom li a .iconic {
        margin: 1rem 0 0 0; } }
  @media only screen and (min-width: 40em) {
    .menu-bar.medium-icon-left li img, .menu-bar.medium-icon-left li .iconic {
      margin: 0;
      width: 25px;
      height: 25px; }
    .menu-bar.medium-icon-left li a {
      flex-flow: row nowrap;
      align-items: center; }
      .menu-bar.medium-icon-left li a img, .menu-bar.medium-icon-left li a .iconic {
        margin: 0 1rem 0 0; } }
  @media only screen and (min-width: 75em) {
    .menu-bar.large-icon-top li img, .menu-bar.large-icon-top li .iconic {
      margin: 0;
      width: 25px;
      height: 25px; }
    .menu-bar.large-icon-top li a {
      flex-flow: column nowrap; }
      .menu-bar.large-icon-top li a img, .menu-bar.large-icon-top li a .iconic {
        margin: 0 0 1rem 0; } }
  @media only screen and (min-width: 75em) {
    .menu-bar.large-icon-right li img, .menu-bar.large-icon-right li .iconic {
      margin: 0;
      width: 25px;
      height: 25px; }
    .menu-bar.large-icon-right li a {
      flex-flow: row-reverse nowrap; }
      .menu-bar.large-icon-right li a img, .menu-bar.large-icon-right li a .iconic {
        margin: 0 0 0 1rem; } }
  @media only screen and (min-width: 75em) {
    .menu-bar.large-icon-bottom li img, .menu-bar.large-icon-bottom li .iconic {
      margin: 0;
      width: 25px;
      height: 25px; }
    .menu-bar.large-icon-bottom li a {
      flex-flow: column-reverse nowrap; }
      .menu-bar.large-icon-bottom li a img, .menu-bar.large-icon-bottom li a .iconic {
        margin: 1rem 0 0 0; } }
  @media only screen and (min-width: 75em) {
    .menu-bar.large-icon-left li img, .menu-bar.large-icon-left li .iconic {
      margin: 0;
      width: 25px;
      height: 25px; }
    .menu-bar.large-icon-left li a {
      flex-flow: row nowrap;
      align-items: center; }
      .menu-bar.large-icon-left li a img, .menu-bar.large-icon-left li a .iconic {
        margin: 0 1rem 0 0; } }
  .menu-bar.label-side li {
    position: relative; }
  .menu-bar.label-side a {
    padding-right: 3.2rem; }
  .menu-bar.label-side .menu-bar-label {
    display: block;
    font-size: 0.9rem;
    width: 1.2rem;
    height: 1.2rem;
    line-height: 1.2rem;
    text-align: center;
    border-radius: 1000px;
    background: red;
    color: #fff;
    position: absolute;
    pointer-events: none;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%); }
  .menu-bar.label-corner li {
    position: relative; }
  .menu-bar.label-corner a {
    padding-right: 3.2rem; }
  .menu-bar.label-corner .menu-bar-label {
    display: block;
    font-size: 0.9rem;
    width: 1.2rem;
    height: 1.2rem;
    line-height: 1.2rem;
    text-align: center;
    border-radius: 1000px;
    background: red;
    color: #fff;
    position: absolute;
    pointer-events: none;
    right: 1rem;
    top: 1rem; }
  .menu-bar.primary {
    background: #00558b; }
    .menu-bar.primary a {
      color: #fff; }
      .menu-bar.primary a:hover {
        background: #0065a5;
        color: #fff; }
    .menu-bar.primary .is-active > a {
      background: #0065a5;
      color: #fff; }
    .menu-bar.primary .iconic * {
      fill: #fff;
      stroke: #fff; }
      .menu-bar.primary .iconic *.iconic-property-accent {
        fill: #fff;
        stroke: #fff; }
  .menu-bar.dark {
    background: #232323; }
    .menu-bar.dark a {
      color: #fff; }
      .menu-bar.dark a:hover {
        background: #323232;
        color: #fff; }
    .menu-bar.dark .is-active > a {
      background: #323232;
      color: #fff; }
    .menu-bar.dark .iconic * {
      fill: #fff;
      stroke: #fff; }
      .menu-bar.dark .iconic *.iconic-property-accent {
        fill: #fff;
        stroke: #fff; }
  .menu-bar > li.title {
    padding: 1rem;
    cursor: default;
    font-weight: bold; }

/*
  MODAL
  -----

  The humble modal hides off-canvas until summoned with an fa-open directive. Modals appear over an overlay that darkens the rest of the page, and have a maxmimum width. You can construct a grid inside a modal, or attach panels to it.

  Note that the modal overlay is hardcoded into the CSS, because whether or not you build your modal semantically, the overlay is always required and will always look the same.
*/
.modal {
  position: relative;
  z-index: 1001;
  display: none;
  background: #fff;
  width: 100%;
  overflow: hidden;
  opacity: 0;
  transform: scale(0.9);
  transition: opacity,-webkit-transform 0.2s,0.2s; }
  .is-active.modal {
    flex: 0 0  auto;
    display: flex !important;
    opacity: 1;
    height: 100vh;
    top: 0;
    left: 0;
    transform: scale(1); }
    @media only screen and (min-width: 40em) {
      .is-active.modal {
        height: auto;
        max-width: 600px; } }
    .is-active.dialogue.modal {
      width: 95%;
      height: auto; }
    .is-active.modal .grid-content, .is-active.modal .grid-block {
      margin: 0; }
  .modal .close-button, .modal [fa-close] {
    z-index: 1001; }

.modal {
  max-width: 600px; }
  .modal.tiny {
    max-width: 300px; }
  .modal.small {
    max-width: 500px; }
  .modal.large {
    max-width: 800px; }

.modal-overlay {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1000;
  display: none;
  background-color: rgba(51, 51, 51, 0.7);
  opacity: 0;
  transition: opacity 0.4s;
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center; }
  .modal-overlay.is-active {
    opacity: 1;
    pointer-events: auto; }

@keyframes shake {
  0%, 10%, 20%, 30%, 40%, 50%, 60%, 70%, 80%, 90% {
    transform: translateX(7%); }
  5%, 15%, 25%, 35%, 45%, 55%, 65%, 75%, 85%, 95% {
    transform: translateX(-7%); }
  100% {
    transform: translateX(0); } }
@keyframes spin-cw {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }
@keyframes spin-ccw {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(-360deg); } }
@keyframes wiggle {
  40%, 50%, 60% {
    transform: rotate(7deg); }
  35%, 45%, 55%, 65% {
    transform: rotate(-7deg); }
  0%, 30%, 70%, 100% {
    transform: rotate(0); } }
/*
  Transitions
*/
.slideInFromTop.ng-enter {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  backface-visibility: hidden;
  transform: translateY(-100%); }
.slideInFromTop.ng-enter.ng-enter-active {
  transform: translateX(0) translateY(0); }

.slideInFromRight.ng-enter {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  backface-visibility: hidden;
  transform: translateX(100%); }
.slideInFromRight.ng-enter.ng-enter-active {
  transform: translateX(0) translateY(0); }

.slideInFromBottom.ng-enter {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  backface-visibility: hidden;
  transform: translateY(100%); }
.slideInFromBottom.ng-enter.ng-enter-active {
  transform: translateX(0) translateY(0); }

.slideInFromLeft.ng-enter {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  backface-visibility: hidden;
  transform: translateX(-100%); }
.slideInFromLeft.ng-enter.ng-enter-active {
  transform: translateX(0) translateY(0); }

.slideOutFromTop.ng-leave {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  backface-visibility: hidden;
  transform: translateX(0) translateY(0); }
.slideOutFromTop.ng-leave.ng-leave-active {
  transform: translateY(-100%); }

.slideOutFromRight.ng-leave {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  backface-visibility: hidden;
  transform: translateX(0) translateY(0); }
.slideOutFromRight.ng-leave.ng-leave-active {
  transform: translateX(100%); }

.slideOutFromBottom.ng-leave {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  backface-visibility: hidden;
  transform: translateX(0) translateY(0); }
.slideOutFromBottom.ng-leave.ng-leave-active {
  transform: translateY(100%); }

.slideOutFromLeft.ng-leave {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  backface-visibility: hidden;
  transform: translateX(0) translateY(0); }
.slideOutFromLeft.ng-leave.ng-leave-active {
  transform: translateX(-100%); }

.fadeIn.ng-enter {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: opacity;
  opacity: 0; }
.fadeIn.ng-enter.ng-enter-active {
  opacity: 1; }

.fadeOut.ng-leave {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: opacity;
  opacity: 1; }
.fadeOut.ng-leave.ng-leave-active {
  opacity: 0; }

.hingeInFromTop.ng-enter {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  transform: perspective(2000px) rotateX(-90deg);
  transform-origin: top;
  opacity: 0; }
.hingeInFromTop.ng-enter.ng-enter-active {
  transform: rotate(0deg);
  opacity: 1; }

.hingeInFromRight.ng-enter {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  transform: perspective(2000px) rotateY(-90deg);
  transform-origin: right;
  opacity: 0; }
.hingeInFromRight.ng-enter.ng-enter-active {
  transform: rotate(0deg);
  opacity: 1; }

.hingeInFromBottom.ng-enter {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  transform: perspective(2000px) rotateX(90deg);
  transform-origin: bottom;
  opacity: 0; }
.hingeInFromBottom.ng-enter.ng-enter-active {
  transform: rotate(0deg);
  opacity: 1; }

.hingeInFromLeft.ng-enter {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  transform: perspective(2000px) rotateY(90deg);
  transform-origin: left;
  opacity: 0; }
.hingeInFromLeft.ng-enter.ng-enter-active {
  transform: rotate(0deg);
  opacity: 1; }

.hingeInFromMiddleX.ng-enter {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  transform: perspective(2000px) rotateX(-90deg);
  transform-origin: center;
  opacity: 0; }
.hingeInFromMiddleX.ng-enter.ng-enter-active {
  transform: rotate(0deg);
  opacity: 1; }

.hingeInFromMiddleY.ng-enter {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  transform: perspective(2000px) rotateY(-90deg);
  transform-origin: center;
  opacity: 0; }
.hingeInFromMiddleY.ng-enter.ng-enter-active {
  transform: rotate(0deg);
  opacity: 1; }

.hingeOutFromTop.ng-leave {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  transform: rotate(0deg);
  transform-origin: top;
  opacity: 1; }
.hingeOutFromTop.ng-leave.ng-leave-active {
  transform: perspective(2000px) rotateX(-90deg);
  opacity: 0; }

.hingeOutFromRight.ng-leave {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  transform: rotate(0deg);
  transform-origin: right;
  opacity: 1; }
.hingeOutFromRight.ng-leave.ng-leave-active {
  transform: perspective(2000px) rotateY(-90deg);
  opacity: 0; }

.hingeOutFromBottom.ng-leave {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  transform: rotate(0deg);
  transform-origin: bottom;
  opacity: 1; }
.hingeOutFromBottom.ng-leave.ng-leave-active {
  transform: perspective(2000px) rotateX(90deg);
  opacity: 0; }

.hingeOutFromLeft.ng-leave {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  transform: rotate(0deg);
  transform-origin: left;
  opacity: 1; }
.hingeOutFromLeft.ng-leave.ng-leave-active {
  transform: perspective(2000px) rotateY(90deg);
  opacity: 0; }

.hingeOutFromMiddleX.ng-leave {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  transform: rotate(0deg);
  transform-origin: center;
  opacity: 1; }
.hingeOutFromMiddleX.ng-leave.ng-leave-active {
  transform: perspective(2000px) rotateX(-90deg);
  opacity: 0; }

.hingeOutFromMiddleY.ng-leave {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, opacity;
  transform: rotate(0deg);
  transform-origin: center;
  opacity: 1; }
.hingeOutFromMiddleY.ng-leave.ng-leave-active {
  transform: perspective(2000px) rotateY(-90deg);
  opacity: 0; }

.zoomIn.ng-enter {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, property;
  transform: scale(1.5);
  opacity: 0; }
.zoomIn.ng-enter.ng-enter-active {
  transform: scale(1);
  opacity: 1; }

.zoomOut.ng-leave {
  transition-duration: 700ms;
  transition-timing-function: ease;
  transition-delay: 0;
  transition-property: transform, property;
  transform: scale(0.5);
  opacity: 1; }
.zoomOut.ng-leave.ng-leave-active {
  transform: scale(1);
  opacity: 0; }

.spinIn.ng-enter {
  transition-property: transform, opacity;
  transform: rotate(-270deg);
  opacity: 0; }
.spinIn.ng-enter.ng-enter-active {
  transform: rotate(0);
  opacity: 1; }

.spinOut.ng-leave {
  transition-property: transform, opacity;
  transform: rotate(0);
  opacity: 1; }
.spinOut.ng-leave.ng-leave-active {
  transform: rotate(270deg);
  opacity: 0; }

.spinInCCW.ng-enter {
  transition-property: transform, opacity;
  transform: rotate(270deg);
  opacity: 0; }
.spinInCCW.ng-enter.ng-enter-active {
  transform: rotate(0);
  opacity: 1; }

.spinOutCCW.ng-leave {
  transition-property: transform, opacity;
  transform: rotate(0);
  opacity: 1; }
.spinOutCCW.ng-leave.ng-leave-active {
  transform: rotate(-270deg);
  opacity: 0; }

/*
  Transition modifiers
*/
.slow {
  transition-duration: 1.4s !important; }

.fast {
  transition-duration: 300ms !important; }

.linear {
  transition-timing-function: linear !important; }

.ease {
  transition-timing-function: ease !important; }

.easeIn {
  transition-timing-function: ease-in !important; }

.easeOut {
  transition-timing-function: ease-out !important; }

.easeInOut {
  transition-timing-function: ease-in-out !important; }

.bounceIn {
  transition-timing-function: cubic-bezier(0.485, 0.155, 0.24, 1.245) !important; }

.bounceOut {
  transition-timing-function: cubic-bezier(0.485, 0.155, 0.515, 0.845) !important; }

.bounceInOut {
  transition-timing-function: cubic-bezier(0.76, -0.245, 0.24, 1.245) !important; }

.delay {
  transition-delay: 300ms !important; }

.long-delay {
  transition-delay: 700ms !important; }

/*
  Animations
*/
.shake {
  animation-duration: 700ms;
  animation-timing-function: ease;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
  animation-delay: 0; }

.spin-cw {
  animation-duration: 700ms;
  animation-timing-function: ease;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
  animation-delay: 0; }

.spin-ccw {
  animation-duration: 700ms;
  animation-timing-function: ease;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
  animation-delay: 0; }

.wiggle {
  animation-duration: 700ms;
  animation-timing-function: ease;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
  animation-delay: 0; }

/*
  Animation modifiers
*/
.shake.infinite,
.spin-cw.infinite,
.spin-ccw.infinite,
.wiggle.infinite {
  animation-iteration-count: infinite; }
.shake.linear,
.spin-cw.linear,
.spin-ccw.linear,
.wiggle.linear {
  animation-timing-function: linear !important; }
.shake.ease,
.spin-cw.ease,
.spin-ccw.ease,
.wiggle.ease {
  animation-timing-function: ease !important; }
.shake.easeIn,
.spin-cw.easeIn,
.spin-ccw.easeIn,
.wiggle.easeIn {
  animation-timing-function: ease-in !important; }
.shake.easeOut,
.spin-cw.easeOut,
.spin-ccw.easeOut,
.wiggle.easeOut {
  animation-timing-function: ease-out !important; }
.shake.easeInOut,
.spin-cw.easeInOut,
.spin-ccw.easeInOut,
.wiggle.easeInOut {
  animation-timing-function: ease-in-out !important; }
.shake.bounceIn,
.spin-cw.bounceIn,
.spin-ccw.bounceIn,
.wiggle.bounceIn {
  animation-timing-function: cubic-bezier(0.485, 0.155, 0.24, 1.245) !important; }
.shake.bounceOut,
.spin-cw.bounceOut,
.spin-ccw.bounceOut,
.wiggle.bounceOut {
  animation-timing-function: cubic-bezier(0.485, 0.155, 0.515, 0.845) !important; }
.shake.bounceInOut,
.spin-cw.bounceInOut,
.spin-ccw.bounceInOut,
.wiggle.bounceInOut {
  animation-timing-function: cubic-bezier(0.76, -0.245, 0.24, 1.245) !important; }
.shake.slow,
.spin-cw.slow,
.spin-ccw.slow,
.wiggle.slow {
  animation-duration: 1.4s !important; }
.shake.fast,
.spin-cw.fast,
.spin-ccw.fast,
.wiggle.fast {
  animation-duration: 300ms !important; }
.shake.delay,
.spin-cw.delay,
.spin-ccw.delay,
.wiggle.delay {
  animation-delay: 300ms !important; }
.shake.long-delay,
.spin-cw.long-delay,
.spin-ccw.long-delay,
.wiggle.long-delay {
  animation-delay: 700ms !important; }

/*
  NOTIFICATION
  ------------

  An alert that pins to the corner of the screen when triggered by JavaScript. It can be set to disappear after a certain period of time, or to stay put until the user clicks on it. A custom action can be asigned to a notification as well.

  Optionally, the notifications directive can also tap into the browser's native notification support, if it exists.
*/
.notification {
  position: fixed;
  z-index: 1000;
  display: flex;
  transition: transform 0.25s ease-out; }
  .notification h1 {
    font-size: 1.25em;
    margin: 0; }
  .notification p {
    margin: 0; }
  .is-active.notification {
    transform: translateX(0%) translateY(0%) !important; }
  .notification .close-button {
    color: white; }

/*
  CSS Output
*/
.notification {
  width: 25rem;
  right: 1rem;
  transform: translateX(110%);
  top: 1rem;
  background: #00558b;
  padding: 1rem;
  border-radius: 4px; }
  @media only screen and (min-width: 0em) and (max-width: 39.9375rem) {
    .notification {
      width: auto;
      left: 1rem;
      right: 1rem;
      margin-left: 0; } }
  .notification, .notification h1, .notification h2, .notification h3, .notification h4, .notification h5, .notification h6 {
    color: white; }
  .notification.top-right {
    width: 25rem;
    right: 1rem;
    transform: translateX(110%);
    top: 1rem; }
    @media only screen and (min-width: 0em) and (max-width: 39.9375rem) {
      .notification.top-right {
        width: auto;
        left: 1rem;
        right: 1rem;
        margin-left: 0; } }
  .notification.top-left {
    width: 25rem;
    left: 1rem;
    transform: translateX(-110%);
    top: 1rem; }
    @media only screen and (min-width: 0em) and (max-width: 39.9375rem) {
      .notification.top-left {
        width: auto;
        left: 1rem;
        right: 1rem;
        margin-left: 0; } }
  .notification.top-middle {
    width: 25rem;
    left: 50%;
    margin-left: -12.5rem;
    transform: translateY(-110%);
    top: 1rem; }
    @media only screen and (min-width: 0em) and (max-width: 39.9375rem) {
      .notification.top-middle {
        width: auto;
        left: 1rem;
        right: 1rem;
        margin-left: 0; } }
  .notification.bottom-right {
    width: 25rem;
    right: 1rem;
    transform: translateX(110%);
    top: auto;
    bottom: 1rem; }
    @media only screen and (min-width: 0em) and (max-width: 39.9375rem) {
      .notification.bottom-right {
        width: auto;
        left: 1rem;
        right: 1rem;
        margin-left: 0; } }
  .notification.bottom-left {
    width: 25rem;
    left: 1rem;
    transform: translateX(-110%);
    top: auto;
    bottom: 1rem; }
    @media only screen and (min-width: 0em) and (max-width: 39.9375rem) {
      .notification.bottom-left {
        width: auto;
        left: 1rem;
        right: 1rem;
        margin-left: 0; } }
  .notification.bottom-middle {
    width: 25rem;
    left: 50%;
    margin-left: -12.5rem;
    transform: translateY(110%);
    top: auto;
    bottom: 1rem; }
    @media only screen and (min-width: 0em) and (max-width: 39.9375rem) {
      .notification.bottom-middle {
        width: auto;
        left: 1rem;
        right: 1rem;
        margin-left: 0; } }
  .notification.success {
    background: #43AC6A;
    padding: 1rem;
    border-radius: 4px; }
    .notification.success, .notification.success h1, .notification.success h2, .notification.success h3, .notification.success h4, .notification.success h5, .notification.success h6 {
      color: white; }
  .notification.warning {
    background: #F08A24;
    padding: 1rem;
    border-radius: 4px; }
    .notification.warning, .notification.warning h1, .notification.warning h2, .notification.warning h3, .notification.warning h4, .notification.warning h5, .notification.warning h6 {
      color: white; }
  .notification.alert {
    background: #F04124;
    padding: 1rem;
    border-radius: 4px; }
    .notification.alert, .notification.alert h1, .notification.alert h2, .notification.alert h3, .notification.alert h4, .notification.alert h5, .notification.alert h6 {
      color: white; }
  .notification.dark {
    background: #232323;
    padding: 1rem;
    border-radius: 4px; }
    .notification.dark, .notification.dark h1, .notification.dark h2, .notification.dark h3, .notification.dark h4, .notification.dark h5, .notification.dark h6 {
      color: #fff; }

.notification-icon {
  flex: 0 0 60px;
  margin-right: 1rem;
  align-self: flex-start; }
  .notification-icon img {
    width: 100%;
    height: auto; }

/*
	Off-canvas menu
  ---------------

  A generic container that stays fixed to the left, top, right, or bottom of the screen, and is summoned when needed. When an off-canvas panel is open, the app frame shifts over to reveal the menu.
*/
.off-canvas {
  position: fixed;
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
  transition: transform 0.25s ease-out; }
  .is-active.off-canvas {
    transform: translate(0, 0) !important; }
  .off-canvas ~ .grid-frame {
    transform: translate(0, 0, 0);
    transition: transform 0.25s ease-out;
    backface-visibility: hidden;
    background: white; }

.off-canvas {
  /*
    Get shadow values for later use
  */
  /*
    Sizing
  */
  width: 250px;
  height: 100%;
  /*
    Positioning
  */
  top: 0;
  left: 0;
  box-shadow: inset -3px 0 10px rgba(0, 0, 0, 0.25);
  transform: translateX(-100%);
  background: #fff;
  color: #000; }
  .off-canvas.is-active ~ .grid-frame {
    transform: translateX(250px) !important; }
  .off-canvas.top {
    /*
      Get shadow values for later use
    */
    /*
      Sizing
    */
    height: 250px;
    width: 100%;
    /*
      Positioning
    */
    top: 0;
    left: 0;
    transform: translateY(-100%);
    box-shadow: inset 0 -3px 10px rgba(0, 0, 0, 0.25); }
    .off-canvas.top.is-active ~ .grid-frame {
      transform: translateY(250px) !important; }
  .off-canvas.right {
    /*
      Get shadow values for later use
    */
    /*
      Sizing
    */
    width: 250px;
    height: 100%;
    /*
      Positioning
    */
    left: auto;
    top: 0;
    right: 0;
    box-shadow: inset 3px 0 10px rgba(0, 0, 0, 0.25);
    transform: translateX(100%); }
    .off-canvas.right.is-active ~ .grid-frame {
      transform: translateX(-250px) !important; }
  .off-canvas.bottom {
    /*
      Get shadow values for later use
    */
    /*
      Sizing
    */
    height: 250px;
    width: 100%;
    /*
      Positioning
    */ }
  .off-canvas.left {
    /*
      Get shadow values for later use
    */
    /*
      Sizing
    */
    width: 250px;
    height: 100%;
    /*
      Positioning
    */
    top: 0;
    left: 0;
    box-shadow: inset -3px 0 10px rgba(0, 0, 0, 0.25);
    transform: translateX(-100%); }
    .off-canvas.left.is-active ~ .grid-frame {
      transform: translateX(250px) !important; }
  .off-canvas.detached {
    z-index: 0;
    box-shadow: none; }
    .off-canvas.detached, .off-canvas.detached.is-active {
      transform: none; }
    .off-canvas.detached ~ .grid-frame {
      z-index: 1;
      box-shadow: 0 0 15px rgba(0, 0, 0, 0.5); }
  .off-canvas.primary {
    background: #00558b;
    color: #fff; }
  .off-canvas.dark {
    background: #232323;
    color: #fff; }

/*
  POPUP
  -----

  A floating container that can anchor to any other on-screen element, and contain any content, including grid blocks or panels.
*/
.popup {
  position: absolute;
  z-index: 1000;
  opacity: 0;
  overflow: hidden;
  transition: opacity 0.25s ease-out;
  pointer-events: none; }
  .tether-enabled.popup {
    opacity: 1;
    pointer-events: auto; }

.popup {
  width: 18.75rem;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  border: 0; }
  .popup.dark {
    background: #232323;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
    border: 0; }
  .popup.primary {
    background: #00558b;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
    border: 0; }

/*
  SWITCH
  ------
*/
.switch {
  position: relative;
  overflow: hidden;
  display: inline-block; }
  .switch > input {
    position: absolute;
    left: -9999px;
    outline: none; }
  .switch > label {
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    display: block;
    width: 100%;
    height: 100%;
    cursor: pointer; }
    .switch > label::after {
      content: '';
      display: block;
      position: absolute;
      top: 0;
      left: 0; }

/*
  Defines the dimmensions of the switch.

  $width - width of the switch.
  $height - height of the switch.
*/
.switch {
  width: 3.125rem;
  height: 2rem;
  border-radius: 9999px; }
  .switch > label::after {
    width: 2rem;
    height: 2rem; }
  .switch input:checked + label::after {
    left: 1.125rem; }
  .switch > label {
    background: #ccc; }
    .switch > label::after {
      background: white;
      border-radius: 9999px;
      transition: left 0.15s ease-out;
      border: 4px solid #ccc; }
  .switch input:checked + label {
    background: #00558b; }
    .switch input:checked + label::after {
      border-color: #00558b; }

/*
  TABS
  ----
*/
.tabs {
  /*
  	Container styles
  */
  display: flex;
  background: transparent;
  flex-flow: row wrap; }
  .tabs.vertical {
    /*
    	Container styles
    */
    display: flex;
    background: transparent;
    flex-flow: column nowrap; }
  .tabs .tab-item {
    background: #f3f3f3;
    padding: 1rem;
    line-height: 1;
    margin: 0;
    flex: 0 1 auto;
    cursor: pointer;
    color: #000; }
    .tabs .tab-item.is-active {
      background: #f9f9f9;
      color: #000; }
      .tabs .tab-item.is-active:hover {
        background: #f9f9f9; }
    .tabs .tab-item:hover {
      background: #e7e7e7; }

.tab-contents {
  padding: 1rem; }
  .tab-contents .tab-content {
    display: none; }
    .tab-contents .tab-content.is-active {
      display: block; }

/*
  ACCORDION
  ---------

  The trusy accordion allows you to create a series of vertical tabs.
*/
.accordion {
  border: 1px solid #cbcbcb; }

.accordion-title {
  padding: 1rem;
  background: #f3f3f3;
  color: #000;
  line-height: 1;
  cursor: pointer; }
  .accordion-title:hover {
    background: #e7e7e7; }
  .is-active .accordion-title {
    background: #f9f9f9;
    color: #000; }

.accordion-content {
  padding: 1rem;
  display: none; }
  .is-active .accordion-content {
    display: block; }

/*
  TYPOGRAPHY
  ----------

  Includes typographic resets for many common elements, and a few helper classes.
   - Headers
   - Subheaders
   - Lead paragraphs
   - Ordered/unordered lists
   - Code samples
   - Anchors
   - Dividers
   - Blockquotes
   - Acronyms
*/
/* Typography resets */
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
form,
p,
blockquote,
th,
td {
  margin: 0;
  padding: 0; }

/* Default Link Styles */
a {
  color: #00558b;
  text-decoration: none;
  line-height: inherit; }
  a[ui-sref] {
    cursor: pointer; }
  a:hover, a:focus {
    color: #004978; }
  a img {
    border: none; }

/* Default paragraph styles */
p {
  font-family: inherit;
  font-weight: normal;
  font-size: 1rem;
  line-height: 1.6;
  margin-bottom: 1.25rem;
  text-rendering: optimizeLegibility; }
  p.lead {
    font-size: 1.21875rem;
    line-height: 1.6; }
  p aside {
    font-size: 0.875rem;
    line-height: 1.35;
    font-style: italic; }

/* Default header styles */
h1, h2, h3, h4, h5, h6 {
  font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  font-weight: normal;
  font-style: normal;
  color: #222;
  text-rendering: optimizeLegibility;
  margin-top: 0.2rem;
  margin-bottom: 0.5rem;
  line-height: 1.4; }
  h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
    font-size: 60%;
    color: #6f6f6f;
    line-height: 0; }

h1 {
  font-size: 2.125rem; }

h2 {
  font-size: 1.6875rem; }

h3 {
  font-size: 1.375rem; }

h4 {
  font-size: 1.125rem; }

h5 {
  font-size: 1.125rem; }

h6 {
  font-size: 1rem; }

.subheader {
  line-height: 1.4;
  color: #6f6f6f;
  font-weight: normal;
  margin-top: 0.2rem;
  margin-bottom: 0.5rem; }

hr {
  border: solid #ddd;
  border-width: 1px 0 0;
  clear: both;
  margin: 1.25rem 0 1.1875rem;
  height: 0; }

/* Helpful Typography Defaults */
em,
i {
  font-style: italic;
  line-height: inherit; }

strong,
b {
  font-weight: bold;
  line-height: inherit; }

small {
  font-size: 60%;
  line-height: inherit; }

code {
  font-family: Consolas, "Liberation Mono", Courier, monospace;
  font-weight: normal;
  color: #464646;
  background-color: #fbfbfb;
  border-width: 1px;
  border-style: solid;
  border-color: #e2e2e2;
  padding: 0.125rem 0.3125rem 0.0625rem; }

/* Lists */
ul,
ol,
dl {
  font-size: 1rem;
  line-height: 1.6;
  margin-bottom: 1.25rem;
  list-style-position: outside;
  font-family: inherit; }

/* Lists */
ul, ol {
  margin-left: 1.1rem; }
  ul li ul,
  ul li ol, ol li ul,
  ol li ol {
    margin-left: 1.25rem;
    margin-bottom: 0; }

/* Lists without bullets */
ul.no-bullet {
  margin-left: 0; }
  ul.no-bullet, ul.no-bullet li ul, ul.no-bullet li ol {
    list-style-type: none; }

/* Definition Lists */
dl dt {
  margin-bottom: 0.3rem;
  font-weight: bold; }
dl dd {
  margin-bottom: 0.75rem; }

/* Abbreviations */
abbr,
acronym {
  text-transform: uppercase;
  font-size: 90%;
  color: #222;
  border-bottom: 1px dotted #ddd;
  cursor: help; }

abbr {
  text-transform: none; }

/* Blockquotes */
blockquote {
  margin: 0 0 1.25rem;
  padding: 0.5625rem 1.25rem 0 1.1875rem;
  border-left: 1px solid #ddd; }
  blockquote cite {
    display: block;
    font-size: 0.8125rem;
    color: #555555; }
    blockquote cite:before {
      content: "\2014 \0020"; }
    blockquote cite a,
    blockquote cite a:visited {
      color: #555555; }

blockquote,
blockquote p {
  line-height: 1.6;
  color: #6f6f6f; }

@media only screen and (min-width: 40em) {
  h1, h2, h3, h4, h5, h6 {
    line-height: 1.4; }

  h1 {
    font-size: 2.75rem; }

  h2 {
    font-size: 2.3125rem; }

  h3 {
    font-size: 1.6875rem; }

  h4 {
    font-size: 1.4375rem; }

  h5 {
    font-size: 1.125rem; }

  h6 {
    font-size: 1rem; } }
/*
  UTILITIES
  ---------

  Responsive helper classes to assist you in quickly doing basic formatting and layout.

  Features:
   - Vertical alignment
   - Visibility
   - Text alignment
   - Floating
*/
/*
  Vertical alignment
*/
.v-align {
  display: flex;
  align-items: center;
  justify-content: space-between; }
  .v-align .align-top {
    align-self: flex-start; }
  .v-align .align-center {
    align-self: center; }
  .v-align .align-bottom {
    align-self: flex-end; }
  .v-align .small-align-top {
    align-self: flex-start; }
  .v-align .small-align-center {
    align-self: center; }
  .v-align .small-align-bottom {
    align-self: flex-end; }
  @media only screen and (min-width: 40em) {
    .v-align .medium-align-top {
      align-self: flex-start; } }
  @media only screen and (min-width: 40em) {
    .v-align .medium-align-center {
      align-self: center; } }
  @media only screen and (min-width: 40em) {
    .v-align .medium-align-bottom {
      align-self: flex-end; } }
  @media only screen and (min-width: 75em) {
    .v-align .large-align-top {
      align-self: flex-start; } }
  @media only screen and (min-width: 75em) {
    .v-align .large-align-center {
      align-self: center; } }
  @media only screen and (min-width: 75em) {
    .v-align .large-align-bottom {
      align-self: flex-end; } }

/*
  Visibility
*/
.hide {
  display: none !important; }

.invisible {
  visibility: hidden; }

.hide-for-small {
  display: block !important;
  display: none !important; }

.show-for-small {
  display: none !important;
  display: block !important; }

.hide-for-small-only {
  display: block !important; }
  @media only screen and (min-width: 0em) and (max-width: 39.9375rem) {
    .hide-for-small-only {
      display: none !important; } }

.show-for-small-only {
  display: none !important; }
  @media only screen and (min-width: 0em) and (max-width: 39.9375rem) {
    .show-for-small-only {
      display: block; } }

.hide-for-medium {
  display: block !important; }
  @media only screen and (min-width: 40em) {
    .hide-for-medium {
      display: none !important; } }

.show-for-medium {
  display: none !important; }
  @media only screen and (min-width: 40em) {
    .show-for-medium {
      display: block !important; } }

.hide-for-medium-only {
  display: block !important; }
  @media only screen and (min-width: 40em) and (max-width: 74.9375rem) {
    .hide-for-medium-only {
      display: none !important; } }

.show-for-medium-only {
  display: none !important; }
  @media only screen and (min-width: 40em) and (max-width: 74.9375rem) {
    .show-for-medium-only {
      display: block; } }

.hide-for-large {
  display: block !important; }
  @media only screen and (min-width: 75em) {
    .hide-for-large {
      display: none !important; } }

.show-for-large {
  display: none !important; }
  @media only screen and (min-width: 75em) {
    .show-for-large {
      display: block !important; } }

.hide-for-large-only {
  display: block !important; }
  @media only screen and (min-width: 75em) and (max-width: 89.9375rem) {
    .hide-for-large-only {
      display: none !important; } }

.show-for-large-only {
  display: none !important; }
  @media only screen and (min-width: 75em) and (max-width: 89.9375rem) {
    .show-for-large-only {
      display: block; } }

@media only screen and (orientation: portrait) {
  .hide-for-portrait {
    display: none !important; }

  .show-for-portrait {
    display: block !important; } }
@media only screen and (orientation: landscape) {
  .hide-for-landscape {
    display: none !important; }

  .show-for-landscape {
    display: block !important; } }
/*
  Text alignment
*/
.text-left {
  text-align: left; }

.small-text-left {
  text-align: left; }

@media only screen and (min-width: 0em) and (max-width: 39.9375rem) {
  .small-only-text-left {
    text-align: left; } }
.text-left {
  text-align: left; }

@media only screen and (min-width: 40em) {
  .medium-text-left {
    text-align: left; } }
@media only screen and (min-width: 40em) and (max-width: 74.9375rem) {
  .medium-only-text-left {
    text-align: left; } }
.text-left {
  text-align: left; }

@media only screen and (min-width: 75em) {
  .large-text-left {
    text-align: left; } }
@media only screen and (min-width: 75em) and (max-width: 89.9375rem) {
  .large-only-text-left {
    text-align: left; } }
.text-right {
  text-align: right; }

.small-text-right {
  text-align: right; }

@media only screen and (min-width: 0em) and (max-width: 39.9375rem) {
  .small-only-text-right {
    text-align: right; } }
.text-right {
  text-align: right; }

@media only screen and (min-width: 40em) {
  .medium-text-right {
    text-align: right; } }
@media only screen and (min-width: 40em) and (max-width: 74.9375rem) {
  .medium-only-text-right {
    text-align: right; } }
.text-right {
  text-align: right; }

@media only screen and (min-width: 75em) {
  .large-text-right {
    text-align: right; } }
@media only screen and (min-width: 75em) and (max-width: 89.9375rem) {
  .large-only-text-right {
    text-align: right; } }
.text-center {
  text-align: center; }

.small-text-center {
  text-align: center; }

@media only screen and (min-width: 0em) and (max-width: 39.9375rem) {
  .small-only-text-center {
    text-align: center; } }
.text-center {
  text-align: center; }

@media only screen and (min-width: 40em) {
  .medium-text-center {
    text-align: center; } }
@media only screen and (min-width: 40em) and (max-width: 74.9375rem) {
  .medium-only-text-center {
    text-align: center; } }
.text-center {
  text-align: center; }

@media only screen and (min-width: 75em) {
  .large-text-center {
    text-align: center; } }
@media only screen and (min-width: 75em) and (max-width: 89.9375rem) {
  .large-only-text-center {
    text-align: center; } }
.text-justify {
  text-align: justify; }

.small-text-justify {
  text-align: justify; }

@media only screen and (min-width: 0em) and (max-width: 39.9375rem) {
  .small-only-text-justify {
    text-align: justify; } }
.text-justify {
  text-align: justify; }

@media only screen and (min-width: 40em) {
  .medium-text-justify {
    text-align: justify; } }
@media only screen and (min-width: 40em) and (max-width: 74.9375rem) {
  .medium-only-text-justify {
    text-align: justify; } }
.text-justify {
  text-align: justify; }

@media only screen and (min-width: 75em) {
  .large-text-justify {
    text-align: justify; } }
@media only screen and (min-width: 75em) and (max-width: 89.9375rem) {
  .large-only-text-justify {
    text-align: justify; } }
/*
  Floating
*/
.clearfix:before, .clearfix:after {
  content: " ";
  display: table; }
.clearfix:after {
  clear: both; }

.float-left {
  float: left; }

.float-right {
  float: right; }

.float-none {
  float: none; }

/*# sourceMappingURL=app.css.map */