@charset "UTF-8";
/**
 * Escape special characters in a selector.
 * @param  {String}  $pixels
 * @return {String}
 */
/**
 * Remove the unit of a length
 * @see http://hugogiraudel.com/2013/08/12/sass-functions/
 * @param  {Number}  $value  Number to remove unit from
 * @return {Number}          Unitless number
 */
/**
 * Convert px values (e.g. from a PSD) to ems.
 * @see http://viljamis.com/blog/2013/prototyping-responsive-typography/
 * @param  {Number}  $pixels
 * @param  {Number}  $context  Defaults to $font-size
 * @return {Number}            em value
 */
/**
 * Convert px values (e.g. from a PSD) to rems.
 * @see http://viljamis.com/blog/2013/prototyping-responsive-typography/
 * @param  {Number}  $pixels
 * @return {Number}           rem value
 */
/**
 * Subtract 1px from breakpoint so min/max queries don't overlap.
 * @todo Use 0.01em instead of 1px to avoid media query "void" when text zoom is on.
 * @see https://github.com/sass-mq/sass-mq/issues/6
 * @param  {Number}  $breakpoint
 * @return {Number}
 */
/**
 * Convert tracking (e.g. from a PSD) to ems for letter-spacing.
 * @param  {Number}  $tracking
 * @return {Number}             em value
 */
/**
 * Casting any value to a string.
 * @see http://hugogiraudel.com/2014/01/27/casting-types-in-sass/
 * @param  {mixed}   $value
 * @return {String}
 */
/**
 * Replace `$search` with `$replace` in `$string`.
 * @see https://github.com/HugoGiraudel/SassyStrings/blob/5c85bcae6ab51ef3996719ec31cce7aafd1a9fad/stylesheets/private/_str-replace.scss
 * @param  {String}  $string       - Initial string
 * @param  {String}  $search       - Substring to replace
 * @param  {String}  $replace ('') - New value
 * @return {String} - Updated string
 */
/**
 * Split `$string` into several parts using `$delimiter`.
 * @see https://github.com/HugoGiraudel/SassyStrings/blob/c587b74ad96532eb47ec8509deb8c212ba75478c/stylesheets/private/_str-explode.scss
 * @param  {String}  $string         - String to split
 * @param  {String}  $delimiter ('') - String to use as a delimiter to split `$string`
 * @return {List}
 */
/**
 * Global breakpoints for your application.
 * @note Always set the `em` context to 16 when you're using them for media
 * queries. Otherwise, if you change `$font-size` you'll get wonky values that
 * technically work but aren't what you wanted.
 * @see https://zellwk.com/blog/media-query-units/
 * @type {Map}
 */
/**
 * Accessible hover styles. Applies :hover styles to :focus and :active.
 * @see http://24ways.org/2007/css-for-accessibility
 */
/**
 * Hide only visually, but have it available for screen readers:
 * @see http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 */
/**
 * Keep an element invisible until an active class is added to it.
 * @param  {String}  $active-class
 */
/**
 * From Foundation's visibility classes
 * @see https://github.com/zurb/foundation-sites/blob/develop/scss/components/_visibility.scss
 * @see http://foundation.zurb.com/sites/docs/v/5.5.3/components/visibility.html
 */
/**
 * Get full path to font file.
 * @param  {String}  $path
 * @return {String}
 */
/**
 * Get full path to image file.
 * @param  {String}  $path
 * @return {String}
 */
/**
 * Clear floated elements.
 * @see https://css-tricks.com/snippets/css/clear-fix/
 */
/**
 * Polyfill object-fit and object-position.
 * Values: `fill`, `contain`, `cover`, `none`, `scale-down`.
 * @note Requires polyfill for IE and Edge.
 * @see http://caniuse.com/#feat=object-fit
 * @see https://github.com/aFarkas/lazysizes/tree/gh-pages/plugins/object-fit
 * @see https://github.com/bfred-it/object-fit-images
 * @param  {String}  $value
 */
/**
 * Input placeholders
 * @see https://github.com/twbs/bootstrap/blob/c04aa41ee2744b769be38526bbdef11e5be9421b/less/mixins/vendor-prefixes.less#L100-L109
 */
/**
 * Generic property utility.
 * @param  {String}  $property
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/**
 * Directional property utility.
 * Valid aliases: `top`, `gray`, `gray-3`, `top-gray`, `top-gray-3`.
 * @param  {String}  $property
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/**
 * Add new breakpoint alias.
 * @see http://oddbird.net/2013/10/19/map-merge
 * @see https://github.com/sass/sass/issues/1511#issuecomment-61907897
 *
 * Example:
 * `@include add-breakpoint('sidebar', 60em);`
 *
 * @param  {String}  $alias
 * @param  {Number}  $value
 * @return {Boolean}
 */
/**
 * Generate media queries based on a map of `$breakpoints`. Defaults to
 * mobile-first, min-width queries.
 *
 * Allows quick prefixes to modify breakpoints:
 * - `lt-`: Desktop-first, max-width queries (automatically removes 1px to avoid query overlap)
 * - `btwn-`: Between min- and max-width queries
 *
 * Based on Inuit's responsive tools:
 * @see https://github.com/inuitcss/settings.responsive/blob/master/_settings.responsive.scss
 * @see https://github.com/inuitcss/tools.responsive/blob/master/_tools.responsive.scss
 *
 * And Sass MQ:
 * @see https://github.com/sass-mq/sass-mq
 *
 * @note `$breakpoints` is defined in `resources/assets/sass/settings/_breakpoints.scss`
 *
 * @param  {String}  $breakpoint-name
 */
/**
 * Generate breakpoint-specific classes.
 * @param  {String}  $alias
 * @param  {String}  $at-breakpoint
 */
/**
 * Build an SVG. Based on Noah Blon's work.
 * @see http://codepen.io/noahblon/pen/xGbXdV
 * @param  {String}  $icon
 * @param  {Number}  $width
 * @param  {Number}  $height
 * @return {String}
 */
/**
 * Build an SVG path. Based on Noah Blon's work.
 * @see http://codepen.io/noahblon/pen/xGbXdV
 * @param  {String} $path
 * @param  {Map}    $parameters
 * @return {String}
 */
/**
 * Optimize SVGs in data URIs. Based on Taylor Hunt's and jakob-e's work.
 * @see https://codepen.io/tigt/post/optimizing-svgs-in-data-uris
 * @see https://codepen.io/jakob-e/pen/doMoML
 * @param  {String}  $svg
 * @param  {Number}  $width
 * @param  {Number}  $height
 * @return {String}
 */
/**
 * Font smoothing on OS X.
 * @see https://maximilianhoffmann.com/posts/better-font-rendering-on-osx
 * @param  {Boolean}  $value
 * @return {[type]}
 */
/*doc
---
title: Grid
name: grid
category: Objects
---
## Sass

```scss
// Basic
@include o-grid();
@include o-grid__item();

// Responsive
@include o-grid('sm');
```

## Markup

### Basic

```html_example
<div class="o-grid">
  <p class="o-grid__item  /  u-width-1/2">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
  <p class="o-grid__item  /  u-width-1/2">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
</div>
```

### Responsive

```html_example
<div class="o-grid@sm">
  <p class="o-grid__item  /  u-width-1/1  u-width-1/2@sm">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
  <p class="o-grid__item  /  u-width-1/1  u-width-1/2@sm">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
</div>
```
*/
/**
 * Grid object.
 * @param  {String}  $at-breakpoint
 */
/**
 * Grid object item.
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Grid Gutters
name: grid-gutters
category: Objects
---
<span class="todo">TODO:</span> Allow directional gutters (e.g., `all`, `horizontal`, or `vertical`).

## Sass

```scss
// Basic
@include o-grid--gutters('sm', $gutter-sm);

// Responsive
@include o-grid--gutters('sm', $gutter-sm, 'sm');
```

## Markup

### Basic

```html_example
<div class="o-grid  o-grid--gutters-sm">
  <p class="o-grid__item  /  u-width-1/2">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
  <p class="o-grid__item  /  u-width-1/2">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
</div>
```

### Responsive

```html_example
<div class="o-grid  o-grid--gutters-sm@sm">
  <p class="o-grid__item  /  u-width-1/2">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
  <p class="o-grid__item  /  u-width-1/2">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
</div>
```
*/
/**
 * Grid with gutters.
 * @param  {String}  $alias
 * @param  {Number}  $size
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Icon
name: icon
category: Objects
---
<span class="todo">IMPORTANT:</span> When preparing SVGs:

1. Remove every `fill` and `stroke` attribute that should inherit its color from CSS.
2. Set `fill="none"` or `stroke="none"` anywhere a color should _not_ be applied.

## Sass

```scss
// Basic
@include o-icon();
@include o-icon--size(70, 70);

// Responsive
@include o-icon('sm');
@include o-icon--size(120, 120, 'sm');
```

## Markup

### Basic

```html_example
<i class="o-icon  o-icon--mode-logo  o-icon--70x70">
  <svg>
    <use xlink:href="./img/svg/sprites/global.svg#mode-logo"></use>
  </svg>
</i>
```

### Responsive

```html_example
<i class="o-icon  o-icon--mode-logo  o-icon--70x70  o-icon--120x120@sm">
  <svg>
    <use xlink:href="./img/svg/sprites/global.svg#mode-logo"></use>
  </svg>
</i>
```
*/
/**
 * Icon object.
 * @param  {String}  $at-breakpoint
 */
/**
 * Icon size helper.
 * @param  {Number}  $width
 * @param  {Number}  $height
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: List
name: list
category: Objects
---
## Sass

```scss
// Basic
@include o-list();
@include o-list__item();

// Responsive
@include o-list('sm');
```

## Markup

### Basic

```html_example
<ul class="o-list">
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
</ul>
```

### Responsive

```html_example
<ul class="o-list@sm">
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
</ul>
```
*/
/**
 * List object.
 * @param  {String}  $at-breakpoint
 */
/**
 * List object item.
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: List Border
name: list-border
category: Objects
---
<span class="todo">TODO:</span> Allow directional gutters (e.g., `all`, `horizontal`, or `vertical`).

## Sass

```scss
// Basic
@include o-list--border('', 1px solid $color-gray-3);

// Responsive
@include o-list--border('', 1px solid $color-gray-3, 'sm');
```

## Markup

### Basic

```html_example
<ul class="o-list  o-list--border">
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
</ul>
```

### Responsive

```html_example
<ul class="o-list  o-list--border@sm">
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
</ul>
```
*/
/**
 * Block list separated by borders.
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: List Bullet
name: list-bullet
category: Objects
---
## Sass

```scss
// Basic
@include o-list--bullet('', 1rem);

// Responsive
@include o-list--bullet('', 1rem, 'sm');
```

## Markup

### Basic

```html_example
<ul class="o-list  o-list--bullet">
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
</ul>
```

### Responsive

```html_example
<ul class="o-list  o-list--bullet@sm">
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
</ul>
```
*/
/**
 * Bulleted list.
 * @param  {String}  $alias
 * @param  {Number}  $margin
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: List Comma
name: list-comma
category: Objects
---
## Sass

```scss
// Basic
@include o-list--comma();

// Responsive
@include o-list--comma('sm');
```

## Markup

### Basic

```html_example
<ul class="o-list  o-list--comma">
  <li class="o-list__item">Lorem</li>
  <li class="o-list__item">Ipsum</li>
  <li class="o-list__item">Dolor</li>
</ul>
```

### Responsive

```html_example
<ul class="o-list  o-list--comma@sm">
  <li class="o-list__item">Lorem</li>
  <li class="o-list__item">Ipsum</li>
  <li class="o-list__item">Dolor</li>
</ul>
```
*/
/**
 * Inline list separated by commas.
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: List Disc
name: list-disc
category: Objects
---
## Sass

```scss
// Basic
@include o-list--disc('', 1.125em);

// Responsive
@include o-list--disc('', 1.125em, 'sm');
```

## Markup

### Basic

```html_example
<ul class="o-list  o-list--disc">
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
</ul>
```

### Responsive

```html_example
<ul class="o-list  o-list--disc@sm">
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
</ul>
```
*/
/**
 * Bulleted list with native disc style.
 * @param  {String}  $alias
 * @param  {Number}  $padding
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: List Inline
name: list-inline
category: Objects
---
## Sass

```scss
// Basic
@include o-list--inline();

// Responsive
@include o-list--inline('sm');
```

## Markup

### Basic

```html_example
<ul class="o-list  o-list--inline">
  <li class="o-list__item">Lorem</li>
  <li class="o-list__item">Ipsum</li>
  <li class="o-list__item">Dolor</li>
</ul>
```

### Responsive

```html_example
<ul class="o-list  o-list--inline@sm">
  <li class="o-list__item">Lorem</li>
  <li class="o-list__item">Ipsum</li>
  <li class="o-list__item">Dolor</li>
</ul>
```
*/
/**
 * Inline list.
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: List Leading Zero
name: list-leading-zero
category: Objects
---
## Sass

```scss
// Basic
@include o-list--leading-zero();

// Responsive
@include o-list--leading-zero('sm');
```

## Markup

### Basic

```html_example
<ol class="o-list  o-list--leading-zero">
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
</ol>
```

### Responsive

```html_example
<ol class="o-list  o-list--leading-zero@sm">
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
</ol>
```
*/
/**
 * Numbered list with leading zeroes.
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: List Number
name: list-number
category: Objects
---
## Sass

```scss
// Basic
@include o-list--number();

// Responsive
@include o-list--number('sm');
```

## Markup

### Basic

```html_example
<ol class="o-list  o-list--number">
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
</ol>
```

### Responsive

```html_example
<ol class="o-list  o-list--number@sm">
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
</ol>
```
*/
/**
 * Numbered list.
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: List Roman
name: list-roman
category: Objects
---
## Sass

```scss
// Basic
@include o-list--roman();

// Responsive
@include o-list--roman('sm');
```

## Markup

### Basic

```html_example
<ol class="o-list  o-list--roman">
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
</ol>
```

### Responsive

```html_example
<ol class="o-list  o-list--roman@sm">
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
  <li class="o-list__item"><span class="o-list__counter"></span> Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
</ol>
```
*/
/**
 * Numbered list with Roman numerals.
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: List Slash
name: list-slash
category: Objects
---
## Sass

```scss
// Basic
@include o-list--slash();

// Responsive
@include o-list--slash('sm');
```

## Markup

### Basic

```html_example
<ul class="o-list  o-list--slash">
  <li class="o-list__item">Lorem</li>
  <li class="o-list__item">Ipsum</li>
  <li class="o-list__item">Dolor</li>
</ul>
```

### Responsive

```html_example
<ul class="o-list  o-list--slash@sm">
  <li class="o-list__item">Lorem</li>
  <li class="o-list__item">Ipsum</li>
  <li class="o-list__item">Dolor</li>
</ul>
```
*/
/**
 * Inline list separated by slashes.
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Media
name: media
category: Objects
---

## Sass

```scss
// Basic
@include o-media();
@include o-media__figure();
@include o-media__body();

// Responsive
@include o-media('sm');
```

## Markup

### Basic

```html_example
<div class="o-media  /  u-align-items-center">
  <figure class="o-media__figure  /  u-padding-right-sm">
    <img src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
  </figure>
  <p class="o-media__body">
    Lorem ipsum dolor sit amet, consectetur adipisicing elit.
  </p>
</div>
```

### Responsive

```html_example
<div class="o-media@sm  /  u-align-items-center">
  <figure class="o-media__figure  /  u-padding-right-sm@sm">
    <img src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
  </figure>
  <p class="o-media__body">
    Lorem ipsum dolor sit amet, consectetur adipisicing elit.
  </p>
</div>
```
*/
/**
 * Flexible media objects.
 * @see https://philipwalton.github.io/solved-by-flexbox/demos/media-object/
 * @param  {String}  $at-breakpoint
 */
/**
 * Media object figure.
 * @param  {String}  $at-breakpoint
 */
/**
 * Media object body.
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Section
name: section
category: Objects
---
## Sass

```scss
// Basic
@include o-section();

// Responsive
@include o-section('sm');
```

## Markup

### Basic

```html_example
<section class="o-section">
  <h4>Lorem ipsum</h4>
  <p>Dolor sit amet, consectetur adipisicing elit.</p>
</section>
```

### Responsive

```html_example
<section class="o-section@sm">
  <h4>Lorem ipsum</h4>
  <p>Dolor sit amet, consectetur adipisicing elit.</p>
</section>
```
*/
/**
 * Section object.
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Table
name: table
category: Objects
---
## Sass

```scss
// Basic
@include o-table();
@include o-table__item();

// Responsive
@include o-table('sm');
```

## Markup

### Basic

```html_example
<div class="o-table">
  <p class="o-table__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
  <p class="o-table__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
</div>
```

### Responsive

```html_example
<div class="o-table@sm">
  <p class="o-table__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
  <p class="o-table__item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
</div>
```
*/
/**
 * Table object.
 * @param  {String}  $at-breakpoint
 */
/**
 * Table object item.
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Video
name: video
category: Objects
---
## Sass

```scss
// Basic
@include o-video();
@include o-video__close();
@include o-video__element();
@include o-video--overlay();

// Responsive
@include o-video('sm');
```

## Markup

### Basic

```html_example
<figure class="o-video  /  js-video-wrapper">
  <div class="u-aspect-ratio-16x9"></div>
  <div id="video" class="o-video__element  /  js-video" data-video='{
    "url": "https://www.youtube.com/watch?v=0qo78R_yYFA"
  }'></div>
</figure>
```

### Overlay

```html_example
<div class="o-video  o-video--overlay  /  js-video-wrapper">
  <img src="./img/spacex-interplanetary-transport-system.jpg" width="1920" height="1080" alt="SpaceX Interplanetary Transport System">
  <button class="o-video__play  /  u-position-center  /  js-video-open" type="button" data-video="#video-overlay">Play Video</button>
  <figure class="o-video__wrapper">
    <button class="o-video__close  /  js-video-close" type="button">Close</button>
    <div id="video-overlay" class="o-video__element  /  js-video" data-video='{
      "url": "https://www.youtube.com/watch?v=0qo78R_yYFA"
    }'></div>
  </figure>
</div>
```
*/
/**
 * Video object.
 * @param  {String}  $at-breakpoint
 */
/**
 * Video object wrapper.
 * @param  {String}  $at-breakpoint
 */
/**
 * Video object element.
 * @see http://embedresponsively.com/
 * @note Since YouTube automatically letterboxes videos, we don't have to worry about aspect ratio or centering
 * @param  {String}  $at-breakpoint
 */
/**
 * Video object play button.
 * @param  {String}  $at-breakpoint
 */
/**
 * Video object close button.
 * @param  {String}  $at-breakpoint
 */
/**
 * Video overlay.
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Browser Upgrade
name: browser-upgrade
category: Components
---
## Sass

```scss
@include c-browser-upgrade();
```

## Markup

### Basic

```html_example
<p class="c-browser-upgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
```

### Internet Explorer 9 and below

```html_example
<!--[if IE]><p class="c-browser-upgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p><![endif]-->
```
*/
/**
 * Browser upgrade prompt for old Internet Explorer.
 */
/*doc
---
title: Align Items
name: align-items
category: Utilities
---
## Sass

```scss
// Basic
@include u-align-items('center');

// Responsive
@include u-align-items('center', 'sm');
```

## Markup

### Basic

```html_example
<div class="u-display-flex  /  u-align-items-center">
  <img src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
  <img src="http://placehold.it/200/00ff00/ffffff?text=2" width="200" height="200" alt="Item 2">
  <img src="http://placehold.it/100/0000ff/ffffff?text=3" width="100" height="100" alt="Item 3">
</div>
```

### Responsive

```html_example
<div class="u-display-flex  /  u-align-items-center@sm">
  <img src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
  <img src="http://placehold.it/200/00ff00/ffffff?text=2" width="200" height="200" alt="Item 2">
  <img src="http://placehold.it/100/0000ff/ffffff?text=3" width="100" height="100" alt="Item 3">
</div>
```
*/
/**
 * Align-items utility.
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Align Self
name: align-self
category: Utilities
---
## Sass

```scss
// Basic
@include u-align-self('flex-start');
@include u-align-self('flex-end');

// Responsive
@include u-align-self('flex-start', 'sm');
@include u-align-self('flex-end', 'sm');
```

## Markup

### Basic

```html_example
<div class="u-display-flex  /  u-align-items-center">
  <img class="u-align-self-flex-start" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
  <img src="http://placehold.it/200/00ff00/ffffff?text=2" width="200" height="200" alt="Item 2">
  <img class="u-align-self-flex-end" src="http://placehold.it/100/0000ff/ffffff?text=3" width="100" height="100" alt="Item 3">
</div>
```

### Responsive

```html_example
<div class="u-display-flex  /  u-align-items-center">
  <img class="u-align-self-flex-start@sm" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
  <img src="http://placehold.it/200/00ff00/ffffff?text=2" width="200" height="200" alt="Item 2">
  <img class="u-align-self-flex-end@sm" src="http://placehold.it/100/0000ff/ffffff?text=3" width="100" height="100" alt="Item 3">
</div>
```
*/
/**
 * Align-self utility.
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Animation
name: animation
category: Utilities
---
## Sass

```scss
@keyframes fade-in {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

// Basic
@include u-animation('fade-in-400ms', 400ms fade-in linear forwards) {
  opacity: 1;
}

// Responsive
@include u-animation('fade-in-400ms', 400ms fade-in linear forwards, 'sm') {
  opacity: 1;
}
```

## Markup

### Basic

```html_example
<img class="u-animation-fade-in-400ms" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
```

### Responsive

```html_example
<img class="u-animation-fade-in-400ms@sm" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
```
*/
/**
 * Animation utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Aspect Ratio
name: aspect-ratio
category: Utilities
---
<span class="todo">TODO:</span> Make `btwn` alias for mq (e.g., `u-aspect-ratio--3x2@btwn-sm-and-md`).

## Sass

```scss
// Basic
@include u-aspect-ratio(3, 1);
@include u-aspect-ratio(16, 9);

// Responsive
@include u-aspect-ratio(3, 1, 'sm');
@include u-aspect-ratio(16, 9, 'sm');
```

## Markup

### Basic

```html_example
<div class="u-background-color-gray-1">
  <div class="u-aspect-ratio-16x9"></div>
</div>
```

### Responsive

```html_example
<div class="u-background-color-gray-1">
  <div class="u-aspect-ratio-3x1  u-aspect-ratio-16x9@sm"></div>
</div>
```
*/
/**
 * Aspect ratio utility.
 * @param  {Number}  $width
 * @param  {Number}  $height
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Background Color
name: background-color
category: Utilities
---
## Sass

```scss
// Basic
@include u-background-color('gray-1', $color-gray-1);

// Responsive
@include u-background-color('gray-1', $color-gray-1, 'sm');
```

## Markup

### Basic

```html_example
<p class="u-background-color-gray-3">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
```

### Responsive

```html_example
<p class="u-background-color-gray-3">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
```
*/
/**
 * Background-color utility.
 * @param  {String} $alias
 * @param  {String} $value
 * @param  {String} $at-breakpoint
 */
/*doc
---
title: Background Position
name: background-position
category: Utilities
---
## Sass

```scss
// Basic
@include u-background-position('top-right', top right);

// Responsive
@include u-background-position('top-right', top right, 'sm');
```

## Markup

### Basic

```html_example
<div class="u-background-position-top-right" style="background-image: url('http://placehold.it/100/ff0000/ffffff?text=1'); background-size: 100px; background-repeat: no-repeat;">
  <div class="u-aspect-ratio-3x1"></div>
</div>
```

### Responsive

```html_example
<div class="u-background-position-top-right@sm" style="background-image: url('http://placehold.it/100/ff0000/ffffff?text=1'); background-size: 100px; background-repeat: no-repeat;">
  <div class="u-aspect-ratio-3x1"></div>
</div>
```
*/
/**
 * Background-position utility.
 * @param  {String} $alias
 * @param  {String} $value
 * @param  {String} $at-breakpoint
 */
/*doc
---
title: Border
name: border
category: Utilities
---
Directions: null, `vertical`, `horizontal`, `top`, `right`, `bottom`, `left`.

## Sass

```scss
// Basic
@include u-border('top-gray-3', 1px solid $color-gray-3);

// Responsive
@include u-border('top-gray-3', 1px solid $color-gray-3, 'sm');
```

## Markup

### Basic

```html_example
<div class="u-border-top-gray-3">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div>
```

### Responsive

```html_example
<div class="u-border-top-gray-3@sm">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div>
```
*/
/**
 * Border utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Box Shadow
name: box-shadow
category: Utilities
---
## Sass

```scss
// Basic
@include u-box-shadow('down-black-1', 0 2px 5px rgba($color-black-1, 0.1));

// Responsive
@include u-box-shadow('down-black-1', 0 2px 5px rgba($color-black-1, 0.1), 'sm');
```

## Markup

### Basic

```html_example
<div class="u-box-shadow-down-black-1">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div>
```

### Responsive

```html_example
<div class="u-box-shadow-down-black-1@sm">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div>
```
*/
/**
 * Box-shadow utility.
 * @param  {String} $alias
 * @param  {String} $value
 * @param  {String} $at-breakpoint
 */
/*doc
---
title: Color
name: color
category: Utilities
---
## Sass

```scss
// Basic
@include u-color('red-1', $color-red-1);

// Responsive
@include u-color('red-1', $color-red-1, 'sm');
```

## Markup

### Basic

```html_example
<p class="u-color-red-1">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
```

### Responsive

```html_example
<p class="u-color-red-1">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
```
*/
/**
 * Color utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Content
name: content
category: Utilities
---
## Sass

```scss
// Basic
@include u-content-before('arrow-left', '« ');
@include u-content-after('arrow-right', ' »');

// Responsive
@include u-content-before('arrow-left', '« ', 'sm');
@include u-content-after('arrow-right', ' »', 'sm');
```

## Markup

### Basic

```html_example
<div class="u-content-before-arrow-left  u-content-after-arrow-right">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</div>
```

### Responsive

```html_example
<div class="u-content-before-arrow-left@sm  u-content-after-arrow-right@sm">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</div>
```
*/
/**
 * Content utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Depth (z-index)
name: depth
category: Utilities
---
<span class="todo">TODO:</span> How should we handle negative values? For example, should we use parens: `.u-depth\(-1\) { z-index: -1; }`.

## Sass

```scss
// Basic
@include u-depth(1);
@include u-depth(2);
@include u-depth(3);

// Responsive
@include u-depth(1, 'sm');
@include u-depth(2, 'sm');
@include u-depth(3, 'sm');
```

## Markup

### Basic

```html_example
<div class="u-position-relative">
  <div class="u-aspect-ratio-3x1"></div>
  <img class="u-depth-2" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1" style="position: absolute; top: 20px; left: 20px;">
  <img class="u-depth-3" src="http://placehold.it/100/00ff00/ffffff?text=2" width="100" height="100" alt="Item 2" style="position: absolute; top: 40px; left: 40px;">
  <img class="u-depth-1" src="http://placehold.it/100/0000ff/ffffff?text=3" width="100" height="100" alt="Item 3" style="position: absolute; top: 60px; left: 60px;">
</div>
```

### Responsive

```html_example
<div class="u-position-relative">
  <div class="u-aspect-ratio-3x1"></div>
  <img class="u-depth-2@sm" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1" style="position: absolute; top: 20px; left: 20px;">
  <img class="u-depth-3@sm" src="http://placehold.it/100/00ff00/ffffff?text=2" width="100" height="100" alt="Item 2" style="position: absolute; top: 40px; left: 40px;">
  <img class="u-depth-1@sm" src="http://placehold.it/100/0000ff/ffffff?text=3" width="100" height="100" alt="Item 3" style="position: absolute; top: 60px; left: 60px;">
</div>
```
*/
/**
 * Depth utility.
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Display
name: display
category: Utilities
---
## Sass

```scss
// Basic
@include u-display('block');
@include u-visually-hidden();

// Responsive
@include u-display('block', 'sm');
@include u-visually-hidden('sm');
```

## Markup

### Basic

```html_example
<span class="u-display-block  /  u-background-color-gray-3">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</span>
```

### Responsive

```html_example
<span class="u-display-block@sm  /  u-background-color-gray-3">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</span>
```
*/
/**
 * Display utility.
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/**
 * Visually hidden utility.
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Flex
name: flex
category: Utilities
---
## Sass

```scss
// Basic
@include u-flex('0', 0);
@include u-flex('1', 1);

// Responsive
@include u-flex('0', 0, 'sm');
@include u-flex('1', 1, 'sm');
```

## Markup

### Basic

```html_example
<div class="u-display-flex">
  <img class="u-flex-0" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
  <img class="u-flex-1" src="http://placehold.it/100/00ff00/ffffff?text=2" width="100" height="100" alt="Item 2">
</div>
```

### Responsive

```html_example
<div class="u-display-flex">
  <img class="u-flex-0@sm" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
  <img class="u-flex-1@sm" src="http://placehold.it/100/00ff00/ffffff?text=2" width="100" height="100" alt="Item 2">
</div>
```
*/
/**
 * Flex utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Flex Direction
name: flex-direction
category: Utilities
---
## Sass

```scss
// Basic
@include u-flex-direction('row-reverse');

// Responsive
@include u-flex-direction('row-reverse', 'sm');
```

## Markup

### Basic

```html_example
<div class="u-display-flex  /  u-flex-direction-row-reverse">
  <img src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
  <img src="http://placehold.it/100/00ff00/ffffff?text=2" width="100" height="100" alt="Item 2">
  <img src="http://placehold.it/100/0000ff/ffffff?text=3" width="100" height="100" alt="Item 3">
</div>
```

### Responsive

```html_example
<div class="u-display-flex  /  u-flex-direction-row-reverse@sm">
  <img src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
  <img src="http://placehold.it/100/00ff00/ffffff?text=2" width="100" height="100" alt="Item 2">
  <img src="http://placehold.it/100/0000ff/ffffff?text=3" width="100" height="100" alt="Item 3">
</div>
```
*/
/**
 * Flex direction utility.
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Flex Wrap
name: flex-wrap
category: Utilities
---
## Sass

```scss
// Basic
@include u-flex-wrap('wrap');

// Responsive
@include u-flex-wrap('wrap', 'sm');
```

## Markup

### Basic

```html_example
<div class="u-display-flex  /  u-flex-wrap-wrap">
  <img src="http://placehold.it/300x100/ff0000/ffffff?text=1" width="300" height="100" alt="Item 1">
  <img src="http://placehold.it/300x100/00ff00/ffffff?text=2" width="300" height="100" alt="Item 2">
  <img src="http://placehold.it/300x100/0000ff/ffffff?text=3" width="300" height="100" alt="Item 3">
</div>
```

### Responsive

```html_example
<div class="u-display-flex  /  u-flex-wrap-wrap@sm">
  <img src="http://placehold.it/300x100/ff0000/ffffff?text=1" width="300" height="100" alt="Item 1">
  <img src="http://placehold.it/300x100/00ff00/ffffff?text=2" width="300" height="100" alt="Item 2">
  <img src="http://placehold.it/300x100/0000ff/ffffff?text=3" width="300" height="100" alt="Item 3">
</div>
```
*/
/**
 * Flex-wrap utility.
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Float
name: float
category: Utilities
---
## Sass

```scss
// Basic
@include u-float('right');
@include u-float('left');
@include u-clearfix('right');

// Responsive
@include u-float('right', 'sm');
@include u-float('left', 'sm');
@include u-clearfix('sm');
```

## Markup

### Basic

```html_example
<p class="u-clearfix">
  <img class="u-float-right" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
</p>
```

### Responsive

```html_example
<p class="u-clearfix">
  <img class="u-float-right@sm" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
</p>
```
*/
/**
 * Float utility.
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/**
 * Clearfix utility.
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Font Family
name: font-family
category: Utilities
---
## Sass

```scss
// Basic
@include u-font-family('display', $font-family--display);

// Responsive
@include u-font-family('display', $font-family--display, 'sm');
```

## Markup

### Basic

```html_example
<p class="u-font-family-display">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
```

### Responsive

```html_example
<p class="u-font-family-display@sm">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
```
*/
/**
 * Font-family utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Font Size
name: font-size
category: Utilities
---
## Sass

```scss
// Basic
@include u-font-size('100%', 100%);
@include u-font-size('heading', 1.5rem);

// Responsive
@include u-font-size('100%', 100%, 'sm');
@include u-font-size('heading', 1.5rem, 'sm');
```

## Markup

### Basic

```html_example
<h4 class="u-font-size-100%">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</h4>
<p class="u-font-size-heading">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
```

### Responsive

```html_example
<h4 class="u-font-size-100%@sm">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</h4>
<p class="u-font-size-heading@sm">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
```
*/
/**
 * Font-size utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Font Style
name: font-style
category: Utilities
---
## Sass

```scss
// Basic
@include u-font-style('italic');

// Responsive
@include u-font-style('italic', 'sm');
```

## Markup

### Basic

```html_example
<p class="u-font-style-italic">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
```

### Responsive

```html_example
<p class="u-font-style-italic@sm">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
```
*/
/**
 * Font-style utility.
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Font Weight
name: font-weight
category: Utilities
---
## Sass

```scss
// Basic
@include u-font-weight('400', 400);
@include u-font-weight('bold', bold);

// Responsive
@include u-font-weight('400', 400, 'sm');
@include u-font-weight('bold', bold, 'sm');
```

## Markup

### Basic

```html_example
<h4 class="u-font-weight-400">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</h4>
<p class="u-font-weight-bold@sm">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
```

### Responsive

```html_example
<h4 class="u-font-weight-400@sm">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</h4>
<p class="u-font-weight-bold@sm">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
```
*/
/**
 * Font weight utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Height
name: height
category: Utilities
---
## Sass

```scss
// Basic
@include u-height('50vh', 50vh);

// Responsive
@include u-height('50vh', 50vh, 'sm');
```

## Markup

### Basic

```html_example
<img class="u-height-50vh" src="http://placehold.it/200/ff0000/ffffff?text=1" width="200" height="200" alt="Item 1">
```

### Responsive

```html_example
<img class="u-height-50vh@sm" src="http://placehold.it/200/ff0000/ffffff?text=1" width="200" height="200" alt="Item 1">
```
*/
/**
 * Height utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Hover
name: hover
category: Utilities
---
<span class="todo">TODO:</span> How can we include default properties like `transition`?

## Sass

```scss
// Basic
@include u-hover('dim', 'is-active') {
  opacity: 0.6;
}

// Responsive
@include u-hover('dim', 'is-active', 'sm') {
  opacity: 0.6;
}
```

## Markup

### Basic

```html_example
<img class="u-hover-dim" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
```

### Responsive

```html_example
<img class="u-hover-dim@sm" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
```
*/
/**
 * Hover utility.
 * @param  {String}  $alias
 * @param  {Map}     $active-class
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Justify Content
name: justify-content
category: Utilities
---
## Sass

```scss
// Basic
@include u-justify-content('center');

// Responsive
@include u-justify-content('center', 'sm');
```

## Markup

### Basic

```html_example
<div class="u-display-flex  /  u-justify-content-center">
  <img src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
  <img src="http://placehold.it/100/00ff00/ffffff?text=2" width="100" height="100" alt="Item 2">
  <img src="http://placehold.it/100/0000ff/ffffff?text=3" width="100" height="100" alt="Item 3">
</div>
```

### Responsive

```html_example
<div class="u-display-flex  /  u-justify-content-center@sm">
  <img src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
  <img src="http://placehold.it/100/00ff00/ffffff?text=2" width="100" height="100" alt="Item 2">
  <img src="http://placehold.it/100/0000ff/ffffff?text=3" width="100" height="100" alt="Item 3">
</div>
```
*/
/**
 * Justify-content utility.
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Line Height
name: line-height
category: Utilities
---
## Sass

```scss
// Basic
@include u-line-height('0.8', 0.8);

// Responsive
@include u-line-height('0.8', 0.8, 'sm');
```

## Markup

### Basic

```html_example
<p class="u-line-height-0.8">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Expedita reprehenderit aspernatur, non ratione excepturi et quia recusandae repellendus natus, libero facilis doloremque sint inventore voluptatem, voluptatibus odio sapiente iste officiis.</p>
```

### Responsive

```html_example
<p class="u-line-height-0.8@sm">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Expedita reprehenderit aspernatur, non ratione excepturi et quia recusandae repellendus natus, libero facilis doloremque sint inventore voluptatem, voluptatibus odio sapiente iste officiis.</p>
```
*/
/**
 * Line-height utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Margin
name: margin
category: Utilities
---
Directions: null, `vertical`, `horizontal`, `top`, `right`, `bottom`, `left`.

## Sass

```scss
// Basic
@include u-margin('horizontal-auto', auto);

// Responsive
@include u-margin('horizontal-auto', auto, 'sm');
```

## Markup

### Basic

```html_example
<img class="u-margin-horizontal-auto" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
```

### Responsive

```html_example
<img class="u-margin-horizontal-auto@sm" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
```
*/
/**
 * Margin utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Max Height
name: max-height
category: Utilities
---
## Sass

```scss
// Basic
@include u-max-height('100', rem(100));

// Responsive
@include u-max-height('100', rem(100), 'sm');
```

## Markup

### Basic

```html_example
<img class="u-max-height-100" src="http://placehold.it/200/ff0000/ffffff?text=1" width="200" height="200" alt="Item 1">
```

### Responsive

```html_example
<img class="u-max-height-100@sm" src="http://placehold.it/200/ff0000/ffffff?text=1" width="200" height="200" alt="Item 1">
```
*/
/**
 * Max-height utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Max Width
name: max-width
category: Utilities
---
## Sass

```scss
// Basic
@include u-max-width('100', rem(100));

// Responsive
@include u-max-width('100', rem(100), 'sm');
```

## Markup

### Basic

```html_example
<img class="u-max-width-100" src="http://placehold.it/200/ff0000/ffffff?text=1" width="200" height="200" alt="Item 1">
```

### Responsive

```html_example
<img class="u-max-width-100@sm" src="http://placehold.it/200/ff0000/ffffff?text=1" width="200" height="200" alt="Item 1">
```
*/
/**
 * Max-width utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Min Height
name: min-height
category: Utilities
---
## Sass

```scss
// Basic
@include u-min-height('200', rem(200));

// Responsive
@include u-min-height('200', rem(200), 'sm');
```

## Markup

### Basic

```html_example
<img class="u-min-height-200" src="http://placehold.it/100/ff0000/ffffff?text=1" height="100" height="100" alt="Item 1">
```

### Responsive

```html_example
<img class="u-min-height-200@sm" src="http://placehold.it/100/ff0000/ffffff?text=1" height="100" height="100" alt="Item 1">
```
*/
/**
 * Min-height utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Min Width
name: min-width
category: Utilities
---
## Sass

```scss
// Basic
@include u-min-width('200', rem(200));

// Responsive
@include u-min-width('200', rem(200), 'sm');
```

## Markup

### Basic

```html_example
<img class="u-min-width-200" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
```

### Responsive

```html_example
<img class="u-min-width-200@sm" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
```
*/
/**
 * Min-width utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Object Fit
name: object-fit
category: Utilities
---
<span class="todo">Important:</span> Requires polyfill for IE and Edge: [Can I use…](http://caniuse.com/#feat=object-fit) Use either [lazySizes object fit extension](https://github.com/aFarkas/lazysizes/tree/gh-pages/plugins/object-fit) or [object-fit-images](https://github.com/bfred-it/object-fit-images)

Values: `fill`, `contain`, `cover`, `none`, `scale-down`.

## Sass

```scss
// Basic
@include u-object-fit('cover', cover);
@include u-object-fit('cover-100%', cover) {
  width: 100%;
  height: 100%;
}

// Responsive
@include u-object-fit('cover', cover, 'sm');
@include u-object-fit('cover-100%', cover, 'sm') {
  width: 100%;
  height: 100%;
}
```

## Markup

### Basic

```html_example
<img class="u-width-1/1  /  u-height-200  /  u-object-fit-cover" src="http://placehold.it/200/ff0000/ffffff?text=1" width="200" height="200" alt="Item 1">

<figure class="u-height-200">
  <img class="u-object-fit-cover-100%" src="http://placehold.it/200/00ff00/ffffff?text=2" width="200" height="200" alt="Item 2">
</figure>
```

### Responsive

```html_example
<img class="u-width-1/1  /  u-height-200  /  u-object-fit-cover@sm" src="http://placehold.it/200/ff0000/ffffff?text=1" width="200" height="200" alt="Item 1">

<figure class="u-height-200">
  <img class="u-object-fit-cover-100%@sm" src="http://placehold.it/200/00ff00/ffffff?text=2" width="200" height="200" alt="Item 2">
</figure>
```
*/
/**
 * Object-fit utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Opacity
name: opacity
category: Utilities
---
## Sass

```scss
// Basic
@include u-opacity('60', 0.6);

// Responsive
@include u-opacity('60', 0.6, 'sm');
```

## Markup

### Basic

```html_example
<img class="u-opacity-60" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
```

### Responsive

```html_example
<img class="u-opacity-60@sm" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
```
*/
/**
 * Opacity utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Order
name: order
category: Utilities
---
<span class="todo">TODO:</span> How should we handle negative values? For example, should we use parens: `.u-order\(-1\) { z-index: -1; }`.

## Sass

```scss
// Basic
@include u-order(1);
@include u-order(2);
@include u-order(3);

// Responsive
@include u-order(1, 'sm');
@include u-order(2, 'sm');
@include u-order(3, 'sm');
```

## Markup

### Basic

```html_example
<div class="u-display-flex">
  <img class="u-order-2" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
  <img class="u-order-3" src="http://placehold.it/100/00ff00/ffffff?text=2" width="100" height="100" alt="Item 2">
  <img class="u-order-1" src="http://placehold.it/100/0000ff/ffffff?text=3" width="100" height="100" alt="Item 3">
</div>
```

### Responsive

```html_example
<div class="u-display-flex">
  <img class="u-order-2@sm" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
  <img class="u-order-3@sm" src="http://placehold.it/100/00ff00/ffffff?text=2" width="100" height="100" alt="Item 2">
  <img class="u-order-1@sm" src="http://placehold.it/100/0000ff/ffffff?text=3" width="100" height="100" alt="Item 3">
</div>
```
*/
/**
 * Order utility.
 * @param  {Number}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Overflow
name: overflow
category: Utilities
---
## Sass

```scss
// Basic
@include u-overflow('hidden');

// Responsive
@include u-overflow('hidden', 'sm');
```

## Markup

### Basic

```html_example
<div class="u-width-100  /  u-overflow-hidden">
  <img src="http://placehold.it/200/ff0000/ffffff?text=1" width="200" height="200" alt="Item 1">
</div>
```

### Responsive

```html_example
<div class="u-width-100  /  u-overflow-hidden@sm">
  <img src="http://placehold.it/200/ff0000/ffffff?text=1" width="200" height="200" alt="Item 1">
</div>
```
*/
/**
 * Overflow utility.
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Padding
name: padding
category: Utilities
---
Directions: null, `vertical`, `horizontal`, `top`, `right`, `bottom`, `left`.

## Sass

```scss
// Basic
@include u-padding('horizontal-sm', $gutter-sm);

// Responsive
@include u-padding('horizontal-sm', $gutter-sm, 'sm');
```

## Markup

### Basic

```html_example
<div class="u-padding-horizontal-sm">
  <img src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
</div>
```

### Responsive

```html_example
<div class="u-padding-horizontal-sm@sm">
  <img src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
</div>
```
*/
/**
 * Padding utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Pointer Events
name: pointer-events
category: Utilities
---
## Sass

```scss
// Basic
@include u-pointer-events('none');

// Responsive
@include u-pointer-events('none', 'sm');
```

## Markup

### Basic

```html_example
<p class="u-pointer-events-none">
  <a href="javascript:alert('Hello!');">Click me</a>
</p>
```

### Responsive

```html_example
<p class="u-pointer-events-none@sm">
  <a href="javascript:alert('Hello!');">Click me</a>
</p>
```
*/
/**
 * Pointer-events utility.
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Position
name: position
category: Utilities
---
## Sass

```scss
// Basic
@include u-position('relative', relative);
@include u-position('center', absolute) {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

// Responsive
@include u-position('relative', relative, 'sm');
@include u-position('center', absolute, 'sm') {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
```

## Markup

### Basic

```html_example
<div class="u-position-relative  /  u-height-200">
  <img class="u-position-center" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
</div>
```

### Responsive

```html_example
<div class="u-position-relative  /  u-height-200">
  <img class="u-position-center@sm" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
</div>
```
*/
/**
 * Position utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Text Align
name: text-align
category: Utilities
---
## Sass

```scss
// Basic
@include u-text-align('center');

// Responsive
@include u-text-align('center', 'sm');
```

## Markup

### Basic

```html_example
<p class="u-text-align-center">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
```

### Responsive

```html_example
<p class="u-text-align-center@sm">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
```
*/
/**
 * Text-align utility.
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Text Overflow
name: text-overflow
category: Utilities
---
## Sass

```scss
// Basic
@include u-text-overflow('ellipsis');

// Responsive
@include u-text-overflow('ellipsis', 'sm');
```

## Markup

### Basic

```html_example
<p class="u-width-100  /  u-overflow-hidden  /  u-white-space-nowrap  /  u-text-overflow-ellipsis">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
```

### Responsive

```html_example
<p class="u-width-100  /  u-overflow-hidden  /  u-white-space-nowrap  /  u-text-overflow-ellipsis@sm">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
```
*/
/**
 * Text-overflow utility.
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Text Transform
name: text-transform
category: Utilities
---
## Sass

```scss
// Basic
@include u-text-transform('uppercase');

// Responsive
@include u-text-transform('uppercase', 'sm');
```

## Markup

### Basic

```html_example
<p class="u-text-transform-uppercase">Lorem ipsum dolor</p>
```

### Responsive

```html_example
<p class="u-text-transform-uppercase@sm">Lorem ipsum dolor</p>
```
*/
/**
 * Text-transform utility.
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Transform
name: transform
category: Utilities
---
## Sass

```scss
// Basic
@include u-transform('rotate-90', rotate(90deg));

// Responsive
@include u-transform('rotate-90', rotate(90deg), 'sm');
```

## Markup

### Basic

```html_example
<img class="u-transform-rotate-90" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
```

### Responsive

```html_example
<img class="u-transform-rotate-90@sm" src="http://placehold.it/100/ff0000/ffffff?text=1" width="100" height="100" alt="Item 1">
```
*/
/**
 * Transform utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: User Select
name: user-select
category: Utilities
---
## Sass

```scss
// Basic
@include u-user-select('none');

// Responsive
@include u-user-select('none', 'sm');
```

## Markup

### Basic

```html_example
<p class="u-user-select-none">Select me</p>
```

### Responsive

```html_example
<p class="u-user-select-none@sm">Select me</p>
```
*/
/**
 * User-select utility.
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Vertical Align
name: vertical-align
category: Utilities
---
## Sass

```scss
// Basic
@include u-vertical-align('middle');

// Responsive
@include u-vertical-align('middle', 'sm');
```

## Markup

### Basic

```html_example
<p>
  Lorem ipsum dolor sit amet <img class="u-display-inline-block  /  u-vertical-align-middle" src="http://placehold.it/100/ff0000/ffffff?text=1" width="50" height="50" alt="Item 1"> consectetur adipisicing elit.
</p>
```

### Responsive

```html_example
<p>
  Lorem ipsum dolor sit amet <img class="u-display-inline-block  /  u-vertical-align-middle@sm" src="http://placehold.it/100/ff0000/ffffff?text=1" width="50" height="50" alt="Item 1"> consectetur adipisicing elit.
</p>
```
*/
/**
 * Vertical-align utility.
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: White Space
name: white-space
category: Utilities
---
## Sass

```scss
// Basic
@include u-white-space('nowrap');

// Responsive
@include u-white-space('nowrap', 'sm');
```

## Markup

### Basic

```html_example
<p class="u-white-space-nowrap">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam velit, molestias hic. Numquam rerum eum, quae! Quod voluptate tempore aut, molestias! Aut atque, quis animi ab fugiat. Eveniet, nam ducimus.
</p>
```

### Responsive

```html_example
<p class="u-white-space-nowrap@sm">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam velit, molestias hic. Numquam rerum eum, quae! Quod voluptate tempore aut, molestias! Aut atque, quis animi ab fugiat. Eveniet, nam ducimus.
</p>
```
*/
/**
 * White-space utility.
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/*doc
---
title: Width
name: width
category: Utilities
---
## Sass

```scss
// Basic
@include u-width('1/1', percentage(1 / 1));
@include u-width('1/2', percentage(1 / 2));

// Responsive
@include u-width('1/1', percentage(1 / 1), 'sm');
@include u-width('1/2', percentage(1 / 2), 'sm');
```

## Markup

### Basic

```html_example
<div class="u-display-flex  /  u-flex-wrap-wrap">
  <img class="u-width-1/2" src="http://placehold.it/200/ff0000/ffffff?text=1" width="200" height="200" alt="Item 1">
  <img class="u-width-1/2" src="http://placehold.it/200/00ff00/ffffff?text=2" width="200" height="200" alt="Item 2">
</div>
```

### Responsive

```html_example
<div class="u-display-flex  /  u-flex-wrap-wrap">
  <img class="u-width-1/1  u-width-1/2@sm" src="http://placehold.it/200/ff0000/ffffff?text=1" width="200" height="200" alt="Item 1">
  <img class="u-width-1/1  u-width-1/2@sm" src="http://placehold.it/200/00ff00/ffffff?text=2" width="200" height="200" alt="Item 2">
</div>
```
*/
/**
 * Width utility.
 * @param  {String}  $alias
 * @param  {String}  $value
 * @param  {String}  $at-breakpoint
 */
/**
 * selectize.css (v0.12.6)
 * Copyright (c) 2013–2015 Brian Reavis & contributors
 *
 * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
 * file except in compliance with the License. You may obtain a copy of the License at:
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software distributed under
 * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
 * ANY KIND, either express or implied. See the License for the specific language
 * governing permissions and limitations under the License.
 *
 * @author Brian Reavis <brian@thirdroute.com>
 */
.selectize-control.plugin-drag_drop.multi > .selectize-input > div.ui-sortable-placeholder {
  visibility: visible !important;
  background: #f2f2f2 !important;
  background: rgba(0, 0, 0, 0.06) !important;
  border: 0 none !important;
  -webkit-box-shadow: inset 0 0 12px 4px #fff;
  box-shadow: inset 0 0 12px 4px #fff;
}

.selectize-control.plugin-drag_drop .ui-sortable-placeholder::after {
  content: '!';
  visibility: hidden;
}

.selectize-control.plugin-drag_drop .ui-sortable-helper {
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.selectize-dropdown-header {
  position: relative;
  padding: 5px 8px;
  border-bottom: 1px solid #d0d0d0;
  background: #f8f8f8;
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
}

.selectize-dropdown-header-close {
  position: absolute;
  right: 8px;
  top: 50%;
  color: #303030;
  opacity: 0.4;
  margin-top: -12px;
  line-height: 20px;
  font-size: 20px !important;
}

.selectize-dropdown-header-close:hover {
  color: #000000;
}

.selectize-dropdown.plugin-optgroup_columns .optgroup {
  border-right: 1px solid #f2f2f2;
  border-top: 0 none;
  float: left;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.selectize-dropdown.plugin-optgroup_columns .optgroup:last-child {
  border-right: 0 none;
}

.selectize-dropdown.plugin-optgroup_columns .optgroup:before {
  display: none;
}

.selectize-dropdown.plugin-optgroup_columns .optgroup-header {
  border-top: 0 none;
}

.selectize-control.plugin-remove_button [data-value] {
  position: relative;
  padding-right: 24px !important;
}

.selectize-control.plugin-remove_button [data-value] .remove {
  z-index: 1;
  /* fixes ie bug (see #392) */
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 17px;
  text-align: center;
  font-weight: bold;
  font-size: 12px;
  color: inherit;
  text-decoration: none;
  vertical-align: middle;
  display: inline-block;
  padding: 2px 0 0 0;
  border-left: 1px solid #d0d0d0;
  -webkit-border-radius: 0 2px 2px 0;
  -moz-border-radius: 0 2px 2px 0;
  border-radius: 0 2px 2px 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.selectize-control.plugin-remove_button [data-value] .remove:hover {
  background: rgba(0, 0, 0, 0.05);
}

.selectize-control.plugin-remove_button [data-value].active .remove {
  border-left-color: #cacaca;
}

.selectize-control.plugin-remove_button .disabled [data-value] .remove:hover {
  background: none;
}

.selectize-control.plugin-remove_button .disabled [data-value] .remove {
  border-left-color: #ffffff;
}

.selectize-control.plugin-remove_button .remove-single {
  position: absolute;
  right: 0;
  top: 0;
  font-size: 23px;
}

.selectize-control {
  position: relative;
}

.selectize-dropdown,
.selectize-input,
.selectize-input input {
  color: #303030;
  font-family: inherit;
  font-size: 13px;
  line-height: 18px;
  -webkit-font-smoothing: inherit;
}

.selectize-input,
.selectize-control.single .selectize-input.input-active {
  background: #fff;
  cursor: text;
  display: inline-block;
}

.selectize-input {
  border: 1px solid #d0d0d0;
  padding: 8px 8px;
  display: inline-block;
  width: 100%;
  overflow: hidden;
  position: relative;
  z-index: 1;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

.selectize-control.multi .selectize-input.has-items {
  padding: 6px 8px 3px;
}

.selectize-input.full {
  background-color: #fff;
}

.selectize-input.disabled,
.selectize-input.disabled * {
  cursor: default !important;
}

.selectize-input.focus {
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
}

.selectize-input.dropdown-active {
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
}

.selectize-input > * {
  vertical-align: baseline;
  display: -moz-inline-stack;
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.selectize-control.multi .selectize-input > div {
  cursor: pointer;
  margin: 0 3px 3px 0;
  padding: 2px 6px;
  background: #f2f2f2;
  color: #303030;
  border: 0 solid #d0d0d0;
}

.selectize-control.multi .selectize-input > div.active {
  background: #e8e8e8;
  color: #303030;
  border: 0 solid #cacaca;
}

.selectize-control.multi .selectize-input.disabled > div,
.selectize-control.multi .selectize-input.disabled > div.active {
  color: #7d7d7d;
  background: #ffffff;
  border: 0 solid #ffffff;
}

.selectize-input > input {
  display: inline-block !important;
  padding: 0 !important;
  min-height: 0 !important;
  max-height: none !important;
  max-width: 100% !important;
  margin: 0 2px 0 0 !important;
  text-indent: 0 !important;
  border: 0 none !important;
  background: none !important;
  line-height: inherit !important;
  -webkit-user-select: auto !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

.selectize-input > input::-ms-clear {
  display: none;
}

.selectize-input > input:focus {
  outline: none !important;
}

.selectize-input::after {
  content: ' ';
  display: block;
  clear: left;
}

.selectize-input.dropdown-active::before {
  content: ' ';
  display: block;
  position: absolute;
  background: #f0f0f0;
  height: 1px;
  bottom: 0;
  left: 0;
  right: 0;
}

.selectize-dropdown {
  position: absolute;
  z-index: 10;
  border: 1px solid #d0d0d0;
  background: #fff;
  margin: -1px 0 0 0;
  border-top: 0 none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  -webkit-border-radius: 0 0 3px 3px;
  -moz-border-radius: 0 0 3px 3px;
  border-radius: 0 0 3px 3px;
}

.selectize-dropdown [data-selectable] {
  cursor: pointer;
  overflow: hidden;
}

.selectize-dropdown [data-selectable] .highlight {
  background: rgba(125, 168, 208, 0.2);
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  border-radius: 1px;
}

.selectize-dropdown .option,
.selectize-dropdown .optgroup-header {
  padding: 5px 8px;
}

.selectize-dropdown .option,
.selectize-dropdown [data-disabled],
.selectize-dropdown [data-disabled] [data-selectable].option {
  cursor: inherit;
  opacity: 0.5;
}

.selectize-dropdown [data-selectable].option {
  opacity: 1;
}

.selectize-dropdown .optgroup:first-child .optgroup-header {
  border-top: 0 none;
}

.selectize-dropdown .optgroup-header {
  color: #303030;
  background: #fff;
  cursor: default;
}

.selectize-dropdown .active {
  background-color: #f5fafd;
  color: #495c68;
}

.selectize-dropdown .active.create {
  color: #495c68;
}

.selectize-dropdown .create {
  color: rgba(48, 48, 48, 0.5);
}

.selectize-dropdown-content {
  overflow-y: auto;
  overflow-x: hidden;
  max-height: 200px;
  -webkit-overflow-scrolling: touch;
}

.selectize-control.single .selectize-input,
.selectize-control.single .selectize-input input {
  cursor: pointer;
}

.selectize-control.single .selectize-input.input-active,
.selectize-control.single .selectize-input.input-active input {
  cursor: text;
}

.selectize-control.single .selectize-input:after {
  content: ' ';
  display: block;
  position: absolute;
  top: 50%;
  right: 15px;
  margin-top: -3px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 5px 5px 0 5px;
  border-color: #808080 transparent transparent transparent;
}

.selectize-control.single .selectize-input.dropdown-active:after {
  margin-top: -4px;
  border-width: 0 5px 5px 5px;
  border-color: transparent transparent #808080 transparent;
}

.selectize-control.rtl.single .selectize-input:after {
  left: 15px;
  right: auto;
}

.selectize-control.rtl .selectize-input > input {
  margin: 0 4px 0 -2px !important;
}

.selectize-control .selectize-input.disabled {
  opacity: 0.5;
  background-color: #fafafa;
}

html {
  letter-spacing: 0.01em;
}

/*! 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 box-model for everything
   */
* {
  margin: 0;
  padding: 0;
}

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

html {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  min-height: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
}

figure {
  margin: 0;
}

ol,
ul {
  list-style: none;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

svg {
  display: inline-block;
  max-width: 100%;
  max-height: 100%;
  vertical-align: middle;
}

address,
cite {
  font-style: normal;
}

html {
  -webkit-font-smoothing: antialiased;
  font-family: "brandon-grotesque", Arial, sans-serif;
  scroll-behavior: smooth;
}

* {
  padding: 0;
  margin: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "brandon-grotesque", Arial, sans-serif;
  font-size: 100%;
  font-weight: 300;
  margin: 0;
}

blockquote,
q {
  quotes: none;
}

blockquote::before, blockquote::after,
q::before,
q::after {
  content: '';
}

ol,
ul {
  list-style: none;
}

pre,
code {
  font-family: monospace, monospace;
}

hr {
  border: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

th {
  text-align: left;
}

button,
input,
textarea,
select,
optgroup {
  color: inherit;
  font: inherit;
}

optgroup {
  font-weight: bold;
}

button,
input,
textarea,
select,
fieldset,
legend {
  border: 0;
}

button {
  background: none;
}

address,
cite {
  font-style: normal;
}

a {
  transition: color 100ms ease, opacity 100ms ease;
  text-decoration: none;
}

p a {
  color: inherit;
  text-decoration: underline;
  text-decoration-skip-ink: none;
}

/* ------------------------------ */
/* Objects                        */
/* ------------------------------ */
.o-grid {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}

.o-grid--gutters-sm {
  margin-right: 0;
  margin-left: -1.875em;
}

.o-grid--gutters-sm > .o-grid__item {
  padding-right: 0;
  padding-left: 1.875em;
}

.c-browser-upgrade {
  margin: 0.2em 0;
  padding: 0.2em 0;
  background: #ccc;
  color: #000;
  text-align: center;
}

.u-small-caps {
  font-variant: small-caps;
  text-transform: lowercase;
}

.supports-font-features.wf-active .u-small-caps {
  font-variant: normal;
  font-variant-caps: small-caps;
  font-feature-settings: 'smcp';
}

.u-small-caps sup {
  top: 0.54em;
  font-size: 80%;
}

.u-small-caps sup.u-reset-small-caps-sup {
  top: -0.1em;
  font-size: 36%;
}

@media all and (max-width: 48em) {
  .u-small-caps\@lt-md {
    font-variant: small-caps;
    text-transform: lowercase;
  }
  .supports-font-features.wf-active .u-small-caps\@lt-md {
    font-variant: normal;
    font-variant-caps: small-caps;
    font-feature-settings: 'smcp';
  }
  .u-small-caps\@lt-md sup {
    top: 0.54em;
    font-size: 80%;
  }
  .u-small-caps\@lt-md sup.u-reset-small-caps-sup {
    top: -0.1em;
    font-size: 36%;
  }
}

.u-small-caps .u-small-caps__symbol {
  font-size: 80%;
}

.supports-font-features.wf-active .u-small-caps .u-small-caps__symbol {
  font-size: 100%;
}

.u-small-caps .u-small-caps__apostrophe {
  font-size: 85%;
}

.u-small-caps .u-small-caps__apostrophe--quote {
  font-size: 70%;
}

.u-small-caps__sup {
  position: relative;
  font-size: .5em;
  top: 0.15em;
}

.u-small-caps__sub {
  position: relative;
}

.u-small-caps__sub::after {
  position: absolute;
  bottom: 0;
  text-decoration: none;
}

.u-small-caps__sub--tm {
  margin-right: 0.18em;
  padding-right: 0.5em;
}

.u-small-caps__sub--tm::after {
  margin-bottom: 0.8em;
  -webkit-transform: translate(0, 55%);
  transform: translate(0, 55%);
  font-size: 50%;
  content: '™';
}

.u-small-caps__sub--reg {
  margin-right: 0.05em;
  padding-right: 0.3em;
}

.u-small-caps__sub--reg::after {
  margin-bottom: 0.444em;
  -webkit-transform: translate(0, 61%);
  transform: translate(0, 61%);
  font-size: 90%;
  content: '®';
}

.u-small-caps__sub--copy {
  padding-right: 0.3em;
}

.u-small-caps__sub--copy::after {
  -webkit-transform: translate(0, -104%);
  transform: translate(0, -104%);
  font-size: 38%;
  content: '©';
}

h1 .u-small-caps__sub,
h2 .u-small-caps__sub,
h3 .u-small-caps__sub,
h4 .u-small-caps__sub,
h5 .u-small-caps__sub,
h6 .u-small-caps__sub,
.u-small-caps .u-small-caps__sub {
  margin-right: 0;
}

h1 .u-small-caps__sub--reg::after,
h2 .u-small-caps__sub--reg::after,
h3 .u-small-caps__sub--reg::after,
h4 .u-small-caps__sub--reg::after,
h5 .u-small-caps__sub--reg::after,
h6 .u-small-caps__sub--reg::after,
.u-small-caps .u-small-caps__sub--reg::after {
  margin-bottom: 0.8em;
  -webkit-transform: translate(0, 113%);
  transform: translate(0, 113%);
}

.u-reset-small-caps {
  font-variant: normal;
  text-transform: none;
}

.supports-font-features.wf-active .u-reset-small-caps {
  font-variant-caps: initial;
  font-feature-settings: initial;
}

.u-reset-small-caps sup {
  top: 0.4em;
  font-size: 100%;
}

.u-reset-small-caps .u-small-caps__sub--tm {
  margin-right: 0.18em;
}

.u-reset-small-caps .u-small-caps__sub--reg {
  margin-right: 0.05em;
}

.u-reset-small-caps .u-small-caps__sub--reg::after {
  margin-bottom: 0.444em;
  -webkit-transform: translate(0, 61%);
  transform: translate(0, 61%);
}

.u-reset-small-caps .u-small-caps__apostrophe {
  font-size: 100%;
}

@media all and (max-width: 38.6875em) {
  .u-reset-small-caps\@lt-620 {
    font-variant: normal;
    text-transform: none;
  }
  .supports-font-features.wf-active .u-reset-small-caps\@lt-620 {
    font-variant-caps: initial;
    font-feature-settings: initial;
  }
  .u-reset-small-caps\@lt-620 sup {
    top: 0.4em;
    font-size: 100%;
  }
  .u-reset-small-caps\@lt-620 .u-small-caps__sub--tm {
    margin-right: 0.18em;
  }
  .u-reset-small-caps\@lt-620 .u-small-caps__sub--reg {
    margin-right: 0.05em;
  }
  .u-reset-small-caps\@lt-620 .u-small-caps__sub--reg::after {
    margin-bottom: 0.444em;
    -webkit-transform: translate(0, 61%);
    transform: translate(0, 61%);
  }
}

.c-heading {
  font-family: "brandon-grotesque", sans-serif;
  font-variant-numeric: lining-nums;
  font-feature-settings: 'liga';
  margin: 0;
}

.c-heading--xs {
  font-size: 10px;
  font-weight: 300;
  line-height: 1.333;
}

@media all and (min-width: 75em) {
  .c-heading--xs {
    font-size: 11.79px;
  }
}

@media all and (min-width: 87.5em) {
  .c-heading--xs {
    font-size: 13.665px;
  }
}

@media all and (min-width: 100em) {
  .c-heading--xs {
    font-size: 15.54px;
  }
}

@media all and (min-width: 112.5em) {
  .c-heading--xs {
    font-size: 17.415px;
  }
}

@media screen and (min-width: 1920px) {
  .c-heading--xs {
    font-size: 18px;
  }
}

.c-heading--sm {
  font-size: 12px;
}

@media all and (min-width: 75em) {
  .c-heading--sm {
    font-size: 13.1px;
  }
}

@media all and (min-width: 87.5em) {
  .c-heading--sm {
    font-size: 15.1833333333px;
  }
}

@media all and (min-width: 100em) {
  .c-heading--sm {
    font-size: 17.2666666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-heading--sm {
    font-size: 19.35px;
  }
}

@media screen and (min-width: 1920px) {
  .c-heading--sm {
    font-size: 20px;
  }
}

.c-heading--22 {
  font-size: 12px;
}

@media all and (min-width: 75em) {
  .c-heading--22 {
    font-size: 14.41px;
  }
}

@media all and (min-width: 87.5em) {
  .c-heading--22 {
    font-size: 16.7016666667px;
  }
}

@media all and (min-width: 100em) {
  .c-heading--22 {
    font-size: 18.9933333333px;
  }
}

@media all and (min-width: 112.5em) {
  .c-heading--22 {
    font-size: 21.285px;
  }
}

@media screen and (min-width: 1920px) {
  .c-heading--22 {
    font-size: 22px;
  }
}

.c-heading--28 {
  font-size: 12px;
  font-weight: normal;
}

@media all and (min-width: 48.0625em) {
  .c-heading--28 {
    font-size: 12.0545833333px;
  }
}

@media all and (min-width: 61.25em) {
  .c-heading--28 {
    font-size: 15.1316666667px;
  }
}

@media all and (min-width: 75em) {
  .c-heading--28 {
    font-size: 18.34px;
  }
}

@media all and (min-width: 87.5em) {
  .c-heading--28 {
    font-size: 21.2566666667px;
  }
}

@media all and (min-width: 100em) {
  .c-heading--28 {
    font-size: 24.1733333333px;
  }
}

@media all and (min-width: 112.5em) {
  .c-heading--28 {
    font-size: 27.09px;
  }
}

@media screen and (min-width: 1920px) {
  .c-heading--28 {
    font-size: 28px;
  }
}

.c-heading--32 {
  font-size: 12px;
  font-weight: normal;
}

@media all and (min-width: 42.5em) {
  .c-heading--32 {
    font-size: 12.2933333333px;
  }
}

@media all and (min-width: 48.0625em) {
  .c-heading--32 {
    font-size: 13.7766666667px;
  }
}

@media all and (min-width: 61.25em) {
  .c-heading--32 {
    font-size: 17.2933333333px;
  }
}

@media all and (min-width: 75em) {
  .c-heading--32 {
    font-size: 20.96px;
  }
}

@media all and (min-width: 87.5em) {
  .c-heading--32 {
    font-size: 24.2933333333px;
  }
}

@media all and (min-width: 100em) {
  .c-heading--32 {
    font-size: 27.6266666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-heading--32 {
    font-size: 30.96px;
  }
}

@media screen and (min-width: 1920px) {
  .c-heading--32 {
    font-size: 32px;
  }
}

.c-heading--35 {
  font-size: 14px;
}

@media all and (min-width: 48.0625em) {
  .c-heading--35 {
    font-size: 15.0682291667px;
  }
}

@media all and (min-width: 61.25em) {
  .c-heading--35 {
    font-size: 18.9145833333px;
  }
}

@media all and (min-width: 75em) {
  .c-heading--35 {
    font-size: 22.925px;
  }
}

@media all and (min-width: 87.5em) {
  .c-heading--35 {
    font-size: 26.5708333333px;
  }
}

@media all and (min-width: 100em) {
  .c-heading--35 {
    font-size: 30.2166666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-heading--35 {
    font-size: 33.8625px;
  }
}

@media screen and (min-width: 1920px) {
  .c-heading--35 {
    font-size: 35px;
  }
}

.c-heading--md {
  font-size: 16px;
  line-height: 1;
}

@media all and (min-width: 48.0625em) {
  .c-heading--md {
    font-size: 17.2208333333px;
  }
}

@media all and (min-width: 61.25em) {
  .c-heading--md {
    font-size: 21.6166666667px;
  }
}

@media all and (min-width: 75em) {
  .c-heading--md {
    font-size: 26.2px;
  }
}

@media all and (min-width: 87.5em) {
  .c-heading--md {
    font-size: 30.3666666667px;
  }
}

@media all and (min-width: 100em) {
  .c-heading--md {
    font-size: 34.5333333333px;
  }
}

@media all and (min-width: 112.5em) {
  .c-heading--md {
    font-size: 38.7px;
  }
}

@media screen and (min-width: 1920px) {
  .c-heading--md {
    font-size: 40px;
  }
}

.c-heading--42 {
  font-size: 16px;
  line-height: 1;
}

@media all and (min-width: 48.0625em) {
  .c-heading--42 {
    font-size: 17.2208333333px;
  }
}

@media all and (min-width: 61.25em) {
  .c-heading--42 {
    font-size: 21.6166666667px;
  }
}

@media all and (min-width: 75em) {
  .c-heading--42 {
    font-size: 26.2px;
  }
}

@media all and (min-width: 87.5em) {
  .c-heading--42 {
    font-size: 30.3666666667px;
  }
}

@media all and (min-width: 100em) {
  .c-heading--42 {
    font-size: 34.5333333333px;
  }
}

@media all and (min-width: 112.5em) {
  .c-heading--42 {
    font-size: 38.7px;
  }
}

@media screen and (min-width: 1920px) {
  .c-heading--42 {
    font-size: 40px;
  }
}

.c-heading--56 {
  font-size: 18px;
  line-height: 1.1333;
}

@media all and (min-width: 42.5em) {
  .c-heading--56 {
    font-size: 21.5133333333px;
  }
}

@media all and (min-width: 48.0625em) {
  .c-heading--56 {
    font-size: 24.1091666667px;
  }
}

@media all and (min-width: 61.25em) {
  .c-heading--56 {
    font-size: 30.2633333333px;
  }
}

@media all and (min-width: 75em) {
  .c-heading--56 {
    font-size: 36.68px;
  }
}

@media all and (min-width: 87.5em) {
  .c-heading--56 {
    font-size: 42.5133333333px;
  }
}

@media all and (min-width: 100em) {
  .c-heading--56 {
    font-size: 48.3466666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-heading--56 {
    font-size: 54.18px;
  }
}

@media screen and (min-width: 1920px) {
  .c-heading--56 {
    font-size: 56px;
  }
}

.c-heading--50 {
  font-size: 18px;
  line-height: 1.1333;
}

@media all and (min-width: 42.5em) {
  .c-heading--50 {
    font-size: 19.2083333333px;
  }
}

@media all and (min-width: 48.0625em) {
  .c-heading--50 {
    font-size: 21.5260416667px;
  }
}

@media all and (min-width: 61.25em) {
  .c-heading--50 {
    font-size: 27.0208333333px;
  }
}

@media all and (min-width: 75em) {
  .c-heading--50 {
    font-size: 32.75px;
  }
}

@media all and (min-width: 87.5em) {
  .c-heading--50 {
    font-size: 37.9583333333px;
  }
}

@media all and (min-width: 100em) {
  .c-heading--50 {
    font-size: 43.1666666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-heading--50 {
    font-size: 48.375px;
  }
}

@media screen and (min-width: 1920px) {
  .c-heading--50 {
    font-size: 50px;
  }
}

.c-heading--60-alt {
  font-size: 30px;
  line-height: 1.1333;
}

@media all and (min-width: 61.25em) {
  .c-heading--60-alt {
    font-size: 32.425px;
  }
}

@media all and (min-width: 75em) {
  .c-heading--60-alt {
    font-size: 39.3px;
  }
}

@media all and (min-width: 87.5em) {
  .c-heading--60-alt {
    font-size: 45.55px;
  }
}

@media all and (min-width: 100em) {
  .c-heading--60-alt {
    font-size: 51.8px;
  }
}

@media all and (min-width: 112.5em) {
  .c-heading--60-alt {
    font-size: 58.05px;
  }
}

@media screen and (min-width: 1920px) {
  .c-heading--60-alt {
    font-size: 60px;
  }
}

.c-heading--60 {
  font-size: 30px;
  line-height: 1.1333;
}

@media all and (min-width: 61.25em) {
  .c-heading--60 {
    font-size: 32.425px;
  }
}

@media all and (min-width: 75em) {
  .c-heading--60 {
    font-size: 39.3px;
  }
}

@media all and (min-width: 87.5em) {
  .c-heading--60 {
    font-size: 45.55px;
  }
}

@media all and (min-width: 100em) {
  .c-heading--60 {
    font-size: 51.8px;
  }
}

@media all and (min-width: 112.5em) {
  .c-heading--60 {
    font-size: 58.05px;
  }
}

@media screen and (min-width: 1920px) {
  .c-heading--60 {
    font-size: 60px;
  }
}

.c-heading--72 {
  font-size: 18px;
  line-height: 1.15;
  font-weight: 300;
}

@media all and (min-width: 42.5em) {
  .c-heading--72 {
    font-size: 26.8916666667px;
  }
}

@media all and (min-width: 48.0625em) {
  .c-heading--72 {
    font-size: 30.1364583333px;
  }
}

@media all and (min-width: 61.25em) {
  .c-heading--72 {
    font-size: 37.8291666667px;
  }
}

@media all and (min-width: 75em) {
  .c-heading--72 {
    font-size: 45.85px;
  }
}

@media all and (min-width: 87.5em) {
  .c-heading--72 {
    font-size: 53.1416666667px;
  }
}

@media all and (min-width: 100em) {
  .c-heading--72 {
    font-size: 60.4333333333px;
  }
}

@media all and (min-width: 112.5em) {
  .c-heading--72 {
    font-size: 67.725px;
  }
}

@media screen and (min-width: 1920px) {
  .c-heading--72 {
    font-size: 70px;
  }
}

.c-heading--80 {
  font-size: 18px;
  line-height: 1.1333;
}

@media all and (min-width: 42.5em) {
  .c-heading--80 {
    font-size: 30.7333333333px;
  }
}

@media all and (min-width: 48.0625em) {
  .c-heading--80 {
    font-size: 34.4416666667px;
  }
}

@media all and (min-width: 61.25em) {
  .c-heading--80 {
    font-size: 43.2333333333px;
  }
}

@media all and (min-width: 75em) {
  .c-heading--80 {
    font-size: 52.4px;
  }
}

@media all and (min-width: 87.5em) {
  .c-heading--80 {
    font-size: 60.7333333333px;
  }
}

@media all and (min-width: 100em) {
  .c-heading--80 {
    font-size: 69.0666666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-heading--80 {
    font-size: 77.4px;
  }
}

@media screen and (min-width: 1920px) {
  .c-heading--80 {
    font-size: 80px;
  }
}

.c-heading--lg {
  font-size: 20px;
  font-weight: 300;
  line-height: 1;
}

@media all and (min-width: 42.5em) {
  .c-heading--lg {
    font-size: 26.8916666667px;
  }
}

@media all and (min-width: 48.0625em) {
  .c-heading--lg {
    font-size: 30.1364583333px;
  }
}

@media all and (min-width: 61.25em) {
  .c-heading--lg {
    font-size: 37.8291666667px;
  }
}

@media all and (min-width: 75em) {
  .c-heading--lg {
    font-size: 45.85px;
  }
}

@media all and (min-width: 87.5em) {
  .c-heading--lg {
    font-size: 53.1416666667px;
  }
}

@media all and (min-width: 100em) {
  .c-heading--lg {
    font-size: 60.4333333333px;
  }
}

@media all and (min-width: 112.5em) {
  .c-heading--lg {
    font-size: 67.725px;
  }
}

@media screen and (min-width: 1920px) {
  .c-heading--lg {
    font-size: 70px;
  }
}

.c-heading--xl {
  font-size: 24px;
  font-weight: 300;
  line-height: 1;
}

@media all and (min-width: 42.5em) {
  .c-heading--xl {
    font-size: 29.965px;
  }
}

@media all and (min-width: 48.0625em) {
  .c-heading--xl {
    font-size: 33.580625px;
  }
}

@media all and (min-width: 61.25em) {
  .c-heading--xl {
    font-size: 42.1525px;
  }
}

@media all and (min-width: 75em) {
  .c-heading--xl {
    font-size: 51.09px;
  }
}

@media all and (min-width: 87.5em) {
  .c-heading--xl {
    font-size: 59.215px;
  }
}

@media all and (min-width: 100em) {
  .c-heading--xl {
    font-size: 67.34px;
  }
}

@media all and (min-width: 112.5em) {
  .c-heading--xl {
    font-size: 75.465px;
  }
}

@media screen and (min-width: 1920px) {
  .c-heading--xl {
    font-size: 78px;
  }
}

.c-heading--xxl {
  font-size: 24px;
  line-height: 1.083;
  font-weight: 300;
}

@media all and (min-width: 42.5em) {
  .c-heading--xxl {
    font-size: 36.88px;
  }
}

@media all and (min-width: 48.0625em) {
  .c-heading--xxl {
    font-size: 41.33px;
  }
}

@media all and (min-width: 61.25em) {
  .c-heading--xxl {
    font-size: 51.88px;
  }
}

@media all and (min-width: 75em) {
  .c-heading--xxl {
    font-size: 62.88px;
  }
}

@media all and (min-width: 87.5em) {
  .c-heading--xxl {
    font-size: 72.88px;
  }
}

@media all and (min-width: 100em) {
  .c-heading--xxl {
    font-size: 82.88px;
  }
}

@media all and (min-width: 112.5em) {
  .c-heading--xxl {
    font-size: 92.88px;
  }
}

@media screen and (min-width: 1920px) {
  .c-heading--xxl {
    font-size: 96px;
  }
}

.c-subheading {
  font-family: "brandon-grotesque", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  font-feature-settings: 'liga';
  font-variant-numeric: lining-nums;
  margin: 0;
}

.c-subheading--xxs {
  font-size: 8px;
  letter-spacing: 0.045em;
  font-weight: 700;
}

@media all and (min-width: 75em) {
  .c-subheading--xxs {
    font-size: 8.8425px;
  }
}

@media all and (min-width: 87.5em) {
  .c-subheading--xxs {
    font-size: 10.24875px;
  }
}

@media all and (min-width: 100em) {
  .c-subheading--xxs {
    font-size: 11.655px;
  }
}

@media all and (min-width: 112.5em) {
  .c-subheading--xxs {
    font-size: 13.06125px;
  }
}

@media screen and (min-width: 1920px) {
  .c-subheading--xxs {
    font-size: 13.5px;
  }
}

.c-subheading--xs-alt {
  font-size: 8px;
  letter-spacing: 0.045em;
  text-transform: uppercase;
  font-weight: 700;
}

@media all and (min-width: 61.25em) {
  .c-subheading--xs-alt {
    font-size: 8.10625px;
  }
}

@media all and (min-width: 75em) {
  .c-subheading--xs-alt {
    font-size: 9.825px;
  }
}

@media all and (min-width: 87.5em) {
  .c-subheading--xs-alt {
    font-size: 11.3875px;
  }
}

@media all and (min-width: 100em) {
  .c-subheading--xs-alt {
    font-size: 12.95px;
  }
}

@media all and (min-width: 112.5em) {
  .c-subheading--xs-alt {
    font-size: 14.5125px;
  }
}

@media screen and (min-width: 1920px) {
  .c-subheading--xs-alt {
    font-size: 15px;
  }
}

.c-subheading--xs {
  font-size: 8px;
  letter-spacing: .26em;
  text-transform: uppercase;
}

@media all and (min-width: 61.25em) {
  .c-subheading--xs {
    font-size: 8.6466666667px;
  }
}

@media all and (min-width: 75em) {
  .c-subheading--xs {
    font-size: 10.48px;
  }
}

@media all and (min-width: 87.5em) {
  .c-subheading--xs {
    font-size: 12.1466666667px;
  }
}

@media all and (min-width: 100em) {
  .c-subheading--xs {
    font-size: 13.8133333333px;
  }
}

@media all and (min-width: 112.5em) {
  .c-subheading--xs {
    font-size: 15.48px;
  }
}

@media screen and (min-width: 1920px) {
  .c-subheading--xs {
    font-size: 16px;
  }
}

.c-subheading--xs-tighter {
  font-size: 8px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

@media all and (min-width: 61.25em) {
  .c-subheading--xs-tighter {
    font-size: 8.6466666667px;
  }
}

@media all and (min-width: 75em) {
  .c-subheading--xs-tighter {
    font-size: 10.48px;
  }
}

@media all and (min-width: 87.5em) {
  .c-subheading--xs-tighter {
    font-size: 12.1466666667px;
  }
}

@media all and (min-width: 100em) {
  .c-subheading--xs-tighter {
    font-size: 13.8133333333px;
  }
}

@media all and (min-width: 112.5em) {
  .c-subheading--xs-tighter {
    font-size: 15.48px;
  }
}

@media screen and (min-width: 1920px) {
  .c-subheading--xs-tighter {
    font-size: 16px;
  }
}

.c-subheading--sm {
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

@media all and (min-width: 61.25em) {
  .c-subheading--sm {
    font-size: 10.1328125px;
  }
}

@media all and (min-width: 75em) {
  .c-subheading--sm {
    font-size: 12.28125px;
  }
}

@media all and (min-width: 87.5em) {
  .c-subheading--sm {
    font-size: 14.234375px;
  }
}

@media all and (min-width: 100em) {
  .c-subheading--sm {
    font-size: 16.1875px;
  }
}

@media all and (min-width: 112.5em) {
  .c-subheading--sm {
    font-size: 18.140625px;
  }
}

@media screen and (min-width: 1920px) {
  .c-subheading--sm {
    font-size: 18.75px;
  }
}

.c-subheading--md {
  font-size: 12px;
  letter-spacing: 0.075em;
  font-weight: 700;
  text-transform: uppercase;
}

@media all and (min-width: 75em) {
  .c-subheading--md {
    font-size: 13.1px;
  }
}

@media all and (min-width: 87.5em) {
  .c-subheading--md {
    font-size: 15.1833333333px;
  }
}

@media all and (min-width: 100em) {
  .c-subheading--md {
    font-size: 17.2666666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-subheading--md {
    font-size: 19.35px;
  }
}

@media screen and (min-width: 1920px) {
  .c-subheading--md {
    font-size: 20px;
  }
}

.c-subheading--22 {
  font-size: 12px;
  letter-spacing: 0.075em;
  font-weight: 700;
  text-transform: uppercase;
}

@media all and (min-width: 75em) {
  .c-subheading--22 {
    font-size: 14.41px;
  }
}

@media all and (min-width: 87.5em) {
  .c-subheading--22 {
    font-size: 16.7016666667px;
  }
}

@media all and (min-width: 100em) {
  .c-subheading--22 {
    font-size: 18.9933333333px;
  }
}

@media all and (min-width: 112.5em) {
  .c-subheading--22 {
    font-size: 21.285px;
  }
}

@media screen and (min-width: 1920px) {
  .c-subheading--22 {
    font-size: 22px;
  }
}

.c-subheading--footer {
  font-size: 12.9px;
  letter-spacing: 0.075em;
  font-weight: 700;
  text-transform: uppercase;
}

@media all and (min-width: 87.5em) {
  .c-subheading--footer {
    font-size: 12.9058333333px;
  }
}

@media all and (min-width: 100em) {
  .c-subheading--footer {
    font-size: 14.6766666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-subheading--footer {
    font-size: 16.4475px;
  }
}

@media screen and (min-width: 1920px) {
  .c-subheading--footer {
    font-size: 17px;
  }
}

.c-subheading--26 {
  font-size: 14px;
  letter-spacing: 0.075em;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1.31;
}

@media all and (min-width: 61.25em) {
  .c-subheading--26 {
    font-size: 14.0508333333px;
  }
}

@media all and (min-width: 75em) {
  .c-subheading--26 {
    font-size: 17.03px;
  }
}

@media all and (min-width: 87.5em) {
  .c-subheading--26 {
    font-size: 19.7383333333px;
  }
}

@media all and (min-width: 100em) {
  .c-subheading--26 {
    font-size: 22.4466666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-subheading--26 {
    font-size: 25.155px;
  }
}

@media screen and (min-width: 1920px) {
  .c-subheading--26 {
    font-size: 26px;
  }
}

.c-subheading--lg {
  font-size: 14px;
  letter-spacing: 0.075em;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1.31;
}

@media all and (min-width: 61.25em) {
  .c-subheading--lg {
    font-size: 15.207325px;
  }
}

@media all and (min-width: 75em) {
  .c-subheading--lg {
    font-size: 18.4317px;
  }
}

@media all and (min-width: 87.5em) {
  .c-subheading--lg {
    font-size: 21.36295px;
  }
}

@media all and (min-width: 100em) {
  .c-subheading--lg {
    font-size: 24.2942px;
  }
}

@media all and (min-width: 112.5em) {
  .c-subheading--lg {
    font-size: 27.22545px;
  }
}

@media screen and (min-width: 1920px) {
  .c-subheading--lg {
    font-size: 28.14px;
  }
}

.c-subheading--xxxl-alt {
  font-size: 24px;
  font-weight: normal;
  text-transform: lowercase;
  line-height: 1;
}

@media all and (min-width: 48.0625em) {
  .c-subheading--xxxl-alt {
    font-size: 24.1091666667px;
  }
}

@media all and (min-width: 61.25em) {
  .c-subheading--xxxl-alt {
    font-size: 30.2633333333px;
  }
}

@media all and (min-width: 75em) {
  .c-subheading--xxxl-alt {
    font-size: 36.68px;
  }
}

@media all and (min-width: 87.5em) {
  .c-subheading--xxxl-alt {
    font-size: 42.5133333333px;
  }
}

@media all and (min-width: 100em) {
  .c-subheading--xxxl-alt {
    font-size: 48.3466666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-subheading--xxxl-alt {
    font-size: 54.18px;
  }
}

@media screen and (min-width: 1920px) {
  .c-subheading--xxxl-alt {
    font-size: 56px;
  }
}

.c-copy {
  font-family: "ff-tisa-web-pro", Arial, sans-serif;
}

.c-copy--xs {
  font-size: 8px;
  letter-spacing: 0.02em;
  line-height: 1.1538461538;
}

@media all and (min-width: 100em) {
  .c-copy--xs {
    font-size: 8.6333333333px;
  }
}

@media all and (min-width: 112.5em) {
  .c-copy--xs {
    font-size: 9.675px;
  }
}

@media screen and (min-width: 1920px) {
  .c-copy--xs {
    font-size: 10px;
  }
}

.c-copy--sm {
  font-size: 8px;
  letter-spacing: 0.02em;
  line-height: 1.1538461538;
}

@media all and (min-width: 75em) {
  .c-copy--sm {
    font-size: 8.8425px;
  }
}

@media all and (min-width: 87.5em) {
  .c-copy--sm {
    font-size: 10.24875px;
  }
}

@media all and (min-width: 100em) {
  .c-copy--sm {
    font-size: 11.655px;
  }
}

@media all and (min-width: 112.5em) {
  .c-copy--sm {
    font-size: 13.06125px;
  }
}

@media screen and (min-width: 1920px) {
  .c-copy--sm {
    font-size: 13.5px;
  }
}

.c-copy--14 {
  font-size: 8px;
  letter-spacing: 0.02em;
  line-height: 1.39;
}

@media all and (min-width: 75em) {
  .c-copy--14 {
    font-size: 9.17px;
  }
}

@media all and (min-width: 87.5em) {
  .c-copy--14 {
    font-size: 10.6283333333px;
  }
}

@media all and (min-width: 100em) {
  .c-copy--14 {
    font-size: 12.0866666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-copy--14 {
    font-size: 13.545px;
  }
}

@media screen and (min-width: 1920px) {
  .c-copy--14 {
    font-size: 14px;
  }
}

.c-copy--md {
  font-size: 10px;
  letter-spacing: 0.02em;
  line-height: 1.4375;
}

@media all and (min-width: 75em) {
  .c-copy--md {
    font-size: 11.79px;
  }
}

@media all and (min-width: 87.5em) {
  .c-copy--md {
    font-size: 13.665px;
  }
}

@media all and (min-width: 100em) {
  .c-copy--md {
    font-size: 15.54px;
  }
}

@media all and (min-width: 112.5em) {
  .c-copy--md {
    font-size: 17.415px;
  }
}

@media screen and (min-width: 1920px) {
  .c-copy--md {
    font-size: 18px;
  }
}

.c-copy--20 {
  font-size: 12px;
  line-height: 1.6;
}

@media all and (min-width: 75em) {
  .c-copy--20 {
    font-size: 13.1px;
  }
}

@media all and (min-width: 87.5em) {
  .c-copy--20 {
    font-size: 15.1833333333px;
  }
}

@media all and (min-width: 100em) {
  .c-copy--20 {
    font-size: 17.2666666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-copy--20 {
    font-size: 19.35px;
  }
}

@media screen and (min-width: 1920px) {
  .c-copy--20 {
    font-size: 20px;
  }
}

.c-copy--lg {
  font-size: 12px;
  letter-spacing: 0.02em;
  line-height: 1.3913043478;
}

@media all and (min-width: 61.25em) {
  .c-copy--lg {
    font-size: 12.4295833333px;
  }
}

@media all and (min-width: 75em) {
  .c-copy--lg {
    font-size: 15.065px;
  }
}

@media all and (min-width: 87.5em) {
  .c-copy--lg {
    font-size: 17.4608333333px;
  }
}

@media all and (min-width: 100em) {
  .c-copy--lg {
    font-size: 19.8566666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-copy--lg {
    font-size: 22.2525px;
  }
}

@media screen and (min-width: 1920px) {
  .c-copy--lg {
    font-size: 23px;
  }
}

.c-copy--22 {
  font-size: 12px;
  letter-spacing: 0.02em;
  line-height: 1.3913043478;
}

@media all and (min-width: 75em) {
  .c-copy--22 {
    font-size: 14.41px;
  }
}

@media all and (min-width: 87.5em) {
  .c-copy--22 {
    font-size: 16.7016666667px;
  }
}

@media all and (min-width: 100em) {
  .c-copy--22 {
    font-size: 18.9933333333px;
  }
}

@media all and (min-width: 112.5em) {
  .c-copy--22 {
    font-size: 21.285px;
  }
}

@media screen and (min-width: 1920px) {
  .c-copy--22 {
    font-size: 22px;
  }
}

.c-copy--22 sup {
  top: .08em;
}

.c-copy--lg-alt {
  font-family: "brandon-grotesque", Arial, sans-serif;
  font-size: 12px;
  letter-spacing: 0.02em;
  line-height: 1.4375;
}

@media all and (min-width: 75em) {
  .c-copy--lg-alt {
    font-size: 14.41px;
  }
}

@media all and (min-width: 87.5em) {
  .c-copy--lg-alt {
    font-size: 16.7016666667px;
  }
}

@media all and (min-width: 100em) {
  .c-copy--lg-alt {
    font-size: 18.9933333333px;
  }
}

@media all and (min-width: 112.5em) {
  .c-copy--lg-alt {
    font-size: 21.285px;
  }
}

@media screen and (min-width: 1920px) {
  .c-copy--lg-alt {
    font-size: 22px;
  }
}

.c-copy--xl {
  font-size: 12px;
  letter-spacing: 0.02em;
  line-height: 1.1538461538;
}

@media all and (min-width: 61.25em) {
  .c-copy--xl {
    font-size: 13.5104166667px;
  }
}

@media all and (min-width: 75em) {
  .c-copy--xl {
    font-size: 16.375px;
  }
}

@media all and (min-width: 87.5em) {
  .c-copy--xl {
    font-size: 18.9791666667px;
  }
}

@media all and (min-width: 100em) {
  .c-copy--xl {
    font-size: 21.5833333333px;
  }
}

@media all and (min-width: 112.5em) {
  .c-copy--xl {
    font-size: 24.1875px;
  }
}

@media screen and (min-width: 1920px) {
  .c-copy--xl {
    font-size: 25px;
  }
}

.c-copy--header {
  font-size: 12px;
  letter-spacing: 0.02em;
  line-height: 1.49;
}

@media all and (min-width: 61.25em) {
  .c-copy--header {
    font-size: 13.8400708333px;
  }
}

@media all and (min-width: 75em) {
  .c-copy--header {
    font-size: 16.77455px;
  }
}

@media all and (min-width: 87.5em) {
  .c-copy--header {
    font-size: 19.4422583333px;
  }
}

@media all and (min-width: 100em) {
  .c-copy--header {
    font-size: 22.1099666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-copy--header {
    font-size: 24.777675px;
  }
}

@media screen and (min-width: 1920px) {
  .c-copy--header {
    font-size: 25.61px;
  }
}

.c-copy--xxl {
  font-size: 1.375em;
  line-height: 1.4090909091;
  letter-spacing: 0.012em;
}

.c-copy--xxxl {
  font-size: 1.75em;
  line-height: 1.3103448276;
  letter-spacing: 0.014em;
}

.c-copy--26 {
  font-size: 12px;
  letter-spacing: 0.02em;
  line-height: 1.35;
}

@media all and (min-width: 61.25em) {
  .c-copy--26 {
    font-size: 14.0508333333px;
  }
}

@media all and (min-width: 75em) {
  .c-copy--26 {
    font-size: 17.03px;
  }
}

@media all and (min-width: 87.5em) {
  .c-copy--26 {
    font-size: 19.7383333333px;
  }
}

@media all and (min-width: 100em) {
  .c-copy--26 {
    font-size: 22.4466666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-copy--26 {
    font-size: 25.155px;
  }
}

@media screen and (min-width: 1920px) {
  .c-copy--26 {
    font-size: 26px;
  }
}

.c-copy--footer {
  font-size: 12.9px;
}

@media all and (min-width: 87.5em) {
  .c-copy--footer {
    font-size: 12.9058333333px;
  }
}

@media all and (min-width: 100em) {
  .c-copy--footer {
    font-size: 14.6766666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-copy--footer {
    font-size: 16.4475px;
  }
}

@media screen and (min-width: 1920px) {
  .c-copy--footer {
    font-size: 17px;
  }
}

.c-disclaimer {
  margin-bottom: 0;
  font-size: 12px;
  letter-spacing: 0.01em;
}

@media all and (min-width: 75em) {
  .c-disclaimer {
    font-size: 13.1px;
  }
}

@media all and (min-width: 87.5em) {
  .c-disclaimer {
    font-size: 15.1833333333px;
  }
}

@media all and (min-width: 100em) {
  .c-disclaimer {
    font-size: 17.2666666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-disclaimer {
    font-size: 19.35px;
  }
}

@media screen and (min-width: 1920px) {
  .c-disclaimer {
    font-size: 20px;
  }
}

.c-disclaimer {
  margin-bottom: 0;
  font-size: 12px;
  letter-spacing: 0.01em;
}

@media all and (min-width: 75em) {
  .c-disclaimer {
    font-size: 13.1px;
  }
}

@media all and (min-width: 87.5em) {
  .c-disclaimer {
    font-size: 15.1833333333px;
  }
}

@media all and (min-width: 100em) {
  .c-disclaimer {
    font-size: 17.2666666667px;
  }
}

@media all and (min-width: 112.5em) {
  .c-disclaimer {
    font-size: 19.35px;
  }
}

@media screen and (min-width: 1920px) {
  .c-disclaimer {
    font-size: 20px;
  }
}

.c-number-callout {
  background: #000;
  margin-left: 0.625em;
  padding: 0.3125em 0;
  border: 1px solid #a38b52;
  width: 3.375em;
  text-align: center;
}

.c-hero {
  position: relative;
  background: center / cover no-repeat;
  overflow: hidden;
}

.c-hero__preserve-aspect-ratio {
  width: 100%;
  height: 0;
}

.c-hero__background {
  position: absolute;
  top: 50%;
  left: 50%;
  width: auto;
  min-width: 100%;
  height: auto;
  min-height: 100%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.c-hero__content {
  position: relative;
  z-index: 99;
  color: #e0e0e0;
  z-index: 20;
}

.c-hero__content .c-hero__subheading,
.c-hero__content .c-hero__heading {
  color: #e0e0e0 !important;
}

.is-active .c-hero__content {
  z-index: 0;
}

.c-hero__scroll-button {
  position: absolute;
  bottom: -1px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 30;
}

body:not(.has-video-playing) .c-hero__scroll-button {
  z-index: 60;
}

.c-hero__disclaimer {
  width: 100%;
  margin-top: 1.25em;
  text-align: right;
}

@media all and (max-width: 48em) {
  .c-hero__disclaimer {
    padding-right: 1.25em;
  }
}

@media all and (max-width: 48em) {
  .c-hero__preserve-aspect-ratio {
    position: absolute;
    top: 0;
    left: 50%;
    width: 100vw;
    height: 100%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
  }
}

.c-hero__logo {
  width: 78px;
  height: 53px;
}

.c-hero__header {
  margin-bottom: 1.25em;
  pointer-events: none;
}

.c-hero__header a,
.c-hero__header button {
  pointer-events: auto;
}

.c-hero__header-button {
  z-index: -1;
}

.c-hero__heading {
  margin-top: 0.1363636364em;
  margin-bottom: 0.2272727273em;
}

.c-hero__subheading {
  font-size: 0.9375em;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.c-hero__subheading .c-hero__subheading-pipe {
  color: #524e4a;
}

.c-hero__banner {
  position: relative;
  z-index: 11;
  max-width: 535px;
  width: 60%;
  top: 15px;
  left: -3.613369467%;
}

@media all and (min-width: 48.0625em) {
  .c-hero__banner {
    position: absolute;
    top: 3.75em;
    width: 48.4191508582%;
    left: 0.875em;
    -webkit-transform: translateX(-2.8496042216%);
    transform: translateX(-2.8496042216%);
  }
}

@media (min-width: 1200px) {
  .c-hero__banner {
    margin-left: 0;
  }
}

@media all and (min-width: 48.0625em) {
  .ie .slide .c-hero__preserve-aspect-ratio, .ie .welcome .c-hero__preserve-aspect-ratio {
    left: 0;
  }
}

footer {
  background-color: #e6f0f5;
}

footer .footertext {
  font-weight: normal;
}

footer .footerlogo {
  margin: 0 auto;
}

@media all and (max-width: 48em) {
  footer .right-half {
    width: 75%;
  }
}

footer .SignupEmail {
  width: 100%;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: rgba(255, 255, 255, 0.25);
}

footer .SignupEmail input {
  background-color: unset;
  margin-top: 0;
  padding: 0.625em 1.25em;
  height: auto;
  -webkit-flex: 3;
  -ms-flex: 3;
  flex: 3;
  font-size: 8px;
}

@media all and (min-width: 48.0625em) {
  footer .SignupEmail input {
    font-size: 8.6104166667px;
  }
}

@media all and (min-width: 61.25em) {
  footer .SignupEmail input {
    font-size: 10.8083333333px;
  }
}

@media all and (min-width: 75em) {
  footer .SignupEmail input {
    font-size: 13.1px;
  }
}

@media all and (min-width: 87.5em) {
  footer .SignupEmail input {
    font-size: 15.1833333333px;
  }
}

@media all and (min-width: 100em) {
  footer .SignupEmail input {
    font-size: 17.2666666667px;
  }
}

@media all and (min-width: 112.5em) {
  footer .SignupEmail input {
    font-size: 19.35px;
  }
}

@media screen and (min-width: 1920px) {
  footer .SignupEmail input {
    font-size: 20px;
  }
}

footer .SignupEmail input[type=submit] {
  background-color: rgba(255, 255, 255, 0.4);
  font-weight: bold;
  padding: 0.625em 1.25em;
  height: 100%;
  font-family: "brandon-grotesque", sans-serif;
  letter-spacing: 0.1em;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  font-size: 12px;
}

@media all and (min-width: 75em) {
  footer .SignupEmail input[type=submit] {
    font-size: 14.41px;
  }
}

@media all and (min-width: 87.5em) {
  footer .SignupEmail input[type=submit] {
    font-size: 16.7016666667px;
  }
}

@media all and (min-width: 100em) {
  footer .SignupEmail input[type=submit] {
    font-size: 18.9933333333px;
  }
}

@media all and (min-width: 112.5em) {
  footer .SignupEmail input[type=submit] {
    font-size: 21.285px;
  }
}

@media screen and (min-width: 1920px) {
  footer .SignupEmail input[type=submit] {
    font-size: 22px;
  }
}

.c-icon {
  display: inline-block;
  max-width: 100%;
  background-position: center;
  background-size: contain;
  vertical-align: sub;
}

.c-icon svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: currentColor;
  stroke: none;
  pointer-events: none;
  overflow: visible;
}

.c-disclaimer .c-icon--partner {
  max-width: 104px;
}

.c-icon--partner {
  max-width: 127px;
}

.c-icon--partner svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: currentColor;
  stroke: currentColor;
  pointer-events: none;
  overflow: visible;
}

.c-icon--down {
  max-width: 10px;
}

.c-icon--play {
  max-width: 40px;
  max-height: 40px;
}

@media all and (min-width: 48.0625em) {
  .c-icon--play {
    max-width: 77px;
    max-height: 77px;
  }
}

.c-icon--social {
  width: 34px;
  height: 34px;
}

.c-hr {
  border: none;
  height: 3px;
  margin: 0;
}

.c-hr--short {
  max-width: 65px;
}

.c-hr--blue {
  background: #314682;
}

.button {
  border: 0;
  color: #fff;
  text-decoration: none;
  font-family: "brandon-grotesque", sans-serif;
  font-weight: 700 !important;
  color: #fff;
  text-transform: uppercase;
  font-weight: normal;
  font-size: 12px;
  letter-spacing: 0.15em;
  transition: background 150ms ease-in;
  white-space: nowrap;
}

@media all and (min-width: 87.5em) {
  .button {
    font-size: 12.1466666667px;
  }
}

@media all and (min-width: 100em) {
  .button {
    font-size: 13.8133333333px;
  }
}

@media all and (min-width: 112.5em) {
  .button {
    font-size: 15.48px;
  }
}

@media screen and (min-width: 1920px) {
  .button {
    font-size: 16px;
  }
}

.button:hover, .button:focus, .button:active {
  transition: background 300ms ease-in;
  text-decoration: none;
}

.button.btn-blue-1 {
  background: #314682;
}

.button.btn-blue-1:hover, .button.btn-blue-1:focus, .button.btn-blue-1:active {
  background: rgba(49, 70, 130, 0.9);
  text-decoration: none;
  color: #fff;
}

.button.btn-blue-1--outline {
  background: none;
  color: #314682;
  border: 2px solid #314682;
}

.button.btn-blue-1--outline:hover, .button.btn-blue-1--outline:focus, .button.btn-blue-1--outline:active {
  background: rgba(49, 70, 130, 0.9);
  text-decoration: none;
  color: #fff;
}

.button.btn-gold-1 {
  background: #a38b52;
}

.button.btn-gold-1:hover, .button.btn-gold-1:focus, .button.btn-gold-1:active {
  background: rgba(163, 139, 82, 0.8);
  text-decoration: none;
  color: #fff;
}

.button.btn-black-1 {
  background: #000;
}

.button.btn-black-1:hover, .button.btn-black-1:focus, .button.btn-black-1:active {
  background: rgba(0, 0, 0, 0.8);
  text-decoration: none;
  color: #fff;
}

.button.btn-blue-2 {
  background: #326783;
}

.button.btn-blue-2:hover, .button.btn-blue-2:focus, .button.btn-blue-2:active {
  background: rgba(50, 103, 131, 0.8);
  text-decoration: none;
  color: #fff;
}

.button.btn-teal-1 {
  background: #326783;
}

.button.btn-teal-1:hover, .button.btn-teal-1:focus, .button.btn-teal-1:active {
  background: rgba(50, 103, 131, 0.8);
  text-decoration: none;
  color: #fff;
}

.button.btn-blue-3 {
  background: #76a8bc;
}

.button.btn-blue-3:hover, .button.btn-blue-3:focus, .button.btn-blue-3:active {
  background: rgba(118, 168, 188, 0.8);
  text-decoration: none;
  color: #fff;
}

form .button {
  border: 0;
  color: #fff;
  text-decoration: none;
  font-family: "brandon-grotesque", Arial, sans-serif;
  color: #fff;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.15em;
  transition: background 150ms ease-in;
  padding: 0.875em 2.625em;
  background: #76a8bc;
}

@media all and (min-width: 87.5em) {
  form .button {
    font-size: 12.1466666667px;
  }
}

@media all and (min-width: 100em) {
  form .button {
    font-size: 13.8133333333px;
  }
}

@media all and (min-width: 112.5em) {
  form .button {
    font-size: 15.48px;
  }
}

@media screen and (min-width: 1920px) {
  form .button {
    font-size: 16px;
  }
}

form .button:hover, form .button:focus, form .button:active {
  transition: background 300ms ease-in;
  background: rgba(118, 168, 188, 0.8);
  text-decoration: none;
  color: #fff;
}

.btn--box-md {
  padding: 0.3333333333em 0.7777777778em;
}

.btn--box-lg {
  padding: 0.875em 2.0625em;
}

.o-icon {
  display: inline-block;
  max-width: 100%;
  max-height: 100%;
  background-position: center;
  background-size: contain;
}

.o-icon svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: currentColor;
  stroke: currentColor;
  pointer-events: none;
}

.o-icon--14x14 {
  width: 14px;
  height: 14px;
}

.o-icon--24x24 {
  width: 24px;
  height: 24px;
}

.o-icon--70x70 {
  width: 70px;
  height: 70px;
}

.o-icon--120x120 {
  width: 120px;
  height: 120px;
}

.o-icon--104x39 {
  width: 104px;
  height: 39px;
}

.o-icon--98x102 {
  width: 98px;
  height: 102px;
}

.o-icon--63x66 {
  width: 63px;
  height: 66px;
}

@media all and (max-width: 29.9375em) {
  .o-icon--70x70\@lt-sm {
    width: 70px;
    height: 70px;
  }
}

@media all and (max-width: 29.9375em) {
  .o-icon--120x120\@lt-sm {
    width: 120px;
    height: 120px;
  }
}

@media all and (min-width: 30em) {
  .o-icon--70x70\@sm {
    width: 70px;
    height: 70px;
  }
}

@media all and (min-width: 30em) {
  .o-icon--120x120\@sm {
    width: 120px;
    height: 120px;
  }
}

@media all and (min-width: 65em) {
  .o-icon--98x102\@1040 {
    width: 98px;
    height: 102px;
  }
}

.o-list {
  padding-left: 0;
  list-style: none;
}

.o-list__item {
  -webkit-column-break-inside: avoid;
  break-inside: avoid;
}

.o-list--number {
  list-style: none;
}

.o-list--number > .o-list__item {
  counter-increment: list-numbers;
}

.o-list--number .o-list__counter::before {
  display: inline-block;
  content: counter(list-numbers) ". ";
}

.o-list__item {
  -webkit-column-break-inside: avoid;
  break-inside: avoid;
}

.o-list--bullets > .o-list__item {
  position: relative;
  margin-left: 15px;
}

.o-list--bullets > .o-list__item::before {
  content: '• ';
}

.o-list--bullets-alt {
  padding-left: 1.125em;
  list-style: disc;
}

.o-list--bullets-alt > li {
  padding-bottom: 0.375em;
}

.o-list--number-sup .o-list__item {
  line-height: 1.4em;
}

.o-list--number-sup .o-list__counter {
  position: relative;
}

.o-list--number-sup .o-list__counter::before {
  content: counter(list-numbers);
  position: absolute;
  left: -.6em;
  top: -.2em;
  font-size: 75%;
}

.o-list--no-indent {
  position: relative;
}

.o-list--no-indent > li.o-list__item {
  margin-left: 0;
  padding-left: 1em;
}

.o-list--no-indent > li.o-list__item::before {
  position: absolute;
  left: 0;
}

.o-media {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.o-media__figure {
  -webkit-flex: 0 1 auto;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
}

.o-media__body {
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
}

@media all and (max-width: 29.9375em) {
  .o-media\@lt-sm {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
  }
}

@media all and (min-width: 30em) {
  .o-media\@sm {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
  }
}

.o-section {
  overflow: visible;
  position: relative;
}

.menu ul li:nth-child(3) {
  border-radius: 2em;
  padding: 0 1em 0.25em 1em;
}

.banner {
  top: -0.75em;
  right: 0;
  height: 200px;
  width: 175px;
  z-index: 999;
  text-align: center;
  font-size: 1.625em;
  line-height: 1;
  background-image: url("../img/order_now.png");
  background-size: 100%;
  background-repeat: no-repeat;
  transition: -webkit-transform 150ms ease-in;
  transition: transform 150ms ease-in;
  transition: transform 150ms ease-in, -webkit-transform 150ms ease-in;
}

.slideshow-container {
  position: relative;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
}

.navigation {
  z-index: 8;
}

.navigation .arrow.inactive {
  cursor: default;
  opacity: 0.3;
  transition: all 300ms ease-in;
}

.navigation .arrow.active {
  cursor: pointer;
  opacity: 1;
  transition: all 300ms ease-in;
}

.navigation .arrow a {
  cursor: pointer;
}

.slide {
  width: 100%;
  height: 100%;
  transition: -webkit-transform 1s;
  transition: transform 1s;
  transition: transform 1s, -webkit-transform 1s;
  position: absolute;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.slide .c-hero__content {
  z-index: 8;
}

.slide:nth-child(2) {
  left: 0;
}

.slide:nth-child(3) {
  left: 100%;
}

.slide:nth-child(4) {
  left: 200%;
}

.slide:nth-child(5) {
  left: 300%;
}

.slide header {
  text-shadow: 2px 2px 11px rgba(0, 0, 0, 0.8);
}

.open, .close {
  cursor: pointer;
}

.welcome {
  display: none;
  -webkit-transform: translate3d(0, 100%, 0);
  transform: translate3d(0, 100%, 0);
}

.welcome p, .welcome ul {
  font-size: 1.1em;
}

.welcome.active {
  z-index: 9;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  transition: -webkit-transform 300ms ease-in 300ms;
  transition: transform 300ms ease-in 300ms;
  transition: transform 300ms ease-in 300ms, -webkit-transform 300ms ease-in 300ms;
}

.welcome .close {
  position: absolute;
  right: 32px;
  top: 32px;
  width: 32px;
  height: 32px;
  opacity: 0.8;
  color: #a28857;
}

.welcome .close:hover {
  opacity: 1;
}

.welcome .close:after, .welcome .close:before {
  position: absolute;
  left: -1em;
  top: 0;
  content: ' ';
  height: 21px;
  width: 2px;
  background-color: #a28857;
}

.welcome .close:before {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.welcome .close:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

a:not(.order-now):hover {
  opacity: 0.8;
  transition: opacity 300ms ease-out;
}

a:active, a:focus {
  color: #FFF;
}

.order-now:hover .banner {
  -webkit-transform: scale(1.02);
  transform: scale(1.02);
  transition: -webkit-transform 300ms ease-out;
  transition: transform 300ms ease-out;
  transition: transform 300ms ease-out, -webkit-transform 300ms ease-out;
  z-index: 99999999;
}

.o-table {
  display: table;
  width: 100%;
  table-layout: fixed;
}

.o-table > .o-table__item {
  display: table-cell;
}

@media all and (max-width: 29.9375em) {
  .o-table\@lt-sm {
    display: table;
    width: 100%;
    table-layout: fixed;
  }
  .o-table\@lt-sm > .o-table__item {
    display: table-cell;
  }
}

@media all and (min-width: 30em) {
  .o-table\@sm {
    display: table;
    width: 100%;
    table-layout: fixed;
  }
  .o-table\@sm > .o-table__item {
    display: table-cell;
  }
}

.o-video {
  position: relative;
}

.o-video__wrapper {
  position: relative;
  background: #000;
}

.o-video__element {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: 0;
}

.o-video__element iframe,
.o-video__element object,
.o-video__element embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.o-video__close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 1;
}

.o-video--overlay .o-video__wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: transparent;
}

.o-video--overlay .o-video__element {
  transition: opacity 300ms ease;
  opacity: 0;
}

.o-video--overlay.is-active .o-video__element {
  opacity: 1;
}

.o-video--overlay .o-video__play {
  transition: opacity 300ms ease;
}

.o-video--overlay .o-video__play:not(.is-ready) {
  opacity: 0;
}

.o-video--overlay .o-video__close {
  transition: opacity 100ms ease;
  opacity: 0;
}

.o-video--overlay.is-active .o-video__close {
  opacity: 1;
}

.o-video--overlay.is-active .o-video__close:focus,
.o-video--overlay.is-active .o-video__close:hover {
  opacity: 0.6;
}

@media all and (max-width: 29.9375em) {
  .o-video\@lt-sm {
    position: relative;
  }
}

@media all and (min-width: 30em) {
  .o-video\@sm {
    position: relative;
  }
}

@-webkit-keyframes plyr-progress {
  to {
    background-position: 25px 0;
  }
}

@keyframes plyr-progress {
  to {
    background-position: 25px 0;
  }
}

.plyr {
  position: relative;
  max-width: 100%;
  min-width: 200px;
  font-family: Avenir,'Avenir Next','Helvetica Neue','Segoe UI',Helvetica,Arial,sans-serif;
  direction: ltr;
}

.plyr, .plyr *, .plyr ::after, .plyr ::before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.plyr a, .plyr button, .plyr input, .plyr label {
  -ms-touch-action: manipulation;
  touch-action: manipulation;
}

.plyr:focus {
  outline: 0;
}

.plyr audio, .plyr video {
  width: 100%;
  height: auto;
  vertical-align: middle;
  border-radius: inherit;
}

.plyr input[type=range] {
  display: block;
  height: 20px;
  width: 100%;
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;
  border: none;
  background: 0 0;
}

.plyr input[type=range]::-webkit-slider-runnable-track {
  height: 8px;
  background: 0 0;
  border: 0;
  border-radius: 4px;
  -webkit-user-select: none;
  user-select: none;
}

.plyr input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  margin-top: -4px;
  position: relative;
  height: 16px;
  width: 16px;
  background: #fff;
  border: 2px solid transparent;
  border-radius: 100%;
  -webkit-transition: background .2s ease,border .2s ease,-webkit-transform .2s ease;
  transition: background .2s ease,border .2s ease,-webkit-transform .2s ease;
  transition: background .2s ease,border .2s ease,transform .2s ease;
  transition: background .2s ease,border .2s ease,transform .2s ease,-webkit-transform .2s ease;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.15);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.plyr input[type=range]::-moz-range-track {
  height: 8px;
  background: 0 0;
  border: 0;
  border-radius: 4px;
  -moz-user-select: none;
  user-select: none;
}

.plyr input[type=range]::-moz-range-thumb {
  position: relative;
  height: 16px;
  width: 16px;
  background: #fff;
  border: 2px solid transparent;
  border-radius: 100%;
  -webkit-transition: background .2s ease,border .2s ease,-webkit-transform .2s ease;
  transition: background .2s ease,border .2s ease,-webkit-transform .2s ease;
  transition: background .2s ease,border .2s ease,transform .2s ease;
  transition: background .2s ease,border .2s ease,transform .2s ease,-webkit-transform .2s ease;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.15);
  box-sizing: border-box;
}

.plyr input[type=range]::-ms-track {
  height: 8px;
  background: 0 0;
  border: 0;
  color: transparent;
}

.plyr input[type=range]::-ms-fill-upper {
  height: 8px;
  background: 0 0;
  border: 0;
  border-radius: 4px;
  -ms-user-select: none;
  user-select: none;
}

.plyr input[type=range]::-ms-fill-lower {
  height: 8px;
  background: 0 0;
  border: 0;
  border-radius: 4px;
  -ms-user-select: none;
  user-select: none;
  background: #3498db;
}

.plyr input[type=range]::-ms-thumb {
  position: relative;
  height: 16px;
  width: 16px;
  background: #fff;
  border: 2px solid transparent;
  border-radius: 100%;
  -webkit-transition: background .2s ease,border .2s ease,-webkit-transform .2s ease;
  transition: background .2s ease,border .2s ease,-webkit-transform .2s ease;
  transition: background .2s ease,border .2s ease,transform .2s ease;
  transition: background .2s ease,border .2s ease,transform .2s ease,-webkit-transform .2s ease;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.15);
  box-sizing: border-box;
  margin-top: 0;
}

.plyr input[type=range]::-ms-tooltip {
  display: none;
}

.plyr input[type=range]:focus {
  outline: 0;
}

.plyr input[type=range]::-moz-focus-outer {
  border: 0;
}

.plyr input[type=range].tab-focus:focus {
  outline-offset: 3px;
}

.plyr input[type=range]:active::-webkit-slider-thumb {
  background: #3498db;
  border-color: #fff;
  -webkit-transform: scale(1.25);
  transform: scale(1.25);
}

.plyr input[type=range]:active::-moz-range-thumb {
  background: #3498db;
  border-color: #fff;
  transform: scale(1.25);
}

.plyr input[type=range]:active::-ms-thumb {
  background: #3498db;
  border-color: #fff;
  transform: scale(1.25);
}

.plyr--video input[type=range].tab-focus:focus {
  outline: 1px dotted rgba(255, 255, 255, 0.5);
}

.plyr--audio input[type=range].tab-focus:focus {
  outline: 1px dotted rgba(86, 93, 100, 0.5);
}

.plyr__sr-only {
  clip: rect(1px, 1px, 1px, 1px);
  overflow: hidden;
  position: absolute !important;
  padding: 0 !important;
  border: 0 !important;
  height: 1px !important;
  width: 1px !important;
}

.plyr__video-wrapper {
  position: relative;
  background: #000;
  border-radius: inherit;
}

.plyr__video-embed {
  padding-bottom: 56.25%;
  height: 0;
  border-radius: inherit;
  overflow: hidden;
  z-index: 0;
}

.plyr__video-embed iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.plyr__video-embed > div {
  position: relative;
  padding-bottom: 200%;
  -webkit-transform: translateY(-35.95%);
  transform: translateY(-35.95%);
}

.plyr .plyr__video-embed iframe {
  pointer-events: none;
}

.plyr video::-webkit-media-text-track-container {
  display: none;
}

.plyr__captions {
  display: none;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 20px;
  -webkit-transform: translateY(-40px);
  transform: translateY(-40px);
  -webkit-transition: -webkit-transform .3s ease;
  transition: -webkit-transform .3s ease;
  transition: transform .3s ease;
  transition: transform .3s ease, -webkit-transform .3s ease;
  transition: transform .3s ease,-webkit-transform .3s ease;
  color: #fff;
  font-size: 16px;
  text-align: center;
  font-weight: 400;
}

.plyr__captions span {
  border-radius: 2px;
  padding: 3px 10px;
  background: rgba(0, 0, 0, 0.7);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  line-height: 150%;
}

.plyr__captions span:empty {
  display: none;
}

@media (min-width: 768px) {
  .plyr__captions {
    font-size: 24px;
  }
}

.plyr--captions-active .plyr__captions {
  display: block;
}

.plyr--hide-controls .plyr__captions {
  -webkit-transform: translateY(-15px);
  transform: translateY(-15px);
}

@media (min-width: 1024px) {
  .plyr--fullscreen-active .plyr__captions {
    font-size: 32px;
  }
}

.plyr ::-webkit-media-controls {
  display: none;
}

.plyr__controls {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  line-height: 1;
  text-align: center;
  pointer-events: none;
}

.plyr__controls > * {
  pointer-events: all;
}

.plyr__controls .plyr__progress, .plyr__controls .plyr__time, .plyr__controls > button {
  margin-left: 5px;
}

.plyr__controls .plyr__progress:first-child, .plyr__controls .plyr__time:first-child, .plyr__controls > button:first-child {
  margin-left: 0;
}

.plyr__controls .plyr__volume {
  margin-left: 5px;
}

.plyr__controls [data-plyr=pause] {
  margin-left: 0;
}

.plyr__controls button {
  position: relative;
  display: inline-block;
  -ms-flex-negative: 0;
  -webkit-flex-shrink: 0;
  flex-shrink: 0;
  overflow: visible;
  vertical-align: middle;
  padding: 7px;
  border: 0;
  background: 0 0;
  border-radius: 3px;
  cursor: pointer;
  -webkit-transition: background .3s ease,color .3s ease,opacity .3s ease;
  transition: background .3s ease,color .3s ease,opacity .3s ease;
  color: inherit;
}

.plyr__controls button svg {
  width: 18px;
  height: 18px;
  display: block;
  fill: currentColor;
}

.plyr__controls button:focus {
  outline: 0;
}

.plyr__controls .icon--captions-on, .plyr__controls .icon--exit-fullscreen, .plyr__controls .icon--muted {
  display: none;
}

@media (min-width: 480px) {
  .plyr__controls .plyr__progress, .plyr__controls .plyr__time, .plyr__controls > button {
    margin-left: 10px;
  }
}

.plyr--hide-controls .plyr__controls {
  opacity: 0;
  pointer-events: none;
}

.plyr--video .plyr__controls {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  padding: 50px 10px 10px;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.5)));
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5));
  border-bottom-left-radius: inherit;
  border-bottom-right-radius: inherit;
  color: #fff;
  -webkit-transition: opacity .3s ease;
  transition: opacity .3s ease;
}

.plyr--video .plyr__controls button.tab-focus:focus, .plyr--video .plyr__controls button:hover {
  background: #3498db;
  color: #fff;
}

.plyr--audio .plyr__controls {
  padding: 10px;
  border-radius: inherit;
  background: #fff;
  border: 1px solid #dbe3e8;
  color: #565d64;
}

.plyr--audio .plyr__controls button.tab-focus:focus, .plyr--audio .plyr__controls button:hover {
  background: #3498db;
  color: #fff;
}

.plyr__play-large {
  display: none;
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  padding: 10px;
  background: #3498db;
  border: 4px solid currentColor;
  border-radius: 100%;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
  color: #fff;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
}

.plyr__play-large svg {
  position: relative;
  left: 2px;
  width: 20px;
  height: 20px;
  display: block;
  fill: currentColor;
}

.plyr__play-large:focus {
  outline: 1px dotted rgba(255, 255, 255, 0.5);
}

.plyr .plyr__play-large {
  display: inline-block;
}

.plyr--audio .plyr__play-large {
  display: none;
}

.plyr--playing .plyr__play-large {
  opacity: 0;
  visibility: hidden;
}

.plyr--playing .plyr__controls [data-plyr=play], .plyr__controls [data-plyr=pause] {
  display: none;
}

.plyr--playing .plyr__controls [data-plyr=pause] {
  display: inline-block;
}

.plyr--captions-active .plyr__controls .icon--captions-on, .plyr--fullscreen-active .icon--exit-fullscreen, .plyr--muted .plyr__controls .icon--muted {
  display: block;
}

.plyr--captions-active .plyr__controls .icon--captions-on + svg, .plyr--fullscreen-active .icon--exit-fullscreen + svg, .plyr--muted .plyr__controls .icon--muted + svg {
  display: none;
}

.plyr [data-plyr=captions], .plyr [data-plyr=fullscreen] {
  display: none;
}

.plyr--captions-enabled [data-plyr=captions], .plyr--fullscreen-enabled [data-plyr=fullscreen] {
  display: inline-block;
}

.plyr__tooltip {
  position: absolute;
  z-index: 2;
  bottom: 100%;
  margin-bottom: 10px;
  padding: 5px 7.5px;
  pointer-events: none;
  opacity: 0;
  background: rgba(0, 0, 0, 0.7);
  border-radius: 3px;
  color: #fff;
  font-size: 14px;
  line-height: 1.3;
  -webkit-transform: translate(-50%, 10px) scale(0.8);
  transform: translate(-50%, 10px) scale(0.8);
  -webkit-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  -webkit-transition: opacity .2s .1s ease,-webkit-transform .2s .1s ease;
  transition: opacity .2s .1s ease,-webkit-transform .2s .1s ease;
  transition: transform .2s .1s ease,opacity .2s .1s ease;
  transition: transform .2s .1s ease,opacity .2s .1s ease,-webkit-transform .2s .1s ease;
}

.plyr__tooltip::before {
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  bottom: -4px;
  border-right: 4px solid transparent;
  border-top: 4px solid rgba(0, 0, 0, 0.7);
  border-left: 4px solid transparent;
  z-index: 2;
}

.plyr button.tab-focus:focus .plyr__tooltip, .plyr button:hover .plyr__tooltip, .plyr__tooltip--visible {
  opacity: 1;
  -webkit-transform: translate(-50%, 0) scale(1);
  transform: translate(-50%, 0) scale(1);
}

.plyr button:hover .plyr__tooltip {
  z-index: 3;
}

.plyr__controls button:first-child .plyr__tooltip {
  left: 0;
  -webkit-transform: translate(0, 10px) scale(0.8);
  transform: translate(0, 10px) scale(0.8);
  -webkit-transform-origin: 0 100%;
  transform-origin: 0 100%;
}

.plyr__controls button:first-child .plyr__tooltip::before {
  left: 16px;
}

.plyr__controls button:last-child .plyr__tooltip {
  right: 0;
  -webkit-transform: translate(0, 10px) scale(0.8);
  transform: translate(0, 10px) scale(0.8);
  -webkit-transform-origin: 100% 100%;
  transform-origin: 100% 100%;
}

.plyr__controls button:last-child .plyr__tooltip::before {
  left: auto;
  right: 16px;
  -webkit-transform: translateX(50%);
  transform: translateX(50%);
}

.plyr__controls button:first-child .plyr__tooltip--visible, .plyr__controls button:first-child.tab-focus:focus .plyr__tooltip, .plyr__controls button:first-child:hover .plyr__tooltip, .plyr__controls button:last-child .plyr__tooltip--visible, .plyr__controls button:last-child.tab-focus:focus .plyr__tooltip, .plyr__controls button:last-child:hover .plyr__tooltip {
  -webkit-transform: translate(0, 0) scale(1);
  transform: translate(0, 0) scale(1);
}

.plyr__progress {
  position: relative;
  display: none;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  -webkit-flex: 1;
  flex: 1;
}

.plyr__progress input[type=range] {
  position: relative;
  z-index: 2;
}

.plyr__progress input[type=range]::-webkit-slider-runnable-track {
  background: 0 0;
}

.plyr__progress input[type=range]::-moz-range-track {
  background: 0 0;
}

.plyr__progress input[type=range]::-ms-fill-upper {
  background: 0 0;
}

.plyr__progress .plyr__tooltip {
  left: 0;
}

.plyr .plyr__progress {
  display: inline-block;
}

.plyr__progress--buffer, .plyr__progress--played, .plyr__volume--display {
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  height: 8px;
  margin: -4px 0 0;
  padding: 0;
  vertical-align: top;
  -webkit-appearance: none;
  -moz-appearance: none;
  border: none;
  border-radius: 100px;
}

.plyr__progress--buffer::-webkit-progress-bar, .plyr__progress--played::-webkit-progress-bar, .plyr__volume--display::-webkit-progress-bar {
  background: 0 0;
}

.plyr__progress--buffer::-webkit-progress-value, .plyr__progress--played::-webkit-progress-value, .plyr__volume--display::-webkit-progress-value {
  background: currentColor;
  border-radius: 100px;
  min-width: 8px;
}

.plyr__progress--buffer::-moz-progress-bar, .plyr__progress--played::-moz-progress-bar, .plyr__volume--display::-moz-progress-bar {
  background: currentColor;
  border-radius: 100px;
  min-width: 8px;
}

.plyr__progress--buffer::-ms-fill, .plyr__progress--played::-ms-fill, .plyr__volume--display::-ms-fill {
  border-radius: 100px;
}

.plyr__progress--played, .plyr__volume--display {
  z-index: 1;
  color: #3498db;
  background: 0 0;
  -webkit-transition: none;
  transition: none;
}

.plyr__progress--played::-webkit-progress-value, .plyr__volume--display::-webkit-progress-value {
  min-width: 8px;
  max-width: 99%;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  -webkit-transition: none;
  transition: none;
}

.plyr__progress--played::-moz-progress-bar, .plyr__volume--display::-moz-progress-bar {
  min-width: 8px;
  max-width: 99%;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  -webkit-transition: none;
  transition: none;
}

.plyr__progress--played::-ms-fill, .plyr__volume--display::-ms-fill {
  display: none;
}

.plyr__progress--buffer::-webkit-progress-value {
  -webkit-transition: width .2s ease;
  transition: width .2s ease;
}

.plyr__progress--buffer::-moz-progress-bar {
  -webkit-transition: width .2s ease;
  transition: width .2s ease;
}

.plyr__progress--buffer::-ms-fill {
  -webkit-transition: width .2s ease;
  transition: width .2s ease;
}

.plyr--video .plyr__progress--buffer, .plyr--video .plyr__volume--display {
  background: rgba(255, 255, 255, 0.25);
}

.plyr--video .plyr__progress--buffer {
  color: rgba(255, 255, 255, 0.25);
}

.plyr--audio .plyr__progress--buffer, .plyr--audio .plyr__volume--display {
  background: rgba(198, 214, 219, 0.66);
}

.plyr--audio .plyr__progress--buffer {
  color: rgba(198, 214, 219, 0.66);
}

.plyr--loading .plyr__progress--buffer {
  -webkit-animation: plyr-progress 1s linear infinite;
  animation: plyr-progress 1s linear infinite;
  background-size: 25px 25px;
  background-repeat: repeat-x;
  background-image: linear-gradient(-45deg, rgba(0, 0, 0, 0.15) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.15) 50%, rgba(0, 0, 0, 0.15) 75%, transparent 75%, transparent);
  color: transparent;
}

.plyr--video.plyr--loading .plyr__progress--buffer {
  background-color: rgba(255, 255, 255, 0.25);
}

.plyr--audio.plyr--loading .plyr__progress--buffer {
  background-color: rgba(198, 214, 219, 0.66);
}

.plyr__time {
  display: inline-block;
  vertical-align: middle;
  font-size: 14px;
}

.plyr__time + .plyr__time {
  display: none;
}

@media (min-width: 768px) {
  .plyr__time + .plyr__time {
    display: inline-block;
  }
}

.plyr__time + .plyr__time::before {
  content: '\2044';
  margin-right: 10px;
}

.plyr__volume {
  display: none;
}

.plyr .plyr__volume {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  -webkit-flex: 1;
  flex: 1;
  position: relative;
}

.plyr .plyr__volume input[type=range] {
  position: relative;
  z-index: 2;
}

@media (min-width: 480px) {
  .plyr .plyr__volume {
    display: block;
    max-width: 60px;
  }
}

@media (min-width: 768px) {
  .plyr .plyr__volume {
    max-width: 100px;
  }
}

.plyr--is-ios .plyr__volume, .plyr--is-ios [data-plyr=mute] {
  display: none !important;
}

.plyr--fullscreen-active {
  height: 100%;
  width: 100%;
  background: #000;
  border-radius: 0 !important;
}

.plyr--fullscreen-active video {
  height: 100%;
}

.plyr--fullscreen-active .plyr__video-wrapper {
  height: 100%;
  width: 100%;
}

.plyr--fullscreen-active .plyr__video-embed {
  overflow: visible;
}

.plyr--fullscreen-active.plyr--vimeo .plyr__video-wrapper {
  height: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.plyr--fullscreen-fallback.plyr--fullscreen-active {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10000000;
}

body.is-fullscreen .c-nav {
  z-index: -1 !important;
}

body.is-fullscreen [class*="js-fade"] {
  -webkit-animation: none !important;
  animation: none !important;
  opacity: 1 !important;
  -webkit-transform: none !important;
  transform: none !important;
}

body.is-fullscreen .work-content-video__player {
  wmode: transparent;
}

.plyr--video .plyr__controls {
  opacity: 0;
  visibility: hidden;
}

.plyr--video.plyr--paused .custom-poster-image {
  opacity: 0;
}

.plyr--video.plyr--playing .custom-poster-image {
  opacity: 0;
}

.plyr--video.plyr--playing .plyr__controls {
  opacity: 1;
  visibility: visible;
}

.plyr--video .plyr__play-large {
  background: transparent;
  box-shadow: none;
  border: none;
}

.plyr--video .plyr__play-large svg {
  width: 6.25em;
  height: 6.25em;
}

.plyr--video .custom-poster-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  transition: opacity 200ms ease;
}

.plyr--video .plyr__controls button {
  padding: 0;
  border-radius: 0;
}

.plyr--video .plyr__controls button:hover {
  opacity: 0.5;
  background-color: transparent;
}

.plyr--video .plyr__controls button svg {
  width: 30px;
  height: 30px;
}

.plyr input[type=range]::-ms-fill-lower,
.plyr input[type=range]:active::-webkit-slider-thumb,
.plyr input[type=range]:active::-moz-range-thumb,
.plyr input[type=range]:active::-ms-thumb,
.plyr--audio .plyr__controls button.tab-focus:focus,
.plyr--audio .plyr__controls button:hover
.plyr--video .plyr__controls button.tab-focus:focus,
.plyr--video .plyr__controls button:hover {
  background-color: transparent !important;
}

.plyr__progress--played,
.plyr__volume--display {
  color: #f7efdc !important;
}

.o-preserve-aspect-ratio {
  width: 100%;
  height: 0;
  padding: 0 0 100%;
}

.o-preserve-aspect-ratio--1x1 {
  padding: 0 0 100%;
}

.o-preserve-aspect-ratio--2x1 {
  padding: 0 0 50%;
}

.o-preserve-aspect-ratio--16x9 {
  padding: 0 0 56.25%;
}

.o-preserve-aspect-ratio--3x2 {
  padding: 0 0 66.6666666667%;
}

.o-preserve-aspect-ratio--10x7 {
  padding: 0 0 70%;
}

.o-preserve-aspect-ratio--4x3 {
  padding: 0 0 75%;
}

.o-preserve-aspect-ratio--5x3 {
  padding: 0 0 60%;
}

@media all and (min-width: 48.0625em) {
  .o-preserve-aspect-ratio--40x19\@md {
    padding: 0 0 47.5% !important;
  }
}

.o-preserve-aspect-ratio--89x116 {
  padding: 0 0 130.337078652%;
}

.o-preserve-aspect-ratio--552x432 {
  padding: 0 0 78.2608695652%;
}

.o-preserve-aspect-ratio--629x449 {
  padding: 0 0 71.3831478537%;
}

.o-preserve-aspect-ratio--440x593 {
  padding: 0 0 91.2307692308%;
}

.o-preserve-aspect-ratio--1200x700 {
  padding: 0 0 58.3333333333%;
}

.o-preserve-aspect-ratio--500x370 {
  padding: 0 0 74%;
}

.o-preserve-aspect-ratio--245x370 {
  padding: 0 0 151.020408163%;
}

.o-preserve-aspect-ratio--419x632 {
  padding: 0 0 150.835322196%;
}

@media all and (min-width: 61.25em) {
  .o-preserve-aspect-ratio--20x9\@lg {
    padding: 0 0 45%;
  }
}

@media all and (min-width: 61.25em) {
  .o-preserve-aspect-ratio--35x33\@lg {
    padding: 0 0 94.2857142857%;
  }
}

.o-preserve-aspect-ratio--9x4 {
  padding: 0 0 44.4444444444%;
}

@media all and (min-width: 48.0625em) {
  .o-preserve-aspect-ratio--16x9\@md {
    padding: 0 0 56.25%;
  }
}

@media all and (min-width: 42.5em) {
  .o-preserve-aspect-ratio--16x9\@680 {
    padding: 0 0 56.25%;
  }
}

@media (min-width: 30em) and (max-width: 48em) {
  .o-preserve-aspect-ratio--3x2\@btwn-sm-and-md {
    padding: 0 0 66.6666666667%;
  }
}

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

.u-align-items-stretch {
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}

@media all and (max-width: 29.9375em) {
  .u-align-items-center\@lt-sm {
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
  }
}

@media all and (max-width: 48em) {
  .u-align-items-center\@lt-md {
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
  }
}

@media all and (min-width: 30em) {
  .u-align-items-center\@sm {
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
  }
}

.u-align-self-flex-start {
  -webkit-align-self: flex-start;
  -ms-flex-item-align: start;
  align-self: flex-start;
}

.u-align-self-flex-end {
  -webkit-align-self: flex-end;
  -ms-flex-item-align: end;
  align-self: flex-end;
}

@media all and (max-width: 29.9375em) {
  .u-align-self-flex-start\@lt-sm {
    -webkit-align-self: flex-start;
    -ms-flex-item-align: start;
    align-self: flex-start;
  }
}

@media all and (max-width: 29.9375em) {
  .u-align-self-flex-end\@lt-sm {
    -webkit-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end;
  }
}

@media all and (min-width: 30em) {
  .u-align-self-flex-start\@sm {
    -webkit-align-self: flex-start;
    -ms-flex-item-align: start;
    align-self: flex-start;
  }
}

@media all and (min-width: 30em) {
  .u-align-self-flex-end\@sm {
    -webkit-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end;
  }
}

@media all and (min-width: 48.0625em) {
  .u-align-self-center\@md {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
  }
}

@-webkit-keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.u-animation-fade-in-400ms {
  opacity: 1;
  -webkit-animation: 400ms fade-in linear forwards;
  animation: 400ms fade-in linear forwards;
}

@media all and (max-width: 29.9375em) {
  .u-animation-fade-in-400ms\@lt-sm {
    opacity: 1;
    -webkit-animation: 400ms fade-in linear forwards;
    animation: 400ms fade-in linear forwards;
  }
}

@media all and (min-width: 30em) {
  .u-animation-fade-in-400ms\@sm {
    opacity: 1;
    -webkit-animation: 400ms fade-in linear forwards;
    animation: 400ms fade-in linear forwards;
  }
}

.u-aspect-ratio-1x1 {
  width: 100%;
  height: 0;
  padding: 0 0 100%;
}

.u-aspect-ratio-3x1 {
  width: 100%;
  height: 0;
  padding: 0 0 33.3333333333%;
}

.u-aspect-ratio-16x9 {
  width: 100%;
  height: 0;
  padding: 0 0 56.25%;
}

.u-aspect-ratio-50x30 {
  width: 100%;
  height: 0;
  padding: 0 0 60%;
}

@media all and (max-width: 29.9375em) {
  .u-aspect-ratio-3x1\@lt-sm {
    width: 100%;
    height: 0;
    padding: 0 0 33.3333333333%;
  }
}

@media all and (max-width: 29.9375em) {
  .u-aspect-ratio-16x9\@lt-sm {
    width: 100%;
    height: 0;
    padding: 0 0 56.25%;
  }
}

@media all and (min-width: 30em) {
  .u-aspect-ratio-3x1\@sm {
    width: 100%;
    height: 0;
    padding: 0 0 33.3333333333%;
  }
}

@media all and (min-width: 30em) {
  .u-aspect-ratio-16x9\@sm {
    width: 100%;
    height: 0;
    padding: 0 0 56.25%;
  }
}

.u-background-color-white-1 {
  background-color: #fff;
}

.u-background-color-black-1 {
  background-color: #000;
}

.u-background-color-blue-1 {
  background-color: #314682;
}

.u-background-color-blue-2 {
  background-color: #326783;
}

.u-background-color-blue-3 {
  background-color: #76a8bc;
}

.u-background-color-blue-4 {
  background-color: #b2d7e1;
}

.u-background-color-blue-8 {
  background-color: #B0D6E3;
}

.u-background-color-teal-1 {
  background-color: #326783;
}

.u-background-color-pink-1 {
  background-color: #f7ddd5;
}

.u-background-color-yellow-1 {
  background-color: #f7efdc;
}

.u-background-color-gold-1 {
  background-color: #a38b52;
}

.u-background-position-top-right {
  background-position: top right;
}

@media all and (max-width: 29.9375em) {
  .u-background-position-top-right\@lt-sm {
    background-position: top right;
  }
}

@media all and (min-width: 30em) {
  .u-background-position-top-right\@sm {
    background-position: top right;
  }
}

.u-border-top-gray-3 {
  border-top: 1px solid #666666;
}

.u-border-bottom-red-1 {
  border-bottom: 4px solid #d4603b;
}

@media all and (max-width: 29.9375em) {
  .u-border-top-gray-3\@lt-sm {
    border-top: 1px solid #666666;
  }
}

@media all and (min-width: 30em) {
  .u-border-top-gray-3\@sm {
    border-top: 1px solid #666666;
  }
}

.u-box-shadow-down-black-1 {
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

@media all and (max-width: 29.9375em) {
  .u-box-shadow-down-black-1\@lt-sm {
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  }
}

@media all and (min-width: 30em) {
  .u-box-shadow-down-black-1\@sm {
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  }
}

.u-color-primary {
  color: #757575;
}

.u-color-secondary {
  color: #777777;
}

.u-color-black-1 {
  color: #000;
}

.u-color-white {
  color: #fff;
}

.u-color-gray-1 {
  color: #777777;
}

.u-color-gray-2 {
  color: #757575;
}

.u-color-gray-3 {
  color: #666666;
}

.u-color-gray-4 {
  color: #e0e0e0;
}

.u-color-gold-1 {
  color: #a38b52;
}

.u-color-red-1 {
  color: #d4603b;
}

.u-color-blue-1 {
  color: #314682;
}

.u-color-blue-2 {
  color: #326783;
}

.u-color-blue-3 {
  color: #76a8bc;
}

.u-color-teal-1 {
  color: #326783;
}

.u-color-primary--links a {
  color: #757575;
}

.u-content-before-arrow-left::before {
  content: "« ";
}

.u-content-after-arrow-right::after {
  content: " »";
}

@media all and (max-width: 29.9375em) {
  .u-content-before-arrow-left\@lt-sm::before {
    content: "« ";
  }
}

@media all and (max-width: 29.9375em) {
  .u-content-after-arrow-right\@lt-sm::after {
    content: " »";
  }
}

@media all and (min-width: 30em) {
  .u-content-before-arrow-left\@sm::before {
    content: "« ";
  }
}

@media all and (min-width: 30em) {
  .u-content-after-arrow-right\@sm::after {
    content: " »";
  }
}

.u-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  clip: rect(0 0 0 0);
  border: 0;
  overflow: hidden;
}

.u-display-flex {
  display: -webkit-flex !important;
  display: -ms-flexbox !important;
  display: flex !important;
}

.u-display-none {
  display: none !important;
}

.u-display-block {
  display: block !important;
}

.u-display-inline-block {
  display: inline-block !important;
}

@media all and (min-width: 42.5em) {
  .u-display-none\@680 {
    display: none !important;
  }
}

@media all and (min-width: 48.0625em) {
  .u-display-none\@md {
    display: none !important;
  }
}

@media all and (min-width: 42.5em) {
  .u-display-block\@680 {
    display: block !important;
  }
}

@media all and (min-width: 48.0625em) {
  .u-display-block\@md {
    display: block !important;
  }
}

@media all and (max-width: 48em) {
  .u-display-none\@lt-md {
    display: none !important;
  }
}

@media all and (max-width: 56.1875em) {
  .u-display-none\@lt-900 {
    display: none !important;
  }
}

@media all and (max-width: 48em) {
  .u-display-flex\@lt-md {
    display: -webkit-flex !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
}

@media all and (min-width: 48.0625em) {
  .u-display-flex\@md {
    display: -webkit-flex !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
}

.u-depth-0 {
  z-index: 0;
}

.u-depth-1 {
  z-index: 1;
}

.u-depth-2 {
  z-index: 2;
}

.u-depth-3 {
  z-index: 3;
}

.u-depth-4 {
  z-index: 4;
}

.u-depth-5 {
  z-index: 5;
}

.u-depth-6 {
  z-index: 6;
}

.u-depth-7 {
  z-index: 7;
}

.u-depth-8 {
  z-index: 8;
}

.u-depth-9 {
  z-index: 9;
}

.u-depth-10 {
  z-index: 10;
}

@media all and (max-width: 29.9375em) {
  .u-depth-1\@lt-sm {
    z-index: 1;
  }
}

@media all and (max-width: 29.9375em) {
  .u-depth-2\@lt-sm {
    z-index: 2;
  }
}

@media all and (max-width: 29.9375em) {
  .u-depth-3\@lt-sm {
    z-index: 3;
  }
}

@media all and (max-width: 29.9375em) {
  .u-depth-4\@lt-sm {
    z-index: 4;
  }
}

@media all and (max-width: 29.9375em) {
  .u-depth-5\@lt-sm {
    z-index: 5;
  }
}

@media all and (max-width: 29.9375em) {
  .u-depth-6\@lt-sm {
    z-index: 6;
  }
}

@media all and (max-width: 29.9375em) {
  .u-depth-7\@lt-sm {
    z-index: 7;
  }
}

@media all and (max-width: 29.9375em) {
  .u-depth-8\@lt-sm {
    z-index: 8;
  }
}

@media all and (max-width: 29.9375em) {
  .u-depth-9\@lt-sm {
    z-index: 9;
  }
}

@media all and (max-width: 29.9375em) {
  .u-depth-10\@lt-sm {
    z-index: 10;
  }
}

@media all and (min-width: 30em) {
  .u-depth-1\@sm {
    z-index: 1;
  }
}

@media all and (min-width: 30em) {
  .u-depth-2\@sm {
    z-index: 2;
  }
}

@media all and (min-width: 30em) {
  .u-depth-3\@sm {
    z-index: 3;
  }
}

@media all and (min-width: 30em) {
  .u-depth-4\@sm {
    z-index: 4;
  }
}

@media all and (min-width: 30em) {
  .u-depth-5\@sm {
    z-index: 5;
  }
}

@media all and (min-width: 30em) {
  .u-depth-6\@sm {
    z-index: 6;
  }
}

@media all and (min-width: 30em) {
  .u-depth-7\@sm {
    z-index: 7;
  }
}

@media all and (min-width: 30em) {
  .u-depth-8\@sm {
    z-index: 8;
  }
}

@media all and (min-width: 30em) {
  .u-depth-9\@sm {
    z-index: 9;
  }
}

@media all and (min-width: 30em) {
  .u-depth-10\@sm {
    z-index: 10;
  }
}

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

.u-align-items-flex-start {
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.u-align-items-flex-end {
  -webkit-align-items: flex-end;
  -ms-flex-align: end;
  align-items: flex-end;
}

.u-align-self-center {
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
}

.u-justify-content-center {
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.u-justify-content-space-between {
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.u-justify-content-flex-start {
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.u-flex-direction-column {
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.u-flex-nowrap {
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
}

@media all and (min-width: 48.0625em) {
  .u-flex-nowrap\@md {
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
  }
}

@media all and (min-width: 38.75em) {
  .u-flex-nowrap\@620 {
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
  }
}

.u-flex-wrap {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.u-flex-1 {
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.u-flex-1-20 {
  -webkit-flex: 1 20%;
  -ms-flex: 1 20%;
  flex: 1 20%;
}

.u-flex-1-25 {
  -webkit-flex: 1 25%;
  -ms-flex: 1 25%;
  flex: 1 25%;
}

.u-flex-1-45 {
  -webkit-flex: 1 45%;
  -ms-flex: 1 45%;
  flex: 1 45%;
}

.u-flex-1-50 {
  -webkit-flex: 1 50%;
  -ms-flex: 1 50%;
  flex: 1 50%;
}

.u-flex-2 {
  -webkit-flex: 2;
  -ms-flex: 2;
  flex: 2;
}

.u-flex-3 {
  -webkit-flex: 3;
  -ms-flex: 3;
  flex: 3;
}

.u-flex-4 {
  -webkit-flex: 4;
  -ms-flex: 4;
  flex: 4;
}

.u-flex-5 {
  -webkit-flex: 5;
  -ms-flex: 5;
  flex: 5;
}

.u-flex-6 {
  -webkit-flex: 6;
  -ms-flex: 6;
  flex: 6;
}

.u-flex-shrink {
  -webkit-flex: 0 0 auto;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
}

.u-flex-grow {
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
}

.u-flex-1-100 {
  -webkit-flex: 1 100%;
  -ms-flex: 1 100%;
  flex: 1 100%;
}

@media all and (max-width: 61.1875em) {
  .u-flex-direction-column-reverse\@lt-lg {
    -webkit-flex-direction: column-reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
  }
}

@media all and (max-width: 48em) {
  .u-flex-direction-column-reverse\@lt-md {
    -webkit-flex-direction: column-reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
  }
}

@media all and (min-width: 48.0625em) {
  .u-flex-direction-row\@md {
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
  }
}

@media all and (max-width: 38.6875em) {
  .u-flex-1-1-auto\@lt-620 {
    -webkit-flex: 1 1 auto !important;
    -ms-flex: 1 1 auto !important;
    flex: 1 1 auto !important;
  }
}

@media all and (max-width: 29.9375em) {
  .u-flex-1\@lt-sm {
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }
}

@media all and (min-width: 48.0625em) {
  .u-flex-direction-row-reverse\@md {
    -webkit-flex-direction: row-reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
  }
}

@media all and (min-width: 48.0625em) {
  .u-flex-2\@md {
    -webkit-flex: 2;
    -ms-flex: 2;
    flex: 2;
  }
}

@media all and (min-width: 48.0625em) {
  .u-flex-4\@md {
    -webkit-flex: 4;
    -ms-flex: 4;
    flex: 4;
  }
}

@media all and (min-width: 48.0625em) {
  .u-flex-3\@md {
    -webkit-flex: 3;
    -ms-flex: 3;
    flex: 3;
  }
}

@media all and (min-width: 48.0625em) {
  .u-flex-1-45\@md {
    -webkit-flex: 1 45%;
    -ms-flex: 1 45%;
    flex: 1 45%;
  }
}

@media all and (min-width: 48.0625em) {
  .u-flex-1-25\@md {
    -webkit-flex: 1 25%;
    -ms-flex: 1 25%;
    flex: 1 25%;
  }
}

@media all and (min-width: 48.0625em) {
  .u-flex-1-20\@md {
    -webkit-flex: 1 20%;
    -ms-flex: 1 20%;
    flex: 1 20%;
  }
}

.u-flex-direction-row-reverse {
  -webkit-flex-direction: row-reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}

@media all and (max-width: 29.9375em) {
  .u-flex-direction-row-reverse\@lt-sm {
    -webkit-flex-direction: row-reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
  }
}

@media all and (min-width: 30em) {
  .u-flex-direction-row-reverse\@sm {
    -webkit-flex-direction: row-reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
  }
}

@media all and (min-width: 48.0625em) {
  .u-flex-direction-row\@md {
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
  }
}

@media all and (min-width: 42.5em) {
  .u-flex-direction-row\@680 {
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
  }
}

@media all and (max-width: 48em) {
  .u-flex-direction-column-reverse\@lt-md {
    -webkit-flex-direction: column-reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
  }
}

@media all and (max-width: 48em) {
  .u-flex-direction-column\@lt-md {
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
  }
}

.u-flex-wrap-wrap {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

@media all and (max-width: 29.9375em) {
  .u-flex-wrap-wrap\@lt-sm {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}

@media all and (min-width: 30em) {
  .u-flex-wrap-wrap\@sm {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}

.u-float-right {
  float: right;
}

.u-float-left {
  float: left;
}

.u-clearfix::after {
  display: table;
  clear: both;
  content: '';
}

@media all and (max-width: 29.9375em) {
  .u-float-right\@lt-sm {
    float: right;
  }
}

@media all and (max-width: 29.9375em) {
  .u-float-left\@lt-sm {
    float: left;
  }
}

@media all and (max-width: 29.9375em) {
  .u-clearfix\@lt-sm::after {
    display: table;
    clear: both;
    content: '';
  }
}

@media all and (min-width: 30em) {
  .u-float-right\@sm {
    float: right;
  }
}

@media all and (min-width: 30em) {
  .u-float-left\@sm {
    float: left;
  }
}

@media all and (min-width: 30em) {
  .u-clearfix\@sm::after {
    display: table;
    clear: both;
    content: '';
  }
}

.u-font-family- {
  font-family: brandon-grotesque, Arial, sans-serif;
}

.u-font-family-display {
  font-family: brandon-grotesque, Arial, sans-serif;
}

@media all and (max-width: 29.9375em) {
  .u-font-family-\@lt-sm {
    font-family: brandon-grotesque, Arial, sans-serif;
  }
}

@media all and (max-width: 29.9375em) {
  .u-font-family-display\@lt-sm {
    font-family: brandon-grotesque, Arial, sans-serif;
  }
}

@media all and (min-width: 30em) {
  .u-font-family-\@sm {
    font-family: brandon-grotesque, Arial, sans-serif;
  }
}

@media all and (min-width: 30em) {
  .u-font-family-display\@sm {
    font-family: brandon-grotesque, Arial, sans-serif;
  }
}

.u-font-size-100\% {
  font-size: 100%;
}

.u-font-size-heading {
  font-size: 1.5rem;
}

@media all and (max-width: 29.9375em) {
  .u-font-size-100\%\@lt-sm {
    font-size: 100%;
  }
}

@media all and (max-width: 29.9375em) {
  .u-font-size-heading\@lt-sm {
    font-size: 1.5rem;
  }
}

@media all and (min-width: 30em) {
  .u-font-size-100\%\@sm {
    font-size: 100%;
  }
}

@media all and (min-width: 30em) {
  .u-font-size-heading\@sm {
    font-size: 1.5rem;
  }
}

.u-font-style-italic {
  font-style: italic;
}

@media all and (max-width: 29.9375em) {
  .u-font-style-italic\@lt-sm {
    font-style: italic;
  }
}

@media all and (min-width: 30em) {
  .u-font-style-italic\@sm {
    font-style: italic;
  }
}

.u-font-weight-400 {
  font-weight: 400;
}

.u-font-weight-bold {
  font-weight: bold;
}

@media all and (max-width: 29.9375em) {
  .u-font-weight-400\@lt-sm {
    font-weight: 400;
  }
}

@media all and (max-width: 29.9375em) {
  .u-font-weight-bold\@lt-sm {
    font-weight: bold;
  }
}

@media all and (min-width: 30em) {
  .u-font-weight-400\@sm {
    font-weight: 400;
  }
}

@media all and (min-width: 30em) {
  .u-font-weight-bold\@sm {
    font-weight: bold;
  }
}

.u-height-0 {
  height: 0;
}

.u-height-200 {
  height: 12.5rem;
}

.u-height-100\% {
  height: 100%;
}

.u-height-1\/1 {
  height: 100%;
}

.u-height-100vh {
  height: 100vh;
}

.u-height-50vh {
  height: 50vh;
}

.u-height-77vh {
  height: 77vh;
}

.u-height-86vh {
  height: 86vh;
}

@media all and (max-width: 29.9375em) {
  .u-height-100\%\@lt-sm {
    height: 100%;
  }
}

@media all and (max-width: 29.9375em) {
  .u-height-100vh\@lt-sm {
    height: 100vh;
  }
}

@media all and (max-width: 29.9375em) {
  .u-height-50vh\@lt-sm {
    height: 50vh;
  }
}

@media all and (min-width: 30em) {
  .u-height-100\%\@sm {
    height: 100%;
  }
}

@media all and (min-width: 30em) {
  .u-height-100vh\@sm {
    height: 100vh;
  }
}

@media all and (min-width: 30em) {
  .u-height-50vh\@sm {
    height: 50vh;
  }
}

.u-hover-dim:hover, .u-hover-dim:focus, .u-hover-dim:active {
  opacity: 0.6;
}

.u-hover-dim.is-active {
  opacity: 0.6;
}

@media all and (max-width: 29.9375em) {
  .u-hover-dim\@lt-sm:hover, .u-hover-dim\@lt-sm:focus, .u-hover-dim\@lt-sm:active {
    opacity: 0.6;
  }
  .u-hover-dim\@lt-sm.is-active {
    opacity: 0.6;
  }
}

@media all and (min-width: 30em) {
  .u-hover-dim\@sm:hover, .u-hover-dim\@sm:focus, .u-hover-dim\@sm:active {
    opacity: 0.6;
  }
  .u-hover-dim\@sm.is-active {
    opacity: 0.6;
  }
}

.u-justify-content-center {
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.u-justify-content-space-between {
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.u-justify-content-space-around {
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
}

.u-justify-content-flex-end {
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

@media all and (max-width: 29.9375em) {
  .u-justify-content-center\@lt-sm {
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
}

@media all and (max-width: 29.9375em) {
  .u-justify-content-space-between\@lt-sm {
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

@media all and (min-width: 30em) {
  .u-justify-content-center\@sm {
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
}

@media all and (min-width: 30em) {
  .u-justify-content-space-between\@sm {
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

@media all and (min-width: 48.0625em) {
  .u-justify-content-space-between\@md {
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

.u-line-height-0\.8 {
  line-height: 0.8;
}

.u-line-height-0\.9 {
  line-height: 0.9;
}

.u-line-height-1 {
  line-height: 1;
}

.u-line-height-1\.2 {
  line-height: 1.2;
}

.u-line-height-1\.08 {
  line-height: 1.08;
}

@media all and (max-width: 29.9375em) {
  .u-line-height-0\.8\@lt-sm {
    line-height: 0.8;
  }
}

@media all and (min-width: 30em) {
  .u-line-height-0\.8\@sm {
    line-height: 0.8;
  }
}

.u-margin-horizontal-auto {
  margin-right: auto;
  margin-left: auto;
}

.u-margin-top-xxl {
  margin-top: 10.625em;
}

.u-margin-top-xl {
  margin-top: 5em;
}

.u-margin-top-lg {
  margin-top: 4em;
}

.u-margin-top {
  margin-top: 3rem;
}

.u-margin-top-sm {
  margin-top: 1.875em;
}

.u-margin-top-md {
  margin-top: 3em;
}

.u-margin-top-xs {
  margin-top: 1.25em;
}

.u-margin-top-xxs {
  margin-top: 0.625em;
}

.u-margin-top-0 {
  margin-top: 0;
}

.u-margin-left-xxs {
  margin-left: 0.625em;
}

.u-margin-right-xxs {
  margin-right: 0.625em;
}

.u-margin-right-xs {
  margin-right: 1.25em;
}

.u-margin-left-0 {
  margin-left: 0;
}

.u-margin-left-xs {
  margin-left: 1.25em;
}

.u-margin-left-sm {
  margin-left: 1.875em;
}

.u-margin-left-lg {
  margin-left: 4em;
}

.u-margin-left-150 {
  margin-left: 150px;
}

.u-margin-left-xl {
  margin-left: 5em;
}

.u-margin-bottom-0 {
  margin-bottom: 0;
}

.u-margin-bottom-xxs {
  margin-bottom: 0.625em;
}

.u-margin-bottom-xs {
  margin-bottom: 1.25em;
}

.u-margin-bottom-sm {
  margin-bottom: 1.875em;
}

.u-margin-bottom-md {
  margin-bottom: 3em;
}

.u-margin-bottom-lg {
  margin-bottom: 4em;
}

.u-margin-bottom-xl {
  margin-bottom: 5em;
}

.u-margin-bottom-xxl {
  margin-bottom: 10.625em;
}

.u-margin-bottom-28 {
  margin-bottom: 1.75em;
}

.u-margin-bottom-34 {
  margin-bottom: 2.125em;
}

.u-margin-vertical-xxs {
  margin-top: 0.625em;
  margin-bottom: 0.625em;
}

.u-margin-vertical-xs {
  margin-top: 1.25em;
  margin-bottom: 1.25em;
}

.u-margin-vertical-sm {
  margin-top: 1.875em;
  margin-bottom: 1.875em;
}

.u-margin-vertical-md {
  margin-top: 3em;
  margin-bottom: 3em;
}

.u-margin-vertical-lg {
  margin-top: 4em;
  margin-bottom: 4em;
}

.u-margin-vertical-xl {
  margin-top: 5em;
  margin-bottom: 5em;
}

@media all and (max-width: 29.9375em) {
  .u-margin-horizontal-auto\@lt-sm {
    margin-right: auto;
    margin-left: auto;
  }
}

@media all and (max-width: 29.9375em) {
  .u-margin-md\@lt-sm {
    margin: 3em;
  }
}

@media all and (max-width: 48em) {
  .u-margin-top-0\@lt-md {
    margin-top: 0;
  }
}

@media all and (min-width: 30em) {
  .u-margin-horizontal-auto\@sm {
    margin-right: auto;
    margin-left: auto;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-left-xs\@md {
    margin-left: 1.25em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-right-xxs\@md {
    margin-right: 0.625em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-top-xl\@md {
    margin-top: 5em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-top-xxl\@md {
    margin-top: 10.625em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-top-lg\@md {
    margin-top: 4em;
  }
}

@media all and (min-width: 93.75em) {
  .u-margin-top-lg\@1500 {
    margin-top: 4em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-top-md\@md {
    margin-top: 3em;
  }
}

@media all and (min-width: 30em) {
  .u-margin-top-sm\@sm {
    margin-top: 1.875em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-top-sm\@md {
    margin-top: 1.875em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-left-sm\@md {
    margin-left: 1.875em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-left-md\@md {
    margin-left: 3em;
  }
}

@media all and (min-width: 61.25em) {
  .u-margin-left-md\@lg {
    margin-left: 3em;
  }
}

@media all and (min-width: 42.5em) {
  .u-margin-left-lg\@680 {
    margin-left: 5em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-left-md\@md {
    margin-left: 5em;
  }
}

@media all and (min-width: 61.25em) {
  .u-margin-left-xl\@lg {
    margin-left: 5em;
  }
}

@media all and (min-width: 61.25em) {
  .u-margin-left-150\@lg {
    margin-left: 150px;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-top-xs\@md {
    margin-top: 1.25em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-top-xxs\@md {
    margin-top: 0.625em;
  }
}

@media all and (min-width: 61.25em) {
  .u-margin-top-sm\@lg {
    margin-top: 1.875em;
  }
}

@media all and (min-width: 61.25em) {
  .u-margin-top-md\@lg {
    margin-top: 3em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-bottom-md\@md {
    margin-bottom: 3em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-bottom-lg\@md {
    margin-bottom: 4em;
  }
}

@media all and (min-width: 61.25em) {
  .u-margin-bottom-lg\@lg {
    margin-bottom: 4em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-bottom-xl\@md {
    margin-bottom: 5em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-bottom-xxs\@md {
    margin-bottom: 0.625em;
  }
}

@media all and (min-width: 54.375em) {
  .u-margin-bottom-xxs\@870 {
    margin-bottom: 1.875em;
  }
}

@media all and (min-width: 75em) {
  .u-margin-bottom-xxs\@xl {
    margin-bottom: 0.625em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-bottom-xs\@md {
    margin-bottom: 1.25em;
  }
}

@media all and (min-width: 61.25em) {
  .u-margin-bottom-sm\@lg {
    margin-bottom: 1.875em;
  }
}

@media all and (min-width: 54.375em) {
  .u-margin-bottom-sm\@870 {
    margin-bottom: 1.875em;
  }
}

@media all and (min-width: 56.25em) {
  .u-margin-bottom-sm\@900 {
    margin-bottom: 1.875em;
  }
}

@media all and (min-width: 61.25em) {
  .u-margin-bottom-sm\@lg {
    margin-bottom: 1.875em;
  }
}

@media all and (min-width: 75em) {
  .u-margin-bottom-sm\@xl {
    margin-bottom: 1.875em;
  }
}

@media all and (min-width: 81.25em) {
  .u-margin-bottom-sm\@1300 {
    margin-bottom: 1.875em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-bottom-28\@md {
    margin-bottom: 1.75em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-bottom-34\@md {
    margin-bottom: 2.125em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-vertical-md\@md {
    margin-top: 3em;
    margin-bottom: 3em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-margin-vertical-lg\@md {
    margin-top: 4em;
    margin-bottom: 4em;
  }
}

.u-max-height-100 {
  max-height: 6.25rem;
}

.u-max-height-125 {
  max-height: 125px;
}

@media all and (max-width: 29.9375em) {
  .u-max-height-100\@lt-sm {
    max-height: 6.25rem;
  }
}

@media all and (min-width: 30em) {
  .u-max-height-100\@sm {
    max-height: 6.25rem;
  }
}

.u-max-width-100 {
  max-width: 6.25rem;
}

.u-max-width-640 {
  max-width: 40rem;
}

.u-max-width-400 {
  max-width: 25rem;
}

.u-max-width-325 {
  max-width: 325px;
}

.u-max-width-250 {
  max-width: 250px;
}

.u-max-width-70 {
  max-width: 70px;
}

.u-max-width-100px {
  max-width: 100px;
}

.u-max-width-1\/1 {
  max-width: 100%;
}

.u-max-width-900 {
  max-width: 900px;
}

.u-max-width-1100 {
  max-width: 1100px;
}

.u-max-width-75\% {
  max-width: 75%;
}

.u-max-width-200 {
  max-width: 200px;
}

@media all and (max-width: 29.9375em) {
  .u-max-width-100\@lt-sm {
    max-width: 6.25rem;
  }
}

@media all and (max-width: 29.9375em) {
  .u-max-width-640\@lt-sm {
    max-width: 40rem;
  }
}

@media all and (min-width: 30em) {
  .u-max-width-100\@sm {
    max-width: 6.25rem;
  }
}

@media all and (min-width: 30em) {
  .u-max-width-640\@sm {
    max-width: 40rem;
  }
}

@media all and (min-width: 48.0625em) {
  .u-max-width-340\@md {
    max-width: 340px;
  }
}

@media all and (min-width: 48.0625em) {
  .u-max-width-510\@md {
    max-width: 510px;
  }
}

@media all and (min-width: 48.0625em) {
  .u-max-width-530\@md {
    max-width: 530px;
  }
}

@media all and (min-width: 61.25em) {
  .u-max-width-575\@lg {
    max-width: 575px;
  }
}

@media all and (min-width: 48.0625em) {
  .u-max-width-75\%\@md {
    max-width: 75%;
  }
}

@media all and (min-width: 48.0625em) {
  .u-max-width-55\%\@md {
    max-width: 55%;
  }
}

@media all and (min-width: 48.0625em) {
  .u-max-width-80\%\@md {
    max-width: 80%;
  }
}

.u-min-height-200 {
  min-height: 12.5rem;
}

.u-min-height-80vh {
  min-height: 80vh;
}

.u-min-height-770 {
  min-height: 770px;
}

.u-min-height-40vh {
  min-height: 40vh;
}

.u-min-height-90vh {
  min-height: 90vh;
}

@media all and (max-width: 29.9375em) {
  .u-min-height-200\@lt-sm {
    min-height: 12.5rem;
  }
}

@media all and (min-width: 30em) {
  .u-min-height-200\@sm {
    min-height: 12.5rem;
  }
}

@media all and (max-width: 29.9375em) {
  .u-min-height-90vh\@lt-sm {
    min-height: 90vh;
  }
}

.u-min-width-200 {
  min-width: 12.5rem;
}

.u-min-width-125 {
  min-width: 125px;
}

@media all and (max-width: 29.9375em) {
  .u-min-width-200\@lt-sm {
    min-width: 12.5rem;
  }
}

@media all and (min-width: 30em) {
  .u-min-width-200\@sm {
    min-width: 12.5rem;
  }
}

.u-object-fit-cover {
  object-fit: cover;
  font-family: "object-fit: cover;";
}

.u-object-fit-cover-100\% {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
  font-family: "object-fit: cover;";
}

@media all and (max-width: 29.9375em) {
  .u-object-fit-cover\@lt-sm {
    object-fit: cover;
    font-family: "object-fit: cover;";
  }
}

@media all and (max-width: 29.9375em) {
  .u-object-fit-cover-100\%\@lt-sm {
    width: 100%;
    height: 100%;
    object-fit: cover;
    font-family: "object-fit: cover;";
  }
}

@media all and (min-width: 30em) {
  .u-object-fit-cover\@sm {
    object-fit: cover;
    font-family: "object-fit: cover;";
  }
}

@media all and (min-width: 30em) {
  .u-object-fit-cover-100\%\@sm {
    width: 100%;
    height: 100%;
    object-fit: cover;
    font-family: "object-fit: cover;";
  }
}

.u-opacity-0 {
  opacity: 0;
}

.u-opacity-10 {
  opacity: 0.1;
}

.u-opacity-20 {
  opacity: 0.2;
}

.u-opacity-30 {
  opacity: 0.3;
}

.u-opacity-40 {
  opacity: 0.4;
}

.u-opacity-50 {
  opacity: 0.5;
}

.u-opacity-60 {
  opacity: 0.6;
}

.u-opacity-70 {
  opacity: 0.7;
}

.u-opacity-80 {
  opacity: 0.8;
}

.u-opacity-90 {
  opacity: 0.9;
}

.u-opacity-100 {
  opacity: 1;
}

@media all and (max-width: 29.9375em) {
  .u-opacity-60\@lt-sm {
    opacity: 0.6;
  }
}

@media all and (min-width: 30em) {
  .u-opacity-60\@sm {
    opacity: 0.6;
  }
}

.u-order-1 {
  -webkit-order: 1;
  -ms-flex-order: 1;
  order: 1;
}

.u-order-2 {
  -webkit-order: 2;
  -ms-flex-order: 2;
  order: 2;
}

.u-order-3 {
  -webkit-order: 3;
  -ms-flex-order: 3;
  order: 3;
}

.u-order-4 {
  -webkit-order: 4;
  -ms-flex-order: 4;
  order: 4;
}

.u-order-5 {
  -webkit-order: 5;
  -ms-flex-order: 5;
  order: 5;
}

.u-order-6 {
  -webkit-order: 6;
  -ms-flex-order: 6;
  order: 6;
}

.u-order-7 {
  -webkit-order: 7;
  -ms-flex-order: 7;
  order: 7;
}

.u-order-8 {
  -webkit-order: 8;
  -ms-flex-order: 8;
  order: 8;
}

.u-order-9 {
  -webkit-order: 9;
  -ms-flex-order: 9;
  order: 9;
}

.u-order-10 {
  -webkit-order: 10;
  -ms-flex-order: 10;
  order: 10;
}

@media all and (max-width: 29.9375em) {
  .u-order-1\@lt-sm {
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
  }
}

@media all and (max-width: 29.9375em) {
  .u-order-2\@lt-sm {
    -webkit-order: 2;
    -ms-flex-order: 2;
    order: 2;
  }
}

@media all and (max-width: 29.9375em) {
  .u-order-3\@lt-sm {
    -webkit-order: 3;
    -ms-flex-order: 3;
    order: 3;
  }
}

@media all and (max-width: 29.9375em) {
  .u-order-4\@lt-sm {
    -webkit-order: 4;
    -ms-flex-order: 4;
    order: 4;
  }
}

@media all and (max-width: 29.9375em) {
  .u-order-5\@lt-sm {
    -webkit-order: 5;
    -ms-flex-order: 5;
    order: 5;
  }
}

@media all and (max-width: 29.9375em) {
  .u-order-6\@lt-sm {
    -webkit-order: 6;
    -ms-flex-order: 6;
    order: 6;
  }
}

@media all and (max-width: 29.9375em) {
  .u-order-7\@lt-sm {
    -webkit-order: 7;
    -ms-flex-order: 7;
    order: 7;
  }
}

@media all and (max-width: 29.9375em) {
  .u-order-8\@lt-sm {
    -webkit-order: 8;
    -ms-flex-order: 8;
    order: 8;
  }
}

@media all and (max-width: 29.9375em) {
  .u-order-9\@lt-sm {
    -webkit-order: 9;
    -ms-flex-order: 9;
    order: 9;
  }
}

@media all and (max-width: 29.9375em) {
  .u-order-10\@lt-sm {
    -webkit-order: 10;
    -ms-flex-order: 10;
    order: 10;
  }
}

@media all and (min-width: 30em) {
  .u-order-1\@sm {
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
  }
}

@media all and (min-width: 30em) {
  .u-order-2\@sm {
    -webkit-order: 2;
    -ms-flex-order: 2;
    order: 2;
  }
}

@media all and (min-width: 30em) {
  .u-order-3\@sm {
    -webkit-order: 3;
    -ms-flex-order: 3;
    order: 3;
  }
}

@media all and (min-width: 30em) {
  .u-order-4\@sm {
    -webkit-order: 4;
    -ms-flex-order: 4;
    order: 4;
  }
}

@media all and (min-width: 30em) {
  .u-order-5\@sm {
    -webkit-order: 5;
    -ms-flex-order: 5;
    order: 5;
  }
}

@media all and (min-width: 30em) {
  .u-order-6\@sm {
    -webkit-order: 6;
    -ms-flex-order: 6;
    order: 6;
  }
}

@media all and (min-width: 30em) {
  .u-order-7\@sm {
    -webkit-order: 7;
    -ms-flex-order: 7;
    order: 7;
  }
}

@media all and (min-width: 30em) {
  .u-order-8\@sm {
    -webkit-order: 8;
    -ms-flex-order: 8;
    order: 8;
  }
}

@media all and (min-width: 30em) {
  .u-order-9\@sm {
    -webkit-order: 9;
    -ms-flex-order: 9;
    order: 9;
  }
}

@media all and (min-width: 30em) {
  .u-order-10\@sm {
    -webkit-order: 10;
    -ms-flex-order: 10;
    order: 10;
  }
}

.u-overflow-hidden {
  overflow: hidden;
}

.u-overflow-scroll {
  overflow: scroll;
}

@media all and (max-width: 29.9375em) {
  .u-overflow-hidden\@lt-sm {
    overflow: hidden;
  }
}

@media all and (max-width: 29.9375em) {
  .u-overflow-scroll\@lt-sm {
    overflow: scroll;
  }
}

@media all and (min-width: 30em) {
  .u-overflow-hidden\@sm {
    overflow: hidden;
  }
}

@media all and (min-width: 30em) {
  .u-overflow-scroll\@sm {
    overflow: scroll;
  }
}

.u-padding-horizontal-xxs {
  padding-right: 0.625em;
  padding-left: 0.625em;
}

.u-padding-horizontal-xs {
  padding-right: 1.25em;
  padding-left: 1.25em;
}

.u-padding-horizontal-sm {
  padding-right: 1.875em;
  padding-left: 1.875em;
}

.u-padding-horizontal-md {
  padding-right: 3em;
  padding-left: 3em;
}

.u-padding-horizontal-lg {
  padding-right: 4em;
  padding-left: 4em;
}

.u-padding-horizontal-xl {
  padding-right: 5em;
  padding-left: 5em;
}

.u-padding-horizontal-xxl {
  padding-right: 10.625em;
  padding-left: 10.625em;
}

.u-padding-vertical-xxs {
  padding-top: 0.625em;
  padding-bottom: 0.625em;
}

.u-padding-vertical-xs {
  padding-top: 1.25em;
  padding-bottom: 1.25em;
}

.u-padding-vertical-sm {
  padding-top: 1.875em;
  padding-bottom: 1.875em;
}

.u-padding-vertical-md {
  padding-top: 3em;
  padding-bottom: 3em;
}

.u-padding-vertical-lg {
  padding-top: 4em;
  padding-bottom: 4em;
}

.u-padding-vertical-xl {
  padding-top: 5em;
  padding-bottom: 5em;
}

.u-padding-vertical-9 {
  padding-top: 9em;
  padding-bottom: 9em;
}

.u-padding-vertical-8 {
  padding-top: 8em;
  padding-bottom: 8em;
}

.u-padding-right-sm {
  padding-right: 1.875em;
}

.u-padding-right-xs {
  padding-right: 1.25em;
}

.u-padding-right-xxs {
  padding-right: 0.625em;
}

.u-padding-right-md {
  padding-right: 3em;
}

.u-padding-right-lg {
  padding-right: 4em;
}

.u-padding-right-xl {
  padding-right: 5em;
}

.u-padding-right-xxl {
  padding-right: 10.625em;
}

.u-padding-left-md {
  padding-left: 3em;
}

.u-padding-left-sm {
  padding-left: 1.875em;
}

.u-padding-left-xs {
  padding-left: 1.25em;
}

.u-padding-top-xxs {
  padding-top: 0.625em;
}

.u-padding-top-xs {
  padding-top: 1.25em;
}

.u-padding-top-sm {
  padding-top: 1.875em;
}

.u-padding-top-md {
  padding-top: 3em;
}

.u-padding-top-lg {
  padding-top: 4em;
}

.u-padding-bottom-xxs {
  padding-bottom: 0.625em;
}

.u-padding-bottom-xs {
  padding-bottom: 1.25em;
}

.u-padding-bottom-sm {
  padding-bottom: 1.875em;
}

.u-padding-bottom-md {
  padding-bottom: 3em;
}

.u-padding-bottom-xl {
  padding-bottom: 5em;
}

.u-padding-bottom-xxl {
  padding-bottom: 10.625em;
}

.u-padding-sm {
  padding: 1.875em;
}

.u-padding-xs {
  padding: 1.25em;
}

@media all and (max-width: 29.9375em) {
  .u-padding-horizontal-sm\@lt-sm {
    padding-right: 1.875em;
    padding-left: 1.875em;
  }
}

@media all and (max-width: 29.9375em) {
  .u-padding-right-sm\@lt-sm {
    padding-right: 1.875em;
  }
}

@media all and (max-width: 29.9375em) {
  .u-padding-sm\@lt-sm {
    padding: 1.875em;
  }
}

@media all and (max-width: 29.9375em) {
  .u-padding-md\@lt-sm {
    padding: 3em;
  }
}

@media all and (max-width: 48em) {
  .u-padding-bottom-xxs\@lt-md {
    padding-bottom: 0.625em;
  }
}

@media all and (max-width: 48em) {
  .u-padding-bottom-sm\@lt-md {
    padding-bottom: 1.875em;
  }
}

@media all and (min-width: 75em) {
  .u-padding-bottom-xxs\@xl {
    padding-bottom: 0.625em;
  }
}

@media all and (min-width: 30em) {
  .u-padding-horizontal-sm\@sm {
    padding-right: 1.875em;
    padding-left: 1.875em;
  }
}

@media all and (min-width: 30em) {
  .u-padding-right-sm\@sm {
    padding-right: 1.875em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-padding-horizontal-sm\@md {
    padding-right: 1.875em;
    padding-left: 1.875em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-padding-horizontal-md\@md {
    padding-right: 3em;
    padding-left: 3em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-padding-horizontal-lg\@md {
    padding-right: 4em;
    padding-left: 4em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-padding-horizontal-xl\@md {
    padding-right: 5em;
    padding-left: 5em;
  }
}

@media all and (min-width: 75em) {
  .u-padding-horizontal-xl\@xl {
    padding-right: 5em;
    padding-left: 5em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-padding-left-xs\@md {
    padding-left: 1.25em;
  }
}

@media all and (min-width: 65em) {
  .u-padding-left-xs\@1040 {
    padding-left: 1.25em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-padding-right-md\@md {
    padding-right: 3em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-padding-right-xl\@md {
    padding-right: 5em;
  }
}

@media all and (max-width: 48em) {
  .u-padding-top-0\@lt-md {
    padding-top: 1.875em;
  }
}

@media all and (max-width: 29.9375em) {
  .u-padding-top-sm\@lt-sm {
    padding-top: 1.875em;
  }
}

@media all and (max-width: 74.9375em) {
  .u-padding-vertical-xs\@lt-xl {
    padding-top: 1.25em;
    padding-bottom: 1.25em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-padding-vertical-xl\@md {
    padding-top: 5em;
    padding-bottom: 5em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-padding-vertical-lg\@md {
    padding-top: 4em;
    padding-bottom: 4em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-padding-vertical-md\@md {
    padding-top: 3em;
    padding-bottom: 3em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-padding-vertical-9\@md {
    padding-top: 9.65em;
    padding-bottom: 9.65em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-padding-vertical-7\@md {
    padding-top: 7em;
    padding-bottom: 7em;
  }
}

@media all and (min-width: 48.0625em) {
  .u-padding-bottom-xxl\@md {
    padding-bottom: 10.625em;
  }
}

.u-pointer-events-none {
  pointer-events: none;
}

.u-pointer-events-auto {
  pointer-events: auto;
}

@media all and (max-width: 29.9375em) {
  .u-pointer-events-none\@lt-sm {
    pointer-events: none;
  }
}

@media all and (max-width: 29.9375em) {
  .u-pointer-events-auto\@lt-sm {
    pointer-events: auto;
  }
}

@media all and (min-width: 30em) {
  .u-pointer-events-none\@sm {
    pointer-events: none;
  }
}

@media all and (min-width: 30em) {
  .u-pointer-events-auto\@sm {
    pointer-events: auto;
  }
}

.u-position-relative {
  position: relative;
}

.u-position-absolute {
  position: absolute;
}

.u-position-center {
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
}

.u-position-cover {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
}

.u-position-top-right {
  top: 0;
  right: 0;
  position: absolute;
}

.u-position-top-left {
  top: 0;
  left: 0;
  position: absolute;
}

.u-position-bottom-center {
  bottom: 0;
  left: 50%;
  -webkit-transform: translate3d(-50%, 0, 0);
  transform: translate3d(-50%, 0, 0);
  position: absolute;
}

.u-position-1\/2 {
  left: 50%;
  position: absolute;
}

@media all and (max-width: 29.9375em) {
  .u-position-relative\@lt-sm {
    position: relative;
  }
}

@media all and (max-width: 29.9375em) {
  .u-position-absolute\@lt-sm {
    position: absolute;
  }
}

@media all and (min-width: 48.0625em) {
  .u-position-absolute\@md {
    position: absolute;
  }
}

@media all and (min-width: 56.25em) {
  .u-position-absolute\@900 {
    position: absolute;
  }
}

@media all and (max-width: 29.9375em) {
  .u-position-center\@lt-sm {
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    position: absolute;
  }
}

@media all and (min-width: 30em) {
  .u-position-relative\@sm {
    position: relative;
  }
}

@media all and (min-width: 30em) {
  .u-position-absolute\@sm {
    position: absolute;
  }
}

@media all and (min-width: 30em) {
  .u-position-center\@sm {
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    position: absolute;
  }
}

.u-position-bottom-center {
  bottom: 0;
  left: 50%;
  -webkit-transform: translate(-50%, 100%);
  transform: translate(-50%, 100%);
  position: absolute;
}

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

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

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

@media all and (max-width: 29.9375em) {
  .u-text-align-center\@lt-sm {
    text-align: center;
  }
}

@media all and (max-width: 29.9375em) {
  .u-text-align-right\@lt-sm {
    text-align: right;
  }
}

@media all and (max-width: 29.9375em) {
  .u-text-align-left\@lt-sm {
    text-align: left;
  }
}

@media all and (min-width: 30em) {
  .u-text-align-center\@sm {
    text-align: center;
  }
}

@media all and (min-width: 30em) {
  .u-text-align-right\@sm {
    text-align: right;
  }
}

@media all and (min-width: 30em) {
  .u-text-align-left\@sm {
    text-align: left;
  }
}

.u-text-overflow-ellipsis {
  text-overflow: ellipsis;
}

@media all and (max-width: 29.9375em) {
  .u-text-overflow-ellipsis\@lt-sm {
    text-overflow: ellipsis;
  }
}

@media all and (min-width: 30em) {
  .u-text-overflow-ellipsis\@sm {
    text-overflow: ellipsis;
  }
}

.u-text-transform-uppercase {
  text-transform: uppercase;
}

.u-text-transform-none {
  text-transform: none;
}

@media all and (max-width: 29.9375em) {
  .u-text-transform-uppercase\@lt-sm {
    text-transform: uppercase;
  }
}

@media all and (min-width: 30em) {
  .u-text-transform-uppercase\@sm {
    text-transform: uppercase;
  }
}

.u-transform-rotate-90 {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

.u-transform-center {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

@media all and (max-width: 29.9375em) {
  .u-transform-rotate-90\@lt-sm {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
  }
}

@media all and (max-width: 29.9375em) {
  .u-transform-center\@lt-sm {
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
}

@media all and (min-width: 30em) {
  .u-transform-rotate-90\@sm {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
  }
}

@media all and (min-width: 30em) {
  .u-transform-center\@sm {
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
}

.u-user-select-none {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.u-user-select-auto {
  -webkit-user-select: auto;
  -moz-user-select: auto;
  -ms-user-select: auto;
  user-select: auto;
}

@media all and (max-width: 29.9375em) {
  .u-user-select-none\@lt-sm {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }
}

@media all and (max-width: 29.9375em) {
  .u-user-select-auto\@lt-sm {
    -webkit-user-select: auto;
    -moz-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
  }
}

@media all and (min-width: 30em) {
  .u-user-select-none\@sm {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }
}

@media all and (min-width: 30em) {
  .u-user-select-auto\@sm {
    -webkit-user-select: auto;
    -moz-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
  }
}

.u-vertical-align-middle {
  vertical-align: middle;
}

.u-vertical-align-baseline {
  vertical-align: baseline;
}

@media all and (max-width: 29.9375em) {
  .u-vertical-align-middle\@lt-sm {
    vertical-align: middle;
  }
}

@media all and (max-width: 29.9375em) {
  .u-vertical-align-baseline\@lt-sm {
    vertical-align: baseline;
  }
}

@media all and (min-width: 30em) {
  .u-vertical-align-middle\@sm {
    vertical-align: middle;
  }
}

@media all and (min-width: 30em) {
  .u-vertical-align-baseline\@sm {
    vertical-align: baseline;
  }
}

.u-white-space-nowrap {
  white-space: nowrap;
}

@media all and (max-width: 29.9375em) {
  .u-white-space-nowrap\@lt-sm {
    white-space: nowrap;
  }
}

@media all and (min-width: 30em) {
  .u-white-space-nowrap\@sm {
    white-space: nowrap;
  }
}

.u-width-100 {
  width: 6.25rem;
}

.u-width-1\/1 {
  width: 100%;
}

.u-width-1\/2 {
  width: 50%;
}

.u-width-2\/5 {
  width: 40%;
}

.u-width-2\/3 {
  width: 66.6666666667%;
}

.u-width-3\/4 {
  width: 75%;
}

.u-width-4\/5 {
  width: 80%;
}

.u-width-5\/6 {
  width: 83.3333333333%;
}

.u-width-1\/3 {
  width: 33.3333333333%;
}

.u-width-1\/4 {
  width: 25%;
}

.u-width-9\/10 {
  width: 90%;
}

@media all and (max-width: 48em) {
  .u-width-1\/1\@lt-md {
    width: 100%;
  }
}

@media all and (max-width: 48em) {
  .u-width-1\/2\@lt-md {
    width: 50%;
  }
}

@media all and (max-width: 48em) {
  .u-width-1\/3\@lt-md {
    width: 33.3333333333%;
  }
}

@media all and (max-width: 29.9375em) {
  .u-width-1\/1\@lt-sm {
    width: 100%;
  }
}

@media all and (max-width: 29.9375em) {
  .u-width-1\/2\@lt-sm {
    width: 50%;
  }
}

@media all and (max-width: 29.9375em) {
  .u-width-1\/3\@lt-sm {
    width: 33.3333333333%;
  }
}

@media all and (min-width: 30em) {
  .u-width-1\/1\@sm {
    width: 100%;
  }
}

@media all and (min-width: 30em) {
  .u-width-1\/2\@sm {
    width: 50%;
  }
}

@media all and (min-width: 30em) {
  .u-width-1\/3\@sm {
    width: 33.3333333333%;
  }
}

@media all and (min-width: 48.0625em) {
  .u-width-1\/1\@md {
    width: 100%;
  }
}

@media all and (min-width: 48.0625em) {
  .u-width-1\/2\@md {
    width: 50%;
  }
}

@media all and (min-width: 48.0625em) {
  .u-width-3\/5\@md {
    width: 60%;
  }
}

@media all and (min-width: 48.0625em) {
  .u-width-1\/3\@md {
    width: 33.3333333333%;
  }
}

@media all and (min-width: 48.0625em) {
  .u-width-1\/4\@md {
    width: 25%;
  }
}

@media all and (min-width: 48.0625em) {
  .u-width-2\/3\@md {
    width: 66.6666666667%;
  }
}

@media all and (min-width: 48.0625em) {
  .u-width-3\/4\@md {
    width: 75%;
  }
}

@media all and (min-width: 48.0625em) {
  .u-width-5\/6\@md {
    width: 83.3333333333%;
  }
}

@media all and (min-width: 48.0625em) {
  .u-width-8\/10\@md {
    width: 80%;
  }
}

@media all and (min-width: 48.0625em) {
  .u-width-9\/10\@md {
    width: 90%;
  }
}

@media all and (min-width: 38.75em) {
  .u-width-1\/5\@620 {
    width: 20%;
  }
}

@media all and (min-width: 42.5em) {
  .u-width-2\/4\@680 {
    width: 50%;
  }
}

@media all and (min-width: 61.25em) {
  .u-width-2\/3\@lg {
    width: 66.6666666667%;
  }
}

@media all and (min-width: 61.25em) {
  .u-width-3\/4\@lg {
    width: 75%;
  }
}

@media all and (min-width: 93.75em) {
  .u-width-3\/4\@1500 {
    width: 75%;
  }
}

@media all and (min-width: 93.75em) {
  .u-width-4\/5\@1500 {
    width: 80%;
  }
}

@media all and (min-width: 56.25em) {
  .u-width-1\/2\@900 {
    width: 50%;
  }
}

@media all and (min-width: 56.25em) {
  .u-width-3\/4\@900 {
    width: 75%;
  }
}

@media all and (min-width: 75em) {
  .u-width-1\/2\@xl {
    width: 50%;
  }
}

.navbar-default .navbar-nav > li.menu-item > a {
  font-size: 12.9px;
  margin-left: 10px;
  margin-right: 10px;
}

@media all and (min-width: 87.5em) {
  .navbar-default .navbar-nav > li.menu-item > a {
    font-size: 12.9058333333px;
  }
}

@media all and (min-width: 100em) {
  .navbar-default .navbar-nav > li.menu-item > a {
    font-size: 14.6766666667px;
  }
}

@media all and (min-width: 112.5em) {
  .navbar-default .navbar-nav > li.menu-item > a {
    font-size: 16.4475px;
  }
}

@media screen and (min-width: 1920px) {
  .navbar-default .navbar-nav > li.menu-item > a {
    font-size: 17px;
  }
}

@media all and (min-width: 42.5em) {
  .navbar-default .navbar-nav > li.menu-item > a {
    margin-left: 10.625px;
    margin-right: 10.625px;
  }
}

@media all and (min-width: 48.0625em) {
  .navbar-default .navbar-nav > li.menu-item > a {
    margin-left: 12.015625px;
    margin-right: 12.015625px;
  }
}

@media all and (min-width: 61.25em) {
  .navbar-default .navbar-nav > li.menu-item > a {
    margin-left: 15.3125px;
    margin-right: 15.3125px;
  }
}

@media all and (min-width: 75em) {
  .navbar-default .navbar-nav > li.menu-item > a {
    margin-left: 18.75px;
    margin-right: 18.75px;
  }
}

@media all and (min-width: 87.5em) {
  .navbar-default .navbar-nav > li.menu-item > a {
    margin-left: 21.875px;
    margin-right: 21.875px;
  }
}

@media all and (min-width: 100em) {
  .navbar-default .navbar-nav > li.menu-item > a {
    margin-left: 25px;
    margin-right: 25px;
  }
}

@media all and (min-width: 112.5em) {
  .navbar-default .navbar-nav > li.menu-item > a {
    margin-left: 28.125px;
    margin-right: 28.125px;
  }
}

@media all and (min-width: 120em) {
  .navbar-default .navbar-nav > li.menu-item > a {
    margin-left: 30px;
    margin-right: 30px;
  }
}

.navbar-brand {
  padding: 0 !important;
  width: 100px;
}

@media all and (min-width: 61.25em) {
  .navbar-brand {
    width: 111.270833333px;
  }
}

@media all and (min-width: 75em) {
  .navbar-brand {
    width: 136.25px;
  }
}

@media all and (min-width: 87.5em) {
  .navbar-brand {
    width: 158.958333333px;
  }
}

@media all and (min-width: 100em) {
  .navbar-brand {
    width: 181.666666667px;
  }
}

@media all and (min-width: 112.5em) {
  .navbar-brand {
    width: 204.375px;
  }
}

@media all and (min-width: 120em) {
  .navbar-brand {
    width: 218px;
  }
}

#menu-top-nav.navbar-right {
  margin: 0;
}

.navbar-default .navbar-nav > li.menu-item:last-child a {
  margin-right: 0px;
}

.heading.navbar.navbar-default {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
  z-index: 999999;
}

.heading.navbar.navbar-default.collapsing {
  position: absolute;
}

@media all and (min-width: 61.25em) {
  .heading.navbar.navbar-default {
    padding-top: 26px;
    padding-right: 34px;
    padding-bottom: 26px;
    padding-left: 34px;
  }
}

@media all and (min-width: 61.25em) and (min-width: 61.25em) {
  .heading.navbar.navbar-default {
    padding-right: 34.7083333333px;
  }
}

@media all and (min-width: 61.25em) and (min-width: 75em) {
  .heading.navbar.navbar-default {
    padding-right: 42.5px;
    padding-left: 38.75px;
  }
}

@media all and (min-width: 61.25em) and (min-width: 87.5em) {
  .heading.navbar.navbar-default {
    padding-top: 26.25px;
    padding-right: 49.5833333333px;
    padding-left: 45.2083333333px;
  }
}

@media all and (min-width: 61.25em) and (min-width: 100em) {
  .heading.navbar.navbar-default {
    padding-top: 30px;
    padding-right: 56.6666666667px;
    padding-bottom: 26.6666666667px;
    padding-left: 51.6666666667px;
  }
}

@media all and (min-width: 61.25em) and (min-width: 112.5em) {
  .heading.navbar.navbar-default {
    padding-top: 33.75px;
    padding-right: 63.75px;
    padding-bottom: 30px;
    padding-left: 58.125px;
  }
}

@media all and (min-width: 61.25em) and (min-width: 120em) {
  .heading.navbar.navbar-default {
    padding-top: 36px;
    padding-right: 68px;
    padding-bottom: 32px;
    padding-left: 62px;
  }
}

.navbar-header {
  width: 100%;
  position: relative;
  background: #fff;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  z-index: 2;
  padding-top: 26px;
  padding-right: 34px;
  padding-bottom: 26px;
  padding-left: 34px;
}

.navbar-header > button {
  -webkit-order: 2;
  -ms-flex-order: 2;
  order: 2;
  margin: 0;
}

@media all and (min-width: 61.25em) {
  .navbar-header > button {
    display: none;
  }
}

@media all and (min-width: 61.25em) {
  .navbar-header {
    padding-right: 34.1979166667px;
  }
}

@media all and (min-width: 75em) {
  .navbar-header {
    padding-right: 41.875px;
    padding-left: 38.75px;
  }
}

@media all and (min-width: 87.5em) {
  .navbar-header {
    padding-top: 26.25px;
    padding-right: 48.8541666667px;
    padding-left: 45.2083333333px;
  }
}

@media all and (min-width: 100em) {
  .navbar-header {
    padding-top: 30px;
    padding-right: 55.8333333333px;
    padding-bottom: 26.6666666667px;
    padding-left: 51.6666666667px;
  }
}

@media all and (min-width: 112.5em) {
  .navbar-header {
    padding-top: 33.75px;
    padding-right: 62.8125px;
    padding-bottom: 30px;
    padding-left: 58.125px;
  }
}

@media all and (min-width: 120em) {
  .navbar-header {
    padding-top: 36px;
    padding-right: 67px;
    padding-bottom: 32px;
    padding-left: 62px;
  }
}

@media all and (min-width: 61.25em) {
  .navbar-header {
    width: auto;
    padding: 0 !important;
  }
}

.navbar-collapse {
  position: absolute;
  width: 100%;
  top: 100%;
  z-index: 1;
  background: #fff;
  width: 100%;
  -webkit-transform: translate3d(0, -100%, 0);
  transform: translate3d(0, -100%, 0);
  transition: -webkit-transform .35s ease;
  transition: transform .35s ease;
  transition: transform .35s ease, -webkit-transform .35s ease;
}

.navbar-collapse.collapse.in {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

@media all and (min-width: 61.25em) {
  .navbar-collapse {
    min-height: none;
    width: auto;
    -webkit-transform: none;
    transform: none;
    transition: none;
    position: relative;
  }
}

.nav > li > a {
  margin: 0 1.4vw;
  padding: 0 !important;
  margin-left: 10px;
}

@media all and (min-width: 42.5em) {
  .nav > li > a {
    margin-left: 24.0833333333px;
  }
}

@media all and (min-width: 48.0625em) {
  .nav > li > a {
    margin-left: 27.2354166667px;
  }
}

@media all and (min-width: 61.25em) {
  .nav > li > a {
    margin-left: 34.7083333333px;
  }
}

@media all and (min-width: 75em) {
  .nav > li > a {
    margin-left: 42.5px;
  }
}

@media all and (min-width: 87.5em) {
  .nav > li > a {
    margin-left: 49.5833333333px;
  }
}

@media all and (min-width: 100em) {
  .nav > li > a {
    margin-left: 56.6666666667px;
  }
}

@media all and (min-width: 112.5em) {
  .nav > li > a {
    margin-left: 63.75px;
  }
}

@media all and (min-width: 120em) {
  .nav > li > a {
    margin-left: 68px;
  }
}

@media all and (min-width: 61.25em) {
  .navbar-right {
    -webkit-flex: auto !important;
    -ms-flex: auto !important;
    flex: auto !important;
  }
}

.navbar-nav {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

@media all and (min-width: 61.25em) {
  .navbar-nav {
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
  }
}

.navbar-nav li {
  padding: 10px;
}

@media all and (min-width: 61.25em) {
  .navbar-nav li {
    padding: 0;
  }
}

.opening-title {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.7) 100%);
}

.opening-title.hide {
  display: none !important;
}

#homepage-header-video {
  -webkit-transform: scale(1.025);
  transform: scale(1.025);
}

@media all and (max-width: 48em) {
  .copy-container {
    padding: 4em;
  }
}

@media all and (max-width: 42.4375em) {
  .copy-container--stacked {
    padding-top: 0;
  }
}

@media all and (max-width: 48em) {
  .logo-container {
    margin-top: 1.875em;
  }
  .logo-container span img {
    max-width: 75px;
  }
}

@media all and (min-width: 48.0625em) {
  .content-block .right-content {
    right: 0;
    padding-right: 34px;
    padding-left: 34px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 42.5em) {
  .content-block .right-content {
    padding-right: 61.9791666667px;
    padding-left: 61.9791666667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 48.0625em) {
  .content-block .right-content {
    padding-right: 70.0911458333px;
    padding-left: 70.0911458333px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 61.25em) {
  .content-block .right-content {
    padding-right: 89.3229166667px;
    padding-left: 89.3229166667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 75em) {
  .content-block .right-content {
    padding-right: 109.375px;
    padding-left: 109.375px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 87.5em) {
  .content-block .right-content {
    padding-right: 127.604166667px;
    padding-left: 127.604166667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 100em) {
  .content-block .right-content {
    padding-right: 145.833333333px;
    padding-left: 145.833333333px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 112.5em) {
  .content-block .right-content {
    padding-right: 164.0625px;
    padding-left: 164.0625px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 120em) {
  .content-block .right-content {
    padding-right: 175px;
    padding-left: 175px;
  }
}

@media all and (min-width: 48.0625em) {
  .content-block .left-content {
    margin-left: 34px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 42.5em) {
  .content-block .left-content {
    margin-left: 61.9791666667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 48.0625em) {
  .content-block .left-content {
    margin-left: 70.0911458333px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 61.25em) {
  .content-block .left-content {
    margin-left: 89.3229166667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 75em) {
  .content-block .left-content {
    margin-left: 109.375px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 87.5em) {
  .content-block .left-content {
    margin-left: 127.604166667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 100em) {
  .content-block .left-content {
    margin-left: 145.833333333px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 112.5em) {
  .content-block .left-content {
    margin-left: 164.0625px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 120em) {
  .content-block .left-content {
    margin-left: 175px;
  }
}

@media all and (min-width: 48.0625em) {
  .content-block.zappos .right-content .copy-container {
    width: 75%;
  }
}

@media all and (min-width: 48.0625em) {
  .insta-grid {
    margin-right: 34px;
    margin-left: 34px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 42.5em) {
  .insta-grid {
    margin-right: 61.9791666667px;
    margin-left: 61.9791666667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 48.0625em) {
  .insta-grid {
    margin-right: 70.0911458333px;
    margin-left: 70.0911458333px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 61.25em) {
  .insta-grid {
    margin-right: 89.3229166667px;
    margin-left: 89.3229166667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 75em) {
  .insta-grid {
    margin-right: 109.375px;
    margin-left: 109.375px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 87.5em) {
  .insta-grid {
    margin-right: 127.604166667px;
    margin-left: 127.604166667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 100em) {
  .insta-grid {
    margin-right: 145.833333333px;
    margin-left: 145.833333333px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 112.5em) {
  .insta-grid {
    margin-right: 164.0625px;
    margin-left: 164.0625px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 120em) {
  .insta-grid {
    margin-right: 175px;
    margin-left: 175px;
  }
}

.faq .bottom-right {
  bottom: 0;
  right: 0;
  width: 100%;
  z-index: -1;
}

.insta-see-more {
  text-decoration: underline;
  text-underline-position: under;
}

.seal {
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
}

#bag {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

#column_38717 {
  width: 100%;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-align-items: flex-end;
  -ms-flex-align: end;
  align-items: flex-end;
}

#column_38717 .email {
  -webkit-flex: 3;
  -ms-flex: 3;
  flex: 3;
}

#column_38717 .email .fb-email {
  width: 100%;
}

#column_38717 .field_block .field {
  bottom: 0;
  position: relative !important;
}

#column_38717 input[type="submit"] {
  border: 0;
  color: #fff;
  text-decoration: none;
  font-family: "Brandon_reg", Arial, sans-serif;
  color: #fff;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.15em;
  transition: background 150ms ease-in;
  height: 100%;
  padding: 1.75em 1.625em;
  background: #76a8bc;
}

.triangle-right {
  position: relative;
}

.triangle-right::after {
  content: '';
  position: absolute;
  z-index: 9999;
  width: 0;
  height: 0;
  border-left: 30px solid transparent;
  border-right: 30px solid transparent;
  border-top: 20px solid #b2d7e1;
  border-bottom: none;
  bottom: -13px;
  top: auto;
  right: 50%;
  -webkit-transform: translate3d(50%, 0, 0);
  transform: translate3d(50%, 0, 0);
}

@media all and (min-width: 48.0625em) {
  .triangle-right::after {
    border-top: 30px solid transparent;
    border-left: 20px solid #b2d7e1;
    border-bottom: 30px solid transparent;
    border-right: none;
    top: 50%;
    bottom: auto;
    right: -13px;
    -webkit-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0);
  }
}

.c-disclaimer--home {
  left: auto;
  top: auto;
  bottom: 0.625em;
  right: 0.625em;
  margin-bottom: 0;
}

.c-disclaimer--home .c-disclaimer {
  font-style: italic;
  font-size: 6px;
  letter-spacing: 0.01em;
}

@media all and (min-width: 75em) {
  .c-disclaimer--home .c-disclaimer {
    font-size: 6.55px;
  }
}

@media all and (min-width: 87.5em) {
  .c-disclaimer--home .c-disclaimer {
    font-size: 7.5916666667px;
  }
}

@media all and (min-width: 100em) {
  .c-disclaimer--home .c-disclaimer {
    font-size: 8.6333333333px;
  }
}

@media all and (min-width: 112.5em) {
  .c-disclaimer--home .c-disclaimer {
    font-size: 9.675px;
  }
}

@media screen and (min-width: 1920px) {
  .c-disclaimer--home .c-disclaimer {
    font-size: 10px;
  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .recycle-logos .left-content {
    height: 100%;
    top: 20%;
    bottom: 0;
  }
  .logo-container .u-flex-1 {
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
  }
}

.recycle-for-good .copy-container:first-child {
  max-width: 535px;
  margin-left: 34px;
}

@media all and (max-width: 48em) {
  .recycle-for-good .copy-container:first-child {
    -webkit-align-self: flex-start;
    -ms-flex-item-align: start;
    align-self: flex-start;
  }
}

@media all and (min-width: 20em) {
  .recycle-for-good .copy-container:first-child {
    margin-left: 0;
  }
}

@media all and (min-width: 30em) {
  .recycle-for-good .copy-container:first-child {
    margin-left: 0;
  }
}

@media all and (min-width: 42.5em) {
  .recycle-for-good .copy-container:first-child {
    margin-left: 0;
  }
}

@media all and (min-width: 48.0625em) {
  .recycle-for-good .copy-container:first-child {
    margin-left: 160.208333333px;
  }
}

@media all and (min-width: 61.25em) {
  .recycle-for-good .copy-container:first-child {
    margin-left: 204.166666667px;
  }
}

@media all and (min-width: 75em) {
  .recycle-for-good .copy-container:first-child {
    margin-left: 250px;
  }
}

@media all and (min-width: 87.5em) {
  .recycle-for-good .copy-container:first-child {
    margin-left: 291.666666667px;
  }
}

@media all and (min-width: 100em) {
  .recycle-for-good .copy-container:first-child {
    margin-left: 333.333333333px;
  }
}

@media all and (min-width: 112.5em) {
  .recycle-for-good .copy-container:first-child {
    margin-left: 375px;
  }
}

@media all and (min-width: 120em) {
  .recycle-for-good .copy-container:first-child {
    margin-left: 400px;
  }
}

.sbi_playbtn {
  top: 0 !important;
  left: auto !important;
  right: 5% !important;
  margin-top: 0 !important;
  margin-left: 0 !important;
  width: 0.25em !important;
}

.recycle-denim .bottom-right {
  right: 3em;
  bottom: 1.875em;
}

@media all and (min-width: 48.0625em) {
  .recycle-denim .left-content {
    padding-left: 34px;
    margin-left: 0;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 42.5em) {
  .recycle-denim .left-content {
    padding-left: 61.9791666667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 48.0625em) {
  .recycle-denim .left-content {
    padding-left: 70.0911458333px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 61.25em) {
  .recycle-denim .left-content {
    padding-left: 89.3229166667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 75em) {
  .recycle-denim .left-content {
    padding-left: 109.375px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 87.5em) {
  .recycle-denim .left-content {
    padding-left: 127.604166667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 100em) {
  .recycle-denim .left-content {
    padding-left: 145.833333333px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 112.5em) {
  .recycle-denim .left-content {
    padding-left: 164.0625px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 120em) {
  .recycle-denim .left-content {
    padding-left: 175px;
  }
}

.recycle-denim .grid {
  padding-right: 34px;
  padding-left: 34px;
}

@media all and (min-width: 42.5em) {
  .recycle-denim .grid {
    padding-right: 61.9791666667px;
    padding-left: 61.9791666667px;
  }
}

@media all and (min-width: 48.0625em) {
  .recycle-denim .grid {
    padding-right: 70.0911458333px;
    padding-left: 70.0911458333px;
  }
}

@media all and (min-width: 61.25em) {
  .recycle-denim .grid {
    padding-right: 89.3229166667px;
    padding-left: 89.3229166667px;
  }
}

@media all and (min-width: 75em) {
  .recycle-denim .grid {
    padding-right: 109.375px;
    padding-left: 109.375px;
  }
}

@media all and (min-width: 87.5em) {
  .recycle-denim .grid {
    padding-right: 127.604166667px;
    padding-left: 127.604166667px;
  }
}

@media all and (min-width: 100em) {
  .recycle-denim .grid {
    padding-right: 145.833333333px;
    padding-left: 145.833333333px;
  }
}

@media all and (min-width: 112.5em) {
  .recycle-denim .grid {
    padding-right: 164.0625px;
    padding-left: 164.0625px;
  }
}

@media all and (min-width: 120em) {
  .recycle-denim .grid {
    padding-right: 175px;
    padding-left: 175px;
  }
}

.recycle-denim .grid .grid-item .c-icon, .recycle-denim .grid .grid-item .dates {
  top: 0;
  left: 0;
  z-index: 9999;
}

.recycle-denim .grid .grid-item .c-icon--partner svg {
  max-height: 45.33px;
}

@media all and (max-width: 61.1875em) {
  .recycle-denim .grid .grid-item .c-icon--partner {
    width: 20%;
  }
}

.recycle-denim .grid .grid-item .c-icon--partner:not(.gray) svg {
  fill: #FFFFFF !important;
  stroke: #FFFFFF !important;
}

.recycle-denim .grid .grid-item .c-icon--partner.gray svg {
  fill: #8c8c8c !important;
  stroke: #8c8c8c !important;
}

.recycle-denim .grid .grid-item .image-container {
  position: relative;
  height: 0;
  padding-top: 54.1775457%;
}

.recycle-denim .grid .grid-item .image-container img {
  position: absolute;
  top: 0;
}

@media all and (min-width: 48.0625em) {
  .recycle-denim .grid .grid-item:nth-child(2n + 1):not(:last-child) {
    margin-right: 1.25em;
  }
}

.recycle-denim .grid .grid-item:nth-child(odd):last-child:not(:only-child) {
  -webkit-flex: 1 45%;
  -ms-flex: 1 45%;
  flex: 1 45%;
  margin-right: 0;
}

@media all and (min-width: 48.0625em) {
  .recycle-denim .grid .grid-item:nth-child(odd):last-child:not(:only-child) {
    max-width: 49.15%;
  }
}

.recycle-denim .grid .grid-item:nth-child(n+5) {
  display: none;
}

.recycle-denim .jeans {
  display: none;
}

.recycle-denim .jeans.bottom-right {
  z-index: -1;
  bottom: 0;
  right: 0;
}

.recycle-denim .expanding .c-icon svg {
  -webkit-transform: rotate(0);
  transform: rotate(0);
  transition: -webkit-transform 300ms ease-in;
  transition: transform 300ms ease-in;
  transition: transform 300ms ease-in, -webkit-transform 300ms ease-in;
}

.recycle-denim .expanding.rotate .c-icon svg {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  transition: -webkit-transform 300ms ease-in;
  transition: transform 300ms ease-in;
  transition: transform 300ms ease-in, -webkit-transform 300ms ease-in;
}

@media all and (max-width: 48em) {
  .recycle-denim .expanding {
    margin-bottom: 1.875em;
  }
}

.recycle-denim .see-more {
  position: relative;
  cursor: pointer;
}

.recycle-denim .see-more:after {
  content: '';
  border-bottom: 1px solid #314682;
  width: 100%;
  position: absolute;
  padding-top: 5px;
  bottom: 0;
  left: 0;
}

.recycle-denim .see-more:hover {
  text-decoration: none;
}

@media all and (min-width: 48.0625em) {
  .recycle-denim .school .left-content {
    padding-left: 34px;
    margin-left: 0;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 42.5em) {
  .recycle-denim .school .left-content {
    padding-left: 61.9791666667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 48.0625em) {
  .recycle-denim .school .left-content {
    padding-left: 70.0911458333px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 61.25em) {
  .recycle-denim .school .left-content {
    padding-left: 89.3229166667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 75em) {
  .recycle-denim .school .left-content {
    padding-left: 109.375px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 87.5em) {
  .recycle-denim .school .left-content {
    padding-left: 127.604166667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 100em) {
  .recycle-denim .school .left-content {
    padding-left: 145.833333333px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 112.5em) {
  .recycle-denim .school .left-content {
    padding-left: 164.0625px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 120em) {
  .recycle-denim .school .left-content {
    padding-left: 175px;
  }
}

@media all and (min-width: 48.0625em) and (-ms-high-contrast: none), all and (min-width: 48.0625em) and (-ms-high-contrast: active) {
  .recycle-denim .school .left-content {
    margin-top: 4em;
  }
}

.recycle-denim .school .left-content .copy-container:not(.schools) {
  z-index: 9;
}

.recycle-denim .school .schools.bar {
  position: relative;
}

.recycle-denim .school .schools.bar:before {
  content: '';
  border-top: 3px solid #326783;
  width: 102px;
  position: absolute;
  top: 0;
  left: 0;
  right: auto;
  bottom: auto;
}

@media all and (min-width: 48.0625em) {
  .recycle-denim .icon-grid {
    padding-right: 34px;
    padding-left: 34px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 42.5em) {
  .recycle-denim .icon-grid {
    padding-right: 61.9791666667px;
    padding-left: 61.9791666667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 48.0625em) {
  .recycle-denim .icon-grid {
    padding-right: 70.0911458333px;
    padding-left: 70.0911458333px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 61.25em) {
  .recycle-denim .icon-grid {
    padding-right: 89.3229166667px;
    padding-left: 89.3229166667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 75em) {
  .recycle-denim .icon-grid {
    padding-right: 109.375px;
    padding-left: 109.375px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 87.5em) {
  .recycle-denim .icon-grid {
    padding-right: 127.604166667px;
    padding-left: 127.604166667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 100em) {
  .recycle-denim .icon-grid {
    padding-right: 145.833333333px;
    padding-left: 145.833333333px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 112.5em) {
  .recycle-denim .icon-grid {
    padding-right: 164.0625px;
    padding-left: 164.0625px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 120em) {
  .recycle-denim .icon-grid {
    padding-right: 175px;
    padding-left: 175px;
  }
}

body .gform_wrapper .top_label .gfield div.ginput_container,
body .gform_wrapper .top_label .gfield .ginput_complex input {
  margin-top: 0;
}

.contact-header .copy-container {
  padding-top: 0px;
  padding-bottom: 0px;
}

@media all and (min-width: 42.5em) {
  .contact-header .copy-container {
    padding-top: 86.7708333333px;
    padding-bottom: 57.375px;
  }
}

@media all and (min-width: 48.0625em) {
  .contact-header .copy-container {
    padding-top: 98.1276041667px;
    padding-bottom: 64.884375px;
  }
}

@media all and (min-width: 61.25em) {
  .contact-header .copy-container {
    padding-top: 125.052083333px;
    padding-bottom: 82.6875px;
  }
}

@media all and (min-width: 75em) {
  .contact-header .copy-container {
    padding-top: 153.125px;
    padding-bottom: 101.25px;
  }
}

@media all and (min-width: 87.5em) {
  .contact-header .copy-container {
    padding-top: 178.645833333px;
    padding-bottom: 118.125px;
  }
}

@media all and (min-width: 100em) {
  .contact-header .copy-container {
    padding-top: 204.166666667px;
    padding-bottom: 135px;
  }
}

@media all and (min-width: 112.5em) {
  .contact-header .copy-container {
    padding-top: 229.6875px;
    padding-bottom: 151.875px;
  }
}

@media all and (min-width: 120em) {
  .contact-header .copy-container {
    padding-top: 245px;
    padding-bottom: 162px;
  }
}

body .gform_wrapper .gform_body ul li.gfield {
  margin-top: 20px;
}

.gform_wrapper input[type="text"], .gform_wrapper textarea, .gform_wrapper input[type="email"] {
  height: 51px;
  background-color: #d6e6ea;
}

.contact-form .gform_wrapper label.gfield_label, #label_1_4_1 {
  font-size: 10px;
  letter-spacing: 0.02em;
  line-height: 1.4375;
  font-family: "brandon-grotesque", Arial, sans-serif;
  text-align: left;
  color: #939899;
  font-weight: 500;
  letter-spacing: .05em;
  margin: 0;
}

@media all and (min-width: 61.25em) {
  .contact-form .gform_wrapper label.gfield_label, #label_1_4_1 {
    font-size: 10.0625583333px;
  }
}

@media all and (min-width: 75em) {
  .contact-form .gform_wrapper label.gfield_label, #label_1_4_1 {
    font-size: 12.1961px;
  }
}

@media all and (min-width: 87.5em) {
  .contact-form .gform_wrapper label.gfield_label, #label_1_4_1 {
    font-size: 14.1356833333px;
  }
}

@media all and (min-width: 100em) {
  .contact-form .gform_wrapper label.gfield_label, #label_1_4_1 {
    font-size: 16.0752666667px;
  }
}

@media all and (min-width: 112.5em) {
  .contact-form .gform_wrapper label.gfield_label, #label_1_4_1 {
    font-size: 18.01485px;
  }
}

@media screen and (min-width: 1920px) {
  .contact-form .gform_wrapper label.gfield_label, #label_1_4_1 {
    font-size: 18.62px;
  }
}

#field_1_5.gfield.field_sublabel_above .gfield_label {
  display: none !important;
}

#field_1_7 .gfield_label {
  display: none !important;
}

#field_1_7 .gfield_checkbox label {
  font-family: "brandon-grotesque", Arial, sans-serif;
  font-weight: 500;
  font-size: 10px;
  letter-spacing: .05em;
  line-height: 1.4375;
  text-transform: uppercase;
}

@media all and (min-width: 61.25em) {
  #field_1_7 .gfield_checkbox label {
    font-size: 10.0625583333px;
  }
}

@media all and (min-width: 75em) {
  #field_1_7 .gfield_checkbox label {
    font-size: 12.1961px;
  }
}

@media all and (min-width: 87.5em) {
  #field_1_7 .gfield_checkbox label {
    font-size: 14.1356833333px;
  }
}

@media all and (min-width: 100em) {
  #field_1_7 .gfield_checkbox label {
    font-size: 16.0752666667px;
  }
}

@media all and (min-width: 112.5em) {
  #field_1_7 .gfield_checkbox label {
    font-size: 18.01485px;
  }
}

@media screen and (min-width: 1920px) {
  #field_1_7 .gfield_checkbox label {
    font-size: 18.62px;
  }
}

#gform_1 #gform_fields_1 .gfield_required {
  display: none;
}

body .gform_wrapper ul li.gfield {
  margin-top: 22px;
}

.faq-container {
  padding-right: 34px;
  padding-left: 34px;
}

@media all and (min-width: 42.5em) {
  .faq-container {
    padding-right: 61.9791666667px;
    padding-left: 61.9791666667px;
  }
}

@media all and (min-width: 48.0625em) {
  .faq-container {
    padding-right: 70.0911458333px;
    padding-left: 70.0911458333px;
  }
}

@media all and (min-width: 61.25em) {
  .faq-container {
    padding-right: 89.3229166667px;
    padding-left: 89.3229166667px;
  }
}

@media all and (min-width: 75em) {
  .faq-container {
    padding-right: 109.375px;
    padding-left: 109.375px;
  }
}

@media all and (min-width: 87.5em) {
  .faq-container {
    padding-right: 127.604166667px;
    padding-left: 127.604166667px;
  }
}

@media all and (min-width: 100em) {
  .faq-container {
    padding-right: 145.833333333px;
    padding-left: 145.833333333px;
  }
}

@media all and (min-width: 112.5em) {
  .faq-container {
    padding-right: 164.0625px;
    padding-left: 164.0625px;
  }
}

@media all and (min-width: 120em) {
  .faq-container {
    padding-right: 175px;
    padding-left: 175px;
  }
}

@media all and (min-width: 48.0625em) {
  .new-margin {
    margin-right: 34px;
    margin-left: 34px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 42.5em) {
  .new-margin {
    margin-right: 61.9791666667px;
    margin-left: 61.9791666667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 48.0625em) {
  .new-margin {
    margin-right: 70.0911458333px;
    margin-left: 70.0911458333px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 61.25em) {
  .new-margin {
    margin-right: 89.3229166667px;
    margin-left: 89.3229166667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 75em) {
  .new-margin {
    margin-right: 109.375px;
    margin-left: 109.375px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 87.5em) {
  .new-margin {
    margin-right: 127.604166667px;
    margin-left: 127.604166667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 100em) {
  .new-margin {
    margin-right: 145.833333333px;
    margin-left: 145.833333333px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 112.5em) {
  .new-margin {
    margin-right: 164.0625px;
    margin-left: 164.0625px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 120em) {
  .new-margin {
    margin-right: 175px;
    margin-left: 175px;
  }
}

@media all and (min-width: 48.0625em) {
  .new-margin-right {
    margin-left: 34px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 42.5em) {
  .new-margin-right {
    margin-left: 44.2708333333px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 48.0625em) {
  .new-margin-right {
    margin-left: 50.0651041667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 61.25em) {
  .new-margin-right {
    margin-left: 63.8020833333px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 75em) {
  .new-margin-right {
    margin-left: 78.125px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 87.5em) {
  .new-margin-right {
    margin-left: 91.1458333333px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 100em) {
  .new-margin-right {
    margin-left: 104.166666667px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 112.5em) {
  .new-margin-right {
    margin-left: 117.1875px;
  }
}

@media all and (min-width: 48.0625em) and (min-width: 120em) {
  .new-margin-right {
    margin-left: 125px;
  }
}

.gfield_label {
  text-transform: uppercase;
}

.selectize-input,
.selectize-input.full,
.selectize-control.single .selectize-input.input-active {
  padding: 5px 4px;
  background: #d6e6ea;
  border-radius: 0;
  box-shadow: none;
  border: none;
  height: 51px;
  color: #8c8c8c;
  font-size: 16px;
  line-height: 42px;
  margin-top: 5px;
}

.selectize-input input,
.selectize-input.full input,
.selectize-control.single .selectize-input.input-active input {
  background: none;
}

.selectize-control.single .selectize-input:after {
  border-color: #314682 transparent transparent transparent;
}

.selectize-control.single .selectize-input.dropdown-active:after {
  border-color: transparent transparent #314682 transparent;
}

.selectize-dropdown {
  background: #d6e6ea;
  border: none;
}

.selectize-dropdown .option {
  height: 51px;
  color: #8c8c8c;
  font-size: 16px;
  line-height: 42px;
  cursor: pointer;
}

.gfield .ginput_container .gfield_checkbox input[type=checkbox] {
  -webkit-appearance: none;
  background: #d6e6ea;
  width: 20px !important;
  height: 20px;
  margin-top: 0 !important;
}

.gfield .ginput_container .gfield_checkbox li {
  position: relative;
}

.gfield .ginput_container .gfield_checkbox li.checked:after {
  content: '';
  position: absolute;
  left: 6px;
  top: 12px;
  background: #314682;
  width: 2px;
  height: 2px;
  box-shadow: 2px 0 0 #314682, 4px 0 0 #314682, 4px -2px 0 #314682, 4px -4px 0 #314682, 4px -6px 0 #314682, 4px -8px 0 #314682;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.gfield .ginput_container .gfield_checkbox li label {
  position: relative;
  padding-left: 20px;
}

.faq-container h3 {
  color: #314682;
}

.faq .two-column-list-w-header {
  padding-bottom: 0;
}

.copy-with-looping-video .content-grid {
  display: -ms-grid;
  display: grid;
  -webkit-align-items: start;
  -ms-flex-align: start;
  align-items: start;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  grid-column-gap: 0;
}

@media all and (min-width: 42.5em) {
  .copy-with-looping-video .content-grid {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
}

.copy-with-looping-video .c-copy {
  max-width: 100%;
}

.copy-with-looping-video .content-grid__item {
  -ms-grid-row-align: start;
  grid-row-align: start;
}

.copy-with-looping-video .content-grid__item:first-child {
  -ms-grid-column: 1;
  grid-column-start: 1;
  -ms-grid-row: 2;
  grid-row-start: 2;
}

.copy-with-looping-video .content-grid__item:last-child {
  -ms-grid-column: 1;
  grid-column-start: 1;
  -ms-grid-row: 1;
  grid-row-start: 1;
}

.copy-with-looping-video .video-content {
  height: 100%;
}

.copy-with-looping-video .copy-content {
  padding-top: 34px;
  padding-right: 34px;
  padding-bottom: 34px;
  padding-left: 34px;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
}

@media all and (min-width: 42.5em) {
  .copy-with-looping-video .copy-content {
    padding-right: 53.125px;
    padding-left: 53.125px;
  }
}

@media all and (min-width: 48.0625em) {
  .copy-with-looping-video .copy-content {
    padding-right: 60.078125px;
    padding-left: 60.078125px;
  }
}

@media all and (min-width: 61.25em) {
  .copy-with-looping-video .copy-content {
    padding-right: 76.5625px;
    padding-left: 76.5625px;
  }
}

@media all and (min-width: 75em) {
  .copy-with-looping-video .copy-content {
    padding-top: 40px;
    padding-right: 93.75px;
    padding-bottom: 40px;
    padding-left: 93.75px;
  }
}

@media all and (min-width: 87.5em) {
  .copy-with-looping-video .copy-content {
    padding-top: 46.6666666667px;
    padding-right: 109.375px;
    padding-bottom: 46.6666666667px;
    padding-left: 109.375px;
  }
}

@media all and (min-width: 100em) {
  .copy-with-looping-video .copy-content {
    padding-top: 53.3333333333px;
    padding-right: 125px;
    padding-bottom: 53.3333333333px;
    padding-left: 125px;
  }
}

@media all and (min-width: 112.5em) {
  .copy-with-looping-video .copy-content {
    padding-top: 60px;
    padding-right: 140.625px;
    padding-bottom: 60px;
    padding-left: 140.625px;
  }
}

@media all and (min-width: 120em) {
  .copy-with-looping-video .copy-content {
    padding-top: 64px;
    padding-right: 150px;
    padding-bottom: 64px;
    padding-left: 150px;
  }
}

.copy-with-looping-video--2\/3 .content-grid {
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
}

@media all and (min-width: 48.0625em) {
  .copy-with-looping-video--2\/3 .content-grid {
    -ms-grid-columns: 50% 1fr;
    grid-template-columns: 50% 1fr;
  }
  .copy-with-looping-video--2\/3 .content-grid .content-grid__item:first-child {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
  .copy-with-looping-video--2\/3 .content-grid .content-grid__item:last-child {
    -ms-grid-column: 2;
    grid-column-start: 2;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
}

@media all and (min-width: 61.25em) {
  .copy-with-looping-video--2\/3 .content-grid {
    -ms-grid-columns: 36% 1fr;
    grid-template-columns: 36% 1fr;
  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .video-content video {
    width: 150%;
    -webkit-transform: translate3d(-15%, 0, 0) scale3d(1.03, 1.03, 1.03);
    transform: translate3d(-15%, 0, 0) scale3d(1.03, 1.03, 1.03);
  }
}

.full-width .content-grid {
  display: -ms-grid;
  display: grid;
  -webkit-align-items: start;
  -ms-flex-align: start;
  align-items: start;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  grid-column-gap: 0;
}

@media all and (min-width: 42.5em) {
  .full-width .content-grid {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
}

.full-width .content-grid__item {
  -ms-grid-row-align: start;
  grid-row-align: start;
  min-height: 100%;
  padding-right: 34px;
  padding-left: 34px;
  padding-top: 34px;
  padding-bottom: 34px;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

@media all and (min-width: 42.5em) {
  .full-width .content-grid__item {
    padding-right: 61.9791666667px;
    padding-left: 61.9791666667px;
  }
}

@media all and (min-width: 48.0625em) {
  .full-width .content-grid__item {
    padding-right: 70.0911458333px;
    padding-left: 70.0911458333px;
  }
}

@media all and (min-width: 61.25em) {
  .full-width .content-grid__item {
    padding-right: 89.3229166667px;
    padding-left: 89.3229166667px;
  }
}

@media all and (min-width: 75em) {
  .full-width .content-grid__item {
    padding-right: 109.375px;
    padding-left: 109.375px;
  }
}

@media all and (min-width: 87.5em) {
  .full-width .content-grid__item {
    padding-right: 127.604166667px;
    padding-left: 127.604166667px;
  }
}

@media all and (min-width: 100em) {
  .full-width .content-grid__item {
    padding-right: 145.833333333px;
    padding-left: 145.833333333px;
  }
}

@media all and (min-width: 112.5em) {
  .full-width .content-grid__item {
    padding-right: 164.0625px;
    padding-left: 164.0625px;
  }
}

@media all and (min-width: 120em) {
  .full-width .content-grid__item {
    padding-right: 175px;
    padding-left: 175px;
  }
}

@media all and (min-width: 42.5em) {
  .full-width .content-grid__item {
    padding-top: 42.5px;
    padding-bottom: 42.5px;
  }
}

@media all and (min-width: 48.0625em) {
  .full-width .content-grid__item {
    padding-top: 48.0625px;
    padding-bottom: 48.0625px;
  }
}

@media all and (min-width: 61.25em) {
  .full-width .content-grid__item {
    padding-top: 61.25px;
    padding-bottom: 61.25px;
  }
}

@media all and (min-width: 75em) {
  .full-width .content-grid__item {
    padding-top: 75px;
    padding-bottom: 75px;
  }
}

@media all and (min-width: 87.5em) {
  .full-width .content-grid__item {
    padding-top: 87.5px;
    padding-bottom: 87.5px;
  }
}

@media all and (min-width: 100em) {
  .full-width .content-grid__item {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

@media all and (min-width: 112.5em) {
  .full-width .content-grid__item {
    padding-top: 112.5px;
    padding-bottom: 112.5px;
  }
}

@media all and (min-width: 120em) {
  .full-width .content-grid__item {
    padding-top: 120px;
    padding-bottom: 120px;
  }
}

@media all and (min-width: 48.0625em) {
  .full-width .content-grid__item {
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

.full-width .content-grid__item:nth-child(1) {
  -ms-grid-column: 1;
  grid-column-start: 1;
  -ms-grid-row: 1;
  grid-row-start: 1;
}

.full-width .content-grid__item:nth-child(2) {
  -ms-grid-column: 1;
  grid-column-start: 1;
  -ms-grid-row: 2;
  grid-row-start: 2;
}

@media all and (min-width: 42.5em) {
  .full-width .content-grid__item:nth-child(1) {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
  .full-width .content-grid__item:nth-child(2) {
    -ms-grid-column: 2;
    grid-column-start: 2;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
}

.full-width .content-list__item {
  margin-bottom: 25px;
}

.full-width .content-list__item .c-heading {
  margin: 0 0 8px 0;
}

@media all and (min-width: 48.0625em) {
  .full-width .content-list__item {
    margin-bottom: 50px;
  }
}

.steps .content-list {
  display: -ms-grid;
  display: grid;
  -webkit-align-items: start;
  -ms-flex-align: start;
  align-items: start;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  grid-column-gap: 0;
}

@media all and (min-width: 42.5em) {
  .steps .content-list {
    -webkit-column-gap: 1.875em;
    column-gap: 1.875em;
    row-gap: 1.25em;
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2, 1fr);
  }
}

.steps .content-grid__item {
  -ms-grid-row-align: start;
  grid-row-align: start;
  min-height: 100%;
  padding-top: 34px;
  padding-bottom: 34px;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

@media all and (min-width: 42.5em) {
  .steps .content-grid__item {
    padding-top: 42.5px;
    padding-bottom: 42.5px;
  }
}

@media all and (min-width: 48.0625em) {
  .steps .content-grid__item {
    padding-top: 48.0625px;
    padding-bottom: 48.0625px;
  }
}

@media all and (min-width: 61.25em) {
  .steps .content-grid__item {
    padding-top: 61.25px;
    padding-bottom: 61.25px;
  }
}

@media all and (min-width: 75em) {
  .steps .content-grid__item {
    padding-top: 75px;
    padding-bottom: 75px;
  }
}

@media all and (min-width: 87.5em) {
  .steps .content-grid__item {
    padding-top: 87.5px;
    padding-bottom: 87.5px;
  }
}

@media all and (min-width: 100em) {
  .steps .content-grid__item {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

@media all and (min-width: 112.5em) {
  .steps .content-grid__item {
    padding-top: 112.5px;
    padding-bottom: 112.5px;
  }
}

@media all and (min-width: 120em) {
  .steps .content-grid__item {
    padding-top: 120px;
    padding-bottom: 120px;
  }
}

@media all and (min-width: 48.0625em) {
  .steps .content-grid__item {
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

.steps .content-list__item {
  margin-bottom: 25px;
}

.steps .content-list__item .c-heading {
  margin: 0 0 8px 0;
}

@media all and (min-width: 48.0625em) {
  .steps .content-list__item {
    margin-bottom: 50px;
  }
}

.half-half .content-grid {
  display: -ms-grid;
  display: grid;
  -webkit-align-items: start;
  -ms-flex-align: start;
  align-items: start;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  grid-column-gap: 0;
}

@media all and (min-width: 42.5em) {
  .half-half .content-grid {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
}

.half-half .content-grid__item {
  -ms-grid-row-align: start;
  grid-row-align: start;
  min-height: 100%;
  padding-right: 34px;
  padding-left: 34px;
  padding-top: 34px;
  padding-bottom: 34px;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

@media all and (min-width: 42.5em) {
  .half-half .content-grid__item {
    padding-right: 61.9791666667px;
    padding-left: 61.9791666667px;
  }
}

@media all and (min-width: 48.0625em) {
  .half-half .content-grid__item {
    padding-right: 70.0911458333px;
    padding-left: 70.0911458333px;
  }
}

@media all and (min-width: 61.25em) {
  .half-half .content-grid__item {
    padding-right: 89.3229166667px;
    padding-left: 89.3229166667px;
  }
}

@media all and (min-width: 75em) {
  .half-half .content-grid__item {
    padding-right: 109.375px;
    padding-left: 109.375px;
  }
}

@media all and (min-width: 87.5em) {
  .half-half .content-grid__item {
    padding-right: 127.604166667px;
    padding-left: 127.604166667px;
  }
}

@media all and (min-width: 100em) {
  .half-half .content-grid__item {
    padding-right: 145.833333333px;
    padding-left: 145.833333333px;
  }
}

@media all and (min-width: 112.5em) {
  .half-half .content-grid__item {
    padding-right: 164.0625px;
    padding-left: 164.0625px;
  }
}

@media all and (min-width: 120em) {
  .half-half .content-grid__item {
    padding-right: 175px;
    padding-left: 175px;
  }
}

@media all and (min-width: 42.5em) {
  .half-half .content-grid__item {
    padding-top: 42.5px;
    padding-bottom: 42.5px;
  }
}

@media all and (min-width: 48.0625em) {
  .half-half .content-grid__item {
    padding-top: 48.0625px;
    padding-bottom: 48.0625px;
  }
}

@media all and (min-width: 61.25em) {
  .half-half .content-grid__item {
    padding-top: 61.25px;
    padding-bottom: 61.25px;
  }
}

@media all and (min-width: 75em) {
  .half-half .content-grid__item {
    padding-top: 75px;
    padding-bottom: 75px;
  }
}

@media all and (min-width: 87.5em) {
  .half-half .content-grid__item {
    padding-top: 87.5px;
    padding-bottom: 87.5px;
  }
}

@media all and (min-width: 100em) {
  .half-half .content-grid__item {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

@media all and (min-width: 112.5em) {
  .half-half .content-grid__item {
    padding-top: 112.5px;
    padding-bottom: 112.5px;
  }
}

@media all and (min-width: 120em) {
  .half-half .content-grid__item {
    padding-top: 120px;
    padding-bottom: 120px;
  }
}

@media all and (min-width: 48.0625em) {
  .half-half .content-grid__item {
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

.half-half .content-grid__item:nth-child(1) {
  -ms-grid-column: 1;
  grid-column-start: 1;
  -ms-grid-row: 1;
  grid-row-start: 1;
}

.half-half .content-grid__item:nth-child(2) {
  -ms-grid-column: 1;
  grid-column-start: 1;
  -ms-grid-row: 2;
  grid-row-start: 2;
}

@media all and (min-width: 42.5em) {
  .half-half .content-grid__item:nth-child(1) {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
  .half-half .content-grid__item:nth-child(2) {
    -ms-grid-column: 2;
    grid-column-start: 2;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
}

.half-half .content-list__item {
  margin-bottom: 25px;
}

.half-half .content-list__item .c-heading {
  margin: 0 0 8px 0;
}

@media all and (min-width: 48.0625em) {
  .half-half .content-list__item {
    margin-bottom: 50px;
  }
}

.half-half-with-media .content-grid {
  display: -ms-grid;
  display: grid;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  grid-column-gap: 0;
}

@media all and (min-width: 61.25em) {
  .half-half-with-media .content-grid {
    -ms-grid-columns: 50% 50%;
    grid-template-columns: 50% 50%;
  }
}

.half-half-with-media .content-grid__item {
  -ms-grid-row-align: start;
  grid-row-align: start;
  height: 100%;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.half-half-with-media .copy-content {
  padding-top: 68px;
  padding-bottom: 68px;
  padding-right: 34px;
  padding-left: 34px;
  position: relative;
  z-index: 3;
}

@media all and (min-width: 75em) {
  .half-half-with-media .copy-content {
    padding-top: 75px;
    padding-bottom: 75px;
  }
}

@media all and (min-width: 87.5em) {
  .half-half-with-media .copy-content {
    padding-top: 87.5px;
    padding-bottom: 87.5px;
  }
}

@media all and (min-width: 100em) {
  .half-half-with-media .copy-content {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

@media all and (min-width: 112.5em) {
  .half-half-with-media .copy-content {
    padding-top: 112.5px;
    padding-bottom: 112.5px;
  }
}

@media all and (min-width: 120em) {
  .half-half-with-media .copy-content {
    padding-top: 120px;
    padding-bottom: 120px;
  }
}

@media all and (min-width: 42.5em) {
  .half-half-with-media .copy-content {
    padding-right: 61.9791666667px;
    padding-left: 61.9791666667px;
  }
}

@media all and (min-width: 48.0625em) {
  .half-half-with-media .copy-content {
    padding-right: 70.0911458333px;
    padding-left: 70.0911458333px;
  }
}

@media all and (min-width: 61.25em) {
  .half-half-with-media .copy-content {
    padding-right: 89.3229166667px;
    padding-left: 89.3229166667px;
  }
}

@media all and (min-width: 75em) {
  .half-half-with-media .copy-content {
    padding-right: 109.375px;
    padding-left: 109.375px;
  }
}

@media all and (min-width: 87.5em) {
  .half-half-with-media .copy-content {
    padding-right: 127.604166667px;
    padding-left: 127.604166667px;
  }
}

@media all and (min-width: 100em) {
  .half-half-with-media .copy-content {
    padding-right: 145.833333333px;
    padding-left: 145.833333333px;
  }
}

@media all and (min-width: 112.5em) {
  .half-half-with-media .copy-content {
    padding-right: 164.0625px;
    padding-left: 164.0625px;
  }
}

@media all and (min-width: 120em) {
  .half-half-with-media .copy-content {
    padding-right: 175px;
    padding-left: 175px;
  }
}

.half-half-with-media .copy-content::after {
  left: 50%;
  top: 100%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-top-color: #88b7d5;
  border-bottom-color: transparent;
  border-left-color: transparent;
  border-right-color: transparent;
  border-width: 35px;
  margin-top: 0;
  margin-left: -30px;
}

@media all and (min-width: 61.25em) {
  .half-half-with-media .copy-content::after {
    left: 100%;
    top: 18%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-left-color: #88b7d5;
    border-right-color: transparent;
    border-top-color: transparent;
    border-bottom-color: transparent;
    border-width: 35px;
    margin-top: -30px;
    margin-left: 0;
  }
}

.half-half-with-media .copy-content {
  -ms-grid-column: 1;
  grid-column-start: 1;
  -ms-grid-row: 1;
  grid-row-start: 1;
}

.half-half-with-media .media-content {
  -ms-grid-column: 1;
  grid-column-start: 1;
  -ms-grid-row: 2;
  grid-row-start: 2;
}

@media all and (min-width: 61.25em) {
  .half-half-with-media .media-content {
    -ms-grid-column: 2;
    grid-column-start: 2;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
}

@media all and (min-width: 61.25em) {
  .half-half-with-media--copy-right .copy-content {
    -ms-grid-column: 2;
    grid-column-start: 2;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
}

@media all and (min-width: 61.25em) {
  .half-half-with-media--copy-right .copy-content::after {
    left: auto;
    right: 100%;
    top: 18%;
    border-left-color: transparent;
    border-right-color: #88b7d5;
  }
}

@media all and (min-width: 61.25em) {
  .half-half-with-media--copy-right .media-content {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
}

.half-half-with-media .video-container .opening-title .play-button {
  position: relative;
  -webkit-transform: none;
  transform: none;
  bottom: auto;
  left: auto;
}

.half-half-with-media .video-container .js-video-controls, .half-half-with-media .video-container .plyr--video, .half-half-with-media .video-container .plyr__video-wrapper, .half-half-with-media .video-container .plyr__video-wrapper video {
  height: 100%;
}

.half-half-with-media .js-view-more {
  display: none;
}

.half-half-with-media.has-more-enabled .more-wrapper__outer {
  position: relative;
}

.half-half-with-media.has-more-enabled .more-wrapper__outer::after {
  content: '';
  position: absolute;
  display: none;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 98px;
  opacity: 0.9;
  background-image: linear-gradient(to top, #b2d7e1, rgba(178, 215, 225, 0));
  height: 10px;
  padding-bottom: 0;
}

@media all and (min-width: 30em) {
  .half-half-with-media.has-more-enabled .more-wrapper__outer::after {
    height: none;
    padding-bottom: 0;
  }
}

@media all and (min-width: 42.5em) {
  .half-half-with-media.has-more-enabled .more-wrapper__outer::after {
    height: none;
    padding-bottom: 0;
  }
}

@media all and (min-width: 48.0625em) {
  .half-half-with-media.has-more-enabled .more-wrapper__outer::after {
    height: none;
    padding-bottom: 0;
  }
}

@media all and (min-width: 61.25em) {
  .half-half-with-media.has-more-enabled .more-wrapper__outer::after {
    height: 50.0208333333px;
    padding-bottom: 51.0416666667px;
  }
}

@media all and (min-width: 75em) {
  .half-half-with-media.has-more-enabled .more-wrapper__outer::after {
    height: 61.25px;
    padding-bottom: 62.5px;
  }
}

@media all and (min-width: 87.5em) {
  .half-half-with-media.has-more-enabled .more-wrapper__outer::after {
    height: 71.4583333333px;
    padding-bottom: 72.9166666667px;
  }
}

@media all and (min-width: 100em) {
  .half-half-with-media.has-more-enabled .more-wrapper__outer::after {
    height: 81.6666666667px;
    padding-bottom: 83.3333333333px;
  }
}

@media all and (min-width: 112.5em) {
  .half-half-with-media.has-more-enabled .more-wrapper__outer::after {
    height: 91.875px;
    padding-bottom: 93.75px;
  }
}

@media all and (min-width: 120em) {
  .half-half-with-media.has-more-enabled .more-wrapper__outer::after {
    height: 98px;
    padding-bottom: 100px;
  }
}

@media all and (min-width: 61.25em) {
  .half-half-with-media.has-more-enabled .more-wrapper__outer::after {
    display: block;
  }
}

.half-half-with-media.has-more-enabled .more-wrapper {
  position: relative;
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
  max-height: 250px;
}

@media all and (min-width: 30em) {
  .half-half-with-media.has-more-enabled .more-wrapper {
    max-height: none;
  }
}

@media all and (min-width: 42.5em) {
  .half-half-with-media.has-more-enabled .more-wrapper {
    max-height: none;
  }
}

@media all and (min-width: 48.0625em) {
  .half-half-with-media.has-more-enabled .more-wrapper {
    max-height: none;
  }
}

@media all and (min-width: 61.25em) {
  .half-half-with-media.has-more-enabled .more-wrapper {
    max-height: 250.104166667px;
  }
}

@media all and (min-width: 75em) {
  .half-half-with-media.has-more-enabled .more-wrapper {
    max-height: 306.25px;
  }
}

@media all and (min-width: 87.5em) {
  .half-half-with-media.has-more-enabled .more-wrapper {
    max-height: 357.291666667px;
  }
}

@media all and (min-width: 100em) {
  .half-half-with-media.has-more-enabled .more-wrapper {
    max-height: 408.333333333px;
  }
}

@media all and (min-width: 112.5em) {
  .half-half-with-media.has-more-enabled .more-wrapper {
    max-height: 459.375px;
  }
}

@media all and (min-width: 120em) {
  .half-half-with-media.has-more-enabled .more-wrapper {
    max-height: 490px;
  }
}

.half-half-with-media.has-more-enabled .more-wrapper__content {
  margin-bottom: 0;
}

@media all and (min-width: 30em) {
  .half-half-with-media.has-more-enabled .more-wrapper__content {
    margin-bottom: 0;
  }
}

@media all and (min-width: 42.5em) {
  .half-half-with-media.has-more-enabled .more-wrapper__content {
    margin-bottom: 0;
  }
}

@media all and (min-width: 48.0625em) {
  .half-half-with-media.has-more-enabled .more-wrapper__content {
    margin-bottom: 0;
  }
}

@media all and (min-width: 61.25em) {
  .half-half-with-media.has-more-enabled .more-wrapper__content {
    margin-bottom: 51.0416666667px;
  }
}

@media all and (min-width: 75em) {
  .half-half-with-media.has-more-enabled .more-wrapper__content {
    margin-bottom: 62.5px;
  }
}

@media all and (min-width: 87.5em) {
  .half-half-with-media.has-more-enabled .more-wrapper__content {
    margin-bottom: 72.9166666667px;
  }
}

@media all and (min-width: 100em) {
  .half-half-with-media.has-more-enabled .more-wrapper__content {
    margin-bottom: 83.3333333333px;
  }
}

@media all and (min-width: 112.5em) {
  .half-half-with-media.has-more-enabled .more-wrapper__content {
    margin-bottom: 93.75px;
  }
}

@media all and (min-width: 120em) {
  .half-half-with-media.has-more-enabled .more-wrapper__content {
    margin-bottom: 100px;
  }
}

@media all and (min-width: 61.25em) {
  .half-half-with-media.has-more-enabled .js-view-more {
    display: block;
  }
}

.half-half-with-media .social-share.need-share-button > img {
  max-width: 87px;
  max-width: 45px;
}

@media all and (min-width: 75em) {
  .half-half-with-media .social-share.need-share-button > img {
    max-width: 54.375px;
  }
}

@media all and (min-width: 87.5em) {
  .half-half-with-media .social-share.need-share-button > img {
    max-width: 63.4375px;
  }
}

@media all and (min-width: 100em) {
  .half-half-with-media .social-share.need-share-button > img {
    max-width: 72.5px;
  }
}

@media all and (min-width: 112.5em) {
  .half-half-with-media .social-share.need-share-button > img {
    max-width: 81.5625px;
  }
}

@media all and (min-width: 120em) {
  .half-half-with-media .social-share.need-share-button > img {
    max-width: 87px;
  }
}

.two-column-list-w-header {
  padding-right: 34px;
  padding-left: 34px;
  padding-top: 34px;
  padding-bottom: 34px;
}

@media all and (min-width: 42.5em) {
  .two-column-list-w-header {
    padding-right: 61.9791666667px;
    padding-left: 61.9791666667px;
  }
}

@media all and (min-width: 48.0625em) {
  .two-column-list-w-header {
    padding-right: 70.0911458333px;
    padding-left: 70.0911458333px;
  }
}

@media all and (min-width: 61.25em) {
  .two-column-list-w-header {
    padding-right: 89.3229166667px;
    padding-left: 89.3229166667px;
  }
}

@media all and (min-width: 75em) {
  .two-column-list-w-header {
    padding-right: 109.375px;
    padding-left: 109.375px;
  }
}

@media all and (min-width: 87.5em) {
  .two-column-list-w-header {
    padding-right: 127.604166667px;
    padding-left: 127.604166667px;
  }
}

@media all and (min-width: 100em) {
  .two-column-list-w-header {
    padding-right: 145.833333333px;
    padding-left: 145.833333333px;
  }
}

@media all and (min-width: 112.5em) {
  .two-column-list-w-header {
    padding-right: 164.0625px;
    padding-left: 164.0625px;
  }
}

@media all and (min-width: 120em) {
  .two-column-list-w-header {
    padding-right: 175px;
    padding-left: 175px;
  }
}

@media all and (min-width: 42.5em) {
  .two-column-list-w-header {
    padding-top: 42.5px;
    padding-bottom: 42.5px;
  }
}

@media all and (min-width: 48.0625em) {
  .two-column-list-w-header {
    padding-top: 48.0625px;
    padding-bottom: 48.0625px;
  }
}

@media all and (min-width: 61.25em) {
  .two-column-list-w-header {
    padding-top: 61.25px;
    padding-bottom: 61.25px;
  }
}

@media all and (min-width: 75em) {
  .two-column-list-w-header {
    padding-top: 75px;
    padding-bottom: 75px;
  }
}

@media all and (min-width: 87.5em) {
  .two-column-list-w-header {
    padding-top: 87.5px;
    padding-bottom: 87.5px;
  }
}

@media all and (min-width: 100em) {
  .two-column-list-w-header {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

@media all and (min-width: 112.5em) {
  .two-column-list-w-header {
    padding-top: 112.5px;
    padding-bottom: 112.5px;
  }
}

@media all and (min-width: 120em) {
  .two-column-list-w-header {
    padding-top: 120px;
    padding-bottom: 120px;
  }
}

.two-column-list-w-header > .c-heading {
  margin-bottom: 12px;
}

.two-column-list-w-header .content-grid {
  display: -ms-grid;
  display: grid;
  -webkit-align-items: start;
  -ms-flex-align: start;
  align-items: start;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  grid-column-gap: 0;
}

@media all and (min-width: 42.5em) {
  .two-column-list-w-header .content-grid {
    -ms-grid-columns: 1fr 64px 1fr;
    grid-template-columns: 1fr 64px 1fr;
  }
}

@media all and (min-width: 48.0625em) {
  .two-column-list-w-header .content-grid {
    -ms-grid-columns: 1fr 128px 1fr;
    grid-template-columns: 1fr 128px 1fr;
  }
}

.two-column-list-w-header .content-grid__item {
  -ms-grid-row-align: start;
  grid-row-align: start;
}

.two-column-list-w-header .content-grid__item:first-child {
  -ms-grid-column: 1;
  grid-column-start: 1;
  -ms-grid-row: 1;
  grid-row-start: 1;
}

.two-column-list-w-header .content-grid__item:last-child {
  -ms-grid-column: 1;
  grid-column-start: 1;
  -ms-grid-row: 2;
  grid-row-start: 2;
}

@media all and (min-width: 42.5em) {
  .two-column-list-w-header .content-grid__item:first-child {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
  .two-column-list-w-header .content-grid__item:last-child {
    -ms-grid-column: 3;
    grid-column-start: 3;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
}

.two-column-list-w-header .content-list__item {
  margin-bottom: 25px;
  text-align: center;
}

.two-column-list-w-header .content-list__item .c-heading {
  margin: 0 0 8px 0;
}

@media all and (min-width: 42.5em) {
  .two-column-list-w-header .content-list__item {
    text-align: left;
  }
}

@media all and (min-width: 48.0625em) {
  .two-column-list-w-header .content-list__item {
    margin-bottom: 50px;
  }
}

.video-block {
  position: relative;
  height: 100%;
}

.video-block--gutter {
  margin: 0;
  padding: 34px;
}

@media all and (min-width: 61.25em) {
  .video-block--gutter {
    padding: 40.8333333333px;
  }
}

@media all and (min-width: 75em) {
  .video-block--gutter {
    padding: 50px;
  }
}

@media all and (min-width: 87.5em) {
  .video-block--gutter {
    padding: 58.3333333333px;
  }
}

@media all and (min-width: 100em) {
  .video-block--gutter {
    padding: 66.6666666667px;
  }
}

@media all and (min-width: 112.5em) {
  .video-block--gutter {
    padding: 75px;
  }
}

@media all and (min-width: 120em) {
  .video-block--gutter {
    padding: 80px;
  }
}

@media all and (max-width: 42.4375em) {
  .video-block.video-block--gutter .video-container .c-heading, .video-block.video-block--gutter .video-container .c-copy {
    display: none;
  }
}

.play-button {
  position: relative;
}

.play-button.c-icon--play {
  max-width: 80px;
  max-height: 80px;
}

@media all and (min-width: 42.5em) {
  .play-button.c-icon--play {
    max-width: 50px;
    max-height: 50px;
  }
}

@media all and (min-width: 48.0625em) {
  .play-button.c-icon--play {
    max-width: 60px;
    max-height: 60px;
  }
}

@media all and (min-width: 61.25em) {
  .play-button.c-icon--play {
    max-width: 77px;
    max-height: 77px;
  }
}

@media all and (min-width: 93.75em) {
  .play-button {
    position: absolute;
    -webkit-transform: translate3d(-50%, 100%, 0);
    transform: translate3d(-50%, 100%, 0);
    left: 50%;
    bottom: -22px;
  }
}

.home .header.video-block .play-button.c-icon--play {
  max-width: 40px;
  max-height: 40px;
}

.home .header.video-block .play-button.c-icon--play.ready {
  opacity: .5;
}

@media all and (min-width: 42.5em) {
  .home .header.video-block .play-button.c-icon--play.c-icon--play {
    max-width: 50px;
    max-height: 50px;
  }
}

@media all and (min-width: 48.0625em) {
  .home .header.video-block .play-button.c-icon--play.c-icon--play {
    max-width: 60px;
    max-height: 60px;
  }
}

@media all and (min-width: 61.25em) {
  .home .header.video-block .play-button.c-icon--play.c-icon--play {
    max-width: 77px;
    max-height: 77px;
  }
}

.in-the-news {
  padding-top: 34px;
  padding-bottom: 34px;
  padding-right: 34px;
  padding-left: 34px;
}

@media all and (min-width: 42.5em) {
  .in-the-news {
    padding-top: 42.5px;
    padding-bottom: 42.5px;
  }
}

@media all and (min-width: 48.0625em) {
  .in-the-news {
    padding-top: 48.0625px;
    padding-bottom: 48.0625px;
  }
}

@media all and (min-width: 61.25em) {
  .in-the-news {
    padding-top: 61.25px;
    padding-bottom: 61.25px;
  }
}

@media all and (min-width: 75em) {
  .in-the-news {
    padding-top: 75px;
    padding-bottom: 75px;
  }
}

@media all and (min-width: 87.5em) {
  .in-the-news {
    padding-top: 87.5px;
    padding-bottom: 87.5px;
  }
}

@media all and (min-width: 100em) {
  .in-the-news {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

@media all and (min-width: 112.5em) {
  .in-the-news {
    padding-top: 112.5px;
    padding-bottom: 112.5px;
  }
}

@media all and (min-width: 120em) {
  .in-the-news {
    padding-top: 120px;
    padding-bottom: 120px;
  }
}

@media all and (min-width: 42.5em) {
  .in-the-news {
    padding-right: 61.9791666667px;
    padding-left: 61.9791666667px;
  }
}

@media all and (min-width: 48.0625em) {
  .in-the-news {
    padding-right: 70.0911458333px;
    padding-left: 70.0911458333px;
  }
}

@media all and (min-width: 61.25em) {
  .in-the-news {
    padding-right: 89.3229166667px;
    padding-left: 89.3229166667px;
  }
}

@media all and (min-width: 75em) {
  .in-the-news {
    padding-right: 109.375px;
    padding-left: 109.375px;
  }
}

@media all and (min-width: 87.5em) {
  .in-the-news {
    padding-right: 127.604166667px;
    padding-left: 127.604166667px;
  }
}

@media all and (min-width: 100em) {
  .in-the-news {
    padding-right: 145.833333333px;
    padding-left: 145.833333333px;
  }
}

@media all and (min-width: 112.5em) {
  .in-the-news {
    padding-right: 164.0625px;
    padding-left: 164.0625px;
  }
}

@media all and (min-width: 120em) {
  .in-the-news {
    padding-right: 175px;
    padding-left: 175px;
  }
}

.new-notable__header {
  padding-right: 34px;
  padding-left: 34px;
}

@media all and (min-width: 42.5em) {
  .new-notable__header {
    padding-right: 61.9791666667px;
    padding-left: 61.9791666667px;
  }
}

@media all and (min-width: 48.0625em) {
  .new-notable__header {
    padding-right: 70.0911458333px;
    padding-left: 70.0911458333px;
  }
}

@media all and (min-width: 61.25em) {
  .new-notable__header {
    padding-right: 89.3229166667px;
    padding-left: 89.3229166667px;
  }
}

@media all and (min-width: 75em) {
  .new-notable__header {
    padding-right: 109.375px;
    padding-left: 109.375px;
  }
}

@media all and (min-width: 87.5em) {
  .new-notable__header {
    padding-right: 127.604166667px;
    padding-left: 127.604166667px;
  }
}

@media all and (min-width: 100em) {
  .new-notable__header {
    padding-right: 145.833333333px;
    padding-left: 145.833333333px;
  }
}

@media all and (min-width: 112.5em) {
  .new-notable__header {
    padding-right: 164.0625px;
    padding-left: 164.0625px;
  }
}

@media all and (min-width: 120em) {
  .new-notable__header {
    padding-right: 175px;
    padding-left: 175px;
  }
}

.theme--red {
  background: #f7ddd5;
}

.theme--red .c-heading {
  color: #d4603b;
}

.theme--red .button {
  background: #d4603b;
}

.theme--red .button:hover {
  color: #fff;
}

.theme--red a.c-copy {
  color: #d4603b;
}

.theme--red .c-copy {
  color: #6c6c6c;
}

.theme--yellow {
  background: #f7efdc;
}

.theme--yellow .c-heading {
  color: #a38b52;
}

.theme--yellow a.c-copy {
  color: #a38b52;
}

.theme--yellow .c-copy {
  color: #6c6c6c;
}

.theme--yellow .button {
  background: #a38b52;
  color: #fff !important;
  text-decoration: none;
}

.theme--yellow .button:hover {
  color: #fff;
}

.theme--blue {
  background: #b2d7e1;
}

.theme--blue .c-heading {
  color: #367892;
}

.theme--blue a.c-copy {
  color: #367892;
}

.theme--blue .button {
  background: #367892;
  color: #fff !important;
}

.theme--blue .button:hover {
  color: #fff;
}

.theme--blue .c-copy {
  color: #6c6c6c;
}

.theme--blue-6 {
  background: #b2d7e1;
}

.theme--blue-6 .c-subheading {
  color: #76a8bc;
}

.theme--blue-6 .c-heading {
  color: #314682;
}

.theme--blue-6 .c-copy {
  color: #6c6c6c;
}

.theme--blue-6 .button {
  background: #314682;
}

.theme--blue-6 .button:hover {
  color: #fff;
}

.theme--blue-7 {
  background: #e6f0f5;
}

.theme--blue-7 .c-subheading {
  color: #76a8bc;
}

.theme--blue-7 .c-heading {
  color: #314682;
}

.theme--blue-7 .c-copy {
  color: #6c6c6c;
}

.theme--blue-7 .button {
  background: #314682;
}

.theme--blue-7 .button:hover {
  color: #fff;
}

.theme--blue-8 {
  background: #FFF;
}

.theme--blue-8 .c-subheading {
  color: #76a8bc;
}

.theme--blue-8 .c-heading {
  color: #314682;
}

.theme--blue-8 .c-copy {
  color: #6c6c6c;
}

.theme--blue-8 .button {
  background: #314682;
  color: #fff;
}

.theme--blue-8 .button:hover {
  color: #fff;
}

.half-half-with-media .theme--blue-6::after {
  border-top-color: #b2d7e1;
  border-bottom-color: transparent;
  border-left-color: transparent;
  border-right-color: transparent;
}

@media all and (min-width: 61.25em) {
  .half-half-with-media .theme--blue-6::after {
    border-left-color: #b2d7e1;
    border-right-color: transparent;
    border-top-color: transparent;
    border-bottom-color: transparent;
  }
}

.half-half-with-media .theme--blue-6 .js-view-more {
  color: #757575;
}

.half-half-with-media .theme--blue-6 .js-view-more:hover {
  color: #757575;
}

.half-half-with-media .theme--blue-6 .more-wrapper__outer::after {
  background-image: linear-gradient(to top, #b2d7e1 0%, #b2d7e1 55%, rgba(178, 215, 225, 0) 100%);
}

.half-half-with-media .theme--blue-7::after {
  border-top-color: #e6f0f5;
  border-bottom-color: transparent;
  border-left-color: transparent;
  border-right-color: transparent;
}

@media all and (min-width: 61.25em) {
  .half-half-with-media .theme--blue-7::after {
    border-left-color: #e6f0f5;
    border-right-color: transparent;
    border-top-color: transparent;
    border-bottom-color: transparent;
  }
}

.half-half-with-media .theme--blue-7 .more-wrapper__outer::after {
  background-image: linear-gradient(to top, #e6f0f5 0%, rgba(230, 240, 245, 0.8) 35%, rgba(230, 240, 245, 0) 100%);
}

.half-half-with-media--copy-right .theme--blue-6::after {
  border-top-color: #b2d7e1;
  border-bottom-color: transparent;
  border-left-color: transparent;
  border-right-color: transparent;
}

@media all and (min-width: 61.25em) {
  .half-half-with-media--copy-right .theme--blue-6::after {
    border-right-color: #b2d7e1;
    border-left-color: transparent;
    border-top-color: transparent;
    border-bottom-color: transparent;
  }
}

.half-half-with-media--copy-right .theme--blue-7::after {
  border-top-color: #e6f0f5;
  border-bottom-color: transparent;
  border-left-color: transparent;
  border-right-color: transparent;
}

@media all and (min-width: 61.25em) {
  .half-half-with-media--copy-right .theme--blue-7::after {
    border-right-color: #e6f0f5;
    border-left-color: transparent;
    border-top-color: transparent;
    border-bottom-color: transparent;
  }
}

.about-step .c-heading--60 {
  font-size: 18px;
  line-height: normal;
  letter-spacing: normal;
  margin-bottom: 12px;
}

@media all and (min-width: 42.5em) {
  .about-step .c-heading--60 {
    font-size: 19.2083333333px;
  }
}

@media all and (min-width: 48.0625em) {
  .about-step .c-heading--60 {
    font-size: 21.5260416667px;
  }
}

@media all and (min-width: 61.25em) {
  .about-step .c-heading--60 {
    font-size: 27.0208333333px;
  }
}

@media all and (min-width: 75em) {
  .about-step .c-heading--60 {
    font-size: 32.75px;
  }
}

@media all and (min-width: 87.5em) {
  .about-step .c-heading--60 {
    font-size: 37.9583333333px;
  }
}

@media all and (min-width: 100em) {
  .about-step .c-heading--60 {
    font-size: 43.1666666667px;
  }
}

@media all and (min-width: 112.5em) {
  .about-step .c-heading--60 {
    font-size: 48.375px;
  }
}

@media screen and (min-width: 1920px) {
  .about-step .c-heading--60 {
    font-size: 50px;
  }
}

.about-step a.c-copy {
  color: #76a8bc !important;
  text-decoration: underline;
}

.about-step .image-container {
  position: relative;
  -ms-grid-column: 1;
  grid-column-start: 1;
  grid-column-end: 4;
  -ms-grid-row: 2;
  grid-row-start: 2;
}

.about-step .copy-container {
  -ms-grid-column: 1;
  grid-column-start: 1;
  grid-column-end: 4;
  -ms-grid-row: 1;
  grid-row-start: 1;
  margin: 0 !important;
  padding-top: 0;
  padding-left: 34px;
  padding-right: 34px;
}

.about-step .copy-container p {
  max-width: 525px;
}

@media all and (min-width: 42.5em) {
  .about-step .copy-container {
    padding-left: 97.0416666667px;
    padding-right: 97.0416666667px;
  }
}

@media all and (min-width: 48.0625em) {
  .about-step .copy-container {
    padding-left: 109.742708333px;
    padding-right: 109.742708333px;
  }
}

@media all and (min-width: 61.25em) {
  .about-step .copy-container {
    padding-left: 139.854166667px;
    padding-right: 139.854166667px;
  }
}

@media all and (min-width: 75em) {
  .about-step .copy-container {
    padding-left: 171.25px;
    padding-right: 171.25px;
  }
}

@media all and (min-width: 87.5em) {
  .about-step .copy-container {
    padding-left: 199.791666667px;
    padding-right: 199.791666667px;
  }
}

@media all and (min-width: 100em) {
  .about-step .copy-container {
    padding-left: 228.333333333px;
    padding-right: 228.333333333px;
  }
}

@media all and (min-width: 112.5em) {
  .about-step .copy-container {
    padding-left: 256.875px;
    padding-right: 256.875px;
  }
}

@media all and (min-width: 120em) {
  .about-step .copy-container {
    padding-left: 274px;
    padding-right: 274px;
  }
}

.about-step.image-position--left .image-container {
  -ms-grid-column: 1;
  grid-column-start: 1;
  grid-column-end: 4;
  -ms-grid-row: 2;
  grid-row-start: 2;
}

@media all and (min-width: 42.5em) {
  .about-step .image-container {
    position: relative;
    -ms-grid-column: 3;
    grid-column-start: 3;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
  .about-step.image-position--left .copy-container {
    -ms-grid-column: 3;
    grid-column-start: 3;
    -ms-grid-row: 1;
    grid-row-start: 1;
    padding-left: 0;
    padding-right: 34px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 42.5em) {
  .about-step.image-position--left .copy-container {
    padding-right: 97.0416666667px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 48.0625em) {
  .about-step.image-position--left .copy-container {
    padding-right: 109.742708333px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 61.25em) {
  .about-step.image-position--left .copy-container {
    padding-right: 139.854166667px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 75em) {
  .about-step.image-position--left .copy-container {
    padding-right: 171.25px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 87.5em) {
  .about-step.image-position--left .copy-container {
    padding-right: 199.791666667px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 100em) {
  .about-step.image-position--left .copy-container {
    padding-right: 228.333333333px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 112.5em) {
  .about-step.image-position--left .copy-container {
    padding-right: 256.875px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 120em) {
  .about-step.image-position--left .copy-container {
    padding-right: 274px;
  }
}

@media all and (min-width: 42.5em) {
  .about-step.image-position--left .image-container {
    -ms-grid-column: 1;
    grid-column-start: 1;
    grid-column-end: 1;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
  .about-step.image-position--right .copy-container {
    -ms-grid-column: 1;
    grid-column-start: 1;
    grid-column-end: 1;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
  .about-step.image-position--right .copy-container {
    margin: 0 !important;
    padding-right: 0;
    padding-left: 34px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 42.5em) {
  .about-step.image-position--right .copy-container {
    padding-left: 97.0416666667px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 48.0625em) {
  .about-step.image-position--right .copy-container {
    padding-left: 109.742708333px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 61.25em) {
  .about-step.image-position--right .copy-container {
    padding-left: 139.854166667px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 75em) {
  .about-step.image-position--right .copy-container {
    padding-left: 171.25px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 87.5em) {
  .about-step.image-position--right .copy-container {
    padding-left: 199.791666667px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 100em) {
  .about-step.image-position--right .copy-container {
    padding-left: 228.333333333px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 112.5em) {
  .about-step.image-position--right .copy-container {
    padding-left: 256.875px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 120em) {
  .about-step.image-position--right .copy-container {
    padding-left: 274px;
  }
}

.about-step01 {
  z-index: 4;
}

.about-step01 .image-container {
  width: 100%;
  max-width: 1002px;
  left: 15%;
  margin-top: -10%;
}

@media all and (min-width: 42.5em) {
  .about-step01 .c-heading {
    margin-top: -30%;
  }
  .about-step01 .image-container {
    margin-top: 0;
    width: 124.5%;
  }
}

.about-step02 {
  z-index: 3;
}

.about-step02 .image-container {
  margin-top: -10%;
  max-width: 923px;
  width: 100%;
  left: -5%;
}

@media all and (min-width: 42.5em) {
  .about-step02 {
    margin-top: -15%;
  }
  .about-step02 .c-heading {
    margin-top: 26%;
  }
  .about-step02 .image-container {
    margin-top: 0;
  }
}

.about-step03 {
  z-index: 2;
}

.about-step03 .image-container {
  margin-top: -10%;
  max-width: 923px;
  left: -5%;
  width: 105.5%;
}

@media all and (min-width: 42.5em) {
  .about-step03 {
    margin-top: -11.5%;
  }
  .about-step03 .c-heading {
    margin-top: 32%;
  }
  .about-step03 .image-container {
    left: auto;
    margin-top: 0;
  }
}

.about-step04 {
  z-index: 1;
}

.about-step04 .image-container {
  max-width: 1164px;
  width: 100%;
}

@media all and (min-width: 42.5em) {
  .about-step04 {
    margin-top: -7%;
  }
  .about-step04 .c-heading {
    margin-top: 35%;
  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .about-step01, .about-step02, .about-step03, .about-step04 {
    margin-top: 0;
  }
  .about-step01 .copy-container, .about-step02 .copy-container, .about-step03 .copy-container, .about-step04 .copy-container {
    -ms-grid-row-align: center;
  }
  .about-step01 .copy-container .c-heading, .about-step02 .copy-container .c-heading, .about-step03 .copy-container .c-heading, .about-step04 .copy-container .c-heading {
    margin-top: 0;
  }
}

.copy-grid {
  display: -ms-grid;
  display: grid;
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  -ms-grid-columns: 1fr 10px 1fr;
  grid-template-columns: 1fr 10px 1fr;
}

@media all and (min-width: 42.5em) {
  .copy-grid {
    -ms-grid-columns: 1fr 20px 1fr;
    grid-template-columns: 1fr 20px 1fr;
  }
}

@media all and (min-width: 48.0625em) {
  .copy-grid {
    -ms-grid-columns: 1fr 50px 1fr;
    grid-template-columns: 1fr 50px 1fr;
  }
}

.communities-served {
  padding-right: 34px;
  padding-left: 34px;
  padding-top: 34px;
  padding-bottom: 34px;
}

@media all and (min-width: 42.5em) {
  .communities-served {
    padding-right: 61.9791666667px;
    padding-left: 61.9791666667px;
  }
}

@media all and (min-width: 48.0625em) {
  .communities-served {
    padding-right: 70.0911458333px;
    padding-left: 70.0911458333px;
  }
}

@media all and (min-width: 61.25em) {
  .communities-served {
    padding-right: 89.3229166667px;
    padding-left: 89.3229166667px;
  }
}

@media all and (min-width: 75em) {
  .communities-served {
    padding-right: 109.375px;
    padding-left: 109.375px;
  }
}

@media all and (min-width: 87.5em) {
  .communities-served {
    padding-right: 127.604166667px;
    padding-left: 127.604166667px;
  }
}

@media all and (min-width: 100em) {
  .communities-served {
    padding-right: 145.833333333px;
    padding-left: 145.833333333px;
  }
}

@media all and (min-width: 112.5em) {
  .communities-served {
    padding-right: 164.0625px;
    padding-left: 164.0625px;
  }
}

@media all and (min-width: 120em) {
  .communities-served {
    padding-right: 175px;
    padding-left: 175px;
  }
}

@media all and (min-width: 42.5em) {
  .communities-served {
    padding-top: 42.5px;
  }
}

@media all and (min-width: 48.0625em) {
  .communities-served {
    padding-top: 48.0625px;
  }
}

@media all and (min-width: 61.25em) {
  .communities-served {
    padding-top: 61.25px;
  }
}

@media all and (min-width: 75em) {
  .communities-served {
    padding-top: 75px;
  }
}

@media all and (min-width: 87.5em) {
  .communities-served {
    padding-top: 87.5px;
    padding-bottom: 35;
  }
}

@media all and (min-width: 100em) {
  .communities-served {
    padding-top: 100px;
    padding-bottom: 40;
  }
}

@media all and (min-width: 112.5em) {
  .communities-served {
    padding-top: 112.5px;
    padding-bottom: 45;
  }
}

@media all and (min-width: 120em) {
  .communities-served {
    padding-top: 120px;
    padding-bottom: 3em;
  }
}

.communities-served .content-grid {
  display: -ms-grid;
  display: grid;
  -webkit-align-items: start;
  -ms-flex-align: start;
  align-items: start;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  grid-column-gap: 0;
}

@media all and (min-width: 42.5em) {
  .communities-served .content-grid {
    -ms-grid-columns: 1fr 60px 1fr 60px 1fr;
    grid-template-columns: 1fr 60px 1fr 60px 1fr;
  }
}

@media all and (min-width: 61.25em) {
  .communities-served .content-grid {
    -ms-grid-columns: 1fr 150px 1fr 150px 1fr;
    grid-template-columns: 1fr 150px 1fr 150px 1fr;
  }
}

.communities-served .content-grid__item {
  -ms-grid-row-align: start;
  grid-row-align: start;
}

.communities-served .content-grid__item:nth-child(1) {
  -ms-grid-row-align: start;
  grid-row-align: start;
  -ms-grid-column: 1;
  grid-column-start: 1;
  -ms-grid-row: 1;
  grid-row-start: 1;
}

.communities-served .content-grid__item:nth-child(2) {
  -ms-grid-row-align: start;
  grid-row-align: start;
  -ms-grid-column: 1;
  grid-column-start: 1;
  -ms-grid-row: 2;
  grid-row-start: 2;
}

.communities-served .content-grid__item:nth-child(3) {
  -ms-grid-row-align: start;
  grid-row-align: start;
  -ms-grid-column: 1;
  grid-column-start: 1;
  -ms-grid-row: 3;
  grid-row-start: 3;
}

@media all and (min-width: 42.5em) {
  .communities-served .content-grid__item:nth-child(1) {
    -ms-grid-row-align: start;
    grid-row-align: start;
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
  .communities-served .content-grid__item:nth-child(2) {
    -ms-grid-row-align: start;
    grid-row-align: start;
    -ms-grid-column: 3;
    grid-column-start: 3;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
  .communities-served .content-grid__item:nth-child(3) {
    -ms-grid-row-align: start;
    grid-row-align: start;
    -ms-grid-column: 5;
    grid-column-start: 5;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
}

.communities-served .entry-groups__group {
  text-align: center;
}

.communities-served .entry-groups__group .c-subheading {
  margin-bottom: 8px;
}

@media all and (min-width: 61.25em) {
  .communities-served .entry-groups__group .c-subheading {
    margin-bottom: 9.1875px;
  }
}

@media all and (min-width: 75em) {
  .communities-served .entry-groups__group .c-subheading {
    margin-bottom: 11.25px;
  }
}

@media all and (min-width: 87.5em) {
  .communities-served .entry-groups__group .c-subheading {
    margin-bottom: 13.125px;
  }
}

@media all and (min-width: 100em) {
  .communities-served .entry-groups__group .c-subheading {
    margin-bottom: 15px;
  }
}

@media all and (min-width: 112.5em) {
  .communities-served .entry-groups__group .c-subheading {
    margin-bottom: 16.875px;
  }
}

@media all and (min-width: 120em) {
  .communities-served .entry-groups__group .c-subheading {
    margin-bottom: 18px;
  }
}

@media all and (min-width: 42.5em) {
  .communities-served .entry-groups__group {
    text-align: left;
  }
}

.communities-served .entry-groups__group ul li.c-copy--sans-serif {
  font-size: 12px;
  letter-spacing: 0.13px;
  color: #747474;
  margin-bottom: 10px;
  text-align: center;
}

@media all and (min-width: 61.25em) {
  .communities-served .entry-groups__group ul li.c-copy--sans-serif {
    font-size: 14.0508333333px;
  }
}

@media all and (min-width: 75em) {
  .communities-served .entry-groups__group ul li.c-copy--sans-serif {
    font-size: 17.03px;
  }
}

@media all and (min-width: 87.5em) {
  .communities-served .entry-groups__group ul li.c-copy--sans-serif {
    font-size: 19.7383333333px;
  }
}

@media all and (min-width: 100em) {
  .communities-served .entry-groups__group ul li.c-copy--sans-serif {
    font-size: 22.4466666667px;
  }
}

@media all and (min-width: 112.5em) {
  .communities-served .entry-groups__group ul li.c-copy--sans-serif {
    font-size: 25.155px;
  }
}

@media screen and (min-width: 1920px) {
  .communities-served .entry-groups__group ul li.c-copy--sans-serif {
    font-size: 26px;
  }
}

@media all and (min-width: 61.25em) {
  .communities-served .entry-groups__group ul li.c-copy--sans-serif {
    margin-bottom: 11.2291666667px;
  }
}

@media all and (min-width: 75em) {
  .communities-served .entry-groups__group ul li.c-copy--sans-serif {
    margin-bottom: 13.75px;
  }
}

@media all and (min-width: 87.5em) {
  .communities-served .entry-groups__group ul li.c-copy--sans-serif {
    margin-bottom: 16.0416666667px;
  }
}

@media all and (min-width: 100em) {
  .communities-served .entry-groups__group ul li.c-copy--sans-serif {
    margin-bottom: 18.3333333333px;
  }
}

@media all and (min-width: 112.5em) {
  .communities-served .entry-groups__group ul li.c-copy--sans-serif {
    margin-bottom: 20.625px;
  }
}

@media all and (min-width: 120em) {
  .communities-served .entry-groups__group ul li.c-copy--sans-serif {
    margin-bottom: 22px;
  }
}

@media all and (min-width: 42.5em) {
  .communities-served .entry-groups__group ul li.c-copy--sans-serif {
    text-align: left;
  }
}

.page-template-page-insulation .content-block.theme--blue .c-heading--50 {
  font-family: "brandon-grotesque", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  font-feature-settings: 'liga';
  font-variant-numeric: lining-nums;
  margin: 0;
  font-size: 14px;
  letter-spacing: 0.075em;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1.31;
}

@media all and (min-width: 61.25em) {
  .page-template-page-insulation .content-block.theme--blue .c-heading--50 {
    font-size: 15.207325px;
  }
}

@media all and (min-width: 75em) {
  .page-template-page-insulation .content-block.theme--blue .c-heading--50 {
    font-size: 18.4317px;
  }
}

@media all and (min-width: 87.5em) {
  .page-template-page-insulation .content-block.theme--blue .c-heading--50 {
    font-size: 21.36295px;
  }
}

@media all and (min-width: 100em) {
  .page-template-page-insulation .content-block.theme--blue .c-heading--50 {
    font-size: 24.2942px;
  }
}

@media all and (min-width: 112.5em) {
  .page-template-page-insulation .content-block.theme--blue .c-heading--50 {
    font-size: 27.22545px;
  }
}

@media screen and (min-width: 1920px) {
  .page-template-page-insulation .content-block.theme--blue .c-heading--50 {
    font-size: 28.14px;
  }
}

.page-template-page-insulation .content-block.theme--blue .copy-grid {
  display: -ms-grid;
  display: grid;
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  -ms-grid-rows: (1fr)[2];
  grid-template-rows: repeat(2, 1fr);
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}

@media all and (min-width: 42.5em) {
  .page-template-page-insulation .content-block.theme--blue .copy-grid {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: (1fr)[2];
    grid-template-rows: repeat(2, 1fr);
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
  }
}

@media all and (min-width: 48.0625em) {
  .page-template-page-insulation .content-block.theme--blue .copy-grid {
    -ms-grid-columns: 1fr 50px 1fr;
    grid-template-columns: 1fr 50px 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
  }
}

.page-template-page-insulation .content-block.theme--blue.image-position--left .copy-container {
  -ms-grid-column: 1;
  grid-column-start: 1;
  grid-column-end: 1;
  -ms-grid-row: 2;
  grid-row-start: 2;
  grid-row-end: 2;
}

.page-template-page-insulation .content-block.theme--blue.image-position--left .image-container {
  -ms-grid-column: 1;
  grid-column-start: 1;
  grid-column-end: 1;
  -ms-grid-row: 1;
  grid-row-start: 1;
  grid-row-start: 1;
}

@media all and (min-width: 42.5em) {
  .page-template-page-insulation .content-block.theme--blue .copy-container {
    padding-top: 34px;
    padding-bottom: 34px;
    padding-left: 34px;
    padding-right: 34px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 42.5em) {
  .page-template-page-insulation .content-block.theme--blue .copy-container {
    padding-left: 53.125px;
    padding-right: 53.125px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 48.0625em) {
  .page-template-page-insulation .content-block.theme--blue .copy-container {
    padding-left: 60.078125px;
    padding-right: 60.078125px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 61.25em) {
  .page-template-page-insulation .content-block.theme--blue .copy-container {
    padding-left: 76.5625px;
    padding-right: 76.5625px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 75em) {
  .page-template-page-insulation .content-block.theme--blue .copy-container {
    padding-left: 93.75px;
    padding-right: 93.75px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 87.5em) {
  .page-template-page-insulation .content-block.theme--blue .copy-container {
    padding-left: 109.375px;
    padding-right: 109.375px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 100em) {
  .page-template-page-insulation .content-block.theme--blue .copy-container {
    padding-left: 125px;
    padding-right: 125px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 112.5em) {
  .page-template-page-insulation .content-block.theme--blue .copy-container {
    padding-left: 140.625px;
    padding-right: 140.625px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 120em) {
  .page-template-page-insulation .content-block.theme--blue .copy-container {
    padding-left: 150px;
    padding-right: 150px;
  }
}

@media all and (min-width: 42.5em) {
  .page-template-page-insulation .content-block.theme--blue.image-position--left .copy-container {
    -ms-grid-column: 3;
    grid-column-start: 3;
    grid-column-end: 4;
    -ms-grid-row: 1;
    grid-row-start: 1;
    padding-left: 34px;
    padding-right: 34px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 42.5em) {
  .page-template-page-insulation .content-block.theme--blue.image-position--left .copy-container {
    padding-left: 44.2708333333px;
    padding-right: 106.25px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 48.0625em) {
  .page-template-page-insulation .content-block.theme--blue.image-position--left .copy-container {
    padding-left: 50.0651041667px;
    padding-right: 120.15625px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 61.25em) {
  .page-template-page-insulation .content-block.theme--blue.image-position--left .copy-container {
    padding-left: 63.8020833333px;
    padding-right: 153.125px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 75em) {
  .page-template-page-insulation .content-block.theme--blue.image-position--left .copy-container {
    padding-left: 78.125px;
    padding-right: 187.5px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 87.5em) {
  .page-template-page-insulation .content-block.theme--blue.image-position--left .copy-container {
    padding-left: 91.1458333333px;
    padding-right: 218.75px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 100em) {
  .page-template-page-insulation .content-block.theme--blue.image-position--left .copy-container {
    padding-left: 104.166666667px;
    padding-right: 250px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 112.5em) {
  .page-template-page-insulation .content-block.theme--blue.image-position--left .copy-container {
    padding-left: 117.1875px;
    padding-right: 281.25px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 120em) {
  .page-template-page-insulation .content-block.theme--blue.image-position--left .copy-container {
    padding-left: 125px;
    padding-right: 300px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 48.0625em) {
  .page-template-page-insulation .content-block.theme--blue.image-position--left .copy-container .u-margin-bottom-28\@md {
    margin-bottom: 15px;
  }
}

@media all and (min-width: 42.5em) {
  .page-template-page-insulation .content-block.theme--blue.image-position--left .image-container {
    -ms-grid-column: 1;
    grid-column-start: 1;
    grid-column-end: 1;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .fix-live-nation-looping-gif .video-container img {
    -webkit-transform: translate3d(0, -25%, 0);
    transform: translate3d(0, -25%, 0);
    height: auto;
  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .fix-denim-days-video .plyr__video-wrapper video {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .fix-collecting-denim-video .plyr__video-wrapper video {
    -webkit-transform: scale(1.15);
    transform: scale(1.15);
  }
}

.fix-rebuilding-new-orleans-video .plyr__video-wrapper video {
  -webkit-transform: scale(1.255);
  transform: scale(1.255);
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .fix-rebuilding-new-orleans-video .plyr__video-wrapper video {
    -webkit-transform: scale(2);
    transform: scale(2);
  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .fix-great-denim-challenge-video .plyr__video-wrapper video {
    -webkit-transform: scale(1.4);
    transform: scale(1.4);
  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .fix-denim-days-zappos-video .plyr__video-wrapper video {
    -webkit-transform: scale(1.15);
    transform: scale(1.15);
  }
}

.wcd-popup {
  display: none;
}

.wcd-popup.show::after {
  content: '';
  z-index: 999;
  display: block;
  background-color: rgba(0, 0, 0, 0.5);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.wcd-popup.show .wcd-popup--container {
  z-index: 99999;
  opacity: 1;
  position: fixed;
  top: 50%;
  bottom: auto;
  right: auto;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-image: url("/wp-content/themes/BJGG/images/wcd_popup_bg.jpg");
  background-size: cover;
  max-width: 700px;
}

@media all and (min-width: 93.75em) {
  .wcd-popup.show .wcd-popup--container {
    max-width: 1250px;
    width: 100%;
  }
}

.wcd-popup.show .wcd-popup--container .wcd-popup--info .wcd-logo {
  width: 12%;
  min-width: 75px;
}

.wcd-popup.show .wcd-popup--container .wcd-popup--info a {
  text-decoration: none;
}

body.popup-open {
  overflow: hidden;
}

@media all and (min-width: 48.0625em) {
  .page-template-page-vital .content-block:first-of-type .copy-container {
    padding: 0;
  }
}

.page-template-page-vital .left-content {
  z-index: 99;
}

.page-template-page-vital .c-heading--50 {
  font-family: "brandon-grotesque", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  font-feature-settings: 'liga';
  font-variant-numeric: lining-nums;
  margin: 0;
  font-size: 14px;
  letter-spacing: 0.075em;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1.31;
}

@media all and (min-width: 61.25em) {
  .page-template-page-vital .c-heading--50 {
    font-size: 15.207325px;
  }
}

@media all and (min-width: 75em) {
  .page-template-page-vital .c-heading--50 {
    font-size: 18.4317px;
  }
}

@media all and (min-width: 87.5em) {
  .page-template-page-vital .c-heading--50 {
    font-size: 21.36295px;
  }
}

@media all and (min-width: 100em) {
  .page-template-page-vital .c-heading--50 {
    font-size: 24.2942px;
  }
}

@media all and (min-width: 112.5em) {
  .page-template-page-vital .c-heading--50 {
    font-size: 27.22545px;
  }
}

@media screen and (min-width: 1920px) {
  .page-template-page-vital .c-heading--50 {
    font-size: 28.14px;
  }
}

@media all and (min-width: 48.0625em) {
  .page-template-page-vital .u-margin-bottom-28\@md {
    margin-bottom: 15px;
  }
}

.page-template-page-vital .image-container {
  position: relative;
  -ms-grid-column: 1;
  grid-column-start: 1;
  grid-column-end: 4;
  -ms-grid-row: 2;
  grid-row-start: 2;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}

@media all and (max-width: 42.4375em) {
  .page-template-page-vital .copy-grid {
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
  }
}

.page-template-page-vital .copy-container {
  -ms-grid-column: 1;
  grid-column-start: 1;
  grid-column-end: 4;
  -ms-grid-row: 1;
  grid-row-start: 1;
  margin: 0 !important;
  padding: 4em;
}

.page-template-page-vital .steps .copy-container {
  padding-left: 34px;
  padding-right: 34px;
}

@media all and (min-width: 42.5em) {
  .page-template-page-vital .steps .copy-container {
    padding-left: 35.4166666667px;
    padding-right: 35.4166666667px;
  }
}

@media all and (min-width: 48.0625em) {
  .page-template-page-vital .steps .copy-container {
    padding-left: 40.0520833333px;
    padding-right: 40.0520833333px;
  }
}

@media all and (min-width: 61.25em) {
  .page-template-page-vital .steps .copy-container {
    padding-left: 51.0416666667px;
    padding-right: 51.0416666667px;
  }
}

@media all and (min-width: 75em) {
  .page-template-page-vital .steps .copy-container {
    padding-left: 62.5px;
    padding-right: 62.5px;
  }
}

@media all and (min-width: 87.5em) {
  .page-template-page-vital .steps .copy-container {
    padding-left: 72.9166666667px;
    padding-right: 72.9166666667px;
  }
}

@media all and (min-width: 100em) {
  .page-template-page-vital .steps .copy-container {
    padding-left: 83.3333333333px;
    padding-right: 83.3333333333px;
  }
}

@media all and (min-width: 112.5em) {
  .page-template-page-vital .steps .copy-container {
    padding-left: 93.75px;
    padding-right: 93.75px;
  }
}

@media all and (min-width: 120em) {
  .page-template-page-vital .steps .copy-container {
    padding-left: 100px;
    padding-right: 100px;
  }
}

.page-template-page-vital .steps .copy-container .c-subheading--md {
  font-family: "brandon-grotesque", sans-serif;
  font-variant-numeric: lining-nums;
  font-feature-settings: 'liga';
  text-transform: none;
  letter-spacing: normal;
  font-weight: 500;
  font-size: 16px;
}

@media all and (min-width: 48.0625em) {
  .page-template-page-vital .steps .copy-container .c-subheading--md {
    font-size: 17.2208333333px;
  }
}

@media all and (min-width: 61.25em) {
  .page-template-page-vital .steps .copy-container .c-subheading--md {
    font-size: 21.6166666667px;
  }
}

@media all and (min-width: 75em) {
  .page-template-page-vital .steps .copy-container .c-subheading--md {
    font-size: 26.2px;
  }
}

@media all and (min-width: 87.5em) {
  .page-template-page-vital .steps .copy-container .c-subheading--md {
    font-size: 30.3666666667px;
  }
}

@media all and (min-width: 100em) {
  .page-template-page-vital .steps .copy-container .c-subheading--md {
    font-size: 34.5333333333px;
  }
}

@media all and (min-width: 112.5em) {
  .page-template-page-vital .steps .copy-container .c-subheading--md {
    font-size: 38.7px;
  }
}

@media screen and (min-width: 1920px) {
  .page-template-page-vital .steps .copy-container .c-subheading--md {
    font-size: 40px;
  }
}

.page-template-page-vital .image-position--left .copy-container {
  -ms-grid-column: 1;
  grid-column-start: 1;
  grid-column-end: 1;
  -ms-grid-row: 2;
  grid-row-start: 2;
  grid-row-end: 2;
}

.page-template-page-vital .image-position--left .image-container {
  -ms-grid-column: 1;
  grid-column-start: 1;
  grid-column-end: 1;
  -ms-grid-row: 1;
  grid-row-start: 1;
  grid-row-start: 1;
}

.page-template-page-vital .image-position--background .copy-container {
  -ms-grid-column: 1;
  grid-column-start: 1;
  -ms-grid-row: 2;
  grid-row-start: 2;
  grid-row-end: 2;
  z-index: 1;
}

.page-template-page-vital .image-position--background .image-container {
  z-index: 0;
  -ms-grid-column: 1;
  grid-column-start: 1;
  -ms-grid-row: 1;
  grid-row-start: 1;
  grid-row-end: 1;
}

@media all and (min-width: 42.5em) {
  .page-template-page-vital .copy-container {
    padding-top: 34px;
    padding-bottom: 34px;
    padding-left: 34px;
    padding-right: 34px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 42.5em) {
  .page-template-page-vital .copy-container {
    padding-left: 44.2708333333px;
    padding-right: 106.25px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 48.0625em) {
  .page-template-page-vital .copy-container {
    padding-left: 50.0651041667px;
    padding-right: 120.15625px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 61.25em) {
  .page-template-page-vital .copy-container {
    padding-left: 63.8020833333px;
    padding-right: 153.125px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 75em) {
  .page-template-page-vital .copy-container {
    padding-left: 78.125px;
    padding-right: 187.5px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 87.5em) {
  .page-template-page-vital .copy-container {
    padding-left: 91.1458333333px;
    padding-right: 218.75px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 100em) {
  .page-template-page-vital .copy-container {
    padding-left: 104.166666667px;
    padding-right: 250px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 112.5em) {
  .page-template-page-vital .copy-container {
    padding-left: 117.1875px;
    padding-right: 281.25px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 120em) {
  .page-template-page-vital .copy-container {
    padding-left: 125px;
    padding-right: 300px;
  }
}

@media all and (min-width: 42.5em) {
  .page-template-page-vital .image-position {
    position: relative;
    -ms-grid-column: 3;
    grid-column-start: 3;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
  .page-template-page-vital .image-position--left .copy-container {
    -ms-grid-column: 3;
    grid-column-start: 3;
    grid-column-end: 4;
    -ms-grid-row: 1;
    grid-row-start: 1;
    padding-left: 34px;
    padding-right: 34px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 42.5em) {
  .page-template-page-vital .image-position--left .copy-container {
    padding-left: 44.2708333333px;
    padding-right: 106.25px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 48.0625em) {
  .page-template-page-vital .image-position--left .copy-container {
    padding-left: 50.0651041667px;
    padding-right: 120.15625px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 61.25em) {
  .page-template-page-vital .image-position--left .copy-container {
    padding-left: 63.8020833333px;
    padding-right: 153.125px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 75em) {
  .page-template-page-vital .image-position--left .copy-container {
    padding-left: 78.125px;
    padding-right: 187.5px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 87.5em) {
  .page-template-page-vital .image-position--left .copy-container {
    padding-left: 91.1458333333px;
    padding-right: 218.75px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 100em) {
  .page-template-page-vital .image-position--left .copy-container {
    padding-left: 104.166666667px;
    padding-right: 250px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 112.5em) {
  .page-template-page-vital .image-position--left .copy-container {
    padding-left: 117.1875px;
    padding-right: 281.25px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 120em) {
  .page-template-page-vital .image-position--left .copy-container {
    padding-left: 125px;
    padding-right: 300px;
  }
}

@media all and (min-width: 42.5em) {
  .page-template-page-vital .image-position--left .image-container {
    -ms-grid-column: 1;
    grid-column-start: 1;
    grid-column-end: 1;
    -ms-grid-row: 1;
    grid-row-start: 1;
    height: 100%;
  }
  .page-template-page-vital .image-position--right .copy-container {
    -ms-grid-column: 1;
    grid-column-start: 1;
    grid-column-end: 1;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
  .page-template-page-vital .image-position--right .copy-container {
    margin: 0 !important;
    padding-left: 34px;
    padding-right: 34px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 42.5em) {
  .page-template-page-vital .image-position--right .copy-container {
    padding-left: 106.25px;
    padding-right: 44.2708333333px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 48.0625em) {
  .page-template-page-vital .image-position--right .copy-container {
    padding-left: 120.15625px;
    padding-right: 50.0651041667px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 61.25em) {
  .page-template-page-vital .image-position--right .copy-container {
    padding-left: 153.125px;
    padding-right: 63.8020833333px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 75em) {
  .page-template-page-vital .image-position--right .copy-container {
    padding-left: 187.5px;
    padding-right: 78.125px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 87.5em) {
  .page-template-page-vital .image-position--right .copy-container {
    padding-left: 218.75px;
    padding-right: 91.1458333333px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 100em) {
  .page-template-page-vital .image-position--right .copy-container {
    padding-left: 250px;
    padding-right: 104.166666667px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 112.5em) {
  .page-template-page-vital .image-position--right .copy-container {
    padding-left: 281.25px;
    padding-right: 117.1875px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 120em) {
  .page-template-page-vital .image-position--right .copy-container {
    padding-left: 300px;
    padding-right: 125px;
  }
}

@media all and (min-width: 42.5em) {
  .page-template-page-vital .image-position--background .copy-container {
    -ms-grid-column: 1;
    grid-column-start: 1;
    grid-column-end: 2;
    -ms-grid-row: 1;
    grid-row-start: 1;
    z-index: 1;
    padding-left: 34px;
    padding-right: 34px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 42.5em) {
  .page-template-page-vital .image-position--background .copy-container {
    padding-left: 85px;
    padding-right: 85px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 48.0625em) {
  .page-template-page-vital .image-position--background .copy-container {
    padding-left: 96.125px;
    padding-right: 96.125px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 61.25em) {
  .page-template-page-vital .image-position--background .copy-container {
    padding-left: 122.5px;
    padding-right: 122.5px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 75em) {
  .page-template-page-vital .image-position--background .copy-container {
    padding-left: 150px;
    padding-right: 150px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 87.5em) {
  .page-template-page-vital .image-position--background .copy-container {
    padding-left: 175px;
    padding-right: 175px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 100em) {
  .page-template-page-vital .image-position--background .copy-container {
    padding-left: 200px;
    padding-right: 200px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 112.5em) {
  .page-template-page-vital .image-position--background .copy-container {
    padding-left: 225px;
    padding-right: 225px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 120em) {
  .page-template-page-vital .image-position--background .copy-container {
    padding-left: 240px;
    padding-right: 240px;
  }
}

@media all and (min-width: 42.5em) {
  .page-template-page-vital .image-position--background .image-container {
    z-index: 0;
    -ms-grid-column: 1;
    grid-column-start: 1;
    grid-column-end: 4;
    -ms-grid-row: 1;
    grid-row-start: 1;
  }
  .page-template-page-vital .steps .c-subheading {
    letter-spacing: 0.15em;
  }
  .page-template-page-vital .steps .copy-container {
    padding-left: 34px;
    padding-right: 34px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 42.5em) {
  .page-template-page-vital .steps .copy-container {
    padding-right: 60.2083333333px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 48.0625em) {
  .page-template-page-vital .steps .copy-container {
    padding-right: 68.0885416667px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 61.25em) {
  .page-template-page-vital .steps .copy-container {
    padding-left: 35.7291666667px;
    padding-right: 86.7708333333px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 75em) {
  .page-template-page-vital .steps .copy-container {
    padding-left: 43.75px;
    padding-right: 106.25px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 87.5em) {
  .page-template-page-vital .steps .copy-container {
    padding-left: 51.0416666667px;
    padding-right: 123.958333333px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 100em) {
  .page-template-page-vital .steps .copy-container {
    padding-left: 58.3333333333px;
    padding-right: 141.666666667px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 112.5em) {
  .page-template-page-vital .steps .copy-container {
    padding-left: 65.625px;
    padding-right: 159.375px;
  }
}

@media all and (min-width: 42.5em) and (min-width: 120em) {
  .page-template-page-vital .steps .copy-container {
    padding-left: 70px;
    padding-right: 170px;
  }
}

@media all and (min-width: 42.5em) {
  .page-template-page-vital .steps .copy-grid {
    -ms-grid-columns: (1fr)[5];
    grid-template-columns: repeat(5, 1fr);
    -webkit-column-gap: 50px;
    column-gap: 50px;
  }
  .page-template-page-vital .steps .copy-grid .image-container {
    -ms-grid-column: 1;
    grid-column-start: 1;
    grid-column-end: 3;
  }
  .page-template-page-vital .steps .copy-grid .copy-container {
    -ms-grid-column: 3;
    grid-column-start: 3;
    grid-column-end: 6;
  }
  .page-template-page-vital .steps .content-list__item {
    max-width: 330px;
  }
}

.page-template-page-vital .copy-grid {
  display: -ms-grid;
  display: grid;
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  -ms-grid-rows: (1fr)[2];
  grid-template-rows: repeat(2, 1fr);
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
}

@media all and (min-width: 42.5em) {
  .page-template-page-vital .copy-grid {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: (1fr)[2];
    grid-template-rows: repeat(2, 1fr);
  }
}

@media all and (min-width: 48.0625em) {
  .page-template-page-vital .copy-grid {
    -ms-grid-columns: 1fr 50px 1fr;
    grid-template-columns: 1fr 50px 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
  }
}

.page-template-page-vital .full-width .copy-container {
  padding-left: 34px;
  padding-right: 34px;
}

@media all and (min-width: 42.5em) {
  .page-template-page-vital .full-width .copy-container {
    padding-left: 35.4166666667px;
    padding-right: 35.4166666667px;
  }
}

@media all and (min-width: 48.0625em) {
  .page-template-page-vital .full-width .copy-container {
    padding-left: 40.0520833333px;
    padding-right: 40.0520833333px;
  }
}

@media all and (min-width: 61.25em) {
  .page-template-page-vital .full-width .copy-container {
    padding-left: 51.0416666667px;
    padding-right: 51.0416666667px;
  }
}

@media all and (min-width: 75em) {
  .page-template-page-vital .full-width .copy-container {
    padding-left: 62.5px;
    padding-right: 62.5px;
  }
}

@media all and (min-width: 87.5em) {
  .page-template-page-vital .full-width .copy-container {
    padding-left: 72.9166666667px;
    padding-right: 72.9166666667px;
  }
}

@media all and (min-width: 100em) {
  .page-template-page-vital .full-width .copy-container {
    padding-left: 83.3333333333px;
    padding-right: 83.3333333333px;
  }
}

@media all and (min-width: 112.5em) {
  .page-template-page-vital .full-width .copy-container {
    padding-left: 93.75px;
    padding-right: 93.75px;
  }
}

@media all and (min-width: 120em) {
  .page-template-page-vital .full-width .copy-container {
    padding-left: 100px;
    padding-right: 100px;
  }
}

.page-template-page-vital .full-width .copy-grid {
  -ms-grid-rows: 1fr;
  grid-template-rows: 1fr;
}

.page-template-page-vital .full-width .copy-grid .c-copy--22:not(.btn--box-lg) {
  max-width: 600px;
  font-family: "brandon-grotesque", sans-serif;
  font-variant-numeric: lining-nums;
  font-feature-settings: 'liga';
  text-transform: none;
  letter-spacing: normal;
  font-weight: 500;
  font-size: 12px;
}

@media all and (min-width: 48.0625em) {
  .page-template-page-vital .full-width .copy-grid .c-copy--22:not(.btn--box-lg) {
    font-size: 12.0545833333px;
  }
}

@media all and (min-width: 61.25em) {
  .page-template-page-vital .full-width .copy-grid .c-copy--22:not(.btn--box-lg) {
    font-size: 15.1316666667px;
  }
}

@media all and (min-width: 75em) {
  .page-template-page-vital .full-width .copy-grid .c-copy--22:not(.btn--box-lg) {
    font-size: 18.34px;
  }
}

@media all and (min-width: 87.5em) {
  .page-template-page-vital .full-width .copy-grid .c-copy--22:not(.btn--box-lg) {
    font-size: 21.2566666667px;
  }
}

@media all and (min-width: 100em) {
  .page-template-page-vital .full-width .copy-grid .c-copy--22:not(.btn--box-lg) {
    font-size: 24.1733333333px;
  }
}

@media all and (min-width: 112.5em) {
  .page-template-page-vital .full-width .copy-grid .c-copy--22:not(.btn--box-lg) {
    font-size: 27.09px;
  }
}

@media screen and (min-width: 1920px) {
  .page-template-page-vital .full-width .copy-grid .c-copy--22:not(.btn--box-lg) {
    font-size: 28px;
  }
}

.inline-video {
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
}

.mail-your-denim-video {
  position: relative;
  padding-top: 63.4789777411%;
  height: 0;
}

.mail-your-denim-video video {
  -webkit-transform: scale3d(1.08, 1.08, 1.08);
  transform: scale3d(1.08, 1.08, 1.08);
  position: absolute;
  top: 0;
}

@media all and (min-width: 48.0625em) {
  .mail-your-denim-video {
    padding-top: 40%;
  }
}

@media all and (-ms-high-contrast: none) {
  .mail-your-denim-video video {
    -webkit-transform: scale3d(1.25, 1.15, 1.15);
    transform: scale3d(1.25, 1.15, 1.15);
  }
}

[data-marker-styles] {
  display: none !important;
}

.error404 #main-container {
  height: calc(100vh - 86px);
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.error404 #main-container .error-404 {
  background: #f7f7f7;
  height: 100%;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.error404 #main-container .error-404 .page-content {
  padding: 70px 9% 100px;
}

.error404 #main-container .error-404 .page-content img {
  max-width: 200px;
}

@media all and (min-width: 61.25em) {
  .error404 #main-container .error-404 .page-content img {
    max-width: 100%;
  }
}

.error404 #main-container .links {
  max-width: 50%;
  width: 100%;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

@media all and (min-width: 48.0625em) {
  .error404 #main-container .links {
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

@media all and (min-width: 93.75em) {
  .error404 #main-container .links {
    max-width: 70%;
  }
}

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