@charset "UTF-8";
/* Bourbon
----------------------*/
/* Utilities + Helpers
----------------------*/
/* Base Styling
----------------------*/
/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

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

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

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

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

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

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

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

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

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

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

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

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

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

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

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

td,
th {
  padding: 0; }

/* Colors
---------------------------------*/
/* Global Variables
----------------------*/
/* Solid Fills
----------------------*/
.background-gray-fill {
  background: #1f2227; }

.background-violet-fill {
  background: rgba(138, 105, 212, 0.2); }

.light-gray-fill {
  background: #F9F9FB; }

/* Gradient Fills
----------------------*/
.gray-gradient-fill {
  background-color: #F9F9FB;
  background-image: -webkit-linear-gradient(rgba(249, 249, 251, 0.25), #f8f9fa);
  background-image: linear-gradient(rgba(249, 249, 251, 0.25), #f8f9fa); }

.gray-tile-gradient-fill {
  background-color: #F9F9FB;
  background-image: -webkit-linear-gradient(#F9F9FB, #f8f9fa);
  background-image: linear-gradient(#F9F9FB, #f8f9fa); }

.violet-gradient-fill {
  background-color: #8a69d4;
  background-image: -webkit-linear-gradient(-225deg, #8a69d4, #AD62CC);
  background-image: linear-gradient(-45deg,#8a69d4, #AD62CC); }

.orchid-gradient-fill {
  background-color: #F04E98;
  background-image: -webkit-linear-gradient(-225deg, #F04E98, #AD62CC);
  background-image: linear-gradient(-45deg,#F04E98, #AD62CC); }

.violet-blue-gradient-fill {
  background-color: #4C8FFB;
  background-image: -webkit-linear-gradient(-225deg, #4C8FFB, #8a69d4);
  background-image: linear-gradient(-45deg,#4C8FFB, #8a69d4); }

.blue-green-gradient-fill {
  background-color: #00C389;
  background-image: -webkit-linear-gradient(-225deg, #00C389, #4C8FFB);
  background-image: linear-gradient(-45deg,#00C389, #4C8FFB); }

.fuschia-yellow-gradient-fill {
  background-color: #FFB500;
  background-image: -webkit-linear-gradient(-225deg, #FFB500, #F04E98);
  background-image: linear-gradient(-45deg,#FFB500, #F04E98); }

.platform-overview-fill {
  background-color: #8a69d4;
  background-image: -webkit-linear-gradient(-225deg, #8a69d4, #AD62CC, #F04E98);
  background-image: linear-gradient(-45deg,#8a69d4, #AD62CC, #F04E98); }

/* Text Fills
----------------------*/
.text-white {
  color: #fff; }

.text-violet {
  color: #8a69d4; }

/* Typography
---------------------------------*/
html {
  font-size: 100%; }

body, input, textarea {
  font-size: 16px;
  font-size: 1rem;
  font-weight: 300;
  color: #414752;
  line-height: normal;
  letter-spacing: normal;
  word-spacing: normal;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility; }

a {
  color: #4C8FFB;
  text-decoration: none; }

/* Headings
----------------------*/
h1, h2, h3,
h4, h5, h6 {
  display: block;
  font-family: "Gotham SSm A", "Gotham SSm B", sans-serif;
  font-weight: 400;
  margin: 0; }

h1 {
  font-size: 32px;
  font-size: 2rem; }

h2 {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 40px;
  line-height: 2.5rem; }

h3 {
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 36px;
  line-height: 2rem; }

h4, h5, h6 {
  font-size: 14px;
  font-size: 0.875rem; }

/* Paragraphs
----------------------*/
p {
  font-size: 16px;
  font-size: 1rem;
  color: #6E798B;
  line-height: 30px;
  line-height: 1.9rem; }

/* Lists
----------------------*/
.page-content ul {
  font-size: 16px;
  font-size: 1rem;
  color: #6E798B;
  line-height: 30px;
  line-height: 1.9rem;
  list-style-position: inside; }

/* Font Helpers
----------------------*/
.blockquote {
  position: relative;
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 38px;
  line-height: 2.375rem; }
  .blockquote:before {
    content: '“';
    position: absolute;
    top: 0;
    left: -25px;
    font-size: 32px;
    font-size: 2rem;
    color: #8a69d4;
    font-weight: 800; }
  .blockquote:after {
    content: '”';
    top: auto;
    left: auto;
    font-size: 32px;
    font-size: 2rem;
    color: #8a69d4;
    font-weight: 800; }
  .blockquote.small {
    font-size: 16px;
    font-size: 1rem;
    line-height: 30px;
    line-height: 1.9rem; }
    .blockquote.small:before, .blockquote.small:after {
      font-size: 20px;
      font-size: 1.25rem;
      color: #dadde2; }
    .blockquote.small:before {
      left: -15px; }
  @media only screen and (max-width: 640px) {
    .blockquote {
      padding: 0 10px; }
      .blockquote:before {
        left: -5px; } }

.small-heading {
  font-size: 12px;
  font-size: 0.75rem;
  margin-bottom: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05rem; }

.small-text {
  font-size: 12px;
  font-size: 0.75rem; }

.caption {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 25px;
  line-height: 1.6rem; }

.italic {
  font-style: italic; }

.uppercase {
  text-transform: uppercase; }

.strong-caps {
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.05rem; }

.text-left {
  text-align: left   !important; }

.text-center {
  text-align: center !important; }

.text-right {
  text-align: right  !important; }

.text-inline {
  display: inline-block;
  margin-right: 10px; }

strong {
  font-weight: 600;
  color: inherit; }

/* Modules
----------------------*/
/* Buttons
---------------------------------*/
.btn {
  display: inline-block;
  cursor: pointer;
  padding: 10px 25px;
  font-size: 12px;
  font-size: 0.75rem;
  color: #fff;
  font-weight: 500;
  text-decoration: none;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: 0.05rem;
  line-height: normal;
  overflow: hidden;
  background: #4C8FFB;
  background-color: #4C8FFB;
  background-image: -webkit-linear-gradient(-360deg, #4C8FFB, #4cacfb);
  background-image: linear-gradient(90deg,#4C8FFB, #4cacfb);
  border: 1px solid transparent;
  border-radius: 2px;
  -webkit-transition: all 0.1s ease;
  -moz-transition: all 0.1s ease;
  transition: all 0.1s ease; }
  .btn:hover {
    color: #fff;
    text-decoration: none;
    box-shadow: rgba(0, 0, 0, 0.19) 0 2px 3px, rgba(76, 172, 251, 0.3) 0 0 6px 3px; }
  .btn:active {
    box-shadow: rgba(0, 0, 0, 0.19) 0 1px 2px, rgba(76, 172, 251, 0.3) 0 0 8px 4px;
    -webkit-transform: scale(0.975);
    -moz-transform: scale(0.975);
    -ms-transform: scale(0.975);
    -o-transform: scale(0.975);
    transform: scale(0.975); }
  .btn--white {
    color: #4C8FFB;
    background: #fff;
    background-image: none; }
    .btn--white:hover {
      color: #4cacfb;
      box-shadow: rgba(0, 0, 0, 0.19) 0 2px 3px, rgba(76, 172, 251, 0.3) 0 0 6px 3px; }
    .btn--white:active {
      box-shadow: rgba(0, 0, 0, 0.19) 0 1px 2px, rgba(76, 172, 251, 0.3) 0 0 8px 4px;
      -webkit-transform: scale(0.975);
      -moz-transform: scale(0.975);
      -ms-transform: scale(0.975);
      -o-transform: scale(0.975);
      transform: scale(0.975); }
  .btn--black {
    color: #fff;
    background: #1f2227;
    background-image: none; }
  .btn--outline {
    color: #fff;
    background: transparent;
    background-image: none;
    border-color: #fff; }
    .btn--outline:hover {
      background: rgba(255, 255, 255, 0.1);
      box-shadow: none; }
  .btn--secondary {
    color: #99A1AE;
    background: transparent;
    background-image: none;
    border-color: #99A1AE; }
    .btn--secondary:hover {
      color: #4C8FFB;
      border-color: #4C8FFB;
      box-shadow: none; }
  .btn--large {
    padding: 15px 30px;
    border-radius: 3px; }
  .btn.header-cta {
    font-size: 10px;
    font-size: 0.625rem;
    font-weight: 700;
    line-height: 12px; }
  .btn--full {
    width: 100%; }

/* Form Elements
---------------------------------*/
.input {
  display: block;
  width: 100%;
  padding: 10px 15px;
  margin: 0;
  -webkit-font-smoothing: antialiased;
  border: 1px solid #dadde2;
  border-radius: 2px;
  outline: 0;
  -webkit-transition: all 0.1s ease;
  -moz-transition: all 0.1s ease;
  transition: all 0.1s ease; }
  .input::-webkit-input-placeholder {
    color: #C5C9D1;
    font-weight: 300; }
  .input::-moz-placeholder {
    color: #C5C9D1;
    font-weight: 300; }
  .input:-moz-placeholder {
    color: #C5C9D1;
    font-weight: 300; }
  .input:-ms-input-placeholder {
    color: #C5C9D1;
    font-weight: 300; }
  .input:hover {
    border-color: #C5C9D1; }
  .input:focus {
    border-color: #4C8FFB; }
  .input--error {
    border-color: #F95E59;
    background: rgba(249, 94, 89, 0.1); }
    .input--error:hover {
      background: #fff; }

.large-tile {
  z-index: 1;
  display: block;
  position: relative;
  height: 275px;
  color: #414752;
  text-decoration: none;
  border-right: 1px solid rgba(0, 0, 0, 0.05);
  border-bottom: none;
  box-shadow: rgba(0, 0, 0, 0.19) 0 2px 3px -2px;
  overflow: hidden;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  transition: all 0.2s ease; }
  @media only screen and (max-width: 640px) {
    .large-tile {
      height: 225px;
      border-bottom: 1px solid rgba(0, 0, 0, 0.1); } }
  .large-tile:hover {
    box-shadow: rgba(0, 0, 0, 0.3) 0 10px 25px -10px; }
    .large-tile:hover .tile-title {
      color: #fff; }
    .large-tile:hover p {
      color: #fff; }
    .large-tile:hover .bg-fill {
      opacity: 1; }
  .large-tile:active {
    box-shadow: rgba(0, 0, 0, 0.25) 0 5px 15px -10px; }
  .large-tile .tile-title {
    font-weight: 400;
    margin-bottom: 15px;
    -webkit-transition: color 0.2s ease;
    -moz-transition: color 0.2s ease;
    transition: color 0.2s ease; }
  .large-tile p {
    -webkit-transition: color 0.2s ease;
    -moz-transition: color 0.2s ease;
    transition: color 0.2s ease; }
  .large-tile .bg-fill {
    z-index: -1;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    opacity: 0;
    -webkit-transition: opacity 0.2s ease;
    -moz-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease; }

.product-tile-img {
  z-index: -1;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0; }
  .product-tile-img img {
    position: absolute;
    width: 65%;
    top: 35%;
    left: -10%;
    -webkit-filter: drop-shadow(rgba(0, 0, 0, 0.19) 0 25px 10px); }
    @media only screen and (max-width: 640px) {
      .product-tile-img img {
        width: 100%;
        top: 60%; } }
  .product-tile-img--right img {
    left: auto;
    right: -10%; }

.rounded-border {
  border: 1px solid transparent;
  border-radius: 2px; }
  .rounded-border.violet-border {
    border-color: #8a69d4; }

.horizontal-tile {
  cursor: pointer;
  display: block;
  margin-bottom: 30px;
  padding: 40px;
  background: #f8f9fa;
  border: 1px solid transparent;
  overflow: hidden;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  transition: all 0.2s ease; }
  .horizontal-tile:hover {
    background: #fff;
    background: rgba(240, 78, 152, 0.1);
    box-shadow: rgba(0, 0, 0, 0.19) 0 15px 25px -10px; }
    .horizontal-tile:hover h3 {
      color: #F04E98; }
    .horizontal-tile:hover .icon {
      color: #F04E98; }
  .horizontal-tile__icon .icon {
    display: inline-block;
    fill: currentColor;
    width: 6rem;
    height: 6rem;
    color: #99A1AE;
    font-size: 96px;
    vertical-align: middle; }
  .horizontal-tile__arrow .icon {
    margin-top: 10px;
    margin-left: 20px;
    display: inline-block;
    fill: currentColor;
    width: 4rem;
    height: 5rem;
    color: #dadde2;
    font-size: 80px;
    vertical-align: middle;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    transition: all 0.2s ease; }
  .horizontal-tile h3 {
    color: #5d6676;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    transition: all 0.2s ease; }
  .horizontal-tile p {
    margin-bottom: 0 !important; }

/* Layout
----------------------*/
.sticky-announcement {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 1000;
  right: 0;
  background: #414752;
  color: white;
  padding: 30px;
  box-shadow: rgba(0, 0, 0, 0.25) 0 0 45px;
  background-image: -webkit-radial-gradient(50% 50%, transparent, rgba(31, 34, 39, 0.75));
  background-image: radial-gradient(  at 50% 50%, transparent, rgba(31, 34, 39, 0.75)); }

.page-content {
  position: relative;
  overflow: hidden; }
  .page-content h2 {
    margin-bottom: 30px; }
  .page-content h3 {
    margin-bottom: 20px; }
  .page-content p, .page-content ul {
    margin-bottom: 30px; }
  .page-content img {
    width: 100%; }

.news-alert {
  display: block;
  position: relative;
  padding: 20px 30px;
  width: 100%;
  font-size: 10px;
  font-size: 0.625rem;
  color: #fff;
  text-align: center;
  background: rgba(255, 255, 255, 0.15);
  border-radius: 3px; }
  .news-alert__tag {
    display: inline-block;
    margin-right: 20px;
    padding: 5px 10px;
    color: #4C8FFB;
    font-weight: 600;
    text-transform: uppercase;
    background: #fff;
    border-radius: 2px; }
  .news-alert__content {
    display: inline-block; }
  .news-alert__cta {
    display: inline-block;
    margin-left: 20px;
    padding: 5px 10px;
    color: rgba(255, 255, 255, 0.85);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05rem;
    text-decoration: none;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 2px;
    -webkit-transform: all 0.1s ease;
    -moz-transform: all 0.1s ease;
    -ms-transform: all 0.1s ease;
    -o-transform: all 0.1s ease;
    transform: all 0.1s ease; }
    .news-alert__cta:hover {
      color: #fff;
      background: rgba(255, 255, 255, 0.1);
      border-color: rgba(255, 255, 255, 0.5); }

.icon-menu {
  display: inline-block;
  margin-bottom: 20px;
  padding: 10px;
  border-radius: 2px; }

.icon-square {
  display: inline-block;
  margin-bottom: 20px;
  padding: 10px;
  border-radius: 2px; }
  .icon-square .icon {
    display: inline-block;
    fill: currentColor;
    width: 0.75em;
    height: 0.75em;
    color: #fff;
    font-size: 30px;
    vertical-align: middle; }
  .icon-square--large {
    padding: 20px; }
  .icon-square--fuschia {
    background: rgba(240, 78, 152, 0.1); }
    .icon-square--fuschia .icon {
      color: #F04E98; }
  .icon-square--orchid {
    background: rgba(173, 98, 204, 0.1); }
    .icon-square--orchid .icon {
      color: #AD62CC; }
  .icon-square--violet {
    background: rgba(138, 105, 212, 0.1); }
    .icon-square--violet .icon {
      color: #8a69d4; }
  .icon-square--blue {
    background: rgba(76, 143, 251, 0.1); }
    .icon-square--blue .icon {
      color: #4C8FFB; }
  .icon-square--green {
    background: rgba(0, 195, 137, 0.1); }
    .icon-square--green .icon {
      color: #00C389; }

.lnr-mustache {
  /* We can use "font-size" for changing the size
  of the SVG because its width and height were
  set 1em.
  To get crisp results, use sizes that are
  a multiple of 20; because Linearicons was
  designed on a 20 by 20 grid. */ }

.client-logos {
  display: block;
  list-style: none;
  text-align: center; }
  .client-logos__item {
    display: inline-block; }
    .client-logos__item.tall img {
      max-height: 40px; }
    .client-logos__item a {
      display: inline-block;
      height: 100%;
      padding: 0 30px;
      text-align: center;
      text-decoration: none;
      border: none;
      vertical-align: middle;
      overflow: hidden;
      opacity: 0.75;
      -webkit-transition: opacity 0.2s ease;
      -moz-transition: opacity 0.2s ease;
      transition: opacity 0.2s ease; }
      .client-logos__item a:hover {
        opacity: 1; }
      .client-logos__item a img {
        max-height: 25px; }

.customer-testimonial {
  min-height: 475px; }

.counter {
  display: block;
  position: relative; }
  .counter__digit {
    display: inline-block;
    width: 60px;
    padding: 30px 15px;
    margin-right: 2px;
    font-size: 40px;
    font-size: 2.5rem;
    font-weight: 300;
    text-align: center;
    line-height: 40px;
    line-height: 2.5rem;
    background: #fff;
    background-color: #fff;
    background-image: -webkit-linear-gradient(#fff, #f8f9fa);
    background-image: linear-gradient(#fff, #f8f9fa);
    border-radius: 2px;
    box-shadow: rgba(0, 0, 0, 0.19) 0 1px 2px; }
  .counter__unit {
    display: inline-block;
    padding: 30px 15px;
    margin-right: 2px;
    font-size: 24px;
    font-size: 1.5rem;
    font-weight: 300;
    text-align: center;
    vertical-align: super;
    background: #fff;
    background-color: #fff;
    background-image: -webkit-linear-gradient(#fff, #f8f9fa);
    background-image: linear-gradient(#fff, #f8f9fa);
    border-radius: 2px;
    box-shadow: rgba(0, 0, 0, 0.19) 0 1px 2px; }
  .counter__decimal {
    display: inline-block;
    padding: 30px 0;
    margin-right: 2px;
    font-size: 24px;
    font-size: 1.5rem;
    font-weight: 300;
    text-align: center;
    vertical-align: super; }

.intro-launch {
  position: absolute;
  display: block;
  top: 0;
  bottom: 0;
  left: 0;
  width: 50%;
  overflow: hidden;
  -webkit-perspective: 2000px;
  -moz-perspective: 2000px;
  perspective: 2000px;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d; }
  @media only screen and (max-width: 640px) {
    .intro-launch {
      position: relative;
      width: 100%;
      height: 300px; } }
  .intro-launch.load-in-launch .rocket {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
    @media only screen and (max-width: 640px) {
      .intro-launch.load-in-launch .rocket {
        -webkit-transform: translate3d(0, 25%, 0);
        -moz-transform: translate3d(0, 25%, 0);
        -ms-transform: translate3d(0, 25%, 0);
        -o-transform: translate3d(0, 25%, 0);
        transform: translate3d(0, 25%, 0); } }
  .intro-launch .layer-clouds-1 {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: url("/images/intro-launch-clouds1.png") repeat-y;
    background-size: cover;
    -webkit-transform: translate3d(0, 0, -50px);
    -moz-transform: translate3d(0, 0, -50px);
    -ms-transform: translate3d(0, 0, -50px);
    -o-transform: translate3d(0, 0, -50px);
    transform: translate3d(0, 0, -50px);
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    animation: movingClouds 15s linear infinite; }
  .intro-launch .layer-clouds-2 {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: url("/images/intro-launch-clouds2.png") repeat-y;
    background-size: cover;
    -webkit-transform: translate3d(0, 0, -25px);
    -moz-transform: translate3d(0, 0, -25px);
    -ms-transform: translate3d(0, 0, -25px);
    -o-transform: translate3d(0, 0, -25px);
    transform: translate3d(0, 0, -25px);
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    animation: movingClouds 10s linear infinite; }
  .intro-launch .layer-clouds-3 {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: url("/images/intro-launch-clouds3.png") repeat-y;
    background-size: cover;
    -webkit-transform: translate3d(0, 0, 25px);
    -moz-transform: translate3d(0, 0, 25px);
    -ms-transform: translate3d(0, 0, 25px);
    -o-transform: translate3d(0, 0, 25px);
    transform: translate3d(0, 0, 25px);
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    animation: movingClouds 7.5s linear infinite; }
  .intro-launch .rocket {
    display: block;
    position: absolute;
    top: 50%;
    bottom: 0;
    left: 0;
    right: 0;
    width: 50%;
    height: 300px;
    margin-top: -150px;
    margin-left: 25%;
    -webkit-transform: translate3d(0, 150%, 0);
    -moz-transform: translate3d(0, 150%, 0);
    -ms-transform: translate3d(0, 150%, 0);
    -o-transform: translate3d(0, 150%, 0);
    transform: translate3d(0, 150%, 0);
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition: -webkit-transform 1.5s ease;
    -moz-transition: -moz-transform 1.5s ease;
    transition: transform 1.5s ease; }
    .intro-launch .rocket .layer-flame {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background: url("/images/intro-launch-flame.png") no-repeat;
      background-size: contain;
      animation: shake 1s alternate infinite; }
    .intro-launch .rocket .layer-rocket {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background: url("/images/intro-launch-rocket.png") no-repeat;
      background-size: contain;
      animation: shake 1.5s linear infinite; }

@keyframes flicker {
  0% {
    transform: rotate(-1deg); }
  20% {
    transform: rotate(1deg); }
  40% {
    transform: rotate(-1deg); }
  60% {
    transform: rotate(1deg) scaleY(1.04); }
  80% {
    transform: rotate(-2deg) scaleY(0.92); }
  100% {
    transform: rotate(1deg); } }
@keyframes shake {
  0% {
    transform: rotate(-0.25deg); }
  5% {
    transform: rotate(0.5deg); }
  10% {
    transform: rotate(-0.25deg); }
  15% {
    transform: rotate(0.25deg); }
  20% {
    transform: rotate(-0.5deg); }
  25% {
    transform: rotate(0.25deg); }
  30% {
    transform: rotate(-0.25deg); }
  35% {
    transform: rotate(1deg); }
  40% {
    transform: rotate(-1deg); }
  45% {
    transform: rotate(1deg); }
  50% {
    transform: rotate(-1deg); }
  55% {
    transform: rotate(1deg); }
  60% {
    transform: rotate(-1deg); }
  65% {
    transform: rotate(1deg); }
  70% {
    transform: rotate(-1deg); }
  75% {
    transform: rotate(1.25deg); }
  80% {
    transform: rotate(-1.5deg); }
  85% {
    transform: rotate(1.25deg); }
  90% {
    transform: rotate(-1.25deg); }
  95% {
    transform: rotate(1.25deg); }
  100% {
    transform: rotate(-1.5deg); } }
@keyframes movingClouds {
  from {
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
    transform: translateY(-100%); }
  to {
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%); } }
.intro-foundation {
  position: absolute;
  display: block;
  top: 0;
  bottom: 0;
  right: 0;
  width: 50%;
  overflow: hidden; }
  @media only screen and (max-width: 640px) {
    .intro-foundation {
      position: relative;
      width: 125%;
      height: 250px;
      margin-left: -25px; } }
  .intro-foundation.load-in-foundation .circle-container .circle-grid .circle-col .circle-wrapper .circle {
    -webkit-transform: translateY(0) translateZ(0);
    -moz-transform: translateY(0) translateZ(0);
    -ms-transform: translateY(0) translateZ(0);
    -o-transform: translateY(0) translateZ(0);
    transform: translateY(0) translateZ(0);
    opacity: 1; }
    .intro-foundation.load-in-foundation .circle-container .circle-grid .circle-col .circle-wrapper .circle:hover {
      -webkit-transform: translateY(-10px) translateZ(20px);
      -moz-transform: translateY(-10px) translateZ(20px);
      -ms-transform: translateY(-10px) translateZ(20px);
      -o-transform: translateY(-10px) translateZ(20px);
      transform: translateY(-10px) translateZ(20px);
      box-shadow: rgba(0, 0, 0, 0.19) 0 35px 15px -10px; }

.email-launch {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 50%;
  overflow: hidden; }
  @media only screen and (max-width: 640px) {
    .email-launch {
      position: relative;
      width: 100%;
      height: 300px; } }
  .email-launch.load-in-launch .email-launch__button {
    -webkit-animation: buttonClick 2s ease forwards;
    -moz-animation: buttonClick 2s ease forwards;
    animation: buttonClick 2s ease forwards; }
  .email-launch.load-in-launch .email-launch__cursor {
    -webkit-animation: cursorMove 2s ease forwards;
    -moz-animation: cursorMove 2s ease forwards;
    animation: cursorMove 2s ease forwards; }
  .email-launch.load-in-launch .email-launch__campaigns {
    -webkit-animation: openCampaigns 2s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
    -moz-animation: openCampaigns 2s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
    animation: openCampaigns 2s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; }
  .email-launch__button {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 200px;
    margin-top: -20px;
    margin-left: -100px;
    padding: 15px 30px;
    font-size: 14px;
    font-size: 0.875rem;
    color: #fff;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.1rem;
    text-align: center;
    background-color: #4C8FFB;
    background-image: -webkit-linear-gradient(-360deg, #4C8FFB, #4cacfb);
    background-image: linear-gradient(90deg,#4C8FFB, #4cacfb);
    border-radius: 3px; }
  .email-launch__cursor {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 30px;
    width: 30px;
    background: url("/images/cursor-pointer.svg") no-repeat;
    background-size: cover;
    -webkit-transform: translate3d(200px, 50px, 0);
    -moz-transform: translate3d(200px, 50px, 0);
    -ms-transform: translate3d(200px, 50px, 0);
    -o-transform: translate3d(200px, 50px, 0);
    transform: translate3d(200px, 50px, 0); }
  .email-launch__campaigns {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 300px;
    width: 300px;
    margin-top: -150px;
    margin-left: -150px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 50%;
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
    opacity: 0; }
    .email-launch__campaigns .campaign-item {
      position: absolute;
      display: block;
      height: 70px;
      width: 70px;
      border-radius: 50%; }
      .email-launch__campaigns .campaign-item:nth-child(1) {
        top: 0;
        left: 0; }
      .email-launch__campaigns .campaign-item:nth-child(2) {
        top: 0;
        right: 0; }
      .email-launch__campaigns .campaign-item:nth-child(3) {
        bottom: 0;
        left: 0; }
      .email-launch__campaigns .campaign-item:nth-child(4) {
        bottom: 0;
        right: 0; }
      .email-launch__campaigns .campaign-item.blue {
        background-color: #71a6fc;
        background-image: -webkit-linear-gradient(#71a6fc, #4C8FFB);
        background-image: linear-gradient(#71a6fc, #4C8FFB); }
        .email-launch__campaigns .campaign-item.blue:after {
          border-color: #4C8FFB; }
      .email-launch__campaigns .campaign-item.violet {
        background-color: #a187dd;
        background-image: -webkit-linear-gradient(#a187dd, #8a69d4);
        background-image: linear-gradient(#a187dd, #8a69d4); }
        .email-launch__campaigns .campaign-item.violet:after {
          border-color: #8a69d4; }
      .email-launch__campaigns .campaign-item.orchid {
        background-color: #bc7fd5;
        background-image: -webkit-linear-gradient(#bc7fd5, #AD62CC);
        background-image: linear-gradient(#bc7fd5, #AD62CC); }
        .email-launch__campaigns .campaign-item.orchid:after {
          border-color: #AD62CC; }
      .email-launch__campaigns .campaign-item.fuschia {
        background-color: #f371ad;
        background-image: -webkit-linear-gradient(#f371ad, #F04E98);
        background-image: linear-gradient(#f371ad, #F04E98); }
        .email-launch__campaigns .campaign-item.fuschia:after {
          border-color: #F04E98; }
      .email-launch__campaigns .campaign-item.green {
        background-color: #00e9a4;
        background-image: -webkit-linear-gradient(#00e9a4, #00C389);
        background-image: linear-gradient(#00e9a4, #00C389); }
        .email-launch__campaigns .campaign-item.green:after {
          border-color: #00C389; }
      .email-launch__campaigns .campaign-item.yellow {
        background-color: #ffc026;
        background-image: -webkit-linear-gradient(#ffc026, #FFB500);
        background-image: linear-gradient(#ffc026, #FFB500); }
        .email-launch__campaigns .campaign-item.yellow:after {
          border-color: #FFB500; }
      .email-launch__campaigns .campaign-item img {
        margin: 15px;
        width: 40px; }

@keyframes cursorMove {
  0% {
    -webkit-transform: translate3d(200px, 50px, 0) scale(1);
    -moz-transform: translate3d(200px, 50px, 0) scale(1);
    -ms-transform: translate3d(200px, 50px, 0) scale(1);
    -o-transform: translate3d(200px, 50px, 0) scale(1);
    transform: translate3d(200px, 50px, 0) scale(1); }
  75% {
    -webkit-transform: translate3d(40px, 10px, 0);
    -moz-transform: translate3d(40px, 10px, 0);
    -ms-transform: translate3d(40px, 10px, 0);
    -o-transform: translate3d(40px, 10px, 0);
    transform: translate3d(40px, 10px, 0); }
  87.5% {
    -webkit-transform: translate3d(40px, 10px, 0) scale(0.9);
    -moz-transform: translate3d(40px, 10px, 0) scale(0.9);
    -ms-transform: translate3d(40px, 10px, 0) scale(0.9);
    -o-transform: translate3d(40px, 10px, 0) scale(0.9);
    transform: translate3d(40px, 10px, 0) scale(0.9); }
  100% {
    -webkit-transform: translate3d(40px, 10px, 0) scale(1);
    -moz-transform: translate3d(40px, 10px, 0) scale(1);
    -ms-transform: translate3d(40px, 10px, 0) scale(1);
    -o-transform: translate3d(40px, 10px, 0) scale(1);
    transform: translate3d(40px, 10px, 0) scale(1); } }
@keyframes buttonClick {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }
  40% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    box-shadow: none; }
  75% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    box-shadow: rgba(0, 0, 0, 0.19) 0 2px 3px, rgba(76, 172, 251, 0.3) 0 0 6px 3px; }
  87.5% {
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -ms-transform: scale(0.9);
    -o-transform: scale(0.9);
    transform: scale(0.9);
    box-shadow: rgba(0, 0, 0, 0.19) 0 1px 2px, rgba(76, 172, 251, 0.3) 0 0 8px 4px; }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    box-shadow: rgba(0, 0, 0, 0.19) 0 2px 3px, rgba(76, 172, 251, 0.3) 0 0 6px 3px; } }
@keyframes openCampaigns {
  0% {
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
    opacity: 0; }
  87.5% {
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
    opacity: 0; }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 1; } }
.email-foundation {
  position: absolute;
  display: block;
  top: 125px;
  bottom: 0;
  left: 0;
  width: 50%;
  overflow: hidden; }
  @media only screen and (max-width: 640px) {
    .email-foundation {
      position: relative;
      top: 0;
      width: 100%;
      height: 250px;
      margin-bottom: -50px; } }
  @media only screen and (max-width: 640px) {
    .email-foundation .circle-container {
      top: -100px; } }
  .email-foundation .circle-grid {
    -webkit-transform: rotateX(30deg) rotateY(20deg) rotateZ(-30deg) translate(-50px, 50px);
    -moz-transform: rotateX(30deg) rotateY(20deg) rotateZ(-30deg) translate(-50px, 50px);
    -ms-transform: rotateX(30deg) rotateY(20deg) rotateZ(-30deg) translate(-50px, 50px);
    -o-transform: rotateX(30deg) rotateY(20deg) rotateZ(-30deg) translate(-50px, 50px);
    transform: rotateX(30deg) rotateY(20deg) rotateZ(-30deg) translate(-50px, 50px); }
  .email-foundation.load-in-foundation .circle-container .circle-grid .circle-col .circle-wrapper .circle {
    -webkit-transform: translateY(0) translateZ(0);
    -moz-transform: translateY(0) translateZ(0);
    -ms-transform: translateY(0) translateZ(0);
    -o-transform: translateY(0) translateZ(0);
    transform: translateY(0) translateZ(0);
    opacity: 1; }
    .email-foundation.load-in-foundation .circle-container .circle-grid .circle-col .circle-wrapper .circle:hover {
      -webkit-transform: translateY(10px) translateZ(-20px);
      -moz-transform: translateY(10px) translateZ(-20px);
      -ms-transform: translateY(10px) translateZ(-20px);
      -o-transform: translateY(10px) translateZ(-20px);
      transform: translateY(10px) translateZ(-20px);
      box-shadow: rgba(0, 0, 0, 0.19) 0 35px 15px -10px; }

.email-automated {
  position: absolute;
  display: block;
  top: 0;
  bottom: 0;
  right: 0;
  width: 50%;
  overflow: hidden; }
  @media only screen and (max-width: 640px) {
    .email-automated {
      position: relative;
      top: 0;
      width: 100%;
      height: 250px;
      margin-bottom: -50px;
      border-top: 1px solid rgba(0, 0, 0, 0.1); } }
  .email-automated .circle-container {
    -webkit-transform: translate(50px, -150px);
    -moz-transform: translate(50px, -150px);
    -ms-transform: translate(50px, -150px);
    -o-transform: translate(50px, -150px);
    transform: translate(50px, -150px); }
    .email-automated .circle-container .circle-grid {
      -webkit-transform: rotateX(45deg) rotateY(0) rotateZ(15deg) translateY(-50px);
      -moz-transform: rotateX(45deg) rotateY(0) rotateZ(15deg) translateY(-50px);
      -ms-transform: rotateX(45deg) rotateY(0) rotateZ(15deg) translateY(-50px);
      -o-transform: rotateX(45deg) rotateY(0) rotateZ(15deg) translateY(-50px);
      transform: rotateX(45deg) rotateY(0) rotateZ(15deg) translateY(-50px); }
      .email-automated .circle-container .circle-grid .circle {
        -webkit-transform: translateY(0) translateZ(0);
        -moz-transform: translateY(0) translateZ(0);
        -ms-transform: translateY(0) translateZ(0);
        -o-transform: translateY(0) translateZ(0);
        transform: translateY(0) translateZ(0);
        opacity: 1; }
    @media only screen and (max-width: 640px) {
      .email-automated .circle-container {
        bottom: -200px;
        -webkit-transform: translate(0, -150px);
        -moz-transform: translate(0, -150px);
        -ms-transform: translate(0, -150px);
        -o-transform: translate(0, -150px);
        transform: translate(0, -150px); } }
  .email-automated .circle.ping:after {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    border: 1px solid;
    border-radius: 100%;
    -webkit-animation: ping 1.5s 0.5s ease infinite;
    -moz-animation: ping 1.5s 0.5s ease infinite;
    animation: ping 1.5s 0.5s ease infinite; }
  .email-automated .circle.delay-1:after {
    -webkit-animation-duration: 1.75s;
    -moz-animation-duration: 1.75s;
    animation-duration: 1.75s;
    -webkit-animation-delay: 0.25s;
    -moz-animation-delay: 0.25s;
    animation-delay: 0.25s; }
  .email-automated .circle.delay-2:after {
    -webkit-animation-duration: 1.25s;
    -moz-animation-duration: 1.25s;
    animation-duration: 1.25s;
    -webkit-animation-delay: 0.5s;
    -moz-animation-delay: 0.5s;
    animation-delay: 0.5s; }
  .email-automated .circle.delay-3:after {
    -webkit-animation-duration: 0.75s;
    -moz-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-animation-delay: 0.75s;
    -moz-animation-delay: 0.75s;
    animation-delay: 0.75s; }
  .email-automated .circle.delay-4:after {
    -webkit-animation-duration: 2s;
    -moz-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-delay: 1s;
    -moz-animation-delay: 1s;
    animation-delay: 1s; }

@keyframes ping {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 1; }
  50% {
    opacity: 1; }
  100% {
    -webkit-transform: scale(2);
    -moz-transform: scale(2);
    -ms-transform: scale(2);
    -o-transform: scale(2);
    transform: scale(2);
    opacity: 0; } }
.circle-container {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden;
  -webkit-perspective: 1000px;
  -moz-perspective: 1000px;
  perspective: 1000px;
  -webkit-transform: all 2s ease;
  -moz-transform: all 2s ease;
  -ms-transform: all 2s ease;
  -o-transform: all 2s ease;
  transform: all 2s ease; }
  .circle-container .circle-grid {
    position: absolute;
    right: 0;
    height: 600px;
    width: 600px;
    text-align: center;
    -webkit-transform: rotateX(45deg) rotateY(0) rotateZ(-15deg) translate(-50px, 50px);
    -moz-transform: rotateX(45deg) rotateY(0) rotateZ(-15deg) translate(-50px, 50px);
    -ms-transform: rotateX(45deg) rotateY(0) rotateZ(-15deg) translate(-50px, 50px);
    -o-transform: rotateX(45deg) rotateY(0) rotateZ(-15deg) translate(-50px, 50px);
    transform: rotateX(45deg) rotateY(0) rotateZ(-15deg) translate(-50px, 50px);
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform-origin: center;
    -moz-transform-origin: center;
    -ms-transform-origin: center;
    -o-transform-origin: center;
    transform-origin: center; }
    .circle-container .circle-grid .gradient-overlay {
      display: none;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background-color: transparent;
      background-image: -webkit-linear-gradient(left, transparent, white);
      background-image: linear-gradient(to right,transparent, white); }
  .circle-container .circle-col {
    display: block;
    float: left;
    width: 75px;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d; }
    .circle-container .circle-col:nth-child(odd) {
      margin-top: 36px; }
  .circle-container .circle-wrapper {
    display: block;
    position: relative;
    float: left;
    height: 70px;
    width: 70px;
    margin-bottom: 5px;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition: -webkit-transform 0.5s ease;
    -moz-transition: -moz-transform 0.5s ease;
    transition: transform 0.5s ease; }
    .circle-container .circle-wrapper:nth-child(7) .circle {
      -webkit-transition-delay: 100ms;
      -moz-transition-delay: 100ms;
      transition-delay: 100ms; }
    .circle-container .circle-wrapper:nth-child(6) .circle {
      -webkit-transition-delay: 150ms;
      -moz-transition-delay: 150ms;
      transition-delay: 150ms; }
    .circle-container .circle-wrapper:nth-child(5) .circle {
      -webkit-transition-delay: 200ms;
      -moz-transition-delay: 200ms;
      transition-delay: 200ms; }
    .circle-container .circle-wrapper:nth-child(4) .circle {
      -webkit-transition-delay: 250ms;
      -moz-transition-delay: 250ms;
      transition-delay: 250ms; }
    .circle-container .circle-wrapper:nth-child(3) .circle {
      -webkit-transition-delay: 300ms;
      -moz-transition-delay: 300ms;
      transition-delay: 300ms; }
    .circle-container .circle-wrapper:nth-child(2) .circle {
      -webkit-transition-delay: 350ms;
      -moz-transition-delay: 350ms;
      transition-delay: 350ms; }
    .circle-container .circle-wrapper:nth-child(1) .circle {
      -webkit-transition-delay: 400ms;
      -moz-transition-delay: 400ms;
      transition-delay: 400ms; }
    .circle-container .circle-wrapper .circle {
      display: block;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      text-align: center;
      background: #4C8FFB;
      border-radius: 100%;
      border: 1px solid transparent;
      box-shadow: rgba(0, 0, 0, 0.3) 0 5px 15px -3px;
      -webkit-transform: translateY(-10px) translateZ(20px);
      -moz-transform: translateY(-10px) translateZ(20px);
      -ms-transform: translateY(-10px) translateZ(20px);
      -o-transform: translateY(-10px) translateZ(20px);
      transform: translateY(-10px) translateZ(20px);
      -webkit-transform-style: preserve-3d;
      -moz-transform-style: preserve-3d;
      -ms-transform-style: preserve-3d;
      -o-transform-style: preserve-3d;
      transform-style: preserve-3d;
      -webkit-transition: all 0.5s ease;
      -moz-transition: all 0.5s ease;
      transition: all 0.5s ease;
      opacity: 0; }
      .circle-container .circle-wrapper .circle img {
        margin: 15px;
        width: 40px;
        opacity: 0.75;
        -webkit-transform-style: preserve-3d;
        -moz-transform-style: preserve-3d;
        -ms-transform-style: preserve-3d;
        -o-transform-style: preserve-3d;
        transform-style: preserve-3d; }
    .circle-container .circle-wrapper.blank {
      visibility: hidden; }
    .circle-container .circle-wrapper.blue .circle {
      background-color: #71a6fc;
      background-image: -webkit-linear-gradient(#71a6fc, #4C8FFB);
      background-image: linear-gradient(#71a6fc, #4C8FFB); }
      .circle-container .circle-wrapper.blue .circle:after {
        border-color: #4C8FFB; }
    .circle-container .circle-wrapper.violet .circle {
      background-color: #a187dd;
      background-image: -webkit-linear-gradient(#a187dd, #8a69d4);
      background-image: linear-gradient(#a187dd, #8a69d4); }
      .circle-container .circle-wrapper.violet .circle:after {
        border-color: #8a69d4; }
    .circle-container .circle-wrapper.orchid .circle {
      background-color: #bc7fd5;
      background-image: -webkit-linear-gradient(#bc7fd5, #AD62CC);
      background-image: linear-gradient(#bc7fd5, #AD62CC); }
      .circle-container .circle-wrapper.orchid .circle:after {
        border-color: #AD62CC; }
    .circle-container .circle-wrapper.fuschia .circle {
      background-color: #f371ad;
      background-image: -webkit-linear-gradient(#f371ad, #F04E98);
      background-image: linear-gradient(#f371ad, #F04E98); }
      .circle-container .circle-wrapper.fuschia .circle:after {
        border-color: #F04E98; }
    .circle-container .circle-wrapper.green .circle {
      background-color: #00e9a4;
      background-image: -webkit-linear-gradient(#00e9a4, #00C389);
      background-image: linear-gradient(#00e9a4, #00C389); }
      .circle-container .circle-wrapper.green .circle:after {
        border-color: #00C389; }
    .circle-container .circle-wrapper.yellow .circle {
      background-color: #ffc026;
      background-image: -webkit-linear-gradient(#ffc026, #FFB500);
      background-image: linear-gradient(#ffc026, #FFB500); }
      .circle-container .circle-wrapper.yellow .circle:after {
        border-color: #FFB500; }
  .circle-container--right .circle-grid {
    -webkit-transform: rotateX(45deg) rotateY(0) rotateZ(15deg) translateY(-50px);
    -moz-transform: rotateX(45deg) rotateY(0) rotateZ(15deg) translateY(-50px);
    -ms-transform: rotateX(45deg) rotateY(0) rotateZ(15deg) translateY(-50px);
    -o-transform: rotateX(45deg) rotateY(0) rotateZ(15deg) translateY(-50px);
    transform: rotateX(45deg) rotateY(0) rotateZ(15deg) translateY(-50px); }
    .circle-container--right .circle-grid .gradient-overlay {
      background-color: transparent;
      background-image: -webkit-linear-gradient(right, transparent, rgba(255, 255, 255, 0.75) 70%);
      background-image: linear-gradient(to left,transparent, rgba(255, 255, 255, 0.75) 70%); }
  .circle-container--right .circle-col {
    float: right; }

.ipad-iphone-wrapper {
  z-index: 0;
  position: absolute;
  display: block;
  top: 0;
  bottom: 0;
  right: 0;
  width: 50%;
  overflow: hidden; }
  @media only screen and (max-width: 640px) {
    .ipad-iphone-wrapper {
      position: relative;
      width: 100%;
      height: 250px;
      overflow: visible; } }
  .ipad-iphone-wrapper .layer-ipad, .ipad-iphone-wrapper .layer-iphone {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    -webkit-transition: -webkit-transform 1.5s ease;
    -moz-transition: -moz-transform 1.5s ease;
    transition: transform 1.5s ease; }
    .ipad-iphone-wrapper .layer-ipad img, .ipad-iphone-wrapper .layer-iphone img {
      width: 75%;
      -webkit-filter: drop-shadow(rgba(0, 0, 0, 0.15) 0 5px 20px);
      filter: drop-shadow(rgba(0, 0, 0, 0.15) 0 5px 20px); }
  .ipad-iphone-wrapper .layer-ipad {
    -webkit-transform: translate3d(0, 0, 0) rotate(45deg);
    -moz-transform: translate3d(0, 0, 0) rotate(45deg);
    -ms-transform: translate3d(0, 0, 0) rotate(45deg);
    -o-transform: translate3d(0, 0, 0) rotate(45deg);
    transform: translate3d(0, 0, 0) rotate(45deg); }
  .ipad-iphone-wrapper .layer-iphone {
    -webkit-transform: translate3d(30%, 10%, 0) rotate(45deg);
    -moz-transform: translate3d(30%, 10%, 0) rotate(45deg);
    -ms-transform: translate3d(30%, 10%, 0) rotate(45deg);
    -o-transform: translate3d(30%, 10%, 0) rotate(45deg);
    transform: translate3d(30%, 10%, 0) rotate(45deg); }
    .ipad-iphone-wrapper .layer-iphone img {
      -webkit-filter: drop-shadow(rgba(0, 0, 0, 0.25) 0 5px 20px);
      filter: drop-shadow(rgba(0, 0, 0, 0.25) 0 5px 20px); }

.intro-combine {
  position: absolute;
  display: block;
  top: 0;
  bottom: 0;
  left: 0;
  width: 50%;
  overflow: hidden;
  -webkit-perspective: 2000px;
  -moz-perspective: 2000px;
  perspective: 2000px;
  -webkit-transform: all 2s ease;
  -moz-transform: all 2s ease;
  -ms-transform: all 2s ease;
  -o-transform: all 2s ease;
  transform: all 2s ease; }
  @media only screen and (max-width: 640px) {
    .intro-combine {
      position: relative;
      width: 100%;
      height: 250px; } }
  .intro-combine.load-in-combine .layer-ipad {
    -webkit-transform: translate3d(0, 10%, 0);
    -moz-transform: translate3d(0, 10%, 0);
    -ms-transform: translate3d(0, 10%, 0);
    -o-transform: translate3d(0, 10%, 0);
    transform: translate3d(0, 10%, 0); }
  .intro-combine.load-in-combine .layer-iphone {
    -webkit-transform: translate3d(0, 10%, 20px);
    -moz-transform: translate3d(0, 10%, 20px);
    -ms-transform: translate3d(0, 10%, 20px);
    -o-transform: translate3d(0, 10%, 20px);
    transform: translate3d(0, 10%, 20px); }
  .intro-combine.load-in-combine .layer-iphone-line .clip-path {
    -webkit-clip-path: inset(0 0 0 0);
    clip-path: inset(0 0 0 0); }
  .intro-combine.load-in-combine .layer-ipad-line .clip-path {
    -webkit-clip-path: inset(0 0 0 0);
    clip-path: inset(0 0 0 0); }
  .intro-combine .layer-ipad, .intro-combine .layer-ipad-line,
  .intro-combine .layer-iphone, .intro-combine .layer-iphone-line {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
  .intro-combine .layer-ipad {
    text-align: center;
    -webkit-transform: translate3d(0, 100%, 0);
    -moz-transform: translate3d(0, 100%, 0);
    -ms-transform: translate3d(0, 100%, 0);
    -o-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    -webkit-transition: -webkit-transform 1.5s ease;
    -moz-transition: -moz-transform 1.5s ease;
    transition: transform 1.5s ease; }
    .intro-combine .layer-ipad img {
      width: 75%;
      -webkit-filter: drop-shadow(rgba(0, 0, 0, 0.15) 0 5px 20px);
      filter: drop-shadow(rgba(0, 0, 0, 0.15) 0 5px 20px); }
  .intro-combine .layer-ipad-line {
    text-align: center;
    opacity: 0.65;
    -webkit-transform: translate3d(0, 10%, 0);
    -moz-transform: translate3d(0, 10%, 0);
    -ms-transform: translate3d(0, 10%, 0);
    -o-transform: translate3d(0, 10%, 0);
    transform: translate3d(0, 10%, 0); }
    .intro-combine .layer-ipad-line .clip-path {
      width: 75%;
      -webkit-clip-path: inset(0 100% 0 0);
      clip-path: inset(0 100% 0 0);
      -webkit-transition: all 2s 1.5s ease;
      -moz-transition: all 2s 1.5s ease;
      transition: all 2s 1.5s ease; }
  .intro-combine .layer-iphone {
    text-align: center;
    -webkit-transform: translate3d(0, 100%, 20px);
    -moz-transform: translate3d(0, 100%, 20px);
    -ms-transform: translate3d(0, 100%, 20px);
    -o-transform: translate3d(0, 100%, 20px);
    transform: translate3d(0, 100%, 20px);
    -webkit-transition: -webkit-transform 1.5s 0.5s ease;
    -moz-transition: -moz-transform 1.5s 0.5s ease;
    transition: transform 1.5s 0.5s ease; }
    .intro-combine .layer-iphone img {
      width: 75%;
      -webkit-filter: drop-shadow(rgba(0, 0, 0, 0.15) 0 10px 20px);
      filter: drop-shadow(rgba(0, 0, 0, 0.15) 0 10px 20px); }
  .intro-combine .layer-iphone-line {
    text-align: center;
    opacity: 0.65;
    -webkit-transform: translate3d(0, 10%, 0);
    -moz-transform: translate3d(0, 10%, 0);
    -ms-transform: translate3d(0, 10%, 0);
    -o-transform: translate3d(0, 10%, 0);
    transform: translate3d(0, 10%, 0); }
    .intro-combine .layer-iphone-line .clip-path {
      width: 75%;
      -webkit-clip-path: inset(0 100% 0 0);
      clip-path: inset(0 100% 0 0);
      -webkit-transition: all 2s 1.5s ease;
      -moz-transition: all 2s 1.5s ease;
      transition: all 2s 1.5s ease; }

.website-layer-wrapper {
  position: absolute;
  display: block;
  top: 0;
  bottom: 0;
  right: 0;
  width: 50%;
  overflow: hidden;
  -webkit-perspective: 2000px;
  -moz-perspective: 2000px;
  perspective: 2000px;
  -webkit-transform: all 2s ease;
  -moz-transform: all 2s ease;
  -ms-transform: all 2s ease;
  -o-transform: all 2s ease;
  transform: all 2s ease; }
  @media only screen and (max-width: 640px) {
    .website-layer-wrapper {
      position: relative;
      width: 100%;
      height: 300px; } }
  .website-layer-wrapper.step-2 {
    left: 0;
    right: auto; }
    .website-layer-wrapper.step-2 .layer-container {
      left: 0;
      right: 50px; }
  .website-layer-wrapper.step-3 .layer-container {
    -webkit-transform: rotateX(-10deg) rotateY(-50deg) rotateZ(0);
    -moz-transform: rotateX(-10deg) rotateY(-50deg) rotateZ(0);
    -ms-transform: rotateX(-10deg) rotateY(-50deg) rotateZ(0);
    -o-transform: rotateX(-10deg) rotateY(-50deg) rotateZ(0);
    transform: rotateX(-10deg) rotateY(-50deg) rotateZ(0); }
  .website-layer-wrapper.load-in-rotate .layer-container {
    -webkit-transform: rotateX(65deg) rotateY(0) rotateZ(50deg);
    -moz-transform: rotateX(65deg) rotateY(0) rotateZ(50deg);
    -ms-transform: rotateX(65deg) rotateY(0) rotateZ(50deg);
    -o-transform: rotateX(65deg) rotateY(0) rotateZ(50deg);
    transform: rotateX(65deg) rotateY(0) rotateZ(50deg); }
    .website-layer-wrapper.load-in-rotate .layer-container .layer-1 {
      box-shadow: rgba(0, 0, 0, 0.19) 25px 30px 50px -15px; }
    .website-layer-wrapper.load-in-rotate .layer-container .layer-2 {
      -webkit-filter: drop-shadow(rgba(0, 0, 0, 0.175) 100px 65px 20px);
      filter: drop-shadow(rgba(0, 0, 0, 0.175) 100px 65px 20px);
      -webkit-transform: translate3d(0, 0, 50px);
      -moz-transform: translate3d(0, 0, 50px);
      -ms-transform: translate3d(0, 0, 50px);
      -o-transform: translate3d(0, 0, 50px);
      transform: translate3d(0, 0, 50px); }
  .website-layer-wrapper.load-in-popup .layer-container {
    -webkit-transform: rotateX(35deg) rotateY(10deg) rotateZ(-20deg) translateX(-50px) translateZ(-50px);
    -moz-transform: rotateX(35deg) rotateY(10deg) rotateZ(-20deg) translateX(-50px) translateZ(-50px);
    -ms-transform: rotateX(35deg) rotateY(10deg) rotateZ(-20deg) translateX(-50px) translateZ(-50px);
    -o-transform: rotateX(35deg) rotateY(10deg) rotateZ(-20deg) translateX(-50px) translateZ(-50px);
    transform: rotateX(35deg) rotateY(10deg) rotateZ(-20deg) translateX(-50px) translateZ(-50px); }
    .website-layer-wrapper.load-in-popup .layer-container .layer-1 {
      box-shadow: rgba(0, 0, 0, 0.19) 0px 30px 50px -15px;
      -webkit-transform: translate3d(0, 0, -25px);
      -moz-transform: translate3d(0, 0, -25px);
      -ms-transform: translate3d(0, 0, -25px);
      -o-transform: translate3d(0, 0, -25px);
      transform: translate3d(0, 0, -25px); }
    .website-layer-wrapper.load-in-popup .layer-container .layer-2 {
      -webkit-filter: drop-shadow(rgba(0, 0, 0, 0.175) -10px 10px 10px);
      filter: drop-shadow(rgba(0, 0, 0, 0.175) -10px 10px 10px);
      -webkit-transform: translate3d(0, 0, 0);
      -moz-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      -o-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0); }
    .website-layer-wrapper.load-in-popup .layer-container .layer-3 {
      -webkit-transform: translate3d(0, 0, 75px) scale(1);
      -moz-transform: translate3d(0, 0, 75px) scale(1);
      -ms-transform: translate3d(0, 0, 75px) scale(1);
      -o-transform: translate3d(0, 0, 75px) scale(1);
      transform: translate3d(0, 0, 75px) scale(1);
      opacity: 0.75; }
    .website-layer-wrapper.load-in-popup .layer-container .layer-4 {
      -webkit-transform: translate3d(0, 0, 100px) scale(1);
      -moz-transform: translate3d(0, 0, 100px) scale(1);
      -ms-transform: translate3d(0, 0, 100px) scale(1);
      -o-transform: translate3d(0, 0, 100px) scale(1);
      transform: translate3d(0, 0, 100px) scale(1);
      opacity: 1; }
  .website-layer-wrapper.load-in-shuffle .layer-container .content-2 {
    -webkit-animation: shuffle3to2 4s ease infinite;
    -moz-animation: shuffle3to2 4s ease infinite;
    animation: shuffle3to2 4s ease infinite; }
  .website-layer-wrapper.load-in-shuffle .layer-container .content-3 {
    -webkit-animation: shuffle2to1 4s ease infinite;
    -moz-animation: shuffle2to1 4s ease infinite;
    animation: shuffle2to1 4s ease infinite; }
  .website-layer-wrapper.load-in-shuffle .layer-container .content-4 {
    -webkit-animation: shuffle1to3 4s ease infinite;
    -moz-animation: shuffle1to3 4s ease infinite;
    animation: shuffle1to3 4s ease infinite; }
  .website-layer-wrapper .layer-container {
    display: block;
    position: absolute;
    top: 10%;
    bottom: 0;
    left: 50px;
    right: 0;
    text-align: center;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform: rotateX(0) rotateY(0) rotateZ(0);
    -moz-transform: rotateX(0) rotateY(0) rotateZ(0);
    -ms-transform: rotateX(0) rotateY(0) rotateZ(0);
    -o-transform: rotateX(0) rotateY(0) rotateZ(0);
    transform: rotateX(0) rotateY(0) rotateZ(0);
    -webkit-transition: -webkit-transform 2s ease;
    -moz-transition: -moz-transform 2s ease;
    transition: transform 2s ease; }
  .website-layer-wrapper .layer-1 {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    right: 0;
    margin-left: -300px;
    width: 600px;
    box-shadow: rgba(0, 0, 0, 0.19) 5px 30px 50px -15px;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    outline: 1px solid transparent;
    -webkit-backface-visibility: hidden; }
  .website-layer-wrapper .layer-2 {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    right: 0;
    margin-left: -300px;
    width: 600px;
    -webkit-transform: translate3d(0, 0, 5px);
    -moz-transform: translate3d(0, 0, 5px);
    -ms-transform: translate3d(0, 0, 5px);
    -o-transform: translate3d(0, 0, 5px);
    transform: translate3d(0, 0, 5px);
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition: all 2s ease;
    -moz-transition: all 2s ease;
    transition: all 2s ease;
    outline: 1px solid transparent;
    -webkit-backface-visibility: hidden; }
  .website-layer-wrapper .layer-3 {
    position: absolute;
    top: 45px;
    bottom: 0;
    left: 50%;
    right: 0;
    margin-left: -300px;
    height: 350px;
    width: 600px;
    background-color: #FFB500;
    background-image: -webkit-linear-gradient(-315deg, #FFB500, #F04E98);
    background-image: linear-gradient(45deg,#FFB500, #F04E98);
    -webkit-transform: translate3d(0, 0, 10px) scale(0.5);
    -moz-transform: translate3d(0, 0, 10px) scale(0.5);
    -ms-transform: translate3d(0, 0, 10px) scale(0.5);
    -o-transform: translate3d(0, 0, 10px) scale(0.5);
    transform: translate3d(0, 0, 10px) scale(0.5);
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition: all 0.75s 1s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -moz-transition: all 0.75s 1s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: all 0.75s 1s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    opacity: 0;
    outline: 1px solid transparent;
    -webkit-backface-visibility: hidden; }
  .website-layer-wrapper .layer-4 {
    position: absolute;
    top: 125px;
    bottom: 0;
    left: 50%;
    right: 0;
    margin-left: -150px;
    height: 200px;
    width: 300px;
    padding: 75px 0;
    font-size: 36px;
    font-size: 2.25rem;
    color: #99A1AE;
    font-weight: bold;
    text-align: center;
    background: #fff;
    -webkit-transform: translate3d(0, 0, 10px) scale(0.5);
    -moz-transform: translate3d(0, 0, 10px) scale(0.5);
    -ms-transform: translate3d(0, 0, 10px) scale(0.5);
    -o-transform: translate3d(0, 0, 10px) scale(0.5);
    transform: translate3d(0, 0, 10px) scale(0.5);
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition: all 0.75s 1.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -moz-transition: all 0.75s 1.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: all 0.75s 1.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    opacity: 0;
    box-shadow: rgba(0, 0, 0, 0.19) -10px 10px 25px -5px;
    outline: 1px solid transparent;
    -webkit-backface-visibility: hidden; }
  .website-layer-wrapper .content-1, .website-layer-wrapper .content-2,
  .website-layer-wrapper .content-3, .website-layer-wrapper .content-4 {
    position: absolute;
    top: 100px;
    bottom: 0;
    left: 50%;
    right: 0;
    margin-left: -200px;
    height: 300px;
    width: 400px;
    padding: 30px;
    font-size: 20px;
    font-size: 1.25rem;
    color: white;
    font-weight: bold;
    text-align: left;
    text-transform: uppercase;
    background: #fff;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition: all 1s 1.25s cubic-bezier(0.19, 1, 0.22, 1);
    -moz-transition: all 1s 1.25s cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 1s 1.25s cubic-bezier(0.19, 1, 0.22, 1);
    box-shadow: rgba(0, 0, 0, 0.19) 0 10px 25px -5px;
    outline: 1px solid transparent;
    -webkit-backface-visibility: hidden;
    opacity: 0.75; }
  .website-layer-wrapper .content-1 {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    background-color: #4C8FFB;
    background-image: -webkit-linear-gradient(#4C8FFB, #00C389);
    background-image: linear-gradient(#4C8FFB, #00C389); }
  .website-layer-wrapper .content-2 {
    -webkit-transform: translate3d(0, 0, 50px);
    -moz-transform: translate3d(0, 0, 50px);
    -ms-transform: translate3d(0, 0, 50px);
    -o-transform: translate3d(0, 0, 50px);
    transform: translate3d(0, 0, 50px);
    background-color: #8a69d4;
    background-image: -webkit-linear-gradient(#8a69d4, #AD62CC);
    background-image: linear-gradient(#8a69d4, #AD62CC); }
  .website-layer-wrapper .content-3 {
    -webkit-transform: translate3d(0, 0, 100px);
    -moz-transform: translate3d(0, 0, 100px);
    -ms-transform: translate3d(0, 0, 100px);
    -o-transform: translate3d(0, 0, 100px);
    transform: translate3d(0, 0, 100px);
    background-color: #F04E98;
    background-image: -webkit-linear-gradient(#F04E98, #FFB500);
    background-image: linear-gradient(#F04E98, #FFB500); }
  .website-layer-wrapper .content-4 {
    -webkit-transform: translate3d(0, 0, 150px);
    -moz-transform: translate3d(0, 0, 150px);
    -ms-transform: translate3d(0, 0, 150px);
    -o-transform: translate3d(0, 0, 150px);
    transform: translate3d(0, 0, 150px);
    background-color: #8a69d4;
    background-image: -webkit-linear-gradient(#8a69d4, #4C8FFB);
    background-image: linear-gradient(#8a69d4, #4C8FFB); }

@keyframes shuffle1to3 {
  0% {
    -webkit-transform: translate3d(0, 0, 150px);
    -moz-transform: translate3d(0, 0, 150px);
    -ms-transform: translate3d(0, 0, 150px);
    -o-transform: translate3d(0, 0, 150px);
    transform: translate3d(0, 0, 150px); }
  12.5% {
    -webkit-transform: translate3d(0, -350px, 150px);
    -moz-transform: translate3d(0, -350px, 150px);
    -ms-transform: translate3d(0, -350px, 150px);
    -o-transform: translate3d(0, -350px, 150px);
    transform: translate3d(0, -350px, 150px); }
  25% {
    -webkit-transform: translate3d(0, -350px, 50px);
    -moz-transform: translate3d(0, -350px, 50px);
    -ms-transform: translate3d(0, -350px, 50px);
    -o-transform: translate3d(0, -350px, 50px);
    transform: translate3d(0, -350px, 50px); }
  37.5% {
    -webkit-transform: translate3d(0, 0, 50px);
    -moz-transform: translate3d(0, 0, 50px);
    -ms-transform: translate3d(0, 0, 50px);
    -o-transform: translate3d(0, 0, 50px);
    transform: translate3d(0, 0, 50px); }
  50% {
    -webkit-transform: translate3d(0, 0, 50px);
    -moz-transform: translate3d(0, 0, 50px);
    -ms-transform: translate3d(0, 0, 50px);
    -o-transform: translate3d(0, 0, 50px);
    transform: translate3d(0, 0, 50px); }
  62.5% {
    -webkit-transform: translate3d(0, 0, 100px);
    -moz-transform: translate3d(0, 0, 100px);
    -ms-transform: translate3d(0, 0, 100px);
    -o-transform: translate3d(0, 0, 100px);
    transform: translate3d(0, 0, 100px); }
  75% {
    -webkit-transform: translate3d(0, -350px, 100px);
    -moz-transform: translate3d(0, -350px, 100px);
    -ms-transform: translate3d(0, -350px, 100px);
    -o-transform: translate3d(0, -350px, 100px);
    transform: translate3d(0, -350px, 100px); }
  87.5% {
    -webkit-transform: translate3d(0, -350px, 150px);
    -moz-transform: translate3d(0, -350px, 150px);
    -ms-transform: translate3d(0, -350px, 150px);
    -o-transform: translate3d(0, -350px, 150px);
    transform: translate3d(0, -350px, 150px); }
  100% {
    -webkit-transform: translate3d(0, 0, 150px);
    -moz-transform: translate3d(0, 0, 150px);
    -ms-transform: translate3d(0, 0, 150px);
    -o-transform: translate3d(0, 0, 150px);
    transform: translate3d(0, 0, 150px); } }
@keyframes shuffle2to1 {
  0% {
    -webkit-transform: translate3d(0, 0, 100px);
    -moz-transform: translate3d(0, 0, 100px);
    -ms-transform: translate3d(0, 0, 100px);
    -o-transform: translate3d(0, 0, 100px);
    transform: translate3d(0, 0, 100px); }
  12.5% {
    -webkit-transform: translate3d(0, 0, 100px);
    -moz-transform: translate3d(0, 0, 100px);
    -ms-transform: translate3d(0, 0, 100px);
    -o-transform: translate3d(0, 0, 100px);
    transform: translate3d(0, 0, 100px); }
  25% {
    -webkit-transform: translate3d(0, 0, 150px);
    -moz-transform: translate3d(0, 0, 150px);
    -ms-transform: translate3d(0, 0, 150px);
    -o-transform: translate3d(0, 0, 150px);
    transform: translate3d(0, 0, 150px); }
  37.5% {
    -webkit-transform: translate3d(0, 0, 150px);
    -moz-transform: translate3d(0, 0, 150px);
    -ms-transform: translate3d(0, 0, 150px);
    -o-transform: translate3d(0, 0, 150px);
    transform: translate3d(0, 0, 150px); }
  50% {
    -webkit-transform: translate3d(0, 0, 150px);
    -moz-transform: translate3d(0, 0, 150px);
    -ms-transform: translate3d(0, 0, 150px);
    -o-transform: translate3d(0, 0, 150px);
    transform: translate3d(0, 0, 150px); }
  62.5% {
    -webkit-transform: translate3d(0, 0, 150px);
    -moz-transform: translate3d(0, 0, 150px);
    -ms-transform: translate3d(0, 0, 150px);
    -o-transform: translate3d(0, 0, 150px);
    transform: translate3d(0, 0, 150px); }
  75% {
    -webkit-transform: translate3d(0, 0, 150px);
    -moz-transform: translate3d(0, 0, 150px);
    -ms-transform: translate3d(0, 0, 150px);
    -o-transform: translate3d(0, 0, 150px);
    transform: translate3d(0, 0, 150px); }
  100% {
    -webkit-transform: translate3d(0, 0, 100px);
    -moz-transform: translate3d(0, 0, 100px);
    -ms-transform: translate3d(0, 0, 100px);
    -o-transform: translate3d(0, 0, 100px);
    transform: translate3d(0, 0, 100px); } }
@keyframes shuffle3to2 {
  0% {
    -webkit-transform: translate3d(0, 0, 50px);
    -moz-transform: translate3d(0, 0, 50px);
    -ms-transform: translate3d(0, 0, 50px);
    -o-transform: translate3d(0, 0, 50px);
    transform: translate3d(0, 0, 50px); }
  12.5% {
    -webkit-transform: translate3d(0, 0, 50px);
    -moz-transform: translate3d(0, 0, 50px);
    -ms-transform: translate3d(0, 0, 50px);
    -o-transform: translate3d(0, 0, 50px);
    transform: translate3d(0, 0, 50px); }
  25% {
    -webkit-transform: translate3d(0, 0, 100px);
    -moz-transform: translate3d(0, 0, 100px);
    -ms-transform: translate3d(0, 0, 100px);
    -o-transform: translate3d(0, 0, 100px);
    transform: translate3d(0, 0, 100px); }
  37.5% {
    -webkit-transform: translate3d(0, 0, 100px);
    -moz-transform: translate3d(0, 0, 100px);
    -ms-transform: translate3d(0, 0, 100px);
    -o-transform: translate3d(0, 0, 100px);
    transform: translate3d(0, 0, 100px); }
  50% {
    -webkit-transform: translate3d(0, -350px, 100px);
    -moz-transform: translate3d(0, -350px, 100px);
    -ms-transform: translate3d(0, -350px, 100px);
    -o-transform: translate3d(0, -350px, 100px);
    transform: translate3d(0, -350px, 100px); }
  62.5% {
    -webkit-transform: translate3d(0, -350px, 50px);
    -moz-transform: translate3d(0, -350px, 50px);
    -ms-transform: translate3d(0, -350px, 50px);
    -o-transform: translate3d(0, -350px, 50px);
    transform: translate3d(0, -350px, 50px); }
  75% {
    -webkit-transform: translate3d(0, 0, 50px);
    -moz-transform: translate3d(0, 0, 50px);
    -ms-transform: translate3d(0, 0, 50px);
    -o-transform: translate3d(0, 0, 50px);
    transform: translate3d(0, 0, 50px); }
  100% {
    -webkit-transform: translate3d(0, 0, 50px);
    -moz-transform: translate3d(0, 0, 50px);
    -ms-transform: translate3d(0, 0, 50px);
    -o-transform: translate3d(0, 0, 50px);
    transform: translate3d(0, 0, 50px); } }
.layer-wrapper {
  position: relative;
  display: block;
  -webkit-perspective: 2000px;
  -moz-perspective: 2000px;
  perspective: 2000px;
  -webkit-transform: all 0.5s ease;
  -moz-transform: all 0.5s ease;
  -ms-transform: all 0.5s ease;
  -o-transform: all 0.5s ease;
  transform: all 0.5s ease;
  background-color: transparent;
  background-image: -webkit-linear-gradient(transparent 0, #f0f1f3 90%, transparent 92%);
  background-image: linear-gradient(transparent 0, #f0f1f3 90%, transparent 92%); }
  @media only screen and (max-width: 640px) {
    .layer-wrapper {
      overflow: hidden;
      overflow-y: auto; } }
  .layer-wrapper .platform-layers {
    display: block;
    position: relative;
    height: 500px;
    width: 700px;
    margin: 60px auto 60px auto;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    -o-transform: translateX(0%);
    transform: translateX(0%);
    -webkit-transition: -webkit-transform 2s cubic-bezier(0.19, 1, 0.22, 1);
    -moz-transition: -moz-transform 2s cubic-bezier(0.19, 1, 0.22, 1);
    transition: transform 2s cubic-bezier(0.19, 1, 0.22, 1); }
    @media only screen and (max-width: 640px) {
      .layer-wrapper .platform-layers {
        position: relative;
        height: 300px;
        width: 420px; } }
    .layer-wrapper .platform-layers.rotate-layers {
      -webkit-transform: rotateX(0) rotateY(30deg) rotateZ(0) translateX(-10%);
      -moz-transform: rotateX(0) rotateY(30deg) rotateZ(0) translateX(-10%);
      -ms-transform: rotateX(0) rotateY(30deg) rotateZ(0) translateX(-10%);
      -o-transform: rotateX(0) rotateY(30deg) rotateZ(0) translateX(-10%);
      transform: rotateX(0) rotateY(30deg) rotateZ(0) translateX(-10%); }
      @media only screen and (max-width: 640px) {
        .layer-wrapper .platform-layers.rotate-layers {
          -webkit-transform: rotateX(0) rotateY(20deg) rotateZ(0) translateX(10%);
          -moz-transform: rotateX(0) rotateY(20deg) rotateZ(0) translateX(10%);
          -ms-transform: rotateX(0) rotateY(20deg) rotateZ(0) translateX(10%);
          -o-transform: rotateX(0) rotateY(20deg) rotateZ(0) translateX(10%);
          transform: rotateX(0) rotateY(20deg) rotateZ(0) translateX(10%); } }
    .layer-wrapper .platform-layers__caption {
      z-index: -1;
      position: absolute;
      top: 0;
      left: -200px;
      width: 225px;
      padding: 10px;
      background: rgba(255, 255, 255, 0.75);
      border-radius: 2px;
      opacity: 0;
      -webkit-transform: scale(0.75);
      -moz-transform: scale(0.75);
      -ms-transform: scale(0.75);
      -o-transform: scale(0.75);
      transform: scale(0.75);
      -webkit-transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
      -moz-transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
      transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1); }
      @media only screen and (max-width: 640px) {
        .layer-wrapper .platform-layers__caption {
          top: -20px;
          left: -135px;
          width: 150px; } }
    .layer-wrapper .platform-layers .layer-1, .layer-wrapper .platform-layers .layer-2,
    .layer-wrapper .platform-layers .layer-3, .layer-wrapper .platform-layers .layer-4 {
      display: block;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      height: 500px;
      width: 700px;
      box-shadow: rgba(0, 0, 0, 0.19) -5px 10px 25px -5px;
      -webkit-transition: -webkit-transform 0.5s ease;
      -moz-transition: -moz-transform 0.5s ease;
      transition: transform 0.5s ease; }
      .layer-wrapper .platform-layers .layer-1:hover .platform-layers__caption, .layer-wrapper .platform-layers .layer-2:hover .platform-layers__caption,
      .layer-wrapper .platform-layers .layer-3:hover .platform-layers__caption, .layer-wrapper .platform-layers .layer-4:hover .platform-layers__caption {
        opacity: 1; }
      @media only screen and (max-width: 640px) {
        .layer-wrapper .platform-layers .layer-1, .layer-wrapper .platform-layers .layer-2,
        .layer-wrapper .platform-layers .layer-3, .layer-wrapper .platform-layers .layer-4 {
          height: 300px;
          width: 420px;
          margin-left: 20%; } }
    .layer-wrapper .platform-layers .layer-1 {
      -webkit-transform: translate3d(0, 0, 0);
      -moz-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      -o-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
      -webkit-transform-style: preserve-3d;
      -moz-transform-style: preserve-3d;
      -ms-transform-style: preserve-3d;
      -o-transform-style: preserve-3d;
      transform-style: preserve-3d;
      background: url("/images/platform-data.png") no-repeat;
      background-size: contain; }
      .layer-wrapper .platform-layers .layer-1:hover {
        -webkit-transform: translate3d(0, -10px, 0);
        -moz-transform: translate3d(0, -10px, 0);
        -ms-transform: translate3d(0, -10px, 0);
        -o-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0); }
    .layer-wrapper .platform-layers .layer-2 {
      -webkit-transform: translate3d(0, 0, 100px);
      -moz-transform: translate3d(0, 0, 100px);
      -ms-transform: translate3d(0, 0, 100px);
      -o-transform: translate3d(0, 0, 100px);
      transform: translate3d(0, 0, 100px);
      -webkit-transform-style: preserve-3d;
      -moz-transform-style: preserve-3d;
      -ms-transform-style: preserve-3d;
      -o-transform-style: preserve-3d;
      transform-style: preserve-3d;
      background: url("/images/platform-contextualization.png") no-repeat;
      background-size: contain; }
      .layer-wrapper .platform-layers .layer-2:hover {
        -webkit-transform: translate3d(0, -10px, 100px);
        -moz-transform: translate3d(0, -10px, 100px);
        -ms-transform: translate3d(0, -10px, 100px);
        -o-transform: translate3d(0, -10px, 100px);
        transform: translate3d(0, -10px, 100px); }
    .layer-wrapper .platform-layers .layer-3 {
      -webkit-transform: translate3d(0, 0, 200px);
      -moz-transform: translate3d(0, 0, 200px);
      -ms-transform: translate3d(0, 0, 200px);
      -o-transform: translate3d(0, 0, 200px);
      transform: translate3d(0, 0, 200px);
      -webkit-transform-style: preserve-3d;
      -moz-transform-style: preserve-3d;
      -ms-transform-style: preserve-3d;
      -o-transform-style: preserve-3d;
      transform-style: preserve-3d;
      background: url("/images/platform-integrations.png") no-repeat;
      background-size: contain; }
      .layer-wrapper .platform-layers .layer-3:hover {
        -webkit-transform: translate3d(0, -10px, 200px);
        -moz-transform: translate3d(0, -10px, 200px);
        -ms-transform: translate3d(0, -10px, 200px);
        -o-transform: translate3d(0, -10px, 200px);
        transform: translate3d(0, -10px, 200px); }
    .layer-wrapper .platform-layers .layer-4 {
      -webkit-transform: translate3d(0, 0, 300px);
      -moz-transform: translate3d(0, 0, 300px);
      -ms-transform: translate3d(0, 0, 300px);
      -o-transform: translate3d(0, 0, 300px);
      transform: translate3d(0, 0, 300px);
      -webkit-transform-style: preserve-3d;
      -moz-transform-style: preserve-3d;
      -ms-transform-style: preserve-3d;
      -o-transform-style: preserve-3d;
      transform-style: preserve-3d;
      background: url("/images/platform-ui.png") no-repeat;
      background-size: contain; }
      .layer-wrapper .platform-layers .layer-4:hover {
        -webkit-transform: translate3d(0, -10px, 300px);
        -moz-transform: translate3d(0, -10px, 300px);
        -ms-transform: translate3d(0, -10px, 300px);
        -o-transform: translate3d(0, -10px, 300px);
        transform: translate3d(0, -10px, 300px); }

.img-wrapper {
  z-index: -1;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  width: 55%;
  overflow: hidden; }
  .img-wrapper--left {
    left: 0; }
  .img-wrapper--right {
    right: 0; }
  .img-wrapper.eddie-quote {
    background: url("/images/eddie-bauer-interior.jpg") no-repeat;
    background-size: cover;
    background-position: center;
    box-shadow: white -200px 0 200px inset; }
  .img-wrapper.finishline-quote {
    background: url("/images/finish-line-interior.jpg") no-repeat;
    background-size: cover;
    background-position: right center;
    box-shadow: white 150px 0 150px inset; }
  .img-wrapper.support {
    background: url("/images/company-hero.jpg") no-repeat;
    background-size: cover;
    background-position: center;
    box-shadow: white 150px 0 150px inset; }
    @media only screen and (max-width: 640px) {
      .img-wrapper.support {
        position: relative;
        width: 100%;
        height: 250px;
        background-position: top; } }
  .img-wrapper.creative-services {
    background: url("/images/services-emails.png") no-repeat;
    background-size: cover;
    background-position: center; }
    @media only screen and (max-width: 640px) {
      .img-wrapper.creative-services {
        position: relative;
        width: 100%;
        height: 250px;
        background-position: top; } }

.client-logo {
  margin-bottom: 40px; }
  .client-logo.small img {
    width: 150px; }
  .client-logo img {
    width: 200px; }

.headshot {
  position: relative;
  z-index: 1;
  display: block;
  margin: 20px;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.1);
  overflow: hidden; }
  .headshot__meta {
    padding: 15px;
    border-top: 1px solid rgba(0, 0, 0, 0.1); }
    .headshot__meta h3 {
      margin-bottom: 10px; }
    .headshot__meta .small-heading {
      font-size: 10px;
      font-size: 0.625rem; }
  .headshot img {
    z-index: -1;
    height: 300px;
    border: none;
    outline: none;
    width: auto; }

.divider-bottom {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1); }

.divider-top {
  border-top: 1px solid rgba(0, 0, 0, 0.1); }

.divider-left {
  border-left: 1px solid rgba(0, 0, 0, 0.1); }

.divider-right {
  border-right: 1px solid rgba(0, 0, 0, 0.1); }

.divider-x {
  border-left: 1px solid rgba(0, 0, 0, 0.1);
  border-right: 1px solid rgba(0, 0, 0, 0.1); }

.divider-y {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1); }

.resource-card {
  display: block;
  position: relative;
  float: left;
  width: 30%;
  height: 475px;
  margin: 1.5%;
  background: #fff;
  border: none;
  box-shadow: rgba(0, 0, 0, 0.1) 0 10px 25px;
  -webkit-transition: all 0.25s ease;
  -moz-transition: all 0.25s ease;
  transition: all 0.25s ease;
  cursor: pointer; }
  @media only screen and (max-width: 640px) {
    .resource-card {
      width: 98%;
      min-height: 300px;
      margin-bottom: 15px; } }
  .resource-card:hover {
    box-shadow: rgba(0, 0, 0, 0.2) 0 15px 35px -5px;
    -webkit-transform: translate(0, -5px);
    -moz-transform: translate(0, -5px);
    -ms-transform: translate(0, -5px);
    -o-transform: translate(0, -5px);
    transform: translate(0, -5px); }
  .resource-card__image {
    display: block;
    width: 100%;
    overflow: hidden;
    text-align: center; }
    .resource-card__image img {
      width: 100%; }
  .resource-card__category {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 20px;
    padding-top: 20px;
    font-size: 10px;
    font-size: 0.625rem;
    color: #99A1AE;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.05rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1); }
  .resource-card__title {
    padding: 20px;
    margin-bottom: 0;
    font-size: 16px;
    font-size: 1rem;
    color: #414752;
    line-height: 26px;
    line-height: 1.618rem; }
    @media only screen and (max-width: 640px) {
      .resource-card__title {
        font-size: 24px;
        font-size: 1.5rem; } }

.header {
  z-index: 100;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  padding: 30px 0;
  text-align: center; }
  .header .header-logo {
    border: none; }
    .header .header-logo img {
      position: absolute;
      left: 0; }
    .header .header-logo .blog-link {
      display: block;
      height: 30px;
      margin-left: 150px;
      padding-left: 15px;
      color: #fff;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.05rem;
      line-height: 30px;
      line-height: 1.875rem;
      border-bottom: none;
      border-left: 1px solid #fff; }

.header-mobile {
  display: none;
  z-index: 200;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 65px;
  padding: 15px;
  background: transparent;
  -webkit-transition: background 0.25s ease;
  -moz-transition: background 0.25s ease;
  transition: background 0.25s ease; }
  .header-mobile.scrolling {
    background: rgba(138, 105, 212, 0.975);
    box-shadow: rgba(0, 0, 0, 0.4) 0 5px 15px; }
  .header-mobile__logo {
    display: block;
    position: relative;
    float: left;
    height: 35px;
    width: 50%;
    background: url("/images/SHQ-logo@2x.png") no-repeat;
    background-size: contain;
    border-bottom: none; }
  .header-mobile__toggle {
    cursor: pointer;
    display: block;
    position: relative;
    float: right; }
    .header-mobile__toggle .icon {
      display: inline-block;
      fill: #fff;
      width: 1.16em;
      height: 1.16em;
      color: #fff;
      font-size: 30px;
      vertical-align: middle; }

.footer__logo {
  opacity: 0.25; }
  .footer__logo img {
    width: 190px; }
.footer__legal {
  margin-top: 15px;
  font-size: 8px;
  font-size: 0.5rem;
  color: rgba(255, 255, 255, 0.25);
  text-transform: uppercase; }

.footer-nav {
  display: block;
  list-style: none; }
  .footer-nav li {
    display: block; }
    .footer-nav li a {
      display: block;
      padding: 7px 10px;
      margin-left: -10px;
      font-size: 14px;
      font-size: 0.875rem;
      color: rgba(255, 255, 255, 0.75);
      text-decoration: none;
      border: none;
      -webkit-transition: all 0.1s ease;
      -moz-transition: all 0.1s ease;
      transition: all 0.1s ease; }
      .footer-nav li a:hover {
        color: #fff; }

/* Navigation
---------------------------------*/
.globalnav {
  z-index: 2;
  display: block;
  position: relative;
  list-style: none; }
  .globalnav__item {
    display: inline-block; }
    .globalnav__item a {
      display: block;
      padding: 10px;
      font-size: 10px;
      font-size: 0.625rem;
      color: white;
      font-weight: 700;
      letter-spacing: 0.05rem;
      text-transform: uppercase;
      text-decoration: none;
      border: none;
      border-radius: 2px;
      -webkit-transition: all 0.1s ease;
      -moz-transition: all 0.1s ease;
      transition: all 0.1s ease; }
      .globalnav__item a:hover {
        color: #fff; }
    .globalnav__item.dropdown a {
      border: none; }
      .globalnav__item.dropdown a:after {
        border: none;
        content: "∨";
        font-size: 12px;
        font-size: 0.75rem;
        padding-left: 5px;
        opacity: 0.5; }
    .globalnav__item.active a {
      color: #fff;
      background-color: #4C8FFB;
      background-image: -webkit-linear-gradient(-360deg, #4C8FFB, #4cacfb);
      background-image: linear-gradient(90deg,#4C8FFB, #4cacfb); }

.subnav {
  z-index: 10;
  display: block;
  position: absolute;
  top: 0;
  left: 30px;
  right: 30px;
  height: 400px;
  padding-top: 90px;
  color: #fff;
  background: rgba(31, 34, 39, 0.975);
  box-shadow: rgba(0, 0, 0, 0.4) 0 15px 25px -10px;
  opacity: 0;
  -webkit-transform: translateY(-300px);
  -moz-transform: translateY(-300px);
  -ms-transform: translateY(-300px);
  -o-transform: translateY(-300px);
  transform: translateY(-300px);
  -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.5s;
  -moz-transition: -moz-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.5s;
  transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.5s; }
  .open .subnav {
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1; }
  .subnav__block {
    display: none; }
    .subnav__block.show {
      display: block; }

.subnav-tiles {
  display: block;
  width: 100%;
  padding-top: 40px; }
  .subnav-tiles__group {
    display: block;
    position: relative;
    margin-right: 2%; }
    .subnav-tiles__group:last-child {
      margin-right: 0; }
    .subnav-tiles__group.col-9 {
      width: 73%; }
    .subnav-tiles__group .group-title {
      position: absolute;
      width: 100%;
      top: -40px;
      left: 0;
      font-size: 10px;
      font-size: 0.625rem;
      color: rgba(255, 255, 255, 0.2);
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.05rem; }
      .subnav-tiles__group .group-title:after {
        display: block;
        content: "";
        position: absolute;
        top: 5px;
        left: 75px;
        right: 0;
        height: 1px;
        background: rgba(255, 255, 255, 0.1); }
  .subnav-tiles__item {
    z-index: 1;
    display: block;
    float: left;
    position: relative;
    height: 220px;
    padding: 20px 30px;
    text-decoration: none;
    background: rgba(255, 255, 255, 0.05);
    border: none;
    border-radius: 3px;
    -webkit-transition: all 0.25s ease;
    -moz-transition: all 0.25s ease;
    transition: all 0.25s ease; }
    .subnav-tiles__item:last-child {
      margin-right: 0; }
    .subnav-tiles__item:hover {
      box-shadow: rgba(0, 0, 0, 0.5) 0 10px 25px -5px;
      -webkit-transform: scale(1.05);
      -moz-transform: scale(1.05);
      -ms-transform: scale(1.05);
      -o-transform: scale(1.05);
      transform: scale(1.05); }
      .subnav-tiles__item:hover .bg-fill {
        opacity: 1; }
    .subnav-tiles__item:active {
      -webkit-transform: scale(1);
      -moz-transform: scale(1);
      -ms-transform: scale(1);
      -o-transform: scale(1);
      transform: scale(1); }
    .subnav-tiles__item .tile-icon {
      display: inline-block;
      margin-bottom: 20px;
      padding: 10px;
      border-radius: 2px; }
      .subnav-tiles__item .tile-icon .icon {
        display: inline-block;
        fill: currentColor;
        width: 1em;
        height: 1em;
        color: #fff;
        font-size: 40px;
        vertical-align: middle; }
    .subnav-tiles__item .tile-title {
      margin-bottom: 15px;
      font-size: 12px;
      font-size: 0.75rem;
      font-weight: 600; }
    .subnav-tiles__item .tile-description {
      font-size: 10px;
      font-size: 0.625rem;
      color: rgba(255, 255, 255, 0.75);
      line-height: 19px;
      line-height: 1.1875rem; }
    .subnav-tiles__item .bg-fill {
      z-index: -1;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      border-radius: 3px;
      opacity: 0;
      -webkit-transition: opacity 0.25s ease;
      -moz-transition: opacity 0.25s ease;
      transition: opacity 0.25s ease; }

.mobile-menu {
  z-index: 100;
  visbility: hidden;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(31, 34, 39, 0.975);
  opacity: 0;
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%);
  -webkit-transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
  -moz-transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
  transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1); }
  .mobile-menu__nav {
    position: absolute;
    top: 65px;
    bottom: 65px;
    left: 0;
    right: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    overflow-y: auto; }
  .mobile-menu__footer {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 65px;
    padding: 15px;
    border-top: 1px solid rgba(255, 255, 255, 0.1); }
  .mobile-menu.open {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0); }

.mobile-nav {
  display: block;
  position: relative;
  padding: 30px; }
  .mobile-nav__item {
    display: block; }
    .mobile-nav__item a {
      display: block;
      padding: 10px 12px;
      margin-left: -10px;
      font-size: 24px;
      font-size: 1.5rem;
      color: white;
      text-decoration: none;
      border: none;
      -webkit-transition: all 0.1s ease;
      -moz-transition: all 0.1s ease;
      transition: all 0.1s ease; }
      .mobile-nav__item a:hover {
        color: #fff; }
    .mobile-nav__item.group-title a {
      margin-top: 15px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.1rem; }

/* Heros
---------------------------------*/
.hero {
  display: block;
  position: relative;
  width: 100%;
  min-height: 700px;
  padding-top: 100px; }
  @media only screen and (max-width: 640px) {
    .hero {
      min-height: 500px; } }
  .hero__footer {
    display: block;
    position: absolute;
    bottom: 45px;
    left: 0;
    right: 0;
    margin: 0 auto;
    max-width: 1000px;
    text-align: center; }
  .hero__nav {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 15px;
    text-align: center;
    background: #8a69d4; }
  .hero__image {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    width: 50%; }
    @media only screen and (max-width: 640px) {
      .hero__image {
        width: 100%; }
        .hero__image img {
          top: auto;
          bottom: 0; } }
    .hero__image img {
      position: absolute;
      top: 20%;
      width: 95%;
      -webkit-filter: drop-shadow(rgba(0, 0, 0, 0.25) 0 50px 20px); }
      @media only screen and (max-width: 640px) {
        .hero__image img {
          top: auto;
          bottom: -2%;
          width: 100%; } }
    .hero__image--large {
      width: 60%;
      overflow: hidden; }
      @media only screen and (max-width: 640px) {
        .hero__image--large {
          width: 100%; }
          .hero__image--large img {
            top: auto; } }
      .hero__image--large img {
        top: 30%;
        width: 120%;
        -webkit-filter: none;
        filter: none; }
        @media only screen and (max-width: 640px) {
          .hero__image--large img {
            top: auto;
            bottom: -50%;
            left: -25%;
            width: 150%; } }
  .hero__stripe {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 5px; }
  .hero h1 {
    line-height: 50px;
    line-height: 3.2rem; }
    @media only screen and (max-width: 640px) {
      .hero h1 {
        line-height: 52px;
        line-height: 3.2rem; } }
    .hero h1 a {
      color: rgba(138, 105, 212, 0.5);
      text-decoration: none;
      border: none; }
      .hero h1 a:hover {
        color: #8a69d4;
        text-decoration: underline; }
  .hero p {
    color: #fff; }
  .hero--blog {
    z-index: 0;
    min-height: 500px;
    background-size: cover;
    background: #8a69d4; }
    .hero--blog .bg-overlay {
      z-index: 0;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background: -webkit-radial-gradient(50% 50%, rgba(31, 34, 39, 0.5), rgba(31, 34, 39, 0.95));
      background: radial-gradient(50% 50%, rgba(31, 34, 39, 0.5), rgba(31, 34, 39, 0.95)); }
    .hero--blog.search-header {
      min-height: 300px; }
  .hero--video {
    z-index: 0;
    min-height: 600px;
    background-size: cover; }
    .hero--video video {
      z-index: -1; }
    .hero--video .bg-overlay {
      z-index: 0;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background: -webkit-radial-gradient(50% 50%, rgba(31, 34, 39, 0.5), rgba(31, 34, 39, 0.95));
      background: radial-gradient(50% 50%, rgba(31, 34, 39, 0.5), rgba(31, 34, 39, 0.95)); }
    .hero--video .bg-overlay-tricolor {
      z-index: 0;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background-color: rgba(173, 98, 204, 0.65);
      background-image: -webkit-linear-gradient(-405deg, rgba(173, 98, 204, 0.65), rgba(138, 105, 212, 0.65));
      background-image: linear-gradient(135deg,rgba(173, 98, 204, 0.65), rgba(138, 105, 212, 0.65)); }
    @media only screen and (max-width: 640px) {
      .hero--video {
        min-height: 500px; } }
    .hero--video.homepage-bg {
      background: url("/images/homepage-hero.png") no-repeat;
      background-size: cover; }
    .hero--video.platform-bg {
      background: url("/images/SHQ-montage-placeholder.jpg") no-repeat; }
    .hero--video.company-bg.homepage {
      background: url("/images/homepage-hero.jpg") no-repeat; }
  .hero--resources {
    z-index: 0;
    min-height: 400px;
    background-size: cover;
    background-position: center; }
    .hero--resources .bg-overlay {
      z-index: 0;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background: #fff; }
    @media only screen and (max-width: 640px) {
      .hero--resources {
        min-height: 500px; } }
  .hero--company {
    z-index: 0;
    min-height: 600px;
    background: url("/images/company-hero.jpg") no-repeat;
    background-size: cover; }
    .hero--company .bg-overlay {
      z-index: 0;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background: -webkit-radial-gradient(50% 50%, rgba(31, 34, 39, 0.75), rgba(31, 34, 39, 0.95));
      background: radial-gradient(50% 50%, rgba(31, 34, 39, 0.75), rgba(31, 34, 39, 0.95)); }
    @media only screen and (max-width: 640px) {
      .hero--company {
        min-height: 500px; } }
  .hero--customers {
    z-index: 0;
    min-height: 600px;
    background: url("/images/customer-hero.png") no-repeat;
    background-size: cover; }
    .hero--customers .bg-overlay {
      z-index: 0;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background: -webkit-radial-gradient(50% 50%, rgba(31, 34, 39, 0.75), rgba(31, 34, 39, 0.95));
      background: radial-gradient(50% 50%, rgba(31, 34, 39, 0.75), rgba(31, 34, 39, 0.95)); }
    @media only screen and (max-width: 640px) {
      .hero--customers {
        min-height: 500px; } }
  .hero--short {
    min-height: 430px; }
    @media only screen and (max-width: 640px) {
      .hero--short {
        min-height: 400px; } }
    @media only screen and (max-width: 640px) {
      .hero--short .absolute-center {
        top: 40%;
        text-align: center; } }
  .hero.animated-gradient-fill {
    background-color: rgba(138, 105, 212, 0.75);
    background-image: -webkit-linear-gradient(-405deg, rgba(138, 105, 212, 0.75), rgba(76, 143, 251, 0.75), rgba(0, 195, 137, 0.75));
    background-image: linear-gradient(135deg,rgba(138, 105, 212, 0.75), rgba(76, 143, 251, 0.75), rgba(0, 195, 137, 0.75));
    background-size: 300% 300%;
    -webkit-animation: SHQBackground 15s ease infinite;
    -moz-animation: SHQBackground 15s ease infinite;
    animation: SHQBackground 15s ease infinite; }

@-webkit-keyframes SHQBackground {
  0% {
    background-position: 0% 2%; }
  50% {
    background-position: 100% 99%; }
  100% {
    background-position: 0% 2%; } }
@-moz-keyframes SHQBackground {
  0% {
    background-position: 0% 2%; }
  50% {
    background-position: 100% 99%; }
  100% {
    background-position: 0% 2%; } }
@keyframes SHQBackground {
  0% {
    background-position: 0% 2%; }
  50% {
    background-position: 100% 99%; }
  100% {
    background-position: 0% 2%; } }
.shq-input {
  display: inline-block;
  width: 100%;
  padding: 0.75rem;
  font-size: 0.75rem;
  font-weight: 500;
  color: #5B6770;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 2px;
  outline: none;
  -webkit-transition: all 0.1s ease;
  -moz-transition: all 0.1s ease;
  transition: all 0.1s ease; }
  .shq-input:hover {
    border-color: rgba(0, 0, 0, 0.25); }
  .shq-input:active, .shq-input:focus {
    border-color: #4C8FFB; }
  .shq-input:disabled {
    opacity: 0.5;
    pointer-events: none; }

.shq-form {
  position: relative; }
  .shq-form iframe {
    height: 100vh; }
  .shq-form__fieldset {
    position: relative; }
  .shq-form__field {
    display: block;
    position: relative;
    margin: 1rem 0; }
    .shq-form__field::after {
      clear: both;
      content: "";
      display: table; }
  .shq-form__label {
    display: inline-block;
    float: left;
    font-size: 0.75rem;
    font-weight: 700;
    color: #5B6770;
    line-height: 1.5rem;
    text-align: left; }
    .has-error .shq-form__label {
      color: #F95E59; }

.shq-icon {
  display: inline-block;
  height: 1.5rem;
  width: 1.5rem;
  margin-right: 1rem;
  fill: #cabcea; }

.shq-landing-page {
  position: relative;
  width: calc(100% - 350px);
  margin-right: auto;
  background: #fff; }
  @media only screen and (max-width: 667px) {
    .shq-landing-page {
      width: 100%;
      margin: 0; } }
  .shq-landing-page p {
    margin: 0;
    font-size: 0.75rem;
    color: #5B6770;
    line-height: 1.4rem; }
    .shq-landing-page p + p {
      margin-top: 1.4rem; }
  .shq-landing-page h2 {
    font-family: "Gotham A", "Gotham B", sans-serif;
    color: #8a69d4;
    font-weight: 700;
    line-height: 2.5rem; }
  .shq-landing-page .shq-text-title {
    font-weight: bold; }
  .shq-landing-page .shq-text-subtitle {
    font-size: 0.625rem;
    font-weight: bold; }
  .shq-landing-page .shq-text-purple {
    color: #8a69d4; }
  .shq-landing-page .shq-divider {
    display: block;
    height: 1px;
    width: 100%;
    margin: 1rem 0;
    background: rgba(138, 105, 212, 0.1); }
  .shq-landing-page .btn {
    text-transform: none;
    letter-spacing: 0;
    background-color: #8a69d4;
    background-image: -webkit-linear-gradient(-405deg, #8a69d4, #685bc7);
    background-image: linear-gradient(135deg,#8a69d4, #685bc7);
    outline: none; }
  .shq-landing-page__shq-logo {
    z-index: 1000;
    position: absolute;
    top: 40px;
    left: 0;
    right: 0;
    margin: 0 auto; }
    .shq-landing-page__shq-logo img {
      width: 150px; }
  .shq-landing-page__sidebar {
    z-index: 1000;
    position: fixed;
    top: 0;
    right: 0;
    height: 100vh;
    width: 350px;
    padding: 2rem;
    background: #eee9f8;
    background-color: #eee9f8;
    background-image: -webkit-linear-gradient(-405deg, #eee9f8, #dcd3f1);
    background-image: linear-gradient(135deg,#eee9f8, #dcd3f1);
    background-image: url("/images/SHQ-landing-form.svg");
    background-repeat: no-repeat;
    background-position: bottom right;
    box-shadow: rgba(0, 0, 0, 0.1) 0 0 45px; }
    @media only screen and (max-width: 667px) {
      .shq-landing-page__sidebar {
        position: relative;
        right: auto;
        height: auto;
        width: 100%; } }
  .shq-landing-page__content {
    position: relative;
    width: 100%; }
    .shq-landing-page__content .hero {
      display: -webkit-box;
      display: -moz-box;
      display: box;
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -moz-box-orient: vertical;
      box-orient: vertical;
      -webkit-box-direction: normal;
      -moz-box-direction: normal;
      box-direction: normal;
      -webkit-flex-direction: column;
      -moz-flex-direction: column;
      flex-direction: column;
      -ms-flex-direction: column;
      -webkit-box-pack: center;
      -moz-box-pack: center;
      box-pack: center;
      -webkit-justify-content: center;
      -moz-justify-content: center;
      -ms-justify-content: center;
      -o-justify-content: center;
      justify-content: center;
      -ms-flex-pack: center;
      min-height: 600px;
      padding: 40px 0;
      text-align: left;
      background: #8a69d4;
      background-color: #9B7DD9;
      background-image: -webkit-radial-gradient(#9B7DD9, #6b41c9);
      background-image: radial-gradient(  #9B7DD9, #6b41c9); }
      @media only screen and (max-width: 640px) {
        .shq-landing-page__content .hero--whitepaper {
          min-height: 400px; } }
      .shq-landing-page__content .hero .bg-overlay {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background-size: cover;
        background-position: center;
        mix-blend-mode: luminosity;
        -webkit-filter: blur(5px);
        filter: blur(5px);
        opacity: 0.35; }
      .shq-landing-page__content .hero .shq-section-title {
        font-size: 0.75rem;
        color: #cabcea;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.1rem; }
      .shq-landing-page__content .hero .whitepaper-title {
        margin-bottom: 15rem; }
        @media only screen and (max-width: 640px) {
          .shq-landing-page__content .hero .whitepaper-title {
            margin-bottom: 0; } }
      .shq-landing-page__content .hero .whitepaper-hero {
        position: absolute;
        bottom: 0;
        width: 100%;
        text-align: center; }
        .shq-landing-page__content .hero .whitepaper-hero img {
          display: block;
          margin: 0 auto;
          max-height: 400px;
          max-width: 100%; }
      .shq-landing-page__content .hero h1 {
        font-family: "Gotham A", "Gotham B", sans-serif;
        font-weight: 700;
        line-height: 2.5rem; }
      .shq-landing-page__content .hero h2 {
        font-family: "Gotham A", "Gotham B", sans-serif;
        font-size: 1rem;
        color: #fff;
        font-weight: 700;
        line-height: normal; }
      .shq-landing-page__content .hero h3 {
        font-family: "Gotham A", "Gotham B", sans-serif;
        font-size: 1rem;
        color: #dcd3f1;
        font-weight: 700;
        line-height: normal; }
    .shq-landing-page__content .client-logos {
      background: #fff;
      border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
      .shq-landing-page__content .client-logos img {
        max-height: 15px; }
    .shq-landing-page__content .whitepaper-cover {
      box-shadow: rgba(0, 0, 0, 0.25) 0 25px 50px -20px; }
  .shq-landing-page__learn-list {
    display: block;
    list-style: none; }
    .shq-landing-page__learn-list li {
      position: relative;
      margin-bottom: 1.4rem;
      padding-left: 1.75rem;
      font-size: 0.75rem;
      line-height: 1.4rem; }
      .shq-landing-page__learn-list li .shq-icon--check {
        position: absolute;
        top: 0;
        left: 0;
        height: 1.4rem;
        width: 1rem;
        margin-left: 0.25rem;
        fill: #cabcea; }
  .shq-landing-page__footer {
    padding: 2rem;
    font-size: 0.625rem;
    color: #99A1AE;
    border-top: 1px solid rgba(0, 0, 0, 0.1); }
  .shq-landing-page .shq-figure-box {
    background: #eee9f8;
    padding: 1.5rem; }

.landing-page {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #fff;
  overflow: hidden; }
  @media only screen and (max-width: 640px) {
    .landing-page {
      overflow: hidden;
      overflow-y: auto; } }
  .landing-page .bg-image {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    .landing-page .bg-image img {
      height: 100%; }
    @media only screen and (max-width: 640px) {
      .landing-page .bg-image {
        position: fixed; } }
  .landing-page .bg-gradient-overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #8a69d4;
    background-image: -webkit-linear-gradient(-405deg, #8a69d4, #4C8FFB);
    background-image: linear-gradient(135deg,#8a69d4, #4C8FFB);
    opacity: 0.85; }
    @media only screen and (max-width: 640px) {
      .landing-page .bg-gradient-overlay {
        position: fixed; } }
  .landing-page__content {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 680px;
    width: 900px;
    margin-top: -340px;
    margin-left: -450px;
    box-shadow: rgba(0, 0, 0, 0.25) 0 25px 50px -20px; }
    @media only screen and (max-width: 640px) {
      .landing-page__content {
        position: relative;
        top: auto;
        left: auto;
        width: 95%;
        margin: 0 auto; } }
    .landing-page__content .shq-logo {
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      text-align: center;
      border: none; }
      .landing-page__content .shq-logo img {
        width: 150px; }
      @media only screen and (max-width: 640px) {
        .landing-page__content .shq-logo {
          position: relative;
          width: 100%;
          padding: 15px; } }
    .landing-page__content .content-left {
      position: absolute;
      top: 65px;
      bottom: 0;
      left: 0;
      width: 60%;
      background: #fff; }
      @media only screen and (max-width: 640px) {
        .landing-page__content .content-left {
          position: relative;
          top: 0;
          width: 100%; } }
      .landing-page__content .content-left p {
        margin-bottom: 15px;
        font-size: 14px;
        font-size: 0.875rem;
        line-height: 23px;
        line-height: 1.42rem; }
    .landing-page__content .content-right {
      position: absolute;
      top: 65px;
      bottom: 0;
      right: 0;
      width: 40%;
      background: rgba(255, 255, 255, 0.75); }
      @media only screen and (max-width: 640px) {
        .landing-page__content .content-right {
          position: relative;
          top: 0;
          bottom: auto;
          width: 100%;
          height: 900px;
          overflow: hidden; } }
    .landing-page__content .content-full {
      position: absolute;
      display: table;
      width: 100%;
      height: 620px;
      top: 65px;
      bottom: 0;
      left: 0;
      right: 0;
      background: white; }
      .landing-page__content .content-full .center-content {
        display: table-cell;
        text-align: center;
        vertical-align: middle; }
        .landing-page__content .content-full .center-content ul {
          margin: 30px auto;
          max-width: 600px;
          text-align: left; }
          .landing-page__content .content-full .center-content ul li {
            padding: 10px 0; }
      .landing-page__content .content-full .thank-you-headline {
        font-size: 40px;
        font-size: 2.5rem;
        margin-bottom: 30px; }
      .landing-page__content .content-full p {
        margin: 0 auto;
        max-width: 600px; }
  .landing-page h4 {
    margin-bottom: 20px; }
  .landing-page.rev-counter .landing-page__content {
    height: 500px;
    width: 900px;
    margin-top: -250px;
    box-shadow: none; }
  .landing-page.rev-counter .shq-logo-mark {
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    height: 110px;
    width: 300px;
    padding: 25px;
    margin-left: -150px;
    background: #fff;
    text-align: center;
    box-shadow: rgba(0, 0, 0, 0.25) 0 15px 45px -10px; }
  .landing-page.rev-counter .bg-gradient-overlay {
    background-color: #8a69d4;
    background-image: -webkit-linear-gradient(#8a69d4, #6D56CE);
    background-image: linear-gradient(#8a69d4, #6D56CE);
    opacity: 1; }
  .landing-page.rev-counter .content-full {
    height: 500px;
    top: 0;
    background: transparent; }
    .landing-page.rev-counter .content-full p {
      font-size: 20px;
      font-size: 1.25rem;
      color: #fff;
      max-width: none; }
    .landing-page.rev-counter .content-full .revenue {
      margin: 30px;
      padding: 30px;
      font-size: 80px;
      font-size: 5rem;
      font-family: 'Roboto Mono', monospace;
      color: #fff;
      font-weight: bold;
      background-color: #2F2844;
      background-color: #2F2844;
      background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0));
      background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0));
      border-radius: 10px;
      box-shadow: rgba(0, 0, 0, 0.45) 0 5px 45px inset; }

.event-title {
  margin-bottom: 30px;
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 32px;
  line-height: 2rem; }

.event-description {
  margin-bottom: 30px;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 22px;
  line-height: 1.4rem; }

.event-details {
  list-style: none; }
  .event-details__item {
    display: block;
    position: relative;
    padding: 15px;
    font-size: 12px;
    font-size: 0.75rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
    .event-details__item:last-child {
      border: none; }

.post-card {
  display: block;
  position: relative;
  float: left;
  width: 31.25%;
  height: 460px;
  margin: 1%;
  padding: 30px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 3px;
  -webkit-transition: all 0.1s ease;
  -moz-transition: all 0.1s ease;
  transition: all 0.1s ease; }
  @media only screen and (max-width: 640px) {
    .post-card {
      width: 98%;
      min-height: 300px; } }
  .post-card:hover {
    border-color: rgba(76, 143, 251, 0.25);
    background: rgba(76, 143, 251, 0.05);
    box-shadow: rgba(0, 0, 0, 0.25) 0 15px 25px -10px; }
  .post-card__content {
    display: block;
    margin-top: 80px; }
  .post-card__image {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 80px;
    width: 100%;
    overflow: hidden;
    text-align: center; }
    .post-card__image img {
      flex-shrink: 0;
      max-width: 100%; }
  .post-card__category {
    display: inline-block;
    margin-bottom: 10px;
    font-size: 10px;
    font-size: 0.625rem;
    color: #C5C9D1;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05rem; }
  .post-card__title {
    margin-bottom: 0;
    font-size: 20px;
    font-size: 1.25rem;
    color: #4C8FFB;
    line-height: 32px;
    line-height: 2rem; }
    .post-card__title a {
      text-decoration: none;
      border: none; }
  .post-card__posted-by {
    color: #C5C9D1; }
  .post-card__date {
    font-size: 12px;
    font-size: 0.75rem;
    font-weight: 600; }
  .post-card__author {
    font-size: 12px;
    font-size: 0.75rem; }
  .post-card--featured {
    width: 98%; }
    .post-card--featured .post-card__content {
      display: block;
      margin-top: 0; }
      @media only screen and (max-width: 640px) {
        .post-card--featured .post-card__content {
          margin-top: 80px; } }
    .post-card--featured .post-card__title {
      font-size: 32px;
      font-size: 2rem;
      line-height: 51px;
      line-height: 3.2rem; }
    .post-card--featured .post-card__image {
      top: 0;
      bottom: 0;
      left: 0;
      right: auto;
      height: auto;
      width: 33.33333%; }
      .post-card--featured .post-card__image img {
        height: 100%;
        min-width: 100%;
        min-height: 100%;
        max-width: none; }
        @media only screen and (max-width: 640px) {
          .post-card--featured .post-card__image img {
            min-width: 100%;
            height: auto; } }
      @media only screen and (max-width: 640px) {
        .post-card--featured .post-card__image {
          bottom: auto;
          right: 0;
          height: 80px;
          width: 98%; } }

.post-tag {
  display: inline-block;
  margin-right: 10px;
  margin-bottom: 10px;
  padding: 2px 5px;
  font-size: 10.8px;
  font-size: 0.675rem;
  color: #6E798B;
  text-transform: uppercase;
  letter-spacing: 0.05rem;
  background: rgba(153, 161, 174, 0.1);
  border: 1px solid transparent;
  border-radius: 2px;
  -webkit-transition: all 0.1s ease;
  -moz-transition: all 0.1s ease;
  transition: all 0.1s ease; }
  .post-tag:hover {
    color: #4C8FFB;
    background: rgba(76, 143, 251, 0.25); }
  .post-tag:last-child {
    margin-right: 0; }
  .post-tag--header {
    color: #fff;
    background: rgba(255, 255, 255, 0.1); }
    .post-tag--header:hover {
      color: #fff;
      background: rgba(255, 255, 255, 0.25); }

.post-category {
  display: inline-block;
  padding: 5px 10px;
  font-size: 8px;
  font-size: 0.5rem;
  color: #fff;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.05rem;
  border: none;
  -webkit-transition: all 0.1s ease;
  -moz-transition: all 0.1s ease;
  transition: all 0.1s ease; }
  .post-category:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.25); }

.social-share a {
  font-size: 32px;
  font-size: 2rem;
  color: #99A1AE;
  border: none;
  -webkit-transition: all 0.1s ease;
  -moz-transition: all 0.1s ease;
  transition: all 0.1s ease; }
  .social-share a:hover {
    color: #4C8FFB; }

.blog-search {
  display: block;
  position: relative;
  width: 100%;
  padding: 30px;
  font-size: 32px;
  font-size: 2rem;
  color: #5A5070;
  background: rgba(255, 255, 255, 0.1);
  border: 5px solid rgba(90, 80, 112, 0.1);
  border-radius: 0.25rem;
  outline: none; }
  .blog-search::-webkit-input-placeholder {
    color: rgba(90, 80, 112, 0.5); }
  .blog-search::-moz-placeholder {
    color: rgba(90, 80, 112, 0.5); }
  .blog-search:-moz-placeholder {
    color: rgba(90, 80, 112, 0.5); }
  .blog-search:-ms-input-placeholder {
    color: rgba(90, 80, 112, 0.5); }
  .blog-search:active, .blog-search:focus {
    border-color: #00BCE3; }
  @media only screen and (max-width: 640px) {
    .blog-search {
      padding: 20px;
      font-size: 32px;
      font-size: 2rem; } }

/* Grid System
---------------------------------*/
*,
*:after,
*:before {
  margin: 0;
  padding: 0;
  /* Removes padding behaviour on widths */
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

/* Main Wrappers
----------------------*/
.wrap {
  z-index: 1;
  position: relative;
  width: 83.333%;
  max-width: 1000px;
  margin: 0 auto;
  overflow: hidden; }
  .wrap--unlimited {
    max-width: none; }
    .wrap--unlimited .col-1, .wrap--unlimited .col-2, .wrap--unlimited .col-3,
    .wrap--unlimited .col-4, .wrap--unlimited .col-5, .wrap--unlimited .col-6,
    .wrap--unlimited .col-7, .wrap--unlimited .col-8, .wrap--unlimited .col-9,
    .wrap--unlimited .col-10, .wrap--unlimited .col-11, .wrap--unlimited .col-12 {
      max-width: none; }
  .wrap--overflow {
    overflow: visible; }

.contain {
  overflow: hidden; }

.row {
  display: block; }

.col, .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11 {
  float: left; }
  .col-1 {
    width: 8.33333%;
    max-width: 100px; }
  .col-2 {
    width: 16.66667%;
    max-width: 200px; }
  .col-3 {
    width: 25%;
    max-width: 300px; }
  .col-4 {
    width: 33.33333%;
    max-width: 400px; }
  .col-5 {
    width: 41.66667%;
    max-width: 500px; }
  .col-6 {
    width: 50%;
    max-width: 600px; }
  .col-7 {
    width: 58.33333%;
    max-width: 700px; }
  .col-8 {
    width: 66.66667%;
    max-width: 800px; }
  .col-9 {
    width: 75%;
    max-width: 900px; }
  .col-10 {
    width: 83.33333%;
    max-width: 1000px; }
  .col-11 {
    width: 91.66667%;
    max-width: 1100px; }
  .col-12 {
    display: block;
    width: percentage 1; }

/* Positioning Helpers
----------------------*/
.push-right {
  float: right; }

.col-center {
  float: none;
  margin: 0 auto; }

.absolute-center {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%); }

/* Grid Margins
----------------------*/
.margin-1 {
  margin-right: 8.33333%; }

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

.margin-4col .col-3 {
  width: 24%;
  margin-right: 1.333%; }
  .margin-4col .col-3:last-child {
    margin-right: 0; }
  @media only screen and (max-width: 640px) {
    .margin-4col .col-3 {
      width: 100%;
      margin: 0; } }

.margin-3col .col-4 {
  width: 32%;
  margin-right: 2%; }
  .margin-3col .col-4:last-child {
    margin-right: 0; }
  @media only screen and (max-width: 640px) {
    .margin-3col .col-4 {
      width: 100%;
      margin: 20px 0; } }

/* Grid Padding
----------------------*/
.pad-15 {
  padding: 15px; }
.pad-15x {
  padding: 0 15px; }
.pad-15y {
  padding: 15px 0; }
.pad-20 {
  padding: 20px; }
.pad-20x {
  padding: 0 20px; }
.pad-20y {
  padding: 20px 0; }
.pad-20l {
  padding-left: 20px; }
.pad-20r {
  padding-right: 20px; }
.pad-40 {
  padding: 40px; }
.pad-40x {
  padding: 0 40px; }
.pad-40y {
  padding: 40px 0; }
.pad-40l {
  padding-left: 40px; }
.pad-40r {
  padding-right: 40px; }
.pad-45 {
  padding: 45px; }
.pad-60 {
  padding: 60px; }
.pad-60x {
  padding: 0 60px; }
.pad-60y {
  padding: 60px 0; }
.pad-80 {
  padding: 80px; }
.pad-80x {
  padding: 0 80px; }
.pad-80y {
  padding: 80px 0; }
.pad-100 {
  padding: 100px; }
.pad-100x {
  padding: 0 100px; }
.pad-100y {
  padding: 100px 0; }

/* Responsiveness
----------------------*/
@media only screen and (min-width: 1400px) {
  .pad-100y {
    padding: 150px 0; } }
@media only screen and (max-width: 900px) {
  .wrap {
    width: 100%;
    padding-left: 20px;
    padding-right: 20px; } }
@media only screen and (max-width: 640px) {
  .show-tablet {
    display: block; }

  .hide-tablet {
    display: none; } }
@media only screen and (max-width: 640px) {
  .col-1, .col-2, .col-3,
  .col-4, .col-5, .col-6,
  .col-7, .col-8, .col-9,
  .col-10, .col-11, .col-12 {
    width: 100%;
    max-width: 100%; }

  .pad-20l {
    padding-left: 0; }
  .pad-20r {
    padding-right: 0; }
  .pad-40l {
    padding-left: 0; }
  .pad-40r {
    padding-right: 0; }
  .pad-60 {
    padding: 30px; }
  .pad-80y {
    padding: 40px 0; }
  .pad-100y {
    padding: 50px 0; }

  .hide-mobile {
    display: none !important; }

  .show-mobile {
    display: block !important; }

  html {
    font-size: 62.5%; } }
.hide {
  display: none; }

/* Variables
----------------------*/
/* Base
----------------------*/
*, :after, :before {
  box-sizing: border-box; }

html {
  font-family: "Gotham SSm A", "Gotham SSm B", sans-serif;
  font-size: 100%;
  color: #2F2149;
  font-weight: 400;
  line-height: 1.5; }

body {
  font-family: "Gotham SSm A", "Gotham SSm B", sans-serif;
  font-size: 1;
  letter-spacing: 0.1;
  word-spacing: normal;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility; }

p {
  margin: 0 0 1rem 0;
  font-size: 1rem;
  font-weight: 300;
  color: #2F2149;
  line-height: 1.618rem; }
  p:last-child {
    margin: 0; }

a {
  cursor: pointer;
  text-decoration: none;
  color: #5E65DE;
  -webkit-user-select: none; }

input, select, textarea {
  font: inherit; }

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  font-family: stolzl, sans-serif;
  color: inherit; }

ul {
  margin: 0; }

.shqSite-text-body {
  font-size: 1rem; }

.shqSite-text-heading--xlarge {
  font-family: stolzl, sans-serif;
  font-size: 3.375rem;
  font-weight: 700;
  color: #2F2149;
  letter-spacing: -0.05rem;
  line-height: 3.375rem; }

.shqSite-text-heading--large {
  font-family: stolzl, sans-serif;
  font-size: 2.5rem;
  font-weight: 700;
  color: #2F2149;
  letter-spacing: -0.05rem; }
  .shqSite-text-heading--large + p {
    margin-top: 1.5rem; }

.shqSite-text-heading--medium {
  font-family: stolzl, sans-serif;
  font-size: 1.5rem;
  font-weight: 500;
  color: #2F2149;
  letter-spacing: -0.05rem;
  line-height: 1.5rem; }
  .shqSite-text-heading--medium + p {
    margin-top: 1rem; }

.shqSite-text-heading--small {
  font-family: stolzl, sans-serif;
  font-size: 1.1875rem;
  font-weight: 500;
  color: #2F2149;
  letter-spacing: -0.025rem;
  line-height: 1.1875rem; }
  .shqSite-text-heading--small + p {
    margin-top: 0.75rem; }

.shqSite-text-heading--xsmall {
  font-family: stolzl, sans-serif;
  font-size: 1rem;
  font-weight: 600;
  color: #2F2149;
  letter-spacing: -0.025rem;
  line-height: 1rem; }
  .shqSite-text-heading--xsmall + p {
    margin-top: 0.5rem; }

.shqSite-text-subheading {
  font-size: 1.5rem;
  font-weight: 300;
  color: #2F2149;
  letter-spacing: -0.05rem;
  line-height: 2.25rem; }

.shqSite-text-subtitle {
  font-family: stolzl, sans-serif;
  font-size: 1rem;
  font-weight: 500;
  color: #2F2149;
  text-transform: uppercase;
  line-height: 1rem;
  letter-spacing: 0.05rem; }
  .shqSite-text-subtitle--undercase {
    text-transform: none; }
  .shqSite-text-subtitle + p {
    margin-top: 0.625rem; }

.shqSite-text-blockquote {
  position: relative;
  font-family: "Gotham SSm A", "Gotham SSm B", sans-serif;
  font-size: 1rem;
  color: #2F2149;
  font-weight: 300;
  line-height: 1.65rem; }
  .shqSite-text-blockquote strong {
    font-weight: 800; }

.shqSite-text-caption {
  font-family: "Gotham SSm A", "Gotham SSm B", sans-serif;
  color: #2F2149;
  font-size: 0.875rem;
  line-height: 1.3125rem; }

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

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

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

.shqSite-text-quiet {
  opacity: 0.5; }

.shqSite-text-truncate {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; }

.shqSite-section-header h2 {
  margin: 0 0 1.5rem 0; }

.shqSite-text-white {
  color: #FFF; }

.shqSite-grid {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  max-width: 1180px;
  margin: 0 auto; }
  .shqSite-grid + .shqSite-grid {
    margin-top: 2rem; }
  .shqSite-grid [class*='shqSite-col-'] {
    padding: 0 2rem; }
  .shqSite-grid--padded {
    margin-left: -1.5rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem; }
    .shqSite-grid--padded .shqSite-col {
      padding-left: 1.5rem; }
  .shqSite-grid--no-gutter {
    margin-top: 0 !important;
    padding-left: 0;
    padding-right: 0; }
    .shqSite-grid--no-gutter [class*='shqSite-col-'] {
      padding-left: 0;
      padding-right: 0; }
  .shqSite-grid--align-left {
    -webkit-box-pack: start;
    -moz-box-pack: start;
    box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -ms-justify-content: flex-start;
    -o-justify-content: flex-start;
    justify-content: flex-start;
    -ms-flex-pack: start; }
  .shqSite-grid--align-right {
    -webkit-box-pack: end;
    -moz-box-pack: end;
    box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-justify-content: flex-end;
    -ms-justify-content: flex-end;
    -o-justify-content: flex-end;
    justify-content: flex-end;
    -ms-flex-pack: end; }
  .shqSite-grid--align-center {
    -webkit-box-pack: center;
    -moz-box-pack: center;
    box-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    -o-justify-content: center;
    justify-content: center;
    -ms-flex-pack: center; }
  .shqSite-grid--align-space {
    -webkit-box-pack: distribute;
    -moz-box-pack: distribute;
    box-pack: distribute;
    -webkit-justify-content: space-around;
    -moz-justify-content: space-around;
    -ms-justify-content: space-around;
    -o-justify-content: space-around;
    justify-content: space-around;
    -ms-flex-pack: distribute; }
  .shqSite-grid--align-stretch {
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -ms-justify-content: space-between;
    -o-justify-content: space-between;
    justify-content: space-between;
    -ms-flex-pack: justify; }
  .shqSite-grid--vertical-align-top {
    -webkit-box-align: start;
    -moz-box-align: start;
    box-align: start;
    -webkit-align-items: flex-start;
    -moz-align-items: flex-start;
    -ms-align-items: flex-start;
    -o-align-items: flex-start;
    align-items: flex-start;
    -ms-flex-align: start;
    -webkit-align-content: flex-start;
    -moz-align-content: flex-start;
    align-content: flex-start;
    -ms-flex-line-pack: start; }
  .shqSite-grid--vertical-align-bottom {
    -webkit-box-align: end;
    -moz-box-align: end;
    box-align: end;
    -webkit-align-items: flex-end;
    -moz-align-items: flex-end;
    -ms-align-items: flex-end;
    -o-align-items: flex-end;
    align-items: flex-end;
    -ms-flex-align: end;
    -webkit-align-content: flex-end;
    -moz-align-content: flex-end;
    align-content: flex-end;
    -ms-flex-line-pack: end; }
  .shqSite-grid--vertical-align-center {
    -webkit-box-align: center;
    -moz-box-align: center;
    box-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-align-content: center;
    -moz-align-content: center;
    align-content: center;
    -ms-flex-line-pack: center; }
  .shqSite-grid--vertical-fill {
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    box-align: stretch;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -ms-flex-align: stretch;
    -webkit-align-content: stretch;
    -moz-align-content: stretch;
    align-content: stretch;
    -ms-flex-line-pack: stretch; }

.shqSite-flex-reset {
  display: flex;
  flex-direction: row;
  height: 100%; }

.shqSite-col {
  flex-grow: 1;
  flex-basis: 0;
  max-width: 100%; }

.shqSite-col--1of1 {
  flex-basis: 100%;
  max-width: 100%; }

.shqSite-col--1of2 {
  flex-basis: 50%;
  max-width: 50%; }

.shqSite-col--2of2 {
  flex-basis: 100%;
  max-width: 100%; }

.shqSite-col--1of3 {
  flex-basis: 33.33333%;
  max-width: 33.33333%; }

.shqSite-col--2of3 {
  flex-basis: 66.66667%;
  max-width: 66.66667%; }

.shqSite-col--3of3 {
  flex-basis: 100%;
  max-width: 100%; }

.shqSite-col--1of4 {
  flex-basis: 25%;
  max-width: 25%; }

.shqSite-col--2of4 {
  flex-basis: 50%;
  max-width: 50%; }

.shqSite-col--3of4 {
  flex-basis: 75%;
  max-width: 75%; }

.shqSite-col--4of4 {
  flex-basis: 100%;
  max-width: 100%; }

.shqSite-col--1of5 {
  flex-basis: 20%;
  max-width: 20%; }

.shqSite-col--2of5 {
  flex-basis: 40%;
  max-width: 40%; }

.shqSite-col--3of5 {
  flex-basis: 60%;
  max-width: 60%; }

.shqSite-col--4of5 {
  flex-basis: 80%;
  max-width: 80%; }

.shqSite-col--5of5 {
  flex-basis: 100%;
  max-width: 100%; }

.shqSite-col--1of6 {
  flex-basis: 16.66667%;
  max-width: 16.66667%; }

.shqSite-col--2of6 {
  flex-basis: 33.33333%;
  max-width: 33.33333%; }

.shqSite-col--3of6 {
  flex-basis: 50%;
  max-width: 50%; }

.shqSite-col--4of6 {
  flex-basis: 66.66667%;
  max-width: 66.66667%; }

.shqSite-col--5of6 {
  flex-basis: 83.33333%;
  max-width: 83.33333%; }

.shqSite-col--6of6 {
  flex-basis: 100%;
  max-width: 100%; }

.shqSite-col--1of7 {
  flex-basis: 14.28571%;
  max-width: 14.28571%; }

.shqSite-col--2of7 {
  flex-basis: 28.57143%;
  max-width: 28.57143%; }

.shqSite-col--3of7 {
  flex-basis: 42.85714%;
  max-width: 42.85714%; }

.shqSite-col--4of7 {
  flex-basis: 57.14286%;
  max-width: 57.14286%; }

.shqSite-col--5of7 {
  flex-basis: 71.42857%;
  max-width: 71.42857%; }

.shqSite-col--6of7 {
  flex-basis: 85.71429%;
  max-width: 85.71429%; }

.shqSite-col--7of7 {
  flex-basis: 100%;
  max-width: 100%; }

.shqSite-col--1of8 {
  flex-basis: 12.5%;
  max-width: 12.5%; }

.shqSite-col--2of8 {
  flex-basis: 25%;
  max-width: 25%; }

.shqSite-col--3of8 {
  flex-basis: 37.5%;
  max-width: 37.5%; }

.shqSite-col--4of8 {
  flex-basis: 50%;
  max-width: 50%; }

.shqSite-col--5of8 {
  flex-basis: 62.5%;
  max-width: 62.5%; }

.shqSite-col--6of8 {
  flex-basis: 75%;
  max-width: 75%; }

.shqSite-col--7of8 {
  flex-basis: 87.5%;
  max-width: 87.5%; }

.shqSite-col--8of8 {
  flex-basis: 100%;
  max-width: 100%; }

.shqSite-col--1of9 {
  flex-basis: 11.11111%;
  max-width: 11.11111%; }

.shqSite-col--2of9 {
  flex-basis: 22.22222%;
  max-width: 22.22222%; }

.shqSite-col--3of9 {
  flex-basis: 33.33333%;
  max-width: 33.33333%; }

.shqSite-col--4of9 {
  flex-basis: 44.44444%;
  max-width: 44.44444%; }

.shqSite-col--5of9 {
  flex-basis: 55.55556%;
  max-width: 55.55556%; }

.shqSite-col--6of9 {
  flex-basis: 66.66667%;
  max-width: 66.66667%; }

.shqSite-col--7of9 {
  flex-basis: 77.77778%;
  max-width: 77.77778%; }

.shqSite-col--8of9 {
  flex-basis: 88.88889%;
  max-width: 88.88889%; }

.shqSite-col--9of9 {
  flex-basis: 100%;
  max-width: 100%; }

.shqSite-col--1of10 {
  flex-basis: 10%;
  max-width: 10%; }

.shqSite-col--2of10 {
  flex-basis: 20%;
  max-width: 20%; }

.shqSite-col--3of10 {
  flex-basis: 30%;
  max-width: 30%; }

.shqSite-col--4of10 {
  flex-basis: 40%;
  max-width: 40%; }

.shqSite-col--5of10 {
  flex-basis: 50%;
  max-width: 50%; }

.shqSite-col--6of10 {
  flex-basis: 60%;
  max-width: 60%; }

.shqSite-col--7of10 {
  flex-basis: 70%;
  max-width: 70%; }

.shqSite-col--8of10 {
  flex-basis: 80%;
  max-width: 80%; }

.shqSite-col--9of10 {
  flex-basis: 90%;
  max-width: 90%; }

.shqSite-col--10of10 {
  flex-basis: 100%;
  max-width: 100%; }

.shqSite-col--1of11 {
  flex-basis: 9.09091%;
  max-width: 9.09091%; }

.shqSite-col--2of11 {
  flex-basis: 18.18182%;
  max-width: 18.18182%; }

.shqSite-col--3of11 {
  flex-basis: 27.27273%;
  max-width: 27.27273%; }

.shqSite-col--4of11 {
  flex-basis: 36.36364%;
  max-width: 36.36364%; }

.shqSite-col--5of11 {
  flex-basis: 45.45455%;
  max-width: 45.45455%; }

.shqSite-col--6of11 {
  flex-basis: 54.54545%;
  max-width: 54.54545%; }

.shqSite-col--7of11 {
  flex-basis: 63.63636%;
  max-width: 63.63636%; }

.shqSite-col--8of11 {
  flex-basis: 72.72727%;
  max-width: 72.72727%; }

.shqSite-col--9of11 {
  flex-basis: 81.81818%;
  max-width: 81.81818%; }

.shqSite-col--10of11 {
  flex-basis: 90.90909%;
  max-width: 90.90909%; }

.shqSite-col--11of11 {
  flex-basis: 100%;
  max-width: 100%; }

.shqSite-col--1of12 {
  flex-basis: 8.33333%;
  max-width: 8.33333%; }

.shqSite-col--2of12 {
  flex-basis: 16.66667%;
  max-width: 16.66667%; }

.shqSite-col--3of12 {
  flex-basis: 25%;
  max-width: 25%; }

.shqSite-col--4of12 {
  flex-basis: 33.33333%;
  max-width: 33.33333%; }

.shqSite-col--5of12 {
  flex-basis: 41.66667%;
  max-width: 41.66667%; }

.shqSite-col--6of12 {
  flex-basis: 50%;
  max-width: 50%; }

.shqSite-col--7of12 {
  flex-basis: 58.33333%;
  max-width: 58.33333%; }

.shqSite-col--8of12 {
  flex-basis: 66.66667%;
  max-width: 66.66667%; }

.shqSite-col--9of12 {
  flex-basis: 75%;
  max-width: 75%; }

.shqSite-col--10of12 {
  flex-basis: 83.33333%;
  max-width: 83.33333%; }

.shqSite-col--11of12 {
  flex-basis: 91.66667%;
  max-width: 91.66667%; }

.shqSite-col--12of12 {
  flex-basis: 100%;
  max-width: 100%; }

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

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

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

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

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

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

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

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

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

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

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

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

@media (max-width: 25.875em) {
  .shqSite-grid {
    flex-direction: column;
    padding: 0 1.5rem;
    margin: 0; }

  [class*='shqSite-col--'] {
    box-sizing: border-box;
    flex: 0 0 auto;
    flex-grow: 1;
    flex-basis: 0;
    max-width: 100%; }

  [class*='shqSite-col-offset--'] {
    margin-left: 0; }

  .shqSite-col-sm--1of1 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-sm--1of2 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-sm--2of2 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-sm--1of3 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .shqSite-col-sm--2of3 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .shqSite-col-sm--3of3 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-sm--1of4 {
    flex-basis: 25%;
    max-width: 25%; }

  .shqSite-col-sm--2of4 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-sm--3of4 {
    flex-basis: 75%;
    max-width: 75%; }

  .shqSite-col-sm--4of4 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-sm--1of5 {
    flex-basis: 20%;
    max-width: 20%; }

  .shqSite-col-sm--2of5 {
    flex-basis: 40%;
    max-width: 40%; }

  .shqSite-col-sm--3of5 {
    flex-basis: 60%;
    max-width: 60%; }

  .shqSite-col-sm--4of5 {
    flex-basis: 80%;
    max-width: 80%; }

  .shqSite-col-sm--5of5 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-sm--1of6 {
    flex-basis: 16.66667%;
    max-width: 16.66667%; }

  .shqSite-col-sm--2of6 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .shqSite-col-sm--3of6 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-sm--4of6 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .shqSite-col-sm--5of6 {
    flex-basis: 83.33333%;
    max-width: 83.33333%; }

  .shqSite-col-sm--6of6 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-sm--1of7 {
    flex-basis: 14.28571%;
    max-width: 14.28571%; }

  .shqSite-col-sm--2of7 {
    flex-basis: 28.57143%;
    max-width: 28.57143%; }

  .shqSite-col-sm--3of7 {
    flex-basis: 42.85714%;
    max-width: 42.85714%; }

  .shqSite-col-sm--4of7 {
    flex-basis: 57.14286%;
    max-width: 57.14286%; }

  .shqSite-col-sm--5of7 {
    flex-basis: 71.42857%;
    max-width: 71.42857%; }

  .shqSite-col-sm--6of7 {
    flex-basis: 85.71429%;
    max-width: 85.71429%; }

  .shqSite-col-sm--7of7 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-sm--1of8 {
    flex-basis: 12.5%;
    max-width: 12.5%; }

  .shqSite-col-sm--2of8 {
    flex-basis: 25%;
    max-width: 25%; }

  .shqSite-col-sm--3of8 {
    flex-basis: 37.5%;
    max-width: 37.5%; }

  .shqSite-col-sm--4of8 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-sm--5of8 {
    flex-basis: 62.5%;
    max-width: 62.5%; }

  .shqSite-col-sm--6of8 {
    flex-basis: 75%;
    max-width: 75%; }

  .shqSite-col-sm--7of8 {
    flex-basis: 87.5%;
    max-width: 87.5%; }

  .shqSite-col-sm--8of8 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-sm--1of9 {
    flex-basis: 11.11111%;
    max-width: 11.11111%; }

  .shqSite-col-sm--2of9 {
    flex-basis: 22.22222%;
    max-width: 22.22222%; }

  .shqSite-col-sm--3of9 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .shqSite-col-sm--4of9 {
    flex-basis: 44.44444%;
    max-width: 44.44444%; }

  .shqSite-col-sm--5of9 {
    flex-basis: 55.55556%;
    max-width: 55.55556%; }

  .shqSite-col-sm--6of9 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .shqSite-col-sm--7of9 {
    flex-basis: 77.77778%;
    max-width: 77.77778%; }

  .shqSite-col-sm--8of9 {
    flex-basis: 88.88889%;
    max-width: 88.88889%; }

  .shqSite-col-sm--9of9 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-sm--1of10 {
    flex-basis: 10%;
    max-width: 10%; }

  .shqSite-col-sm--2of10 {
    flex-basis: 20%;
    max-width: 20%; }

  .shqSite-col-sm--3of10 {
    flex-basis: 30%;
    max-width: 30%; }

  .shqSite-col-sm--4of10 {
    flex-basis: 40%;
    max-width: 40%; }

  .shqSite-col-sm--5of10 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-sm--6of10 {
    flex-basis: 60%;
    max-width: 60%; }

  .shqSite-col-sm--7of10 {
    flex-basis: 70%;
    max-width: 70%; }

  .shqSite-col-sm--8of10 {
    flex-basis: 80%;
    max-width: 80%; }

  .shqSite-col-sm--9of10 {
    flex-basis: 90%;
    max-width: 90%; }

  .shqSite-col-sm--10of10 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-sm--1of11 {
    flex-basis: 9.09091%;
    max-width: 9.09091%; }

  .shqSite-col-sm--2of11 {
    flex-basis: 18.18182%;
    max-width: 18.18182%; }

  .shqSite-col-sm--3of11 {
    flex-basis: 27.27273%;
    max-width: 27.27273%; }

  .shqSite-col-sm--4of11 {
    flex-basis: 36.36364%;
    max-width: 36.36364%; }

  .shqSite-col-sm--5of11 {
    flex-basis: 45.45455%;
    max-width: 45.45455%; }

  .shqSite-col-sm--6of11 {
    flex-basis: 54.54545%;
    max-width: 54.54545%; }

  .shqSite-col-sm--7of11 {
    flex-basis: 63.63636%;
    max-width: 63.63636%; }

  .shqSite-col-sm--8of11 {
    flex-basis: 72.72727%;
    max-width: 72.72727%; }

  .shqSite-col-sm--9of11 {
    flex-basis: 81.81818%;
    max-width: 81.81818%; }

  .shqSite-col-sm--10of11 {
    flex-basis: 90.90909%;
    max-width: 90.90909%; }

  .shqSite-col-sm--11of11 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-sm--1of12 {
    flex-basis: 8.33333%;
    max-width: 8.33333%; }

  .shqSite-col-sm--2of12 {
    flex-basis: 16.66667%;
    max-width: 16.66667%; }

  .shqSite-col-sm--3of12 {
    flex-basis: 25%;
    max-width: 25%; }

  .shqSite-col-sm--4of12 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .shqSite-col-sm--5of12 {
    flex-basis: 41.66667%;
    max-width: 41.66667%; }

  .shqSite-col-sm--6of12 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-sm--7of12 {
    flex-basis: 58.33333%;
    max-width: 58.33333%; }

  .shqSite-col-sm--8of12 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .shqSite-col-sm--9of12 {
    flex-basis: 75%;
    max-width: 75%; }

  .shqSite-col-sm--10of12 {
    flex-basis: 83.33333%;
    max-width: 83.33333%; }

  .shqSite-col-sm--11of12 {
    flex-basis: 91.66667%;
    max-width: 91.66667%; }

  .shqSite-col-sm--12of12 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-offset-sm--1 {
    margin-left: 8.33333%; }

  .shqSite-col-offset-sm--2 {
    margin-left: 16.66667%; }

  .shqSite-col-offset-sm--3 {
    margin-left: 25%; }

  .shqSite-col-offset-sm--4 {
    margin-left: 33.33333%; }

  .shqSite-col-offset-sm--5 {
    margin-left: 41.66667%; }

  .shqSite-col-offset-sm--6 {
    margin-left: 50%; }

  .shqSite-col-offset-sm--7 {
    margin-left: 58.33333%; }

  .shqSite-col-offset-sm--8 {
    margin-left: 66.66667%; }

  .shqSite-col-offset-sm--9 {
    margin-left: 75%; }

  .shqSite-col-offset-sm--10 {
    margin-left: 83.33333%; }

  .shqSite-col-offset-sm--11 {
    margin-left: 91.66667%; }

  .shqSite-col-offset-sm--12 {
    margin-left: 100%; } }
@media (min-width: 25.875em) and (max-width: 46.8em) {
  .shqSite-col-md--1of1 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-md--1of2 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-md--2of2 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-md--1of3 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .shqSite-col-md--2of3 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .shqSite-col-md--3of3 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-md--1of4 {
    flex-basis: 25%;
    max-width: 25%; }

  .shqSite-col-md--2of4 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-md--3of4 {
    flex-basis: 75%;
    max-width: 75%; }

  .shqSite-col-md--4of4 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-md--1of5 {
    flex-basis: 20%;
    max-width: 20%; }

  .shqSite-col-md--2of5 {
    flex-basis: 40%;
    max-width: 40%; }

  .shqSite-col-md--3of5 {
    flex-basis: 60%;
    max-width: 60%; }

  .shqSite-col-md--4of5 {
    flex-basis: 80%;
    max-width: 80%; }

  .shqSite-col-md--5of5 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-md--1of6 {
    flex-basis: 16.66667%;
    max-width: 16.66667%; }

  .shqSite-col-md--2of6 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .shqSite-col-md--3of6 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-md--4of6 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .shqSite-col-md--5of6 {
    flex-basis: 83.33333%;
    max-width: 83.33333%; }

  .shqSite-col-md--6of6 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-md--1of7 {
    flex-basis: 14.28571%;
    max-width: 14.28571%; }

  .shqSite-col-md--2of7 {
    flex-basis: 28.57143%;
    max-width: 28.57143%; }

  .shqSite-col-md--3of7 {
    flex-basis: 42.85714%;
    max-width: 42.85714%; }

  .shqSite-col-md--4of7 {
    flex-basis: 57.14286%;
    max-width: 57.14286%; }

  .shqSite-col-md--5of7 {
    flex-basis: 71.42857%;
    max-width: 71.42857%; }

  .shqSite-col-md--6of7 {
    flex-basis: 85.71429%;
    max-width: 85.71429%; }

  .shqSite-col-md--7of7 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-md--1of8 {
    flex-basis: 12.5%;
    max-width: 12.5%; }

  .shqSite-col-md--2of8 {
    flex-basis: 25%;
    max-width: 25%; }

  .shqSite-col-md--3of8 {
    flex-basis: 37.5%;
    max-width: 37.5%; }

  .shqSite-col-md--4of8 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-md--5of8 {
    flex-basis: 62.5%;
    max-width: 62.5%; }

  .shqSite-col-md--6of8 {
    flex-basis: 75%;
    max-width: 75%; }

  .shqSite-col-md--7of8 {
    flex-basis: 87.5%;
    max-width: 87.5%; }

  .shqSite-col-md--8of8 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-md--1of9 {
    flex-basis: 11.11111%;
    max-width: 11.11111%; }

  .shqSite-col-md--2of9 {
    flex-basis: 22.22222%;
    max-width: 22.22222%; }

  .shqSite-col-md--3of9 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .shqSite-col-md--4of9 {
    flex-basis: 44.44444%;
    max-width: 44.44444%; }

  .shqSite-col-md--5of9 {
    flex-basis: 55.55556%;
    max-width: 55.55556%; }

  .shqSite-col-md--6of9 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .shqSite-col-md--7of9 {
    flex-basis: 77.77778%;
    max-width: 77.77778%; }

  .shqSite-col-md--8of9 {
    flex-basis: 88.88889%;
    max-width: 88.88889%; }

  .shqSite-col-md--9of9 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-md--1of10 {
    flex-basis: 10%;
    max-width: 10%; }

  .shqSite-col-md--2of10 {
    flex-basis: 20%;
    max-width: 20%; }

  .shqSite-col-md--3of10 {
    flex-basis: 30%;
    max-width: 30%; }

  .shqSite-col-md--4of10 {
    flex-basis: 40%;
    max-width: 40%; }

  .shqSite-col-md--5of10 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-md--6of10 {
    flex-basis: 60%;
    max-width: 60%; }

  .shqSite-col-md--7of10 {
    flex-basis: 70%;
    max-width: 70%; }

  .shqSite-col-md--8of10 {
    flex-basis: 80%;
    max-width: 80%; }

  .shqSite-col-md--9of10 {
    flex-basis: 90%;
    max-width: 90%; }

  .shqSite-col-md--10of10 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-md--1of11 {
    flex-basis: 9.09091%;
    max-width: 9.09091%; }

  .shqSite-col-md--2of11 {
    flex-basis: 18.18182%;
    max-width: 18.18182%; }

  .shqSite-col-md--3of11 {
    flex-basis: 27.27273%;
    max-width: 27.27273%; }

  .shqSite-col-md--4of11 {
    flex-basis: 36.36364%;
    max-width: 36.36364%; }

  .shqSite-col-md--5of11 {
    flex-basis: 45.45455%;
    max-width: 45.45455%; }

  .shqSite-col-md--6of11 {
    flex-basis: 54.54545%;
    max-width: 54.54545%; }

  .shqSite-col-md--7of11 {
    flex-basis: 63.63636%;
    max-width: 63.63636%; }

  .shqSite-col-md--8of11 {
    flex-basis: 72.72727%;
    max-width: 72.72727%; }

  .shqSite-col-md--9of11 {
    flex-basis: 81.81818%;
    max-width: 81.81818%; }

  .shqSite-col-md--10of11 {
    flex-basis: 90.90909%;
    max-width: 90.90909%; }

  .shqSite-col-md--11of11 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-md--1of12 {
    flex-basis: 8.33333%;
    max-width: 8.33333%; }

  .shqSite-col-md--2of12 {
    flex-basis: 16.66667%;
    max-width: 16.66667%; }

  .shqSite-col-md--3of12 {
    flex-basis: 25%;
    max-width: 25%; }

  .shqSite-col-md--4of12 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .shqSite-col-md--5of12 {
    flex-basis: 41.66667%;
    max-width: 41.66667%; }

  .shqSite-col-md--6of12 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-md--7of12 {
    flex-basis: 58.33333%;
    max-width: 58.33333%; }

  .shqSite-col-md--8of12 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .shqSite-col-md--9of12 {
    flex-basis: 75%;
    max-width: 75%; }

  .shqSite-col-md--10of12 {
    flex-basis: 83.33333%;
    max-width: 83.33333%; }

  .shqSite-col-md--11of12 {
    flex-basis: 91.66667%;
    max-width: 91.66667%; }

  .shqSite-col-md--12of12 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-offset-md--1 {
    margin-left: 8.33333%; }

  .shqSite-col-offset-md--2 {
    margin-left: 16.66667%; }

  .shqSite-col-offset-md--3 {
    margin-left: 25%; }

  .shqSite-col-offset-md--4 {
    margin-left: 33.33333%; }

  .shqSite-col-offset-md--5 {
    margin-left: 41.66667%; }

  .shqSite-col-offset-md--6 {
    margin-left: 50%; }

  .shqSite-col-offset-md--7 {
    margin-left: 58.33333%; }

  .shqSite-col-offset-md--8 {
    margin-left: 66.66667%; }

  .shqSite-col-offset-md--9 {
    margin-left: 75%; }

  .shqSite-col-offset-md--10 {
    margin-left: 83.33333%; }

  .shqSite-col-offset-md--11 {
    margin-left: 91.66667%; }

  .shqSite-col-offset-md--12 {
    margin-left: 100%; } }
@media (min-width: 46.8em) and (max-width: 62.5em) {
  .shqSite-col-lg--1of1 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-lg--1of2 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-lg--2of2 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-lg--1of3 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .shqSite-col-lg--2of3 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .shqSite-col-lg--3of3 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-lg--1of4 {
    flex-basis: 25%;
    max-width: 25%; }

  .shqSite-col-lg--2of4 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-lg--3of4 {
    flex-basis: 75%;
    max-width: 75%; }

  .shqSite-col-lg--4of4 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-lg--1of5 {
    flex-basis: 20%;
    max-width: 20%; }

  .shqSite-col-lg--2of5 {
    flex-basis: 40%;
    max-width: 40%; }

  .shqSite-col-lg--3of5 {
    flex-basis: 60%;
    max-width: 60%; }

  .shqSite-col-lg--4of5 {
    flex-basis: 80%;
    max-width: 80%; }

  .shqSite-col-lg--5of5 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-lg--1of6 {
    flex-basis: 16.66667%;
    max-width: 16.66667%; }

  .shqSite-col-lg--2of6 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .shqSite-col-lg--3of6 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-lg--4of6 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .shqSite-col-lg--5of6 {
    flex-basis: 83.33333%;
    max-width: 83.33333%; }

  .shqSite-col-lg--6of6 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-lg--1of7 {
    flex-basis: 14.28571%;
    max-width: 14.28571%; }

  .shqSite-col-lg--2of7 {
    flex-basis: 28.57143%;
    max-width: 28.57143%; }

  .shqSite-col-lg--3of7 {
    flex-basis: 42.85714%;
    max-width: 42.85714%; }

  .shqSite-col-lg--4of7 {
    flex-basis: 57.14286%;
    max-width: 57.14286%; }

  .shqSite-col-lg--5of7 {
    flex-basis: 71.42857%;
    max-width: 71.42857%; }

  .shqSite-col-lg--6of7 {
    flex-basis: 85.71429%;
    max-width: 85.71429%; }

  .shqSite-col-lg--7of7 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-lg--1of8 {
    flex-basis: 12.5%;
    max-width: 12.5%; }

  .shqSite-col-lg--2of8 {
    flex-basis: 25%;
    max-width: 25%; }

  .shqSite-col-lg--3of8 {
    flex-basis: 37.5%;
    max-width: 37.5%; }

  .shqSite-col-lg--4of8 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-lg--5of8 {
    flex-basis: 62.5%;
    max-width: 62.5%; }

  .shqSite-col-lg--6of8 {
    flex-basis: 75%;
    max-width: 75%; }

  .shqSite-col-lg--7of8 {
    flex-basis: 87.5%;
    max-width: 87.5%; }

  .shqSite-col-lg--8of8 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-lg--1of9 {
    flex-basis: 11.11111%;
    max-width: 11.11111%; }

  .shqSite-col-lg--2of9 {
    flex-basis: 22.22222%;
    max-width: 22.22222%; }

  .shqSite-col-lg--3of9 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .shqSite-col-lg--4of9 {
    flex-basis: 44.44444%;
    max-width: 44.44444%; }

  .shqSite-col-lg--5of9 {
    flex-basis: 55.55556%;
    max-width: 55.55556%; }

  .shqSite-col-lg--6of9 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .shqSite-col-lg--7of9 {
    flex-basis: 77.77778%;
    max-width: 77.77778%; }

  .shqSite-col-lg--8of9 {
    flex-basis: 88.88889%;
    max-width: 88.88889%; }

  .shqSite-col-lg--9of9 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-lg--1of10 {
    flex-basis: 10%;
    max-width: 10%; }

  .shqSite-col-lg--2of10 {
    flex-basis: 20%;
    max-width: 20%; }

  .shqSite-col-lg--3of10 {
    flex-basis: 30%;
    max-width: 30%; }

  .shqSite-col-lg--4of10 {
    flex-basis: 40%;
    max-width: 40%; }

  .shqSite-col-lg--5of10 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-lg--6of10 {
    flex-basis: 60%;
    max-width: 60%; }

  .shqSite-col-lg--7of10 {
    flex-basis: 70%;
    max-width: 70%; }

  .shqSite-col-lg--8of10 {
    flex-basis: 80%;
    max-width: 80%; }

  .shqSite-col-lg--9of10 {
    flex-basis: 90%;
    max-width: 90%; }

  .shqSite-col-lg--10of10 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-lg--1of11 {
    flex-basis: 9.09091%;
    max-width: 9.09091%; }

  .shqSite-col-lg--2of11 {
    flex-basis: 18.18182%;
    max-width: 18.18182%; }

  .shqSite-col-lg--3of11 {
    flex-basis: 27.27273%;
    max-width: 27.27273%; }

  .shqSite-col-lg--4of11 {
    flex-basis: 36.36364%;
    max-width: 36.36364%; }

  .shqSite-col-lg--5of11 {
    flex-basis: 45.45455%;
    max-width: 45.45455%; }

  .shqSite-col-lg--6of11 {
    flex-basis: 54.54545%;
    max-width: 54.54545%; }

  .shqSite-col-lg--7of11 {
    flex-basis: 63.63636%;
    max-width: 63.63636%; }

  .shqSite-col-lg--8of11 {
    flex-basis: 72.72727%;
    max-width: 72.72727%; }

  .shqSite-col-lg--9of11 {
    flex-basis: 81.81818%;
    max-width: 81.81818%; }

  .shqSite-col-lg--10of11 {
    flex-basis: 90.90909%;
    max-width: 90.90909%; }

  .shqSite-col-lg--11of11 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-lg--1of12 {
    flex-basis: 8.33333%;
    max-width: 8.33333%; }

  .shqSite-col-lg--2of12 {
    flex-basis: 16.66667%;
    max-width: 16.66667%; }

  .shqSite-col-lg--3of12 {
    flex-basis: 25%;
    max-width: 25%; }

  .shqSite-col-lg--4of12 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .shqSite-col-lg--5of12 {
    flex-basis: 41.66667%;
    max-width: 41.66667%; }

  .shqSite-col-lg--6of12 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-lg--7of12 {
    flex-basis: 58.33333%;
    max-width: 58.33333%; }

  .shqSite-col-lg--8of12 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .shqSite-col-lg--9of12 {
    flex-basis: 75%;
    max-width: 75%; }

  .shqSite-col-lg--10of12 {
    flex-basis: 83.33333%;
    max-width: 83.33333%; }

  .shqSite-col-lg--11of12 {
    flex-basis: 91.66667%;
    max-width: 91.66667%; }

  .shqSite-col-lg--12of12 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-offset-lg--1 {
    margin-left: 8.33333%; }

  .shqSite-col-offset-lg--2 {
    margin-left: 16.66667%; }

  .shqSite-col-offset-lg--3 {
    margin-left: 25%; }

  .shqSite-col-offset-lg--4 {
    margin-left: 33.33333%; }

  .shqSite-col-offset-lg--5 {
    margin-left: 41.66667%; }

  .shqSite-col-offset-lg--6 {
    margin-left: 50%; }

  .shqSite-col-offset-lg--7 {
    margin-left: 58.33333%; }

  .shqSite-col-offset-lg--8 {
    margin-left: 66.66667%; }

  .shqSite-col-offset-lg--9 {
    margin-left: 75%; }

  .shqSite-col-offset-lg--10 {
    margin-left: 83.33333%; }

  .shqSite-col-offset-lg--11 {
    margin-left: 91.66667%; }

  .shqSite-col-offset-lg--12 {
    margin-left: 100%; } }
@media (min-width: 62.5em) {
  .shqSite-col-xl--1of1 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-xl--1of2 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-xl--2of2 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-xl--1of3 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .shqSite-col-xl--2of3 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .shqSite-col-xl--3of3 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-xl--1of4 {
    flex-basis: 25%;
    max-width: 25%; }

  .shqSite-col-xl--2of4 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-xl--3of4 {
    flex-basis: 75%;
    max-width: 75%; }

  .shqSite-col-xl--4of4 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-xl--1of5 {
    flex-basis: 20%;
    max-width: 20%; }

  .shqSite-col-xl--2of5 {
    flex-basis: 40%;
    max-width: 40%; }

  .shqSite-col-xl--3of5 {
    flex-basis: 60%;
    max-width: 60%; }

  .shqSite-col-xl--4of5 {
    flex-basis: 80%;
    max-width: 80%; }

  .shqSite-col-xl--5of5 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-xl--1of6 {
    flex-basis: 16.66667%;
    max-width: 16.66667%; }

  .shqSite-col-xl--2of6 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .shqSite-col-xl--3of6 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-xl--4of6 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .shqSite-col-xl--5of6 {
    flex-basis: 83.33333%;
    max-width: 83.33333%; }

  .shqSite-col-xl--6of6 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-xl--1of7 {
    flex-basis: 14.28571%;
    max-width: 14.28571%; }

  .shqSite-col-xl--2of7 {
    flex-basis: 28.57143%;
    max-width: 28.57143%; }

  .shqSite-col-xl--3of7 {
    flex-basis: 42.85714%;
    max-width: 42.85714%; }

  .shqSite-col-xl--4of7 {
    flex-basis: 57.14286%;
    max-width: 57.14286%; }

  .shqSite-col-xl--5of7 {
    flex-basis: 71.42857%;
    max-width: 71.42857%; }

  .shqSite-col-xl--6of7 {
    flex-basis: 85.71429%;
    max-width: 85.71429%; }

  .shqSite-col-xl--7of7 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-xl--1of8 {
    flex-basis: 12.5%;
    max-width: 12.5%; }

  .shqSite-col-xl--2of8 {
    flex-basis: 25%;
    max-width: 25%; }

  .shqSite-col-xl--3of8 {
    flex-basis: 37.5%;
    max-width: 37.5%; }

  .shqSite-col-xl--4of8 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-xl--5of8 {
    flex-basis: 62.5%;
    max-width: 62.5%; }

  .shqSite-col-xl--6of8 {
    flex-basis: 75%;
    max-width: 75%; }

  .shqSite-col-xl--7of8 {
    flex-basis: 87.5%;
    max-width: 87.5%; }

  .shqSite-col-xl--8of8 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-xl--1of9 {
    flex-basis: 11.11111%;
    max-width: 11.11111%; }

  .shqSite-col-xl--2of9 {
    flex-basis: 22.22222%;
    max-width: 22.22222%; }

  .shqSite-col-xl--3of9 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .shqSite-col-xl--4of9 {
    flex-basis: 44.44444%;
    max-width: 44.44444%; }

  .shqSite-col-xl--5of9 {
    flex-basis: 55.55556%;
    max-width: 55.55556%; }

  .shqSite-col-xl--6of9 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .shqSite-col-xl--7of9 {
    flex-basis: 77.77778%;
    max-width: 77.77778%; }

  .shqSite-col-xl--8of9 {
    flex-basis: 88.88889%;
    max-width: 88.88889%; }

  .shqSite-col-xl--9of9 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-xl--1of10 {
    flex-basis: 10%;
    max-width: 10%; }

  .shqSite-col-xl--2of10 {
    flex-basis: 20%;
    max-width: 20%; }

  .shqSite-col-xl--3of10 {
    flex-basis: 30%;
    max-width: 30%; }

  .shqSite-col-xl--4of10 {
    flex-basis: 40%;
    max-width: 40%; }

  .shqSite-col-xl--5of10 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-xl--6of10 {
    flex-basis: 60%;
    max-width: 60%; }

  .shqSite-col-xl--7of10 {
    flex-basis: 70%;
    max-width: 70%; }

  .shqSite-col-xl--8of10 {
    flex-basis: 80%;
    max-width: 80%; }

  .shqSite-col-xl--9of10 {
    flex-basis: 90%;
    max-width: 90%; }

  .shqSite-col-xl--10of10 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-xl--1of11 {
    flex-basis: 9.09091%;
    max-width: 9.09091%; }

  .shqSite-col-xl--2of11 {
    flex-basis: 18.18182%;
    max-width: 18.18182%; }

  .shqSite-col-xl--3of11 {
    flex-basis: 27.27273%;
    max-width: 27.27273%; }

  .shqSite-col-xl--4of11 {
    flex-basis: 36.36364%;
    max-width: 36.36364%; }

  .shqSite-col-xl--5of11 {
    flex-basis: 45.45455%;
    max-width: 45.45455%; }

  .shqSite-col-xl--6of11 {
    flex-basis: 54.54545%;
    max-width: 54.54545%; }

  .shqSite-col-xl--7of11 {
    flex-basis: 63.63636%;
    max-width: 63.63636%; }

  .shqSite-col-xl--8of11 {
    flex-basis: 72.72727%;
    max-width: 72.72727%; }

  .shqSite-col-xl--9of11 {
    flex-basis: 81.81818%;
    max-width: 81.81818%; }

  .shqSite-col-xl--10of11 {
    flex-basis: 90.90909%;
    max-width: 90.90909%; }

  .shqSite-col-xl--11of11 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-xl--1of12 {
    flex-basis: 8.33333%;
    max-width: 8.33333%; }

  .shqSite-col-xl--2of12 {
    flex-basis: 16.66667%;
    max-width: 16.66667%; }

  .shqSite-col-xl--3of12 {
    flex-basis: 25%;
    max-width: 25%; }

  .shqSite-col-xl--4of12 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .shqSite-col-xl--5of12 {
    flex-basis: 41.66667%;
    max-width: 41.66667%; }

  .shqSite-col-xl--6of12 {
    flex-basis: 50%;
    max-width: 50%; }

  .shqSite-col-xl--7of12 {
    flex-basis: 58.33333%;
    max-width: 58.33333%; }

  .shqSite-col-xl--8of12 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .shqSite-col-xl--9of12 {
    flex-basis: 75%;
    max-width: 75%; }

  .shqSite-col-xl--10of12 {
    flex-basis: 83.33333%;
    max-width: 83.33333%; }

  .shqSite-col-xl--11of12 {
    flex-basis: 91.66667%;
    max-width: 91.66667%; }

  .shqSite-col-xl--12of12 {
    flex-basis: 100%;
    max-width: 100%; }

  .shqSite-col-offset-xl--1 {
    margin-left: 8.33333%; }

  .shqSite-col-offset-xl--2 {
    margin-left: 16.66667%; }

  .shqSite-col-offset-xl--3 {
    margin-left: 25%; }

  .shqSite-col-offset-xl--4 {
    margin-left: 33.33333%; }

  .shqSite-col-offset-xl--5 {
    margin-left: 41.66667%; }

  .shqSite-col-offset-xl--6 {
    margin-left: 50%; }

  .shqSite-col-offset-xl--7 {
    margin-left: 58.33333%; }

  .shqSite-col-offset-xl--8 {
    margin-left: 66.66667%; }

  .shqSite-col-offset-xl--9 {
    margin-left: 75%; }

  .shqSite-col-offset-xl--10 {
    margin-left: 83.33333%; }

  .shqSite-col-offset-xl--11 {
    margin-left: 91.66667%; }

  .shqSite-col-offset-xl--12 {
    margin-left: 100%; } }
.shqSite-hide {
  display: none !important; }

@media (max-width: 25.875em) {
  .shqSite-hide-sm {
    display: none !important; } }

@media (min-width: 25.875em) and (max-width: 46.8em) {
  .shqSite-hide-md {
    display: none !important; } }

@media (min-width: 46.8em) and (max-width: 62.5em) {
  .shqSite-hide-lg {
    display: none !important; } }

@media (min-width: 62.5em) {
  .shqSite-hide-xl {
    display: none !important; } }

.shqSite-show {
  display: flex !important; }

@media (max-width: 25.875em) {
  .shqSite-show-sm {
    display: flex !important; } }

@media (min-width: 25.875em) and (max-width: 46.8em) {
  .shqSite-show-md {
    display: flex !important; } }

@media (min-width: 46.8em) and (max-width: 62.5em) {
  .shqSite-show-lg {
    display: flex !important; } }

@media (min-width: 62.5em) {
  .shqSite-show-xl {
    display: flex !important; } }

.shqSite-show-block {
  display: block; }

@media (max-width: 25.875em) {
  .shqSite-show-sm-block {
    display: block !important; } }

@media (min-width: 25.875em) and (max-width: 46.8em) {
  .shqSite-show-md-block {
    display: block !important; } }

@media (min-width: 46.8em) and (max-width: 62.5em) {
  .shqSite-show-lg-block {
    display: block !important; } }

@media (min-width: 62.5em) {
  .shqSite-show-xl-block {
    display: block !important; } }

html {
  font-family: stolzl, sans-serif;
  font-size: 100%;
  color: #2F2149;
  font-weight: 400;
  line-height: normal;
  letter-spacing: normal;
  word-spacing: normal;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  -webkit-tap-highlight-color: transparent; }
  @media (max-width: 25.875em) {
    html {
      font-size: 75%; } }

body {
  font-size: 0.75rem; }

.page-container {
  overflow: hidden; }

/* Components
----------------------*/
.shqSite-btn {
  position: relative;
  display: inline-block;
  cursor: pointer;
  user-select: none;
  padding: 0 1rem 0 1rem;
  font-family: stolzl, sans-serif;
  font-size: 0.75rem;
  font-weight: 500;
  color: #FFF;
  text-decoration: none;
  text-align: center;
  line-height: 2.25rem;
  background: #8762DB;
  border-radius: 0.25rem;
  box-shadow: rgba(0, 0, 0, 0.05) 0 2px 3px, rgba(0, 0, 0, 0.075) 0 1px 2px;
  outline: none;
  -webkit-transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1);
  -moz-transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1);
  transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1); }
  .shqSite-btn:hover {
    color: #FFF;
    text-decoration: none;
    box-shadow: rgba(0, 0, 0, 0.1) 0 5px 10px, rgba(0, 0, 0, 0.1) 0 1px 3px; }
  .shqSite-btn:active {
    box-shadow: rgba(0, 0, 0, 0.05) 0 2px 3px, rgba(0, 0, 0, 0.075) 0 1px 2px; }
  .shqSite-btn:disabled {
    opacity: 0.35;
    pointer-events: none; }
  .shqSite-btn.active {
    color: #00bce3;
    text-decoration: none;
    box-shadow: none; }
  .shqSite-btn + .shqSite-btn {
    margin-left: 0.25rem; }
  .shqSite-btn + .shqSite-btn-group {
    margin-left: 0.25rem; }
  .shqSite-btn--brand {
    color: #FFF;
    font-weight: 500;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
    background: #8762DB;
    background-color: #8762DB;
    background-image: -webkit-linear-gradient(#8762db, #7548dc);
    background-image: linear-gradient(#8762db, #7548dc);
    box-shadow: rgba(135, 98, 219, 0.85) 0 5px 15px -4px, rgba(0, 0, 0, 0.25) 0 5px 10px -4px;
    mix-blend-mode: multiply; }
    .shqSite-btn--brand:after {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background-color: transparent;
      background-image: -webkit-linear-gradient(rgba(135, 98, 219, 0.1), transparent);
      background-image: linear-gradient(rgba(135, 98, 219, 0.1), transparent);
      opacity: 0;
      -webkit-transition: opacity 0.1s cubic-bezier(0.4, 0, 0.2, 1);
      -moz-transition: opacity 0.1s cubic-bezier(0.4, 0, 0.2, 1);
      transition: opacity 0.1s cubic-bezier(0.4, 0, 0.2, 1);
      mix-blend-mode: color-dodge; }
    .shqSite-btn--brand:hover {
      color: #FFF;
      background: #8762DB;
      background-color: #8762DB;
      background-image: -webkit-linear-gradient(#8762db, #7548dc);
      background-image: linear-gradient(#8762db, #7548dc);
      box-shadow: rgba(135, 98, 219, 0.85) 0 7px 25px -6px, rgba(0, 0, 0, 0.35) 0 7px 17px -6px; }
      .shqSite-btn--brand:hover:after {
        opacity: 1; }
    .shqSite-btn--brand:active {
      color: #FFF;
      background: #8762DB;
      background-color: #8762DB;
      background-image: -webkit-linear-gradient(#8762db, #7548dc);
      background-image: linear-gradient(#8762db, #7548dc);
      box-shadow: rgba(135, 98, 219, 0.75) 0 0 10px 0; }
      .shqSite-btn--brand:active:after {
        opacity: 0; }
  .shqSite-btn--primary {
    color: #FFF;
    font-weight: 400;
    background-color: #8762DB;
    background-color: #00BCE3;
    background-image: -webkit-linear-gradient(#00bce3, #00a7ca);
    background-image: linear-gradient(#00bce3, #00a7ca);
    border-color: transparent;
    box-shadow: rgba(0, 0, 0, 0.05) 0 2px 3px, rgba(0, 0, 0, 0.075) 0 1px 2px; }
    .shqSite-btn--primary:after {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      opacity: 0.5;
      -webkit-transition: opacity 0.2s ease;
      -moz-transition: opacity 0.2s ease;
      transition: opacity 0.2s ease;
      mix-blend-mode: color-dodge; }
    .shqSite-btn--primary:hover {
      color: #FFF;
      text-decoration: none;
      box-shadow: rgba(0, 0, 0, 0.1) 0 5px 10px, rgba(0, 0, 0, 0.1) 0 1px 3px; }
      .shqSite-btn--primary:hover:after {
        opacity: 1; }
    .shqSite-btn--primary.delete {
      background-color: #ff6b6b;
      background-color: #ff6b6b;
      background-image: -webkit-linear-gradient(-405deg, #ff5252, #ff6b6b);
      background-image: linear-gradient(135deg,#ff5252, #ff6b6b); }
      .shqSite-btn--primary.delete:hover {
        background-color: #ff6b6b;
        background-image: -webkit-linear-gradient(-405deg, #ff3838, #ff6b6b);
        background-image: linear-gradient(135deg,#ff3838, #ff6b6b); }
      .shqSite-btn--primary.delete:active {
        background-color: #ff6b6b;
        background-image: -webkit-linear-gradient(-405deg, #ff5252, #ff6b6b);
        background-image: linear-gradient(135deg,#ff5252, #ff6b6b);
        box-shadow: rgba(255, 107, 107, 0.35) 0 0 4px 2px; }
  .shqSite-btn--primary-inverse {
    color: #00BCE3;
    background-color: #FFF;
    background: #FFF;
    background-image: none; }
    .shqSite-btn--primary-inverse:hover {
      color: #00BCE3;
      background-color: #FFF;
      border-color: transparent; }
  .shqSite-btn--secondary {
    color: #5b6770;
    font-weight: 400;
    border: 1px solid #e3e5e6;
    background-color: rgba(0, 0, 0, 0.025);
    box-shadow: none; }
    .shqSite-btn--secondary:hover {
      color: #00BCE3;
      border-color: rgba(0, 188, 227, 0.1);
      background-color: rgba(0, 188, 227, 0.05);
      box-shadow: none; }
    .shqSite-btn--secondary:active {
      box-shadow: rgba(0, 0, 0, 0.05) 0 1px 2px inset; }
  .shqSite-btn--tertiary {
    font-weight: 300;
    color: #5b6770;
    border: 1px solid transparent;
    background-color: transparent; }
    .shqSite-btn--tertiary:hover {
      color: #00BCE3;
      background: transparent;
      border-color: transparent;
      box-shadow: none; }
  .shqSite-btn--tertiary-inverse {
    font-weight: 300;
    color: rgba(255, 255, 255, 0.85);
    border: 1px solid transparent;
    background-color: transparent; }
    .shqSite-btn--tertiary-inverse:hover {
      color: #FFF;
      background: transparent;
      border-color: transparent;
      box-shadow: none; }
  .shqSite-btn--link {
    padding: 0;
    font-weight: 500;
    color: #5E65DE;
    line-height: 0.75rem;
    border: none;
    background: transparent;
    box-shadow: none; }
    .shqSite-btn--link:hover {
      color: #5E65DE;
      background: transparent;
      border-color: transparent;
      box-shadow: none;
      border-bottom: 1px solid #5E65DE; }
  .shqSite-btn--icon {
    padding: 0.5rem;
    color: #5b6770;
    line-height: normal;
    border: 1px solid transparent;
    background-color: transparent; }
    .shqSite-btn--icon:hover {
      color: #00BCE3;
      text-decoration: underline;
      background: rgba(0, 188, 227, 0.1);
      border-color: rgba(0, 188, 227, 0.1); }
    .shqSite-btn--icon.small {
      padding: 0.25rem; }
  .shqSite-btn--delete:hover {
    color: #ff6b6b;
    background-color: rgba(255, 107, 107, 0.1);
    border-color: rgba(255, 107, 107, 0.2); }
  .shqSite-btn--delete:active {
    box-shadow: rgba(255, 107, 107, 0.1) 0 0 4px 2px; }
  .shqSite-btn--block {
    width: 100%; }
  .shqSite-btn__icon {
    display: inline-block;
    height: 0.75rem;
    width: 0.75rem;
    fill: currentColor;
    vertical-align: middle; }
    .shqSite-btn__icon--left {
      margin-right: 0.3rem; }
    .shqSite-btn__icon--right {
      margin-left: 0.3rem; }

.shqSite-btn-group {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex; }
  .shqSite-btn-group .shqSite-btn {
    border-radius: 0; }
    .shqSite-btn-group .shqSite-btn:first-child {
      border-top-left-radius: 0.15rem;
      border-bottom-left-radius: 0.15rem; }
    .shqSite-btn-group .shqSite-btn + .shqSite-btn {
      border-radius: 0;
      border-left: 0; }
    .shqSite-btn-group .shqSite-btn:last-child {
      border-top-right-radius: 0.25rem;
      border-bottom-right-radius: 0.25rem; }
  .shqSite-btn-group + .shqSite-btn {
    margin-left: 0.25rem; }

.shqSite-tabs {
  display: block; }
  .shqSite-tabs__item {
    display: block;
    padding: 1rem;
    border: none;
    border-radius: 0.15rem;
    -webkit-transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1);
    -moz-transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1);
    transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1); }
    .shqSite-tabs__item:hover {
      background: rgba(0, 188, 227, 0.05); }
    .shqSite-tabs__item .shqSite-text-subtitle {
      color: #5b6770;
      margin: 0 0 0.5rem 0; }

.shqSite-flag {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -moz-box-align: start;
  box-align: start;
  -webkit-align-items: start;
  -moz-align-items: start;
  -ms-align-items: start;
  -o-align-items: start;
  align-items: start;
  -ms-flex-align: start; }
  .shqSite-flag__image {
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    flex-shrink: 0;
    -ms-flex-negative: 0;
    background-size: cover;
    margin-right: 1rem; }
    .shqSite-flag__image--right {
      padding-right: 0;
      padding-left: 1rem; }
    .shqSite-flag__image--circle {
      height: 50px;
      width: 50px;
      border-radius: 50%;
      overflow: hidden; }
  .shqSite-flag__body {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    box-flex: 1;
    -webkit-flex: 1;
    -moz-flex: 1;
    -ms-flex: 1;
    flex: 1; }
  .shqSite-flag__controls {
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    flex-shrink: 0;
    -ms-flex-negative: 0;
    padding-left: 1rem;
    text-align: right; }
  .shqSite-flag--center {
    -webkit-box-align: center;
    -moz-box-align: center;
    box-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;
    -ms-flex-align: center; }
  .shqSite-flag--bottom {
    -webkit-box-align: end;
    -moz-box-align: end;
    box-align: end;
    -webkit-align-items: end;
    -moz-align-items: end;
    -ms-align-items: end;
    -o-align-items: end;
    align-items: end;
    -ms-flex-align: end; }

.shqSite-card-grid {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  box-lines: multiple;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  box-pack: start;
  -webkit-justify-content: start;
  -moz-justify-content: start;
  -ms-justify-content: start;
  -o-justify-content: start;
  justify-content: start;
  -ms-flex-pack: start;
  width: calc(100% + 1rem); }

.shqSite-card {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-direction: normal;
  box-direction: normal;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  flex-direction: column;
  -ms-flex-direction: column;
  width: 100%;
  color: #333f48;
  background: #FFF;
  border-radius: 0.25rem;
  box-shadow: rgba(55, 45, 131, 0.2) 0 15px 35px -5px;
  -webkit-transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1);
  -moz-transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1);
  transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1); }
  .shqSite-card-grid .shqSite-card {
    margin: 0 1rem 1rem 0; }
    @media (min-width: 40rem) {
      .shqSite-card-grid .shqSite-card {
        width: calc(50% - 1rem); } }
    @media (min-width: 60rem) {
      .shqSite-card-grid .shqSite-card {
        width: calc(33.333% - 1rem); } }
    @media (min-width: 75rem) {
      .shqSite-card-grid .shqSite-card {
        width: calc(25% - 1rem); } }
    @media (min-width: 95rem) {
      .shqSite-card-grid .shqSite-card {
        width: calc(20% - 1rem); } }
  .shqSite-card-list .shqSite-card {
    margin: 0 0 1.5rem 0; }
  .shqSite-card .shqSite-card {
    border: 1px solid rgba(0, 0, 0, 0.1); }
  .shqSite-card__header {
    width: 100%;
    padding: 0.5rem 1rem;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
  .shqSite-card__media {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 100%;
    min-height: 200px;
    text-align: center;
    background-size: cover;
    background-position: center;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
    .shqSite-card__media:nth-last-child(2) {
      border-bottom: none; }
    .shqSite-card__media--fixed-height {
      -webkit-box-pack: start;
      -moz-box-pack: start;
      box-pack: start;
      -webkit-justify-content: flex-start;
      -moz-justify-content: flex-start;
      -ms-justify-content: flex-start;
      -o-justify-content: flex-start;
      justify-content: flex-start;
      -ms-flex-pack: start;
      height: 20rem;
      overflow-y: auto; }
  .shqSite-card__content {
    width: 100%;
    padding: 1rem; }
  .shqSite-card__title {
    display: flex;
    flex: 1 1 0%;
    flex-direction: column;
    min-width: 0; }
  .shqSite-card__actions {
    -webkit-box-flex: none;
    -moz-box-flex: none;
    box-flex: none;
    -webkit-flex: none;
    -moz-flex: none;
    -ms-flex: none;
    flex: none; }
  .shqSite-card__footer {
    padding: 0.5rem 1rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1); }
  .shqSite-card.has-error {
    border: 2px solid #ff6b6b;
    border-radius: 0.25rem;
    box-shadow: rgba(255, 107, 107, 0.75) 0 0 50px -10px, rgba(0, 0, 0, 0.1) 0 15px 30px, rgba(0, 0, 0, 0.1) 0 9px 18px -3px; }
    .shqSite-card.has-error > .shqSite-card__header {
      color: #ff6b6b;
      border-radius: 0; }
  .shqSite-card.has-warning {
    border: 2px solid #FFBE58;
    border-radius: 0.25rem;
    box-shadow: rgba(255, 190, 88, 0.75) 0 0 50px -10px, rgba(0, 0, 0, 0.1) 0 15px 30px, rgba(0, 0, 0, 0.1) 0 9px 18px -3px; }
    .shqSite-card.has-warning > .shqSite-card__header {
      color: #FFBE58;
      border-radius: 0; }
  .shqSite-card.to-be-edited .shqSite-card__content {
    display: none; }
  .shqSite-card.is-editing {
    border: 2px solid #00BCE3;
    border-radius: 0.25rem;
    box-shadow: rgba(0, 188, 227, 0.75) 0 0 50px -10px, rgba(0, 0, 0, 0.1) 0 15px 30px, rgba(0, 0, 0, 0.1) 0 9px 18px -3px; }
    .shqSite-card.is-editing > .shqSite-card__header {
      color: #FFF;
      background: #00BCE3;
      border-radius: 0; }
  .shqSite-card.is-locked .shqSite-card__content {
    opacity: 0.35;
    pointer-events: none; }
  .shqSite-card.is-defocused {
    opacity: 0.5;
    pointer-events: none; }
  .shqSite-card--fixed-width {
    width: 300px; }
  .shqSite-card--padded {
    padding: 3rem; }

.shqSite-list {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 0.75rem; }
  .shqSite-list__header {
    padding: 0.5rem 1.5rem; }
    .shqSite-list__header-controls {
      margin-right: -1.5rem; }
  .shqSite-list__item {
    position: relative;
    z-index: 0;
    -webkit-transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1);
    -moz-transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1);
    transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1); }
    .shqSite-list__item a {
      color: #2F2149;
      border-bottom: none; }
      .shqSite-list__item a:hover {
        color: #00BCE3; }
  .shqSite-list__item-selection {
    visibility: hidden;
    width: 2rem; }
    .shqSite-list__item-selection a {
      display: block; }
  .shqSite-list__item-checkbox {
    width: 2rem;
    margin-right: 1rem; }
  .shqSite-list--selection .shqSite-list__item {
    margin: 0 0 0.25rem 0;
    color: #333f48;
    border: 2px solid transparent;
    border-radius: 0.15rem; }
    .shqSite-list--selection .shqSite-list__item a {
      display: block;
      padding: 0.5rem;
      color: inherit; }
    .shqSite-list--selection .shqSite-list__item:hover {
      background: rgba(0, 188, 227, 0.1); }
    .shqSite-list--selection .shqSite-list__item:active {
      background: rgba(0, 188, 227, 0.15); }
    .shqSite-list--selection .shqSite-list__item.selected {
      color: #00BCE3;
      border-color: #00BCE3; }
      .shqSite-list--selection .shqSite-list__item.selected .shq-list__item-selection {
        visibility: visible; }
  .shqSite-list--divided .shqSite-list__item {
    padding: 0.5rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1); }
    .shqSite-list--divided .shqSite-list__item:first-child {
      border-top-color: transparent; }
  .shqSite-list--cards .shqSite-list__item {
    padding: 1rem;
    margin: 0 0 0.5rem 0;
    background: #FFF;
    border: 2px solid transparent;
    border-radius: 0.15rem;
    box-shadow: rgba(0, 0, 0, 0.05) 0 2px 3px, rgba(0, 0, 0, 0.075) 0 1px 2px;
    -webkit-transition-duration: 0.1s;
    -moz-transition-duration: 0.1s;
    transition-duration: 0.1s; }
    .shqSite-list--cards .shqSite-list__item:hover {
      z-index: 1;
      box-shadow: rgba(0, 0, 0, 0.1) 0 5px 10px, rgba(0, 0, 0, 0.1) 0 1px 3px;
      -webkit-transform: scale(1.01);
      -moz-transform: scale(1.01);
      -ms-transform: scale(1.01);
      -o-transform: scale(1.01);
      transform: scale(1.01); }
    .shqSite-list--cards .shqSite-list__item.dragging {
      box-shadow: rgba(0, 0, 0, 0.1) 0 10px 20px, rgba(0, 0, 0, 0.1) 0 3px 9px -1px; }
    .shqSite-list--cards .shqSite-list__item.selected {
      border-color: #00BCE3;
      box-shadow: rgba(0, 0, 0, 0.05) 0 2px 3px, rgba(0, 0, 0, 0.075) 0 1px 2px; }
  .shqSite-list--fixed-header {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    .shqSite-list--fixed-header .shqSite-list__header {
      position: relative;
      height: 2.5rem;
      margin: 0 1.5rem;
      border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
    .shqSite-list--fixed-header .shqSite-list__content {
      position: absolute;
      top: 2.5rem;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 1rem 1.5rem;
      overflow-y: auto;
      overflow-x: hidden; }

.shqSite-sort-by {
  position: relative;
  color: #5b6770; }
  .shqSite-sort-by:hover {
    color: #333f48; }
  .shqSite-sort-by--ascending {
    color: #333f48; }
    .shqSite-sort-by--ascending:after {
      content: "▲";
      display: inline-block;
      margin-left: 0.25rem;
      color: #5b6770;
      pointer-events: none; }
  .shqSite-sort-by--descending {
    color: #333f48; }
    .shqSite-sort-by--descending:after {
      content: "▼";
      display: inline-block;
      margin-left: 0.25rem;
      color: #5b6770;
      pointer-events: none; }

.shqSite-laptop-mockup {
  position: absolute; }

.shqSite-ipad-mockup {
  z-index: 1;
  position: absolute;
  perspective: 1000px; }
  .shqSite-ipad-mockup .device {
    z-index: 1;
    position: relative;
    height: 21rem;
    width: 31rem;
    background: #FFF;
    background-size: cover;
    background-position: center top;
    border-radius: 1rem;
    border-top: 1rem solid #FFF;
    border-bottom: 1rem solid #FFF;
    border-left: 2rem solid #FFF;
    border-right: 2rem solid #FFF;
    box-shadow: rgba(55, 45, 131, 0.45) 0 0 3px inset, rgba(0, 0, 0, 0.075) 0 5px 15px;
    transform: rotate3d(1, 1, 1, 10deg); }
    .shqSite-ipad-mockup .device:before {
      content: "";
      z-index: 1;
      position: absolute;
      top: -1rem;
      bottom: -1rem;
      left: -2rem;
      right: -2rem;
      border-radius: 1rem;
      box-shadow: rgba(55, 45, 131, 0.4) 0 -2px 7px inset; }
    .shqSite-ipad-mockup .device .button {
      z-index: 1;
      position: absolute;
      top: calc(50% - 0.5rem);
      right: -1.5rem;
      height: 1.25rem;
      width: 1.25rem;
      border: 1px solid rgba(135, 98, 219, 0.25);
      border-radius: 50%; }
  .shqSite-ipad-mockup:after {
    z-index: -1;
    content: "";
    position: absolute;
    top: 1rem;
    left: 0;
    height: 21rem;
    width: 31rem;
    background-color: #997adb;
    background-image: -webkit-linear-gradient(top, #997adb, #372d83);
    background-image: linear-gradient(to bottom,#997adb, #372d83);
    -webkit-filter: blur(20px);
    filter: blur(20px);
    opacity: 0.2;
    transform: rotate3d(1, 1, 1, 10deg); }
  .shqSite-ipad-mockup--purple .device {
    background: #997adb;
    border-color: #997adb;
    background-size: contain;
    background-position: center top; }
    .shqSite-ipad-mockup--purple .device .button {
      border-color: rgba(104, 91, 199, 0.5); }
  .shqSite-ipad-mockup--grid .device {
    transform: rotate3d(0, 0, 1, -10deg); }
  .shqSite-ipad-mockup--grid:after {
    transform: rotate3d(0, 0, 1, -10deg); }

.shqSite-iphone-mockup {
  z-index: 1;
  position: absolute;
  perspective: 1000px; }
  .shqSite-iphone-mockup .device {
    z-index: 1;
    position: relative;
    height: 20rem;
    width: 10rem;
    background: #FFF;
    background-size: contain;
    background-position: center top;
    border-radius: 1rem;
    border-top: 2rem solid #FFF;
    border-bottom: 2rem solid #FFF;
    border-left: 0.5rem solid #FFF;
    border-right: 0.5rem solid #FFF;
    box-shadow: rgba(55, 45, 131, 0.45) 0 0 3px inset, rgba(0, 0, 0, 0.075) 0 5px 15px;
    transform: rotate3d(0, 1, 1, -10deg); }
    .shqSite-iphone-mockup .device:before {
      content: "";
      z-index: 1;
      position: absolute;
      top: -2rem;
      bottom: -2rem;
      left: -0.5rem;
      right: -0.5rem;
      border-radius: 1rem;
      box-shadow: rgba(55, 45, 131, 0.4) 0 -2px 7px inset; }
    .shqSite-iphone-mockup .device .button {
      z-index: 1;
      position: absolute;
      left: calc(50% - 0.5rem);
      bottom: -1.5rem;
      height: 1.25rem;
      width: 1.25rem;
      border: 1px solid rgba(135, 98, 219, 0.25);
      border-radius: 50%; }
  .shqSite-iphone-mockup:after {
    z-index: -1;
    content: "";
    position: absolute;
    top: 1rem;
    left: 0;
    height: 20rem;
    width: 10rem;
    background-color: #997adb;
    background-image: -webkit-linear-gradient(top, #997adb, #372d83);
    background-image: linear-gradient(to bottom,#997adb, #372d83);
    -webkit-filter: blur(20px);
    filter: blur(20px);
    opacity: 0.2;
    transform: rotate3d(0, 1, 1, -10deg); }
  .shqSite-iphone-mockup--purple .device {
    background: #997adb;
    border-color: #997adb;
    background-size: contain;
    background-position: center top; }
    .shqSite-iphone-mockup--purple .device .button {
      border-color: rgba(104, 91, 199, 0.5); }
  .shqSite-iphone-mockup--grid .device {
    transform: rotate3d(0, 0, 1, -100deg); }
  .shqSite-iphone-mockup--grid:after {
    transform: rotate3d(0, 0, 1, -100deg); }
  .shqSite-iphone-mockup--tilt-right .device {
    transform: rotateX(5deg) rotateY(15deg) scale(1.1); }
  .shqSite-iphone-mockup--tilt-right:after {
    transform: rotateX(5deg) rotateY(15deg); }
  .shqSite-iphone-mockup--tilt-left .device {
    transform: rotateX(-5deg) rotateY(-15deg) scale(1.1); }
  .shqSite-iphone-mockup--tilt-left:after {
    transform: rotateX(-5deg) rotateY(-15deg); }

.shqSite-imac-mockup {
  overflow: hidden; }
  .shqSite-imac-mockup__display {
    display: inline-block;
    position: relative;
    background: linear-gradient(#e3e5e6, #ced4da);
    z-index: 100;
    border-radius: 2rem;
    border-top: 0.625rem solid #f1f2f2;
    border-bottom: 6.25rem solid #f1f2f2;
    transform: perspective(2500px) rotateX(-72.5deg);
    transform-origin: 50% 100%;
    transform-style: preserve-3d;
    box-shadow: 0 12.5rem 12.5rem -50px rgba(0, 0, 0, 0.3); }
    .shqSite-imac-mockup__display:before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background: linear-gradient(75deg, transparent 50%, rgba(255, 255, 255, 0.2) 50.5%, transparent 100%); }
    .shqSite-imac-mockup__display .screen {
      background-color: #fff;
      text-align: center;
      border-radius: 2px;
      width: 60rem;
      max-width: 100%;
      height: 33.75rem;
      margin: 2.5rem; }
      .shqSite-imac-mockup__display .screen img {
        height: 33.75rem;
        width: 60rem; }
  .shqSite-imac-mockup__base {
    background-color: #999;
    background: linear-gradient(#e3e5e6 0, #f8f9fa 100%);
    border-bottom: 1px solid #fff;
    width: 15.5rem;
    height: 15.5rem;
    margin: 0 auto;
    position: relative;
    z-index: -1;
    border-radius: 20%;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.5), 0 0 100px rgba(0, 0, 0, 0.2);
    transform: translateY(-9.375rem) rotateX(20deg);
    transform-origin: 50% 100%; }

.shqSite-icon {
  margin: 0 0 1.5rem 0; }
  .shqSite-icon--large {
    height: 4rem;
    width: 4rem; }

/* Layout
----------------------*/
.shqSite-hero {
  z-index: 0;
  display: flex;
  position: relative;
  width: 100%;
  min-height: 47.5rem; }
  @media (max-width: 25.875em) {
    .shqSite-hero {
      min-height: 50rem; } }
  .shqSite-hero__content {
    display: flex;
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
    padding: 7.5rem 0; }
    .shqSite-hero__content h1 {
      margin: 0 0 2rem 0; }
    @media (max-width: 25.875em) {
      .shqSite-hero__content {
        padding: 10rem 0; } }
  .shqSite-hero__news-alert {
    display: inline-block;
    margin: 0 0 2rem 0;
    padding: 0.25rem;
    font-weight: 500;
    color: #2F2149;
    border-radius: 0.25rem;
    border: none; }
    .shqSite-hero__news-alert span {
      display: inline-block;
      margin-right: 0.5rem;
      padding: 0.25rem 0.5rem;
      font-size: 0.625rem;
      font-weight: 500;
      letter-spacing: 0.05rem;
      color: #2F2149;
      text-transform: uppercase;
      background: #0EE8CF;
      border-radius: 0.15rem; }
  .shqSite-hero--customers {
    min-height: 40rem; }
    .shqSite-hero--customers .background {
      position: absolute;
      top: 0;
      height: 300px;
      width: 100%; }
    .shqSite-hero--customers .shqSite-hero__visuals {
      width: 100%;
      display: flex; }
    @media (max-width: 25.875em) {
      .shqSite-hero--customers {
        min-height: 42.5rem; } }
  .shqSite-hero--platform {
    min-height: 40rem; }
    .shqSite-hero--platform .background {
      position: absolute;
      z-index: -1;
      border-radius: 5rem;
      transform: skewY(-5deg);
      top: -5rem;
      right: 0;
      width: 35%;
      height: 30rem;
      background: linear-gradient(90deg, #eee9f8, #FFF); }
    @media (max-width: 25.875em) {
      .shqSite-hero--platform {
        min-height: 42.5rem; } }
  .shqSite-hero--small {
    min-height: 17.5rem; }
    @media (max-width: 25.875em) {
      .shqSite-hero--small {
        min-height: 20rem; } }

.shqSite-header {
  z-index: 1000;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 100%;
  max-width: 1180px;
  padding: 1rem 0;
  background: transparent;
  border-bottom: 1px solid rgba(55, 45, 131, 0.1);
  -webkit-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  -moz-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
  .shqSite-header.scrolling {
    background: #FFF;
    box-shadow: rgba(55, 45, 131, 0.1) 0 15px 45px, rgba(0, 0, 0, 0.075) 0 5px 15px; }
  .shqSite-header__logo {
    border: none; }
  .shqSite-header .login-color {
    display: inline-block;
    padding: 0.5rem;
    font-weight: 500;
    color: #5b6770;
    border: none; }
    .shqSite-header .login-color:hover {
      color: #333f48; }
  .shqSite-header--inverse {
    background: transparent;
    border-bottom: none; }
    .shqSite-header--inverse.scrolling {
      background: #685bc7;
      box-shadow: rgba(55, 45, 131, 0.1) 0 15px 45px, rgba(0, 0, 0, 0.075) 0 5px 15px; }
  .shqSite-header--mobile {
    display: none;
    width: 95%;
    max-width: 95%; }
    .shqSite-header--mobile.scrolling {
      box-shadow: rgba(55, 45, 131, 0.1) 0 2px 5px, rgba(0, 0, 0, 0.075) 0 0 3px; }
    .shqSite-header--mobile .hamburger {
      position: absolute;
      top: 20px;
      right: 20px;
      height: 20px;
      width: 20px;
      border: none; }
      .shqSite-header--mobile .hamburger span {
        display: block;
        height: 2px;
        width: 100%;
        background: #8762DB;
        borde-radius: 0.15rem;
        -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        -moz-transition: -moz-transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
        .shqSite-header--mobile .hamburger span:first-child {
          margin-bottom: 5px; }
        .shqSite-header--mobile .hamburger span:last-child {
          margin-top: 5px; }
      .shqSite-header--mobile .hamburger.close span:first-child {
        transform: rotate(45deg) translate3d(5px, 5px, 0); }
      .shqSite-header--mobile .hamburger.close span:nth-of-type(2) {
        opacity: 0; }
      .shqSite-header--mobile .hamburger.close span:last-child {
        transform: rotate(-45deg) translate3d(5px, -5px, 0); }

.global-footer {
  position: relative;
  z-index: 0;
  margin-top: -6.25rem;
  background-color: #8762DB;
  background-image: -webkit-radial-gradient(#8762DB, #685bc7);
  background-image: radial-gradient(  #8762DB, #685bc7);
  background-size: 200%;
  background-position: center 100%; }
  .global-footer__cta {
    padding: 10rem 0 6.25rem 0; }
    .global-footer__cta h1 {
      display: inline-block;
      margin-right: 1rem;
      line-height: 2.3rem;
      text-align: center; }
  .global-footer__nav {
    padding: 4rem 0;
    color: #FFF;
    border-top: 1px solid rgba(55, 45, 131, 0.2); }
    .global-footer__nav .shqSite-text-subtitle {
      color: #FFF; }

.shqSite-globalnav {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -moz-box-orient: horizontal;
  box-orient: horizontal;
  -webkit-box-direction: normal;
  -moz-box-direction: normal;
  box-direction: normal;
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  flex-direction: row;
  -ms-flex-direction: row;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  box-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center; }
  .shqSite-globalnav__item {
    display: inline-block;
    padding: 0 1rem;
    font-weight: 500;
    color: #5b6770;
    line-height: 40px;
    -webkit-transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1);
    -moz-transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1);
    transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1); }
    .shqSite-globalnav__item a {
      display: block;
      color: inherit;
      border-bottom: none; }
      .shqSite-globalnav__item a:hover {
        color: #333f48; }
  .shqSite-globalnav--inverse {
    -webkit-box-pack: end;
    -moz-box-pack: end;
    box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-justify-content: flex-end;
    -ms-justify-content: flex-end;
    -o-justify-content: flex-end;
    justify-content: flex-end;
    -ms-flex-pack: end; }
    .shqSite-globalnav--inverse a {
      color: #FFF; }
      .shqSite-globalnav--inverse a:hover {
        color: #eee9f8; }

.shqSite-mobileMenu {
  z-index: 500;
  position: fixed;
  top: 0;
  left: 5px;
  right: 5px;
  padding: 1.5rem;
  background: #FFF;
  border-bottom-right-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
  box-shadow: rgba(55, 45, 131, 0.1) 0 15px 45px, rgba(0, 0, 0, 0.075) 0 5px 15px;
  opacity: 0;
  transform: translateY(-10%);
  -webkit-transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
  -moz-transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
  transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
  pointer-events: none; }
  .shqSite-mobileMenu.open {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto; }
  .shqSite-mobileMenu .mobile-nav {
    margin-top: 35px;
    margin-bottom: 65px;
    padding: 1.5rem; }
  .shqSite-mobileMenu .mobile-nav__item a {
    font-size: 1rem;
    font-weight: 500;
    color: #5b6770; }
  .shqSite-mobileMenu .mobile-menu__footer {
    position: absolute;
    background-color: #f8f9fa;
    background-image: -webkit-linear-gradient(top, #f8f9fa, #f1f2f2);
    background-image: linear-gradient(to bottom,#f8f9fa, #f1f2f2);
    border-top: 1px solid rgba(55, 45, 131, 0.1);
    border-bottom-right-radius: 0.5rem;
    border-bottom-left-radius: 0.5rem; }
    .shqSite-mobileMenu .mobile-menu__footer .shqSite-btn {
      width: 100%;
      font-size: 1.5rem;
      line-height: 3rem; }

.shqSite-modal {
  z-index: 2000;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s cubic-bezier(0.4, 0, 1, 1) 0.2s, opacity 0.2s; }
  .shqSite-modal__overlay {
    z-index: 2000;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: -webkit-radial-gradient(50% 50%, transparent, rgba(0, 0, 0, 0.5));
    background: radial-gradient(50% 50%, transparent, rgba(0, 0, 0, 0.5)); }
  .shqSite-modal__container {
    z-index: 2001;
    position: relative;
    display: -webkit-box;
    display: -moz-box;
    display: box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    box-direction: normal;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    flex-direction: column;
    -ms-flex-direction: column;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    box-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    -o-justify-content: center;
    justify-content: center;
    -ms-flex-pack: center;
    height: 100%;
    width: 30rem;
    margin: 0 auto; }
  .shqSite-modal__wrapper {
    box-shadow: rgba(0, 0, 0, 0.1) 0 15px 30px, rgba(0, 0, 0, 0.1) 0 9px 18px -3px; }
  .shqSite-modal__header {
    position: relative;
    padding: 2rem;
    background: #FFF; }
  .shqSite-modal__close {
    position: absolute;
    top: 1rem;
    right: 1.5rem;
    font-size: 2.5rem;
    color: #00BCE3;
    font-weight: 800;
    border-bottom: none; }
  .shqSite-modal__content {
    padding: 2rem;
    background: #FFF;
    overflow: hidden;
    overflow-y: auto; }
  .shqSite-modal__footer {
    padding: 1rem 1.5rem;
    background: #FFF;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    text-align: right; }
  .shqSite-modal--fixed-height .shqSite-modal__content {
    height: 25rem; }
  .shqSite-modal--delete .shqSite-modal__header {
    background-color: #ff6b6b;
    background-color: #ff6b6b;
    background-image: -webkit-linear-gradient(bottom, transparent, #ff3838);
    background-image: linear-gradient(to top,transparent, #ff3838); }
  .shqSite-modal.is-visible {
    visibility: visible;
    opacity: 1; }

/* Animations
----------------------*/
@keyframes tei-floatingCover {
  0% {
    transform: translateY(0) rotate3d(1, 1, 0, 10deg); }
  50% {
    transform: translateY(-0.25rem) rotate3d(1, 1, 0, 7.5deg); }
  100% {
    transform: translateY(0) rotate3d(1, 1, 0, 10deg); } }
@keyframes tei-floatingSummary {
  0% {
    transform: rotate3d(0, 1, 1, 10deg) translateZ(-20px) scale(0.75); }
  50% {
    transform: translateY(-0.125rem) rotate3d(0, 1, 1, 10deg) translateZ(-20px) scale(0.75); }
  100% {
    transform: translateY(0) rotate3d(0, 1, 1, 10deg) translateZ(-20px) scale(0.75); } }
@keyframes tei-floatingGraphs {
  0% {
    transform: rotate3d(1, 0, 1, -25deg) translateZ(-40px) scale(0.875); }
  50% {
    transform: translateY(0.125rem) rotate3d(1, 0, 1, -22.5deg) translateZ(-40px) scale(0.875); }
  100% {
    transform: translateY(0) rotate3d(1, 0, 1, -25deg) translateZ(-40px) scale(0.875); } }
.hero-activity-feed {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  perspective: 1250px;
  perspective-origin: 50% 25%;
  pointer-events: none;
  transform-style: preserve-3d;
  overflow-x: hidden; }
  @media (max-width: 25.875em) {
    .hero-activity-feed {
      perspective-origin: 50% 45%; } }
  .hero-activity-feed-grid {
    position: absolute;
    top: 375px;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    transform: rotateX(90deg);
    transform-style: inherit; }
    @media (max-width: 25.875em) {
      .hero-activity-feed-grid {
        top: 225px; } }
    .hero-activity-feed-grid .line {
      position: absolute;
      top: -1400px;
      bottom: 0;
      left: 0;
      width: 1px;
      background-color: transparent;
      background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0.1) 85%, transparent);
      background-image: linear-gradient(rgba(0, 0, 0, 0.1) 85%, transparent);
      -webkit-backface-visibility: hidden; }
      .hero-activity-feed-grid .line:nth-child(1) {
        left: 0; }
      .hero-activity-feed-grid .line:nth-child(2) {
        left: 20%; }
      .hero-activity-feed-grid .line:nth-child(3) {
        left: 40%; }
      .hero-activity-feed-grid .line:nth-child(4) {
        left: 60%; }
      .hero-activity-feed-grid .line:nth-child(5) {
        left: 80%; }
      .hero-activity-feed-grid .line:nth-child(6) {
        left: 100%; }
  .hero-activity-feed-columns {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    transform-style: inherit; }
    .hero-activity-feed-columns .column {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      -webkit-backface-visibility: hidden;
      transform-style: inherit; }
      .hero-activity-feed-columns .column:nth-child(1) {
        left: 0; }
      .hero-activity-feed-columns .column:nth-child(2) {
        left: 20%; }
      .hero-activity-feed-columns .column:nth-child(3) {
        left: 40%; }
      .hero-activity-feed-columns .column:nth-child(4) {
        left: 60%; }
      .hero-activity-feed-columns .column:nth-child(5) {
        left: 80%; }
      .hero-activity-feed-columns .column:nth-child(6) {
        left: 100%; }
  .hero-activity-feed .user-event {
    display: none;
    position: absolute;
    bottom: 0;
    left: calc(50% - 2rem);
    z-index: 5;
    -webkit-animation: UserEventMotion 15s linear infinite;
    -moz-animation: UserEventMotion 15s linear infinite;
    animation: UserEventMotion 15s linear infinite; }
    .hero-activity-feed .user-event:nth-child(1) {
      z-index: 4; }
    .hero-activity-feed .user-event:nth-child(2) {
      z-index: 3; }
    .hero-activity-feed .user-event:nth-child(3) {
      z-index: 2; }
    .hero-activity-feed .user-event:nth-child(4) {
      z-index: 1; }
    .hero-activity-feed .user-event:after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      height: 10px;
      background-color: transparent;
      background-image: -webkit-radial-gradient(25% 50%, rgba(0, 0, 0, 0.05), transparent);
      background-image: radial-gradient(  at 25% 50%, rgba(0, 0, 0, 0.05), transparent);
      overflow: visible;
      opacity: 0;
      -webkit-animation: UserBodyMotion 15s ease infinite;
      -moz-animation: UserBodyMotion 15s ease infinite;
      animation: UserBodyMotion 15s ease infinite; }
    .hero-activity-feed .user-event.blue .user-event__marker {
      background: #0EE8CF; }
      .hero-activity-feed .user-event.blue .user-event__marker:after {
        border-color: #0EE8CF; }
    .hero-activity-feed .user-event.blue .user-event__flag {
      background: #FFF; }
    .hero-activity-feed .user-event.blue .user-event__name {
      color: #2F2149; }
    .hero-activity-feed .user-event.blue .user-event__action {
      color: #2F2149;
      background: rgba(14, 232, 207, 0.1); }
    .hero-activity-feed .user-event.blue .user-event__response {
      color: #2F2149;
      background: #0ee8cf; }
    .hero-activity-feed .user-event.teal .user-event__marker {
      background: #0EE8CF; }
      .hero-activity-feed .user-event.teal .user-event__marker:after {
        border-color: #0EE8CF; }
    .hero-activity-feed .user-event.teal .user-event__flag {
      background: #FFF; }
    .hero-activity-feed .user-event.teal .user-event__name {
      color: #2F2149; }
    .hero-activity-feed .user-event.teal .user-event__action {
      color: #2F2149;
      background: rgba(14, 232, 207, 0.1); }
    .hero-activity-feed .user-event.teal .user-event__response {
      color: #2F2149;
      background: #0ee8cf; }
    .hero-activity-feed .user-event.purple .user-event__marker {
      background: #8762DB; }
      .hero-activity-feed .user-event.purple .user-event__marker:after {
        border-color: #8762DB; }
    .hero-activity-feed .user-event.purple .user-event__flag {
      background: #FFF; }
    .hero-activity-feed .user-event.purple .user-event__name {
      color: #8762DB; }
    .hero-activity-feed .user-event.purple .user-event__action {
      color: #8762DB;
      background: rgba(135, 98, 219, 0.1); }
    .hero-activity-feed .user-event.purple .user-event__response {
      color: #FFF;
      background: #8762db; }
    .hero-activity-feed .user-event.indigo .user-event__marker {
      background: #504BB1; }
      .hero-activity-feed .user-event.indigo .user-event__marker:after {
        border-color: #504BB1; }
    .hero-activity-feed .user-event.indigo .user-event__flag {
      background: #FFF; }
    .hero-activity-feed .user-event.indigo .user-event__name {
      color: #504BB1; }
    .hero-activity-feed .user-event.indigo .user-event__action {
      color: #504BB1;
      background: rgba(80, 75, 177, 0.1); }
    .hero-activity-feed .user-event.indigo .user-event__response {
      color: #FFF;
      background: #504bb1; }
    .hero-activity-feed .user-event__marker {
      display: block;
      height: 1.5rem;
      width: 1.5rem;
      margin-top: 3rem;
      margin-left: 1.5rem;
      border-radius: 50%;
      box-shadow: rgba(0, 0, 0, 0.3) 0 10px 15px -2px;
      -webkit-transform: rotateX(60deg);
      -moz-transform: rotateX(60deg);
      -ms-transform: rotateX(60deg);
      -o-transform: rotateX(60deg);
      transform: rotateX(60deg); }
      .hero-activity-feed .user-event__marker:after {
        display: block;
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        border: 2px solid transparent;
        border-radius: 100%;
        -webkit-animation: ping 1.5s 0.5s ease infinite;
        -moz-animation: ping 1.5s 0.5s ease infinite;
        animation: ping 1.5s 0.5s ease infinite; }
    .hero-activity-feed .user-event__flag {
      z-index: 2;
      display: flex;
      align-items: center;
      position: relative;
      width: 15rem;
      padding: 0.5rem;
      border-radius: 0.25rem;
      box-shadow: rgba(0, 0, 0, 0.05) 0 0 15px;
      -webkit-animation: UserFlagMotion 15s ease infinite;
      -moz-animation: UserFlagMotion 15s ease infinite;
      animation: UserFlagMotion 15s ease infinite; }
    .hero-activity-feed .user-event__avatar {
      flex-shrink: 0;
      margin-right: 1rem;
      height: 4rem;
      width: 4rem;
      border-radius: 50%;
      box-shadow: rgba(255, 255, 255, 0.75) 0 0 30px;
      background-size: cover; }
    .hero-activity-feed .user-event__body {
      flex: 1;
      text-shadow: white 0 0 15px;
      -webkit-animation: UserBodyMotion 15s ease infinite;
      -moz-animation: UserBodyMotion 15s ease infinite;
      animation: UserBodyMotion 15s ease infinite; }
    .hero-activity-feed .user-event__name {
      font-size: 1rem;
      font-weight: bold; }
    .hero-activity-feed .user-event__status {
      font-size: 0.75rem; }
    .hero-activity-feed .user-event__action {
      z-index: 1;
      position: relative;
      width: 15rem;
      margin-top: 0.25rem;
      padding: 0.5rem;
      font-size: 0.75rem;
      font-weight: bold;
      border-radius: 0.25rem;
      -webkit-animation: UserActionMotion 15s ease infinite;
      -moz-animation: UserActionMotion 15s ease infinite;
      animation: UserActionMotion 15s ease infinite; }
    .hero-activity-feed .user-event__response {
      z-index: 1;
      position: relative;
      width: 15rem;
      margin-top: 0.25rem;
      padding: 0.5rem;
      font-size: 0.75rem;
      font-weight: bold;
      border-radius: 0.25rem;
      -webkit-animation: UserResponseMotion 15s ease infinite;
      -moz-animation: UserResponseMotion 15s ease infinite;
      animation: UserResponseMotion 15s ease infinite;
      -webkit-animation-delay: 0.75s;
      -moz-animation-delay: 0.75s;
      animation-delay: 0.75s;
      opacity: 0; }

@keyframes UserShadow {
  0% {
    opacity: 0; }
  15% {
    opacity: 0; }
  17.5% {
    opacity: 1; }
  75% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@keyframes UserEventMotion {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 0; }
  15% {
    opacity: 1; }
  50% {
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    -webkit-transform: translate3d(0, 0, -1500px);
    -moz-transform: translate3d(0, 0, -1500px);
    -ms-transform: translate3d(0, 0, -1500px);
    -o-transform: translate3d(0, 0, -1500px);
    transform: translate3d(0, 0, -1500px);
    opacity: 0; } }
@-webkit-keyframes UserEventMotion {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 0; }
  15% {
    opacity: 1; }
  50% {
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    -webkit-transform: translate3d(0, 0, -1500px);
    -moz-transform: translate3d(0, 0, -1500px);
    -ms-transform: translate3d(0, 0, -1500px);
    -o-transform: translate3d(0, 0, -1500px);
    transform: translate3d(0, 0, -1500px);
    opacity: 0; } }
@-moz-keyframes UserEventMotion {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 0; }
  15% {
    opacity: 1; }
  50% {
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    -webkit-transform: translate3d(0, 0, -1500px);
    -moz-transform: translate3d(0, 0, -1500px);
    -ms-transform: translate3d(0, 0, -1500px);
    -o-transform: translate3d(0, 0, -1500px);
    transform: translate3d(0, 0, -1500px);
    opacity: 0; } }
@-webkit-keyframes UserFlagMotion {
  0% {
    transform: translate3d(0, 20px, 0);
    opacity: 0; }
  15% {
    transform: translate3d(0, 20px, 0);
    opacity: 0; }
  17.5% {
    transform: translate3d(0, 0, 0);
    opacity: 1; }
  72.5% {
    transform: translate3d(0, 0, 0);
    opacity: 1; }
  75% {
    transform: translate3d(0, 20px, 0);
    opacity: 0; }
  100% {
    opacity: 0; } }
@-moz-keyframes UserFlagMotion {
  0% {
    transform: translate3d(0, 20px, 0);
    opacity: 0; }
  15% {
    transform: translate3d(0, 20px, 0);
    opacity: 0; }
  17.5% {
    transform: translate3d(0, 0, 0);
    opacity: 1; }
  72.5% {
    transform: translate3d(0, 0, 0);
    opacity: 1; }
  75% {
    transform: translate3d(0, 20px, 0);
    opacity: 0; }
  100% {
    opacity: 0; } }
@-webkit-keyframes UserBodyMotion {
  0% {
    transform: translate3d(-20px, 0, 0);
    opacity: 0; }
  15% {
    transform: translate3d(-20px, 0, 0);
    opacity: 0; }
  17.5% {
    transform: translate3d(0, 0, 0);
    opacity: 1; }
  72.5% {
    transform: translate3d(0, 0, 0);
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    opacity: 0; } }
@-moz-keyframes UserBodyMotion {
  0% {
    transform: translate3d(-20px, 0, 0);
    opacity: 0; }
  15% {
    transform: translate3d(-20px, 0, 0);
    opacity: 0; }
  17.5% {
    transform: translate3d(0, 0, 0);
    opacity: 1; }
  72.5% {
    transform: translate3d(0, 0, 0);
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    opacity: 0; } }
@-webkit-keyframes UserActionMotion {
  0% {
    transform: translate3d(0, -20px, 0);
    opacity: 0; }
  17.5% {
    transform: translate3d(0, -20px, 0);
    opacity: 0; }
  20% {
    transform: translate3d(0, 0, 0);
    opacity: 1; }
  72.5% {
    transform: translate3d(0, 0, 0);
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    opacity: 0; } }
@-moz-keyframes UserActionMotion {
  0% {
    transform: translate3d(0, -20px, 0);
    opacity: 0; }
  17.5% {
    transform: translate3d(0, -20px, 0);
    opacity: 0; }
  20% {
    transform: translate3d(0, 0, 0);
    opacity: 1; }
  72.5% {
    transform: translate3d(0, 0, 0);
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    opacity: 0; } }
@-webkit-keyframes UserResponseMotion {
  0% {
    transform: scaleY(0);
    opacity: 0; }
  17.5% {
    transform: scaleY(0);
    opacity: 0; }
  20% {
    transform: scaleY(1);
    opacity: 1; }
  72.5% {
    transform: scaleY(1);
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    opacity: 0; } }
@-moz-keyframes UserResponseMotion {
  0% {
    transform: scaleY(0);
    opacity: 0; }
  17.5% {
    transform: scaleY(0);
    opacity: 0; }
  20% {
    transform: scaleY(1);
    opacity: 1; }
  72.5% {
    transform: scaleY(1);
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    opacity: 0; } }
/* Pages
----------------------*/
#homepage {
  background-color: #FFF;
  background-image: -webkit-linear-gradient(top, #FFF, #F5F6F9);
  background-image: linear-gradient(to bottom,#FFF, #F5F6F9); }

.shqSite-divider {
  position: relative;
  z-index: 0;
  width: 100%;
  height: 16.25rem;
  margin: 0;
  overflow: hidden; }
  .shqSite-divider svg {
    width: 100%;
    height: 16.25rem; }
  .shqSite-divider--top-small {
    z-index: 0;
    width: 100%;
    bottom: 0;
    height: 13.125rem;
    margin-top: 0; }
    .shqSite-divider--top-small svg {
      width: 100%;
      height: 13.125rem; }
  .shqSite-divider--bottom-curve {
    height: 6.25rem;
    z-index: 1;
    margin-top: -10rem; }
    .shqSite-divider--bottom-curve svg {
      width: 100%;
      height: 6.25rem; }

.shqSite-body-link {
  margin: 1.5rem 0 0 0;
  padding: 1.5rem 0;
  border-top: 1px solid rgba(135, 98, 219, 0.1); }

.shqSite-news-alert {
  display: inline-block;
  margin-bottom: 1rem;
  padding: 0.5rem;
  background: rgba(135, 98, 219, 0.1);
  border-radius: 0.5rem; }

.shqSite-flag {
  margin: 0 0 1.5rem 0; }
  .shqSite-flag:last-child {
    margin: 0; }

.shqPage {
  padding-bottom: 20rem; }
  .shqPage p {
    font-size: 0.875rem;
    line-height: 1.5rem; }
    .shqPage p:not(:first-child) {
      margin-top: 1.125rem; }
  .shqPage h3 {
    margin: 2.25rem 0 1.125rem 0;
    font-weight: 600; }
  .shqPage ul {
    padding: 0;
    font-size: 0.875rem;
    list-style: none; }
    .shqPage ul li {
      position: relative;
      margin: 0.325rem 0;
      padding-left: 1.5rem; }
      .shqPage ul li:before {
        content: "";
        position: absolute;
        top: 0.4rem;
        left: 0.25rem;
        height: 0.5rem;
        width: 0.5rem;
        background: rgba(0, 0, 0, 0.25);
        border-radius: 50%; }
    .shqPage ul:not(:first-child) {
      margin-top: 1rem; }
  .shqPage table {
    width: 100%;
    font-size: 0.875rem;
    line-height: 1.5rem;
    border: 1px solid rgba(0, 0, 0, 0.1); }
    .shqPage table tr:last-child td {
      border-bottom: 0; }
    .shqPage table td {
      padding: 1.25rem;
      vertical-align: top;
      border-bottom: 1px solid rgba(0, 0, 0, 0.1);
      border-right: 1px solid rgba(0, 0, 0, 0.1); }
    .shqPage table pre {
      margin: 0;
      font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
      font-weight: bolder !important;
      color: #51BADF !important; }

@media (max-width: 25.875em) {
  .page-container {
    overflow: hidden; } }

#clients {
  z-index: 5;
  position: relative; }
  #clients .client-card {
    position: relative;
    padding: 1.5rem;
    background: #FFF;
    border: none;
    border-radius: 0.25rem;
    box-shadow: rgba(55, 45, 131, 0.2) 0 10px 25px -5px;
    -webkit-transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -moz-transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    cursor: pointer; }
    @media (max-width: 25.875em) {
      #clients .client-card {
        padding: 1rem; } }
    #clients .client-card:hover {
      transform: scale(1.025);
      box-shadow: rgba(55, 45, 131, 0.35) 0 20px 45px -10px; }
      #clients .client-card:hover .client-logos {
        transform: scale(0.9);
        filter: blur(5px); }
      #clients .client-card:hover .client-card__overlay {
        opacity: 1; }
    #clients .client-card__overlay {
      position: absolute;
      display: flex;
      -webkit-box-pack: center;
      -moz-box-pack: center;
      box-pack: center;
      -webkit-justify-content: center;
      -moz-justify-content: center;
      -ms-justify-content: center;
      -o-justify-content: center;
      justify-content: center;
      -ms-flex-pack: center;
      -webkit-box-align: center;
      -moz-box-align: center;
      box-align: center;
      -webkit-align-items: center;
      -moz-align-items: center;
      -ms-align-items: center;
      -o-align-items: center;
      align-items: center;
      -ms-flex-align: center;
      -webkit-align-content: center;
      -moz-align-content: center;
      align-content: center;
      -ms-flex-line-pack: center;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background-image: linear-gradient(rgba(135, 98, 219, 0.85), rgba(135, 98, 219, 0.85));
      border: none;
      border-radius: 0.25rem;
      opacity: 0;
      -webkit-transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
      -moz-transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
      transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
    #clients .client-card .client-logos {
      transform: scale(1);
      -webkit-transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
      -moz-transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
      transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
      #clients .client-card .client-logos .client-logos__item a img {
        max-height: 20px; }
        #clients .client-card .client-logos .client-logos__item a img.kate-spade {
          max-height: 60px; }
      @media (max-width: 25.875em) {
        #clients .client-card .client-logos .client-logos__item a {
          padding: 1rem; }
          #clients .client-card .client-logos .client-logos__item a img {
            max-height: 15px; }
            #clients .client-card .client-logos .client-logos__item a img.kate-spade {
              max-height: 30px; } }

#testimonials {
  z-index: 2;
  position: relative;
  padding-top: 8rem;
  overflow: hidden; }
  #testimonials h2 {
    margin: 0 0 4rem 0; }
  #testimonials .testimonial-block {
    min-height: 500px; }
  #testimonials .testimonial-background {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0; }
  #testimonials .client-testimonial {
    margin: 0 0 4rem 0; }
    #testimonials .client-testimonial__logo {
      display: inline-block;
      width: 200px;
      padding-right: 1.5rem;
      line-height: 3rem;
      vertical-align: -webkit-baseline-middle; }
      #testimonials .client-testimonial__logo img {
        width: 100%;
        backgorund-blend-mode: multiply; }
    #testimonials .client-testimonial__metric {
      display: inline-block;
      padding: 0.5rem 1rem;
      background: #0EE8CF;
      border-radius: 0.25rem; }
    #testimonials .client-testimonial__quote {
      margin-top: 1rem; }
      #testimonials .client-testimonial__quote blockquote {
        margin: 0 0 1.5rem 0;
        font-size: 0.875rem;
        line-height: 1.5rem; }
      #testimonials .client-testimonial__quote .shqSite-text-subtitle {
        margin: 0 0 0.5rem 0; }
      @media (max-width: 25.875em) {
        #testimonials .client-testimonial__quote {
          padding: 0 2rem; } }
    #testimonials .client-testimonial__links {
      padding: 1.5rem 0;
      border-top: 1px solid rgba(135, 98, 219, 0.1); }

.testimonial-grid {
  z-index: 0;
  position: absolute;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  top: 6rem;
  left: 60%;
  width: 800px;
  transform: rotate(-20deg); }
  @media (max-width: 25.875em) {
    .testimonial-grid {
      top: 450px;
      left: calc(50% - 800px);
      width: 1600px;
      transform: rotate(0) scale(0.75); } }
  .testimonial-grid__item {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 2rem 2rem 0;
    background: #eee9f8;
    background-size: contain;
    background-position: center top;
    border-radius: 1rem;
    box-shadow: rgba(55, 45, 131, 0.45) 0 10px 25px -5px, rgba(55, 45, 131, 0.5) 0 2px 10px -2px; }
    .testimonial-grid__item.device-landscape {
      position: relative;
      border-top: 1rem solid #eee9f8;
      border-bottom: 1rem solid #eee9f8;
      border-left: 2rem solid #eee9f8;
      border-right: 2rem solid #eee9f8;
      box-shadow: rgba(55, 45, 131, 0.345) 0 10px 25px -5px, rgba(55, 45, 131, 0.45) 0 0 3px inset; }
      .testimonial-grid__item.device-landscape:after {
        content: "";
        position: absolute;
        top: -1rem;
        bottom: -1rem;
        left: -2rem;
        right: -2rem;
        border-radius: 1rem;
        box-shadow: rgba(55, 45, 131, 0.6) 0 -2px 5px inset; }
    .testimonial-grid__item.device-portrait {
      position: relative;
      border-top: 2rem solid #eee9f8;
      border-bottom: 2rem solid #eee9f8;
      border-left: 0.5rem solid #eee9f8;
      border-right: 0.5rem solid #eee9f8;
      box-shadow: rgba(55, 45, 131, 0.45) 0 10px 25px -5px, rgba(55, 45, 131, 0.45) 0 0 3px inset; }
      .testimonial-grid__item.device-portrait:after {
        content: "";
        position: absolute;
        top: -2rem;
        bottom: -2rem;
        left: -0.5rem;
        right: -0.5rem;
        border-radius: 1rem;
        box-shadow: rgba(55, 45, 131, 0.6) 0 -2px 5px inset; }
      .testimonial-grid__item.device-portrait:before {
        content: "";
        position: absolute;
        left: calc(50% - 0.5rem);
        bottom: -1.375rem;
        height: 1.25rem;
        width: 1.25rem;
        border: 1px solid rgba(135, 98, 219, 0.25);
        border-radius: 50%; }
    .testimonial-grid__item.top-row {
      align-self: flex-end; }
      @media (max-width: 25.875em) {
        .testimonial-grid__item.top-row {
          align-self: auto; } }
    .testimonial-grid__item.bottom-row {
      align-self: flex-start; }
      @media (max-width: 25.875em) {
        .testimonial-grid__item.bottom-row {
          align-self: auto; } }
    .testimonial-grid__item.metric {
      text-shadow: rgba(0, 0, 0, 0.35) 0 2px 5px;
      background-color: #997adb;
      background-image: -webkit-radial-gradient(#997adb, #8762DB, #685bc7);
      background-image: radial-gradient(  #997adb, #8762DB, #685bc7); }
    .testimonial-grid__item.product {
      background: transparent;
      background-size: contain;
      background-repeat: no-repeat;
      box-shadow: none;
      border-radius: none; }

#how-it-works {
  position: relative;
  background: #FFF;
  z-index: 0; }

.gears {
  margin: 0 0 1.5rem 0;
  transform-origin: 50% 50% 0px; }
  .gears .cog-1 {
    transform-origin: 50% 50% 0px;
    animation: gearRotation 1s linear infinite; }
  .gears .cog-2 {
    transform-origin: 50% 50% 0px;
    animation: gearRotation 1s linear infinite;
    animation-direction: reverse; }

@keyframes gearRotation {
  0% {
    transform: rotate(0); }
  100% {
    transform: rotate(360deg); } }
.how-it-works {
  display: flex;
  position: relative;
  padding: 6rem 0; }
  @media (max-width: 25.875em) {
    .how-it-works {
      flex-direction: column;
      padding: 3rem 0; } }
  .how-it-works__visuals {
    position: relative;
    flex: 0 0 50%; }
    @media (max-width: 25.875em) {
      .how-it-works__visuals {
        display: block;
        width: 100%;
        height: 400px; } }
  .how-it-works__tabs {
    padding-left: 2rem; }
    @media (max-width: 25.875em) {
      .how-it-works__tabs {
        padding: 0 2rem; } }
  .how-it-works .hiw-tabs {
    display: block; }
    .how-it-works .hiw-tabs__item {
      display: block;
      padding: 1.5rem;
      border: none;
      border-radius: 0.25rem;
      -webkit-transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1);
      -moz-transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1);
      transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1);
      pointer-events: none; }
      .how-it-works .hiw-tabs__item:hover {
        background: rgba(0, 188, 227, 0.05); }
      .how-it-works .hiw-tabs__item.active {
        background: rgba(0, 188, 227, 0.1);
        box-shadow: rgba(0, 0, 0, 0.1) 0 3px 10px; }
        .how-it-works .hiw-tabs__item.active .shqSite-text-subtitle {
          color: #00BCE3; }
      .how-it-works .hiw-tabs__item .shqSite-text-subtitle {
        color: #2F2149;
        margin: 0 0 0.5rem 0; }

.segment-animation,
.conversion-animation,
.setup-animation,
.integrations-animation {
  z-index: 0;
  position: absolute;
  opacity: 0;
  pointer-events: none;
  -webkit-transition: opacity 0.75s cubic-bezier(0, 0, 0.2, 1);
  -moz-transition: opacity 0.75s cubic-bezier(0, 0, 0.2, 1);
  transition: opacity 0.75s cubic-bezier(0, 0, 0.2, 1); }
  @media (max-width: 25.875em) {
    .segment-animation,
    .conversion-animation,
    .setup-animation,
    .integrations-animation {
      width: 100%; } }
  .segment-animation.active,
  .conversion-animation.active,
  .setup-animation.active,
  .integrations-animation.active {
    opacity: 1; }

.segment-animation.active .segment-animation__segment {
  opacity: 1;
  transform: translateX(0rem); }
.segment-animation.active .segment-animation__query {
  opacity: 1;
  transform: translateX(0rem); }
.segment-animation__query {
  z-index: 1;
  position: relative;
  margin: 0;
  width: 20rem;
  padding: 1.5rem;
  font-size: 1rem;
  font-weight: 500;
  color: #FFF;
  line-height: 1.5rem;
  background-color: #997adb;
  background-image: -webkit-linear-gradient(top, #997adb, #685bc7);
  background-image: linear-gradient(to bottom,#997adb, #685bc7);
  border-radius: 0.5rem;
  box-shadow: rgba(55, 45, 131, 0.1) 0 15px 45px, rgba(0, 0, 0, 0.075) 0 5px 15px;
  transform: translateX(-1rem);
  opacity: 0;
  -webkit-transition: opacity 0.75s cubic-bezier(0, 0, 0.2, 1), -webkit-transform 0.75s cubic-bezier(0, 0, 0.2, 1);
  -moz-transition: opacity 0.75s cubic-bezier(0, 0, 0.2, 1), -moz-transform 0.75s cubic-bezier(0, 0, 0.2, 1);
  transition: opacity 0.75s cubic-bezier(0, 0, 0.2, 1), transform 0.75s cubic-bezier(0, 0, 0.2, 1); }
  @media (max-width: 25.875em) {
    .segment-animation__query {
      width: 100%; } }
  .segment-animation__query .arrow {
    position: absolute;
    width: 0;
    height: 0;
    bottom: -0.75rem;
    left: 10%;
    margin-left: -0.75rem;
    border-left: 0.75rem solid transparent;
    border-right: 0.75rem solid transparent;
    border-top: 0.75rem solid #685bc7; }
.segment-animation__segment {
  z-index: 2;
  position: relative;
  margin-top: 1rem;
  margin-left: 1rem;
  width: 28rem;
  background: #FFF;
  border-radius: 0.5rem;
  box-shadow: rgba(55, 45, 131, 0.1) 0 15px 45px, rgba(0, 0, 0, 0.075) 0 5px 15px;
  transform: translateX(-1rem);
  opacity: 0;
  -webkit-transition: opacity 0.75s cubic-bezier(0, 0, 0.2, 1), -webkit-transform 0.75s cubic-bezier(0, 0, 0.2, 1);
  -moz-transition: opacity 0.75s cubic-bezier(0, 0, 0.2, 1), -moz-transform 0.75s cubic-bezier(0, 0, 0.2, 1);
  transition: opacity 0.75s cubic-bezier(0, 0, 0.2, 1), transform 0.75s cubic-bezier(0, 0, 0.2, 1);
  transition-delay: 0.5s; }
  @media (max-width: 25.875em) {
    .segment-animation__segment {
      margin-left: 0;
      width: 100%; } }
  .segment-animation__segment span {
    display: inline-block;
    font-weight: 600;
    color: #8762DB;
    border-bottom: 1px dotted #8762DB; }
  .segment-animation__segment .segment-refinement {
    margin: 1rem 0;
    padding: 1rem;
    font-weight: 500;
    background: #f8f9fa;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 0.25rem; }
  .segment-animation__segment .segment-container {
    position: relative;
    padding: 1.5rem; }
  .segment-animation__segment .segment-counts {
    position: relative;
    padding: 1.5rem;
    background-color: #f8f9fa;
    background-image: -webkit-linear-gradient(#f8f9fa, #f1f2f2);
    background-image: linear-gradient(#f8f9fa, #f1f2f2);
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom-right-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem; }
    .segment-animation__segment .segment-counts .segment-count {
      font-size: 1.5rem;
      font-weight: 500;
      color: #5b6770;
      line-height: 2.25rem; }

.conversion-animation {
  height: 400px;
  padding: 2rem 0;
  transform: translateX(-1rem); }
  .conversion-animation.active {
    transform: translateX(0rem); }

.setup-animation {
  transform: translateX(-1rem); }
  .setup-animation.active {
    transform: translateX(0rem); }

.integrations-animation {
  transform: translateX(-1rem); }
  .integrations-animation.active {
    transform: translateX(0rem); }

#tei-stats {
  margin-top: -7.5rem;
  padding: 6rem 0;
  position: relative; }
  #tei-stats .stat-block {
    display: flex;
    margin: 0 0 1.5rem 0; }
    #tei-stats .stat-block__item {
      display: inline-block;
      padding-right: 2rem; }
      #tei-stats .stat-block__item:last-child {
        border-right: none; }
  #tei-stats .tei-visuals {
    position: relative;
    perspective: 750px; }
    @media (max-width: 25.875em) {
      #tei-stats .tei-visuals {
        display: block;
        width: 100%;
        height: 200px; } }
    #tei-stats .tei-visuals img {
      position: relative;
      z-index: 1;
      width: 18.75rem; }
    #tei-stats .tei-visuals .tei-cover {
      z-index: 1;
      position: absolute;
      top: 0;
      left: 2rem;
      transform: rotate3d(1, 1, 0, 10deg);
      animation: tei-floatingCover 5s ease-in-out infinite; }
      #tei-stats .tei-visuals .tei-cover:after {
        z-index: 0;
        content: "";
        position: absolute;
        top: 1.25rem;
        left: 0;
        height: 25rem;
        width: 18.75rem;
        background: #372d83;
        -webkit-filter: blur(20px);
        filter: blur(20px);
        opacity: 0.2; }
      @media (max-width: 25.875em) {
        #tei-stats .tei-visuals .tei-cover {
          top: -50%;
          left: calc(50% - 9.375rem); } }
    #tei-stats .tei-visuals .tei-summary {
      position: absolute;
      top: -20rem;
      left: 4rem;
      transform: rotate3d(0, 1, 1, 10deg) translateZ(-20px) scale(0.75);
      animation: tei-floatingSummary 3s ease-in-out infinite; }
      #tei-stats .tei-visuals .tei-summary:after {
        z-index: 0;
        content: "";
        position: absolute;
        top: 1.25rem;
        left: 0;
        height: 25rem;
        width: 18.75rem;
        background: #372d83;
        -webkit-filter: blur(20px);
        filter: blur(20px);
        opacity: 0.2; }
      @media (max-width: 25.875em) {
        #tei-stats .tei-visuals .tei-summary {
          top: -10rem;
          left: 55%; } }
    #tei-stats .tei-visuals .tei-graphs {
      position: absolute;
      top: -10rem;
      left: -5rem;
      transform: rotate3d(1, 0, 1, -25deg) translateZ(-40px) scale(0.875);
      animation: tei-floatingGraphs 4s ease-in-out infinite; }
      #tei-stats .tei-visuals .tei-graphs:after {
        z-index: 0;
        content: "";
        position: absolute;
        top: 1.25rem;
        left: 0;
        height: 25rem;
        width: 18.75rem;
        background: #372d83;
        -webkit-filter: blur(20px);
        filter: blur(20px);
        opacity: 0.2; }

#resource {
  padding: 4rem 0; }

#whats-new {
  z-index: 2;
  position: relative;
  padding: 6rem 0;
  overflow: visible; }
  @media (max-width: 25.875em) {
    #whats-new {
      padding-top: 3rem; } }
  #whats-new .resource-block {
    display: flex;
    flex-direction: row;
    width: 100%;
    padding: 4rem;
    background: #FFF;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 0.25rem; }
    #whats-new .resource-block__image {
      position: relative;
      -webkit-box-flex: 1;
      -moz-box-flex: 1;
      box-flex: 1;
      -webkit-flex: 1 0 50%;
      -moz-flex: 1 0 50%;
      -ms-flex: 1 0 50%;
      flex: 1 0 50%; }
    #whats-new .resource-block__title {
      -webkit-box-flex: 1;
      -moz-box-flex: 1;
      box-flex: 1;
      -webkit-flex: 1 0 50%;
      -moz-flex: 1 0 50%;
      -ms-flex: 1 0 50%;
      flex: 1 0 50%;
      text-align: right; }
    #whats-new .resource-block__body {
      -webkit-box-flex: 1;
      -moz-box-flex: 1;
      box-flex: 1;
      -webkit-flex: 1 0 33%;
      -moz-flex: 1 0 33%;
      -ms-flex: 1 0 33%;
      flex: 1 0 33%; }
  #whats-new .news-block {
    padding: 2rem; }

.shqEvents #hero {
  z-index: -1;
  display: flex;
  position: relative;
  min-height: 50rem;
  background-color: #8762DB;
  background-blend-mode: luminosity; }
  @media (max-width: 25.875em) {
    .shqEvents #hero {
      padding: 0; } }
@media (max-width: 25.875em) {
  .shqEvents-hero .shqSite-grid {
    flex-direction: row; } }
.shqEvents-hero__content {
  z-index: 1;
  position: relative; }
  .shqEvents-hero__content h1 {
    display: block;
    padding-bottom: 2rem;
    margin: 0 0 2rem 0;
    font-size: 7rem;
    font-family: stolzl, sans-serif;
    color: #FFF;
    font-weight: 800;
    letter-spacing: -0.1rem;
    border-bottom: 8px solid white; }
  .shqEvents-hero__content h2 {
    font-size: 1.5rem;
    color: #FFF;
    line-height: 1.875rem; }
  @media (max-width: 25.875em) {
    .shqEvents-hero__content h1 {
      font-size: 5rem;
      line-height: 5rem; } }
.shqEvents-hero__overlay {
  z-index: 0;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #8762DB;
  opacity: 0; }

.shqEvents-wrapper {
  background-color: #8762DB;
  background-image: -webkit-linear-gradient(#8762DB, #685bc7);
  background-image: linear-gradient(#8762DB, #685bc7);
  padding: 4rem;
  overflow: hidden; }
  @media (max-width: 25.875em) {
    .shqEvents-wrapper {
      padding: 1.5rem; } }
  .shqEvents-wrapper h2 {
    display: block;
    width: 100%;
    padding-bottom: 2rem;
    margin: 0 0 2rem 0;
    font-size: 3rem;
    color: #FFF;
    font-weight: 800;
    letter-spacing: -0.05rem;
    border-bottom: 2px solid #997adb; }
  .shqEvents-wrapper h3 {
    display: block;
    width: 100%;
    padding: 1.5rem 0;
    font-size: 1.5rem;
    color: #FFF;
    font-weight: 800;
    letter-spacing: -0.05rem; }
  .shqEvents-wrapper p {
    font-size: 1rem;
    color: #cabcea;
    font-weight: 400;
    line-spacing: 1.5rem; }
    .shqEvents-wrapper p + p {
      margin-top: 1rem; }
  .shqEvents-wrapper section {
    margin: 0 0 4rem 0; }

.shqEvents-overview__image {
  display: block;
  position: absolute;
  left: 55%;
  box-shadow: rgba(0, 0, 0, 0.25) 0 15px 45px -5px; }
  .shqEvents-overview__image img {
    max-width: 750px; }
  @media (max-width: 25.875em) {
    .shqEvents-overview__image {
      position: relative;
      left: auto;
      margin-top: 1.5rem; }
      .shqEvents-overview__image img {
        width: 100%; } }

.shqEvents-schedule {
  display: block;
  width: 100%; }
  .shqEvents-schedule__date {
    margin: 0 0 1.5rem 0;
    font-size: 1.5rem;
    color: #997adb;
    font-weight: 800;
    letter-spacing: -0.05rem; }
  .shqEvents-schedule-card {
    display: flex;
    box-align: center;
    align-items: center;
    margin: 0 0 1.5rem 0;
    padding: 2rem 4rem;
    background: #997adb; }
    @media (max-width: 25.875em) {
      .shqEvents-schedule-card {
        padding: 1.5rem;
        flex-direction: column;
        align-items: start; } }
    .shqEvents-schedule-card__time {
      flex-shrink: 0;
      font-size: 1.5rem;
      color: #FFF;
      font-weight: 800; }
    .shqEvents-schedule-card__image {
      display: block;
      flex-shrink: 0;
      height: 6rem;
      width: 6rem;
      margin: 0 2rem;
      border: 5px solid #685bc7;
      border-radius: 3rem;
      overflow: hidden; }
      .shqEvents-schedule-card__image img {
        width: 100%; }
      @media (max-width: 25.875em) {
        .shqEvents-schedule-card__image {
          display: none; } }
    .shqEvents-schedule-card__body {
      box-flex: 1;
      flex: 1; }
      .shqEvents-schedule-card__body .event-name {
        margin: 0 0 0.25rem 0;
        font-size: 1rem;
        color: #FFF;
        font-weight: 800;
        letter-spacing: -0.05rem; }
      .shqEvents-schedule-card__body .event-location {
        margin: 0 0 0.5rem 0;
        font-size: 0.75rem;
        color: #685bc7;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.1rem; }
      .shqEvents-schedule-card__body .event-description {
        margin-bottom: 0;
        font-size: 0.75rem;
        color: #cabcea;
        font-weight: 500;
        line-spacing: 1.125rem; }

.shqEvents-giveaway {
  display: flex;
  box-align: center;
  align-items: center; }
  .shqEvents-giveaway__image {
    position: absolute;
    bottom: 1rem;
    width: 10rem; }
    .shqEvents-giveaway__image img {
      width: 10rem; }
    @media (max-width: 25.875em) {
      .shqEvents-giveaway__image img {
        left: 0; } }
  .shqEvents-giveaway__body {
    flex: 1;
    box-flex: 1;
    margin-left: 7.5rem;
    padding: 0 2rem; }
    @media (max-width: 25.875em) {
      .shqEvents-giveaway__body {
        padding: 0.5rem; }
        .shqEvents-giveaway__body p {
          display: none; } }
  .shqEvents-giveaway__action {
    flex-shrink: 0; }

@media (max-width: 25.875em) {
  .shqEvents-about__content {
    order: 1; } }
@media (max-width: 25.875em) {
  .shqEvents-about__devices {
    order: 2;
    height: 10rem; }
    .shqEvents-about__devices .shqSite-ipad-mockup {
      top: auto !important; }
    .shqEvents-about__devices .shqSite-iphone-mockup {
      top: auto !important; } }

#overview, #schedule, #booth, #about {
  position: relative;
  padding: 2rem 0; }

#about {
  margin: 0; }
  #about .stat-block {
    display: flex;
    margin: 0 0 1.5rem 0;
    padding-top: 1.5rem; }
    #about .stat-block__item {
      padding-right: 1.5rem; }
      @media (max-width: 25.875em) {
        #about .stat-block__item .shqSite-text-heading--large {
          line-height: 2rem;
          margin: 0 0 0.5rem 0; }
        #about .stat-block__item .shqSite-text-subtitle {
          line-height: 1rem;
          margin: 0 0 0.5rem 0; } }

#giveaway {
  z-index: 1000;
  display: block;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 2rem;
  background: #FFF;
  box-shadow: rgba(0, 0, 0, 0.25) 0 2px 35px; }

#footer {
  padding: 4rem;
  font-size: 0.75rem;
  color: #dcd3f1;
  text-align: center;
  background: #685bc7;
  border-top: 1px solid rgba(0, 0, 0, 0.1); }

.shqLanding {
  position: relative;
  width: calc(100% - 300px);
  margin-right: auto;
  background: #FFF; }
  .shqLanding--no-sidebar {
    width: 100%;
    margin: 0; }
  @media only screen and (max-width: 667px) {
    .shqLanding {
      width: 100%;
      margin: 0; } }
  .shqLanding__header {
    z-index: 1000;
    position: absolute;
    top: 40px;
    left: 0;
    right: 0;
    margin: 0 auto;
    padding: 0 6rem; }
    .shqLanding__header a {
      border: none; }
    .shqLanding__header img {
      width: 200px; }
  .shqLanding__content {
    position: relative;
    width: 100%;
    padding: 0 4rem; }
    @media only screen and (max-width: 667px) {
      .shqLanding__content {
        padding: 0 2rem; } }
  .shqLanding__logo {
    display: block;
    padding: 1.5rem 0; }
  .shqLanding__body {
    position: relative;
    width: 100%;
    padding: 4rem 0; }
    .shqLanding__body h1 {
      display: block;
      width: 100%;
      margin: 0 0 1rem 0; }
    .shqLanding__body h2 {
      display: block;
      width: 100%;
      margin: 0 0 1rem 0; }
    @media only screen and (max-width: 667px) {
      .shqLanding__body {
        margin-top: 7.5rem; } }
    .shqLanding__body .shqLanding__resource-hero {
      border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
      .shqLanding__body .shqLanding__resource-hero img {
        display: block;
        width: 100%; }
    .shqLanding__body .shqLanding__list {
      display: block;
      padding: 1rem 2rem; }
      .shqLanding__body .shqLanding__list ul {
        margin-bottom: 1.667rem;
        font-size: 1rem;
        font-weight: 300;
        color: #5A5070;
        padding: 0;
        list-style: none; }
        .shqLanding__body .shqLanding__list ul li {
          position: relative;
          margin: 0 0 1rem 0;
          padding-left: 1.5rem;
          line-height: 1.618; }
          .shqLanding__body .shqLanding__list ul li:before {
            content: "";
            position: absolute;
            top: 0.4rem;
            left: 0.25rem;
            height: 0.5rem;
            width: 0.5rem;
            background: #685bc7;
            border-radius: 50%; }
        .shqLanding__body .shqLanding__list ul:not(:first-child) {
          margin-top: 1rem; }
    @media only screen and (max-width: 667px) {
      .shqLanding__body {
        padding: 1.5rem 0; } }
  .shqLanding__hero {
    position: relative;
    padding: 10rem 0 5rem 0; }
    @media only screen and (max-width: 667px) {
      .shqLanding__hero {
        padding: 15rem 0 5rem 0; } }
    .shqLanding__hero h1 {
      margin: 0 0 1.5rem 0; }
    .shqLanding__hero .device-mockups {
      position: absolute;
      top: -3rem;
      left: 50%;
      right: 0; }
      @media only screen and (max-width: 667px) {
        .shqLanding__hero .device-mockups {
          display: none; } }
    .shqLanding__hero .shqSite-flag {
      margin: 0 0 1.5rem 0; }
      .shqLanding__hero .shqSite-flag:last-child {
        margin: 0; }
  .shqLanding__quick-start {
    position: relative;
    padding: 5rem 0 12.5rem 0;
    border-top: 1px solid #eee9f8;
    z-index: 20; }
    .shqLanding__quick-start .shqSite-card {
      padding: 1rem;
      text-align: center; }
      .shqLanding__quick-start .shqSite-card:last-child {
        margin-right: 0; }
      .shqLanding__quick-start .shqSite-card img {
        max-width: 200px; }
  .shqLanding__testimonials {
    position: relative;
    padding: 5rem 0;
    z-index: 10; }
    .shqLanding__testimonials .section-background {
      position: relative;
      top: -15rem;
      left: 50%;
      margin-left: -600px;
      width: 100%;
      z-index: -1; }
      .shqLanding__testimonials .section-background img {
        position: absolute;
        top: 0;
        width: 1200px; }
    .shqLanding__testimonials .quote-block {
      margin: 2.5rem 0 4rem 0; }
    .shqLanding__testimonials .shqSite-card {
      padding: 2rem; }
    .shqLanding__testimonials blockquote {
      font-size: 0.75rem;
      font-weight: 300;
      line-height: 1.5rem; }
    .shqLanding__testimonials .shqSite-body-link {
      margin: 1.5rem 0 0 0;
      padding: 1.5rem 0 0 0; }
  .shqLanding__footer {
    margin-top: 2.5rem;
    padding: 2.5rem;
    font-size: 0.75rem;
    text-align: center;
    border-top: 1px solid #eee9f8; }
  .shqLanding__sidebar {
    z-index: 1000;
    position: fixed;
    top: 0;
    right: 0;
    height: 100vh;
    width: 300px;
    padding: 2rem;
    background: #8762DB;
    background-repeat: no-repeat;
    background-position: bottom right;
    box-shadow: rgba(0, 0, 0, 0.1) 0 0 45px; }
    @media only screen and (max-width: 667px) {
      .shqLanding__sidebar {
        position: relative;
        right: auto;
        height: auto;
        width: 100%; } }
  .shqLanding__register {
    display: block;
    padding: 2rem;
    background: #8762DB;
    border-radius: 1rem;
    max-height: 475px;
    box-shadow: rgba(135, 98, 219, 0.3) 0 10px 45px 0px; }
  .shqLanding__tile {
    display: block;
    margin-top: 1.5rem;
    background: #8762DB;
    border-radius: 1rem;
    box-shadow: rgba(135, 98, 219, 0.3) 0 10px 45px 0px;
    overflow: hidden; }
    .shqLanding__tile img {
      display: block; }
  .shqLanding__speakers {
    display: block;
    width: 100%; }
    .shqLanding__speakers .landing-speaker {
      display: block;
      width: 33%;
      padding-right: 2rem;
      float: left; }
      .shqLanding__speakers .landing-speaker__headshot {
        display: block;
        width: 100px;
        height: 100px;
        margin: 0 0 1rem 0;
        border-radius: 100%;
        overflow: hidden; }
        .shqLanding__speakers .landing-speaker__headshot img {
          display: block;
          width: 100%; }
  .shqLanding--thanks {
    width: 100%;
    overflow-x: hidden; }
    .shqLanding--thanks .shqLanding__hero {
      z-index: 20; }
    .shqLanding--thanks .shqLanding__testimonials {
      padding: 3rem; }
      .shqLanding--thanks .shqLanding__testimonials .section-background {
        top: -12.5rem; }

.shqCustomers section {
  position: relative;
  padding: 5rem 0; }
  .shqCustomers section:last-child {
    margin-bottom: 15rem; }
.shqCustomers .industry-nav {
  display: flex;
  flex: 0 1 auto;
  width: 100%;
  margin: 1rem 0;
  align-items: center;
  justify-content: center;
  text-align: center;
  background: #FFF;
  box-shadow: rgba(55, 45, 131, 0.25) 0 5px 25px -5px; }
  .shqCustomers .industry-nav__item {
    display: block;
    padding: 1.5rem;
    font-size: 0.75rem;
    color: #5b6770;
    font-weight: 500;
    text-transform: uppercase;
    border: 0;
    opacity: 0.75; }
    .shqCustomers .industry-nav__item:hover {
      opacity: 1; }
.shqCustomers__quotes {
  padding: 2rem 0;
  margin: 4rem 0 0 0; }
.shqCustomers__background {
  position: absolute;
  z-index: -1;
  border-radius: 5rem;
  transform: skewY(-5deg); }
  .customers-retailers .shqCustomers__background {
    bottom: 10rem;
    left: 50%;
    margin-left: -650px;
    width: 1300px;
    height: 650px;
    background: linear-gradient(90deg, #8762DB, #685bc7); }
    @media (max-width: 25.875em) {
      .customers-retailers .shqCustomers__background {
        height: 800px; } }
  .customers-travel .shqCustomers__background {
    top: 12rem;
    left: 0;
    width: 40%;
    height: 300px;
    background: linear-gradient(90deg, #FFF, #eee9f8); }
  .customers-finserv .shqCustomers__background {
    top: 10rem;
    right: 0;
    width: 40%;
    height: 300px;
    background: linear-gradient(90deg, #eee9f8, #FFF); }

.client-wall {
  display: flex;
  flex: 0 1 auto;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  text-align: center;
  max-width: 1080px;
  margin: 0 auto;
  margin-top: 15rem; }
  @media (max-width: 25.875em) {
    .client-wall {
      margin-top: 17.5rem; } }
  .client-wall__logo {
    flex-basis: 20%;
    max-width: 20%;
    padding: 0 2rem;
    margin-top: 3rem;
    opacity: 1; }
    .client-wall__logo img {
      max-width: 100%;
      max-height: 50px; }
  .client-wall:after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 17.5rem;
    background: linear-gradient(rgba(255, 255, 255, 0), #FFF); }

.shqPlatform section {
  position: relative; }
.shqPlatform__background {
  position: absolute;
  z-index: -1;
  border-radius: 5rem;
  transform: skewY(-5deg); }
  .platform-features .shqPlatform__background {
    top: 10rem;
    left: 50%;
    margin-left: -650px;
    width: 75rem;
    height: 72.5rem;
    background: linear-gradient(90deg, #8762DB, #685bc7);
    box-shadow: rgba(0, 0, 0, 0.1) 0 15px 30px, rgba(0, 0, 0, 0.1) 0 9px 18px -3px; }
    @media (max-width: 25.875em) {
      .platform-features .shqPlatform__background {
        height: 100rem;
        margin-left: -37.5rem; } }
.shqPlatform__mockup {
  transform-style: preserve-3d;
  text-align: center; }
.shqPlatform .platform-intro {
  margin-bottom: 15rem; }
.shqPlatform .platform-features {
  perspective-origin: 50% 40%;
  transform-style: preserve-3d;
  padding: 15rem 0 10rem 0;
  margin-top: 10rem; }
  .shqPlatform .platform-features__item {
    flex-basis: 50%;
    padding: 1rem 3rem 1rem 0; }
.shqPlatform .platform-integrations {
  padding: 5rem 0 10rem 0; }
  .shqPlatform .platform-integrations__logos {
    position: absolute;
    top: -5rem;
    left: 50%;
    height: 700px;
    width: 600px;
    margin-left: -650px;
    z-index: -1;
    background: url(/images/SHQ-integrations.png) repeat-y;
    background-size: contain; }
    .shqPlatform .platform-integrations__logos:before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background: linear-gradient(#FFF, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0), #FFF); }
.shqPlatform .platform-diagram {
  flex-basis: 40%;
  position: relative;
  text-align: center; }
  @media (max-width: 25.875em) {
    .shqPlatform .platform-diagram {
      display: block;
      width: 100%;
      margin-top: 10rem; } }
  .shqPlatform .platform-diagram__background {
    position: absolute;
    z-index: -1;
    border-radius: 5rem;
    transform: skewY(-5deg);
    top: -5rem;
    left: 0;
    width: 120%;
    height: 950px;
    background: #997adb;
    box-shadow: rgba(0, 0, 0, 0.1) 0 25px 45px, rgba(0, 0, 0, 0.1) 0 12px 24px -3px; }
    @media (max-width: 25.875em) {
      .shqPlatform .platform-diagram__background {
        height: 640px; } }
  .shqPlatform .platform-diagram__content {
    width: 110%;
    padding-left: 3rem; }
    @media (max-width: 25.875em) {
      .shqPlatform .platform-diagram__content {
        display: block;
        width: 100%; } }
.shqPlatform .platform-testimonial {
  position: relative;
  z-index: 100;
  margin-bottom: 5rem; }
  .shqPlatform .platform-testimonial .shqSite-card {
    background: #eee9f8; }
.shqPlatform .shqSite-text-subheading {
  margin-bottom: 3rem; }

.shqBlog {
  padding: 0 0 20rem; }
  @media (max-width: 25.875em) {
    .shqBlog {
      padding-top: 7.5rem; } }
  .shqBlog-nav {
    display: -webkit-box;
    display: -moz-box;
    display: box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    box-direction: normal;
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    flex-direction: row;
    -ms-flex-direction: row;
    -webkit-box-pack: end;
    -moz-box-pack: end;
    box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-justify-content: flex-end;
    -ms-justify-content: flex-end;
    -o-justify-content: flex-end;
    justify-content: flex-end;
    -ms-flex-pack: end; }
    .shqBlog-nav__item {
      display: inline-block;
      padding: 0 1rem;
      font-weight: 600;
      color: #8762DB;
      line-height: 40px;
      -webkit-transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1);
      -moz-transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1);
      transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1); }
      .shqBlog-nav__item a {
        display: block;
        color: inherit;
        border-bottom: none; }
        .shqBlog-nav__item a:hover {
          color: #997adb; }
      @media (max-width: 1120px) {
        .shqBlog-nav__item {
          padding: 0 0.5rem; } }
      @media (max-width: 995px) {
        .shqBlog-nav__item {
          font-size: 0.625rem; } }
  .shqBlog-header {
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    z-index: 0;
    padding: 4rem 0 2rem; }
    .shqBlog-header__background {
      position: absolute;
      z-index: -1;
      top: -7.5rem;
      width: 100%;
      min-width: 1250px;
      height: 20rem;
      background: #F5F6F9;
      border-radius: 2rem;
      transform: skewY(-2.5deg); }
      @media (max-width: 25.875em) {
        .shqBlog-header__background {
          height: 100rem;
          margin-left: -37.5rem; } }
    .shqBlog-header__drawer {
      position: absolute;
      z-index: -1;
      top: 0;
      width: 100%;
      height: 0.5rem;
      background: #8762DB; }
      .shqBlog-header__drawer .learn-more {
        display: inline-block;
        padding: 0.5rem 1rem;
        color: #FFF;
        font-size: 0.5rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.05rem;
        background: #8762DB;
        border-radius: 0.25rem; }
  .shqBlog-hero {
    display: block;
    position: relative;
    z-index: 1; }
    .shqBlog-hero__image {
      position: relative;
      display: flex;
      justify-content: center;
      align-items: center;
      width: 100%;
      height: 25rem;
      margin: 0 0 2rem 0;
      overflow: hidden;
      border-radius: 1rem;
      background: #8762DB;
      box-shadow: rgba(135, 98, 219, 0.3) 0 10px 45px 0px; }
      .shqBlog-hero__image img {
        min-height: 100%;
        min-width: 100%;
        transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
      .shqBlog-hero__image:hover img {
        transform: scale(1.025); }
      .shqBlog-hero__image .reading-time {
        position: absolute;
        bottom: 1rem;
        left: 1rem;
        padding: 0.5rem;
        color: #FFF;
        font-size: 0.5rem;
        font-weight: bold;
        text-transform: uppercase;
        background: #8762DB;
        border-radius: 0.25rem; }
    .shqBlog-hero__category {
      margin: 0 0 1rem 0;
      color: #8762DB;
      font-size: 0.75rem;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: 0.1rem; }
    .shqBlog-hero__title {
      margin: 0 0 1rem 0;
      color: #2F2149;
      font-size: 2.25rem;
      font-weight: 800; }
      .shqBlog-hero__title a {
        color: #2F2149; }
        .shqBlog-hero__title a:hover {
          text-decoration: underline; }
    .shqBlog-hero__desc {
      margin: 0 0 1rem 0; }
    .shqBlog-hero__author {
      color: rgba(47, 33, 73, 0.5);
      font-size: 0.75rem;
      font-weight: 600;
      text-transform: uppercase; }
  .shqBlog-posts {
    position: relative;
    z-index: 1; }
  .shqBlog-post {
    flex-basis: 33.333%;
    max-width: 33.333%;
    width: 33.333%;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    padding: 2rem;
    position: relative; }
    @media (max-width: 414px) {
      .shqBlog-post {
        flex-basis: 100%;
        max-width: 100%;
        width: 100%;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto; } }
    @media (min-width: 415px) and (max-width: 62.5em) {
      .shqBlog-post {
        flex-basis: 50%;
        max-width: 50%;
        width: 50%;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto; } }
    .shqBlog-post__image {
      position: relative;
      display: flex;
      justify-content: center;
      align-items: center;
      width: 100%;
      height: 12.5rem;
      margin: 0 0 1.5rem 0;
      overflow: hidden;
      border-radius: 1rem;
      background: #8762DB;
      box-shadow: rgba(135, 98, 219, 0.3) 0 10px 45px 0px; }
      .shqBlog-post__image img {
        height: 13rem;
        min-width: 100%;
        transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
        @media (max-width: 25.875em) {
          .shqBlog-post__image img {
            width: 100%;
            height: auto; } }
      .shqBlog-post__image:hover img {
        transform: scale(1.025); }
      .shqBlog-post__image .reading-time {
        position: absolute;
        bottom: 1rem;
        left: 1rem;
        padding: 0.5rem;
        color: #FFF;
        font-size: 0.5rem;
        font-weight: bold;
        text-transform: uppercase;
        background: #8762DB;
        border-radius: 0.25rem; }
    .shqBlog-post__category {
      margin: 0 0 1rem 0;
      color: #8762DB;
      font-size: 0.75rem;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: 0.1rem; }
    .shqBlog-post__title {
      margin: 0 0 1rem 0;
      color: #2F2149;
      font-size: 1.5rem;
      font-weight: 800; }
      .shqBlog-post__title a {
        color: #2F2149; }
        .shqBlog-post__title a:hover {
          text-decoration: underline; }
    .shqBlog-post__author {
      color: rgba(47, 33, 73, 0.5);
      font-size: 0.75rem;
      font-weight: 600;
      text-transform: uppercase; }
  .shqBlog-article__image {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 30rem;
    margin: 0 0 2rem 0;
    overflow: hidden;
    border-radius: 1rem;
    background: #8762DB;
    box-shadow: rgba(135, 98, 219, 0.3) 0 10px 45px 0px; }
    .shqBlog-article__image img {
      width: 100%;
      transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
      @media (max-width: 25.875em) {
        .shqBlog-article__image img {
          width: auto;
          height: 100%; } }
    .shqBlog-article__image:hover img {
      transform: scale(1.025); }
    @media (max-width: 25.875em) {
      .shqBlog-article__image {
        height: 15rem; } }
    .shqBlog-article__image .reading-time {
      position: absolute;
      bottom: 1rem;
      left: 1rem;
      padding: 0.5rem;
      color: #FFF;
      font-size: 0.5rem;
      font-weight: bold;
      text-transform: uppercase;
      background: #8762DB;
      border-radius: 0.25rem; }
  .shqBlog-article__category {
    margin: 0 0 1rem 0;
    color: #8762DB;
    font-size: 0.75rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.1rem; }
  .shqBlog-article__title {
    margin: 0 0 1rem 0;
    color: #2F2149;
    font-size: 2.25rem;
    font-weight: 800; }
    .shqBlog-article__title a {
      color: #2F2149; }
      .shqBlog-article__title a:hover {
        text-decoration: underline; }
  .shqBlog-article__author {
    margin: 0 0 2rem 0;
    color: rgba(47, 33, 73, 0.5);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase; }
  .shqBlog-article__content a {
    font-weight: 400; }
    .shqBlog-article__content a:hover {
      color: #00BCE3;
      text-decoration: underline; }
  .shqBlog-article__content img {
    width: 110%;
    margin-left: -5%;
    box-shadow: rgba(135, 98, 219, 0.3) 0 10px 45px 0px; }
  .shqBlog-article__content h2 {
    margin: 2rem 0 1rem;
    color: #2F2149;
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1.2; }
  .shqBlog-article__content h3 {
    margin: 2rem 0 1rem;
    color: #2F2149;
    font-size: 1.125rem;
    font-weight: 800;
    line-height: 1.2; }
  .shqBlog-article__content h4 {
    margin: 1.5rem 0 0.5rem;
    color: #2F2149;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.2; }
  .shqBlog-article__content p {
    line-height: 1.618;
    margin-bottom: 1.667rem; }
  .shqBlog-article__content blockquote {
    display: block;
    margin: 0 0 1.5rem 0;
    padding: 1.5rem 2rem;
    color: #8762DB;
    font-size: 2.25rem;
    font-weight: 800;
    border-left: 5px solid #8762DB; }
  .shqBlog-article__content ul {
    margin-bottom: 1.667rem;
    font-size: 1rem;
    font-weight: 300;
    color: #5A5070;
    padding: 0;
    list-style: none; }
    .shqBlog-article__content ul li {
      position: relative;
      margin: 0 0 1rem 0;
      padding-left: 1.5rem;
      line-height: 1.618; }
      .shqBlog-article__content ul li:before {
        content: "";
        position: absolute;
        top: 0.4rem;
        left: 0.25rem;
        height: 0.5rem;
        width: 0.5rem;
        background: #685bc7;
        border-radius: 50%; }
    .shqBlog-article__content ul:not(:first-child) {
      margin-top: 1rem; }
  .shqBlog-article__content ol {
    margin-bottom: 1.667rem;
    font-size: 1rem;
    font-weight: 300;
    color: #5A5070;
    padding: 0;
    list-style: none; }
    .shqBlog-article__content ol li {
      position: relative;
      counter-increment: item;
      margin: 0 0 1rem 0;
      padding-left: 1.5rem;
      line-height: 1.618; }
      .shqBlog-article__content ol li:before {
        content: counter(item);
        position: absolute;
        left: 0.25rem;
        color: #685bc7;
        font-weight: 800; }
    .shqBlog-article__content ol:not(:first-child) {
      margin-top: 1rem; }
  .shqBlog-sidebar {
    position: sticky;
    top: 2rem; }
  .shqBlog-signup {
    z-index: 0;
    position: relative;
    width: 100%;
    min-height: 19rem;
    padding: 2rem;
    margin: 0 0 2rem 0;
    background: #8762DB;
    border-radius: 1rem;
    box-shadow: rgba(135, 98, 219, 0.3) 0 10px 45px 0px; }
    .shqBlog-signup__title {
      margin: 0 0 0.5rem 0;
      color: #FFF;
      font-size: 1.125rem;
      font-weight: 800;
      line-height: 1.2; }
    .shqBlog-signup__desc {
      margin: 0 0 1rem 0;
      color: #FFF;
      font-size: 0.75rem;
      line-height: 1.618; }
    .shqBlog-signup__background {
      z-index: -1;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background-image: url("/images/svg/large-email.svg");
      background-repeat: no-repeat;
      background-position: 75px -20px;
      background-size: cover;
      border-radius: 1rem; }
    .shqBlog-signup__form {
      text-align: center; }
      .shqBlog-signup__form iframe {
        overflow: hidden; }
  .shqBlog-tile {
    width: 100%;
    height: 300px; }
    .shqBlog-tile__image {
      background: #FFF;
      border-radius: 1rem;
      overflow: hidden;
      box-shadow: rgba(135, 98, 219, 0.3) 0 10px 45px 0px; }
      .shqBlog-tile__image img {
        display: block;
        width: 100%;
        transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
      .shqBlog-tile__image:hover img {
        transform: scale(1.025); }
  .shqBlog-resource {
    width: 100%;
    height: 300px;
    background: #00BCE3;
    padding: 2rem;
    border-radius: 1rem;
    box-shadow: rgba(135, 98, 219, 0.3) 0 10px 45px 0px; }
    .shqBlog-resource__image {
      background: #FFF;
      border-radius: 1rem;
      overflow: hidden;
      box-shadow: rgba(135, 98, 219, 0.3) 0 10px 45px 0px; }
      .shqBlog-resource__image img {
        display: block;
        width: 100%;
        transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
      .shqBlog-resource__image:hover img {
        transform: scale(1.025); }
  .shqBlog-featured__title {
    color: rgba(47, 33, 73, 0.5);
    font-size: 0.75rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.1rem; }
  .shqBlog-featured__link {
    display: block;
    padding: 1.5rem 0;
    color: #2F2149;
    font-size: 0.75rem;
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
    .shqBlog-featured__link:hover {
      color: inherit;
      text-decoration: underline; }
  @media (max-width: 25.875em) {
    .shqBlog-featured {
      display: none; } }
  .shqBlog-poster {
    flex-basis: 33.333%;
    max-width: 33.333%;
    width: 33.333%;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    padding: 2rem;
    position: relative; }
    .shqBlog-poster__image {
      background: #FFF;
      border-radius: 1rem;
      overflow: hidden;
      box-shadow: rgba(135, 98, 219, 0.3) 0 10px 45px 0px; }
      .shqBlog-poster__image img {
        display: block;
        width: 100%;
        transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
      .shqBlog-poster__image:hover img {
        transform: scale(1.025); }
    @media (max-width: 25.875em) {
      .shqBlog-poster {
        flex-basis: 100%;
        max-width: 100%;
        width: 100%;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto; } }
    @media (min-width: 25.875em) and (max-width: 62.5em) {
      .shqBlog-poster {
        flex-basis: 50%;
        max-width: 50%;
        width: 50%;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto; } }
  .shqBlog-share a {
    text-align: center;
    font-size: 2rem;
    color: rgba(47, 33, 73, 0.5);
    border: none;
    -webkit-transition: all 0.1s ease;
    -moz-transition: all 0.1s ease;
    transition: all 0.1s ease; }
    .shqBlog-share a:hover {
      color: #8762DB; }
  .shqBlog-search {
    position: relative;
    float: right;
    padding: 2rem 1rem; }
    .shqBlog-search input[type=search] {
      height: 2rem;
      width: 2rem;
      color: transparent;
      background-color: transparent;
      border: 2px solid transparent;
      border-radius: 1rem;
      cursor: pointer;
      outline: none;
      background-image: url("/images/search-icon.png");
      background-size: 1rem 1rem;
      background-position: 0.5rem;
      background-repeat: no-repeat;
      transition: width 0.2s cubic-bezier(0, 0, 0.2, 1); }
      .shqBlog-search input[type=search]:hover {
        background-color: white; }
      .shqBlog-search input[type=search]:focus {
        width: 10rem;
        padding-left: 2rem;
        color: #000;
        background-color: #fff;
        background-image: url("/images/search-icon-active.png");
        border-color: #00BCE3;
        cursor: auto; }
    .shqBlog-search input:-moz-placeholder {
      color: transparent; }
    .shqBlog-search input::-webkit-input-placeholder {
      color: transparent; }

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