@charset "UTF-8";

/**
 * #SETTINGS
 */

/*!
 * inuitcss, by @csswizardry
 *
 * github.com/inuitcss | inuitcss.com
 */

/**
 * #TOOLS
 */

/*------------------------------------*    #ALIASES
\*------------------------------------*/

/**
 * #GENERIC
 */

/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */

/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS and IE text size adjust after device 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/10/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 of focused elements when they are also in an
 * active/hover state.
 */

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 {
  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.
 */

input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  box-sizing: content-box;
  /* 2 */
}

/**
 * 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;
}

/*------------------------------------*    #RESET
\*------------------------------------*/

/**
 * As well as using normalize.css, it is often advantageous to remove all
 * margins from certain elements.
 */

body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
dl,
dd,
ol,
ul,
form,
fieldset,
legend,
figure,
table,
th,
td,
caption,
hr {
  margin: 0;
  padding: 0;
}

/**
 * Give a help cursor to elements that give extra info on `:hover`.
 */

abbr[title],
dfn[title] {
  cursor: help;
}

/**
 * Remove underlines from potentially troublesome elements.
 */

u,
ins {
  text-decoration: none;
}

/**
 * Apply faux underlines to inserted text via `border-bottom`.
 */

ins {
  border-bottom: 1px solid;
}

/*------------------------------------*    #BOX-SIZING
\*------------------------------------*/

/**
 * Set the global `box-sizing` state to `border-box`.
 *
 * css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice
 * paulirish.com/2012/box-sizing-border-box-ftw
 */

html {
  box-sizing: border-box;
}

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

/*------------------------------------*    #SHARED
\*------------------------------------*/

/**
 * Where `margin-bottom` is concerned,this value will be the same as the
 * base line-height. This allows us to keep a consistent vertical rhythm.
 * As per: csswizardry.com/2012/06/single-direction-margin-declarations
 */

h1,
h2,
h3,
h4,
h5,
h6,
ul,
ol,
dl,
blockquote,
p,
address,
hr,
table,
fieldset,
figure,
pre {
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
}

/**
 * Where `margin-left` is concerned we want to try and indent certain elements
 * by a consistent amount. Define that amount once,here.
 */

ul,
ol,
dd {
  margin-left: 48px;
  margin-left: 3rem;
}

/**
 * #BASE
 */

/*------------------------------------*    #PAGE
\*------------------------------------*/

/**
 * High-, page-level styling.
 *
 * 1. Set the default `font-size` and `line-height` for the entire project,
 *    sourced from our default variables. The `font-size` is calculated to exist
 *    in ems, the `line-height` is calculated to exist unitlessly.
 * 2. Force scrollbars to always be visible to prevent awkward ‘jumps’ when
 *    navigating between pages that do/do not have enough content to produce
 *    scrollbars naturally.
 * 3. Ensure the page always fills at least the entire height of the viewport.
 * 4. Prevent certain mobile browsers from automatically zooming fonts.
 * 5. Fonts on OSX will look more consistent with other systems that do not
 *    render text using sub-pixel anti-aliasing.
 */

html {
  font-size: 1em;
  /* [1] */
  line-height: 1.5;
  /* [1] */
  background-color: #fff;
  color: #17313C;
  overflow-y: scroll;
  /* [2] */
  min-height: 100%;
  /* [3] */
  -webkit-text-size-adjust: 100%;
  /* [4] */
  -ms-text-size-adjust: 100%;
  /* [4] */
  -moz-osx-font-smoothing: grayscale;
  /* [5] */
  -webkit-font-smoothing: antialiased;
  /* [5] */
}

/*------------------------------------*    #PAGE
\*------------------------------------*/

html {
  font-family: "Gotham A", "Gotham B", sans-serif;
  font-weight: 400;
}

body {
  height: 100%;
  position: relative;
}

button,
input[type="text"],
input[type="search"],
input[type="password"],
input[type="email"],
input[type="file"],
input[type="number"],
input[type="tel"],
input[type="submit"],
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
}

/*------------------------------------*    #TYPE
\*------------------------------------*/

/**
 * Typographical base selectors.
 */

b,
strong {
  font-weight: 500;
}

p,
ul,
ol {
  font-size: 16px;
  font-size: 1rem;
  line-height: 1.5;
}

a {
  color: #cc0070;
  text-decoration: none;
}

/*------------------------------------*    #HEADINGS
\*------------------------------------*/

/**
 * Headings 1–6.
 */

h1 {
  font-size: 48px;
  font-size: 3rem;
  line-height: 1;
}

h2 {
  font-size: 36px;
  font-size: 2.25rem;
  line-height: 1.3333333333;
}

h3 {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 1;
}

h4 {
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 1.2;
}

h5 {
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1.3333333333;
}

h6 {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.7142857143;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Gotham A", "Gotham B", sans-serif;
  font-weight: 500;
  text-transform: uppercase;
  margin-bottom: 36px;
  letter-spacing: 1.5px;
}

h3,
h4,
h5 {
  margin-bottom: 24px;
}

h3 {
  line-height: 1.2;
}

@media screen and (max-width: 44.9375em) {
  h2 {
    font-size: 26px;
    font-size: 1.625rem;
    line-height: 1.2;
  }
}

/*------------------------------------*    #LISTS
\*------------------------------------*/

/**
 * Remove extra vertical spacing when nesting lists.
 */

li > ul,
li > ol {
  margin-bottom: 0;
}

/*------------------------------------*    #IMAGES
\*------------------------------------*/

/**
 * 1. Fluid images for responsive purposes.
 * 2. Offset `alt` text from surrounding copy.
 * 3. Setting `vertical-align` removes the whitespace that appears under `img`
 *    elements when they are dropped into a page as-is. Safer alternative to
 *    using `display: block;`.
 */

img {
  max-width: 100%;
  /* [1] */
  font-style: italic;
  /* [2] */
  vertical-align: middle;
  /* [3] */
}

/**
 * 1. Google Maps breaks if `max-width: 100%` acts upon it; use their selector
 *    to remove the effects.
 * 2. If a `width` and/or `height` attribute have been explicitly defined, let’s
 *    not make the image fluid.
 */

.gm-style img,
img[width],
img[height] {
  /* [2] */
  max-width: none;
}

/*------------------------------------*    #PARAGRAPHS
\*------------------------------------*/

/**
 * The `.lede` class is used to make the introductory text (usually a paragraph)
 * of a document slightly larger: en.wikipedia.org/wiki/Lede_(news)
 */

.lede {
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1.3333333333;
}

/* ==========================================================================
   Objects
   ========================================================================== */

/* Block Object
   ========================================================================== */

/* Variables */

/*------------------------------------*    #BLOCK
\*------------------------------------*/

/**
 * The block object simply stacks an image on top of some text-like content.
 */

/**
 * Stacked image-with-text object. A simple abstraction to cover a very commonly
 * occurring design pattern.
 */

.block {
  display: block;
}

/**
     * 1. Eliminate whitespace around images.
     */

.block__img {
  vertical-align: middle;
  /* [1] */
  margin-bottom: 24px;
  /**
             * No space between the image and the text content.
             */
  /**
             * Small space between the image and the text content.
             */
  /**
             * Large space between the image and the text content.
             */
}

.block--flush > .block__img {
  margin-bottom: 0;
}

.block--small > .block__img {
  margin-bottom: 12px;
}

.block--large > .block__img {
  margin-bottom: 48px;
}

/**
     * Text-content.
     */

.block__body {
  display: block;
}

/**
     * Center-aligned blocks.
     */

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

/* Box Object
   ========================================================================== */

/* Variables */

/*------------------------------------*    #BOX
\*------------------------------------*/

/**
 * The box object simply boxes off content.
 */

/**
 * 1. So we can apply the `.box` class to naturally-inline elements.
 */

.box {
  display: block;
  /* [1] */
  padding: 24px;
}

.box > :last-child {
  margin-bottom: 0;
}

/**
     * Flush (i.e. no padding) box.
     */

.box--flush {
  padding: 0;
}

/**
     * Tiny box.
     */

.box--tiny {
  padding: 6px;
}

/**
     * Small box.
     */

.box--small {
  padding: 12px;
}

/**
     * Large box.
     */

.box--large {
  padding: 36px;
}

/**
     * Huge box.
     */

.box--huge {
  padding: 96px;
}

/* Button Object
   ========================================================================== */

/* Variables */

/*------------------------------------*    #BUTTONS
\*------------------------------------*/

/**
 * A simple button object.
 */

/**
 * 1. Allow us to style box model properties.
 * 2. Line different sized buttons up a little nicer.
 * 3. Make buttons inherit font styles (often necessary when styling `input`s as
 *    buttons).
 * 4. Reset/normalize some styles.
 * 5. Force all button-styled elements to appear clickable.
 * 6. Fixes odd inner spacing in IE7.
 * 7. Subtract the border size from the padding value so that buttons do not
 *    grow larger as we add borders.
 */

.btn {
  display: inline-block;
  /* [1] */
  vertical-align: middle;
  /* [2] */
  font: inherit;
  /* [3] */
  text-align: center;
  /* [4] */
  margin: 0;
  /* [4] */
  cursor: pointer;
  /* [5] */
  overflow: visible;
  /* [6] */
  padding: 12px 24px;
  /* [7] */
  background-color: #57407E;
  border: none;
  /* [4] */
}

.btn,
.btn:hover,
.btn:active,
.btn:focus {
  text-decoration: none;
  /* [4] */
  color: #fff;
}

/**
 * Fix a Firefox bug whereby `input type="submit"` gains 2px extra padding.
 */

.btn::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/**
     * Small buttons.
     */

.btn--small {
  padding: 6px 12px;
  /* [7] */
}

/**
     * Large buttons.
     */

.btn--large {
  padding: 24px 48px;
  /* [7] */
}

.btn {
  text-transform: uppercase;
  font-weight: 500;
}

/* Flag Object
   ========================================================================== */

/* Variables */

/*------------------------------------*    #FLAG
\*------------------------------------*/

/**
 * The flag object is a design pattern similar to the media object, however it
 * utilises `display: table[-cell];` to give us control over the vertical
 * alignments of the text and image. csswizardry.com/2013/05/the-flag-object
 */

/**
 * 1. Allows us to control vertical alignments
 * 2. Force the object to be the full width of its parent. Combined with [1],
 *    this makes the object behave in a quasi-`display: block;` manner.
 */

.flag {
  display: table;
  /* [1] */
  width: 100%;
  /* [2] */
}

/**
     * Items within a flag object. There should only ever be one of each.
     *
     * 1. Default to aligning content to their middles.
     */

.flag__img,
.flag__body {
  display: table-cell;
  vertical-align: middle;
  /* [1] */
}

/**
     * Flag images have a space between them and the body of the object.
     */

.flag__img {
  padding-right: 24px;
}

.flag__img > img {
  display: block;
  max-width: none;
}

/**
     * The container for the main content of the flag object.
     *
     * 1. Forces the `.flag__body` to take up all remaining space.
     */

.flag__body {
  width: 100%;
  /* [1] */
}

.flag__body,
.flag__body > :last-child {
  margin-bottom: 0;
}

/**
     * Small flags.
     */

.flag--small {
  /**
             * Small reversed flags.
             */
}

.flag--small > .flag__img {
  padding-right: 12px;
}

.flag--small.flag--rev > .flag__img {
  padding-right: 0;
  padding-left: 12px;
}

/**
     * Reversed flag objects have their image-content to the right, and text-content
     * to the left.
     *
     * 1. Swap the rendered direction of the object…
     * 2. …and reset it.
     * 3. Reassign margins to the correct sides.
     */

.flag--rev {
  direction: rtl;
  /* [1] */
}

.flag--rev > .flag__img,
.flag--rev > .flag__body {
  direction: ltr;
  /* [2] */
}

.flag--rev > .flag__img {
  padding-right: 0;
  /* [3] */
  padding-left: 24px;
  /* [3] */
}

/**
     * Vertically top aligned flag objects.
     */

.flag--top > .flag__img,
.flag--top > .flag__body {
  vertical-align: top;
}

/**
     * Responsive flag objects.
     *
     * There is a very pragmatic, simple implementation of a responsive flag
     * object, which simply places the text-content beneath the image-content.
     *
     * We use a `max-width` media query because:
     *
     * a) it is the least verbose method in terms of amount of code required.
     * b) the flag object’s default state is image-next-to-text, so its stacked
     *    state is the exception, rather than the rule.
     */

@media screen and (max-width: 720px) {
  .flag--responsive {
    /**
                 * Disable reversal of content because there is no concept of
                 * ‘reversed’ in a stacked layout.
                 */
    direction: ltr;
    /**
             * Rework the spacings on regular flag objects.
             */
    /**
                 * Small responsive flags.
                 *
                 * Take a little more heavy-handed approach to reworking
                 * spacings on flags that are also small flags in their regular
                 * state.
                 */
  }

  .flag--responsive,
  .flag--responsive > .flag__img,
  .flag--responsive > .flag__body {
    display: block;
  }

  .flag--responsive > .flag__img {
    padding-right: 0;
    padding-left: 0;
    margin-bottom: 24px;
  }

  .flag--responsive.flag--small > .flag__img {
    padding-right: 0;
    padding-left: 0;
    margin-bottom: 12px;
  }
}

/* Layout Object
   ========================================================================== */

/* Variables */

/*------------------------------------*    #LAYOUT
\*------------------------------------*/

/**
 * The inuitcss layout system uses `box-sizing: border-box;` and
 * `display: inline-block;` to create an extremely powerful, flexible
 * alternative to the traditional grid system. Combine the layout items with
 * the widths found in `trumps.widths`.
 */

/**
 * Begin a layout group.
 */

.layout {
  list-style: none;
  margin: 0;
  padding: 0;
  margin-left: -24px;
}

/**
     * 1. Cause columns to stack side-by-side.
     * 2. Space columns apart.
     * 3. Align columns to the tops of each other.
     * 4. Full-width unless told to behave otherwise.
     * 5. Required to combine fluid widths and fixed gutters.
     */

.layout__item {
  display: inline-block;
  /* [1] */
  padding-left: 24px;
  /* [2] */
  vertical-align: top;
  /* [3] */
  width: 100%;
  /* [4] */
}

/**
     * Layouts with tiny gutters.
     */

.layout--tiny {
  margin-left: -6px;
}

.layout--tiny > .layout__item {
  padding-left: 6px;
}

/**
     * Layouts with small gutters.
     */

.layout--small {
  margin-left: -12px;
}

.layout--small > .layout__item {
  padding-left: 12px;
}

/**
     * Layouts with large gutters.
     */

.layout--large {
  margin-left: -48px;
}

.layout--large > .layout__item {
  padding-left: 48px;
}

/**
     * Layouts with huge gutters.
     */

.layout--huge {
  margin-left: -96px;
}

.layout--huge > .layout__item {
  padding-left: 96px;
}

/**
     * Layouts with no gutters.
     */

.layout--flush {
  margin-left: 0;
}

.layout--flush > .layout__item {
  padding-left: 0;
}

/**
     * Reversed rendered order of layout items, e.g. items 1, 2, 3, 4 in your
     * markup will display in order 4, 3, 2, 1 on your page.
     */

.layout--rev {
  direction: rtl;
  text-align: left;
}

.layout--rev > .layout__item {
  direction: ltr;
  text-align: left;
}

/**
     * Align layout items to the vertical centers of each other.
     */

.layout--middle > .layout__item {
  vertical-align: middle;
}

/**
     * Align layout items to the vertical bottoms of each other.
     */

.layout--bottom > .layout__item {
  vertical-align: bottom;
}

/**
     * Make the layout items fill up from the right hand side.
     */

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

.layout--right > .layout__item {
  text-align: left;
}

/**
     * Make the layout items fill up from the center outward.
     */

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

.layout--center > .layout__item {
  text-align: left;
}

/**
     * Cause layout items to take up a non-explicit amount of width.
     */

.layout--auto > .layout__item {
  width: auto;
}

/* List Bare Object
   ========================================================================== */

/*------------------------------------*    #LIST-BARE
\*------------------------------------*/

/**
 * The list-bare object simply removes any indents and bullet points from lists.
 */

.list-bare {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* List Block Object
   ========================================================================== */

/*------------------------------------*    #LIST-BLOCK
\*------------------------------------*/

/**
 * The list-block object creates blocky list items out of a `ul` or `ol`.
 */

.list-block {
  margin: 0;
  padding: 0;
  list-style: none;
}

.list-block__item,
.list-block > li {
  padding: 24px;
}

/* List Inline Object
   ========================================================================== */

/*------------------------------------*    #LIST-INLINE
\*------------------------------------*/

/**
 * The list-inline object simply displays a list of items in one line.
 */

.list-inline {
  margin: 0;
  padding: 0;
  list-style: none;
}

.list-inline > li {
  display: inline-block;
}

/* List UI Object
   ========================================================================== */

/*------------------------------------*    #LIST-UI
\*------------------------------------*/

/**
 * The UI list object creates blocky list items with a keyline separator out of
 * a `ul` or `ol`.
 */

.list-ui,
.list-ui__item,
.list-ui > li {
  border: 0 solid #ccc;
}

.list-ui {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top-width: 1px;
}

.list-ui__item,
.list-ui > li {
  padding: 24px;
  border-bottom-width: 1px;
}

/* Media Object
   ========================================================================== */

/* Variables */

/*------------------------------------*    #MEDIA
\*------------------------------------*/

/**
 * Place any image- and text-like content side-by-side, as per:
 * stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code
 */

.media {
  display: block;
}

.media__img {
  float: left;
  margin-right: 24px;
}

.media__img > img {
  display: block;
}

.media__body {
  overflow: hidden;
  display: block;
}

.media__body,
.media__body > :last-child {
  margin-bottom: 0;
}

/* Pack Object
   ========================================================================== */

/* Variables */

/*------------------------------------*    #PACK
\*------------------------------------*/

/**
 * The pack object simply causes any number of elements pack up horizontally to
 * automatically fill an equal, fluid width of their parent.
 */

/**
 * 1. Fill all available space.
 * 2. Cause children to be automatically equally sized.
 */

.pack {
  width: 100%;
  /* [1] */
  display: table;
  table-layout: fixed;
  /* [2] */
}

/**
     * Cause children to adopt table-like structure.
     */

.pack__item {
  display: table-cell;
  /**
             * All items are aligned to the middles of each other.
             */
}

.pack--middle > .pack__item {
  vertical-align: middle;
}

/* Tables Object
   ========================================================================== */

/* Variables */

/*------------------------------------*    #TABLES
\*------------------------------------*/

.table {
  width: 100%;
}

/* Tabs Object
   ========================================================================== */

/*------------------------------------*    #TABS
\*------------------------------------*/

/**
 * A simple abstraction for making equal-width navigation tabs.
 */

/**
 * 1. Reset any residual styles (most likely from lists).
 * 2. Tables for layout!
 * 3. Force all `table-cell` children to have equal widths.
 * 4. Force the object to be the full width of its parent. Combined with [2],
 *    this makes the object behave in a quasi-`display: block;` manner.
 */

.tabs {
  margin: 0;
  /* [1] */
  padding: 0;
  /* [1] */
  list-style: none;
  /* [1] */
  display: table;
  /* [2] */
  table-layout: fixed;
  /* [3] */
  width: 100%;
  /* [4] */
  text-align: center;
}

.tabs__item {
  display: table-cell;
  /* [2] */
}

.tabs__link {
  display: block;
}

/* Wrapper Object
   ========================================================================== */

/*------------------------------------*    #WRAPPERS
\*------------------------------------*/

.wrapper {
  max-width: 1200px;
  margin: 0 auto;
  padding-right: 24px;
  padding-left: 24px;
}

@media screen and (min-width: 45em) {
  .wrapper {
    padding-right: 24px;
    padding-left: 24px;
  }
}

@media screen and (min-width: 45em) {
  .lap-and-up-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    padding-right: 24px;
    padding-left: 24px;
  }
}

/* Inputs Object
   ========================================================================== */

/* Variables */

/*------------------------------------*    #INPUTS
\*------------------------------------*/

/**
 * 
 * 
 */

.label {
  font-size: 16px;
  color: #17313C;
  cursor: pointer;
  display: block;
  font-weight: 400;
  line-height: 24px;
  margin-bottom: 0;
}

.label--inline {
  display: inline-block;
}

.input {
  background-color: #fff;
  font-family: inherit;
  border: 2px solid #E9EAEC;
  border-radius: 0;
  color: #17313C;
  display: block;
  font-size: 18px;
  margin: 0 0 24px 0;
  padding: 12px;
  height: 54px;
  width: 100%;
}

.input:focus {
  background: #fff;
  border-color: #ccc;
  outline: none;
}

.input[disabled],
fieldset[disabled] .input {
  background-color: #ccc;
}

.input--textarea {
  height: 200px;
}

.input--select {
  -webkit-appearance: none !important;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iM3B4IiB2aWV3Qm94PSIwIDAgNiAzIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA2IDMiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwb2x5Z29uIHBvaW50cz0iNS45OTIsMCAyLjk5MiwzIC0wLjAwOCwwICIvPjwvc3ZnPg==");
  background-repeat: no-repeat;
  background-position: 97% center;
}

.input--small {
  margin: 0 0 12px 0;
  padding: 6px 12px;
  height: 36px;
}

.input::-webkit-input-placeholder {
  color: #17313C;
}

.input::-moz-placeholder {
  color: #17313C;
}

.input:-ms-input-placeholder {
  color: #17313C;
}

.input::placeholder {
  color: #17313C;
}

/* Icon Object
   ========================================================================== */

/*------------------------------------*    #ICON
\*------------------------------------*/

/**
 * Icon left, text right.
 *
<div class="icon">
    <i class="i i--home"></i>
    <span class="icon__text">Lorem ipsum dolor sit</span>
</div>
 *
 * Define width and height for .i in your stylesheet.
 *
 */

.icon {
  display: inline-block;
}

.icon .i {
  display: inline-block;
  margin-right: 12px;
  vertical-align: middle;
}

.icon__text {
  display: inline-block;
  vertical-align: middle;
}

/**
     * Icon right, text left.
     *
    <div class="icon">
        <span class="icon__text">Lorem ipsum dolor sit</span>
        <i class="i i--home"></i>
    </div>
     *
     */

.icon--rev > .i {
  margin-left: 12px;
  margin-right: 0;
}

/* ==========================================================================
   Components
   ========================================================================== */

/* Slider */

.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
}

.slick-track:before,
.slick-track:after {
  content: "";
  display: table;
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}

[dir="rtl"] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

/* Slider */

.slick-loading .slick-list {
  background: #fff url("/imagesajax-loader.gif") center center no-repeat;
}

/* Icons */

@font-face {
  font-family: "slick";
  src: url("/fonts/slick.eot");
  src: url("/fonts/slick.eot?#iefix") format("embedded-opentype"), url("/fonts/slick.woff") format("woff"), url("/fonts/slick.ttf") format("truetype"), url("/fonts/slick.svg#slick") format("svg");
  font-weight: normal;
  font-style: normal;
}

/* Arrows */

.slick-prev,
.slick-next {
  position: absolute;
  display: block;
  height: 20px;
  width: 20px;
  line-height: 0px;
  font-size: 0px;
  cursor: pointer;
  background: transparent;
  color: transparent;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  padding: 0;
  border: none;
  outline: none;
}

.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
  outline: none;
  background: transparent;
  color: transparent;
}

.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
  opacity: 1;
}

.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
  opacity: 0.25;
}

.slick-prev:before,
.slick-next:before {
  font-family: "slick";
  font-size: 20px;
  line-height: 1;
  color: #E9EAEC;
  opacity: 0.75;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.slick-prev {
  left: -25px;
}

[dir="rtl"] .slick-prev {
  left: auto;
  right: -25px;
}

.slick-prev:before {
  content: "←";
}

[dir="rtl"] .slick-prev:before {
  content: "→";
}

.slick-next {
  right: -25px;
}

[dir="rtl"] .slick-next {
  left: -25px;
  right: auto;
}

.slick-next:before {
  content: "→";
}

[dir="rtl"] .slick-next:before {
  content: "←";
}

/* Dots */

.slick-dotted.slick-slider {
  margin-bottom: 30px;
}

.slick-dots {
  position: absolute;
  bottom: -25px;
  list-style: none;
  display: block;
  text-align: center;
  padding: 0;
  margin: 0;
  width: 100%;
}

.slick-dots li {
  position: relative;
  display: inline-block;
  height: 20px;
  width: 20px;
  margin: 0 5px;
  padding: 0;
  cursor: pointer;
}

.slick-dots li button {
  border: 0;
  background: transparent;
  display: block;
  height: 20px;
  width: 20px;
  outline: none;
  line-height: 0px;
  font-size: 0px;
  color: transparent;
  padding: 5px;
  cursor: pointer;
}

.slick-dots li button:hover,
.slick-dots li button:focus {
  outline: none;
}

.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
  opacity: 1;
}

.slick-dots li button:before {
  position: absolute;
  top: 0;
  left: 0;
  content: "•";
  width: 20px;
  height: 20px;
  font-family: "slick";
  font-size: 24px;
  line-height: 20px;
  text-align: center;
  color: #fff;
  opacity: 0.25;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.slick-dots li.slick-active button:before {
  color: #fff;
  opacity: 0.75;
}

.i {
  display: inline-block;
}

/*------------------------------------*    #BANDS
\*------------------------------------*/

.c-band {
  padding-top: 24px;
  padding-bottom: 24px;
}

@media screen and (min-width: 64em) {
  .c-band {
    padding-top: 48px;
    padding-bottom: 48px;
  }
}

.c-band--small {
  padding-top: 12px;
  padding-bottom: 12px;
}

.c-band--medium {
  padding-top: 36px;
  padding-bottom: 36px;
}

.c-band--large {
  padding-top: 48px;
  padding-bottom: 48px;
}

.c-band--huge {
  padding-top: 48px;
  padding-bottom: 48px;
}

@media screen and (min-width: 64em) {
  .c-band--huge {
    padding-top: 96px;
    padding-bottom: 96px;
  }
}

.c-band--image {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: cover;
}

.c-band--mountains {
  background-position: 50% bottom;
  background-repeat: no-repeat;
  background-image: url(/images/mountain-transparent.svg);
  background-size: 100% auto;
}

.c-band--pattern-1 {
  background-position: 0 0;
  background-repeat: repeat;
  background-image: url(/images/pattern-one.jpg);
}

.c-header {
  padding: 24px 0;
  background-color: #57407E;
  position: relative;
}

@media screen and (min-width: 45em) {
  .c-header {
    padding: 48px 0;
  }
}

.c-header__hamburger {
  position: absolute;
  top: 17px;
  right: 0;
  width: 40px;
  height: 40px;
  background-position: 50% 50%;
  display: inline-block;
  z-index: 5;
  cursor: pointer;
}

@media screen and (min-width: 45em) {
  .c-header__hamburger {
    display: none;
  }
}

.c-header__hamburger .c-header__hamburger-icon,
.c-header__hamburger .c-header__cross-icon {
  width: 40px;
  height: 40px;
  background-position: 50% 50%;
}

.c-header__hamburger .c-header__cross-icon {
  display: none;
}

.c-header__hamburger.is-open .c-header__hamburger-icon {
  display: none;
}

.c-header__hamburger.is-open .c-header__cross-icon {
  display: inline-block;
}

.c-header__text-logo {
  /*color: $white;
        @include font-size(32px, 1);
        margin-bottom: 0;
        text-decoration: none;
        text-transform: uppercase;
        font-weight: $bold;*/
}

@media only screen and (max-width: 460px) {
  .c-header__text-logo {
    display: inline-block;
    margin-right: 24px;
  }

  .c-header__text-logo img {
    width: 100%;
    height: auto;
  }
}

@media screen and (max-width: 44.9375em) {
  .c-header__text-logo img {
    max-width: 300px;
  }
}

.c-mobile {
  width: 100%;
  height: 325px;
  background-color: #17313C;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
  opacity: 0;
  -webkit-transition: opacity .3s ease-in-out;
  transition: opacity .3s ease-in-out;
}

@media screen and (min-width: 45em) {
  .c-mobile {
    display: none;
  }
}

.c-mobile.is-open {
  opacity: 1;
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

.c-mobile__nav {
  list-style: none;
  margin-left: 120px;
  margin-top: 65px;
}

.c-mobile__item {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.7142857143;
  margin-bottom: 6px;
}

.c-mobile__item--subnav {
  margin-bottom: 0;
  line-height: 1.4;
}

.c-mobile__link {
  color: #fff;
}

.c-mobile__link.active {
  font-weight: 700;
}

.c-nav {
  text-align: right;
  list-style: none;
  margin-bottom: 0;
  line-height: 1;
}

@media screen and (max-width: 44.9375em) {
  .c-nav {
    display: none;
  }
}

.c-nav__item {
  display: inline-block;
  margin-left: 12px;
  position: relative;
  font-size: 16px;
  font-size: 1rem;
  line-height: 1;
}

@media screen and (min-width: 45em) and (max-width: 63.9375em) {
  .c-nav__item {
    display: block;
    margin-left: 0;
    margin-bottom: 6px;
  }

  .c-nav__item:last-child {
    margin-bottom: 0;
  }
}

.c-nav__link {
  color: #fff;
  text-decoration: none;
}

.c-nav__link.active {
  font-weight: 700;
}

.c-nav__link:hover {
  border-bottom: 1px solid #fff;
}

.c-nav__item--first {
  margin-left: 0;
}

.c-banner {
  position: relative;
  background-color: #57407E;
  padding-bottom: 24px;
}

.c-banner__equals {
  display: none;
  margin-bottom: 24px;
}

@media screen and (min-width: 45em) {
  .c-banner__equals {
    display: inline-block;
  }
}

.c-banner__mobile-equals {
  margin-bottom: 24px;
  z-index: 5;
  position: relative;
}

@media screen and (min-width: 45em) {
  .c-banner__mobile-equals {
    display: none;
  }
}

.c-banner__header {
  color: #fff;
  font-size: 26px;
  font-size: 1.625rem;
  line-height: 1.2;
  margin-bottom: 12px;
}

@media screen and (min-width: 45em) {
  .c-banner__header {
    font-size: 64px;
    font-size: 4rem;
    line-height: 1.125;
    margin-bottom: 24px;
  }
}

.c-banner__subheader p {
  color: #fff;
  font-weight: 500;
  text-transform: uppercase;
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1.3333333333;
  margin-bottom: 12px;
}

@media screen and (min-width: 45em) {
  .c-banner__subheader p {
    font-size: 28px;
    font-size: 1.75rem;
    line-height: 1.7142857143;
    margin-bottom: 24px;
  }
}

@media screen and (min-width: 45em) {
  .c-content {
    min-height: 500px;
  }
}

.c-lead {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 1.5;
}

.c-callout {
  background-color: #E9EAEC;
}

.c-text ul,
.c-text ol {
  margin-left: 24px;
}

.c-text a {
  font-weight: 500;
}

.c-text__lead {
  font-size: 22px;
  font-size: 1.375rem;
  line-height: 1.5;
}

@media screen and (min-width: 45em) {
  .c-text__lead {
    font-size: 24px;
    font-size: 1.5rem;
    line-height: 1.5;
  }
}

.c-text--light {
  color: #fff;
}

.c-text--light a {
  color: #fff;
}

.c-text--lead p:first-of-type {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 1.5;
}

.c-aside {
  background-color: #E9EAEC;
  margin-bottom: 24px;
}

@media screen and (min-width: 64em) {
  .c-aside {
    margin-bottom: 0;
  }
}

.c-aside__text {
  padding: 36px;
}

.c-aside__text h3 {
  font-size: 22px;
  font-size: 1.375rem;
  line-height: 1.2;
  font-weight: 500;
  margin-bottom: 24px;
}

@media screen and (min-width: 45em) {
  .c-aside__text h3 {
    font-size: 26px;
    font-size: 1.625rem;
    line-height: 1.2;
  }
}

.c-aside__text h3:first-of-type {
  margin-bottom: 12px;
}

.c-aside__text h4 {
  font-weight: 400;
  margin-bottom: 24px;
}

.c-aside__text p {
  margin-bottom: 12px;
}

.c-card {
  background-color: #fff;
}

.c-card__header {
  text-transform: none;
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 1;
  margin-bottom: 24px;
}

.c-card__header a {
  color: #17313C;
}

.c-card__heading {
  background-color: #E9EAEC;
  padding-top: 12px;
  padding-bottom: 12px;
}

.c-card__body {
  border: 1px solid #E9EAEC;
  border-top: none;
}

.c-card__link {
  color: #17313C;
}

.c-card__title {
  font-weight: 500;
}

.c-card__meta {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.7142857143;
}

.c-card--news {
  margin-bottom: 24px;
}

@media screen and (min-width: 64em) {
  .c-card--news {
    margin-bottom: 0;
  }
}

.c-card--news .c-card__body {
  border: none;
}

.c-card--news .c-card__link {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.7142857143;
}

@media screen and (min-width: 45em) {
  .c-carousel {
    border: 2px solid #E9EAEC;
    padding: 24px 72px;
  }
}

.c-carousel .slick-prev {
  left: -18px;
}

@media screen and (min-width: 45em) {
  .c-carousel .slick-prev {
    left: 12px;
  }
}

.c-carousel .slick-next {
  right: -18px;
}

@media screen and (min-width: 45em) {
  .c-carousel .slick-next {
    right: 12px;
  }
}

.c-carousel__item {
  padding-right: 24px;
  height: 160px;
}

.c-carousel__item:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.c-carousel__img {
  max-height: 120px;
  width: auto;
  display: inline-block !important;
  vertical-align: middle !important;
}

@media screen and (min-width: 45em) {
  .c-carousel__img {
    max-height: 160px;
  }
}

.c-carousel__arrow-left,
.c-carousel__arrow-right {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  cursor: pointer;
}

.c-carousel__arrow-left {
  left: -18px;
}

@media screen and (min-width: 45em) {
  .c-carousel__arrow-left {
    left: 24px;
  }
}

.c-carousel__arrow-right {
  right: -18px;
}

@media screen and (min-width: 45em) {
  .c-carousel__arrow-right {
    right: 24px;
  }
}

.c-newsletter__input {
  border: none;
}

@media screen and (min-width: 64em) {
  .c-newsletter__input {
    margin-bottom: 0;
  }
}

@media screen and (max-width: 44.9375em) {
  .c-newsletter__input {
    margin-bottom: 6px;
    font-size: 16px;
    font-size: 1rem;
    line-height: 1.5;
  }
}

.c-newsletter__btn {
  border: 4px solid #fff;
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1;
  height: 54px;
}

@media screen and (max-width: 44.9375em) {
  .c-newsletter__btn {
    margin-bottom: 24px;
  }
}

.c-member {
  border: 1px solid #E9EAEC;
}

.c-image {
  margin-bottom: 24px;
}

@media screen and (min-width: 64em) {
  .c-image {
    margin-bottom: 0;
  }
}

.c-testimonial {
  color: #fff;
}

.c-testimonial__quote {
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 1.3;
}

.c-testimonial__source {
  font-size: 22px;
  font-size: 1.375rem;
  line-height: 1.0909090909;
  font-weight: 500;
  margin-bottom: 0;
}

.c-testimonials__pagination {
  position: relative;
}

.c-testimonals__quote-marks {
  text-align: center;
  padding-bottom: 96px;
}

@media screen and (max-width: 44.9375em) {
  .c-testimonals__quote-marks {
    display: none;
  }
}

.c-testimonials__quote-start {
  margin-right: 24px;
}

.c-testimonials__quote-end {
  position: relative;
  top: 36px;
}

.c-testimonials__arrow-left {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 3;
  cursor: pointer;
}

.c-testimonials__arrow-right {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 3;
  cursor: pointer;
}

.c-testimonials__dots {
  bottom: 0;
}

.c-form {
  margin-bottom: 24px;
}

@media screen and (min-width: 64em) {
  .c-form {
    margin-bottom: 0;
  }
}

.c-footer {
  padding: 48px 0;
  background-color: #17313C;
  color: #fff;
}

.c-footer__header {
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1.3333333333;
  margin-bottom: 12px;
}

.c-footer__text p {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.7142857143;
}

.c-footer__social {
  margin-bottom: 24px;
}

@media screen and (min-width: 45em) {
  .c-footer__social {
    text-align: right;
    margin-bottom: 0;
  }
}

.c-footer__social-link {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.7142857143;
  color: #fff;
}

@media screen and (min-width: 45em) {
  .c-footer__social-link {
    margin-left: 12px;
  }
}

.c-footer__logo {
  margin-bottom: 24px;
}

@media screen and (min-width: 64em) {
  .c-footer__logo {
    text-align: right;
    margin-bottom: 0;
  }
}

.c-case-study-item {
  border: 1px solid #E9EAEC;
  padding: 48px 24px;
}

.c-case-study-item__title {
  text-transform: none;
  font-weight: 500;
}

.c-case-study-item__link {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.7142857143;
}

.c-list {
  list-style-type: none;
  margin-left: 0;
}

.c-list__item {
  margin-bottom: 24px;
}

.c-list--small .c-list__item {
  margin-bottom: 12px;
}

.c-sidebar__heading-box {
  padding: 12px 36px;
}

.c-sidebar__heading {
  color: #fff;
}

.c-sidebar__body {
  background-color: #E9EAEC;
  padding: 24px 36px;
}

.c-sidebar__subheading {
  margin-bottom: 12px;
}

.c-sidebar__list {
  margin-left: 24px;
}

.c-sidebar__item span {
  color: #17313C;
}

.c-post-item {
  padding-bottom: 24px;
  border-bottom: 1px solid #E9EAEC;
  margin-bottom: 24px;
}

.c-post-item__image {
  margin-bottom: 12px;
}

.c-post-item__date {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.7142857143;
}

.c-post-item__tags {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.7142857143;
}

@media screen and (min-width: 45em) {
  .c-post-item__tags {
    text-align: right;
  }
}

.c-post-item__tag {
  color: #17313C;
}

.c-post-item__title {
  text-transform: none;
  letter-spacing: 0;
}

.c-post-item__title a {
  color: #17313C;
}

.c-post-item__link {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.7142857143;
  color: #17313C;
}

.c-post__title {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 1;
  text-transform: none;
  letter-spacing: 0;
}

.c-pagination {
  position: relative;
}

.c-pagination__link {
  color: #17313C;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.7142857143;
  position: relative;
  z-index: 4;
}

.c-pagination__link.is-current {
  color: #cc0070;
}

.c-pagination__pages {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  text-align: center;
}

.c-social-box {
  border: 1px solid #fff;
  position: relative;
}

@media screen and (min-width: 64em) {
  .c-social-box__inner {
    position: absolute;
    left: 24px;
    padding-right: 24px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
  }
}

.c-social-box__text {
  color: #fff;
  font-weight: 500;
  font-size: 16px;
  font-size: 1rem;
  line-height: 1.5;
  text-transform: uppercase;
}

@media screen and (min-width: 45em) {
  .c-social-box__text {
    margin-bottom: 0;
  }
}

.c-social-box__items {
  text-align: left;
}

@media screen and (min-width: 45em) and (max-width: 63.9375em) {
  .c-social-box__items {
    text-align: right;
  }
}

@media screen and (min-width: 64em) {
  .c-social-box__items {
    text-align: center;
  }
}

.c-social-box__item {
  margin: 12px 6px;
}

/*.c-social-box__item--linkedin{
        background-size: cover;
        width:112px;
        height:27px;
    }*/

.c-bio {
  border: 1px solid #E9EAEC;
}

.c-footer-nav {
  list-style: none;
  margin-left: 0;
}

.c-footer-nav__item {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.7142857143;
}

.c-footer-nav__link {
  color: #fff;
}

/*Theme */

.page-white .c-header {
  background-color: #fff;
}

.page-white .c-banner {
  background-color: #fff;
}

.page-white .c-card__heading {
  background-color: #fff;
  color: #fff;
}

.page-white .btn {
  background-color: #fff;
}

.page-white .c-case-study-item__link {
  color: #fff;
}

.page-white .c-sidebar__heading-box {
  background-color: #fff;
}

.page-white .c-sidebar__item {
  color: #fff;
}

.page-black .c-header {
  background-color: #333;
}

.page-black .c-banner {
  background-color: #333;
}

.page-black .c-card__heading {
  background-color: #333;
  color: #fff;
}

.page-black .btn {
  background-color: #333;
}

.page-black .c-case-study-item__link {
  color: #333;
}

.page-black .c-sidebar__heading-box {
  background-color: #333;
}

.page-black .c-sidebar__item {
  color: #333;
}

.page-grey .c-header {
  background-color: #E9EAEC;
}

.page-grey .c-banner {
  background-color: #E9EAEC;
}

.page-grey .c-card__heading {
  background-color: #E9EAEC;
  color: #fff;
}

.page-grey .btn {
  background-color: #E9EAEC;
}

.page-grey .c-case-study-item__link {
  color: #E9EAEC;
}

.page-grey .c-sidebar__heading-box {
  background-color: #E9EAEC;
}

.page-grey .c-sidebar__item {
  color: #E9EAEC;
}

.page-purple .c-header {
  background-color: #57407E;
}

.page-purple .c-banner {
  background-color: #57407E;
}

.page-purple .c-card__heading {
  background-color: #57407E;
  color: #fff;
}

.page-purple .btn {
  background-color: #57407E;
}

.page-purple .c-case-study-item__link {
  color: #57407E;
}

.page-purple .c-sidebar__heading-box {
  background-color: #57407E;
}

.page-purple .c-sidebar__item {
  color: #57407E;
}

.page-green .c-header {
  background-color: #2BAD70;
}

.page-green .c-banner {
  background-color: #2BAD70;
}

.page-green .c-card__heading {
  background-color: #2BAD70;
  color: #fff;
}

.page-green .btn {
  background-color: #2BAD70;
}

.page-green .c-case-study-item__link {
  color: #2BAD70;
}

.page-green .c-sidebar__heading-box {
  background-color: #2BAD70;
}

.page-green .c-sidebar__item {
  color: #2BAD70;
}

.page-green-dark .c-header {
  background-color: #00564b;
}

.page-green-dark .c-banner {
  background-color: #00564b;
}

.page-green-dark .c-card__heading {
  background-color: #00564b;
  color: #fff;
}

.page-green-dark .btn {
  background-color: #00564b;
}

.page-green-dark .c-case-study-item__link {
  color: #00564b;
}

.page-green-dark .c-sidebar__heading-box {
  background-color: #00564b;
}

.page-green-dark .c-sidebar__item {
  color: #00564b;
}

.page-magenta .c-header {
  background-color: #cc0070;
}

.page-magenta .c-banner {
  background-color: #cc0070;
}

.page-magenta .c-card__heading {
  background-color: #cc0070;
  color: #fff;
}

.page-magenta .btn {
  background-color: #cc0070;
}

.page-magenta .c-case-study-item__link {
  color: #cc0070;
}

.page-magenta .c-sidebar__heading-box {
  background-color: #cc0070;
}

.page-magenta .c-sidebar__item {
  color: #cc0070;
}

.page-yellow .c-header {
  background-color: #D8BE00;
}

.page-yellow .c-banner {
  background-color: #D8BE00;
}

.page-yellow .c-card__heading {
  background-color: #D8BE00;
  color: #fff;
}

.page-yellow .btn {
  background-color: #D8BE00;
}

.page-yellow .c-case-study-item__link {
  color: #D8BE00;
}

.page-yellow .c-sidebar__heading-box {
  background-color: #D8BE00;
}

.page-yellow .c-sidebar__item {
  color: #D8BE00;
}

.page-blue .c-header {
  background-color: #36A9E1;
}

.page-blue .c-banner {
  background-color: #36A9E1;
}

.page-blue .c-card__heading {
  background-color: #36A9E1;
  color: #fff;
}

.page-blue .btn {
  background-color: #36A9E1;
}

.page-blue .c-case-study-item__link {
  color: #36A9E1;
}

.page-blue .c-sidebar__heading-box {
  background-color: #36A9E1;
}

.page-blue .c-sidebar__item {
  color: #36A9E1;
}

.page-blue-dark .c-header {
  background-color: #142F52;
}

.page-blue-dark .c-banner {
  background-color: #142F52;
}

.page-blue-dark .c-card__heading {
  background-color: #142F52;
  color: #fff;
}

.page-blue-dark .btn {
  background-color: #142F52;
}

.page-blue-dark .c-case-study-item__link {
  color: #142F52;
}

.page-blue-dark .c-sidebar__heading-box {
  background-color: #142F52;
}

.page-blue-dark .c-sidebar__item {
  color: #142F52;
}

.page-brand .c-header {
  background-color: #17313C;
}

.page-brand .c-banner {
  background-color: #17313C;
}

.page-brand .c-card__heading {
  background-color: #17313C;
  color: #fff;
}

.page-brand .btn {
  background-color: #17313C;
}

.page-brand .c-case-study-item__link {
  color: #17313C;
}

.page-brand .c-sidebar__heading-box {
  background-color: #17313C;
}

.page-brand .c-sidebar__item {
  color: #17313C;
}

.parsley-error {
  border-color: red !important;
}

.parsley-success {
  border-color: green !important;
}

.parsley-errors-list {
  margin: 0;
  margin-top: -18px;
  margin-bottom: 24px;
  list-style: none;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.7142857143;
  color: red;
  font-style: italic;
}

/**
 * #TRUMPS
 */

/*------------------------------------*    #CLEARFIX
\*------------------------------------*/

/**
 * Micro clearfix, as per: css-101.org/articles/clearfix/latest-new-clearfix-so-far.php
 * Extend the clearfix class with Sass to avoid the `.clearfix` class appearing
 * over and over in your markup.
 */

.clearfix:after,
.box:after,
.media:after {
  content: "";
  display: table;
  clear: both;
}

/*------------------------------------*    #PRINT
\*------------------------------------*/

/**
 * Very crude, reset-like styles taken from the HTML5 Boilerplate:
 * https://github.com/h5bp/html5-boilerplate/blob/3c3c5e64604209a4d63e1e4c48dd245d45fadfd9/build//css/main-62aa4b0c2a.css#L200-L234
 */

@media print {
  *,
  *:before,
  *:after {
    background: transparent !important;
    color: #000 !important;
    /* Black prints faster: h5bp.com/s */
    box-shadow: none !important;
    text-shadow: none !important;
  }

  a,
  a:visited {
    text-decoration: underline;
  }

  a[href]:after {
    content: " (" attr(href) ")";
  }

  abbr[title]:after {
    content: " (" attr(title) ")";
  }

  /**
     * Don’t show links that are fragment identifiers, or use the `javascript:`
     * pseudo protocol.
     */

  a[href^="#"]:after,
  a[href^="javascript:"]:after {
    content: "";
  }
}

/*------------------------------------*    #SPACING
\*------------------------------------*/

/**
 * Margin and padding helper classes. Use these to tweak layout on a micro
 * level.
 *
 * `.(m|p)(t|r|b|l|h|v)(-|+|0) {}` = margin/padding top/right/bottom/left/horizontal/vertical less/more/none
 */

/**
     * Margin helper classes.
     *
     * Add margins.
     */

.m {
  margin: 24px !important;
}

.mt {
  margin-top: 24px !important;
}

.mr {
  margin-right: 24px !important;
}

.mb {
  margin-bottom: 24px !important;
}

.ml {
  margin-left: 24px !important;
}

.mh {
  margin-right: 24px !important;
  margin-left: 24px !important;
}

.mv {
  margin-top: 24px !important;
  margin-bottom: 24px !important;
}

/**
     * Add small margins.
     */

.m- {
  margin: 12px !important;
}

.mt- {
  margin-top: 12px !important;
}

.mr- {
  margin-right: 12px !important;
}

.mb- {
  margin-bottom: 12px !important;
}

.ml- {
  margin-left: 12px !important;
}

.mh- {
  margin-right: 12px !important;
  margin-left: 12px !important;
}

.mv- {
  margin-top: 12px !important;
  margin-bottom: 12px !important;
}

/**
     * Add large margins.
     */

.m\+ {
  margin: 48px !important;
}

.mt\+ {
  margin-top: 48px !important;
}

.mr\+ {
  margin-right: 48px !important;
}

.mb\+ {
  margin-bottom: 48px !important;
}

.ml\+ {
  margin-left: 48px !important;
}

.mh\+ {
  margin-right: 48px !important;
  margin-left: 48px !important;
}

.mv\+ {
  margin-top: 48px !important;
  margin-bottom: 48px !important;
}

/**
     * Add huge margins.
     */

.m\+\+ {
  margin: 96px !important;
}

.mt\+\+ {
  margin-top: 96px !important;
}

.mr\+\+ {
  margin-right: 96px !important;
}

.mb\+\+ {
  margin-bottom: 96px !important;
}

.ml\+\+ {
  margin-left: 96px !important;
}

.mh\+\+ {
  margin-right: 96px !important;
  margin-left: 96px !important;
}

.mv\+\+ {
  margin-top: 96px !important;
  margin-bottom: 96px !important;
}

/**
     * Remove margins.
     */

.m0 {
  margin: 0 !important;
}

.mt0 {
  margin-top: 0 !important;
}

.mr0 {
  margin-right: 0 !important;
}

.mb0 {
  margin-bottom: 0 !important;
}

.ml0 {
  margin-left: 0 !important;
}

.mh0 {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

.mv0 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/**
     * Padding helper classes.
     *
     * Add paddings.
     */

.p {
  padding: 24px !important;
}

.pt {
  padding-top: 24px !important;
}

.pr {
  padding-right: 24px !important;
}

.pb {
  padding-bottom: 24px !important;
}

.pl {
  padding-left: 24px !important;
}

.ph {
  padding-right: 24px !important;
  padding-left: 24px !important;
}

.pv {
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}

/**
     * Add large paddings.
     */

.p\+ {
  padding: 48px !important;
}

.pt\+ {
  padding-top: 48px !important;
}

.pr\+ {
  padding-right: 48px !important;
}

.pb\+ {
  padding-bottom: 48px !important;
}

.pl\+ {
  padding-left: 48px !important;
}

.ph\+ {
  padding-right: 48px !important;
  padding-left: 48px !important;
}

.pv\+ {
  padding-top: 48px !important;
  padding-bottom: 48px !important;
}

/**
     * Remove paddings.
     */

.p0 {
  padding: 0 !important;
}

.pt0 {
  padding-top: 0 !important;
}

.pr0 {
  padding-right: 0 !important;
}

.pb0 {
  padding-bottom: 0 !important;
}

.pl0 {
  padding-left: 0 !important;
}

.ph0 {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

.pv0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/*------------------------------------*    #SPACING-RESPONSIVE
\*------------------------------------*/

/**
 * Margin and padding helper classes. Use these to tweak layout on a micro
 * level.
 *
 * `.(m|p)(t|r|b|l|h|v)(-|+|0) {}` = margin/padding top/right/bottom/left/horizontal/vertical less/more/none
 */

/*------------------------------------*    #WIDTHS
\*------------------------------------*/

/**
 * A series of width helper classes that you can use to size things like grid
 * systems. Classes can take a fraction-like format (e.g. `.2/3`) or a spoken-
 * word format (e.g. `two-thirds`). Toggle formats by overriding the
 * `$inuit-use-fractions` variable defined below.
 */

/**
     * Whole.
     */

[class~="1/1"] {
  width: 100% !important;
}

/**
     * Halves.
     */

[class~="1/2"],
[class~="2/4"],
[class~="3/6"],
[class~="4/8"],
[class~="5/10"],
[class~="6/12"] {
  width: 50% !important;
}

/**
     * Thirds.
     */

[class~="1/3"],
[class~="2/6"],
[class~="3/9"],
[class~="4/12"] {
  width: 33.3333333% !important;
}

[class~="2/3"],
[class~="4/6"],
[class~="6/9"],
[class~="8/12"] {
  width: 66.6666666% !important;
}

/**
     * Quarters.
     */

[class~="1/4"],
[class~="2/8"],
[class~="3/12"] {
  width: 25% !important;
}

[class~="3/4"],
[class~="6/8"],
[class~="9/12"] {
  width: 75% !important;
}

/**
     * Fifths.
     */

[class~="1/5"],
[class~="2/10"] {
  width: 20% !important;
}

[class~="2/5"],
[class~="4/10"] {
  width: 40% !important;
}

[class~="3/5"],
[class~="6/10"] {
  width: 60% !important;
}

[class~="4/5"],
[class~="8/10"] {
  width: 80% !important;
}

/**
     * Sixths.
     */

[class~="1/6"],
[class~="2/12"] {
  width: 16.6666666% !important;
}

[class~="5/6"],
[class~="10/12"] {
  width: 83.3333333% !important;
}

/**
     * Eighths.
     */

[class~="1/8"] {
  width: 12.5% !important;
}

[class~="3/8"] {
  width: 37.5% !important;
}

[class~="5/8"] {
  width: 62.5% !important;
}

[class~="7/8"] {
  width: 87.5% !important;
}

/**
     * Ninths.
     */

[class~="1/9"] {
  width: 11.1111111% !important;
}

[class~="2/9"] {
  width: 22.2222222% !important;
}

[class~="4/9"] {
  width: 44.4444444% !important;
}

[class~="5/9"] {
  width: 55.5555555% !important;
}

[class~="7/9"] {
  width: 77.7777777% !important;
}

[class~="8/9"] {
  width: 88.8888888% !important;
}

/**
     * Tenths.
     */

[class~="1/10"] {
  width: 10% !important;
}

[class~="3/10"] {
  width: 30% !important;
}

[class~="7/10"] {
  width: 70% !important;
}

[class~="9/10"] {
  width: 90% !important;
}

/**
     * Twelfths.
     */

[class~="1/12"] {
  width: 8.3333333% !important;
}

[class~="5/12"] {
  width: 41.6666666% !important;
}

[class~="7/12"] {
  width: 58.3333333% !important;
}

[class~="11/12"] {
  width: 91.6666666% !important;
}

/*------------------------------------*    #WIDTHS-RESPONSIVE
\*------------------------------------*/

/**
 * Responsive width classes based on your responsive settings.
 */

@media screen and (max-width: 44.9375em) {
  /**
                 * Whole.
                 */

  [class~="palm-1/1"] {
    width: 100% !important;
  }

  /**
                 * Halves.
                 */

  [class~="palm-1/2"],
  [class~="palm-2/4"],
  [class~="palm-3/6"],
  [class~="palm-4/8"],
  [class~="palm-5/10"],
  [class~="palm-6/12"] {
    width: 50% !important;
  }

  /**
                 * Thirds.
                 */

  [class~="palm-1/3"],
  [class~="palm-2/6"],
  [class~="palm-3/9"],
  [class~="palm-4/12"] {
    width: 33.3333333% !important;
  }

  [class~="palm-2/3"],
  [class~="palm-4/6"],
  [class~="palm-6/9"],
  [class~="palm-8/12"] {
    width: 66.6666666% !important;
  }

  /**
                 * Quarters.
                 */

  [class~="palm-1/4"],
  [class~="palm-2/8"],
  [class~="palm-3/12"] {
    width: 25% !important;
  }

  [class~="palm-3/4"],
  [class~="palm-6/8"],
  [class~="palm-9/12"] {
    width: 75% !important;
  }

  /**
                 * Fifths.
                 */

  [class~="palm-1/5"],
  [class~="palm-2/10"] {
    width: 20% !important;
  }

  [class~="palm-2/5"],
  [class~="palm-4/10"] {
    width: 40% !important;
  }

  [class~="palm-3/5"],
  [class~="palm-6/10"] {
    width: 60% !important;
  }

  [class~="palm-4/5"],
  [class~="palm-8/10"] {
    width: 80% !important;
  }

  /**
                 * Sixths.
                 */

  [class~="palm-1/6"],
  [class~="palm-2/12"] {
    width: 16.6666666% !important;
  }

  [class~="palm-5/6"],
  [class~="palm-10/12"] {
    width: 83.3333333% !important;
  }

  /**
                 * Eighths.
                 */

  [class~="palm-1/8"] {
    width: 12.5% !important;
  }

  [class~="palm-3/8"] {
    width: 37.5% !important;
  }

  [class~="palm-5/8"] {
    width: 62.5% !important;
  }

  [class~="palm-7/8"] {
    width: 87.5% !important;
  }

  /**
                 * Ninths.
                 */

  [class~="palm-1/9"] {
    width: 11.1111111% !important;
  }

  [class~="palm-2/9"] {
    width: 22.2222222% !important;
  }

  [class~="palm-4/9"] {
    width: 44.4444444% !important;
  }

  [class~="palm-5/9"] {
    width: 55.5555555% !important;
  }

  [class~="palm-7/9"] {
    width: 77.7777777% !important;
  }

  [class~="palm-8/9"] {
    width: 88.8888888% !important;
  }

  /**
                 * Tenths.
                 */

  [class~="palm-1/10"] {
    width: 10% !important;
  }

  [class~="palm-3/10"] {
    width: 30% !important;
  }

  [class~="palm-7/10"] {
    width: 70% !important;
  }

  [class~="palm-9/10"] {
    width: 90% !important;
  }

  /**
                 * Twelfths.
                 */

  [class~="palm-1/12"] {
    width: 8.3333333% !important;
  }

  [class~="palm-5/12"] {
    width: 41.6666666% !important;
  }

  [class~="palm-7/12"] {
    width: 58.3333333% !important;
  }

  [class~="palm-11/12"] {
    width: 91.6666666% !important;
  }
}

@media screen and (min-width: 45em) and (max-width: 63.9375em) {
  /**
                 * Whole.
                 */

  [class~="lap-1/1"] {
    width: 100% !important;
  }

  /**
                 * Halves.
                 */

  [class~="lap-1/2"],
  [class~="lap-2/4"],
  [class~="lap-3/6"],
  [class~="lap-4/8"],
  [class~="lap-5/10"],
  [class~="lap-6/12"] {
    width: 50% !important;
  }

  /**
                 * Thirds.
                 */

  [class~="lap-1/3"],
  [class~="lap-2/6"],
  [class~="lap-3/9"],
  [class~="lap-4/12"] {
    width: 33.3333333% !important;
  }

  [class~="lap-2/3"],
  [class~="lap-4/6"],
  [class~="lap-6/9"],
  [class~="lap-8/12"] {
    width: 66.6666666% !important;
  }

  /**
                 * Quarters.
                 */

  [class~="lap-1/4"],
  [class~="lap-2/8"],
  [class~="lap-3/12"] {
    width: 25% !important;
  }

  [class~="lap-3/4"],
  [class~="lap-6/8"],
  [class~="lap-9/12"] {
    width: 75% !important;
  }

  /**
                 * Fifths.
                 */

  [class~="lap-1/5"],
  [class~="lap-2/10"] {
    width: 20% !important;
  }

  [class~="lap-2/5"],
  [class~="lap-4/10"] {
    width: 40% !important;
  }

  [class~="lap-3/5"],
  [class~="lap-6/10"] {
    width: 60% !important;
  }

  [class~="lap-4/5"],
  [class~="lap-8/10"] {
    width: 80% !important;
  }

  /**
                 * Sixths.
                 */

  [class~="lap-1/6"],
  [class~="lap-2/12"] {
    width: 16.6666666% !important;
  }

  [class~="lap-5/6"],
  [class~="lap-10/12"] {
    width: 83.3333333% !important;
  }

  /**
                 * Eighths.
                 */

  [class~="lap-1/8"] {
    width: 12.5% !important;
  }

  [class~="lap-3/8"] {
    width: 37.5% !important;
  }

  [class~="lap-5/8"] {
    width: 62.5% !important;
  }

  [class~="lap-7/8"] {
    width: 87.5% !important;
  }

  /**
                 * Ninths.
                 */

  [class~="lap-1/9"] {
    width: 11.1111111% !important;
  }

  [class~="lap-2/9"] {
    width: 22.2222222% !important;
  }

  [class~="lap-4/9"] {
    width: 44.4444444% !important;
  }

  [class~="lap-5/9"] {
    width: 55.5555555% !important;
  }

  [class~="lap-7/9"] {
    width: 77.7777777% !important;
  }

  [class~="lap-8/9"] {
    width: 88.8888888% !important;
  }

  /**
                 * Tenths.
                 */

  [class~="lap-1/10"] {
    width: 10% !important;
  }

  [class~="lap-3/10"] {
    width: 30% !important;
  }

  [class~="lap-7/10"] {
    width: 70% !important;
  }

  [class~="lap-9/10"] {
    width: 90% !important;
  }

  /**
                 * Twelfths.
                 */

  [class~="lap-1/12"] {
    width: 8.3333333% !important;
  }

  [class~="lap-5/12"] {
    width: 41.6666666% !important;
  }

  [class~="lap-7/12"] {
    width: 58.3333333% !important;
  }

  [class~="lap-11/12"] {
    width: 91.6666666% !important;
  }
}

@media screen and (min-width: 45em) {
  /**
                 * Whole.
                 */

  [class~="lap-and-up-1/1"] {
    width: 100% !important;
  }

  /**
                 * Halves.
                 */

  [class~="lap-and-up-1/2"],
  [class~="lap-and-up-2/4"],
  [class~="lap-and-up-3/6"],
  [class~="lap-and-up-4/8"],
  [class~="lap-and-up-5/10"],
  [class~="lap-and-up-6/12"] {
    width: 50% !important;
  }

  /**
                 * Thirds.
                 */

  [class~="lap-and-up-1/3"],
  [class~="lap-and-up-2/6"],
  [class~="lap-and-up-3/9"],
  [class~="lap-and-up-4/12"] {
    width: 33.3333333% !important;
  }

  [class~="lap-and-up-2/3"],
  [class~="lap-and-up-4/6"],
  [class~="lap-and-up-6/9"],
  [class~="lap-and-up-8/12"] {
    width: 66.6666666% !important;
  }

  /**
                 * Quarters.
                 */

  [class~="lap-and-up-1/4"],
  [class~="lap-and-up-2/8"],
  [class~="lap-and-up-3/12"] {
    width: 25% !important;
  }

  [class~="lap-and-up-3/4"],
  [class~="lap-and-up-6/8"],
  [class~="lap-and-up-9/12"] {
    width: 75% !important;
  }

  /**
                 * Fifths.
                 */

  [class~="lap-and-up-1/5"],
  [class~="lap-and-up-2/10"] {
    width: 20% !important;
  }

  [class~="lap-and-up-2/5"],
  [class~="lap-and-up-4/10"] {
    width: 40% !important;
  }

  [class~="lap-and-up-3/5"],
  [class~="lap-and-up-6/10"] {
    width: 60% !important;
  }

  [class~="lap-and-up-4/5"],
  [class~="lap-and-up-8/10"] {
    width: 80% !important;
  }

  /**
                 * Sixths.
                 */

  [class~="lap-and-up-1/6"],
  [class~="lap-and-up-2/12"] {
    width: 16.6666666% !important;
  }

  [class~="lap-and-up-5/6"],
  [class~="lap-and-up-10/12"] {
    width: 83.3333333% !important;
  }

  /**
                 * Eighths.
                 */

  [class~="lap-and-up-1/8"] {
    width: 12.5% !important;
  }

  [class~="lap-and-up-3/8"] {
    width: 37.5% !important;
  }

  [class~="lap-and-up-5/8"] {
    width: 62.5% !important;
  }

  [class~="lap-and-up-7/8"] {
    width: 87.5% !important;
  }

  /**
                 * Ninths.
                 */

  [class~="lap-and-up-1/9"] {
    width: 11.1111111% !important;
  }

  [class~="lap-and-up-2/9"] {
    width: 22.2222222% !important;
  }

  [class~="lap-and-up-4/9"] {
    width: 44.4444444% !important;
  }

  [class~="lap-and-up-5/9"] {
    width: 55.5555555% !important;
  }

  [class~="lap-and-up-7/9"] {
    width: 77.7777777% !important;
  }

  [class~="lap-and-up-8/9"] {
    width: 88.8888888% !important;
  }

  /**
                 * Tenths.
                 */

  [class~="lap-and-up-1/10"] {
    width: 10% !important;
  }

  [class~="lap-and-up-3/10"] {
    width: 30% !important;
  }

  [class~="lap-and-up-7/10"] {
    width: 70% !important;
  }

  [class~="lap-and-up-9/10"] {
    width: 90% !important;
  }

  /**
                 * Twelfths.
                 */

  [class~="lap-and-up-1/12"] {
    width: 8.3333333% !important;
  }

  [class~="lap-and-up-5/12"] {
    width: 41.6666666% !important;
  }

  [class~="lap-and-up-7/12"] {
    width: 58.3333333% !important;
  }

  [class~="lap-and-up-11/12"] {
    width: 91.6666666% !important;
  }
}

@media screen and (max-width: 63.9375em) {
  /**
                 * Whole.
                 */

  [class~="portable-1/1"] {
    width: 100% !important;
  }

  /**
                 * Halves.
                 */

  [class~="portable-1/2"],
  [class~="portable-2/4"],
  [class~="portable-3/6"],
  [class~="portable-4/8"],
  [class~="portable-5/10"],
  [class~="portable-6/12"] {
    width: 50% !important;
  }

  /**
                 * Thirds.
                 */

  [class~="portable-1/3"],
  [class~="portable-2/6"],
  [class~="portable-3/9"],
  [class~="portable-4/12"] {
    width: 33.3333333% !important;
  }

  [class~="portable-2/3"],
  [class~="portable-4/6"],
  [class~="portable-6/9"],
  [class~="portable-8/12"] {
    width: 66.6666666% !important;
  }

  /**
                 * Quarters.
                 */

  [class~="portable-1/4"],
  [class~="portable-2/8"],
  [class~="portable-3/12"] {
    width: 25% !important;
  }

  [class~="portable-3/4"],
  [class~="portable-6/8"],
  [class~="portable-9/12"] {
    width: 75% !important;
  }

  /**
                 * Fifths.
                 */

  [class~="portable-1/5"],
  [class~="portable-2/10"] {
    width: 20% !important;
  }

  [class~="portable-2/5"],
  [class~="portable-4/10"] {
    width: 40% !important;
  }

  [class~="portable-3/5"],
  [class~="portable-6/10"] {
    width: 60% !important;
  }

  [class~="portable-4/5"],
  [class~="portable-8/10"] {
    width: 80% !important;
  }

  /**
                 * Sixths.
                 */

  [class~="portable-1/6"],
  [class~="portable-2/12"] {
    width: 16.6666666% !important;
  }

  [class~="portable-5/6"],
  [class~="portable-10/12"] {
    width: 83.3333333% !important;
  }

  /**
                 * Eighths.
                 */

  [class~="portable-1/8"] {
    width: 12.5% !important;
  }

  [class~="portable-3/8"] {
    width: 37.5% !important;
  }

  [class~="portable-5/8"] {
    width: 62.5% !important;
  }

  [class~="portable-7/8"] {
    width: 87.5% !important;
  }

  /**
                 * Ninths.
                 */

  [class~="portable-1/9"] {
    width: 11.1111111% !important;
  }

  [class~="portable-2/9"] {
    width: 22.2222222% !important;
  }

  [class~="portable-4/9"] {
    width: 44.4444444% !important;
  }

  [class~="portable-5/9"] {
    width: 55.5555555% !important;
  }

  [class~="portable-7/9"] {
    width: 77.7777777% !important;
  }

  [class~="portable-8/9"] {
    width: 88.8888888% !important;
  }

  /**
                 * Tenths.
                 */

  [class~="portable-1/10"] {
    width: 10% !important;
  }

  [class~="portable-3/10"] {
    width: 30% !important;
  }

  [class~="portable-7/10"] {
    width: 70% !important;
  }

  [class~="portable-9/10"] {
    width: 90% !important;
  }

  /**
                 * Twelfths.
                 */

  [class~="portable-1/12"] {
    width: 8.3333333% !important;
  }

  [class~="portable-5/12"] {
    width: 41.6666666% !important;
  }

  [class~="portable-7/12"] {
    width: 58.3333333% !important;
  }

  [class~="portable-11/12"] {
    width: 91.6666666% !important;
  }
}

@media screen and (min-width: 64em) {
  /**
                 * Whole.
                 */

  [class~="desk-1/1"] {
    width: 100% !important;
  }

  /**
                 * Halves.
                 */

  [class~="desk-1/2"],
  [class~="desk-2/4"],
  [class~="desk-3/6"],
  [class~="desk-4/8"],
  [class~="desk-5/10"],
  [class~="desk-6/12"] {
    width: 50% !important;
  }

  /**
                 * Thirds.
                 */

  [class~="desk-1/3"],
  [class~="desk-2/6"],
  [class~="desk-3/9"],
  [class~="desk-4/12"] {
    width: 33.3333333% !important;
  }

  [class~="desk-2/3"],
  [class~="desk-4/6"],
  [class~="desk-6/9"],
  [class~="desk-8/12"] {
    width: 66.6666666% !important;
  }

  /**
                 * Quarters.
                 */

  [class~="desk-1/4"],
  [class~="desk-2/8"],
  [class~="desk-3/12"] {
    width: 25% !important;
  }

  [class~="desk-3/4"],
  [class~="desk-6/8"],
  [class~="desk-9/12"] {
    width: 75% !important;
  }

  /**
                 * Fifths.
                 */

  [class~="desk-1/5"],
  [class~="desk-2/10"] {
    width: 20% !important;
  }

  [class~="desk-2/5"],
  [class~="desk-4/10"] {
    width: 40% !important;
  }

  [class~="desk-3/5"],
  [class~="desk-6/10"] {
    width: 60% !important;
  }

  [class~="desk-4/5"],
  [class~="desk-8/10"] {
    width: 80% !important;
  }

  /**
                 * Sixths.
                 */

  [class~="desk-1/6"],
  [class~="desk-2/12"] {
    width: 16.6666666% !important;
  }

  [class~="desk-5/6"],
  [class~="desk-10/12"] {
    width: 83.3333333% !important;
  }

  /**
                 * Eighths.
                 */

  [class~="desk-1/8"] {
    width: 12.5% !important;
  }

  [class~="desk-3/8"] {
    width: 37.5% !important;
  }

  [class~="desk-5/8"] {
    width: 62.5% !important;
  }

  [class~="desk-7/8"] {
    width: 87.5% !important;
  }

  /**
                 * Ninths.
                 */

  [class~="desk-1/9"] {
    width: 11.1111111% !important;
  }

  [class~="desk-2/9"] {
    width: 22.2222222% !important;
  }

  [class~="desk-4/9"] {
    width: 44.4444444% !important;
  }

  [class~="desk-5/9"] {
    width: 55.5555555% !important;
  }

  [class~="desk-7/9"] {
    width: 77.7777777% !important;
  }

  [class~="desk-8/9"] {
    width: 88.8888888% !important;
  }

  /**
                 * Tenths.
                 */

  [class~="desk-1/10"] {
    width: 10% !important;
  }

  [class~="desk-3/10"] {
    width: 30% !important;
  }

  [class~="desk-7/10"] {
    width: 70% !important;
  }

  [class~="desk-9/10"] {
    width: 90% !important;
  }

  /**
                 * Twelfths.
                 */

  [class~="desk-1/12"] {
    width: 8.3333333% !important;
  }

  [class~="desk-5/12"] {
    width: 41.6666666% !important;
  }

  [class~="desk-7/12"] {
    width: 58.3333333% !important;
  }

  [class~="desk-11/12"] {
    width: 91.6666666% !important;
  }
}

/*------------------------------------*    #PUSH
\*------------------------------------*/

/**
 * A series of helper classes that you can use to push grid elemtents to the
 * right. Classes can take a fraction-like format (e.g. `.push-2/3`)
 * or a spoken-word format (e.g. `.push-two-thirds`). Toggle formats by
 * overriding the `$inuit-use-fractions` variable. Toggle formats by
 * overriding the `$inuit-use-fractions` variable defined below.
 */

[class*="push-"] {
  position: relative;
}

/**
     * Whole.
     */

[class~="push-1/1"] {
  left: 100% !important;
}

/**
     * Halves.
     */

[class~="push-1/2"],
[class~="push-2/4"],
[class~="push-3/6"],
[class~="push-4/8"],
[class~="push-5/10"],
[class~="push-6/12"] {
  left: 50% !important;
}

/**
     * Thirds.
     */

[class~="push-1/3"],
[class~="push-2/6"],
[class~="push-3/9"],
[class~="push-4/12"] {
  left: 33.3333333% !important;
}

[class~="push-2/3"],
[class~="push-4/6"],
[class~="push-6/9"],
[class~="push-8/12"] {
  left: 66.6666666% !important;
}

/**
     * Quarters.
     */

[class~="push-1/4"],
[class~="push-2/8"],
[class~="push-3/12"] {
  left: 25% !important;
}

[class~="push-3/4"],
[class~="push-6/8"],
[class~="push-9/12"] {
  left: 75% !important;
}

/**
     * Fifths.
     */

[class~="push-1/5"],
[class~="push-2/10"] {
  left: 20% !important;
}

[class~="push-2/5"],
[class~="push-4/10"] {
  left: 40% !important;
}

[class~="push-3/5"],
[class~="push-6/10"] {
  left: 60% !important;
}

[class~="push-4/5"],
[class~="push-8/10"] {
  left: 80% !important;
}

/**
     * Sixths.
     */

[class~="push-1/6"],
[class~="push-2/12"] {
  left: 16.6666666% !important;
}

[class~="push-5/6"],
[class~="push-10/12"] {
  left: 83.3333333% !important;
}

/**
     * Eighths.
     */

[class~="push-1/8"] {
  left: 12.5% !important;
}

[class~="push-3/8"] {
  left: 37.5% !important;
}

[class~="push-5/8"] {
  left: 62.5% !important;
}

[class~="push-7/8"] {
  left: 87.5% !important;
}

/**
     * Ninths.
     */

[class~="push-1/9"] {
  left: 11.1111111% !important;
}

[class~="push-2/9"] {
  left: 22.2222222% !important;
}

[class~="push-4/9"] {
  left: 44.4444444% !important;
}

[class~="push-5/9"] {
  left: 55.5555555% !important;
}

[class~="push-7/9"] {
  left: 77.7777777% !important;
}

[class~="push-8/9"] {
  left: 88.8888888% !important;
}

/**
     * Tenths.
     */

[class~="push-1/10"] {
  left: 10% !important;
}

[class~="push-3/10"] {
  left: 30% !important;
}

[class~="push-7/10"] {
  left: 70% !important;
}

[class~="push-9/10"] {
  left: 90% !important;
}

/**
     * Twelfths.
     */

[class~="push-1/12"] {
  left: 8.3333333% !important;
}

[class~="push-5/12"] {
  left: 41.6666666% !important;
}

[class~="push-7/12"] {
  left: 58.3333333% !important;
}

[class~="push-11/12"] {
  left: 91.6666666% !important;
}

/*------------------------------------*    #PUSH-RESPONSIVE
\*------------------------------------*/

/**
 * Responsive push classes based on your responsive settings.
 */

@media screen and (max-width: 44.9375em) {
  /**
                 * Whole.
                 */

  [class~="palm-push-1/1"] {
    left: 100% !important;
  }

  /**
                 * Halves.
                 */

  [class~="palm-push-1/2"],
  [class~="palm-push-2/4"],
  [class~="palm-push-3/6"],
  [class~="palm-push-4/8"],
  [class~="palm-push-5/10"],
  [class~="palm-push-6/12"] {
    left: 50% !important;
  }

  /**
                 * Thirds.
                 */

  [class~="palm-push-1/3"],
  [class~="palm-push-2/6"],
  [class~="palm-push-3/9"],
  [class~="palm-push-4/12"] {
    left: 33.3333333% !important;
  }

  [class~="palm-push-2/3"],
  [class~="palm-push-4/6"],
  [class~="palm-push-6/9"],
  [class~="palm-push-8/12"] {
    left: 66.6666666% !important;
  }

  /**
                 * Quarters.
                 */

  [class~="palm-push-1/4"],
  [class~="palm-push-2/8"],
  [class~="palm-push-3/12"] {
    left: 25% !important;
  }

  [class~="palm-push-3/4"],
  [class~="palm-push-6/8"],
  [class~="palm-push-9/12"] {
    left: 75% !important;
  }

  /**
                 * Fifths.
                 */

  [class~="palm-push-1/5"],
  [class~="palm-push-2/10"] {
    left: 20% !important;
  }

  [class~="palm-push-2/5"],
  [class~="palm-push-4/10"] {
    left: 40% !important;
  }

  [class~="palm-push-3/5"],
  [class~="palm-push-6/10"] {
    left: 60% !important;
  }

  [class~="palm-push-4/5"],
  [class~="palm-push-8/10"] {
    left: 80% !important;
  }

  /**
                 * Sixths.
                 */

  [class~="palm-push-1/6"],
  [class~="palm-push-2/12"] {
    left: 16.6666666% !important;
  }

  [class~="palm-push-5/6"],
  [class~="palm-push-10/12"] {
    left: 83.3333333% !important;
  }

  /**
                 * Eighths.
                 */

  [class~="palm-push-1/8"] {
    left: 12.5% !important;
  }

  [class~="palm-push-3/8"] {
    left: 37.5% !important;
  }

  [class~="palm-push-5/8"] {
    left: 62.5% !important;
  }

  [class~="palm-push-7/8"] {
    left: 87.5% !important;
  }

  /**
                 * Ninths.
                 */

  [class~="palm-push-1/9"] {
    left: 11.1111111% !important;
  }

  [class~="palm-push-2/9"] {
    left: 22.2222222% !important;
  }

  [class~="palm-push-4/9"] {
    left: 44.4444444% !important;
  }

  [class~="palm-push-5/9"] {
    left: 55.5555555% !important;
  }

  [class~="palm-push-7/9"] {
    left: 77.7777777% !important;
  }

  [class~="palm-push-8/9"] {
    left: 88.8888888% !important;
  }

  /**
                 * Tenths.
                 */

  [class~="palm-push-1/10"] {
    left: 10% !important;
  }

  [class~="palm-push-3/10"] {
    left: 30% !important;
  }

  [class~="palm-push-7/10"] {
    left: 70% !important;
  }

  [class~="palm-push-9/10"] {
    left: 90% !important;
  }

  /**
                 * Twelfths.
                 */

  [class~="palm-push-1/12"] {
    left: 8.3333333% !important;
  }

  [class~="palm-push-5/12"] {
    left: 41.6666666% !important;
  }

  [class~="palm-push-7/12"] {
    left: 58.3333333% !important;
  }

  [class~="palm-push-11/12"] {
    left: 91.6666666% !important;
  }
}

@media screen and (min-width: 45em) and (max-width: 63.9375em) {
  /**
                 * Whole.
                 */

  [class~="lap-push-1/1"] {
    left: 100% !important;
  }

  /**
                 * Halves.
                 */

  [class~="lap-push-1/2"],
  [class~="lap-push-2/4"],
  [class~="lap-push-3/6"],
  [class~="lap-push-4/8"],
  [class~="lap-push-5/10"],
  [class~="lap-push-6/12"] {
    left: 50% !important;
  }

  /**
                 * Thirds.
                 */

  [class~="lap-push-1/3"],
  [class~="lap-push-2/6"],
  [class~="lap-push-3/9"],
  [class~="lap-push-4/12"] {
    left: 33.3333333% !important;
  }

  [class~="lap-push-2/3"],
  [class~="lap-push-4/6"],
  [class~="lap-push-6/9"],
  [class~="lap-push-8/12"] {
    left: 66.6666666% !important;
  }

  /**
                 * Quarters.
                 */

  [class~="lap-push-1/4"],
  [class~="lap-push-2/8"],
  [class~="lap-push-3/12"] {
    left: 25% !important;
  }

  [class~="lap-push-3/4"],
  [class~="lap-push-6/8"],
  [class~="lap-push-9/12"] {
    left: 75% !important;
  }

  /**
                 * Fifths.
                 */

  [class~="lap-push-1/5"],
  [class~="lap-push-2/10"] {
    left: 20% !important;
  }

  [class~="lap-push-2/5"],
  [class~="lap-push-4/10"] {
    left: 40% !important;
  }

  [class~="lap-push-3/5"],
  [class~="lap-push-6/10"] {
    left: 60% !important;
  }

  [class~="lap-push-4/5"],
  [class~="lap-push-8/10"] {
    left: 80% !important;
  }

  /**
                 * Sixths.
                 */

  [class~="lap-push-1/6"],
  [class~="lap-push-2/12"] {
    left: 16.6666666% !important;
  }

  [class~="lap-push-5/6"],
  [class~="lap-push-10/12"] {
    left: 83.3333333% !important;
  }

  /**
                 * Eighths.
                 */

  [class~="lap-push-1/8"] {
    left: 12.5% !important;
  }

  [class~="lap-push-3/8"] {
    left: 37.5% !important;
  }

  [class~="lap-push-5/8"] {
    left: 62.5% !important;
  }

  [class~="lap-push-7/8"] {
    left: 87.5% !important;
  }

  /**
                 * Ninths.
                 */

  [class~="lap-push-1/9"] {
    left: 11.1111111% !important;
  }

  [class~="lap-push-2/9"] {
    left: 22.2222222% !important;
  }

  [class~="lap-push-4/9"] {
    left: 44.4444444% !important;
  }

  [class~="lap-push-5/9"] {
    left: 55.5555555% !important;
  }

  [class~="lap-push-7/9"] {
    left: 77.7777777% !important;
  }

  [class~="lap-push-8/9"] {
    left: 88.8888888% !important;
  }

  /**
                 * Tenths.
                 */

  [class~="lap-push-1/10"] {
    left: 10% !important;
  }

  [class~="lap-push-3/10"] {
    left: 30% !important;
  }

  [class~="lap-push-7/10"] {
    left: 70% !important;
  }

  [class~="lap-push-9/10"] {
    left: 90% !important;
  }

  /**
                 * Twelfths.
                 */

  [class~="lap-push-1/12"] {
    left: 8.3333333% !important;
  }

  [class~="lap-push-5/12"] {
    left: 41.6666666% !important;
  }

  [class~="lap-push-7/12"] {
    left: 58.3333333% !important;
  }

  [class~="lap-push-11/12"] {
    left: 91.6666666% !important;
  }
}

@media screen and (min-width: 45em) {
  /**
                 * Whole.
                 */

  [class~="lap-and-up-push-1/1"] {
    left: 100% !important;
  }

  /**
                 * Halves.
                 */

  [class~="lap-and-up-push-1/2"],
  [class~="lap-and-up-push-2/4"],
  [class~="lap-and-up-push-3/6"],
  [class~="lap-and-up-push-4/8"],
  [class~="lap-and-up-push-5/10"],
  [class~="lap-and-up-push-6/12"] {
    left: 50% !important;
  }

  /**
                 * Thirds.
                 */

  [class~="lap-and-up-push-1/3"],
  [class~="lap-and-up-push-2/6"],
  [class~="lap-and-up-push-3/9"],
  [class~="lap-and-up-push-4/12"] {
    left: 33.3333333% !important;
  }

  [class~="lap-and-up-push-2/3"],
  [class~="lap-and-up-push-4/6"],
  [class~="lap-and-up-push-6/9"],
  [class~="lap-and-up-push-8/12"] {
    left: 66.6666666% !important;
  }

  /**
                 * Quarters.
                 */

  [class~="lap-and-up-push-1/4"],
  [class~="lap-and-up-push-2/8"],
  [class~="lap-and-up-push-3/12"] {
    left: 25% !important;
  }

  [class~="lap-and-up-push-3/4"],
  [class~="lap-and-up-push-6/8"],
  [class~="lap-and-up-push-9/12"] {
    left: 75% !important;
  }

  /**
                 * Fifths.
                 */

  [class~="lap-and-up-push-1/5"],
  [class~="lap-and-up-push-2/10"] {
    left: 20% !important;
  }

  [class~="lap-and-up-push-2/5"],
  [class~="lap-and-up-push-4/10"] {
    left: 40% !important;
  }

  [class~="lap-and-up-push-3/5"],
  [class~="lap-and-up-push-6/10"] {
    left: 60% !important;
  }

  [class~="lap-and-up-push-4/5"],
  [class~="lap-and-up-push-8/10"] {
    left: 80% !important;
  }

  /**
                 * Sixths.
                 */

  [class~="lap-and-up-push-1/6"],
  [class~="lap-and-up-push-2/12"] {
    left: 16.6666666% !important;
  }

  [class~="lap-and-up-push-5/6"],
  [class~="lap-and-up-push-10/12"] {
    left: 83.3333333% !important;
  }

  /**
                 * Eighths.
                 */

  [class~="lap-and-up-push-1/8"] {
    left: 12.5% !important;
  }

  [class~="lap-and-up-push-3/8"] {
    left: 37.5% !important;
  }

  [class~="lap-and-up-push-5/8"] {
    left: 62.5% !important;
  }

  [class~="lap-and-up-push-7/8"] {
    left: 87.5% !important;
  }

  /**
                 * Ninths.
                 */

  [class~="lap-and-up-push-1/9"] {
    left: 11.1111111% !important;
  }

  [class~="lap-and-up-push-2/9"] {
    left: 22.2222222% !important;
  }

  [class~="lap-and-up-push-4/9"] {
    left: 44.4444444% !important;
  }

  [class~="lap-and-up-push-5/9"] {
    left: 55.5555555% !important;
  }

  [class~="lap-and-up-push-7/9"] {
    left: 77.7777777% !important;
  }

  [class~="lap-and-up-push-8/9"] {
    left: 88.8888888% !important;
  }

  /**
                 * Tenths.
                 */

  [class~="lap-and-up-push-1/10"] {
    left: 10% !important;
  }

  [class~="lap-and-up-push-3/10"] {
    left: 30% !important;
  }

  [class~="lap-and-up-push-7/10"] {
    left: 70% !important;
  }

  [class~="lap-and-up-push-9/10"] {
    left: 90% !important;
  }

  /**
                 * Twelfths.
                 */

  [class~="lap-and-up-push-1/12"] {
    left: 8.3333333% !important;
  }

  [class~="lap-and-up-push-5/12"] {
    left: 41.6666666% !important;
  }

  [class~="lap-and-up-push-7/12"] {
    left: 58.3333333% !important;
  }

  [class~="lap-and-up-push-11/12"] {
    left: 91.6666666% !important;
  }
}

@media screen and (max-width: 63.9375em) {
  /**
                 * Whole.
                 */

  [class~="portable-push-1/1"] {
    left: 100% !important;
  }

  /**
                 * Halves.
                 */

  [class~="portable-push-1/2"],
  [class~="portable-push-2/4"],
  [class~="portable-push-3/6"],
  [class~="portable-push-4/8"],
  [class~="portable-push-5/10"],
  [class~="portable-push-6/12"] {
    left: 50% !important;
  }

  /**
                 * Thirds.
                 */

  [class~="portable-push-1/3"],
  [class~="portable-push-2/6"],
  [class~="portable-push-3/9"],
  [class~="portable-push-4/12"] {
    left: 33.3333333% !important;
  }

  [class~="portable-push-2/3"],
  [class~="portable-push-4/6"],
  [class~="portable-push-6/9"],
  [class~="portable-push-8/12"] {
    left: 66.6666666% !important;
  }

  /**
                 * Quarters.
                 */

  [class~="portable-push-1/4"],
  [class~="portable-push-2/8"],
  [class~="portable-push-3/12"] {
    left: 25% !important;
  }

  [class~="portable-push-3/4"],
  [class~="portable-push-6/8"],
  [class~="portable-push-9/12"] {
    left: 75% !important;
  }

  /**
                 * Fifths.
                 */

  [class~="portable-push-1/5"],
  [class~="portable-push-2/10"] {
    left: 20% !important;
  }

  [class~="portable-push-2/5"],
  [class~="portable-push-4/10"] {
    left: 40% !important;
  }

  [class~="portable-push-3/5"],
  [class~="portable-push-6/10"] {
    left: 60% !important;
  }

  [class~="portable-push-4/5"],
  [class~="portable-push-8/10"] {
    left: 80% !important;
  }

  /**
                 * Sixths.
                 */

  [class~="portable-push-1/6"],
  [class~="portable-push-2/12"] {
    left: 16.6666666% !important;
  }

  [class~="portable-push-5/6"],
  [class~="portable-push-10/12"] {
    left: 83.3333333% !important;
  }

  /**
                 * Eighths.
                 */

  [class~="portable-push-1/8"] {
    left: 12.5% !important;
  }

  [class~="portable-push-3/8"] {
    left: 37.5% !important;
  }

  [class~="portable-push-5/8"] {
    left: 62.5% !important;
  }

  [class~="portable-push-7/8"] {
    left: 87.5% !important;
  }

  /**
                 * Ninths.
                 */

  [class~="portable-push-1/9"] {
    left: 11.1111111% !important;
  }

  [class~="portable-push-2/9"] {
    left: 22.2222222% !important;
  }

  [class~="portable-push-4/9"] {
    left: 44.4444444% !important;
  }

  [class~="portable-push-5/9"] {
    left: 55.5555555% !important;
  }

  [class~="portable-push-7/9"] {
    left: 77.7777777% !important;
  }

  [class~="portable-push-8/9"] {
    left: 88.8888888% !important;
  }

  /**
                 * Tenths.
                 */

  [class~="portable-push-1/10"] {
    left: 10% !important;
  }

  [class~="portable-push-3/10"] {
    left: 30% !important;
  }

  [class~="portable-push-7/10"] {
    left: 70% !important;
  }

  [class~="portable-push-9/10"] {
    left: 90% !important;
  }

  /**
                 * Twelfths.
                 */

  [class~="portable-push-1/12"] {
    left: 8.3333333% !important;
  }

  [class~="portable-push-5/12"] {
    left: 41.6666666% !important;
  }

  [class~="portable-push-7/12"] {
    left: 58.3333333% !important;
  }

  [class~="portable-push-11/12"] {
    left: 91.6666666% !important;
  }
}

@media screen and (min-width: 64em) {
  /**
                 * Whole.
                 */

  [class~="desk-push-1/1"] {
    left: 100% !important;
  }

  /**
                 * Halves.
                 */

  [class~="desk-push-1/2"],
  [class~="desk-push-2/4"],
  [class~="desk-push-3/6"],
  [class~="desk-push-4/8"],
  [class~="desk-push-5/10"],
  [class~="desk-push-6/12"] {
    left: 50% !important;
  }

  /**
                 * Thirds.
                 */

  [class~="desk-push-1/3"],
  [class~="desk-push-2/6"],
  [class~="desk-push-3/9"],
  [class~="desk-push-4/12"] {
    left: 33.3333333% !important;
  }

  [class~="desk-push-2/3"],
  [class~="desk-push-4/6"],
  [class~="desk-push-6/9"],
  [class~="desk-push-8/12"] {
    left: 66.6666666% !important;
  }

  /**
                 * Quarters.
                 */

  [class~="desk-push-1/4"],
  [class~="desk-push-2/8"],
  [class~="desk-push-3/12"] {
    left: 25% !important;
  }

  [class~="desk-push-3/4"],
  [class~="desk-push-6/8"],
  [class~="desk-push-9/12"] {
    left: 75% !important;
  }

  /**
                 * Fifths.
                 */

  [class~="desk-push-1/5"],
  [class~="desk-push-2/10"] {
    left: 20% !important;
  }

  [class~="desk-push-2/5"],
  [class~="desk-push-4/10"] {
    left: 40% !important;
  }

  [class~="desk-push-3/5"],
  [class~="desk-push-6/10"] {
    left: 60% !important;
  }

  [class~="desk-push-4/5"],
  [class~="desk-push-8/10"] {
    left: 80% !important;
  }

  /**
                 * Sixths.
                 */

  [class~="desk-push-1/6"],
  [class~="desk-push-2/12"] {
    left: 16.6666666% !important;
  }

  [class~="desk-push-5/6"],
  [class~="desk-push-10/12"] {
    left: 83.3333333% !important;
  }

  /**
                 * Eighths.
                 */

  [class~="desk-push-1/8"] {
    left: 12.5% !important;
  }

  [class~="desk-push-3/8"] {
    left: 37.5% !important;
  }

  [class~="desk-push-5/8"] {
    left: 62.5% !important;
  }

  [class~="desk-push-7/8"] {
    left: 87.5% !important;
  }

  /**
                 * Ninths.
                 */

  [class~="desk-push-1/9"] {
    left: 11.1111111% !important;
  }

  [class~="desk-push-2/9"] {
    left: 22.2222222% !important;
  }

  [class~="desk-push-4/9"] {
    left: 44.4444444% !important;
  }

  [class~="desk-push-5/9"] {
    left: 55.5555555% !important;
  }

  [class~="desk-push-7/9"] {
    left: 77.7777777% !important;
  }

  [class~="desk-push-8/9"] {
    left: 88.8888888% !important;
  }

  /**
                 * Tenths.
                 */

  [class~="desk-push-1/10"] {
    left: 10% !important;
  }

  [class~="desk-push-3/10"] {
    left: 30% !important;
  }

  [class~="desk-push-7/10"] {
    left: 70% !important;
  }

  [class~="desk-push-9/10"] {
    left: 90% !important;
  }

  /**
                 * Twelfths.
                 */

  [class~="desk-push-1/12"] {
    left: 8.3333333% !important;
  }

  [class~="desk-push-5/12"] {
    left: 41.6666666% !important;
  }

  [class~="desk-push-7/12"] {
    left: 58.3333333% !important;
  }

  [class~="desk-push-11/12"] {
    left: 91.6666666% !important;
  }
}

@media screen and (min-width: 45em) {
  .lap-and-up-pull-1\/2 {
    margin-left: -50%;
  }
}

/*------------------------------------*    #HEADINGS
\*------------------------------------*/

/**
 * Headings 1–6’s corresponding Greek-alphabet abstract classes for double-
 * stranded heading hierarchy: csswizardry.com/2012/02/pragmatic-practical-font-sizing-in-css
 *
 * Use these helper classes to cause other elements to adopt the styling of the
 * respective heading, e.g.:
 *
   <h2 class="alpha">Lorem ipsum</h2>
 *
 */

.alpha {
  font-size: 48px;
  font-size: 3rem;
  line-height: 1;
}

.beta {
  font-size: 36px;
  font-size: 2.25rem;
  line-height: 1.3333333333;
}

.gamma {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 1;
}

.delta {
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 1.2;
}

.epsilon {
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1.3333333333;
}

.zeta {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.7142857143;
}

/*------------------------------------*    #HEADINGS-RESPONSIVE
\*------------------------------------*/

/**
 * Based on _trumps.headings, this will generate resonsive equivalents of the
 * headings which change their font-size depending on the media-queries
 * set in _settings.responsive.
 */

.bg-white {
  background-color: #fff !important;
}

.white {
  color: #fff !important;
}

.bg-black {
  background-color: #333 !important;
}

.black {
  color: #333 !important;
}

.bg-grey {
  background-color: #E9EAEC !important;
}

.grey {
  color: #E9EAEC !important;
}

.bg-purple {
  background-color: #57407E !important;
}

.purple {
  color: #57407E !important;
}

.bg-green {
  background-color: #2BAD70 !important;
}

.green {
  color: #2BAD70 !important;
}

.bg-green-dark {
  background-color: #00564b !important;
}

.green-dark {
  color: #00564b !important;
}

.bg-magenta {
  background-color: #cc0070 !important;
}

.magenta {
  color: #cc0070 !important;
}

.bg-yellow {
  background-color: #D8BE00 !important;
}

.yellow {
  color: #D8BE00 !important;
}

.bg-blue {
  background-color: #36A9E1 !important;
}

.blue {
  color: #36A9E1 !important;
}

.bg-blue-dark {
  background-color: #142F52 !important;
}

.blue-dark {
  color: #142F52 !important;
}

.bg-brand {
  background-color: #17313C !important;
}

.brand {
  color: #17313C !important;
}

.s1 {
  font-size: 48px;
  font-size: 3rem;
  line-height: 1;
}

.s2 {
  font-size: 36px;
  font-size: 2.25rem;
  line-height: 1.3333333333;
}

.s3 {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 1;
}

.s4 {
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 1.3;
}

.s5 {
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1.3333333333;
}

.s6 {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.7142857143;
}

.link-bare {
  border-bottom: none;
}

.ucase {
  text-transform: uppercase !important;
}

.ncase {
  text-transform: none !important;
}

.lcase {
  text-transform: lowercase !important;
}

.round {
  border-radius: 50%;
}

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

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

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

.align-middle {
  vertical-align: middle;
}

.left {
  float: left;
}

.right {
  float: right;
}

.white {
  color: #fff !important;
}

.bold {
  font-weight: 500;
}

.regular {
  font-weight: 400;
}

.light {
  font-weight: 300;
}

.bg-red {
  background-color: red;
}

@media screen and (max-width: 44.9375em) {
  .palm-hide {
    display: none;
  }
}

@media screen and (min-width: 45em) {
  .lap-and-up-hide {
    display: none;
  }
}