/* open-sans-300normal - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-display: swap;
  font-weight: 300;
  src:
    local('Open Sans Light '),
    local('Open Sans-Light'),
    url(/static/media/open-sans-latin-300.b871ad6e.woff2) format('woff2'), /* Super Modern Browsers */
    url(/static/media/open-sans-latin-300.38bcfba2.woff) format('woff'); /* Modern Browsers */
}
/* open-sans-300italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-display: swap;
  font-weight: 300;
  src:
    local('Open Sans Light italic'),
    local('Open Sans-Lightitalic'),
    url(/static/media/open-sans-latin-300italic.b45d9997.woff2) format('woff2'), /* Super Modern Browsers */
    url(/static/media/open-sans-latin-300italic.3ab0502d.woff) format('woff'); /* Modern Browsers */
}
/* open-sans-400normal - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src:
    local('Open Sans Regular '),
    local('Open Sans-Regular'),
    url(/static/media/open-sans-latin-400.f57a62e9.woff2) format('woff2'), /* Super Modern Browsers */
    url(/static/media/open-sans-latin-400.347639ec.woff) format('woff'); /* Modern Browsers */
}
/* open-sans-400italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-display: swap;
  font-weight: 400;
  src:
    local('Open Sans Regular italic'),
    local('Open Sans-Regularitalic'),
    url(/static/media/open-sans-latin-400italic.bb915319.woff2) format('woff2'), /* Super Modern Browsers */
    url(/static/media/open-sans-latin-400italic.56bdf847.woff) format('woff'); /* Modern Browsers */
}
/* open-sans-600normal - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src:
    local('Open Sans SemiBold '),
    local('Open Sans-SemiBold'),
    url(/static/media/open-sans-latin-600.95264708.woff2) format('woff2'), /* Super Modern Browsers */
    url(/static/media/open-sans-latin-600.7e06644b.woff) format('woff'); /* Modern Browsers */
}
/* open-sans-600italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-display: swap;
  font-weight: 600;
  src:
    local('Open Sans SemiBold italic'),
    local('Open Sans-SemiBolditalic'),
    url(/static/media/open-sans-latin-600italic.cc4bf5b2.woff2) format('woff2'), /* Super Modern Browsers */
    url(/static/media/open-sans-latin-600italic.8d513ad9.woff) format('woff'); /* Modern Browsers */
}
/* open-sans-700normal - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src:
    local('Open Sans Bold '),
    local('Open Sans-Bold'),
    url(/static/media/open-sans-latin-700.92425c62.woff2) format('woff2'), /* Super Modern Browsers */
    url(/static/media/open-sans-latin-700.f24f4bce.woff) format('woff'); /* Modern Browsers */
}
/* open-sans-700italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-display: swap;
  font-weight: 700;
  src:
    local('Open Sans Bold italic'),
    local('Open Sans-Bolditalic'),
    url(/static/media/open-sans-latin-700italic.2a0783bd.woff2) format('woff2'), /* Super Modern Browsers */
    url(/static/media/open-sans-latin-700italic.e961bdb4.woff) format('woff'); /* Modern Browsers */
}
/* open-sans-800normal - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-display: swap;
  font-weight: 800;
  src:
    local('Open Sans ExtraBold '),
    local('Open Sans-ExtraBold'),
    url(/static/media/open-sans-latin-800.1666787e.woff2) format('woff2'), /* Super Modern Browsers */
    url(/static/media/open-sans-latin-800.8ab0bbdd.woff) format('woff'); /* Modern Browsers */
}
/* open-sans-800italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-display: swap;
  font-weight: 800;
  src:
    local('Open Sans ExtraBold italic'),
    local('Open Sans-ExtraBolditalic'),
    url(/static/media/open-sans-latin-800italic.b5bc2661.woff2) format('woff2'), /* Super Modern Browsers */
    url(/static/media/open-sans-latin-800italic.3d3bd083.woff) format('woff'); /* Modern Browsers */
}


@charset "UTF-8";/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css *//* Document
   ========================================================================== *//**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}/* Sections
   ========================================================================== *//**
 * Remove the margin in all browsers.
 */body {
  margin: 0;
}/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */h1 {
  font-size: 2em;
  margin: 0.67em 0;
}/* Grouping content
   ========================================================================== *//**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */hr {
  -webkit-box-sizing: content-box;
          box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}/* Text-level semantics
   ========================================================================== *//**
 * Remove the gray background on active links in IE 10.
 */a {
  background-color: transparent;
}/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted; /* 2 */
}/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */b,
strong {
  font-weight: bolder;
}/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}/**
 * Add the correct font size in all browsers.
 */small {
  font-size: 80%;
}/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}sub {
  bottom: -0.25em;
}sup {
  top: -0.5em;
}/* Embedded content
   ========================================================================== *//**
 * Remove the border on images inside links in IE 10.
 */img {
  border-style: none;
}/* Forms
   ========================================================================== *//**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */button,
input { /* 1 */
  overflow: visible;
}/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */button,
select { /* 1 */
  text-transform: none;
}/**
 * Correct the inability to style clickable types in iOS and Safari.
 */button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}/**
 * Remove the inner border and padding in Firefox.
 */button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}/**
 * Restore the focus styles unset by the previous rule.
 */button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}/**
 * Correct the padding in Firefox.
 */fieldset {
  padding: 0.35em 0.75em 0.625em;
}/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */legend {
  -webkit-box-sizing: border-box;
          box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */progress {
  vertical-align: baseline;
}/**
 * Remove the default vertical scrollbar in IE 10+.
 */textarea {
  overflow: auto;
}/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */[type="checkbox"],
[type="radio"] {
  -webkit-box-sizing: border-box;
          box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}/* Interactive
   ========================================================================== *//*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */details {
  display: block;
}/*
 * Add the correct display in all browsers.
 */summary {
  display: list-item;
}/* Misc
   ========================================================================== *//**
 * Add the correct display in IE 10+.
 */template {
  display: none;
}/**
 * Add the correct display in IE 10.
 */[hidden] {
  display: none;
}/*

  FLEXBOX

  Media Query Extensions:
   -ns = not-small
   -m  = medium
   -l  = large

*/.flex { display: -webkit-box; display: -ms-flexbox; display: flex; }.inline-flex { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; }/* 1. Fix for Chrome 44 bug.
 * https://code.google.com/p/chromium/issues/detail?id=506893 */.flex-auto {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  min-width: 0; /* 1 */
  min-height: 0; /* 1 */
}.flex-none { -webkit-box-flex: 0; -ms-flex: none; flex: none; }.flex-column  { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }.flex-row     { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }.flex-wrap    { -ms-flex-wrap: wrap; flex-wrap: wrap; }.flex-nowrap    { -ms-flex-wrap: nowrap; flex-wrap: nowrap; }.flex-wrap-reverse    { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; }.flex-column-reverse  { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; }.flex-row-reverse     { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }.items-start    { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }.items-end      { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }.items-center   { -webkit-box-align: center; -ms-flex-align: center; align-items: center; }.items-baseline { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; }.items-stretch  { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }.self-start    { -ms-flex-item-align: start; align-self: flex-start; }.self-end      { -ms-flex-item-align: end; align-self: flex-end; }.self-center   { -ms-flex-item-align: center; align-self: center; }.self-baseline { -ms-flex-item-align: baseline; align-self: baseline; }.self-stretch  { -ms-flex-item-align: stretch; align-self: stretch; }.justify-start   { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }.justify-end     { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }.justify-center  { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }.justify-between { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }.justify-around  { -ms-flex-pack: distribute; justify-content: space-around; }.content-start   { -ms-flex-line-pack: start; align-content: flex-start; }.content-end     { -ms-flex-line-pack: end; align-content: flex-end; }.content-center  { -ms-flex-line-pack: center; align-content: center; }.content-between { -ms-flex-line-pack: justify; align-content: space-between; }.content-around  { -ms-flex-line-pack: distribute; align-content: space-around; }.content-stretch { -ms-flex-line-pack: stretch; align-content: stretch; }.order-0 { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; }.order-1 { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }.order-2 { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }.order-3 { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; }.order-4 { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; }.order-5 { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; }.order-6 { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; }.order-7 { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; }.order-8 { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; }.order-last { -webkit-box-ordinal-group: 100000; -ms-flex-order: 99999; order: 99999; }.flex-grow-0 { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; }.flex-grow-1 { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }.flex-shrink-0 { -ms-flex-negative: 0; flex-shrink: 0; }.flex-shrink-1 { -ms-flex-negative: 1; flex-shrink: 1; }@media screen and (min-width: 30em) {
  .flex-ns { display: -webkit-box; display: -ms-flexbox; display: flex; }
  .inline-flex-ns { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; }
  .flex-auto-ns {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    min-width: 0; /* 1 */
    min-height: 0; /* 1 */
  }
  .flex-none-ns { -webkit-box-flex: 0; -ms-flex: none; flex: none; }
  .flex-column-ns { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
  .flex-row-ns { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }
  .flex-wrap-ns { -ms-flex-wrap: wrap; flex-wrap: wrap; }
  .flex-nowrap-ns { -ms-flex-wrap: nowrap; flex-wrap: nowrap; }
  .flex-wrap-reverse-ns { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; }
  .flex-column-reverse-ns { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; }
  .flex-row-reverse-ns { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }
  .items-start-ns { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
  .items-end-ns { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }
  .items-center-ns { -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
  .items-baseline-ns { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; }
  .items-stretch-ns { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }

  .self-start-ns { -ms-flex-item-align: start; align-self: flex-start; }
  .self-end-ns { -ms-flex-item-align: end; align-self: flex-end; }
  .self-center-ns { -ms-flex-item-align: center; align-self: center; }
  .self-baseline-ns { -ms-flex-item-align: baseline; align-self: baseline; }
  .self-stretch-ns { -ms-flex-item-align: stretch; align-self: stretch; }

  .justify-start-ns { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }
  .justify-end-ns { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }
  .justify-center-ns { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
  .justify-between-ns { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
  .justify-around-ns { -ms-flex-pack: distribute; justify-content: space-around; }

  .content-start-ns { -ms-flex-line-pack: start; align-content: flex-start; }
  .content-end-ns { -ms-flex-line-pack: end; align-content: flex-end; }
  .content-center-ns { -ms-flex-line-pack: center; align-content: center; }
  .content-between-ns { -ms-flex-line-pack: justify; align-content: space-between; }
  .content-around-ns { -ms-flex-line-pack: distribute; align-content: space-around; }
  .content-stretch-ns { -ms-flex-line-pack: stretch; align-content: stretch; }

  .order-0-ns { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; }
  .order-1-ns { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }
  .order-2-ns { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }
  .order-3-ns { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; }
  .order-4-ns { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; }
  .order-5-ns { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; }
  .order-6-ns { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; }
  .order-7-ns { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; }
  .order-8-ns { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; }
  .order-last-ns { -webkit-box-ordinal-group: 100000; -ms-flex-order: 99999; order: 99999; }

  .flex-grow-0-ns { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; }
  .flex-grow-1-ns { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }

  .flex-shrink-0-ns { -ms-flex-negative: 0; flex-shrink: 0; }
  .flex-shrink-1-ns { -ms-flex-negative: 1; flex-shrink: 1; }
}@media screen and (min-width: 30em) and (max-width: 60em) {
  .flex-m { display: -webkit-box; display: -ms-flexbox; display: flex; }
  .inline-flex-m { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; }
  .flex-auto-m {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    min-width: 0; /* 1 */
    min-height: 0; /* 1 */
  }
  .flex-none-m { -webkit-box-flex: 0; -ms-flex: none; flex: none; }
  .flex-column-m { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
  .flex-row-m     { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }
  .flex-wrap-m { -ms-flex-wrap: wrap; flex-wrap: wrap; }
  .flex-nowrap-m { -ms-flex-wrap: nowrap; flex-wrap: nowrap; }
  .flex-wrap-reverse-m { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; }
  .flex-column-reverse-m { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; }
  .flex-row-reverse-m { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }
  .items-start-m { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
  .items-end-m { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }
  .items-center-m { -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
  .items-baseline-m { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; }
  .items-stretch-m { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }

  .self-start-m { -ms-flex-item-align: start; align-self: flex-start; }
  .self-end-m { -ms-flex-item-align: end; align-self: flex-end; }
  .self-center-m { -ms-flex-item-align: center; align-self: center; }
  .self-baseline-m { -ms-flex-item-align: baseline; align-self: baseline; }
  .self-stretch-m { -ms-flex-item-align: stretch; align-self: stretch; }

  .justify-start-m { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }
  .justify-end-m { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }
  .justify-center-m { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
  .justify-between-m { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
  .justify-around-m { -ms-flex-pack: distribute; justify-content: space-around; }

  .content-start-m { -ms-flex-line-pack: start; align-content: flex-start; }
  .content-end-m { -ms-flex-line-pack: end; align-content: flex-end; }
  .content-center-m { -ms-flex-line-pack: center; align-content: center; }
  .content-between-m { -ms-flex-line-pack: justify; align-content: space-between; }
  .content-around-m { -ms-flex-line-pack: distribute; align-content: space-around; }
  .content-stretch-m { -ms-flex-line-pack: stretch; align-content: stretch; }

  .order-0-m { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; }
  .order-1-m { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }
  .order-2-m { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }
  .order-3-m { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; }
  .order-4-m { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; }
  .order-5-m { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; }
  .order-6-m { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; }
  .order-7-m { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; }
  .order-8-m { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; }
  .order-last-m { -webkit-box-ordinal-group: 100000; -ms-flex-order: 99999; order: 99999; }

  .flex-grow-0-m { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; }
  .flex-grow-1-m { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }

  .flex-shrink-0-m { -ms-flex-negative: 0; flex-shrink: 0; }
  .flex-shrink-1-m { -ms-flex-negative: 1; flex-shrink: 1; }
}@media screen and (min-width: 60em) {
  .flex-l { display: -webkit-box; display: -ms-flexbox; display: flex; }
  .inline-flex-l { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; }
  .flex-auto-l {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    min-width: 0; /* 1 */
    min-height: 0; /* 1 */
  }
  .flex-none-l { -webkit-box-flex: 0; -ms-flex: none; flex: none; }
  .flex-column-l { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
  .flex-row-l { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }
  .flex-wrap-l { -ms-flex-wrap: wrap; flex-wrap: wrap; }
  .flex-nowrap-l { -ms-flex-wrap: nowrap; flex-wrap: nowrap; }
  .flex-wrap-reverse-l { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; }
  .flex-column-reverse-l { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; }
  .flex-row-reverse-l { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }

  .items-start-l { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
  .items-end-l { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }
  .items-center-l { -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
  .items-baseline-l { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; }
  .items-stretch-l { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }

  .self-start-l { -ms-flex-item-align: start; align-self: flex-start; }
  .self-end-l { -ms-flex-item-align: end; align-self: flex-end; }
  .self-center-l { -ms-flex-item-align: center; align-self: center; }
  .self-baseline-l { -ms-flex-item-align: baseline; align-self: baseline; }
  .self-stretch-l { -ms-flex-item-align: stretch; align-self: stretch; }

  .justify-start-l { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }
  .justify-end-l { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }
  .justify-center-l { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
  .justify-between-l { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
  .justify-around-l { -ms-flex-pack: distribute; justify-content: space-around; }

  .content-start-l { -ms-flex-line-pack: start; align-content: flex-start; }
  .content-end-l { -ms-flex-line-pack: end; align-content: flex-end; }
  .content-center-l { -ms-flex-line-pack: center; align-content: center; }
  .content-between-l { -ms-flex-line-pack: justify; align-content: space-between; }
  .content-around-l { -ms-flex-line-pack: distribute; align-content: space-around; }
  .content-stretch-l { -ms-flex-line-pack: stretch; align-content: stretch; }

  .order-0-l { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; }
  .order-1-l { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }
  .order-2-l { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }
  .order-3-l { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; }
  .order-4-l { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; }
  .order-5-l { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; }
  .order-6-l { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; }
  .order-7-l { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; }
  .order-8-l { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; }
  .order-last-l { -webkit-box-ordinal-group: 100000; -ms-flex-order: 99999; order: 99999; }

  .flex-grow-0-l { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; }
  .flex-grow-1-l { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }

  .flex-shrink-0-l { -ms-flex-negative: 0; flex-shrink: 0; }
  .flex-shrink-1-l { -ms-flex-negative: 1; flex-shrink: 1; }
}/*

   WIDTHS
   Docs: http://tachyons.io/docs/layout/widths/

   Base:
     w = width

   Modifiers
     1 = 1st step in width scale
     2 = 2nd step in width scale
     3 = 3rd step in width scale
     4 = 4th step in width scale
     5 = 5th step in width scale

     -10  = literal value 10%
     -20  = literal value 20%
     -25  = literal value 25%
     -30  = literal value 30%
     -33  = literal value 33%
     -34  = literal value 34%
     -40  = literal value 40%
     -50  = literal value 50%
     -60  = literal value 60%
     -70  = literal value 70%
     -75  = literal value 75%
     -80  = literal value 80%
     -90  = literal value 90%
     -100 = literal value 100%

     -third      = 100% / 3 (Not supported in opera mini or IE8)
     -two-thirds = 100% / 1.5 (Not supported in opera mini or IE8)
     -auto       = string value auto


   Media Query Extensions:
     -ns = not-small
     -m  = medium
     -l  = large

*//* Width Scale */.w1 {    width: 1rem; }.w2 {    width: 2rem; }.w3 {    width: 4rem; }.w4 {    width: 8rem; }.w5 {    width: 16rem; }.w-10 {  width:  10%; }.w-20 {  width:  20%; }.w-25 {  width:  25%; }.w-30 {  width:  30%; }.w-33 {  width:  33%; }.w-34 {  width:  34%; }.w-40 {  width:  40%; }.w-50 {  width:  50%; }.w-60 {  width:  60%; }.w-70 {  width:  70%; }.w-75 {  width:  75%; }.w-80 {  width:  80%; }.w-90 {  width:  90%; }.w-100 { width: 100%; }.w-third { width: 33.33333%; }.w-two-thirds { width: 66.66667%; }.w-auto { width: auto; }@media screen and (min-width: 30em) {
  .w1-ns {  width: 1rem; }
  .w2-ns {  width: 2rem; }
  .w3-ns {  width: 4rem; }
  .w4-ns {  width: 8rem; }
  .w5-ns {  width: 16rem; }
  .w-10-ns { width:  10%; }
  .w-20-ns { width:  20%; }
  .w-25-ns { width:  25%; }
  .w-30-ns { width:  30%; }
  .w-33-ns { width:  33%; }
  .w-34-ns { width:  34%; }
  .w-40-ns { width:  40%; }
  .w-50-ns { width:  50%; }
  .w-60-ns { width:  60%; }
  .w-70-ns { width:  70%; }
  .w-75-ns { width:  75%; }
  .w-80-ns { width:  80%; }
  .w-90-ns { width:  90%; }
  .w-100-ns { width: 100%; }
  .w-third-ns { width: 33.33333%; }
  .w-two-thirds-ns { width: 66.66667%; }
  .w-auto-ns { width: auto; }
}@media screen and (min-width: 30em) and (max-width: 60em) {
  .w1-m {      width: 1rem; }
  .w2-m {      width: 2rem; }
  .w3-m {      width: 4rem; }
  .w4-m {      width: 8rem; }
  .w5-m {      width: 16rem; }
  .w-10-m { width:  10%; }
  .w-20-m { width:  20%; }
  .w-25-m { width:  25%; }
  .w-30-m { width:  30%; }
  .w-33-m { width:  33%; }
  .w-34-m { width:  34%; }
  .w-40-m { width:  40%; }
  .w-50-m { width:  50%; }
  .w-60-m { width:  60%; }
  .w-70-m { width:  70%; }
  .w-75-m { width:  75%; }
  .w-80-m { width:  80%; }
  .w-90-m { width:  90%; }
  .w-100-m { width: 100%; }
  .w-third-m { width: 33.33333%; }
  .w-two-thirds-m { width: 66.66667%; }
  .w-auto-m {    width: auto; }
}@media screen and (min-width: 60em) {
  .w1-l {      width: 1rem; }
  .w2-l {      width: 2rem; }
  .w3-l {      width: 4rem; }
  .w4-l {      width: 8rem; }
  .w5-l {      width: 16rem; }
  .w-10-l {    width:  10%; }
  .w-20-l {    width:  20%; }
  .w-25-l {    width:  25%; }
  .w-30-l {    width:  30%; }
  .w-33-l {    width:  33%; }
  .w-34-l {    width:  34%; }
  .w-40-l {    width:  40%; }
  .w-50-l {    width:  50%; }
  .w-60-l {    width:  60%; }
  .w-70-l {    width:  70%; }
  .w-75-l {    width:  75%; }
  .w-80-l {    width:  80%; }
  .w-90-l {    width:  90%; }
  .w-100-l {   width: 100%; }
  .w-third-l { width: 33.33333%; }
  .w-two-thirds-l { width: 66.66667%; }
  .w-auto-l {    width: auto; }
}/* Variables *//*
   SPACING
   Docs: http://tachyons.io/docs/layout/spacing/

   An eight step powers of two scale ranging from 0 to 16rem.

   Base:
     p = padding
     m = margin

   Modifiers:
     a = all
     h = horizontal
     v = vertical
     t = top
     r = right
     b = bottom
     l = left

     0 = none
     1 = 1st step in spacing scale
     2 = 2nd step in spacing scale
     3 = 3rd step in spacing scale
     4 = 4th step in spacing scale
     5 = 5th step in spacing scale
     6 = 6th step in spacing scale
     7 = 7th step in spacing scale

   Media Query Extensions:
     -ns = not-small
     -m  = medium
     -l  = large

*/.pa0 { padding: 0; }.pa1 { padding: 8px; }.pa2 { padding: 16px; }.pa3 { padding: 24px; }.pa4 { padding: 32px; }.pa5 { padding: 48px; }.pa6 { padding: 64px; }.pa7 { padding: 96px; }.pl0 { padding-left: 0; }.pl1 { padding-left: 8px; }.pl2 { padding-left: 16px; }.pl3 { padding-left: 24px; }.pl4 { padding-left: 32px; }.pl5 { padding-left: 48px; }.pl6 { padding-left: 64px; }.pl7 { padding-left: 96px; }.pr0 { padding-right: 0; }.pr1 { padding-right: 8px; }.pr2 { padding-right: 16px; }.pr3 { padding-right: 24px; }.pr4 { padding-right: 32px; }.pr5 { padding-right: 48px; }.pr6 { padding-right: 64px; }.pr7 { padding-right: 96px; }.pb0 { padding-bottom: 0; }.pb1 { padding-bottom: 8px; }.pb2 { padding-bottom: 16px; }.pb3 { padding-bottom: 24px; }.pb4 { padding-bottom: 32px; }.pb5 { padding-bottom: 48px; }.pb6 { padding-bottom: 64px; }.pb7 { padding-bottom: 96px; }.pt0 { padding-top: 0; }.pt1 { padding-top: 8px; }.pt2 { padding-top: 16px; }.pt3 { padding-top: 24px; }.pt4 { padding-top: 32px; }.pt5 { padding-top: 48px; }.pt6 { padding-top: 64px; }.pt7 { padding-top: 96px; }.pv0 {
  padding-top: 0;
  padding-bottom: 0;
}.pv1 {
  padding-top: 8px;
  padding-bottom: 8px;
}.pv2 {
  padding-top: 16px;
  padding-bottom: 16px;
}.pv3 {
  padding-top: 24px;
  padding-bottom: 24px;
}.pv4 {
  padding-top: 32px;
  padding-bottom: 32px;
}.pv5 {
  padding-top: 48px;
  padding-bottom: 48px;
}.pv6 {
  padding-top: 64px;
  padding-bottom: 64px;
}.pv7 {
  padding-top: 96px;
  padding-bottom: 96px;
}.ph0 {
  padding-left: 0;
  padding-right: 0;
}.ph1 {
  padding-left: 8px;
  padding-right: 8px;
}.ph2 {
  padding-left: 16px;
  padding-right: 16px;
}.ph3 {
  padding-left: 24px;
  padding-right: 24px;
}.ph4 {
  padding-left: 32px;
  padding-right: 32px;
}.ph5 {
  padding-left: 48px;
  padding-right: 48px;
}.ph6 {
  padding-left: 64px;
  padding-right: 64px;
}.ph7 {
  padding-left: 96px;
  padding-right: 96px;
}.ma0  {  margin: 0; }.ma1 {  margin: 8px; }.ma2  {  margin: 16px; }.ma3  {  margin: 24px; }.ma4  {  margin: 32px; }.ma5  {  margin: 48px; }.ma6 {  margin: 64px; }.ma7 { margin: 96px; }.ml0  {  margin-left: 0; }.ml1 {  margin-left: 8px; }.ml2  {  margin-left: 16px; }.ml3  {  margin-left: 24px; }.ml4  {  margin-left: 32px; }.ml5  {  margin-left: 48px; }.ml6 {  margin-left: 64px; }.ml7 { margin-left: 96px; }.mr0  {  margin-right: 0; }.mr1 {  margin-right: 8px; }.mr2  {  margin-right: 16px; }.mr3  {  margin-right: 24px; }.mr4  {  margin-right: 32px; }.mr5  {  margin-right: 48px; }.mr6 {  margin-right: 64px; }.mr7 { margin-right: 96px; }.mb0  {  margin-bottom: 0; }.mb1 {  margin-bottom: 8px; }.mb2  {  margin-bottom: 16px; }.mb3  {  margin-bottom: 24px; }.mb4  {  margin-bottom: 32px; }.mb5  {  margin-bottom: 48px; }.mb6 {  margin-bottom: 64px; }.mb7 { margin-bottom: 96px; }.mt0  {  margin-top: 0; }.mt1 {  margin-top: 8px; }.mt2  {  margin-top: 16px; }.mt3  {  margin-top: 24px; }.mt4  {  margin-top: 32px; }.mt5  {  margin-top: 48px; }.mt6 {  margin-top: 64px; }.mt7 { margin-top: 96px; }.mv0   {
  margin-top: 0;
  margin-bottom: 0;
}.mv1  {
  margin-top: 8px;
  margin-bottom: 8px;
}.mv2   {
  margin-top: 16px;
  margin-bottom: 16px;
}.mv3   {
  margin-top: 24px;
  margin-bottom: 24px;
}.mv4   {
  margin-top: 32px;
  margin-bottom: 32px;
}.mv5   {
  margin-top: 48px;
  margin-bottom: 48px;
}.mv6  {
  margin-top: 64px;
  margin-bottom: 64px;
}.mv7  {
  margin-top: 96px;
  margin-bottom: 96px;
}.mh0   {
  margin-left: 0;
  margin-right: 0;
}.mh1   {
  margin-left: 8px;
  margin-right: 8px;
}.mh2   {
  margin-left: 16px;
  margin-right: 16px;
}.mh3   {
  margin-left: 24px;
  margin-right: 24px;
}.mh4   {
  margin-left: 32px;
  margin-right: 32px;
}.mh5   {
  margin-left: 48px;
  margin-right: 48px;
}.mh6  {
  margin-left: 64px;
  margin-right: 64px;
}.mh7  {
  margin-left: 96px;
  margin-right: 96px;
}@media screen and (min-width: 30em) {
  .pa0-ns  {  padding: 0; }
  .pa1-ns {  padding: 8px; }
  .pa2-ns  {  padding: 16px; }
  .pa3-ns  {  padding: 24px; }
  .pa4-ns  {  padding: 32px; }
  .pa5-ns  {  padding: 48px; }
  .pa6-ns {  padding: 64px; }
  .pa7-ns { padding: 96px; }

  .pl0-ns  {  padding-left: 0; }
  .pl1-ns {  padding-left: 8px; }
  .pl2-ns  {  padding-left: 16px; }
  .pl3-ns  {  padding-left: 24px; }
  .pl4-ns  {  padding-left: 32px; }
  .pl5-ns  {  padding-left: 48px; }
  .pl6-ns {  padding-left: 64px; }
  .pl7-ns { padding-left: 96px; }

  .pr0-ns  {  padding-right: 0; }
  .pr1-ns {  padding-right: 8px; }
  .pr2-ns  {  padding-right: 16px; }
  .pr3-ns  {  padding-right: 24px; }
  .pr4-ns  {  padding-right: 32px; }
  .pr5-ns {   padding-right: 48px; }
  .pr6-ns {  padding-right: 64px; }
  .pr7-ns { padding-right: 96px; }

  .pb0-ns  {  padding-bottom: 0; }
  .pb1-ns {  padding-bottom: 8px; }
  .pb2-ns  {  padding-bottom: 16px; }
  .pb3-ns  {  padding-bottom: 24px; }
  .pb4-ns  {  padding-bottom: 32px; }
  .pb5-ns  {  padding-bottom: 48px; }
  .pb6-ns {  padding-bottom: 64px; }
  .pb7-ns { padding-bottom: 96px; }

  .pt0-ns  {  padding-top: 0; }
  .pt1-ns {  padding-top: 8px; }
  .pt2-ns  {  padding-top: 16px; }
  .pt3-ns  {  padding-top: 24px; }
  .pt4-ns  {  padding-top: 32px; }
  .pt5-ns  {  padding-top: 48px; }
  .pt6-ns {  padding-top: 64px; }
  .pt7-ns { padding-top: 96px; }

  .pv0-ns {
    padding-top: 0;
    padding-bottom: 0;
  }
  .pv1-ns {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .pv2-ns {
    padding-top: 16px;
    padding-bottom: 16px;
  }
  .pv3-ns {
    padding-top: 24px;
    padding-bottom: 24px;
  }
  .pv4-ns {
    padding-top: 32px;
    padding-bottom: 32px;
  }
  .pv5-ns {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .pv6-ns {
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .pv7-ns {
    padding-top: 96px;
    padding-bottom: 96px;
  }
  .ph0-ns {
    padding-left: 0;
    padding-right: 0;
  }
  .ph1-ns {
    padding-left: 8px;
    padding-right: 8px;
  }
  .ph2-ns {
    padding-left: 16px;
    padding-right: 16px;
  }
  .ph3-ns {
    padding-left: 24px;
    padding-right: 24px;
  }
  .ph4-ns {
    padding-left: 32px;
    padding-right: 32px;
  }
  .ph5-ns {
    padding-left: 48px;
    padding-right: 48px;
  }
  .ph6-ns {
    padding-left: 64px;
    padding-right: 64px;
  }
  .ph7-ns {
    padding-left: 96px;
    padding-right: 96px;
  }

  .ma0-ns  {  margin: 0; }
  .ma1-ns {  margin: 8px; }
  .ma2-ns  {  margin: 16px; }
  .ma3-ns  {  margin: 24px; }
  .ma4-ns  {  margin: 32px; }
  .ma5-ns  {  margin: 48px; }
  .ma6-ns {  margin: 64px; }
  .ma7-ns { margin: 96px; }

  .ml0-ns  {  margin-left: 0; }
  .ml1-ns {  margin-left: 8px; }
  .ml2-ns  {  margin-left: 16px; }
  .ml3-ns  {  margin-left: 24px; }
  .ml4-ns  {  margin-left: 32px; }
  .ml5-ns  {  margin-left: 48px; }
  .ml6-ns {  margin-left: 64px; }
  .ml7-ns { margin-left: 96px; }

  .mr0-ns  {  margin-right: 0; }
  .mr1-ns {  margin-right: 8px; }
  .mr2-ns  {  margin-right: 16px; }
  .mr3-ns  {  margin-right: 24px; }
  .mr4-ns  {  margin-right: 32px; }
  .mr5-ns  {  margin-right: 48px; }
  .mr6-ns {  margin-right: 64px; }
  .mr7-ns { margin-right: 96px; }

  .mb0-ns  {  margin-bottom: 0; }
  .mb1-ns {  margin-bottom: 8px; }
  .mb2-ns  {  margin-bottom: 16px; }
  .mb3-ns  {  margin-bottom: 24px; }
  .mb4-ns  {  margin-bottom: 32px; }
  .mb5-ns  {  margin-bottom: 48px; }
  .mb6-ns {  margin-bottom: 64px; }
  .mb7-ns { margin-bottom: 96px; }

  .mt0-ns  {  margin-top: 0; }
  .mt1-ns {  margin-top: 8px; }
  .mt2-ns  {  margin-top: 16px; }
  .mt3-ns  {  margin-top: 24px; }
  .mt4-ns  {  margin-top: 32px; }
  .mt5-ns  {  margin-top: 48px; }
  .mt6-ns {  margin-top: 64px; }
  .mt7-ns { margin-top: 96px; }

  .mv0-ns   {
    margin-top: 0;
    margin-bottom: 0;
  }
  .mv1-ns  {
    margin-top: 8px;
    margin-bottom: 8px;
  }
  .mv2-ns   {
    margin-top: 16px;
    margin-bottom: 16px;
  }
  .mv3-ns   {
    margin-top: 24px;
    margin-bottom: 24px;
  }
  .mv4-ns   {
    margin-top: 32px;
    margin-bottom: 32px;
  }
  .mv5-ns   {
    margin-top: 48px;
    margin-bottom: 48px;
  }
  .mv6-ns  {
    margin-top: 64px;
    margin-bottom: 64px;
  }
  .mv7-ns  {
    margin-top: 96px;
    margin-bottom: 96px;
  }

  .mh0-ns   {
    margin-left: 0;
    margin-right: 0;
  }
  .mh1-ns   {
    margin-left: 8px;
    margin-right: 8px;
  }
  .mh2-ns   {
    margin-left: 16px;
    margin-right: 16px;
  }
  .mh3-ns   {
    margin-left: 24px;
    margin-right: 24px;
  }
  .mh4-ns   {
    margin-left: 32px;
    margin-right: 32px;
  }
  .mh5-ns   {
    margin-left: 48px;
    margin-right: 48px;
  }
  .mh6-ns  {
    margin-left: 64px;
    margin-right: 64px;
  }
  .mh7-ns  {
    margin-left: 96px;
    margin-right: 96px;
  }

}@media screen and (min-width: 30em) and (max-width: 60em) {
  .pa0-m  {  padding: 0; }
  .pa1-m {  padding: 8px; }
  .pa2-m  {  padding: 16px; }
  .pa3-m  {  padding: 24px; }
  .pa4-m  {  padding: 32px; }
  .pa5-m  {  padding: 48px; }
  .pa6-m {  padding: 64px; }
  .pa7-m { padding: 96px; }

  .pl0-m  {  padding-left: 0; }
  .pl1-m {  padding-left: 8px; }
  .pl2-m  {  padding-left: 16px; }
  .pl3-m  {  padding-left: 24px; }
  .pl4-m  {  padding-left: 32px; }
  .pl5-m  {  padding-left: 48px; }
  .pl6-m {  padding-left: 64px; }
  .pl7-m { padding-left: 96px; }

  .pr0-m  {  padding-right: 0; }
  .pr1-m {  padding-right: 8px; }
  .pr2-m  {  padding-right: 16px; }
  .pr3-m  {  padding-right: 24px; }
  .pr4-m  {  padding-right: 32px; }
  .pr5-m  {  padding-right: 48px; }
  .pr6-m {  padding-right: 64px; }
  .pr7-m { padding-right: 96px; }

  .pb0-m  {  padding-bottom: 0; }
  .pb1-m {  padding-bottom: 8px; }
  .pb2-m  {  padding-bottom: 16px; }
  .pb3-m  {  padding-bottom: 24px; }
  .pb4-m  {  padding-bottom: 32px; }
  .pb5-m  {  padding-bottom: 48px; }
  .pb6-m {  padding-bottom: 64px; }
  .pb7-m { padding-bottom: 96px; }

  .pt0-m  {  padding-top: 0; }
  .pt1-m {  padding-top: 8px; }
  .pt2-m  {  padding-top: 16px; }
  .pt3-m  {  padding-top: 24px; }
  .pt4-m  {  padding-top: 32px; }
  .pt5-m  {  padding-top: 48px; }
  .pt6-m {  padding-top: 64px; }
  .pt7-m { padding-top: 96px; }

  .pv0-m {
    padding-top: 0;
    padding-bottom: 0;
  }
  .pv1-m {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .pv2-m {
    padding-top: 16px;
    padding-bottom: 16px;
  }
  .pv3-m {
    padding-top: 24px;
    padding-bottom: 24px;
  }
  .pv4-m {
    padding-top: 32px;
    padding-bottom: 32px;
  }
  .pv5-m {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .pv6-m {
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .pv7-m {
    padding-top: 96px;
    padding-bottom: 96px;
  }

  .ph0-m {
    padding-left: 0;
    padding-right: 0;
  }
  .ph1-m {
    padding-left: 8px;
    padding-right: 8px;
  }
  .ph2-m {
    padding-left: 16px;
    padding-right: 16px;
  }
  .ph3-m {
    padding-left: 24px;
    padding-right: 24px;
  }
  .ph4-m {
    padding-left: 32px;
    padding-right: 32px;
  }
  .ph5-m {
    padding-left: 48px;
    padding-right: 48px;
  }
  .ph6-m {
    padding-left: 64px;
    padding-right: 64px;
  }
  .ph7-m {
    padding-left: 96px;
    padding-right: 96px;
  }

  .ma0-m  {  margin: 0; }
  .ma1-m {  margin: 8px; }
  .ma2-m  {  margin: 16px; }
  .ma3-m  {  margin: 24px; }
  .ma4-m  {  margin: 32px; }
  .ma5-m  {  margin: 48px; }
  .ma6-m {  margin: 64px; }
  .ma7-m { margin: 96px; }

  .ml0-m  {  margin-left: 0; }
  .ml1-m {  margin-left: 8px; }
  .ml2-m  {  margin-left: 16px; }
  .ml3-m  {  margin-left: 24px; }
  .ml4-m  {  margin-left: 32px; }
  .ml5-m  {  margin-left: 48px; }
  .ml6-m {  margin-left: 64px; }
  .ml7-m { margin-left: 96px; }

  .mr0-m  {  margin-right: 0; }
  .mr1-m {  margin-right: 8px; }
  .mr2-m  {  margin-right: 16px; }
  .mr3-m  {  margin-right: 24px; }
  .mr4-m  {  margin-right: 32px; }
  .mr5-m  {  margin-right: 48px; }
  .mr6-m {  margin-right: 64px; }
  .mr7-m { margin-right: 96px; }

  .mb0-m  {  margin-bottom: 0; }
  .mb1-m {  margin-bottom: 8px; }
  .mb2-m  {  margin-bottom: 16px; }
  .mb3-m  {  margin-bottom: 24px; }
  .mb4-m  {  margin-bottom: 32px; }
  .mb5-m  {  margin-bottom: 48px; }
  .mb6-m {  margin-bottom: 64px; }
  .mb7-m { margin-bottom: 96px; }

  .mt0-m  {  margin-top: 0; }
  .mt1-m {  margin-top: 8px; }
  .mt2-m  {  margin-top: 16px; }
  .mt3-m  {  margin-top: 24px; }
  .mt4-m  {  margin-top: 32px; }
  .mt5-m  {  margin-top: 48px; }
  .mt6-m {  margin-top: 64px; }
  .mt7-m { margin-top: 96px; }

  .mv0-m {
    margin-top: 0;
    margin-bottom: 0;
  }
  .mv1-m {
    margin-top: 8px;
    margin-bottom: 8px;
  }
  .mv2-m {
    margin-top: 16px;
    margin-bottom: 16px;
  }
  .mv3-m {
    margin-top: 24px;
    margin-bottom: 24px;
  }
  .mv4-m {
    margin-top: 32px;
    margin-bottom: 32px;
  }
  .mv5-m {
    margin-top: 48px;
    margin-bottom: 48px;
  }
  .mv6-m {
    margin-top: 64px;
    margin-bottom: 64px;
  }
  .mv7-m {
    margin-top: 96px;
    margin-bottom: 96px;
  }

  .mh0-m {
    margin-left: 0;
    margin-right: 0;
  }
  .mh1-m {
    margin-left: 8px;
    margin-right: 8px;
  }
  .mh2-m {
    margin-left: 16px;
    margin-right: 16px;
  }
  .mh3-m {
    margin-left: 24px;
    margin-right: 24px;
  }
  .mh4-m {
    margin-left: 32px;
    margin-right: 32px;
  }
  .mh5-m {
    margin-left: 48px;
    margin-right: 48px;
  }
  .mh6-m {
    margin-left: 64px;
    margin-right: 64px;
  }
  .mh7-m {
    margin-left: 96px;
    margin-right: 96px;
  }

}@media screen and (min-width: 60em) {
  .pa0-l  {  padding: 0; }
  .pa1-l {  padding: 8px; }
  .pa2-l  {  padding: 16px; }
  .pa3-l  {  padding: 24px; }
  .pa4-l  {  padding: 32px; }
  .pa5-l  {  padding: 48px; }
  .pa6-l {  padding: 64px; }
  .pa7-l { padding: 96px; }

  .pl0-l  {  padding-left: 0; }
  .pl1-l {  padding-left: 8px; }
  .pl2-l  {  padding-left: 16px; }
  .pl3-l  {  padding-left: 24px; }
  .pl4-l  {  padding-left: 32px; }
  .pl5-l  {  padding-left: 48px; }
  .pl6-l {  padding-left: 64px; }
  .pl7-l { padding-left: 96px; }

  .pr0-l  {  padding-right: 0; }
  .pr1-l {  padding-right: 8px; }
  .pr2-l  {  padding-right: 16px; }
  .pr3-l  {  padding-right: 24px; }
  .pr4-l  {  padding-right: 32px; }
  .pr5-l  {  padding-right: 48px; }
  .pr6-l {  padding-right: 64px; }
  .pr7-l { padding-right: 96px; }

  .pb0-l  {  padding-bottom: 0; }
  .pb1-l {  padding-bottom: 8px; }
  .pb2-l  {  padding-bottom: 16px; }
  .pb3-l  {  padding-bottom: 24px; }
  .pb4-l  {  padding-bottom: 32px; }
  .pb5-l  {  padding-bottom: 48px; }
  .pb6-l {  padding-bottom: 64px; }
  .pb7-l { padding-bottom: 96px; }

  .pt0-l  {  padding-top: 0; }
  .pt1-l {  padding-top: 8px; }
  .pt2-l  {  padding-top: 16px; }
  .pt3-l  {  padding-top: 24px; }
  .pt4-l  {  padding-top: 32px; }
  .pt5-l  {  padding-top: 48px; }
  .pt6-l {  padding-top: 64px; }
  .pt7-l { padding-top: 96px; }

  .pv0-l {
    padding-top: 0;
    padding-bottom: 0;
  }
  .pv1-l {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .pv2-l {
    padding-top: 16px;
    padding-bottom: 16px;
  }
  .pv3-l {
    padding-top: 24px;
    padding-bottom: 24px;
  }
  .pv4-l {
    padding-top: 32px;
    padding-bottom: 32px;
  }
  .pv5-l {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .pv6-l {
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .pv7-l {
    padding-top: 96px;
    padding-bottom: 96px;
  }

  .ph0-l {
    padding-left: 0;
    padding-right: 0;
  }
  .ph1-l {
    padding-left: 8px;
    padding-right: 8px;
  }
  .ph2-l {
    padding-left: 16px;
    padding-right: 16px;
  }
  .ph3-l {
    padding-left: 24px;
    padding-right: 24px;
  }
  .ph4-l {
    padding-left: 32px;
    padding-right: 32px;
  }
  .ph5-l {
    padding-left: 48px;
    padding-right: 48px;
  }
  .ph6-l {
    padding-left: 64px;
    padding-right: 64px;
  }
  .ph7-l {
    padding-left: 96px;
    padding-right: 96px;
  }

  .ma0-l  {  margin: 0; }
  .ma1-l {  margin: 8px; }
  .ma2-l  {  margin: 16px; }
  .ma3-l  {  margin: 24px; }
  .ma4-l  {  margin: 32px; }
  .ma5-l  {  margin: 48px; }
  .ma6-l {  margin: 64px; }
  .ma7-l { margin: 96px; }

  .ml0-l  {  margin-left: 0; }
  .ml1-l {  margin-left: 8px; }
  .ml2-l  {  margin-left: 16px; }
  .ml3-l  {  margin-left: 24px; }
  .ml4-l  {  margin-left: 32px; }
  .ml5-l  {  margin-left: 48px; }
  .ml6-l {  margin-left: 64px; }
  .ml7-l { margin-left: 96px; }

  .mr0-l  {  margin-right: 0; }
  .mr1-l {  margin-right: 8px; }
  .mr2-l  {  margin-right: 16px; }
  .mr3-l  {  margin-right: 24px; }
  .mr4-l  {  margin-right: 32px; }
  .mr5-l  {  margin-right: 48px; }
  .mr6-l {  margin-right: 64px; }
  .mr7-l { margin-right: 96px; }

  .mb0-l  {  margin-bottom: 0; }
  .mb1-l {  margin-bottom: 8px; }
  .mb2-l  {  margin-bottom: 16px; }
  .mb3-l  {  margin-bottom: 24px; }
  .mb4-l  {  margin-bottom: 32px; }
  .mb5-l  {  margin-bottom: 48px; }
  .mb6-l {  margin-bottom: 64px; }
  .mb7-l { margin-bottom: 96px; }

  .mt0-l  {  margin-top: 0; }
  .mt1-l {  margin-top: 8px; }
  .mt2-l  {  margin-top: 16px; }
  .mt3-l  {  margin-top: 24px; }
  .mt4-l  {  margin-top: 32px; }
  .mt5-l  {  margin-top: 48px; }
  .mt6-l {  margin-top: 64px; }
  .mt7-l { margin-top: 96px; }

  .mv0-l {
    margin-top: 0;
    margin-bottom: 0;
  }
  .mv1-l {
    margin-top: 8px;
    margin-bottom: 8px;
  }
  .mv2-l {
    margin-top: 16px;
    margin-bottom: 16px;
  }
  .mv3-l {
    margin-top: 24px;
    margin-bottom: 24px;
  }
  .mv4-l {
    margin-top: 32px;
    margin-bottom: 32px;
  }
  .mv5-l {
    margin-top: 48px;
    margin-bottom: 48px;
  }
  .mv6-l {
    margin-top: 64px;
    margin-bottom: 64px;
  }
  .mv7-l {
    margin-top: 96px;
    margin-bottom: 96px;
  }

  .mh0-l {
    margin-left: 0;
    margin-right: 0;
  }
  .mh1-l {
    margin-left: 8px;
    margin-right: 8px;
  }
  .mh2-l {
    margin-left: 16px;
    margin-right: 16px;
  }
  .mh3-l {
    margin-left: 24px;
    margin-right: 24px;
  }
  .mh4-l {
    margin-left: 32px;
    margin-right: 32px;
  }
  .mh5-l {
    margin-left: 48px;
    margin-right: 48px;
  }
  .mh6-l {
    margin-left: 64px;
    margin-right: 64px;
  }
  .mh7-l {
    margin-left: 96px;
    margin-right: 96px;
  }
}/*

   POSITIONING
   Docs: http://tachyons.io/docs/layout/position/

   Media Query Extensions:
     -ns = not-small
     -m  = medium
     -l  = large

*/.static { position: static; }.relative  { position: relative; }.absolute  { position: absolute; }.fixed  { position: fixed; }@media screen and (min-width: 30em) {
  .static-ns { position: static; }
  .relative-ns  { position: relative; }
  .absolute-ns  { position: absolute; }
  .fixed-ns  { position: fixed; }
}@media screen and (min-width: 30em) and (max-width: 60em) {
  .static-m { position: static; }
  .relative-m  { position: relative; }
  .absolute-m  { position: absolute; }
  .fixed-m  { position: fixed; }
}@media screen and (min-width: 60em) {
  .static-l { position: static; }
  .relative-l  { position: relative; }
  .absolute-l  { position: absolute; }
  .fixed-l  { position: fixed; }
}/* BASICS */.CodeMirror {
  /* Set height, width, borders, and global font properties here */
  font-family: monospace;
  height: 300px;
  color: black;
  direction: ltr;
}/* PADDING */.CodeMirror-lines {
  padding: 4px 0; /* Vertical padding around content */
}.CodeMirror pre {
  padding: 0 4px; /* Horizontal padding of content */
}.CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
  background-color: white; /* The little square between H and V scrollbars */
}/* GUTTER */.CodeMirror-gutters {
  border-right: 1px solid #ddd;
  background-color: #f7f7f7;
  white-space: nowrap;
}.CodeMirror-linenumbers {}.CodeMirror-linenumber {
  padding: 0 3px 0 5px;
  min-width: 20px;
  text-align: right;
  color: #999;
  white-space: nowrap;
}.CodeMirror-guttermarker { color: black; }.CodeMirror-guttermarker-subtle { color: #999; }/* CURSOR */.CodeMirror-cursor {
  border-left: 1px solid black;
  border-right: none;
  width: 0;
}/* Shown when moving in bi-directional text */.CodeMirror div.CodeMirror-secondarycursor {
  border-left: 1px solid silver;
}.cm-fat-cursor .CodeMirror-cursor {
  width: auto;
  border: 0 !important;
  background: #7e7;
}.cm-fat-cursor div.CodeMirror-cursors {
  z-index: 1;
}.cm-fat-cursor-mark {
  background-color: rgba(20, 255, 20, .5);
  -webkit-animation: blink 1.06s steps(1) infinite;
  animation: blink 1.06s steps(1) infinite;
}.cm-animate-fat-cursor {
  width: auto;
  border: 0;
  -webkit-animation: blink 1.06s steps(1) infinite;
  animation: blink 1.06s steps(1) infinite;
  background-color: #7e7;
}@-webkit-keyframes blink {
  0% {}
  50% { background-color: transparent; }
  100% {}
}@keyframes blink {
  0% {}
  50% { background-color: transparent; }
  100% {}
}/* Can style cursor different in overwrite (non-insert) mode */.CodeMirror-overwrite .CodeMirror-cursor {}.cm-tab { display: inline-block; text-decoration: inherit; }.CodeMirror-rulers {
  position: absolute;
  left: 0; right: 0; top: -50px; bottom: -20px;
  overflow: hidden;
}.CodeMirror-ruler {
  border-left: 1px solid #ccc;
  top: 0; bottom: 0;
  position: absolute;
}/* DEFAULT THEME */.cm-s-default .cm-header {color: blue;}.cm-s-default .cm-quote {color: #090;}.cm-negative {color: #d44;}.cm-positive {color: #292;}.cm-header, .cm-strong {font-weight: bold;}.cm-em {font-style: italic;}.cm-link {text-decoration: underline;}.cm-strikethrough {text-decoration: line-through;}.cm-s-default .cm-keyword {color: #708;}.cm-s-default .cm-atom {color: #219;}.cm-s-default .cm-number {color: #164;}.cm-s-default .cm-def {color: #00f;}.cm-s-default .cm-variable,
.cm-s-default .cm-punctuation,
.cm-s-default .cm-property,
.cm-s-default .cm-operator {}.cm-s-default .cm-variable-2 {color: #05a;}.cm-s-default .cm-variable-3, .cm-s-default .cm-type {color: #085;}.cm-s-default .cm-comment {color: #a50;}.cm-s-default .cm-string {color: #a11;}.cm-s-default .cm-string-2 {color: #f50;}.cm-s-default .cm-meta {color: #555;}.cm-s-default .cm-qualifier {color: #555;}.cm-s-default .cm-builtin {color: #30a;}.cm-s-default .cm-bracket {color: #997;}.cm-s-default .cm-tag {color: #170;}.cm-s-default .cm-attribute {color: #00c;}.cm-s-default .cm-hr {color: #999;}.cm-s-default .cm-link {color: #00c;}.cm-s-default .cm-error {color: #f00;}.cm-invalidchar {color: #f00;}.CodeMirror-composing { border-bottom: 2px solid; }/* Default styles for common addons */div.CodeMirror span.CodeMirror-matchingbracket {color: #0b0;}div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #a22;}.CodeMirror-matchingtag { background: rgba(255, 150, 0, .3); }.CodeMirror-activeline-background {background: #e8f2ff;}/* STOP *//* The rest of this file contains styles related to the mechanics of
   the editor. You probably shouldn't touch them. */.CodeMirror {
  position: relative;
  overflow: hidden;
  background: white;
}.CodeMirror-scroll {
  overflow: scroll !important; /* Things will break if this is overridden */
  /* 30px is the magic margin used to hide the element's real scrollbars */
  /* See overflow: hidden in .CodeMirror */
  margin-bottom: -30px; margin-right: -30px;
  padding-bottom: 30px;
  height: 100%;
  outline: none; /* Prevent dragging from highlighting the element */
  position: relative;
}.CodeMirror-sizer {
  position: relative;
  border-right: 30px solid transparent;
}/* The fake, visible scrollbars. Used to force redraw during scrolling
   before actual scrolling happens, thus preventing shaking and
   flickering artifacts. */.CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
  position: absolute;
  z-index: 6;
  display: none;
}.CodeMirror-vscrollbar {
  right: 0; top: 0;
  overflow-x: hidden;
  overflow-y: scroll;
}.CodeMirror-hscrollbar {
  bottom: 0; left: 0;
  overflow-y: hidden;
  overflow-x: scroll;
}.CodeMirror-scrollbar-filler {
  right: 0; bottom: 0;
}.CodeMirror-gutter-filler {
  left: 0; bottom: 0;
}.CodeMirror-gutters {
  position: absolute; left: 0; top: 0;
  min-height: 100%;
  z-index: 3;
}.CodeMirror-gutter {
  white-space: normal;
  height: 100%;
  display: inline-block;
  vertical-align: top;
  margin-bottom: -30px;
}.CodeMirror-gutter-wrapper {
  position: absolute;
  z-index: 4;
  background: none !important;
  border: none !important;
}.CodeMirror-gutter-background {
  position: absolute;
  top: 0; bottom: 0;
  z-index: 4;
}.CodeMirror-gutter-elt {
  position: absolute;
  cursor: default;
  z-index: 4;
}.CodeMirror-gutter-wrapper ::-moz-selection { background-color: transparent }.CodeMirror-gutter-wrapper ::selection { background-color: transparent }.CodeMirror-gutter-wrapper ::-moz-selection { background-color: transparent }.CodeMirror-lines {
  cursor: text;
  min-height: 1px; /* prevents collapsing before first draw */
}.CodeMirror pre {
  /* Reset some styles that the rest of the page might have set */ border-radius: 0;
  border-width: 0;
  background: transparent;
  font-family: inherit;
  font-size: inherit;
  margin: 0;
  white-space: pre;
  word-wrap: normal;
  line-height: inherit;
  color: inherit;
  z-index: 2;
  position: relative;
  overflow: visible;
  -webkit-tap-highlight-color: transparent;
  -webkit-font-variant-ligatures: contextual;
  -webkit-font-feature-settings: "calt";
          font-feature-settings: "calt";
  font-variant-ligatures: contextual;
}.CodeMirror-wrap pre {
  word-wrap: break-word;
  white-space: pre-wrap;
  word-break: normal;
}.CodeMirror-linebackground {
  position: absolute;
  left: 0; right: 0; top: 0; bottom: 0;
  z-index: 0;
}.CodeMirror-linewidget {
  position: relative;
  z-index: 2;
  padding: 0.1px; /* Force widget margins to stay inside of the container */
}.CodeMirror-widget {}.CodeMirror-rtl pre { direction: rtl; }.CodeMirror-code {
  outline: none;
}/* Force content-box sizing for the elements where we expect it */.CodeMirror-scroll,
.CodeMirror-sizer,
.CodeMirror-gutter,
.CodeMirror-gutters,
.CodeMirror-linenumber {
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
}.CodeMirror-measure {
  position: absolute;
  width: 100%;
  height: 0;
  overflow: hidden;
  visibility: hidden;
}.CodeMirror-cursor {
  position: absolute;
  pointer-events: none;
}.CodeMirror-measure pre { position: static; }div.CodeMirror-cursors {
  visibility: hidden;
  position: relative;
  z-index: 3;
}div.CodeMirror-dragcursors {
  visibility: visible;
}.CodeMirror-focused div.CodeMirror-cursors {
  visibility: visible;
}.CodeMirror-selected { background: #d9d9d9; }.CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; }.CodeMirror-crosshair { cursor: crosshair; }.CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::-moz-selection { background: #d7d4f0; }.CodeMirror-line::selection, .CodeMirror-line > span::selection, .CodeMirror-line > span > span::selection { background: #d7d4f0; }.CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::-moz-selection { background: #d7d4f0; }.cm-searching {
  background-color: #ffa;
  background-color: rgba(255, 255, 0, .4);
}/* Used to force a border model for a node */.cm-force-border { padding-right: .1px; }@media print {
  /* Hide the cursor when printing */
  .CodeMirror div.CodeMirror-cursors {
    visibility: hidden;
  }
}/* See issue #2901 */.cm-tab-wrap-hack:after { content: ''; }/* Help users use markselection to safely style text background */span.CodeMirror-selectedtext { background: none; }/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*//* Media Queries *//*!
 * animate.css -http://daneden.me/animate
 * Version - 3.5.2
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2017 Daniel Eden
 */.animated {
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}.animated.infinite {
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}.animated.hinge {
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
}.animated.flipOutX,
.animated.flipOutY,
.animated.bounceIn,
.animated.bounceOut {
  -webkit-animation-duration: .75s;
          animation-duration: .75s;
}@-webkit-keyframes bounce {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
            animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -30px, 0);
            transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
            animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -15px, 0);
            transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-4px,0);
            transform: translate3d(0,-4px,0);
  }
}@keyframes bounce {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
            animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -30px, 0);
            transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
            animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -15px, 0);
            transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-4px,0);
            transform: translate3d(0,-4px,0);
  }
}.bounce {
  -webkit-animation-name: bounce;
          animation-name: bounce;
  -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
}@-webkit-keyframes flash {
  from, 50%, to {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}@keyframes flash {
  from, 50%, to {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}.flash {
  -webkit-animation-name: flash;
          animation-name: flash;
}/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
            transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}@keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
            transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}.pulse {
  -webkit-animation-name: pulse;
          animation-name: pulse;
}@-webkit-keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
            transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
            transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
            transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(.95, 1.05, 1);
            transform: scale3d(.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, .95, 1);
            transform: scale3d(1.05, .95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}@keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
            transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
            transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
            transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(.95, 1.05, 1);
            transform: scale3d(.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, .95, 1);
            transform: scale3d(1.05, .95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}.rubberBand {
  -webkit-animation-name: rubberBand;
          animation-name: rubberBand;
}@-webkit-keyframes shake {
  from, to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
            transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
            transform: translate3d(10px, 0, 0);
  }
}@keyframes shake {
  from, to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
            transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
            transform: translate3d(10px, 0, 0);
  }
}.shake {
  -webkit-animation-name: shake;
          animation-name: shake;
}@-webkit-keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
            transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
            transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
            transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
            transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}@keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
            transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
            transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
            transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
            transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}.headShake {
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-name: headShake;
          animation-name: headShake;
}@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
            transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
            transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
            transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
            transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
            transform: rotate3d(0, 0, 1, 0deg);
  }
}@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
            transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
            transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
            transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
            transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
            transform: rotate3d(0, 0, 1, 0deg);
  }
}.swing {
  -webkit-transform-origin: top center;
          transform-origin: top center;
  -webkit-animation-name: swing;
          animation-name: swing;
}@-webkit-keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
            transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}@keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
            transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}.tada {
  -webkit-animation-name: tada;
          animation-name: tada;
}/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */@-webkit-keyframes wobble {
  from {
    -webkit-transform: none;
            transform: none;
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
            transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
            transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
            transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
            transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
            transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  to {
    -webkit-transform: none;
            transform: none;
  }
}@keyframes wobble {
  from {
    -webkit-transform: none;
            transform: none;
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
            transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
            transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
            transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
            transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
            transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  to {
    -webkit-transform: none;
            transform: none;
  }
}.wobble {
  -webkit-animation-name: wobble;
          animation-name: wobble;
}@-webkit-keyframes jello {
  from, 11.1%, to {
    -webkit-transform: none;
            transform: none;
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
            transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
            transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
            transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
            transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
            transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
            transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
            transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}@keyframes jello {
  from, 11.1%, to {
    -webkit-transform: none;
            transform: none;
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
            transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
            transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
            transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
            transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
            transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
            transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
            transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}.jello {
  -webkit-animation-name: jello;
          animation-name: jello;
  -webkit-transform-origin: center;
          transform-origin: center;
}@-webkit-keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(.9, .9, .9);
            transform: scale3d(.9, .9, .9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
            transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(.97, .97, .97);
            transform: scale3d(.97, .97, .97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}@keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(.9, .9, .9);
            transform: scale3d(.9, .9, .9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
            transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(.97, .97, .97);
            transform: scale3d(.97, .97, .97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}.bounceIn {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
}@-webkit-keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
            transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
            transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
            transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
            transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: none;
            transform: none;
  }
}@keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
            transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
            transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
            transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
            transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: none;
            transform: none;
  }
}.bounceInDown {
  -webkit-animation-name: bounceInDown;
          animation-name: bounceInDown;
}@-webkit-keyframes bounceInLeft {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
            transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
            transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
            transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
            transform: translate3d(5px, 0, 0);
  }

  to {
    -webkit-transform: none;
            transform: none;
  }
}@keyframes bounceInLeft {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
            transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
            transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
            transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
            transform: translate3d(5px, 0, 0);
  }

  to {
    -webkit-transform: none;
            transform: none;
  }
}.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
          animation-name: bounceInLeft;
}@-webkit-keyframes bounceInRight {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
            transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
            transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
            transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
            transform: translate3d(-5px, 0, 0);
  }

  to {
    -webkit-transform: none;
            transform: none;
  }
}@keyframes bounceInRight {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
            transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
            transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
            transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
            transform: translate3d(-5px, 0, 0);
  }

  to {
    -webkit-transform: none;
            transform: none;
  }
}.bounceInRight {
  -webkit-animation-name: bounceInRight;
          animation-name: bounceInRight;
}@-webkit-keyframes bounceInUp {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
            transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
            transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
            transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}@keyframes bounceInUp {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
            transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
            transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
            transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}.bounceInUp {
  -webkit-animation-name: bounceInUp;
          animation-name: bounceInUp;
}@-webkit-keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(.9, .9, .9);
            transform: scale3d(.9, .9, .9);
  }

  50%, 55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }
}@keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(.9, .9, .9);
            transform: scale3d(.9, .9, .9);
  }

  50%, 55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }
}.bounceOut {
  -webkit-animation-name: bounceOut;
          animation-name: bounceOut;
}@-webkit-keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
            transform: translate3d(0, 10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
            transform: translate3d(0, 2000px, 0);
  }
}@keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
            transform: translate3d(0, 10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
            transform: translate3d(0, 2000px, 0);
  }
}.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
          animation-name: bounceOutDown;
}@-webkit-keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
            transform: translate3d(20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
            transform: translate3d(-2000px, 0, 0);
  }
}@keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
            transform: translate3d(20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
            transform: translate3d(-2000px, 0, 0);
  }
}.bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
          animation-name: bounceOutLeft;
}@-webkit-keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
            transform: translate3d(-20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
            transform: translate3d(2000px, 0, 0);
  }
}@keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
            transform: translate3d(-20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
            transform: translate3d(2000px, 0, 0);
  }
}.bounceOutRight {
  -webkit-animation-name: bounceOutRight;
          animation-name: bounceOutRight;
}@-webkit-keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
            transform: translate3d(0, -10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
            transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
            transform: translate3d(0, -2000px, 0);
  }
}@keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
            transform: translate3d(0, -10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
            transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
            transform: translate3d(0, -2000px, 0);
  }
}.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
          animation-name: bounceOutUp;
}@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}.fadeIn {
  -webkit-animation-name: fadeIn;
          animation-name: fadeIn;
}@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}.fadeInDown {
  -webkit-animation-name: fadeInDown;
          animation-name: fadeInDown;
}@-webkit-keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
            transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}@keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
            transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
          animation-name: fadeInDownBig;
}@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
          animation-name: fadeInLeft;
}@-webkit-keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
            transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
            transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
          animation-name: fadeInLeftBig;
}@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}.fadeInRight {
  -webkit-animation-name: fadeInRight;
          animation-name: fadeInRight;
}@-webkit-keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
            transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}@keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
            transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
          animation-name: fadeInRightBig;
}@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}.fadeInUp {
  -webkit-animation-name: fadeInUp;
          animation-name: fadeInUp;
}@-webkit-keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
            transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}@keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
            transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
          animation-name: fadeInUpBig;
}@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}.fadeOut {
  -webkit-animation-name: fadeOut;
          animation-name: fadeOut;
}@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
  }
}@keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
  }
}.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
          animation-name: fadeOutDown;
}@-webkit-keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
            transform: translate3d(0, 2000px, 0);
  }
}@keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
            transform: translate3d(0, 2000px, 0);
  }
}.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
          animation-name: fadeOutDownBig;
}@-webkit-keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
  }
}@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
  }
}.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
          animation-name: fadeOutLeft;
}@-webkit-keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
            transform: translate3d(-2000px, 0, 0);
  }
}@keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
            transform: translate3d(-2000px, 0, 0);
  }
}.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
          animation-name: fadeOutLeftBig;
}@-webkit-keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0);
  }
}@keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0);
  }
}.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
          animation-name: fadeOutRight;
}@-webkit-keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
            transform: translate3d(2000px, 0, 0);
  }
}@keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
            transform: translate3d(2000px, 0, 0);
  }
}.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
          animation-name: fadeOutRightBig;
}@-webkit-keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
  }
}@keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
  }
}.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
          animation-name: fadeOutUp;
}@-webkit-keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
            transform: translate3d(0, -2000px, 0);
  }
}@keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
            transform: translate3d(0, -2000px, 0);
  }
}.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
          animation-name: fadeOutUpBig;
}@-webkit-keyframes flip {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
            transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
            transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
            transform: perspective(400px) scale3d(.95, .95, .95);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }

  to {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
}@keyframes flip {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
            transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
            transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
            transform: perspective(400px) scale3d(.95, .95, .95);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }

  to {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
}.animated.flip {
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
          animation-name: flip;
}@-webkit-keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
            transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
            transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
            transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
            transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
  }
}@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
            transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
            transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
            transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
            transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
  }
}.flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
          animation-name: flipInX;
}@-webkit-keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
  }
}@keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
  }
}.flipInY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
          animation-name: flipInY;
}@-webkit-keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
            transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
            transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}@keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
            transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
            transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}.flipOutX {
  -webkit-animation-name: flipOutX;
          animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}@-webkit-keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}@keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}.flipOutY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
          animation-name: flipOutY;
}@-webkit-keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
            transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
            transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
            transform: skewX(-5deg);
    opacity: 1;
  }

  to {
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}@keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
            transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
            transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
            transform: skewX(-5deg);
    opacity: 1;
  }

  to {
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}.lightSpeedIn {
  -webkit-animation-name: lightSpeedIn;
          animation-name: lightSpeedIn;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
}@-webkit-keyframes lightSpeedOut {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
            transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}@keyframes lightSpeedOut {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
            transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}.lightSpeedOut {
  -webkit-animation-name: lightSpeedOut;
          animation-name: lightSpeedOut;
  -webkit-animation-timing-function: ease-in;
          animation-timing-function: ease-in;
}@-webkit-keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
            transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}@keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
            transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}.rotateIn {
  -webkit-animation-name: rotateIn;
          animation-name: rotateIn;
}@-webkit-keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
            transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}@keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
            transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
          animation-name: rotateInDownLeft;
}@-webkit-keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
            transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}@keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
            transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
          animation-name: rotateInDownRight;
}@-webkit-keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
            transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}@keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
            transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}.rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
          animation-name: rotateInUpLeft;
}@-webkit-keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
            transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}@keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
            transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}.rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
          animation-name: rotateInUpRight;
}@-webkit-keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
            transform-origin: center;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
            transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}@keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
            transform-origin: center;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
            transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}.rotateOut {
  -webkit-animation-name: rotateOut;
          animation-name: rotateOut;
}@-webkit-keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
            transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}@keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
            transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}.rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
          animation-name: rotateOutDownLeft;
}@-webkit-keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
            transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}@keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
            transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}.rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
          animation-name: rotateOutDownRight;
}@-webkit-keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
            transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}@keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
            transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}.rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
          animation-name: rotateOutUpLeft;
}@-webkit-keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
            transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}@keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
            transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}.rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
          animation-name: rotateOutUpRight;
}@-webkit-keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }

  20%, 60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
            transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }

  40%, 80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
            transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(0, 700px, 0);
            transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}@keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }

  20%, 60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
            transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }

  40%, 80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
            transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(0, 700px, 0);
            transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}.hinge {
  -webkit-animation-name: hinge;
          animation-name: hinge;
}@-webkit-keyframes jackInTheBox {
  from {
    opacity: 0;
    -webkit-transform: scale(0.1) rotate(30deg);
            transform: scale(0.1) rotate(30deg);
    -webkit-transform-origin: center bottom;
            transform-origin: center bottom;
  }

  50% {
    -webkit-transform: rotate(-10deg);
            transform: rotate(-10deg);
  }

  70% {
    -webkit-transform: rotate(3deg);
            transform: rotate(3deg);
  }

  to {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}@keyframes jackInTheBox {
  from {
    opacity: 0;
    -webkit-transform: scale(0.1) rotate(30deg);
            transform: scale(0.1) rotate(30deg);
    -webkit-transform-origin: center bottom;
            transform-origin: center bottom;
  }

  50% {
    -webkit-transform: rotate(-10deg);
            transform: rotate(-10deg);
  }

  70% {
    -webkit-transform: rotate(3deg);
            transform: rotate(3deg);
  }

  to {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}.jackInTheBox {
  -webkit-animation-name: jackInTheBox;
          animation-name: jackInTheBox;
}/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */@-webkit-keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
            transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}@keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
            transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}.rollIn {
  -webkit-animation-name: rollIn;
          animation-name: rollIn;
}/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */@-webkit-keyframes rollOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
            transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}@keyframes rollOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
            transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}.rollOut {
  -webkit-animation-name: rollOut;
          animation-name: rollOut;
}@-webkit-keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}.zoomIn {
  -webkit-animation-name: zoomIn;
          animation-name: zoomIn;
}@-webkit-keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
            transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
            transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}@keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
            transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
            transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}.zoomInDown {
  -webkit-animation-name: zoomInDown;
          animation-name: zoomInDown;
}@-webkit-keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
            transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}@keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
            transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}.zoomInLeft {
  -webkit-animation-name: zoomInLeft;
          animation-name: zoomInLeft;
}@-webkit-keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
            transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}@keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
            transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}.zoomInRight {
  -webkit-animation-name: zoomInRight;
          animation-name: zoomInRight;
}@-webkit-keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
            transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
            transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}@keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
            transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
            transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}.zoomInUp {
  -webkit-animation-name: zoomInUp;
          animation-name: zoomInUp;
}@-webkit-keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  to {
    opacity: 0;
  }
}@keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  to {
    opacity: 0;
  }
}.zoomOut {
  -webkit-animation-name: zoomOut;
          animation-name: zoomOut;
}@-webkit-keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
            transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
            transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
            transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}@keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
            transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
            transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
            transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}.zoomOutDown {
  -webkit-animation-name: zoomOutDown;
          animation-name: zoomOutDown;
}@-webkit-keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
            transform: scale(.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
            transform-origin: left center;
  }
}@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
            transform: scale(.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
            transform-origin: left center;
  }
}.zoomOutLeft {
  -webkit-animation-name: zoomOutLeft;
          animation-name: zoomOutLeft;
}@-webkit-keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
            transform: scale(.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
            transform-origin: right center;
  }
}@keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
            transform: scale(.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
            transform-origin: right center;
  }
}.zoomOutRight {
  -webkit-animation-name: zoomOutRight;
          animation-name: zoomOutRight;
}@-webkit-keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
            transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
            transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
            transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}@keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
            transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
            transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
            transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}.zoomOutUp {
  -webkit-animation-name: zoomOutUp;
          animation-name: zoomOutUp;
}@-webkit-keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}@keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}.slideInDown {
  -webkit-animation-name: slideInDown;
          animation-name: slideInDown;
}@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}.slideInLeft {
  -webkit-animation-name: slideInLeft;
          animation-name: slideInLeft;
}@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}.slideInRight {
  -webkit-animation-name: slideInRight;
          animation-name: slideInRight;
}@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}.slideInUp {
  -webkit-animation-name: slideInUp;
          animation-name: slideInUp;
}@-webkit-keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
  }
}@keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
  }
}.slideOutDown {
  -webkit-animation-name: slideOutDown;
          animation-name: slideOutDown;
}@-webkit-keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
  }
}@keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
  }
}.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
          animation-name: slideOutLeft;
}@-webkit-keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0);
  }
}@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0);
  }
}.slideOutRight {
  -webkit-animation-name: slideOutRight;
          animation-name: slideOutRight;
}@-webkit-keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
  }
}@keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
  }
}.slideOutUp {
  -webkit-animation-name: slideOutUp;
          animation-name: slideOutUp;
}.react-toggle {
  -ms-touch-action: pan-x;
      touch-action: pan-x;

  display: inline-block;
  position: relative;
  cursor: pointer;
  background-color: transparent;
  border: 0;
  padding: 0;
  margin: 0 12px;

  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;

  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
}.react-toggle-screenreader-only {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}.react-toggle--disabled {
  cursor: not-allowed;
  opacity: 0.5;
  -webkit-transition: opacity 0.25s;
  transition: opacity 0.25s;
}.react-toggle-track {
  width: 64px;
  height: 32px;
  padding: 0;
  border-radius: 30px;
  background-color: none;
  border: 1px solid rgb(255, 255, 255);
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}.react-toggle:hover:not(.react-toggle--disabled) .react-toggle-track {
  background-color: rgba(255, 255, 255, 0.1);
}/* .react-toggle--checked .react-toggle-track {
  background-color: color(#fff a(35%));
} */.react-toggle--checked:hover:not(.react-toggle--disabled) .react-toggle-track {
  background-color: rgba(255, 255, 255, 0.1);
}.react-toggle-track-check {
  position: absolute;
  width: 14px;
  height: 10px;
  top: 0px;
  bottom: 0px;
  margin-top: auto;
  margin-bottom: auto;
  line-height: 0;
  left: 8px;
  opacity: 0;
  -webkit-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}.react-toggle--checked .react-toggle-track-check {
  opacity: 1;
  -webkit-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}.react-toggle-track-x {
  position: absolute;
  width: 10px;
  height: 10px;
  top: 0px;
  bottom: 0px;
  margin-top: auto;
  margin-bottom: auto;
  line-height: 0;
  right: 10px;
  opacity: 1;
  -webkit-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}.react-toggle--checked .react-toggle-track-x {
  opacity: 0;
}.react-toggle-thumb {
  -webkit-transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0ms;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0ms;
  position: absolute;
  top: 3px;
  left: 2px;
  width: 26px;
  height: 26px;
  /* border: 1px solid #4D4D4D; */
  border-radius: 50%;
  background-color: rgb(255, 255, 255);

  -webkit-box-sizing: border-box;
  box-sizing: border-box;

  -webkit-transition: all 0.25s ease;
  transition: all 0.25s ease;
}.react-toggle--checked .react-toggle-thumb {
  left: 36px;
  /* border-color: #19AB27; */
}/* .react-toggle--focus .react-toggle-thumb {
  -webkit-box-shadow: 0px 0px 3px 2px #0099E0;
  -moz-box-shadow: 0px 0px 3px 2px #0099E0;
  box-shadow: 0px 0px 2px 3px #0099E0;
}

.react-toggle:active:not(.react-toggle--disabled) .react-toggle-thumb {
  -webkit-box-shadow: 0px 0px 5px 5px #0099E0;
  -moz-box-shadow: 0px 0px 5px 5px #0099E0;
  box-shadow: 0px 0px 5px 5px #0099E0;
} */.container {
  max-width: 1170px;
  margin: 0 auto;
}.box-shadow {
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, .05);
          box-shadow: 0 2px 4px rgba(0, 0, 0, .05);
}.hidden {
  visibility: hidden;
}.faded {
  opacity: 0.5;
}.font-small {
  font-size:16px;
}button, input, optgroup, select, textarea {
  font-family: 'Poppins',sans-serif;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}.material-input {
  border: none;
  border-bottom: 1px solid rgba(255, 255, 255, .35);
  background: none;
  color: rgba(255, 255, 255, .35);
  font-weight: 300;
  text-align: right;
}.with-tooltip:after {
  content: "i";
  background: rgba(138, 138, 138, 0.52157);
  width: 18px;
  height: 18px;
  display: inline-block;
  color: white;
  font-weight: 600;
  border-radius: 50%;
  font-size: 14px;
  margin-left: 4px;
}b, strong {
  font-weight: 600;
}@keyframes blink {
  50% {
    color: transparent
  }
}.loader__dot { -webkit-animation: 1s blink infinite; animation: 1s blink infinite }.loader__dot:nth-child(2) { -webkit-animation-delay: 250ms; animation-delay: 250ms }.loader__dot:nth-child(3) { -webkit-animation-delay: 500ms; animation-delay: 500ms }:root {
}* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}input {
  outline: 0;
}.btn {
  padding-bottom: .75rem;
  padding-left: 2rem;
  padding-right: 2rem;
  border-width: 2px;
  display: inline-block;
  border-radius: .25rem;
  letter-spacing: .1em;
  cursor: pointer;
  text-align: center;
  padding-top: .85rem;
  font-size: 16px;
  
  text-decoration: none;
}.btn.btn-small {
   padding: 5px 10px;
 }.btn-purple {
  border-radius: 4px;
}.btn-purple:not(.btn-ghost) {
    color: white;
    background: #0568fd;
    border: none;
  }.btn-purple.btn-ghost {
    color: #0568fd;
    background: transparent;
    border: 2px solid #0568fd;
  }.btn-purple.btn-ghost:hover {
      color: white;
      background: #0568fd;
    }.btn-purple:active {
     border: none !important;
     outline: none !important;
  }.btn-blue {
  border-radius: 4px;
  border: solid 3px #4a90e2;
  padding: 8px 16px;
  
  -webkit-box-shadow: none;
  
          box-shadow: none;
}.btn-blue:not(.btn-ghost) {
    color: white;
    background: #4a90e2;
  }.btn-blue.btn-ghost {
    color: #4a90e2;
    background: transparent;
  }.btn-black {
  color: rgba(0, 0, 0, .7);
  background: transparent;
  border: 2px solid rgba(0, 0, 0, .7);
}.btn-black:hover {
    color: rgba(0, 0, 0, .8);
    background: rgba(0, 0, 0, .04);
  }.btn-white {
  color: rgb(255, 255, 255);
  border: solid 2px #ffffff;
}.btn-white:hover {
    background-color: rgb(255, 255, 255);
    color: #0568fd;
  }.filledWhite{
  background-color: rgb(255, 255, 255);
  color: #0568fd;
}.filledWhite:hover{
    filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feComponentTransfer color-interpolation-filters="sRGB"><feFuncR type="linear" slope="0.8" /><feFuncG type="linear" slope="0.8" /><feFuncB type="linear" slope="0.8" /></feComponentTransfer></filter></svg>#filter');
    -webkit-filter: brightness(.8);
            filter: brightness(.8);
  }.btn.no-border {
    border-color: transparent;
  }.btn.no-shadow {
    -webkit-box-shadow: none;
            box-shadow: none;
  }.ReactModal__Overlay {
  -webkit-perspective: 600;
  perspective: 600;
  opacity: 0;
}.ReactModal__Overlay--after-open {
  opacity: 1;
  -webkit-transition: opacity 150ms ease-out;
  transition: opacity 150ms ease-out;
}.ReactModal__Content .dialog {
  -webkit-transform: scale(0.5) rotateX(-30deg);
  transform: scale(0.5) rotateX(-30deg);
}.ReactModal__Content--after-open .dialog {
  -webkit-transform: scale(1) rotateX(0deg);
  transform: scale(1) rotateX(0deg);
  -webkit-transition: all 150ms ease-in;
  transition: all 150ms ease-in;
}.ReactModal__Overlay--before-close {
  opacity: 0;
}.ReactModal__Content--before-close .dialog {
  -webkit-transform: scale(0.5) rotateX(30deg);
  transform: scale(0.5) rotateX(30deg);
  -webkit-transition: all 150ms ease-in;
  transition: all 150ms ease-in;
}.overlay {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(50, 50, 50, .95);
  z-index: 1234;
}.modal {
  width: 100%;
  height: 100%;
  pointer-events:none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}.modal > .close {
  color: white;
  position: absolute;
  top: 16px;
  right: 16px;
  font-size: 32px;
  line-height: 20px;
  cursor: pointer;
  pointer-events: all;
}.modal > .dialog {
  background: white;
  padding: 24px;
  border-radius: 2px;
  pointer-events: all;
  margin: 8px;
}.modal > .dialog.video {
    width: 100%;
    max-width: 964px;
    background: #000;
  }.modal > .dialog.video .video-container {
      width: 100%;
      height: 0;
      padding-top: 56.25%;
      overflow: auto;
      pointer-events: auto;
      -webkit-transform: translateZ(0);
              transform: translateZ(0);
      -webkit-overflow-scrolling: touch;
    }.modal > .dialog.video .video-container iframe {
        position: absolute;
        display: block;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
      }/* Slider */.slick-slider {
    position: relative;
    display: block;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}.slick-list {
    position: relative;
    overflow: hidden;
    display: block;
    margin: 0;
    padding: 0;
}.slick-list:focus {
        outline: none;
    }.slick-list.dragging {
        curselectsor: pointer;
        cursor: hand;
    }.slick-slider .slick-track,
.slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}.slick-track {
    position: relative;
    left: 0;
    top: 0;
    display: block;
}.slick-track:before,
    .slick-track:after {
        content: "";
        display: table;
    }.slick-track:after {
        clear: both;
    }.slick-loading .slick-track {
        visibility: hidden;
    }.slick-slide {
    float: left;
    height: 100%;
    min-height: 1px;
}[dir="rtl"] .slick-slide {
        float: right;
    }.slick-slide img {
        display: block;
    }.slick-slide.slick-loading img {
        display: none;
    }.slick-slide{

    display: none;
}.slick-slide.dragging img {
        pointer-events: none;
    }.slick-initialized .slick-slide {
        display: block;
    }.slick-loading .slick-slide {
        visibility: hidden;
    }.slick-vertical .slick-slide {
        display: block;
        height: auto;
        border: 1px solid transparent;
    }.slick-arrow.slick-hidden {
    display: none;
}/* Dots */.slick-dotted .slick-slider {
    margin-bottom: 30px;
}.slick-dots {
    position: absolute;
    bottom: -25px;
    list-style: none;
    display: block;
    text-align: center;
    padding: 0;
    margin: 0;
    width: 100%;
}.slick-dots li {
        position: relative;
        display: inline-block;
        height: 20px;
        width: 20px;
        margin: 0 5px;
        padding: 0;
        cursor: pointer;
    }.slick-dots li button {
            border: 0;
            background: transparent;
            display: block;
            height: 20px;
            width: 20px;
            outline: none;
            line-height: 0px;
            font-size: 0px;
            color: transparent;
            padding: 5px;
            cursor: pointer;
        }.slick-dots li button:hover, .slick-dots li button:focus {
                outline: none;
            }.slick-dots li button:hover:before, .slick-dots li button:focus:before {
                    opacity: 1;
                }.slick-dots li button:before {
                position: absolute;
                top: 0;
                left: 0;
                content: "•";
                width: 20px;
                height: 20px;
                font-size: 12px;
                line-height: 20px;
                text-align: center;
                opacity: 0.25;
                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
            }/*

  TEXT ALIGN
  Docs: http://tachyons.io/docs/typography/text-align/

  Base
    t = text-align

  Modifiers
    l = left
    r = right
    c = center
    j = justify

  Media Query Extensions:
    -ns = not-small
    -m  = medium
    -l  = large

*/.tl  { text-align: left; }.tr  { text-align: right; }.tc  { text-align: center; }.tj  { text-align: justify; }@media screen and (min-width: 30em) {
  .tl-ns  { text-align: left; }
  .tr-ns  { text-align: right; }
  .tc-ns  { text-align: center; }
  .tj-ns  { text-align: justify; }
}@media screen and (min-width: 30em) and (max-width: 60em) {
  .tl-m  { text-align: left; }
  .tr-m  { text-align: right; }
  .tc-m  { text-align: center; }
  .tj-m  { text-align: justify; }
}@media screen and (min-width: 60em) {
  .tl-l  { text-align: left; }
  .tr-l  { text-align: right; }
  .tc-l  { text-align: center; }
  .tj-l  { text-align: justify; }
}/*

   FONT WEIGHT
   Docs: http://tachyons.io/docs/typography/font-weight/

   Base
     fw = font-weight

   Modifiers:
     1 = literal value 100
     2 = literal value 200
     3 = literal value 300
     4 = literal value 400
     5 = literal value 500
     6 = literal value 600
     7 = literal value 700
     8 = literal value 800
     9 = literal value 900

   Media Query Extensions:
     -ns = not-small
     -m  = medium
     -l  = large

*/.normal { font-weight: normal; }.b      { font-weight: bold; }.fw1    { font-weight: 100; }.fw2    { font-weight: 200; }.fw3    { font-weight: 300; }.fw4    { font-weight: 400; }.fw5    { font-weight: 500; }.fw6    { font-weight: 600; }.fw7    { font-weight: 700; }.fw8    { font-weight: 800; }.fw9    { font-weight: 900; }@media screen and (min-width: 30em) {
  .normal-ns { font-weight: normal; }
  .b-ns      { font-weight: bold; }
  .fw1-ns    { font-weight: 100; }
  .fw2-ns    { font-weight: 200; }
  .fw3-ns    { font-weight: 300; }
  .fw4-ns    { font-weight: 400; }
  .fw5-ns    { font-weight: 500; }
  .fw6-ns    { font-weight: 600; }
  .fw7-ns    { font-weight: 700; }
  .fw8-ns    { font-weight: 800; }
  .fw9-ns    { font-weight: 900; }
}@media screen and (min-width: 30em) and (max-width: 60em) {
  .normal-m { font-weight: normal; }
  .b-m      { font-weight: bold; }
  .fw1-m    { font-weight: 100; }
  .fw2-m    { font-weight: 200; }
  .fw3-m    { font-weight: 300; }
  .fw4-m    { font-weight: 400; }
  .fw5-m    { font-weight: 500; }
  .fw6-m    { font-weight: 600; }
  .fw7-m    { font-weight: 700; }
  .fw8-m    { font-weight: 800; }
  .fw9-m    { font-weight: 900; }
}@media screen and (min-width: 60em) {
  .normal-l { font-weight: normal; }
  .b-l      { font-weight: bold; }
  .fw1-l    { font-weight: 100; }
  .fw2-l    { font-weight: 200; }
  .fw3-l    { font-weight: 300; }
  .fw4-l    { font-weight: 400; }
  .fw5-l    { font-weight: 500; }
  .fw6-l    { font-weight: 600; }
  .fw7-l    { font-weight: 700; }
  .fw8-l    { font-weight: 800; }
  .fw9-l    { font-weight: 900; }
}/*

   DISPLAY
   Docs: http://tachyons.io/docs/layout/display

   Base:
    d = display

   Modifiers:
    n     = none
    b     = block
    ib    = inline-block
    it    = inline-table
    t     = table
    tc    = table-cell
    t-row          = table-row
    t-columm       = table-column
    t-column-group = table-column-group

   Media Query Extensions:
     -ns = not-small
     -m  = medium
     -l  = large

*/.dn {              display: none; }.di {              display: inline; }.db {              display: block; }.dib {             display: inline-block; }.dit {             display: inline-table; }.dt {              display: table; }.dtc {             display: table-cell; }.dt-row {          display: table-row; }.dt-row-group {    display: table-row-group; }.dt-column {       display: table-column; }.dt-column-group { display: table-column-group; }/*
  This will set table to full width and then
  all cells will be equal width
*/.dt--fixed {
  table-layout: fixed;
  width: 100%;
}@media screen and (min-width: 30em) {
  .dn-ns {              display: none; }
  .di-ns {              display: inline; }
  .db-ns {              display: block; }
  .dib-ns {             display: inline-block; }
  .dit-ns {             display: inline-table; }
  .dt-ns {              display: table; }
  .dtc-ns {             display: table-cell; }
  .dt-row-ns {          display: table-row; }
  .dt-row-group-ns {    display: table-row-group; }
  .dt-column-ns {       display: table-column; }
  .dt-column-group-ns { display: table-column-group; }

  .dt--fixed-ns {
    table-layout: fixed;
    width: 100%;
  }
}@media screen and (min-width: 30em) and (max-width: 60em) {
  .dn-m {              display: none; }
  .di-m {              display: inline; }
  .db-m {              display: block; }
  .dib-m {             display: inline-block; }
  .dit-m {             display: inline-table; }
  .dt-m {              display: table; }
  .dtc-m {             display: table-cell; }
  .dt-row-m {          display: table-row; }
  .dt-row-group-m {    display: table-row-group; }
  .dt-column-m {       display: table-column; }
  .dt-column-group-m { display: table-column-group; }

  .dt--fixed-m {
    table-layout: fixed;
    width: 100%;
  }
}@media screen and (min-width: 60em) {
  .dn-l {              display: none; }
  .di-l {              display: inline; }
  .db-l {              display: block; }
  .dib-l {             display: inline-block; }
  .dit-l {             display: inline-table; }
  .dt-l {              display: table; }
  .dtc-l {             display: table-cell; }
  .dt-row-l {          display: table-row; }
  .dt-row-group-l {    display: table-row-group; }
  .dt-column-l {       display: table-column; }
  .dt-column-group-l { display: table-column-group; }

  .dt--fixed-l {
    table-layout: fixed;
    width: 100%;
  }
}@font-face {
    font-family: 'Axiforma';
    font-weight: 700;
    src: url(/static/media/3A22BE_0_0.e0ae67d1.eot);
    src: url(/static/media/3A22BE_0_0.e0ae67d1.eot?#iefix) format('embedded-opentype'),
    url(/static/media/3A22BE_0_0.53fd35de.woff2) format('woff2'),
    url(/static/media/3A22BE_0_0.a3fb816d.woff) format('woff'),
    url(/static/media/3A22BE_0_0.e85e8479.ttf) format('truetype');
}@font-face {
    font-family: 'Axiforma';
    font-weight: 700;
    font-style: italic;
    src: url(/static/media/3A22BE_1_0.687884f2.eot);
    src: url(/static/media/3A22BE_1_0.687884f2.eot?#iefix) format('embedded-opentype'),
    url(/static/media/3A22BE_1_0.4d21f342.woff2) format('woff2'),
    url(/static/media/3A22BE_1_0.18891aa4.woff) format('woff'),
    url(/static/media/3A22BE_1_0.c903918d.ttf) format('truetype');
}@font-face {
    font-family: 'Axiforma';
    font-weight: 900;
    src: url(/static/media/3A22BE_3_0.325c2495.eot);
    src: url(/static/media/3A22BE_3_0.325c2495.eot?#iefix) format('embedded-opentype'),
    url(/static/media/3A22BE_3_0.d4552577.woff2) format('woff2'),
    url(/static/media/3A22BE_3_0.88baa624.woff) format('woff'),
    url(/static/media/3A22BE_3_0.1f39bb08.ttf) format('truetype');
}@font-face {
    font-family: 'Axiforma';
    font-weight: 900;
    font-style: italic;
    src: url(/static/media/3A22BE_4_0.0c62fd42.eot);
    src: url(/static/media/3A22BE_4_0.0c62fd42.eot?#iefix) format('embedded-opentype'),
    url(/static/media/3A22BE_4_0.6c702c7b.woff2) format('woff2'),
    url(/static/media/3A22BE_4_0.a839e03e.woff) format('woff'),
    url(/static/media/3A22BE_4_0.cc8efd54.ttf) format('truetype');
}@font-face {
    font-family: 'Axiforma';
    font-style: italic;
    src: url(/static/media/3A22BE_5_0.f3cd7a3d.eot);
    src: url(/static/media/3A22BE_5_0.f3cd7a3d.eot?#iefix) format('embedded-opentype'),
    url(/static/media/3A22BE_5_0.260565a6.woff2) format('woff2'),
    url(/static/media/3A22BE_5_0.6c02099b.woff) format('woff'),
    url(/static/media/3A22BE_5_0.d0d0a89e.ttf) format('truetype');
}@font-face {
    font-family: 'Axiforma';
    font-weight: 400;
    font-style: italic;
    src: url(/static/media/3A22BE_6_0.bb767d96.eot);
    src: url(/static/media/3A22BE_6_0.bb767d96.eot?#iefix) format('embedded-opentype'),
    url(/static/media/3A22BE_6_0.24b9024b.woff2) format('woff2'),
    url(/static/media/3A22BE_6_0.c122ee20.woff) format('woff'),
    url(/static/media/3A22BE_6_0.d2c5444c.ttf) format('truetype');
}@font-face {
    font-family: 'Axiforma';
    font-weight: 800;
    src: url(/static/media/3A22BE_8_0.9cf89027.eot);
    src: url(/static/media/3A22BE_8_0.9cf89027.eot?#iefix) format('embedded-opentype'),
    url(/static/media/3A22BE_8_0.cbf2d90a.woff2) format('woff2'),
    url(/static/media/3A22BE_8_0.a49b113e.woff) format('woff'),
    url(/static/media/3A22BE_8_0.b0bc659f.ttf) format('truetype');
}@font-face {
    font-family: 'Axiforma';
    font-weight: 800;
    font-style: italic;
    src: url(/static/media/3A22BE_A_0.5dfdb9ff.eot);
    src: url(/static/media/3A22BE_A_0.5dfdb9ff.eot?#iefix) format('embedded-opentype'),
    url(/static/media/3A22BE_A_0.f2c03ca4.woff2) format('woff2'),
    url(/static/media/3A22BE_A_0.2a55c4d0.woff) format('woff'),
    url(/static/media/3A22BE_A_0.fad21a96.ttf) format('truetype');
}@font-face {
    font-family: 'Axiforma';
    font-weight: 300;
    src: url(/static/media/3A22BE_B_0.908eac34.eot);
    src: url(/static/media/3A22BE_B_0.908eac34.eot?#iefix) format('embedded-opentype'),
    url(/static/media/3A22BE_B_0.40ed1789.woff2) format('woff2'),
    url(/static/media/3A22BE_B_0.2cfd9e36.woff) format('woff'),
    url(/static/media/3A22BE_B_0.bb0fdc14.ttf) format('truetype');
}@font-face {
    font-family: 'Axiforma';
    font-style: italic;
    font-weight: 300;
    src: url(/static/media/3A22BE_C_0.54395bd9.eot);
    src: url(/static/media/3A22BE_C_0.54395bd9.eot?#iefix) format('embedded-opentype'),
    url(/static/media/3A22BE_C_0.fb020b4b.woff2) format('woff2'),
    url(/static/media/3A22BE_C_0.a9eded96.woff) format('woff'),
    url(/static/media/3A22BE_C_0.b34e473e.ttf) format('truetype');
}@font-face {
    font-family: 'Axiforma';
    font-weight: 500;
    src: url(/static/media/3A22BE_D_0.3c1fec8e.eot);
    src: url(/static/media/3A22BE_D_0.3c1fec8e.eot?#iefix) format('embedded-opentype'),
    url(/static/media/3A22BE_D_0.6febf01f.woff2) format('woff2'),
    url(/static/media/3A22BE_D_0.509fbdbd.woff) format('woff'),
    url(/static/media/3A22BE_D_0.2a44612d.ttf) format('truetype');
}@font-face {
    font-family: 'Axiforma';
    font-style: italic;
    font-weight: 500;
    src: url(/static/media/3A22BE_E_0.21a6cd6d.eot);
    src: url(/static/media/3A22BE_E_0.21a6cd6d.eot?#iefix) format('embedded-opentype'),
    url(/static/media/3A22BE_E_0.9009e0ed.woff2) format('woff2'),
    url(/static/media/3A22BE_E_0.74a111d9.woff) format('woff'),
    url(/static/media/3A22BE_E_0.148e7ec6.ttf) format('truetype');
}@font-face {
    font-family: 'Axiforma';
    font-weight: 400;
    src: url(/static/media/3A22BE_F_0.50ad7c7c.eot);
    src: url(/static/media/3A22BE_F_0.50ad7c7c.eot?#iefix) format('embedded-opentype'),
    url(/static/media/3A22BE_F_0.1b1a2425.woff2) format('woff2'),
    url(/static/media/3A22BE_F_0.25eabd04.woff) format('woff'),
    url(/static/media/3A22BE_F_0.27aef61c.ttf) format('truetype');
}@font-face {
    font-family: 'Axiforma';
    font-weight: 600;
    src: url(/static/media/3A22BE_10_0.b62d42a9.eot);
    src: url(/static/media/3A22BE_10_0.b62d42a9.eot?#iefix) format('embedded-opentype'),
    url(/static/media/3A22BE_10_0.3dc25d45.woff2) format('woff2'),
    url(/static/media/3A22BE_10_0.3ebc96f5.woff) format('woff'),
    url(/static/media/3A22BE_10_0.55f39903.ttf) format('truetype');
}@font-face {
    font-family: 'Axiforma';
    font-style: italic;
    font-weight: 600;
    src: url(/static/media/3A22BE_11_0.e9510a05.eot);
    src: url(/static/media/3A22BE_11_0.e9510a05.eot?#iefix) format('embedded-opentype'),
    url(/static/media/3A22BE_11_0.aff23369.woff2) format('woff2'),
    url(/static/media/3A22BE_11_0.e564804a.woff) format('woff'),
    url(/static/media/3A22BE_11_0.0a4e0ad2.ttf) format('truetype');
}@font-face {
    font-family: 'Axiforma';
    font-weight: 200;
    src: url(/static/media/3A22BE_12_0.6c079b4e.eot);
    src: url(/static/media/3A22BE_12_0.6c079b4e.eot?#iefix) format('embedded-opentype'),
    url(/static/media/3A22BE_12_0.952f649b.woff2) format('woff2'),
    url(/static/media/3A22BE_12_0.dff2bd56.woff) format('woff'),
    url(/static/media/3A22BE_12_0.15aab50f.ttf) format('truetype');
}@font-face {
    font-family: 'Axiforma';
    font-style: italic;
    font-weight: 200;
    src: url(/static/media/3A22BE_13_0.88576f7b.eot);
    src: url(/static/media/3A22BE_13_0.88576f7b.eot?#iefix) format('embedded-opentype'),
    url(/static/media/3A22BE_13_0.b9a672aa.woff2) format('woff2'),
    url(/static/media/3A22BE_13_0.c0359ed8.woff) format('woff'),
    url(/static/media/3A22BE_13_0.97167401.ttf) format('truetype');
}@font-face {
    font-family: "Poppins";
    font-weight: 400;
    src: url(/static/media/Poppins-Regular.8081832f.ttf);
}@font-face {
    font-family: "Poppins";
    src: url(/static/media/Poppins-SemiBold.cce5625b.ttf);
    font-weight: bold;
}body {
  margin: 0;
  padding: 0;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  font-family: "Poppins", sans-serif;
  font-size: 18px;
  line-height: 1.48;
  color: rgb(255, 255, 255);
}html,
body,
#speed-kit-analyzer,
#wrapper {
  min-height: 100vh;
}#speed-kit-analyzer {
  margin: 0;
  padding: 0;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  font-family: "Poppins", sans-serif;
  font-size: 18px;
  line-height: 1.48;
  color: rgb(255, 255, 255);
  background-color: #0568fd;
}@media (min-width: 768px) {#speed-kit-analyzer {
    background-color: #f4f4f4;
    background-image: none
}
  }#speed-kit-analyzer,
#main {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}#wrapper {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}#main {
  /* min-height: 100%; */
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}.content {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  overflow: hidden;
  /* min-height: 100vh;
  @media (--breakpoint-not-small) {
    min-height: initial;
  } */
}h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 400;
}h2 {
  font-size: 24px;
  font-weight: bold;
}@media (min-width: 576px) {h2 {
    font-size: 36px
}
  }a {
  color: #4a90e2;
  text-decoration: none;
}.container {
  width: 100%;
  max-width: 1270px;
  margin: 0 auto;
  padding-right: 20px;
  padding-left: 20px;
}@media (min-width: 768px) {.container {
    padding-right: 40px;
    padding-left: 40px
}
  }@media (min-width: 992px) {.container {
    padding-right: 60px;
    padding-left: 60px
}
  }.text-right {
  text-align: right;
}.text-left {
  text-align: left;
}.text-center {
  text-align: center;
}.dark-blue {
  color: #6b7c96;
}.purple {
  color: #0568fd;
}hr {
  height: 1px;
  border: 0;
  margin: 0;
  background-color: #dedede;
}input {
  color: inherit;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}.pr2-ns {
  padding-right: 0;
}@media (min-width: 576px) {.pr2-ns {
    padding-right: 20px
}
  }textarea {
  height: 120px;
  resize: none;
  color: inherit;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}.__react_component_tooltip.type-dark {
  background-color: rgba(0, 0, 0, .95);
  font-weight: 400;
}

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

footer {
  font-weight: 500;
  font-size: 14px;
  padding: 8px 0 32px;
  color: rgb(255, 255, 255);
}

footer a {
    color: rgb(255, 255, 255);
  }

footer .company {
    color: rgba(255, 255, 255, .64);
  }

footer .result-page {
    font-size: 1.125rem;
    color: rgb(255, 255, 255) !important;
    background-color: rgb(51, 53, 55) !important;
  }

footer .result-page a {
      color: rgb(255, 255, 255) !important;
    }

@media (min-width: 576px) {

footer {
    font-size: 16px
}
  }

@media (min-width: 768px) {

footer {
    color: #333537
}
    footer a {
      color: #333537;
    }
    footer .company {
      color: inherit;
    }
  }

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

.device__laptop .header, .device__phone .header {
    font-family: Poppins,sans-serif;
    font-size: 38px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: -0.8px;
    color: #ffffff;
    margin-top: 0;
    margin-bottom: 16px;
  }

@media(min-width: 768px) {

.device__phone .header {
      font-size: 44px;
      margin-bottom: 0
  }
    }

@media(min-width: 768px) {

.device__laptop .header {
      font-size: 44px
  }
    }

@media(min-width: 992px) {

.device__laptop .header {
      font-size: 52px
  }
    }

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

/*.config__form {*/

/*  font-family: "Poppins";*/

/*  &-input-wrapper {*/

/*    display: flex;*/

/*    flex-direction: column;*/

/*    @media (--breakpoint-medium-device) {*/

/*      flex-direction: row;*/

/*      flex-wrap: wrap;*/

/*    }*/

/*  }*/

/*  &-input {*/

/*    font-size: 20px;*/

/*    border-radius: 4px;*/

/*    background-color: rgba(0, 0, 0, 0.24);*/

/*    color: var(--white);*/

/*    border: none;*/

/*    flex-grow: 1;*/

/*    !*padding: 14px 45px 14px 20px;*!*/

/*    box-shadow: none;*/

/*    min-height: 56px;*/

/*    @media (--breakpoint-medium-device) {*/

/*      min-height: 60px;*/

/*    }*/

/*    &.no-text {*/

/*      color: transparent;*/

/*      caret-color: white;*/

/*    }*/

/*    &::placeholder {*/

/*      color: rgba(255, 255, 255, 0.64);*/

/*    }*/

/*  }*/

/*  &-cookie {*/

/*    font-size: 16px;*/

/*    border-radius: 4px;*/

/*    background-color: rgba(0, 0, 0, 0.24);*/

/*    color: var(--white);*/

/*    border: none;*/

/*    flex-grow: 1;*/

/*    padding: 14px 45px 14px 20px;*/

/*    box-shadow: none;*/

/*    height: 42px;*/

/*    &.no-text {*/

/*      color: transparent;*/

/*      caret-color: white;*/

/*    }*/

/*    &::placeholder {*/

/*      color: rgba(255, 255, 255, 0.64);*/

/*    }*/

/*  }*/

/*  &-submit {*/

/*    display: flex;*/

/*    align-items: center;*/

/*    justify-content: center;*/

/*    border-radius: 4px;*/

/*    border: solid 3px #ffffff;*/

/*    font-size: 16px;*/

/*    font-weight: bold;*/

/*    font-family: "Poppins";*/

/*    letter-spacing: 0.15em;*/

/*    cursor: pointer;*/

/*    padding: 16px 40px;*/

/*    margin-top: 15px;*/

/*    margin-left: 0;*/

/*    background: none;*/

/*    color: color(#fff);*/

/*    outline: none !important;*/

/*    box-shadow: none !important;*/

/*    @media (--breakpoint-medium-device) {*/

/*      margin-top: 0;*/

/*      margin-left: 15px;*/

/*      padding: 18px 40px;*/

/*    }*/

/*    &:hover {*/

/*      background: #ffffff;*/

/*      color: var(--custom-purple);*/

/*    }*/

/*  }*/

/*  &-settings {*/

/*    border-radius: 50%;*/

/*    width: 44px;*/

/*    height: 44px;*/

/*    border: none;*/

/*    opacity: 0.8;*/

/*    cursor: pointer;*/

/*    &:hover {*/

/*      opacity: 1;*/

/*    }*/

/*  }*/

/*  .config__form-input-wrapper {*/

/*    position: relative;*/

/*  }*/

/*  .config__form-submit-wrapper {*/

/*    position: absolute;*/

/*    top: 8px;*/

/*    right: 8px;*/

/*    &:not(.presentation) {*/

/*      @media (--breakpoint-medium-device) {*/

/*        right: 225px;*/

/*      }*/

/*    }*/

/*  }*/

/*  .advanced {*/

/*    width: 100%;*/

/*    margin: 0 auto;*/

/*    @media (--breakpoint-medium-device) {*/

/*      max-width: 75%;*/

/*    }*/

/*    .CodeMirror {*/

/*      height: auto;*/

/*      font-size: 16px;*/

/*      background-color: rgba(0, 0, 0, 0.24);*/

/*      color: var(--white);*/

/*      border-radius: 4px;*/

/*      outline: none;*/

/*      .CodeMirror-cursor {*/

/*        border-color: white;*/

/*      }*/

/*      .CodeMirror-selected {*/

/*        background: rgba(255, 255, 255, 0.2);*/

/*      }*/

/*    }*/

/*  }*/

/*  .toggleAdvancedSettings-wrapper {*/

/*    display: flex;*/

/*    justify-content: center;*/

/*    margin-top: 15px;*/

/*    .toggle {*/

/*      display: flex;*/

/*      justify-content: center;*/

/*      padding: 8px 22px;*/

/*      align-items: center;*/

/*      border-radius: 21.5px;*/

/*      border: solid 2px rgba(255, 255, 255, 0.24);*/

/*      a {*/

/*        font-size: 16px;*/

/*        font-weight: 400;*/

/*        color: #f4f4f4;*/

/*        cursor: pointer;*/

/*      }*/

/*    }*/

/*  }*/

/*}*/

/*.device__phone {*/

/*  .config__form {*/

/*    &-input-wrapper {*/

/*      flex-direction: column;*/

/*      @media (--breakpoint-medium-device) {*/

/*        padding: 0 30px;*/

/*      }*/

/*    }*/

/*    &-submit {*/

/*      margin-top: 15px;*/

/*      margin-left: 0;*/

/*    }*/

/*    .advanced {*/

/*      @media (--breakpoint-medium-device) {*/

/*        width: auto !important;*/

/*        max-width: none;*/

/*        margin: 0 20px;*/

/*      }*/

/*    }*/

/*  }*/

/*}*/

.config__form {
  font-family: "Poppins";
}

.config__form-input-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 14px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

@media (min-width: 768px) {
  .config__form-input-wrapper {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
}

.config__form-input {
  font-size: 18px;
  font-weight: 400;
  border-radius: 8px;
  background-color: rgba(0, 0, 0, .24);
  color: #ffffff;
  border: none;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  padding: 10px 20px;
  -webkit-box-shadow: none;
          box-shadow: none;
  min-height: 56px;
}

@media (min-width: 768px) {
  .config__form-input {
    min-height: 60px;
  }
}

.config__form-input.no-text {
  color: transparent;
  caret-color: white;
}

.config__form-input::-webkit-input-placeholder {
  color: rgba(255, 255, 255, .64);
}

.config__form-input::-moz-placeholder {
  color: rgba(255, 255, 255, .64);
}

.config__form-input::-ms-input-placeholder {
  color: rgba(255, 255, 255, .64);
}

.config__form-input::placeholder {
  color: rgba(255, 255, 255, .64);
}

.config__form-cookie {
  font-size: 16px;
  border-radius: 4px;
  background-color: rgba(0, 0, 0, .24);
  color: #ffffff;
  border: none;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  padding: 14px 45px 14px 20px;
  -webkit-box-shadow: none;
          box-shadow: none;
  height: 42px;
}

.config__form-cookie.no-text {
  color: transparent;
  caret-color: white;
}

.config__form-cookie::-webkit-input-placeholder {
  color: rgba(255, 255, 255, .64);
}

.config__form-cookie::-moz-placeholder {
  color: rgba(255, 255, 255, .64);
}

.config__form-cookie::-ms-input-placeholder {
  color: rgba(255, 255, 255, .64);
}

.config__form-cookie::placeholder {
  color: rgba(255, 255, 255, .64);
}

.config__form-submit {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: 8px;
  border: solid 3px #ffffff;
  font-size: 18px;
  font-weight: 600;
  font-family: "Poppins", sans-serif;
  letter-spacing: -0.36px;
  cursor: pointer;
  padding: 10px 20px;
  margin-top: 15px;
  margin-left: 0;
  background: #ffffff;
  color: #0568fd;
}

@media (min-width: 768px) {
  .config__form-submit {
    font-size: clamp(0.75rem, -14.75rem + 25vw, 1rem);
    margin-top: 0;
  }
}

.config__form-submit:hover {
  background: #ffffff;
  color: #0568fd;
}

.config__form-settings {
  border-radius: 50%;
  width: 44px;
  height: 44px;
  border: none;
  opacity: 0.8;
  cursor: pointer;
}

.config__form-settings:hover {
  opacity: 1;
}

.config__form .config__form-input-wrapper {
  position: relative;
}

.config__form .config__form-submit-wrapper {
  position: absolute;
  top: 8px;
  right: 8px;
}

@media (min-width: 768px) {
  .config__form .config__form-submit-wrapper:not(.presentation) {
    right: 225px;
  }
}

.config__form .advanced {
  width: 100%;
  margin: 0 auto;
}

@media (min-width: 768px) {
  .config__form .advanced {
    max-width: 75%;
  }
}

.config__form .advanced .CodeMirror {
  height: auto;
  font-size: 16px;
  background-color: rgba(0, 0, 0, .24);
  color: #ffffff;
  border-radius: 4px;
  outline: none;
}

.config__form .advanced .CodeMirror .CodeMirror-cursor {
  border-color: white;
}

.config__form .advanced .CodeMirror .CodeMirror-selected {
  background: rgba(255, 255, 255, .2);
}

.config__form .toggleAdvancedSettings-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: 15px;
}

.config__form .toggleAdvancedSettings-wrapper .toggle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 8px 22px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 21.5px;
  border: solid 2px rgba(255, 255, 255, .24);
}

.config__form .toggleAdvancedSettings-wrapper .toggle a {
  font-size: 16px;
  font-weight: 400;
  color: #f4f4f4;
  cursor: pointer;
}

.device__phone .config__form-input-wrapper {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

@media (min-width: 768px) {
  .device__phone .config__form-input-wrapper {
    padding: 0 30px;
  }
}

.device__phone .config__form-submit {
  font-size: 1rem;
  margin-top: 15px;
  margin-left: 0;
}

@media (min-width: 768px) {
  .device__phone .config__form .advanced {
    width: auto !important;
    max-width: none;
    margin: 0 20px;
  }

  .location-dropdown {
    width: 165px;
  }
  .device__phone .location-dropdown {
    width: unset;
  }
}

.checkbox-custom {
  background-color: transparent;
  display: inline-block;
}

/* hide default input */

.checkbox-custom input {
  display: none;
}

.checkbox-custom label:empty {
  padding-left: 10px;
}

/* checkbox container */

.checkbox-custom label {
  cursor: pointer;
  position: relative;
  padding-left: 32px;
  margin-right: 0px;
  margin-bottom: 5px;
  padding-top: 2px;
}

/* checkbox border */

.checkbox-custom label:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  background-color: rgba(255, 255, 255, .2);
  border: 1px solid #6a747b;
  border-radius: 2px;
}

/* checked state icon */

.checkbox-custom input[type="checkbox"]:checked + label:after {
  position: absolute;
  content: " ";
  font-size: 18px;
  top: 2px;
  left: 6px;
  width: 6px;
  height: 12px;
  -webkit-transform: rotate(35deg);
          transform: rotate(35deg);
  color: black;
  border-right: 4px solid #fafafa;
  border-bottom: 4px solid #fafafa;
}

.bqDropdown {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  position: relative;
}

.bqDropdown button {
  all: unset;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 16px;
  padding: 10px 20px;
  border-radius: 8px;
  background-color: #004aba;
  border: solid 1px #3d86f6;
}

.bqDropdown-label {
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: -0.24px;
  text-align: left;
  color: rgba(255, 255, 255, .64);
  font-size: 12px;
  font-weight: 400;
  font-family: Poppins, sans-serif;
}

.bqDropdown-state {
  -webkit-box-flex: 0;
      -ms-flex-positive: 0;
          flex-grow: 0;
  font-family: Poppins, sans-serif;
  font-size: 18px;
  font-weight: 400;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: -0.36px;
  text-align: left;
  color: #fff;
}

.bqDropdown-dropdown.expanded {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  border-radius: 8px;
  border: solid 1px #3d86f6;
  overflow: hidden;
  position: absolute;
  top: 70px;
  width: 100%;
  z-index: 10;
}

.bqDropdown-dropdown-entry {
  background-color: #004aba;
  padding: 10px 20px;
  font-family: Poppins, sans-serif;
  font-size: 18px;
  font-weight: normal;

  cursor: pointer;
}

.bqDropdown-dropdown-entry:not(:last-child) {
  border-bottom: solid 1px #3d86f6;
}

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

.device {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 32px 20px;
  max-width: 1200px;
}

.device .device__wrapper-outer, .device .device__wrapper, .device .device__screen {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-item-align: stretch;
        align-self: stretch;
  }

.device .device__background-image {
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    background-size: cover;
    background-position: center top;
    max-height: 600px;
  }

.device .device-left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }

.device .device__laptop {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.device .device__laptop .device__wrapper-top {
    display: none;
  }

@media (min-width: 768px) {

.device .device__laptop .device__wrapper-top {
      /* creates the bottom bar */
      height: 40px;
      display: inline;
      border-top-left-radius: 24px;
      border-top-right-radius: 24px;
      margin-left: 48px;
      margin-right: 48px;
      background: rgb(255, 255, 255);
      border-top: 1px solid rgba(51, 53, 55, .25);
      border-left: 1px solid rgba(51, 53, 55, .25);
      border-right: 1px solid rgba(51, 53, 55, .25)
  }
    }

.device .device__laptop .device__wrapper-bottom {
    display: none;
  }

.device .device__laptop .device__wrapper-bottom .device-notch {
      width: 20%;
      height: 25%;
      border-bottom-left-radius: 28px;
      border-bottom-right-radius: 28px;
      margin: auto;
      background-image: -webkit-gradient(linear, left top, right top, from(#bcbdbf), color-stop(10%, #d8d8df), color-stop(89%, #d8d8df), to(#adaabd));
      background-image: linear-gradient(to right, #bcbdbf, #d8d8df 10%, #d8d8df 89%, #adaabd);
    }

@media (min-width: 768px) {

.device .device__laptop .device__wrapper-bottom {
      /* creates the bottom bar */
      height: 55px;
      display: inline;
      border-bottom-left-radius: 24px;
      border-bottom-right-radius: 24px;
      background: rgb(255, 255, 255);
      border: 1px solid rgba(51, 53, 55, .25)
  }
    }

/* For larger screens */

@media (min-width: 768px) {

.device .device__laptop {
    /* creates the bars on the left, right and top */
}
    .device .device__laptop > .device__wrapper-outer {
      position: relative;
    }
      .device .device__laptop > .device__wrapper-outer:not(.embedded) {
         padding-left: 24px;
         padding-right: 24px;
         margin-left: 48px;
         margin-right: 48px;
      }
        .device .device__laptop > .device__wrapper-outer:not(.embedded):before { left: 0px; border-left: 1px solid rgba(51, 53, 55, .25); }
        .device .device__laptop > .device__wrapper-outer:not(.embedded):after { right: 0px; border-right: 1px solid rgba(51, 53, 55, .25); }
        .device .device__laptop > .device__wrapper-outer:not(.embedded):before, .device .device__laptop > .device__wrapper-outer:not(.embedded):after {
          content: "";
          position: absolute;
          background-color: rgb(255, 255, 255);
          top: 0px;
          bottom: 0px;
          width: 24px;
          max-height: 100%;
        }
      .device .device__laptop > .device__wrapper-outer .device__wrapper-outer {
        -ms-flex-item-align: stretch;
            align-self: stretch;
      }
      /* enforces 16:9 aspect ratio */
      .device .device__laptop > .device__wrapper-outer > .device__wrapper {
        position: relative;
        display: inherit;
        max-width: 100%;
      }
        .device .device__laptop > .device__wrapper-outer > .device__wrapper:not(.embedded) {
           background-image: linear-gradient(
                   119deg,
                   rgb(5, 104, 253),
                   rgb(5, 104, 253) 102%
           );
        }
        .device .device__laptop > .device__wrapper-outer > .device__wrapper:before {
          content: "";
          display: block;
          position: relative;
          padding-top: 55%;
        }
        .device .device__laptop > .device__wrapper-outer > .device__wrapper > .device__screen {
          position: relative;
          z-index: 1;
          padding: 80px 48px 40px;
        }
          .device .device__laptop > .device__wrapper-outer > .device__wrapper > .device__screen .device__wrapper-outer, .device .device__laptop > .device__wrapper-outer > .device__wrapper > .device__screen .device__wrapper, .device .device__laptop > .device__wrapper-outer > .device__wrapper > .device__screen .device__inner {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-flex: 1;
                -ms-flex-positive: 1;
                    flex-grow: 1;
          }
  }

@media (min-width: 992px) {
        .device .device__laptop .device__wrapper-outer .device__wrapper > .device__screen {
          padding: 80px 44px 40px;
        }
  }

.device .device__laptop .device__background {
    background-position: top;
    background-size: 100%;
    background-repeat: no-repeat;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    opacity: 0.15;
  }

@media (min-width: 768px) {

.device .device__laptop .device__background {
      background-size: cover;
      opacity: 0.08
  }
    }

.device .device__phone {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.device .device__phone .device__background-image {
    position: fixed;
  }

@media (min-width: 768px) {
    .device .device__phone .device__wrapper-top {
      /* creates the bottom bar */
      width: 500px;
      height: 90px;
      display: inline;
      border-top-left-radius: 72px;
      border-top-right-radius: 72px;
      margin: auto;
      background: rgb(255, 255, 255);
      border-top: 1px solid rgba(51, 53, 55, .25);
      border-left: 1px solid rgba(51, 53, 55, .25);
      border-right: 1px solid rgba(51, 53, 55, .25);
    }
    .device .device__phone .device__wrapper-outer {
      -webkit-box-sizing: content-box;
              box-sizing: content-box;
      width: 452px;
      min-height: 610px;
      position: relative;
      margin: auto;
    }
      .device .device__phone .device__wrapper-outer:not(.embedded) {
         padding-left: 24px;
         padding-right: 24px;
      }
         .device .device__phone .device__wrapper-outer:not(.embedded):before { left: 0px; border-left: 1px solid rgba(51, 53, 55, .25); }
         .device .device__phone .device__wrapper-outer:not(.embedded):after { right: 0px; border-right: 1px solid rgba(51, 53, 55, .25); }
         .device .device__phone .device__wrapper-outer:not(.embedded):before, .device .device__phone .device__wrapper-outer:not(.embedded):after {
          content: "";
          position: absolute;
          background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(255, 255, 255)), to(rgba(255, 255, 255, 0.3)));
          background-image: linear-gradient(rgb(255, 255, 255), rgba(255, 255, 255, 0.3));
          top: 0;
          bottom: 0;
          width: 24px;
          max-height: 100%;
        }

      .device .device__phone .device__wrapper-outer .device__wrapper {
        position: relative;
        max-width: 100%;
      }
        .device .device__phone .device__wrapper-outer .device__wrapper:not(.embedded) {
           background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 95%, rgba(244, 244, 244, 1)),
           linear-gradient(144deg, rgb(5, 104, 253), rgb(5, 104, 253) 101%);
        }
        .device .device__phone .device__wrapper-outer .device__wrapper .device__background-image {
          position: absolute;
        }
        .device .device__phone .device__wrapper-outer .device__wrapper > .device__screen {
          padding: 60px 0;
        }
  }

/* custom CSS3 animations */

@-webkit-keyframes show {
  0% {
    width: 0;
  }
  100% {
    width: 50%;
  }
}

@keyframes show {
  0% {
    width: 0;
  }
  100% {
    width: 50%;
  }
}

@-webkit-keyframes showInner {
  100% {
    max-height: 100%;
  }
}

@keyframes showInner {
  100% {
    max-height: 100%;
  }
}

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

.logo {
    width: 260px;
    height: 50px;
    margin-top: 42px;
    background: url(/static/media/speedKitLogoWhite.a57e79fa.svg) no-repeat center;
    background-size: 240px;
}

@media(min-width: 768px) {

.logo.resize {
            background: url(/static/media/speedKitLogoBlack.e58aa8ca.svg) no-repeat center;
            background-size: 240px
    }
        }

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

.loading-screen .device__laptop .carousel__wrapper, .loading-screen .device__phone .carousel__wrapper {
      width: 95%;
      margin: 40px 0 32px 0;
    }

.loading-screen .device__laptop .progress__wrapper, .loading-screen .device__phone .progress__wrapper {
      width: 180px;
    }

@media (min-width: 768px) {

.loading-screen .device__laptop .carousel__wrapper {
        width: 70%
    }
      }

@media (min-width: 576px) {

.loading-screen .device__laptop .progress__wrapper {
        width: 210px
    }
      }

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

a {
  color: inherit;
}

.slick-slider {
  display: grid !important;
}

.slick-slider img {
    display: inline !important;
  }

.slick-list {
  text-align: center;
}

.slick-dots li {
  margin: 0 10px;
}

.slick-dots li button:before {
  font-size: 30px !important;
  color: #ffffff !important;
}

.slick-dots li.slick-active button:before {
  opacity: 1 !important;
}

.item-img {
  height: 25px;
}

@media (min-width: 576px) {

.item-img {
    height: 30px
}
  }

.item-header {
  font-size: 13px;
  margin: 5px 0;
  color: rgba(255, 255, 255, .64);
}

.item-text {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  margin-bottom: 5px;
}

.customer {
  background-repeat: no-repeat;
  background-position: center;
  background-size: auto 25px;
  width: 100%;
}

@media (min-width: 576px) {

.customer {
    background-size: auto 30px
}
  }

.customer.galeria {
    background-image: url(/static/media/galeria-white.932c5d3f.svg);
  }

.customer.decathlon {
    background-image: url(/static/media/decathlon-white.b1378b59.svg);
  }

.customer.carhartt {
    background-image: url(/static/media/carhartt-white.ed215bff.svg);
  }

.customer.awn {
    background-image: url(/static/media/awn-white.2ec5e9d1.png);
  }

.customer.hsv {
    background-image: url(/static/media/hsv-white.93eae023.svg);
  }

.customer.snipes {
    background-image: url(/static/media/snipes-white.4c2a2eed.svg);
  }

.customer.interflora {
    background-image: url(/static/media/interflora-white.16f41b8f.svg);
  }

.customer.jochenschweizer {
    background-image: url(/static/media/mydays-white.988f2004.svg);
  }

.customer.besamex {
    background-image: url(data:image/png;base64,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);
  }

.customer.soliver {
    background-image: url(/static/media/soliver-white.cf964f08.svg);
  }

.customer.bmw {
    background-image: url(/static/media/bmw-white.385b0758.svg);
  }

/*
 * react-circular-progressbar styles
 * All of the styles in this file are configurable!
 */

.CircularProgressbar {
  /*
   * This fixes an issue where the CircularProgressbar svg has
   * 0 width inside a "display: flex" container, and thus not visible.
   */
  width: 100%;
  /*
   * This fixes a centering issue with CircularProgressbarWithChildren:
   * https://github.com/kevinsqi/react-circular-progressbar/issues/94
   */
  vertical-align: middle;
}

.CircularProgressbar .CircularProgressbar-path {
  stroke: #3e98c7;
  stroke-linecap: round;
  -webkit-transition: stroke-dashoffset 0.5s ease 0s;
  transition: stroke-dashoffset 0.5s ease 0s;
}

.CircularProgressbar .CircularProgressbar-trail {
  stroke: #d6d6d6;
  /* Used when trail is not full diameter, i.e. when props.circleRatio is set */
  stroke-linecap: round;
}

.CircularProgressbar .CircularProgressbar-text {
  fill: #3e98c7;
  font-size: 20px;
  dominant-baseline: middle;
  text-anchor: middle;
}

.CircularProgressbar .CircularProgressbar-background {
  fill: #d6d6d6;
}

/*
 * Sample background styles. Use these with e.g.:
 *
 *   <CircularProgressbar
 *     className="CircularProgressbar-inverted"
 *     background
 *     percentage={50}
 *   />
 */

.CircularProgressbar.CircularProgressbar-inverted .CircularProgressbar-background {
  fill: #3e98c7;
}

.CircularProgressbar.CircularProgressbar-inverted .CircularProgressbar-text {
  fill: #fff;
}

.CircularProgressbar.CircularProgressbar-inverted .CircularProgressbar-path {
  stroke: #fff;
}

.CircularProgressbar.CircularProgressbar-inverted .CircularProgressbar-trail {
  stroke: transparent;
}

.head-text {
    font-size: 24px;
    font-weight: 600;
    letter-spacing: -1.0px;
}

.sub-text {
    font-size: 7px;
    font-style: italic;
    font-weight: bold;
}

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

#speed-kit-analyzer .results__wrapper {
    width: 100%;
    min-height: 100vh;
  }

#speed-kit-analyzer .results {
    width: 100%;
    background: #f4f4f4;
    color: #444;
  }

#speed-kit-analyzer .results__box {
      border-radius: 2px;
      color: #444444;
      background: #ffffff;
    }

#speed-kit-analyzer .toggleSettings {
    color: rgba(255, 255, 255, 0.5);
    font-size: 12px;
  }

#speed-kit-analyzer .toggleSettings a {
      color: rgba(255, 255, 255, 0.75);
      text-decoration: underline;
      cursor: pointer;
    }

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

.embedVideo {
  width: 100%;
  border-radius: 3px 3px 3px 3px;
  border: 1px solid #e8e8e8;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, .05);
          box-shadow: 0 2px 4px rgba(0, 0, 0, .05);
}

.competitor-video {
  padding: 16px 6px 16px 0;
}

@media(min-width: 576px) {

.competitor-video {
    padding: 32px 16px 32px 0
}
  }

@media(min-width: 768px) {

.competitor-video {
    padding: 48px 23px 48px 0
}
  }

.speedKit-video {
  padding: 16px 0 16px 6px;
}

@media(min-width: 576px) {

.speedKit-video {
    padding: 32px 0 32px 16px
}
  }

@media(min-width: 768px) {

.speedKit-video {
    padding: 48px 0 48px 23px
}
  }

.video__wrapper {
  position: relative;
}

.video__wrapper:not(.auto):before {
    content: "";
    display: block;
    position: relative;
    padding-top: 56.5%;
    top: 1px;
  }

.mobile .video__wrapper:not(.auto):before {
      padding-top: 68%;
    }

.video__wrapper .video__wrapper-inner {
    position: absolute;
    z-index: 0;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    border-radius: 4px;
    -webkit-box-shadow: 0 4px 32px 0 rgba(51, 53, 55, .44);
            box-shadow: 0 4px 32px 0 rgba(51, 53, 55, .44);
  }

.video__wrapper .video__wrapper-inner .relative {
      width: 101%;
      height: 133%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-top: -9.35%;
      background-color: black;
    }

.video__wrapper .video__wrapper-inner .relative video {
        width: 100%;
        /* min-height: 120.5%; */
        /* background: #f8f8f8; */
        border: none;
        z-index: 1;
        /* min-height: 100%; */
        -ms-flex-negative: 0;
            flex-shrink: 0;
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
      }

.mobile .video__wrapper .video__wrapper-inner .relative {
        height: 107%;
        margin-top: -4.25%;
      }

.mobile .video__wrapper .video__wrapper-inner .relative video {
          margin-top: 0;
          margin-top: initial;
          width: 100%;
          min-height: 105%;
          position: relative;
          margin-left: auto;
          display: block;
          margin-right: auto;
        }

.video__wrapper .video__wrapper-play {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -22.5px;
    margin-top: -22.5px;
    width: 50px;
    height: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    border-radius: 50px;
    -webkit-backdrop-filter: blur(2px);
            backdrop-filter: blur(2px);
    -webkit-box-shadow: 0 0 16px 0 rgba(155, 155, 155, .4);
            box-shadow: 0 0 16px 0 rgba(155, 155, 155, .4);
    background-color: rgba(255, 255, 255, .5);
    z-index: 2;
  }

.video__wrapper .video__wrapper-play:hover {
      color: white;
    }

@media(min-width: 576px) {

.video__wrapper .video__wrapper-play {
      width: 100px;
      height: 100px;
      margin-left: -48.5px;
      margin-top: -26.5px
  }
    }

.video__wrapper .video__wrapper-play-inner {
    position: relative;
    font-size: 15px;
    cursor: pointer;
    width: 39px;
    height: 39px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding-left: 5px;
    border-radius: 39px;
    -webkit-box-shadow: 0 2px 8px 0 rgba(51, 53, 55, .56);
            box-shadow: 0 2px 8px 0 rgba(51, 53, 55, .56);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#efeff0));
    background-image: linear-gradient(to bottom, #ffffff, #efeff0);
    z-index: 2;
  }

.video__wrapper .video__wrapper-play-inner:hover {
      opacity: 0.7;
    }

.video__wrapper .video__wrapper-play-inner.error {
      cursor: auto;
      padding-left: 0;
    }

.video__wrapper .video__wrapper-play-inner.error:hover {
         opacity: 1.0;
      }

@media(min-width: 576px) {

.video__wrapper .video__wrapper-play-inner {
      width: 78px;
      height: 78px;
      font-size: 30px
  }
    }

.video__wrapper .video__wrapper-play-inner .play {
      width: 21px;
    }

.video__wrapper .video__wrapper-play-inner .locked {
      width: 16px;
    }

@media(min-width: 576px) {

.video__wrapper .video__wrapper-play-inner .locked {
        width: 26px
    }
      }

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

.result-header {
  min-height: 350px;
  background-color: #0568fd;
}

@media(min-width: 576px) {

.result-header {
    min-height: 450px
}
  }

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

.main-factor-cycle {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 64px;
  height: 64px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: -32px;
  margin-left: -32px;
  background-color: rgba(0, 0, 0, .24);
  border-radius: 50%;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.2;
}

@media(min-width: 576px) {

.main-factor-cycle {
    font-size: 20px;
    width: 108px;
    height: 108px;
    margin-top: -54px;
    margin-left: -54px
}
  }

.main-factor-value {
  font-size: 20px;
  font-weight: 700;
}

@media(min-width: 576px) {

.main-factor-value {
    font-size: 34px
}
  }

.main-metric-title {
  font-size: 14px;
  font-weight: 500;
  color: rgba(255, 255, 255, .8);
}

@media(min-width: 576px) {

.main-metric-title {
    font-size: 22px
}
  }

.main-metric-value {
  font-size: 23px;
  font-weight: 700;
}

@media(min-width: 576px) {

.main-metric-value {
    font-size: 36px
}
  }

.competitorMetric {
  padding-left: 0;
  text-align: left;
}

@media(min-width: 576px) {

.competitorMetric {
    padding-left: 16px;
    text-align: center
}
  }

.speedKitMetric {
  padding-right: 0;
  text-align: right;
}

@media(min-width: 576px) {

.speedKitMetric {
    padding-right: 16px;
    text-align: center
}
  }

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

.result-body {
  margin-top: -30px;
  background: #EEF2F7;
  color: #444;
}

@media(min-width: 576px) {

.result-body {
    margin-top: -70px
}
  }

@media(min-width: 768px) {

.result-body {
    margin-top: -100px
}
  }

@media(min-width: 992px) {

.result-body {
    margin-top: -180px
}
  }

.result-body-inner {
  position: relative;
  margin-top: 32px !important;
}

@media(min-width: 576px) {

.result-body-inner {
    margin-top: 54px !important
}
  }

@media(min-width: 768px) {

.result-body-inner {
    margin-top: 84px !important
}
  }

@media(min-width: 992px) {

.result-body-inner {
    margin-top: 164px !important
}
  }

.result-details {
  color: #333537;
  text-align: center;
}

.scale-wrapper {
  padding: 0;
}

@media(min-width: 576px) {

.scale-wrapper {
    padding: 0 100px
}
  }

@media(min-width: 768px) {

.scale-wrapper {
    padding: 0 150px
}
  }

@media(min-width: 992px) {

.scale-wrapper {
    padding: 0 200px
}
  }

@media(min-width: 1441px) {

.scale-wrapper {
    padding: 0 250px
}
  }

.box-wrapper {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1 1;
  border-radius: 4px;
  white-space: nowrap;
  border: solid 1px #E1E8F0;
  background-color: #ffffff;
  padding: 40px 24px;
}

.scale {
  font-size: 16px;
  color: #ffffff;
  font-style: italic;
  font-weight: 700;
}

@media(min-width: 576px) {

.scale {
    font-size: 22px
}
  }

.scale-competitor {
  border-radius: 4px;
  background-color: #6b7c96;
  padding: 9px 14px;
}

.scale-speedKit {
  border-radius: 4px 0px 0px 4px;
  background-color:#0568fd;
  padding: 9px 14px;
  min-width: 75px;
}

@media(min-width: 576px) {

.scale-speedKit {
    min-width: 100px
}
  }

.scale-safe-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  min-width: 160px;
}

@media(min-width: 576px) {

.scale-safe-wrapper {
    min-width: 210px
}
  }

.scale-save {
  border-radius:  0px 4px 4px 0px;
  background-color: #0152cc;
  text-align: center;
  padding: 9px 14px;
  width: 100%;
}

.text-light-grey {
  font-size: 16px;
  color: #9b9b9b;
}

@media(min-width: 768px) {

.text-light-grey {
    font-size: 20px
}
  }

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

.factor-column {
  width: 55%;
}

@media(min-width: 576px) {

.factor-column {
    width: 33.3333%
}
  }

.metric-column {
  width: 22.5%;
}

@media(min-width: 576px) {

.metric-column {
    width: 33.3333%
}
  }

.details-toggle-wrapper {
  position: relative;
  margin-top: -20px;
}

.details-toggle {
  border-radius: 100px;
  border: solid 1px #E1E8F0;
  background-color: #ffffff;
  font-weight: 500;
  font-size: 16px;
  margin: auto;
  text-align: center;
  cursor: pointer;
  padding: 4px;
  width: 235px;
}

@media(min-width: 768px) {

.details-toggle {
  font-size: 20px
}
}

.details-toggle-arrow {
  margin-left: 2px;
  margin-top: 4px;
}

.result-details-collapse {
  position: relative;
  border-radius: 4px;
  border: solid 1px #E1E8F0;
  background-color: #ffffff;
  min-height: 115px;
  visibility: visible !important;
  padding-bottom: 20px;
}

.fade-out:after {
  content:'';
  width:100%;
  height:100%;
  position:absolute;
  left:0;
  top:0;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) -50px, #ffffff)
}

.result__details-metrics {
  font-size: 16px;
}

@media(min-width: 576px) {

.result__details-metrics {
    font-size: 18px
}
  }

.result__details-metrics .metricValue {
    font-weight: 500;
  }

@media(min-width: 768px) {

.result__details-metrics .metricValue {
      font-size: 26px
  }
    }

.result__details-metrics .faster {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    font-size: 16px;
    font-weight: 600;
  }

@media(min-width: 576px) {

.result__details-metrics .faster {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      font-size: 18px
  }
    }

@media(min-width: 768px) {

.result__details-metrics .faster {
      font-size: 22px
  }
    }

.result__details-metrics .faster-value {
    padding-right: 0;
  }

@media(min-width: 576px) {

.result__details-metrics .faster-value {
      padding-right: 5px
  }
    }

.result__details-metrics .factor {
    font-weight: 500;
  }

.result__details-metrics .competitor-metric-scale {
    height: 40px;
    border-radius: 4px;
    background-color: #6b7c96;
  }

.result__details-metrics .speedKit-metric-scale {
    border-radius: 4px 0px 0px 4px;
    background-color: #0568fd;
  }

.result__details-metrics .speedKit-metric-scale-save {
    border-radius: 0px 4px 4px 0px ;
    background-color: #0152cc;
    width: 100%;
  }

.bar-cut-image {
  margin-left: -6px;
  margin-right: -5px;
  height: 100%;
  z-index: 1;
}

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

.worthiness-header {
  font-size: 24px;
  font-weight: 800;
  margin: 10px 0;
}

@media(min-width: 576px) {

.worthiness-header {
    font-size: 30px
}
  }

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

.margin-bottom {
  margin-bottom: 10px;
}

.companyName {
  font-size: 22px;
  font-weight: 500;
}

.box-wrapper {
  padding: 40px 20px 40px 20px;
}

.boxFont {
  font-size: 16px;
}

.greenBox {
  width: 25px;
  height: 24px;
  border-radius: 4px;
  background-color: #12b84f;
}

.orangeBox {
  width: 25px;
  height: 24px;
  border-radius: 4px;
  background-color: #ff9d00;
}

.redBox {
  width: 25px;
  height: 24px;
  border-radius: 4px;
  background-color: #dd4b39;
}

.barRowContainerWrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  width: 100%;
  margin-bottom: 20px;
}

.barRowContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 100%;
}

.threeBars {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  width: 100%;
}

.greenBar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 4px;
  background-color: #12b84f;
  height: 45px;
  margin-right: 2px;
}

.orangeBar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 4px;
  background-color: #ff9d00;
  height: 45px;
  margin-right: 2px;
}

.redBar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 4px;
  background-color: #dd4b39;
  height: 45px;
}

.text-box-width {
  width: 200px;
  margin-bottom: 8px;
}

.barText {
  font-size: 20px;
  font-weight: 500;
  color: white;
  padding: 10px;
}

.text-input-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  margin-bottom: 18px;
  
}

.text-input {
  height: 100%;
  width: 100%;
  background-color: #EEF2F7;
  padding: 22px 22px 18px;
  border: 1px solid #E1E8F0;
  border-radius: 4px;
  -webkit-box-shadow: inset 0px 0px 0px 0px red;
          box-shadow: inset 0px 0px 0px 0px red;

  
}

.text-input::-webkit-input-placeholder{
  color:#6B7C96;
}

.text-input::-moz-placeholder{
  color:#6B7C96;
}

.text-input::-ms-input-placeholder{
  color:#6B7C96;
}

.text-input::placeholder{
  color:#6B7C96;
}

.comparison-row-inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 100%;
}

.comparison-button {
  font-family: "Poppins";
  font-weight: bold;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #0568fd;
  border-radius: 4px;
  outline: none;
  border: none;
  width: 100%;
  height: 60px;
}

.comparison-button-text {
  color: white;
}

.comparison-bottom-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.comparison-button:hover {
  cursor: pointer;
}

.ul-new {
  margin: 0;
  padding: 0;
}

.loader,
.loader:after {
  border-radius: 50%;
  width: 5em;
  height: 5em;
}

.loader {
  margin: 60px auto;
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: 0.5em solid rgba(255, 255, 255, .2);
  border-right: 0.5em solid rgba(255, 255, 255, .2);
  border-bottom: 0.5em solid rgba(255, 255, 255, .2);
  border-left: 0.5em solid #ffffff;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear;
}

@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@media (min-width: 1441px) {
  .boxFont {
    font-size: 20px;
  }
  .greenBox {
    width: 40px;
  }
  .orangeBox {
    width: 40px;
  }
  .redBox {
    width: 40px;
  }
  .threeBars {
    width: 750px;
  }
  .barRowContainer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .text-input-wrapper {
    width: 500px;
    height: 60px;
  }
  .comparison-button {
    width: 250px;
    height: 60px;
  }
  .comparison-row-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    width: 750px;
  }
  .box-wrapper {
    padding: 40px 60px 40px 60px;
  }
}


/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

@font-face {
  font-family: Poppins;
  font-weight: bold;
  src: url(/static/media/Poppins-SemiBold.cce5625b.ttf);
}

.result-footer {
  background: #FFFFFF;
}

.footer-wrapper {
  
  width: 100vw;
  color: #282C39;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack:center;
      -ms-flex-pack:center;
          justify-content:center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: left;
  margin: auto;
  padding: 20px;

}

@media(min-width: 768px) {

.footer-wrapper {
    
    max-width:70vw;
    padding-bottom:20vh

}
  }

.footer-content{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-style: normal;
  gap:1rem;
  width: 100vw;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  
}

@media (min-width: 992px){

.footer-content{
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row
  
}
  }

@media(min-width: 992px){

.logoCol{
    width: 35%
  
}
  }

.column{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.content-wrapper{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 1rem;
  font-size: 1.2rem;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;

}

.spacebetween{
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  height: 100%;
}

.marginFree{
  margin: 0;

}

.heading{
  font-size:1.6rem;
  font-weight: bold;
}

.footer-menu-column{
  width: 100%;
}

@media(min-width: 576px) {

.footer-menu-column{
    width: 50%
}
  }

@media(min-width: 992px) {

.footer-menu-column{
    width: 25%
}
  }

.footer-menu-header {
  font-size: 1.5rem;
  font-weight: 700;
  text-transform: uppercase;
}

.footer-menu-item {
  font-size: 1.125rem;
}

.footer-line {
  background-color: #fff;
  width: 100%;
  height: 2px;
}

.pVonLogo{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: left;
      -ms-flex-align: left;
          align-items: left;
  margin-bottom: 0.5rem;
  
}

.logowirklich{
  height: 3.8rem;
  -o-object-fit: contain;
     object-fit: contain;
  
  aspect-ratio: 5.25/1;

}

@media(min-width: 992px){

.logowirklich{
    width: 170px

}
  }

.footer-icon {
  padding-right: 0.25rem;
  padding-left: 0.25rem;
}

@media(min-width: 576px) {

.footer-icon {
    padding-right: 0.5rem;
    padding-left: 0.5rem
}
  }

@media(min-width: 768px) {

.footer-icon {
    padding-right: 1rem;
    padding-left: 1rem
}
  }

.footer-line-wrapper {
  width: 25%;
}

@media(min-width: 768px) {

.footer-line-wrapper {
    width: 33.3333%
}
  }

.footer-icon-wrapper {
  width: 50%;
}

@media(min-width: 768px) {

.footer-icon-wrapper {
    width: 33.3333%
}
  }

.customer-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 50%;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media(min-width: 768px) {

.customer-wrapper {
    width: 25%
}
  }

.customer-img {
  width: 60%;
  min-width: 130px;
  max-height: 50px;
  margin-bottom: 40px;
}

@media(min-width: 768px) {

.customer-img {
    width: 70%;
    max-height: 60px
}
  }

.cta-wrapper {
  padding: 48px 16px 96px 16px;
}

@media(min-width: 576px) {

.cta-wrapper {
    padding: 64px 0 112px 0
}
  }

.cta{

  padding: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

@media(min-width: 992px){

.cta{
   padding-top: 3rem;
   padding-bottom: 3rem
}
  }

@media(min-width: 1441px){
   
  }

.cta-header {
  font-size: 1.875rem;
  font-weight: 700;
  letter-spacing: -.025em;
}

@media(min-width: 576px) {

.cta-header {
    font-size: 2.25rem
}
  }

@media(min-width: 768px) {

.cta-header {
    font-size: 3rem
}
  }

.cta-img {
  height: 2.5rem;
}

@media(min-width: 576px) {

.cta-img {
    height: 3rem
}
  }

@media(min-width: 768px) {

.cta-img {
    height: 4.2rem
}
  }

.blue{
  background-color: #0568fd;
}

.alignCenter{
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.subText{
  font-size: 1.2rem;
}

.btn{
  font-weight: bold;
}

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

.contact__form {
  color: #9b9b9b;
}

.contact__form .single-input-wrapper {
    width: 100%;
    margin: auto;
  }

.contact__form .single-input {
    width: 100%;
    height: 60px;
    font-size: 18px;
    border-radius: 4px;
    padding: 18px;
    border: solid 2px #dedede;
    background-color: #ffffff;
  }

@media (min-width: 576px) {

.contact__form .single-input {
      font-size: 22px
  }
    }

.contact__form .single-submit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    height: 60px;
    font-size: 18px;
  }

@media (min-width: 576px) {

.contact__form .single-submit {
      font-size: 20px
  }
    }

::-webkit-input-placeholder {
  color: #9b9b9b;
  opacity: 1;
}

::-moz-placeholder {
  color: #9b9b9b;
  opacity: 1;
}

::-ms-input-placeholder {
  color: #9b9b9b;
  opacity: 1;
}

::placeholder {
  color: #9b9b9b;
  opacity: 1;
}

/*

  CUSTOM MEDIA QUERIES

  Media query values can be changed to fit your own content.
  There are no magic bullets when it comes to media query width values.
  They should be declared in em units - and they should be set to meet
  the needs of your content. You can also add additional media queries,
  or remove some of the existing ones.

  These media queries can be referenced like so:

  @media (--breakpoint-not-small) {
    .medium-and-larger-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-medium) {
    .medium-screen-specific-style {
      background-color: red;
    }
  }

  @media (--breakpoint-large) {
    .large-and-larger-screen-specific-style {
      background-color: red;
    }
  }

*/

/* Media Queries */

:root {
}

.error-info-box {
  margin-top: 40px;
  padding: 16px;
  border-radius: 4px;
  border: solid 2px rgba(255, 255, 255, .24);
}

@media (min-width: 768px) {
  .error-info-box {
    padding: 24px;
  }
}

@media (min-width: 992px) {
    .result-error .device__wrapper-outer .device__wrapper > .device__screen {
      padding: 80px 150px 40px !important;
      }
}

.toast {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  border-radius: 4px;
  color: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 12px;
  background: rgba(231, 76, 60, 0.95);
  font-size: 14px;
  font-weight: 400;
}

.toast:not(:last-child) {
  margin: 0 0 12px;
}

.toast__content {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  margin: 0 12px 0 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.toast__dismiss {
  -webkit-appearance: none;
  -moz-appearance: none;
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  font: inherit;
  padding: 0;
}

.toasts {
  top: 16px;
  position: fixed;
  right: 16px;
  width: 240px;
  z-index: 1234;
}


/*# sourceMappingURL=main.d6555e1f.css.map*/