/*
Theme Name: 	Reach ATS
Theme URI: 		https://alchemy.digital/
Description: 	Theme for Reach ATS
Version: 		3.0
Author: 		Alchemy Digital
Author URI: 	https://alchemy.digital/
Tags:
*/
/*================ UTILS ================*/
/*============================================================================
  Mixins
==============================================================================*/
/*============================================================================
  Mixin - Cover Image
==============================================================================*/
/*============================================================================
  Mixin - Input Placeholder Styles
==============================================================================*/
/*============================================================================
  Mixin - Responsive ratio

  Used for creating scalable elements that maintain the same ratio
  example:
  .element {
    @include responsive-ratio(400, 300);
  }
==============================================================================*/
/*============================================================================
  Mixin - Clear fix
==============================================================================*/
/*============================================================================
  Mixin - Visually Hidden
==============================================================================*/
/*============================================================================
  Mixin - Visually shown
==============================================================================*/
/*============================================================================
  Mixin - Media Queries
==============================================================================*/
/*============================================================================
  Mixin - Keyframes
==============================================================================*/
/*============================================================================
  Mixin - Animation
==============================================================================*/
/*============================================================================
  Mixin - Color Classes
==============================================================================*/
/*============================================================================
  Mixin - Double bg classes
  Removes margin and bottom padding so two module with same background colour look connected
==============================================================================*/
/*============================================================================
  Mixin - Grid
==============================================================================*/
/*============================================================================
  Mixin - Add gridsize to end of classes e.g. "--md" and puts it within the media query
  this is currently mostly used in _grid.scss
==============================================================================*/
/*============================================================================
  Mixin - Font size
==============================================================================*/
/*============================================================================
  Function - strip unit 
==============================================================================*/
/*============================================================================
  Color Variables
==============================================================================*/
/* ---- Colors ---- */
/* ---- Social colors ---- */
/* --- Font colors ---- */
/* --- Border colors ---- */
/* ---- Colors Array - used to create color classes such as "color-white" in typography.scss & layout.scss ---- */
/*============================================================================
  Typography Variables
==============================================================================*/
/* ---- Font line heights ---- */
/* ---- Font sizes ---- */
/* ---- Font weights ---- */
/* ---- Font families ---- */
/*============================================================================
  Padding & Margin Variables
==============================================================================*/
/* ---- Padding ---- */
/* ---- Margin ---- */
/* ---- Grid padding ---- */
/*============================================================================
  Grid Breakpoints and Class Names
==============================================================================*/
/*============================================================================
  Box Shadows
==============================================================================*/
/*============================================================================
  Easing & Transitions
==============================================================================*/
/*============================================================================
  Siteheader
==============================================================================*/
/*============================================================================
  Forms
==============================================================================*/
/*============================================================================
  Buttons
==============================================================================*/
/*============================================================================
  Carousels
==============================================================================*/
/*============================================================================
  BD margins & Page Max Width
==============================================================================*/
/*================= BASE =================*/
/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined in IE 6/7/8/9 and Firefox 3.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block; }

 /**
	* Correct `inline-block` display not defined in IE 6/7/8/9 and Firefox 3.
	*/
audio,
canvas,
video {
  display: inline-block;
  *display: inline;
  *zoom: 1; }

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

 /**
	* Address styling not present in IE 7/8/9, Firefox 3, and Safari 4.
	* Known issue: no IE 6 support.
	*/
[hidden] {
  display: none; }

 /* ==========================================================================
		Base
		========================================================================== */
 /**
	* 1. Correct text resizing oddly in IE 6/7 when body `font-size` is set using
	*    `em` units.
	* 2. Prevent iOS text size adjust after orientation change, without disabling
	*    user zoom.
	*/
html {
  font-size: 100%;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

 /**
	* Address `font-family` inconsistency between `textarea` and other form
	* elements.
	*/
html,
button,
input,
select,
textarea {
  font-family: sans-serif; }

 /**
	* Address margins handled incorrectly in IE 6/7.
	*/
body {
  margin: 0; }

 /* ==========================================================================
		Links
		========================================================================== */
 /**
	* Address `outline` inconsistency between Chrome and other browsers.
	*/
a:focus {
  outline: 0; }

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

 /* ==========================================================================
		Typography
		========================================================================== */
 /**
	* Address font sizes and margins set differently in IE 6/7.
	* Address font sizes within `section` and `article` in Firefox 4+, Safari 5,
	* and Chrome.
	*/
h1 {
  font-size: 2em;
  margin: 0.67em 0; }

h2 {
  font-size: 1.5em;
  margin: 0.83em 0; }

h3 {
  font-size: 1.17em;
  margin: 1em 0; }

h4 {
  font-size: 1em;
  margin: 1.33em 0; }

h5 {
  font-size: 0.83em;
  margin: 1.67em 0; }

h6 {
  font-size: 0.67em;
  margin: 2.33em 0; }

 /**
	* Address styling not present in IE 7/8/9, Safari 5, and Chrome.
	*/
abbr[title] {
  border-bottom: 1px dotted; }

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

blockquote {
  margin: 1em 40px; }

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

 /**
	* Address differences between Firefox and other browsers.
	* Known issue: no IE 6/7 normalization.
	*/
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0; }

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

 /**
	* Address margins set differently in IE 6/7.
	*/
p,
pre {
  margin: 1em 0; }

 /**
	* Correct font family set oddly in IE 6, Safari 4/5, and Chrome.
	*/
code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  _font-family: "courier new", monospace;
  font-size: 1em; }

 /**
	* Improve readability of pre-formatted text in all browsers.
	*/
pre {
  white-space: pre;
  white-space: pre-wrap;
  word-wrap: break-word; }

 /**
	* Address CSS quotes not supported in IE 6/7.
	*/
q {
  quotes: none; }

 /**
	* Address `quotes` property not supported in Safari 4.
	*/
q:before,
q:after {
  content: "";
  content: none; }

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

 /* ==========================================================================
		Lists
		========================================================================== */
 /**
	* Address margins set differently in IE 6/7.
	*/
dl,
menu,
ol,
ul {
  margin: 1em 0; }

dd {
  margin: 0 0 0 40px; }

 /**
	* Address paddings set differently in IE 6/7.
	*/
menu,
ol,
ul {
  padding: 0 0 0 40px; }

 /**
	* Correct list images handled incorrectly in IE 7.
	*/
nav ul,
nav ol {
  list-style: none;
  list-style-image: none; }

 /* ==========================================================================
		Embedded content
		========================================================================== */
 /**
	* 1. Remove border when inside `a` element in IE 6/7/8/9 and Firefox 3.
	* 2. Improve image quality when scaled in IE 7.
	*/
img {
  border: 0;
  /* 1 */
  -ms-interpolation-mode: bicubic;
  /* 2 */ }

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

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

 /* ==========================================================================
		Figures
		========================================================================== */
 /**
	* Address margin not present in IE 6/7/8/9, Safari 5, and Opera 11.
	*/
figure {
  margin: 0; }

 /* ==========================================================================
		Forms
		========================================================================== */
 /**
	* Correct margin displayed oddly in IE 6/7.
	*/
form {
  margin: 0; }

 /**
	* 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 6/7/8/9.
	* 2. Correct text not wrapping in Firefox 3.
	* 3. Correct alignment displayed oddly in IE 6/7.
	*/
legend {
  border: 0;
  /* 1 */
  padding: 0;
  white-space: normal;
  /* 2 */
  *margin-left: -7px;
  /* 3 */ }

 /**
	* 1. Correct font size not being inherited in all browsers.
	* 2. Address margins set differently in IE 6/7, Firefox 3+, Safari 5,
	*    and Chrome.
	* 3. Improve appearance and consistency in all browsers.
	*/
button,
input,
select,
textarea {
  font-size: 100%;
  /* 1 */
  margin: 0;
  /* 2 */
  vertical-align: baseline;
  /* 3 */
  *vertical-align: middle;
  /* 3 */ }

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

 /**
	* 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 Chrome, Safari 5+, and IE 6+.
	* Correct `select` style inheritance in Firefox 4+ and Opera.
	*/
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.
	* 4. Remove inner spacing in IE 7 without affecting normal text inputs.
	*    Known issue: inner spacing remains in IE 6.
	*/
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */
  *overflow: visible;
  /* 4 */ }

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

 /**
	* 1. Address box sizing set to content-box in IE 8/9.
	* 2. Remove excess padding in IE 8/9.
	* 3. Remove excess padding in IE 7.
	*    Known issue: excess padding remains in IE 6.
	*/
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
  *height: 13px;
  /* 3 */
  *width: 13px;
  /* 3 */ }

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

 /**
	* Remove inner padding and search cancel button in Safari 5 and Chrome
	* on OS X.
	*/
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

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

 /**
	* 1. Remove default vertical scrollbar in IE 6/7/8/9.
	* 2. Improve readability and alignment in all browsers.
	*/
textarea {
  overflow: auto;
  /* 1 */
  vertical-align: top;
  /* 2 */ }

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

/* ==========================================================================
  animations -- animations.scss
  ========================================================================== */
/* ==========================================================================
  Accessibility - remove animations for "prefers reduced motion" -- animations.scss
  ========================================================================== */
@media screen and (prefers-reduced-motion: reduce), (update: slow) {
  * {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important; } }
/* ==========================================================================
	Print styling - remove animations for print -- animations.scss
	========================================================================== */
@media print {
  .effect {
    opacity: 1 !important;
    transform: none !important; } }
/* ==========================================================================
	Main effect class -- animations.scss
	========================================================================== */
.effect--default {
  opacity: 0;
  transform: translate(0, 2em);
  transition: opacity 250ms cubic-bezier(0.33, 1, 0.68, 1) 0s, transform 250ms cubic-bezier(0.33, 1, 0.68, 1) 0s; }
  .effect--default.effect--ready, .no-cssanimations .effect--default {
    opacity: 1;
    transform: translate(0, 0); }

/* ==========================================================================
	Custom effect classes -- animations.scss
	========================================================================== */
.effect--fade {
  opacity: 0; }
  .effect--fade.effect--ready, .no-cssanimations .effect--fade {
    opacity: 1; }

.effect--slidein {
  transform: translate(0, 2em); }

.effect--slidein.effect--ready,
.no-cssanimations .effect--slidein {
  transform: translate(0, 0); }

.effect--slidedown {
  transform: translate(0, -2em); }

.effect--slidedown.effect--ready,
.no-cssanimations .effect--slidedown {
  transform: translate(0, 0); }

.effect--slideright {
  transform: translate(-2em, 0); }

.effect--slideright.effect--ready,
.no-cssanimations .effect--slideright {
  transform: translate(0, 0px); }

.effect--slideleft {
  transform: translate(2em, 0px); }

.effect--slideleft.effect--ready,
.no-cssanimations .effect--slideleft {
  transform: translate(0, 0px); }

/* ==========================================================================
	Effect delays -- animations.scss
	========================================================================== */
.effect--delay-1 {
  transition-delay: 150ms; }

.effect--delay-2 {
  transition-delay: 300ms; }

.effect--delay-3 {
  transition-delay: 450ms; }

.effect--delay-4 {
  transition-delay: 600ms; }

.effect--delay-5 {
  transition-delay: 750ms; }

.effect--delay-6 {
  transition-delay: 900ms; }

.effect--delay-7 {
  transition-delay: 1050ms; }

.effect--delay-0 {
  transition-delay: 0ms; }

/* ==========================================================================
	Effect grid delays -- animations.scss
	========================================================================== */
.effect.col-1-2:nth-child(2n + 1) {
  transition-delay: 0ms; }

.effect.col-1-2:nth-child(2n + 2) {
  transition-delay: 150ms; }

.effect.col-1-3:nth-child(3n + 1) {
  transition-delay: 0ms; }

.effect.col-1-3:nth-child(3n + 2) {
  transition-delay: 150ms; }

.effect.col-1-3:nth-child(3n + 3) {
  transition-delay: calc(150ms * 2); }

.effect.col-1-4:nth-child(4n + 1) {
  transition-delay: 0ms; }

.effect.col-1-4:nth-child(4n + 2) {
  transition-delay: 150ms; }

.effect.col-1-4:nth-child(4n + 3) {
  transition-delay: calc(150ms * 2); }

.effect.col-1-4:nth-child(4n + 4) {
  transition-delay: calc(150ms * 3); }

.effect.col-1-5:nth-child(5n + 1) {
  transition-delay: 0ms; }

.effect.col-1-5:nth-child(5n + 2) {
  transition-delay: 150ms; }

.effect.col-1-5:nth-child(5n + 3) {
  transition-delay: calc(150ms * 2); }

.effect.col-1-5:nth-child(5n + 4) {
  transition-delay: calc(150ms * 3); }

.effect.col-1-5:nth-child(5n + 5) {
  transition-delay: calc(150ms * 4); }

.effect.col-1-6:nth-child(6n + 1) {
  transition-delay: 0ms; }

.effect.col-1-6:nth-child(6n + 2) {
  transition-delay: 150ms; }

.effect.col-1-6:nth-child(6n + 3) {
  transition-delay: calc(150ms * 2); }

.effect.col-1-6:nth-child(6n + 4) {
  transition-delay: calc(150ms * 3); }

.effect.col-1-6:nth-child(6n + 5) {
  transition-delay: calc(150ms * 4); }

.effect.col-1-6:nth-child(6n + 6) {
  transition-delay: calc(150ms * 5); }

@media only screen and (min-width: 550px) {
  .effect.col-sm-1-2:nth-child(2n + 1) {
    transition-delay: 0ms; }

  .effect.col-sm-1-2:nth-child(2n + 2) {
    transition-delay: 150ms; }

  .effect.col-sm-1-3:nth-child(3n + 1) {
    transition-delay: 0ms; }

  .effect.col-sm-1-3:nth-child(3n + 2) {
    transition-delay: 150ms; }

  .effect.col-sm-1-3:nth-child(3n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-sm-1-4:nth-child(4n + 1) {
    transition-delay: 0ms; }

  .effect.col-sm-1-4:nth-child(4n + 2) {
    transition-delay: 150ms; }

  .effect.col-sm-1-4:nth-child(4n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-sm-1-4:nth-child(4n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-sm-1-5:nth-child(5n + 1) {
    transition-delay: 0ms; }

  .effect.col-sm-1-5:nth-child(5n + 2) {
    transition-delay: 150ms; }

  .effect.col-sm-1-5:nth-child(5n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-sm-1-5:nth-child(5n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-sm-1-5:nth-child(5n + 5) {
    transition-delay: calc(150ms * 4); }

  .effect.col-sm-1-6:nth-child(6n + 1) {
    transition-delay: 0ms; }

  .effect.col-sm-1-6:nth-child(6n + 2) {
    transition-delay: 150ms; }

  .effect.col-sm-1-6:nth-child(6n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-sm-1-6:nth-child(6n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-sm-1-6:nth-child(6n + 5) {
    transition-delay: calc(150ms * 4); }

  .effect.col-sm-1-6:nth-child(6n + 6) {
    transition-delay: calc(150ms * 5); } }
@media only screen and (min-width: 700px) {
  .effect.col-md-1-2:nth-child(2n + 1) {
    transition-delay: 0ms; }

  .effect.col-md-1-2:nth-child(2n + 2) {
    transition-delay: 150ms; }

  .effect.col-md-1-3:nth-child(3n + 1) {
    transition-delay: 0ms; }

  .effect.col-md-1-3:nth-child(3n + 2) {
    transition-delay: 150ms; }

  .effect.col-md-1-3:nth-child(3n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-md-1-4:nth-child(4n + 1) {
    transition-delay: 0ms; }

  .effect.col-md-1-4:nth-child(4n + 2) {
    transition-delay: 150ms; }

  .effect.col-md-1-4:nth-child(4n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-md-1-4:nth-child(4n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-md-1-5:nth-child(5n + 1) {
    transition-delay: 0ms; }

  .effect.col-md-1-5:nth-child(5n + 2) {
    transition-delay: 150ms; }

  .effect.col-md-1-5:nth-child(5n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-md-1-5:nth-child(5n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-md-1-5:nth-child(5n + 5) {
    transition-delay: calc(150ms * 4); }

  .effect.col-md-1-6:nth-child(6n + 1) {
    transition-delay: 0ms; }

  .effect.col-md-1-6:nth-child(6n + 2) {
    transition-delay: 150ms; }

  .effect.col-md-1-6:nth-child(6n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-md-1-6:nth-child(6n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-md-1-6:nth-child(6n + 5) {
    transition-delay: calc(150ms * 4); }

  .effect.col-md-1-6:nth-child(6n + 6) {
    transition-delay: calc(150ms * 5); } }
@media only screen and (min-width: 1000px) {
  .effect.col-lg-1-2:nth-child(2n + 1) {
    transition-delay: 0ms; }

  .effect.col-lg-1-2:nth-child(2n + 2) {
    transition-delay: 150ms; }

  .effect.col-lg-1-3:nth-child(3n + 1) {
    transition-delay: 0ms; }

  .effect.col-lg-1-3:nth-child(3n + 2) {
    transition-delay: 150ms; }

  .effect.col-lg-1-3:nth-child(3n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-lg-1-4:nth-child(4n + 1) {
    transition-delay: 0ms; }

  .effect.col-lg-1-4:nth-child(4n + 2) {
    transition-delay: 150ms; }

  .effect.col-lg-1-4:nth-child(4n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-lg-1-4:nth-child(4n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-lg-1-5:nth-child(5n + 1) {
    transition-delay: 0ms; }

  .effect.col-lg-1-5:nth-child(5n + 2) {
    transition-delay: 150ms; }

  .effect.col-lg-1-5:nth-child(5n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-lg-1-5:nth-child(5n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-lg-1-5:nth-child(5n + 5) {
    transition-delay: calc(150ms * 4); }

  .effect.col-lg-1-6:nth-child(6n + 1) {
    transition-delay: 0ms; }

  .effect.col-lg-1-6:nth-child(6n + 2) {
    transition-delay: 150ms; }

  .effect.col-lg-1-6:nth-child(6n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-lg-1-6:nth-child(6n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-lg-1-6:nth-child(6n + 5) {
    transition-delay: calc(150ms * 4); }

  .effect.col-lg-1-6:nth-child(6n + 6) {
    transition-delay: calc(150ms * 5); } }
@media only screen and (min-width: 1200px) {
  .effect.col-xl-1-2:nth-child(2n + 1) {
    transition-delay: 0ms; }

  .effect.col-xl-1-2:nth-child(2n + 2) {
    transition-delay: 150ms; }

  .effect.col-xl-1-3:nth-child(3n + 1) {
    transition-delay: 0ms; }

  .effect.col-xl-1-3:nth-child(3n + 2) {
    transition-delay: 150ms; }

  .effect.col-xl-1-3:nth-child(3n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-xl-1-4:nth-child(4n + 1) {
    transition-delay: 0ms; }

  .effect.col-xl-1-4:nth-child(4n + 2) {
    transition-delay: 150ms; }

  .effect.col-xl-1-4:nth-child(4n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-xl-1-4:nth-child(4n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-xl-1-5:nth-child(5n + 1) {
    transition-delay: 0ms; }

  .effect.col-xl-1-5:nth-child(5n + 2) {
    transition-delay: 150ms; }

  .effect.col-xl-1-5:nth-child(5n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-xl-1-5:nth-child(5n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-xl-1-5:nth-child(5n + 5) {
    transition-delay: calc(150ms * 4); }

  .effect.col-xl-1-6:nth-child(6n + 1) {
    transition-delay: 0ms; }

  .effect.col-xl-1-6:nth-child(6n + 2) {
    transition-delay: 150ms; }

  .effect.col-xl-1-6:nth-child(6n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-xl-1-6:nth-child(6n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-xl-1-6:nth-child(6n + 5) {
    transition-delay: calc(150ms * 4); }

  .effect.col-xl-1-6:nth-child(6n + 6) {
    transition-delay: calc(150ms * 5); } }
@media only screen and (min-width: 1400px) {
  .effect.col-ws-1-2:nth-child(2n + 1) {
    transition-delay: 0ms; }

  .effect.col-ws-1-2:nth-child(2n + 2) {
    transition-delay: 150ms; }

  .effect.col-ws-1-3:nth-child(3n + 1) {
    transition-delay: 0ms; }

  .effect.col-ws-1-3:nth-child(3n + 2) {
    transition-delay: 150ms; }

  .effect.col-ws-1-3:nth-child(3n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-ws-1-4:nth-child(4n + 1) {
    transition-delay: 0ms; }

  .effect.col-ws-1-4:nth-child(4n + 2) {
    transition-delay: 150ms; }

  .effect.col-ws-1-4:nth-child(4n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-ws-1-4:nth-child(4n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-ws-1-5:nth-child(5n + 1) {
    transition-delay: 0ms; }

  .effect.col-ws-1-5:nth-child(5n + 2) {
    transition-delay: 150ms; }

  .effect.col-ws-1-5:nth-child(5n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-ws-1-5:nth-child(5n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-ws-1-5:nth-child(5n + 5) {
    transition-delay: calc(150ms * 4); }

  .effect.col-ws-1-6:nth-child(6n + 1) {
    transition-delay: 0ms; }

  .effect.col-ws-1-6:nth-child(6n + 2) {
    transition-delay: 150ms; }

  .effect.col-ws-1-6:nth-child(6n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-ws-1-6:nth-child(6n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-ws-1-6:nth-child(6n + 5) {
    transition-delay: calc(150ms * 4); }

  .effect.col-ws-1-6:nth-child(6n + 6) {
    transition-delay: calc(150ms * 5); } }
@media only screen and (min-width: 1600px) {
  .effect.col-xw-1-2:nth-child(2n + 1) {
    transition-delay: 0ms; }

  .effect.col-xw-1-2:nth-child(2n + 2) {
    transition-delay: 150ms; }

  .effect.col-xw-1-3:nth-child(3n + 1) {
    transition-delay: 0ms; }

  .effect.col-xw-1-3:nth-child(3n + 2) {
    transition-delay: 150ms; }

  .effect.col-xw-1-3:nth-child(3n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-xw-1-4:nth-child(4n + 1) {
    transition-delay: 0ms; }

  .effect.col-xw-1-4:nth-child(4n + 2) {
    transition-delay: 150ms; }

  .effect.col-xw-1-4:nth-child(4n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-xw-1-4:nth-child(4n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-xw-1-5:nth-child(5n + 1) {
    transition-delay: 0ms; }

  .effect.col-xw-1-5:nth-child(5n + 2) {
    transition-delay: 150ms; }

  .effect.col-xw-1-5:nth-child(5n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-xw-1-5:nth-child(5n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-xw-1-5:nth-child(5n + 5) {
    transition-delay: calc(150ms * 4); }

  .effect.col-xw-1-6:nth-child(6n + 1) {
    transition-delay: 0ms; }

  .effect.col-xw-1-6:nth-child(6n + 2) {
    transition-delay: 150ms; }

  .effect.col-xw-1-6:nth-child(6n + 3) {
    transition-delay: calc(150ms * 2); }

  .effect.col-xw-1-6:nth-child(6n + 4) {
    transition-delay: calc(150ms * 3); }

  .effect.col-xw-1-6:nth-child(6n + 5) {
    transition-delay: calc(150ms * 4); }

  .effect.col-xw-1-6:nth-child(6n + 6) {
    transition-delay: calc(150ms * 5); } }
/*  ==========================================================================
	Base typography -- typography.scss
	========================================================================== */
@font-face {
  font-family: "PP Neue Montreal";
  src: url("sass/fonts/ppneuemontreal-bold.woff") format("woff");
  font-weight: 700; }
@font-face {
  font-family: "PP Neue Montreal";
  src: url("sass/fonts/ppneuemontreal-medium.woff") format("woff");
  font-weight: 500; }
@font-face {
  font-family: "PP Neue Montreal";
  src: url("sass/fonts/ppneuemontreal-book.woff") format("woff");
  font-weight: 400; }
@font-face {
  font-family: "PP Neue Montreal";
  src: url("sass/fonts/ppneuemontreal-thin.woff") format("woff");
  font-weight: 200; }
html {
  /* stops fonts displaying bolder on firefox */
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased; }

/*  ==========================================================================
	Heading Styles  -- typography.scss
	========================================================================== */
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0 0 0.25em;
  line-height: 1.2;
  font-weight: 500; }

h1,
.heading-huge {
  font-family: "PP Neue Montreal", serif;
  font-size: 40px;
  line-height: 1; }
  @media only screen and (min-width: 550px) {
    h1,
    .heading-huge {
      font-size: 43px; } }
  @media only screen and (min-width: 700px) {
    h1,
    .heading-huge {
      font-size: 46px; } }
  @media only screen and (min-width: 1000px) {
    h1,
    .heading-huge {
      font-size: 57px; } }
  @media only screen and (min-width: 1200px) {
    h1,
    .heading-huge {
      font-size: 67px; } }
  @media only screen and (min-width: 1400px) {
    h1,
    .heading-huge {
      font-size: 80px; } }
  @media only screen and (min-width: 1600px) {
    h1,
    .heading-huge {
      font-size: 94px; } }

h2,
.heading-large {
  font-family: "PP Neue Montreal", serif;
  font-size: 32px;
  line-height: 1.1; }
  @media only screen and (min-width: 550px) {
    h2,
    .heading-large {
      font-size: 34px; } }
  @media only screen and (min-width: 700px) {
    h2,
    .heading-large {
      font-size: 36px; } }
  @media only screen and (min-width: 1000px) {
    h2,
    .heading-large {
      font-size: 42px; } }
  @media only screen and (min-width: 1200px) {
    h2,
    .heading-large {
      font-size: 48px; } }
  @media only screen and (min-width: 1400px) {
    h2,
    .heading-large {
      font-size: 55px; } }
  @media only screen and (min-width: 1600px) {
    h2,
    .heading-large {
      font-size: 64px; } }

h3,
.heading-med {
  font-family: "PP Neue Montreal", serif;
  font-size: 26px;
  line-height: 1.3; }
  @media only screen and (min-width: 550px) {
    h3,
    .heading-med {
      font-size: 27px; } }
  @media only screen and (min-width: 700px) {
    h3,
    .heading-med {
      font-size: 28px; } }
  @media only screen and (min-width: 1000px) {
    h3,
    .heading-med {
      font-size: 30px; } }
  @media only screen and (min-width: 1200px) {
    h3,
    .heading-med {
      font-size: 33px; } }
  @media only screen and (min-width: 1400px) {
    h3,
    .heading-med {
      font-size: 36px; } }
  @media only screen and (min-width: 1600px) {
    h3,
    .heading-med {
      font-size: 40px; } }

h4,
.heading-reg {
  font-family: "PP Neue Montreal", sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3; }
  @media only screen and (min-width: 550px) {
    h4,
    .heading-reg {
      font-size: 16px; } }
  @media only screen and (min-width: 700px) {
    h4,
    .heading-reg {
      font-size: 16px; } }
  @media only screen and (min-width: 1000px) {
    h4,
    .heading-reg {
      font-size: 17px; } }
  @media only screen and (min-width: 1200px) {
    h4,
    .heading-reg {
      font-size: 18px; } }
  @media only screen and (min-width: 1400px) {
    h4,
    .heading-reg {
      font-size: 19px; } }
  @media only screen and (min-width: 1600px) {
    h4,
    .heading-reg {
      font-size: 20px; } }

h5,
.heading-sml {
  font-family: "PP Neue Montreal", sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4; }
  @media only screen and (min-width: 550px) {
    h5,
    .heading-sml {
      font-size: 14px; } }
  @media only screen and (min-width: 700px) {
    h5,
    .heading-sml {
      font-size: 14px; } }
  @media only screen and (min-width: 1000px) {
    h5,
    .heading-sml {
      font-size: 15px; } }
  @media only screen and (min-width: 1200px) {
    h5,
    .heading-sml {
      font-size: 15px; } }
  @media only screen and (min-width: 1400px) {
    h5,
    .heading-sml {
      font-size: 15px; } }
  @media only screen and (min-width: 1600px) {
    h5,
    .heading-sml {
      font-size: 16px; } }

h6,
.heading-xsml {
  font-family: "PP Neue Montreal", sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5; }
  @media only screen and (min-width: 550px) {
    h6,
    .heading-xsml {
      font-size: 12px; } }
  @media only screen and (min-width: 700px) {
    h6,
    .heading-xsml {
      font-size: 12px; } }
  @media only screen and (min-width: 1000px) {
    h6,
    .heading-xsml {
      font-size: 12px; } }
  @media only screen and (min-width: 1200px) {
    h6,
    .heading-xsml {
      font-size: 12px; } }
  @media only screen and (min-width: 1400px) {
    h6,
    .heading-xsml {
      font-size: 12px; } }
  @media only screen and (min-width: 1600px) {
    h6,
    .heading-xsml {
      font-size: 12px; } }

/*  ==========================================================================
	Font sizes  -- typography.scss
	========================================================================== */
.text-huge {
  font-size: 40px;
  line-height: 1; }
  @media only screen and (min-width: 550px) {
    .text-huge {
      font-size: 43px; } }
  @media only screen and (min-width: 700px) {
    .text-huge {
      font-size: 46px; } }
  @media only screen and (min-width: 1000px) {
    .text-huge {
      font-size: 57px; } }
  @media only screen and (min-width: 1200px) {
    .text-huge {
      font-size: 67px; } }
  @media only screen and (min-width: 1400px) {
    .text-huge {
      font-size: 80px; } }
  @media only screen and (min-width: 1600px) {
    .text-huge {
      font-size: 94px; } }

.text-large {
  font-size: 32px;
  line-height: 1.1; }
  @media only screen and (min-width: 550px) {
    .text-large {
      font-size: 34px; } }
  @media only screen and (min-width: 700px) {
    .text-large {
      font-size: 36px; } }
  @media only screen and (min-width: 1000px) {
    .text-large {
      font-size: 42px; } }
  @media only screen and (min-width: 1200px) {
    .text-large {
      font-size: 48px; } }
  @media only screen and (min-width: 1400px) {
    .text-large {
      font-size: 55px; } }
  @media only screen and (min-width: 1600px) {
    .text-large {
      font-size: 64px; } }

.text-med {
  font-size: 26px;
  line-height: 1.3; }
  @media only screen and (min-width: 550px) {
    .text-med {
      font-size: 27px; } }
  @media only screen and (min-width: 700px) {
    .text-med {
      font-size: 28px; } }
  @media only screen and (min-width: 1000px) {
    .text-med {
      font-size: 30px; } }
  @media only screen and (min-width: 1200px) {
    .text-med {
      font-size: 33px; } }
  @media only screen and (min-width: 1400px) {
    .text-med {
      font-size: 36px; } }
  @media only screen and (min-width: 1600px) {
    .text-med {
      font-size: 40px; } }

.text-reg,
body {
  font-size: 16px;
  line-height: 1.5; }
  @media only screen and (min-width: 550px) {
    .text-reg,
    body {
      font-size: 16px; } }
  @media only screen and (min-width: 700px) {
    .text-reg,
    body {
      font-size: 16px; } }
  @media only screen and (min-width: 1000px) {
    .text-reg,
    body {
      font-size: 17px; } }
  @media only screen and (min-width: 1200px) {
    .text-reg,
    body {
      font-size: 18px; } }
  @media only screen and (min-width: 1400px) {
    .text-reg,
    body {
      font-size: 19px; } }
  @media only screen and (min-width: 1600px) {
    .text-reg,
    body {
      font-size: 20px; } }

.text-sml, .btn, .text-link {
  font-size: 14px; }
  @media only screen and (min-width: 550px) {
    .text-sml, .btn, .text-link {
      font-size: 14px; } }
  @media only screen and (min-width: 700px) {
    .text-sml, .btn, .text-link {
      font-size: 14px; } }
  @media only screen and (min-width: 1000px) {
    .text-sml, .btn, .text-link {
      font-size: 15px; } }
  @media only screen and (min-width: 1200px) {
    .text-sml, .btn, .text-link {
      font-size: 15px; } }
  @media only screen and (min-width: 1400px) {
    .text-sml, .btn, .text-link {
      font-size: 15px; } }
  @media only screen and (min-width: 1600px) {
    .text-sml, .btn, .text-link {
      font-size: 16px; } }

.text-xsml {
  font-size: 12px; }
  @media only screen and (min-width: 550px) {
    .text-xsml {
      font-size: 12px; } }
  @media only screen and (min-width: 700px) {
    .text-xsml {
      font-size: 12px; } }
  @media only screen and (min-width: 1000px) {
    .text-xsml {
      font-size: 12px; } }
  @media only screen and (min-width: 1200px) {
    .text-xsml {
      font-size: 12px; } }
  @media only screen and (min-width: 1400px) {
    .text-xsml {
      font-size: 12px; } }
  @media only screen and (min-width: 1600px) {
    .text-xsml {
      font-size: 12px; } }

p {
  margin: 0 0 1em; }

/*  ==========================================================================
	Font families  -- typography.scss
	========================================================================== */
.font-body {
  font-family: "PP Neue Montreal", sans-serif; }

.font-header {
  font-family: "PP Neue Montreal", serif;
  font-weight: 400; }

/*  ==========================================================================
	Font weights -- typography.scss
	========================================================================== */
.font-bold, .text-link,
b,
strong {
  font-weight: 700; }

.font-semibold {
  font-weight: 500; }

.font-reg {
  font-weight: 400; }

.font-light {
  font-weight: 200; }

/*  ==========================================================================
	Font Cases -- typography.scss
	========================================================================== */
.case-lower {
  text-transform: lowercase; }

.case-upper {
  text-transform: uppercase; }

/*  ==========================================================================
	Text alignments -- typography.scss
	========================================================================== */
.text-center {
  text-align: center; }

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

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

/*  ==========================================================================
	Text colors -- typography.scss
	========================================================================== */
.color-purple {
  color: #CFC2F6; }
.color-orange {
  color: #FD6920; }
.color-white {
  color: #ffffff; }
.color-black {
  color: #111; }
.color-grey {
  color: #888; }

.accent-purple .color-accent {
  color: #CFC2F6; }
.accent-orange .color-accent {
  color: #FD6920; }
.accent-white .color-accent {
  color: #ffffff; }
.accent-black .color-accent {
  color: #111; }
.accent-grey .color-accent {
  color: #888; }

/*  ==========================================================================
	Opacities -- typography.scss
	========================================================================== */
.o-33 {
  opacity: 0.33; }

.o-50 {
  opacity: 0.5; }

/*  ==========================================================================
	List styles -- typography.scss
	========================================================================== */
ol,
ul {
  margin: 0 0 1em;
  padding: 0; }
  ol.list-style-none,
  ul.list-style-none {
    margin-left: 0;
    list-style: none; }

.inlinenavlist {
  margin: 0 -0.75em; }
  .inlinenavlist li {
    display: inline-block;
    margin: 0;
    padding: 0; }
    .inlinenavlist li a {
      display: block;
      margin: 0 0.75em; }

/*  ==========================================================================
    links -- links-buttons.scss
    ========================================================================== */
a {
  color: inherit;
  text-decoration: none; }
  a:hover {
    color: inherit; }

.linkline {
  background-image: linear-gradient(90deg, #111111 0%, #111111 50%, rgba(17, 17, 17, 0.15) 50%, rgba(17, 17, 17, 0.15) 100%);
  background-size: 200% 1px;
  background-position: 100% bottom;
  background-repeat: no-repeat;
  transition: background-position 250ms cubic-bezier(0.33, 1, 0.68, 1); }
  a:hover .linkline {
    background-position: 0 bottom; }
  .color-white .linkline {
    background-image: linear-gradient(90deg, white 0%, white 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 100%); }
  .hiddenlinkline .linkline {
    background-image: linear-gradient(90deg, #111111 0%, #111111 50%, rgba(17, 17, 17, 0) 50%, rgba(17, 17, 17, 0) 100%); }
  .color-white.hiddenlinkline .linkline, .hiddenlinkline .color-white .linkline, .color-white .hiddenlinkline .linkline {
    background-image: linear-gradient(90deg, white 0%, white 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0) 100%); }

.accent-purple .linkline {
  background-image: linear-gradient(90deg, #cfc2f6 0%, #cfc2f6 50%, rgba(207, 194, 246, 0.15) 50%, rgba(207, 194, 246, 0.15) 100%); }
.accent-purple .hiddenlinkline .linkline, .hiddenlinkline .accent-purple {
  background-image: linear-gradient(90deg, #cfc2f6 0%, #cfc2f6 50%, rgba(207, 194, 246, 0) 50%, rgba(207, 194, 246, 0) 100%); }
.accent-orange .linkline {
  background-image: linear-gradient(90deg, #fd6920 0%, #fd6920 50%, rgba(253, 105, 32, 0.15) 50%, rgba(253, 105, 32, 0.15) 100%); }
.accent-orange .hiddenlinkline .linkline, .hiddenlinkline .accent-orange {
  background-image: linear-gradient(90deg, #fd6920 0%, #fd6920 50%, rgba(253, 105, 32, 0) 50%, rgba(253, 105, 32, 0) 100%); }
.accent-white .linkline {
  background-image: linear-gradient(90deg, white 0%, white 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 100%); }
.accent-white .hiddenlinkline .linkline, .hiddenlinkline .accent-white {
  background-image: linear-gradient(90deg, white 0%, white 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0) 100%); }
.accent-black .linkline {
  background-image: linear-gradient(90deg, #111111 0%, #111111 50%, rgba(17, 17, 17, 0.15) 50%, rgba(17, 17, 17, 0.15) 100%); }
.accent-black .hiddenlinkline .linkline, .hiddenlinkline .accent-black {
  background-image: linear-gradient(90deg, #111111 0%, #111111 50%, rgba(17, 17, 17, 0) 50%, rgba(17, 17, 17, 0) 100%); }
.accent-grey .linkline {
  background-image: linear-gradient(90deg, #888888 0%, #888888 50%, rgba(136, 136, 136, 0.15) 50%, rgba(136, 136, 136, 0.15) 100%); }
.accent-grey .hiddenlinkline .linkline, .hiddenlinkline .accent-grey {
  background-image: linear-gradient(90deg, #888888 0%, #888888 50%, rgba(136, 136, 136, 0) 50%, rgba(136, 136, 136, 0) 100%); }

/*  ==========================================================================
		Link Icons -- links-buttons.scss
		========================================================================== */
a .fa,
a .fab,
a .fal,
a .far,
a .fas,
.btn .fa,
.btn .fab,
.btn .fal,
.btn .far,
.btn .fas {
  padding: 0 0 0 0.66em; }
  a .fa--left,
  a .fab--left,
  a .fal--left,
  a .far--left,
  a .fas--left,
  .btn .fa--left,
  .btn .fab--left,
  .btn .fal--left,
  .btn .far--left,
  .btn .fas--left {
    padding: 0 0.66em 0 0; }
  a .fa--nopad,
  a .fab--nopad,
  a .fal--nopad,
  a .far--nopad,
  a .fas--nopad,
  .btn .fa--nopad,
  .btn .fab--nopad,
  .btn .fal--nopad,
  .btn .far--nopad,
  .btn .fas--nopad {
    padding: 0; }

/*  ==========================================================================
		Buttons -- links-buttons.scss
		========================================================================== */
.btn {
  cursor: pointer;
  background-color: #111;
  color: #ffffff;
  border-radius: 0.25em;
  display: inline-block;
  margin: 0 0.75em 0.75em 0;
  padding: 1em 1.5em;
  border: none;
  font-weight: 700;
  transition: background-color 150ms cubic-bezier(0.65, 0, 0.35, 1), color 150ms cubic-bezier(0.65, 0, 0.35, 1); }
  .btn .linkline {
    border: none;
    background-image: none; }
  .btn:hover {
    background-color: rgba(17, 17, 17, 0.75);
    color: #ffffff; }
  .color-white .btn {
    background: #ffffff;
    color: #111; }
    .color-white .btn:hover {
      background-color: rgba(255, 255, 255, 0.75);
      color: #111; }
  .btn--secondary {
    background: rgba(17, 17, 17, 0.1);
    color: #111; }
    .btn--secondary:hover {
      background: rgba(17, 17, 17, 0.2);
      color: #111; }
    .color-white .btn--secondary {
      background: rgba(255, 255, 255, 0.15);
      color: #ffffff; }
      .color-white .btn--secondary:hover {
        background: rgba(255, 255, 255, 0.25);
        color: #ffffff; }
  .btn--purple {
    background: #CFC2F6;
    color: #ffffff; }
    .btn--purple:hover {
      background: #beacf3;
      color: #ffffff; }
  .btn--orange {
    background: #FD6920;
    color: #ffffff; }
    .btn--orange:hover {
      background: #fd5807;
      color: #ffffff; }
  .btn--white {
    background: #ffffff;
    color: #ffffff; }
    .btn--white:hover {
      background: #f2f2f2;
      color: #ffffff; }
  .btn--black {
    background: #111;
    color: #ffffff; }
    .btn--black:hover {
      background: #040404;
      color: #ffffff; }
  .btn--grey {
    background: #888;
    color: #ffffff; }
    .btn--grey:hover {
      background: #7b7b7b;
      color: #ffffff; }

.accent-purple .btn--primary {
  background-color: #CFC2F6; }
  .accent-purple .btn--primary:hover {
    background-color: #beacf3; }
.accent-orange .btn--primary {
  background-color: #FD6920; }
  .accent-orange .btn--primary:hover {
    background-color: #fd5807; }
.accent-white .btn--primary {
  background-color: #ffffff; }
  .accent-white .btn--primary:hover {
    background-color: #f2f2f2; }
.accent-black .btn--primary {
  background-color: #111; }
  .accent-black .btn--primary:hover {
    background-color: #040404; }
.accent-grey .btn--primary {
  background-color: #888; }
  .accent-grey .btn--primary:hover {
    background-color: #7b7b7b; }

/*  ==========================================================================
		Text Links -- links-buttons.scss
		========================================================================== */
.text-link:after {
  content: "\f178";
  font-family: "Font Awesome 5 Pro";
  font-weight: 300;
  font-style: normal;
  margin-left: 0.5em;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased; }

/*  ==========================================================================
		share icons -- links-buttons.scss
		========================================================================== */
.socialicons {
  position: relative;
  margin-top: 1em; }
  .socialicons:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    border-top: 1px solid rgba(17, 17, 17, 0.15); }
  .socialicons .socialicons__list {
    position: relative;
    margin-bottom: 0;
    height: 3.25rem; }
    .socialicons .socialicons__list li {
      margin: 0 0.25em;
      display: inline-block; }
  .socialicons .socialicons__list .sociallink {
    display: block;
    height: 3.25rem;
    border: 1px solid rgba(17, 17, 17, 0.15);
    box-sizing: border-box;
    background-color: #ffffff;
    line-height: calc(3.25rem - 2px);
    margin: 0;
    border-radius: 2rem; }
    .color-white .socialicons .socialicons__list .sociallink {
      border-color: rgba(255, 255, 255, 0.15); }
    .bg-black .socialicons .socialicons__list .sociallink {
      background-color: #111; }
    .socialicons .socialicons__list .sociallink:after {
      content: "";
      height: 0;
      visibility: hidden;
      clear: both;
      display: block; }
    .socialicons .socialicons__list .sociallink .sociallink__text {
      overflow: hidden;
      font-size: 12px;
      display: block;
      float: left;
      text-align: right;
      width: 0;
      transition: all 150ms cubic-bezier(0.65, 0, 0.35, 1) 0s;
      text-align: left; }
    .socialicons .socialicons__list .sociallink .sociallink__icon {
      width: 3.25rem;
      text-align: center;
      display: block;
      float: left;
      padding: 0;
      border: none; }
      .socialicons .socialicons__list .sociallink .sociallink__icon .fab,
      .socialicons .socialicons__list .sociallink .sociallink__icon .far,
      .socialicons .socialicons__list .sociallink .sociallink__icon .fal,
      .socialicons .socialicons__list .sociallink .sociallink__icon .fas {
        display: inline-block;
        padding: 0; }
    @media only screen and (min-width: 700px) {
      .socialicons .socialicons__list .sociallink a:hover .sociallink .fab {
        display: inline-block;
        padding: 0; }
      .socialicons .socialicons__list .sociallink:hover .sociallink__text {
        width: 65px; } }

/*================= LAYOUT =================*/
/* ==========================================================================
   Grid -- layout/_grid.scss
   ========================================================================== */
/* ==========================================================================
  General flex box classes -- layout/_grid.scss
  ========================================================================== */
.flex {
  display: flex;
  /* NEW, Spec - Opera 12.1, Firefox 20+ */ }

/* ==========================================================================
	Rows -- layout/_grid.scss
	========================================================================== */
.row {
  display: flex;
  /* NEW, Spec - Opera 12.1, Firefox 20+ */
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-left: -0.5em;
  margin-right: -0.5em; }
  @media only screen and (min-width: 550px) {
    .row {
      margin-left: -0.5em;
      margin-right: -0.5em; } }
  @media only screen and (min-width: 700px) {
    .row {
      margin-left: -0.75em;
      margin-right: -0.75em; } }
  @media only screen and (min-width: 1000px) {
    .row {
      margin-left: -0.75em;
      margin-right: -0.75em; } }
  @media only screen and (min-width: 1200px) {
    .row {
      margin-left: -0.75em;
      margin-right: -0.75em; } }
  @media only screen and (min-width: 1400px) {
    .row {
      margin-left: -0.75em;
      margin-right: -0.75em; } }
  @media only screen and (min-width: 1600px) {
    .row {
      margin-left: -0.75em;
      margin-right: -0.75em; } }

.row--nowrap {
  flex-wrap: nowrap; }
  @media only screen and (min-width: 550px) {
    .row--nowrap--sm {
      flex-wrap: nowrap; } }
  @media only screen and (min-width: 700px) {
    .row--nowrap--md {
      flex-wrap: nowrap; } }
  @media only screen and (min-width: 1000px) {
    .row--nowrap--lg {
      flex-wrap: nowrap; } }
  @media only screen and (min-width: 1200px) {
    .row--nowrap--xl {
      flex-wrap: nowrap; } }
  @media only screen and (min-width: 1400px) {
    .row--nowrap--ws {
      flex-wrap: nowrap; } }
  @media only screen and (min-width: 1600px) {
    .row--nowrap--xw {
      flex-wrap: nowrap; } }
  @media only screen and (min-width: 1800px) {
    .row--nowrap--xxw {
      flex-wrap: nowrap; } }
  @media only screen and (min-width: 2000px) {
    .row--nowrap--xxxw {
      flex-wrap: nowrap; } }

.row--wrapreverse {
  flex-wrap: wrap-reverse; }
  @media only screen and (min-width: 550px) {
    .row--wrapreverse--sm {
      flex-wrap: wrap-reverse; } }
  @media only screen and (min-width: 700px) {
    .row--wrapreverse--md {
      flex-wrap: wrap-reverse; } }
  @media only screen and (min-width: 1000px) {
    .row--wrapreverse--lg {
      flex-wrap: wrap-reverse; } }
  @media only screen and (min-width: 1200px) {
    .row--wrapreverse--xl {
      flex-wrap: wrap-reverse; } }
  @media only screen and (min-width: 1400px) {
    .row--wrapreverse--ws {
      flex-wrap: wrap-reverse; } }
  @media only screen and (min-width: 1600px) {
    .row--wrapreverse--xw {
      flex-wrap: wrap-reverse; } }
  @media only screen and (min-width: 1800px) {
    .row--wrapreverse--xxw {
      flex-wrap: wrap-reverse; } }
  @media only screen and (min-width: 2000px) {
    .row--wrapreverse--xxxw {
      flex-wrap: wrap-reverse; } }

.row--column {
  flex-direction: column; }
  @media only screen and (min-width: 550px) {
    .row--column--sm {
      flex-direction: column; } }
  @media only screen and (min-width: 700px) {
    .row--column--md {
      flex-direction: column; } }
  @media only screen and (min-width: 1000px) {
    .row--column--lg {
      flex-direction: column; } }
  @media only screen and (min-width: 1200px) {
    .row--column--xl {
      flex-direction: column; } }
  @media only screen and (min-width: 1400px) {
    .row--column--ws {
      flex-direction: column; } }
  @media only screen and (min-width: 1600px) {
    .row--column--xw {
      flex-direction: column; } }
  @media only screen and (min-width: 1800px) {
    .row--column--xxw {
      flex-direction: column; } }
  @media only screen and (min-width: 2000px) {
    .row--column--xxxw {
      flex-direction: column; } }

.row--columnreverse {
  flex-direction: column-reverse; }
  @media only screen and (min-width: 550px) {
    .row--columnreverse--sm {
      flex-direction: column-reverse; } }
  @media only screen and (min-width: 700px) {
    .row--columnreverse--md {
      flex-direction: column-reverse; } }
  @media only screen and (min-width: 1000px) {
    .row--columnreverse--lg {
      flex-direction: column-reverse; } }
  @media only screen and (min-width: 1200px) {
    .row--columnreverse--xl {
      flex-direction: column-reverse; } }
  @media only screen and (min-width: 1400px) {
    .row--columnreverse--ws {
      flex-direction: column-reverse; } }
  @media only screen and (min-width: 1600px) {
    .row--columnreverse--xw {
      flex-direction: column-reverse; } }
  @media only screen and (min-width: 1800px) {
    .row--columnreverse--xxw {
      flex-direction: column-reverse; } }
  @media only screen and (min-width: 2000px) {
    .row--columnreverse--xxxw {
      flex-direction: column-reverse; } }

.row--row {
  flex-direction: row; }
  @media only screen and (min-width: 550px) {
    .row--row--sm {
      flex-direction: row; } }
  @media only screen and (min-width: 700px) {
    .row--row--md {
      flex-direction: row; } }
  @media only screen and (min-width: 1000px) {
    .row--row--lg {
      flex-direction: row; } }
  @media only screen and (min-width: 1200px) {
    .row--row--xl {
      flex-direction: row; } }
  @media only screen and (min-width: 1400px) {
    .row--row--ws {
      flex-direction: row; } }
  @media only screen and (min-width: 1600px) {
    .row--row--xw {
      flex-direction: row; } }
  @media only screen and (min-width: 1800px) {
    .row--row--xxw {
      flex-direction: row; } }
  @media only screen and (min-width: 2000px) {
    .row--row--xxxw {
      flex-direction: row; } }

.row--rowreverse {
  flex-direction: row-reverse; }
  @media only screen and (min-width: 550px) {
    .row--rowreverse--sm {
      flex-direction: row-reverse; } }
  @media only screen and (min-width: 700px) {
    .row--rowreverse--md {
      flex-direction: row-reverse; } }
  @media only screen and (min-width: 1000px) {
    .row--rowreverse--lg {
      flex-direction: row-reverse; } }
  @media only screen and (min-width: 1200px) {
    .row--rowreverse--xl {
      flex-direction: row-reverse; } }
  @media only screen and (min-width: 1400px) {
    .row--rowreverse--ws {
      flex-direction: row-reverse; } }
  @media only screen and (min-width: 1600px) {
    .row--rowreverse--xw {
      flex-direction: row-reverse; } }
  @media only screen and (min-width: 1800px) {
    .row--rowreverse--xxw {
      flex-direction: row-reverse; } }
  @media only screen and (min-width: 2000px) {
    .row--rowreverse--xxxw {
      flex-direction: row-reverse; } }

.row--mb {
  margin-bottom: calc(0.5em * -3); }
  @media only screen and (min-width: 550px) {
    .row--mb {
      margin-bottom: calc(0.5em * -3); } }
  @media only screen and (min-width: 700px) {
    .row--mb {
      margin-bottom: calc(0.75em * -3); } }
  @media only screen and (min-width: 1000px) {
    .row--mb {
      margin-bottom: calc(0.75em * -3); } }
  @media only screen and (min-width: 1200px) {
    .row--mb {
      margin-bottom: calc(0.75em * -3); } }
  @media only screen and (min-width: 1400px) {
    .row--mb {
      margin-bottom: calc(0.75em * -3); } }
  @media only screen and (min-width: 1600px) {
    .row--mb {
      margin-bottom: calc(0.75em * -3); } }
  .row--mb > .col {
    margin-bottom: calc(0.5em * 3); }
    @media only screen and (min-width: 550px) {
      .row--mb > .col {
        margin-bottom: calc(0.5em * 3); } }
    @media only screen and (min-width: 700px) {
      .row--mb > .col {
        margin-bottom: calc(0.75em * 3); } }
    @media only screen and (min-width: 1000px) {
      .row--mb > .col {
        margin-bottom: calc(0.75em * 3); } }
    @media only screen and (min-width: 1200px) {
      .row--mb > .col {
        margin-bottom: calc(0.75em * 3); } }
    @media only screen and (min-width: 1400px) {
      .row--mb > .col {
        margin-bottom: calc(0.75em * 3); } }
    @media only screen and (min-width: 1600px) {
      .row--mb > .col {
        margin-bottom: calc(0.75em * 3); } }

/* ==========================================================================
	Alignments -- layout/_grid.scss
	========================================================================== */
.justify-center {
  justify-content: center; }
  @media only screen and (min-width: 550px) {
    .justify-center--sm {
      justify-content: center; } }
  @media only screen and (min-width: 700px) {
    .justify-center--md {
      justify-content: center; } }
  @media only screen and (min-width: 1000px) {
    .justify-center--lg {
      justify-content: center; } }
  @media only screen and (min-width: 1200px) {
    .justify-center--xl {
      justify-content: center; } }
  @media only screen and (min-width: 1400px) {
    .justify-center--ws {
      justify-content: center; } }
  @media only screen and (min-width: 1600px) {
    .justify-center--xw {
      justify-content: center; } }
  @media only screen and (min-width: 1800px) {
    .justify-center--xxw {
      justify-content: center; } }
  @media only screen and (min-width: 2000px) {
    .justify-center--xxxw {
      justify-content: center; } }

.justify-start {
  justify-content: flex-start; }
  @media only screen and (min-width: 550px) {
    .justify-start--sm {
      justify-content: flex-start; } }
  @media only screen and (min-width: 700px) {
    .justify-start--md {
      justify-content: flex-start; } }
  @media only screen and (min-width: 1000px) {
    .justify-start--lg {
      justify-content: flex-start; } }
  @media only screen and (min-width: 1200px) {
    .justify-start--xl {
      justify-content: flex-start; } }
  @media only screen and (min-width: 1400px) {
    .justify-start--ws {
      justify-content: flex-start; } }
  @media only screen and (min-width: 1600px) {
    .justify-start--xw {
      justify-content: flex-start; } }
  @media only screen and (min-width: 1800px) {
    .justify-start--xxw {
      justify-content: flex-start; } }
  @media only screen and (min-width: 2000px) {
    .justify-start--xxxw {
      justify-content: flex-start; } }

.justify-end {
  justify-content: flex-end; }
  @media only screen and (min-width: 550px) {
    .justify-end--sm {
      justify-content: flex-end; } }
  @media only screen and (min-width: 700px) {
    .justify-end--md {
      justify-content: flex-end; } }
  @media only screen and (min-width: 1000px) {
    .justify-end--lg {
      justify-content: flex-end; } }
  @media only screen and (min-width: 1200px) {
    .justify-end--xl {
      justify-content: flex-end; } }
  @media only screen and (min-width: 1400px) {
    .justify-end--ws {
      justify-content: flex-end; } }
  @media only screen and (min-width: 1600px) {
    .justify-end--xw {
      justify-content: flex-end; } }
  @media only screen and (min-width: 1800px) {
    .justify-end--xxw {
      justify-content: flex-end; } }
  @media only screen and (min-width: 2000px) {
    .justify-end--xxxw {
      justify-content: flex-end; } }

.justify-spacebetween {
  justify-content: space-between; }
  @media only screen and (min-width: 550px) {
    .justify-spacebetween--sm {
      justify-content: space-between; } }
  @media only screen and (min-width: 700px) {
    .justify-spacebetween--md {
      justify-content: space-between; } }
  @media only screen and (min-width: 1000px) {
    .justify-spacebetween--lg {
      justify-content: space-between; } }
  @media only screen and (min-width: 1200px) {
    .justify-spacebetween--xl {
      justify-content: space-between; } }
  @media only screen and (min-width: 1400px) {
    .justify-spacebetween--ws {
      justify-content: space-between; } }
  @media only screen and (min-width: 1600px) {
    .justify-spacebetween--xw {
      justify-content: space-between; } }
  @media only screen and (min-width: 1800px) {
    .justify-spacebetween--xxw {
      justify-content: space-between; } }
  @media only screen and (min-width: 2000px) {
    .justify-spacebetween--xxxw {
      justify-content: space-between; } }

.justify-spacearound {
  justify-content: space-around; }
  @media only screen and (min-width: 550px) {
    .justify-spacearound--sm {
      justify-content: space-around; } }
  @media only screen and (min-width: 700px) {
    .justify-spacearound--md {
      justify-content: space-around; } }
  @media only screen and (min-width: 1000px) {
    .justify-spacearound--lg {
      justify-content: space-around; } }
  @media only screen and (min-width: 1200px) {
    .justify-spacearound--xl {
      justify-content: space-around; } }
  @media only screen and (min-width: 1400px) {
    .justify-spacearound--ws {
      justify-content: space-around; } }
  @media only screen and (min-width: 1600px) {
    .justify-spacearound--xw {
      justify-content: space-around; } }
  @media only screen and (min-width: 1800px) {
    .justify-spacearound--xxw {
      justify-content: space-around; } }
  @media only screen and (min-width: 2000px) {
    .justify-spacearound--xxxw {
      justify-content: space-around; } }

.justify-spaceevenly {
  justify-content: space-evenly; }
  @media only screen and (min-width: 550px) {
    .justify-spaceevenly--sm {
      justify-content: space-evenly; } }
  @media only screen and (min-width: 700px) {
    .justify-spaceevenly--md {
      justify-content: space-evenly; } }
  @media only screen and (min-width: 1000px) {
    .justify-spaceevenly--lg {
      justify-content: space-evenly; } }
  @media only screen and (min-width: 1200px) {
    .justify-spaceevenly--xl {
      justify-content: space-evenly; } }
  @media only screen and (min-width: 1400px) {
    .justify-spaceevenly--ws {
      justify-content: space-evenly; } }
  @media only screen and (min-width: 1600px) {
    .justify-spaceevenly--xw {
      justify-content: space-evenly; } }
  @media only screen and (min-width: 1800px) {
    .justify-spaceevenly--xxw {
      justify-content: space-evenly; } }
  @media only screen and (min-width: 2000px) {
    .justify-spaceevenly--xxxw {
      justify-content: space-evenly; } }

.align-center {
  align-items: center; }
  @media only screen and (min-width: 550px) {
    .align-center--sm {
      align-items: center; } }
  @media only screen and (min-width: 700px) {
    .align-center--md {
      align-items: center; } }
  @media only screen and (min-width: 1000px) {
    .align-center--lg {
      align-items: center; } }
  @media only screen and (min-width: 1200px) {
    .align-center--xl {
      align-items: center; } }
  @media only screen and (min-width: 1400px) {
    .align-center--ws {
      align-items: center; } }
  @media only screen and (min-width: 1600px) {
    .align-center--xw {
      align-items: center; } }
  @media only screen and (min-width: 1800px) {
    .align-center--xxw {
      align-items: center; } }
  @media only screen and (min-width: 2000px) {
    .align-center--xxxw {
      align-items: center; } }

.align-start {
  align-items: flex-start; }
  @media only screen and (min-width: 550px) {
    .align-start--sm {
      align-items: flex-start; } }
  @media only screen and (min-width: 700px) {
    .align-start--md {
      align-items: flex-start; } }
  @media only screen and (min-width: 1000px) {
    .align-start--lg {
      align-items: flex-start; } }
  @media only screen and (min-width: 1200px) {
    .align-start--xl {
      align-items: flex-start; } }
  @media only screen and (min-width: 1400px) {
    .align-start--ws {
      align-items: flex-start; } }
  @media only screen and (min-width: 1600px) {
    .align-start--xw {
      align-items: flex-start; } }
  @media only screen and (min-width: 1800px) {
    .align-start--xxw {
      align-items: flex-start; } }
  @media only screen and (min-width: 2000px) {
    .align-start--xxxw {
      align-items: flex-start; } }

.align-end {
  align-items: flex-end; }
  @media only screen and (min-width: 550px) {
    .align-end--sm {
      align-items: flex-end; } }
  @media only screen and (min-width: 700px) {
    .align-end--md {
      align-items: flex-end; } }
  @media only screen and (min-width: 1000px) {
    .align-end--lg {
      align-items: flex-end; } }
  @media only screen and (min-width: 1200px) {
    .align-end--xl {
      align-items: flex-end; } }
  @media only screen and (min-width: 1400px) {
    .align-end--ws {
      align-items: flex-end; } }
  @media only screen and (min-width: 1600px) {
    .align-end--xw {
      align-items: flex-end; } }
  @media only screen and (min-width: 1800px) {
    .align-end--xxw {
      align-items: flex-end; } }
  @media only screen and (min-width: 2000px) {
    .align-end--xxxw {
      align-items: flex-end; } }

/* ==========================================================================
	Columns -- layout/_grid.scss
	========================================================================== */
.col {
  vertical-align: top;
  box-sizing: border-box;
  padding-left: 0.5em;
  padding-right: 0.5em; }
  @media only screen and (min-width: 550px) {
    .col {
      padding-left: 0.5em;
      padding-right: 0.5em; } }
  @media only screen and (min-width: 700px) {
    .col {
      padding-left: 0.75em;
      padding-right: 0.75em; } }
  @media only screen and (min-width: 1000px) {
    .col {
      padding-left: 0.75em;
      padding-right: 0.75em; } }
  @media only screen and (min-width: 1200px) {
    .col {
      padding-left: 0.75em;
      padding-right: 0.75em; } }
  @media only screen and (min-width: 1400px) {
    .col {
      padding-left: 0.75em;
      padding-right: 0.75em; } }
  @media only screen and (min-width: 1600px) {
    .col {
      padding-left: 0.75em;
      padding-right: 0.75em; } }

.col--content {
  width: 100%; }
  @media only screen and (min-width: 550px) {
    .col--content {
      width: 83.33%; } }
  @media only screen and (min-width: 700px) {
    .col--content {
      width: 66.66666%; } }
  @media only screen and (min-width: 1000px) {
    .col--content {
      width: 60%; } }
  @media only screen and (min-width: 1200px) {
    .col--content {
      width: 50%; } }
  .col--content--wide {
    width: 100%; }
    @media only screen and (min-width: 700px) {
      .col--content--wide {
        width: 83.33%; } }
    @media only screen and (min-width: 1000px) {
      .col--content--wide {
        width: 80%; } }
    @media only screen and (min-width: 1200px) {
      .col--content--wide {
        width: 66.66666%; } }

.col--nopadleft {
  padding-left: 0; }
  @media only screen and (min-width: 550px) {
    .col--nopadleft--sm {
      padding-left: 0; } }
  @media only screen and (min-width: 700px) {
    .col--nopadleft--md {
      padding-left: 0; } }
  @media only screen and (min-width: 1000px) {
    .col--nopadleft--lg {
      padding-left: 0; } }
  @media only screen and (min-width: 1200px) {
    .col--nopadleft--xl {
      padding-left: 0; } }
  @media only screen and (min-width: 1400px) {
    .col--nopadleft--ws {
      padding-left: 0; } }
  @media only screen and (min-width: 1600px) {
    .col--nopadleft--xw {
      padding-left: 0; } }
  @media only screen and (min-width: 1800px) {
    .col--nopadleft--xxw {
      padding-left: 0; } }
  @media only screen and (min-width: 2000px) {
    .col--nopadleft--xxxw {
      padding-left: 0; } }

.col--nopadright {
  padding-right: 0; }
  @media only screen and (min-width: 550px) {
    .col--nopadright--sm {
      padding-right: 0; } }
  @media only screen and (min-width: 700px) {
    .col--nopadright--md {
      padding-right: 0; } }
  @media only screen and (min-width: 1000px) {
    .col--nopadright--lg {
      padding-right: 0; } }
  @media only screen and (min-width: 1200px) {
    .col--nopadright--xl {
      padding-right: 0; } }
  @media only screen and (min-width: 1400px) {
    .col--nopadright--ws {
      padding-right: 0; } }
  @media only screen and (min-width: 1600px) {
    .col--nopadright--xw {
      padding-right: 0; } }
  @media only screen and (min-width: 1800px) {
    .col--nopadright--xxw {
      padding-right: 0; } }
  @media only screen and (min-width: 2000px) {
    .col--nopadright--xxxw {
      padding-right: 0; } }

/* ==========================================================================
	Grid classes -- layout/_grid.scss
	========================================================================== */
.col-auto {
  width: auto; }

.col-1 {
  width: 100%; }

.col-1-2 {
  width: 50%; }

.col-1-3 {
  width: 33.3%; }

.col-2-3 {
  width: 66.66666%; }

.col-1-6 {
  width: 16.66666%; }

.col-1-4 {
  width: 25%; }

.col-3-4 {
  width: 75%; }

.col-1-5 {
  width: 20%; }

.col-2-5 {
  width: 40%; }

.col-3-5 {
  width: 60%; }

.col-4-5 {
  width: 80%; }

.col-1-6 {
  width: 16.656%; }

.col-5-6 {
  width: 83.33%; }

.col-1-8 {
  width: 12.5%; }

.col-3-8 {
  width: 37.5%; }

.col-5-8 {
  width: 62.5%; }

.col-7-8 {
  width: 87.5%; }

.col-1-12 {
  width: 8.3333%; }

.col-5-12 {
  width: 41.6666%; }

.col-7-12 {
  width: 58.3333%; }

.col-11-12 {
  width: 91.6666%; }

.col-1-24 {
  width: 4.1666%; }

.col-5-24 {
  width: 20.8333%; }

.col-7-24 {
  width: 29.1666%; }

.col-11-24 {
  width: 45.8333%; }

.col-13-24 {
  width: 54.1666%; }

.col-17-24 {
  width: 70.8333%; }

.col-19-24 {
  width: 79.1666%; }

.col-23-24 {
  width: 95.8333%; }

@media only screen and (min-width: 550px) {
  .col-sm-auto {
    width: auto; }

  .col-sm-1 {
    width: 100%; }

  .col-sm-1-2 {
    width: 50%; }

  .col-sm-1-3 {
    width: 33.3%; }

  .col-sm-2-3 {
    width: 66.66666%; }

  .col-sm-1-6 {
    width: 16.66666%; }

  .col-sm-1-4 {
    width: 25%; }

  .col-sm-3-4 {
    width: 75%; }

  .col-sm-1-5 {
    width: 20%; }

  .col-sm-2-5 {
    width: 40%; }

  .col-sm-3-5 {
    width: 60%; }

  .col-sm-4-5 {
    width: 80%; }

  .col-sm-1-6 {
    width: 16.656%; }

  .col-sm-5-6 {
    width: 83.33%; }

  .col-sm-1-8 {
    width: 12.5%; }

  .col-sm-3-8 {
    width: 37.5%; }

  .col-sm-5-8 {
    width: 62.5%; }

  .col-sm-7-8 {
    width: 87.5%; }

  .col-sm-1-12 {
    width: 8.3333%; }

  .col-sm-5-12 {
    width: 41.6666%; }

  .col-sm-7-12 {
    width: 58.3333%; }

  .col-sm-11-12 {
    width: 91.6666%; }

  .col-sm-1-24 {
    width: 4.1666%; }

  .col-sm-5-24 {
    width: 20.8333%; }

  .col-sm-7-24 {
    width: 29.1666%; }

  .col-sm-11-24 {
    width: 45.8333%; }

  .col-sm-13-24 {
    width: 54.1666%; }

  .col-sm-17-24 {
    width: 70.8333%; }

  .col-sm-19-24 {
    width: 79.1666%; }

  .col-sm-23-24 {
    width: 95.8333%; } }
@media only screen and (min-width: 700px) {
  .col-md-auto {
    width: auto; }

  .col-md-1 {
    width: 100%; }

  .col-md-1-2 {
    width: 50%; }

  .col-md-1-3 {
    width: 33.3%; }

  .col-md-2-3 {
    width: 66.66666%; }

  .col-md-1-6 {
    width: 16.66666%; }

  .col-md-1-4 {
    width: 25%; }

  .col-md-3-4 {
    width: 75%; }

  .col-md-1-5 {
    width: 20%; }

  .col-md-2-5 {
    width: 40%; }

  .col-md-3-5 {
    width: 60%; }

  .col-md-4-5 {
    width: 80%; }

  .col-md-1-6 {
    width: 16.656%; }

  .col-md-5-6 {
    width: 83.33%; }

  .col-md-1-8 {
    width: 12.5%; }

  .col-md-3-8 {
    width: 37.5%; }

  .col-md-5-8 {
    width: 62.5%; }

  .col-md-7-8 {
    width: 87.5%; }

  .col-md-1-12 {
    width: 8.3333%; }

  .col-md-5-12 {
    width: 41.6666%; }

  .col-md-7-12 {
    width: 58.3333%; }

  .col-md-11-12 {
    width: 91.6666%; }

  .col-md-1-24 {
    width: 4.1666%; }

  .col-md-5-24 {
    width: 20.8333%; }

  .col-md-7-24 {
    width: 29.1666%; }

  .col-md-11-24 {
    width: 45.8333%; }

  .col-md-13-24 {
    width: 54.1666%; }

  .col-md-17-24 {
    width: 70.8333%; }

  .col-md-19-24 {
    width: 79.1666%; }

  .col-md-23-24 {
    width: 95.8333%; } }
@media only screen and (min-width: 1000px) {
  .col-lg-auto {
    width: auto; }

  .col-lg-1 {
    width: 100%; }

  .col-lg-1-2 {
    width: 50%; }

  .col-lg-1-3 {
    width: 33.3%; }

  .col-lg-2-3 {
    width: 66.66666%; }

  .col-lg-1-6 {
    width: 16.66666%; }

  .col-lg-1-4 {
    width: 25%; }

  .col-lg-3-4 {
    width: 75%; }

  .col-lg-1-5 {
    width: 20%; }

  .col-lg-2-5 {
    width: 40%; }

  .col-lg-3-5 {
    width: 60%; }

  .col-lg-4-5 {
    width: 80%; }

  .col-lg-1-6 {
    width: 16.656%; }

  .col-lg-5-6 {
    width: 83.33%; }

  .col-lg-1-8 {
    width: 12.5%; }

  .col-lg-3-8 {
    width: 37.5%; }

  .col-lg-5-8 {
    width: 62.5%; }

  .col-lg-7-8 {
    width: 87.5%; }

  .col-lg-1-12 {
    width: 8.3333%; }

  .col-lg-5-12 {
    width: 41.6666%; }

  .col-lg-7-12 {
    width: 58.3333%; }

  .col-lg-11-12 {
    width: 91.6666%; }

  .col-lg-1-24 {
    width: 4.1666%; }

  .col-lg-5-24 {
    width: 20.8333%; }

  .col-lg-7-24 {
    width: 29.1666%; }

  .col-lg-11-24 {
    width: 45.8333%; }

  .col-lg-13-24 {
    width: 54.1666%; }

  .col-lg-17-24 {
    width: 70.8333%; }

  .col-lg-19-24 {
    width: 79.1666%; }

  .col-lg-23-24 {
    width: 95.8333%; } }
@media only screen and (min-width: 1200px) {
  .col-xl-auto {
    width: auto; }

  .col-xl-1 {
    width: 100%; }

  .col-xl-1-2 {
    width: 50%; }

  .col-xl-1-3 {
    width: 33.3%; }

  .col-xl-2-3 {
    width: 66.66666%; }

  .col-xl-1-6 {
    width: 16.66666%; }

  .col-xl-1-4 {
    width: 25%; }

  .col-xl-3-4 {
    width: 75%; }

  .col-xl-1-5 {
    width: 20%; }

  .col-xl-2-5 {
    width: 40%; }

  .col-xl-3-5 {
    width: 60%; }

  .col-xl-4-5 {
    width: 80%; }

  .col-xl-1-6 {
    width: 16.656%; }

  .col-xl-5-6 {
    width: 83.33%; }

  .col-xl-1-8 {
    width: 12.5%; }

  .col-xl-3-8 {
    width: 37.5%; }

  .col-xl-5-8 {
    width: 62.5%; }

  .col-xl-7-8 {
    width: 87.5%; }

  .col-xl-1-12 {
    width: 8.3333%; }

  .col-xl-5-12 {
    width: 41.6666%; }

  .col-xl-7-12 {
    width: 58.3333%; }

  .col-xl-11-12 {
    width: 91.6666%; }

  .col-xl-1-24 {
    width: 4.1666%; }

  .col-xl-5-24 {
    width: 20.8333%; }

  .col-xl-7-24 {
    width: 29.1666%; }

  .col-xl-11-24 {
    width: 45.8333%; }

  .col-xl-13-24 {
    width: 54.1666%; }

  .col-xl-17-24 {
    width: 70.8333%; }

  .col-xl-19-24 {
    width: 79.1666%; }

  .col-xl-23-24 {
    width: 95.8333%; } }
@media only screen and (min-width: 1400px) {
  .col-ws-auto {
    width: auto; }

  .col-ws-1 {
    width: 100%; }

  .col-ws-1-2 {
    width: 50%; }

  .col-ws-1-3 {
    width: 33.3%; }

  .col-ws-2-3 {
    width: 66.66666%; }

  .col-ws-1-6 {
    width: 16.66666%; }

  .col-ws-1-4 {
    width: 25%; }

  .col-ws-3-4 {
    width: 75%; }

  .col-ws-1-5 {
    width: 20%; }

  .col-ws-2-5 {
    width: 40%; }

  .col-ws-3-5 {
    width: 60%; }

  .col-ws-4-5 {
    width: 80%; }

  .col-ws-1-6 {
    width: 16.656%; }

  .col-ws-5-6 {
    width: 83.33%; }

  .col-ws-1-8 {
    width: 12.5%; }

  .col-ws-3-8 {
    width: 37.5%; }

  .col-ws-5-8 {
    width: 62.5%; }

  .col-ws-7-8 {
    width: 87.5%; }

  .col-ws-1-12 {
    width: 8.3333%; }

  .col-ws-5-12 {
    width: 41.6666%; }

  .col-ws-7-12 {
    width: 58.3333%; }

  .col-ws-11-12 {
    width: 91.6666%; }

  .col-ws-1-24 {
    width: 4.1666%; }

  .col-ws-5-24 {
    width: 20.8333%; }

  .col-ws-7-24 {
    width: 29.1666%; }

  .col-ws-11-24 {
    width: 45.8333%; }

  .col-ws-13-24 {
    width: 54.1666%; }

  .col-ws-17-24 {
    width: 70.8333%; }

  .col-ws-19-24 {
    width: 79.1666%; }

  .col-ws-23-24 {
    width: 95.8333%; } }
@media only screen and (min-width: 1600px) {
  .col-xw-auto {
    width: auto; }

  .col-xw-1 {
    width: 100%; }

  .col-xw-1-2 {
    width: 50%; }

  .col-xw-1-3 {
    width: 33.3%; }

  .col-xw-2-3 {
    width: 66.66666%; }

  .col-xw-1-6 {
    width: 16.66666%; }

  .col-xw-1-4 {
    width: 25%; }

  .col-xw-3-4 {
    width: 75%; }

  .col-xw-1-5 {
    width: 20%; }

  .col-xw-2-5 {
    width: 40%; }

  .col-xw-3-5 {
    width: 60%; }

  .col-xw-4-5 {
    width: 80%; }

  .col-xw-1-6 {
    width: 16.656%; }

  .col-xw-5-6 {
    width: 83.33%; }

  .col-xw-1-8 {
    width: 12.5%; }

  .col-xw-3-8 {
    width: 37.5%; }

  .col-xw-5-8 {
    width: 62.5%; }

  .col-xw-7-8 {
    width: 87.5%; }

  .col-xw-1-12 {
    width: 8.3333%; }

  .col-xw-5-12 {
    width: 41.6666%; }

  .col-xw-7-12 {
    width: 58.3333%; }

  .col-xw-11-12 {
    width: 91.6666%; }

  .col-xw-1-24 {
    width: 4.1666%; }

  .col-xw-5-24 {
    width: 20.8333%; }

  .col-xw-7-24 {
    width: 29.1666%; }

  .col-xw-11-24 {
    width: 45.8333%; }

  .col-xw-13-24 {
    width: 54.1666%; }

  .col-xw-17-24 {
    width: 70.8333%; }

  .col-xw-19-24 {
    width: 79.1666%; }

  .col-xw-23-24 {
    width: 95.8333%; } }
@media only screen and (min-width: 1800px) {
  .col-xxw-auto {
    width: auto; }

  .col-xxw-1 {
    width: 100%; }

  .col-xxw-1-2 {
    width: 50%; }

  .col-xxw-1-3 {
    width: 33.3%; }

  .col-xxw-2-3 {
    width: 66.66666%; }

  .col-xxw-1-6 {
    width: 16.66666%; }

  .col-xxw-1-4 {
    width: 25%; }

  .col-xxw-3-4 {
    width: 75%; }

  .col-xxw-1-5 {
    width: 20%; }

  .col-xxw-2-5 {
    width: 40%; }

  .col-xxw-3-5 {
    width: 60%; }

  .col-xxw-4-5 {
    width: 80%; }

  .col-xxw-1-6 {
    width: 16.656%; }

  .col-xxw-5-6 {
    width: 83.33%; }

  .col-xxw-1-8 {
    width: 12.5%; }

  .col-xxw-3-8 {
    width: 37.5%; }

  .col-xxw-5-8 {
    width: 62.5%; }

  .col-xxw-7-8 {
    width: 87.5%; }

  .col-xxw-1-12 {
    width: 8.3333%; }

  .col-xxw-5-12 {
    width: 41.6666%; }

  .col-xxw-7-12 {
    width: 58.3333%; }

  .col-xxw-11-12 {
    width: 91.6666%; }

  .col-xxw-1-24 {
    width: 4.1666%; }

  .col-xxw-5-24 {
    width: 20.8333%; }

  .col-xxw-7-24 {
    width: 29.1666%; }

  .col-xxw-11-24 {
    width: 45.8333%; }

  .col-xxw-13-24 {
    width: 54.1666%; }

  .col-xxw-17-24 {
    width: 70.8333%; }

  .col-xxw-19-24 {
    width: 79.1666%; }

  .col-xxw-23-24 {
    width: 95.8333%; } }
@media only screen and (min-width: 2000px) {
  .col-xxxw-auto {
    width: auto; }

  .col-xxxw-1 {
    width: 100%; }

  .col-xxxw-1-2 {
    width: 50%; }

  .col-xxxw-1-3 {
    width: 33.3%; }

  .col-xxxw-2-3 {
    width: 66.66666%; }

  .col-xxxw-1-6 {
    width: 16.66666%; }

  .col-xxxw-1-4 {
    width: 25%; }

  .col-xxxw-3-4 {
    width: 75%; }

  .col-xxxw-1-5 {
    width: 20%; }

  .col-xxxw-2-5 {
    width: 40%; }

  .col-xxxw-3-5 {
    width: 60%; }

  .col-xxxw-4-5 {
    width: 80%; }

  .col-xxxw-1-6 {
    width: 16.656%; }

  .col-xxxw-5-6 {
    width: 83.33%; }

  .col-xxxw-1-8 {
    width: 12.5%; }

  .col-xxxw-3-8 {
    width: 37.5%; }

  .col-xxxw-5-8 {
    width: 62.5%; }

  .col-xxxw-7-8 {
    width: 87.5%; }

  .col-xxxw-1-12 {
    width: 8.3333%; }

  .col-xxxw-5-12 {
    width: 41.6666%; }

  .col-xxxw-7-12 {
    width: 58.3333%; }

  .col-xxxw-11-12 {
    width: 91.6666%; }

  .col-xxxw-1-24 {
    width: 4.1666%; }

  .col-xxxw-5-24 {
    width: 20.8333%; }

  .col-xxxw-7-24 {
    width: 29.1666%; }

  .col-xxxw-11-24 {
    width: 45.8333%; }

  .col-xxxw-13-24 {
    width: 54.1666%; }

  .col-xxxw-17-24 {
    width: 70.8333%; }

  .col-xxxw-19-24 {
    width: 79.1666%; }

  .col-xxxw-23-24 {
    width: 95.8333%; } }
/*  ==========================================================================
	Basic layout classes -- layout/layout.scss
	========================================================================== */
html {
  height: -webkit-fill-available; }

body {
  font-family: "PP Neue Montreal", sans-serif;
  margin: 0;
  padding: 0;
  color: #111;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  overflow-y: hidden;
  max-width: 100%;
  min-height: 100vh;
  min-height: -webkit-fill-available;
  background-color: #ffffff; }
  body.finished {
    overflow-y: scroll; }
  @media only screen and (max-width: 999px) {
    body {
      display: none; } }

main {
  overflow-x: hidden; }

.bd {
  margin: 0 7.14%;
  position: relative;
  min-height: 1px; }
  @media only screen and (min-width: 1800px) {
    .bd {
      margin: 0 auto;
      max-width: calc(1800px / 100 * (100 - (7.14 * 2))); } }
  .bd:after {
    content: '';
    visibility: hidden;
    display: block;
    height: 0;
    clear: both; }

.visuallyhidden {
  position: absolute !important;
  overflow: hidden;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0; }

.clearfix {
  *zoom: 1; }
  .clearfix::after {
    content: "";
    display: table;
    clear: both; }

/*  ==========================================================================
	Backgrounds -- layout/layout.scss
	========================================================================== */
.bg-purple {
  background-color: #CFC2F6; }
.bg-orange {
  background-color: #FD6920; }
.bg-white {
  background-color: #ffffff; }
.bg-black {
  background-color: #111; }
.bg-grey {
  background-color: #888; }

/*  ==========================================================================
	Margin & Padding -- layout/layout.scss
	========================================================================== */
.pt {
  padding-top: 3.5rem; }
  @media only screen and (min-width: 550px) {
    .pt {
      padding-top: 4rem; } }
  @media only screen and (min-width: 700px) {
    .pt {
      padding-top: 5rem; } }
  @media only screen and (min-width: 1000px) {
    .pt {
      padding-top: 6rem; } }
  @media only screen and (min-width: 1200px) {
    .pt {
      padding-top: 7rem; } }

.pb {
  padding-bottom: 3.5rem; }
  @media only screen and (min-width: 550px) {
    .pb {
      padding-bottom: 4rem; } }
  @media only screen and (min-width: 700px) {
    .pb {
      padding-bottom: 5rem; } }
  @media only screen and (min-width: 1000px) {
    .pb {
      padding-bottom: 6rem; } }
  @media only screen and (min-width: 1200px) {
    .pb {
      padding-bottom: 7rem; } }

.pt--half {
  padding-top: calc(3.5rem / 2); }
  @media only screen and (min-width: 550px) {
    .pt--half {
      padding-top: calc(4rem / 2); } }
  @media only screen and (min-width: 700px) {
    .pt--half {
      padding-top: calc(5rem / 2); } }
  @media only screen and (min-width: 1000px) {
    .pt--half {
      padding-top: calc(6rem / 2); } }
  @media only screen and (min-width: 1200px) {
    .pt--half {
      padding-top: calc(7rem / 2); } }

.pb--half {
  padding-bottom: calc(3.5rem / 2); }
  @media only screen and (min-width: 550px) {
    .pb--half {
      padding-bottom: calc(4rem / 2); } }
  @media only screen and (min-width: 700px) {
    .pb--half {
      padding-bottom: calc(5rem / 2); } }
  @media only screen and (min-width: 1000px) {
    .pb--half {
      padding-bottom: calc(6rem / 2); } }
  @media only screen and (min-width: 1200px) {
    .pb--half {
      padding-bottom: calc(7rem / 2); } }

.pt--double {
  padding-top: calc(3.5rem * 2); }
  @media only screen and (min-width: 550px) {
    .pt--double {
      padding-top: calc(4rem * 2); } }
  @media only screen and (min-width: 700px) {
    .pt--double {
      padding-top: calc(5rem * 2); } }
  @media only screen and (min-width: 1000px) {
    .pt--double {
      padding-top: calc(6rem * 2); } }
  @media only screen and (min-width: 1200px) {
    .pt--double {
      padding-top: calc(7rem * 2); } }

.pb--double {
  padding-bottom: calc(3.5rem * 2); }
  @media only screen and (min-width: 550px) {
    .pb--double {
      padding-bottom: calc(4rem * 2); } }
  @media only screen and (min-width: 700px) {
    .pb--double {
      padding-bottom: calc(5rem * 2); } }
  @media only screen and (min-width: 1000px) {
    .pb--double {
      padding-bottom: calc(6rem * 2); } }
  @media only screen and (min-width: 1200px) {
    .pb--double {
      padding-bottom: calc(7rem * 2); } }

.pt--em {
  padding-top: 1em; }

.pb--em {
  padding-bottom: 1em; }

.p--none {
  padding: 0; }

.pt--none {
  padding-top: 0; }

.pb--none {
  padding-bottom: 0; }

.mt {
  margin-top: 3.5rem; }
  @media only screen and (min-width: 550px) {
    .mt {
      margin-top: 4rem; } }
  @media only screen and (min-width: 700px) {
    .mt {
      margin-top: 5rem; } }
  @media only screen and (min-width: 1000px) {
    .mt {
      margin-top: 6rem; } }
  @media only screen and (min-width: 1200px) {
    .mt {
      margin-top: 7rem; } }

.mb, .timeline .timeline__heading {
  margin-bottom: 3.5rem; }
  @media only screen and (min-width: 550px) {
    .mb, .timeline .timeline__heading {
      margin-bottom: 4rem; } }
  @media only screen and (min-width: 700px) {
    .mb, .timeline .timeline__heading {
      margin-bottom: 5rem; } }
  @media only screen and (min-width: 1000px) {
    .mb, .timeline .timeline__heading {
      margin-bottom: 6rem; } }
  @media only screen and (min-width: 1200px) {
    .mb, .timeline .timeline__heading {
      margin-bottom: 7rem; } }

.mt--half {
  margin-top: calc(3.5rem / 2); }
  @media only screen and (min-width: 550px) {
    .mt--half {
      margin-top: calc(4rem / 2); } }
  @media only screen and (min-width: 700px) {
    .mt--half {
      margin-top: calc(5rem / 2); } }
  @media only screen and (min-width: 1000px) {
    .mt--half {
      margin-top: calc(6rem / 2); } }
  @media only screen and (min-width: 1200px) {
    .mt--half {
      margin-top: calc(7rem / 2); } }

.mb--half {
  margin-bottom: calc(3.5rem / 2); }
  @media only screen and (min-width: 550px) {
    .mb--half {
      margin-bottom: calc(4rem / 2); } }
  @media only screen and (min-width: 700px) {
    .mb--half {
      margin-bottom: calc(5rem / 2); } }
  @media only screen and (min-width: 1000px) {
    .mb--half {
      margin-bottom: calc(6rem / 2); } }
  @media only screen and (min-width: 1200px) {
    .mb--half {
      margin-bottom: calc(7rem / 2); } }

.mt--double {
  margin-top: calc(3.5rem * 2); }
  @media only screen and (min-width: 550px) {
    .mt--double {
      margin-top: calc(4rem * 2); } }
  @media only screen and (min-width: 700px) {
    .mt--double {
      margin-top: calc(5rem * 2); } }
  @media only screen and (min-width: 1000px) {
    .mt--double {
      margin-top: calc(6rem * 2); } }
  @media only screen and (min-width: 1200px) {
    .mt--double {
      margin-top: calc(7rem * 2); } }

.mb--double {
  margin-bottom: calc(3.5rem * 2); }
  @media only screen and (min-width: 550px) {
    .mb--double {
      margin-bottom: calc(4rem * 2); } }
  @media only screen and (min-width: 700px) {
    .mb--double {
      margin-bottom: calc(5rem * 2); } }
  @media only screen and (min-width: 1000px) {
    .mb--double {
      margin-bottom: calc(6rem * 2); } }
  @media only screen and (min-width: 1200px) {
    .mb--double {
      margin-bottom: calc(7rem * 2); } }

.mt--em {
  margin-top: 1em; }

.mb--em {
  margin-bottom: 1em; }

.m--none {
  margin: 0; }

.mt--none {
  margin-top: 0; }

.mb--none {
  margin-bottom: 0; }

/*  ==========================================================================
	Accents 
	-- Buttons & Text colours are in _links-buttons.scss & _typography.scss
	-- All other accents are below 
	========================================================================== */
.bg-accent {
  background-color: #111;
  color: #ffffff; }
  .color-white .bg-accent {
    background-color: #ffffff;
    color: #111; }

.accent-purple .bg-accent {
  background-color: #CFC2F6; }
.accent-orange .bg-accent {
  background-color: #FD6920; }
.accent-white .bg-accent {
  background-color: #ffffff; }
.accent-black .bg-accent {
  background-color: #111; }
.accent-grey .bg-accent {
  background-color: #888; }

/*  ==========================================================================
	images
	========================================================================== */
.mediaimg {
  width: 100%;
  background-color: rgba(17, 17, 17, 0.15); }
  .color-white .mediaimg {
    background-color: rgba(255, 255, 255, 0.15); }
  .mediaimg .mediaimg__img {
    max-width: 100%;
    width: 100%; }
    .mediaimg .mediaimg__img--bg {
      padding-top: 100%;
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover; }
      .mediaimg .mediaimg__img--bg--cover {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        padding-top: 0; }
    .mediaimg .mediaimg__img--inline {
      display: block;
      height: auto; }
    .mediaimg .mediaimg__img--icon {
      padding-top: 100%;
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain; }

/*  ==========================================================================
	Lazy loading
	========================================================================== */
.lazy {
  opacity: 0;
  transition: opacity 150ms cubic-bezier(0.65, 0, 0.35, 1); }
  .lazy.loaded {
    opacity: 1; }

.header {
  height: 100dvh;
  background-color: #ffffff;
  overflow: hidden;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  pointer-events: none; }
  .header .header__icons {
    height: 100%; }
    .header .header__icons .row {
      height: 100%; }
      .header .header__icons .row .col {
        position: relative; }
    .header .header__icons .header__icons__1 {
      opacity: 0;
      position: absolute;
      top: 50%;
      left: 1.5em;
      transform: translate(0%, -50%) scale(4);
      transition: none !important; }
      @media only screen and (min-width: 550px) {
        .header .header__icons .header__icons__1 {
          transform: translate(0%, -50%);
          left: 1.25em; } }
    .header .header__icons .header__icons__2 {
      opacity: 0;
      position: absolute;
      top: 5%;
      transform: scale(1.5);
      transition: none !important; }
      @media only screen and (min-width: 550px) {
        .header .header__icons .header__icons__2 {
          top: 0;
          transform: scale(1); } }
    .header .header__icons .header__icons__3 {
      opacity: 0;
      position: absolute;
      bottom: 5%;
      transform: scale(1.5);
      transition: none !important; }
      @media only screen and (min-width: 550px) {
        .header .header__icons .header__icons__3 {
          bottom: 0;
          transform: scale(1); } }
    .header .header__icons .header__icons__4 {
      opacity: 0;
      position: absolute;
      top: 25%;
      transform: scale(1.5);
      transition: none !important; }
      @media only screen and (min-width: 550px) {
        .header .header__icons .header__icons__4 {
          transform: scale(1); } }
    .header .header__icons .header__icons__5 {
      opacity: 0;
      position: absolute;
      bottom: 30%;
      transform: scale(1.5); }
      @media only screen and (min-width: 550px) {
        .header .header__icons .header__icons__5 {
          transform: scale(1); } }
    .header .header__icons .header__icons__6 {
      opacity: 0;
      position: absolute;
      top: 25%;
      transform: scale(1.5); }
      @media only screen and (min-width: 550px) {
        .header .header__icons .header__icons__6 {
          transform: scale(1); } }
    .header .header__icons .header__icons__7 {
      opacity: 0;
      position: absolute;
      bottom: 17%;
      transform: scale(1.5); }
      @media only screen and (min-width: 550px) {
        .header .header__icons .header__icons__7 {
          transform: scale(1); } }
    .header .header__icons .header__icons__8 {
      opacity: 0;
      position: absolute;
      top: 25%;
      transform: scale(1.5); }
      @media only screen and (min-width: 550px) {
        .header .header__icons .header__icons__8 {
          transform: scale(1); } }
    .header .header__icons .header__icons__9 {
      opacity: 0;
      position: absolute;
      bottom: 0;
      transform: scale(1.5); }
      @media only screen and (min-width: 550px) {
        .header .header__icons .header__icons__9 {
          transform: scale(1); } }
    .header .header__icons .header__icons__10 {
      opacity: 0;
      position: absolute;
      transform: scale(1.5);
      top: 5%; }
      @media only screen and (min-width: 550px) {
        .header .header__icons .header__icons__10 {
          transform: scale(1);
          top: 0; } }
    .header .header__icons .header__icons__11 {
      opacity: 0;
      position: absolute;
      bottom: 21%;
      transform: scale(7.75);
      right: 1.75em; }
      @media only screen and (min-width: 550px) {
        .header .header__icons .header__icons__11 {
          transform: scale(1);
          bottom: 17%; } }
  .header .header__heading {
    max-width: 35em;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%); }
    .header .header__heading span {
      opacity: 0;
      transition: none !important; }
  .header .header__scroll {
    position: absolute;
    bottom: 0;
    left: 0;
    opacity: 0;
    width: 100%;
    height: 13rem; }

.container {
  position: relative;
  z-index: 1;
  margin-top: 100dvh;
  background-color: #ffffff; }

.we-are {
  height: 100dvh;
  z-index: 4;
  position: relative; }
  .we-are .bd {
    border-top: 1px solid #111; }
  .we-are .we-are__heading {
    text-align: center;
    padding-top: 2rem;
    margin: 0 auto 4rem;
    max-width: 54rem; }
  .we-are .image-container {
    display: flex;
    gap: 3rem;
    position: absolute;
    white-space: nowrap;
    position: absolute;
    right: -100%;
    justify-content: flex-start;
    padding-left: 15%;
    background-color: #CFC2F6;
    bottom: 0; }
    .we-are .image-container::after {
      content: "";
      width: 100vw;
      background-color: #CFC2F6;
      position: absolute;
      width: 100vw;
      height: -webkit-fill-available;
      left: 98%;
      top: 0;
      z-index: -1; }
    .we-are .image-container::before {
      content: "";
      width: 100vw;
      background-color: #CFC2F6;
      position: absolute;
      width: 100vw;
      height: -webkit-fill-available;
      right: 98%;
      top: 0;
      z-index: -1; }
    .we-are .image-container img {
      width: 600px;
      height: 350px;
      object-fit: contain; }
    .we-are .image-container video {
      pointer-events: none;
      width: 600px;
      height: 350px; }

.team {
  height: 100dvh;
  position: relative; }
  .team .team__heading {
    text-align: center; }
  .team .bd {
    height: 100%; }
  .team .team__circle {
    width: 60px;
    height: 60px;
    background: #111;
    border-radius: 50%;
    z-index: 0;
    position: absolute;
    top: 30px;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #111; }
    @media only screen and (min-width: 1800px) {
      .team .team__circle {
        top: 30px;
        width: 60px;
        height: 60px; } }
    .team .team__circle .team__circle__heading {
      opacity: 0; }
    .team .team__circle .team__circle__light {
      opacity: 0; }
      .team .team__circle .team__circle__light--1 {
        position: absolute;
        left: -10rem;
        bottom: 7rem; }
      .team .team__circle .team__circle__light--2 {
        position: absolute;
        left: -12rem;
        bottom: 23rem; }
      .team .team__circle .team__circle__light--3 {
        position: absolute;
        left: -7rem;
        top: -3rem; }
      .team .team__circle .team__circle__light--4 {
        position: absolute;
        right: -7rem;
        top: -2rem; }
      .team .team__circle .team__circle__light--5 {
        position: absolute;
        right: -12rem;
        bottom: 23rem; }
      .team .team__circle .team__circle__light--6 {
        position: absolute;
        right: -14rem;
        bottom: 12rem; }
  .team .team__body {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    position: relative; }
    .team .team__body .team__body__heading {
      text-align: center;
      margin-top: 1em; }
    .team .team__body .team__body__bodies {
      text-align: center;
      position: absolute;
      top: 50%;
      left: 50%;
      margin-right: -50%;
      transform: translate(-50%, -50%); }
    .team .team__body .team__body__credit {
      margin-bottom: 1.5em; }

.collaboration .collaboration__heading {
  text-align: center;
  margin: 2rem auto 4rem;
  max-width: 54rem; }

.transform .transform__content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10; }
  .transform .transform__content .transform__heading {
    max-width: 40rem;
    text-align: center; }

.timeline .timeline__heading {
  margin-top: 2rem;
  margin-left: auto;
  margin-right: auto;
  max-width: 54rem;
  text-align: center; }
.timeline .label {
  height: 4em;
  display: flex;
  align-items: end;
  border-right: 1px dashed rgba(17, 17, 17, 0.2);
  border-bottom: 1px solid rgba(17, 17, 17, 0.2); }
  .timeline .label .month__label {
    padding-bottom: 0.25em;
    font-weight: 500; }
.timeline .month__container .col {
  height: 4em;
  display: flex;
  align-items: center;
  border-bottom: 1px solid rgba(17, 17, 17, 0.2); }
  .timeline .month__container .col--border-right {
    border-right: 1px dashed rgba(17, 17, 17, 0.2); }
.timeline .month {
  position: relative;
  width: 100%; }
  .timeline .month .month__item {
    position: relative;
    padding: 0.25em 0.5em 1.5em 0.5em;
    display: inline-block;
    overflow-x: clip; }
    .timeline .month .month__item .content {
      padding-left: 1.75em;
      position: relative;
      white-space: nowrap;
      position: relative; }
      .timeline .month .month__item .content:before {
        position: absolute;
        aspect-ratio: 1/1;
        height: 75%;
        display: flex;
        align-items: center;
        border-radius: 100%;
        background-color: #ffffff;
        left: 0;
        top: 0.25em;
        content: ""; }
    .timeline .month .month__item--jan {
      width: 100%;
      left: 20%;
      background-color: #B7F1EB; }
    .timeline .month .month__item--feb {
      width: 90%;
      left: 30%;
      background-color: #FD6920; }
      .timeline .month .month__item--feb--2 {
        width: 90%;
        left: 80%;
        background-color: #B7F1EB; }
    .timeline .month .month__item--mar {
      width: 70%;
      left: 5%;
      background-color: #B39EF4; }
      .timeline .month .month__item--mar--2 {
        width: 70%;
        left: 80%;
        background-color: #B7F1EB; }

.performance {
  background-color: #111;
  color: #ffffff;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: space-between; }
  .performance .performance__heading {
    max-width: 48rem;
    margin: 0;
    padding: 3rem 0; }
  .performance .performance__graph {
    padding-bottom: 2rem; }
    .performance .performance__graph .performance__graph__single .performance__single-heading {
      padding: 4rem 0 1rem 0;
      margin: 0;
      position: relative;
      z-index: 1; }
    .performance .performance__graph .performance__graph__single--rate {
      position: relative;
      color: #111; }
      .performance .performance__graph .performance__graph__single--rate .performance__bar {
        background-color: #B7F1EB;
        position: absolute;
        left: 0;
        top: 0;
        height: 100%;
        width: 0; }
    .performance .performance__graph .performance__graph__single--time {
      position: relative;
      color: #111; }
      .performance .performance__graph .performance__graph__single--time .performance__bar {
        background-color: #CFC2F6;
        position: absolute;
        left: 0;
        top: 0;
        height: 100%;
        width: 0; }
    .performance .performance__graph .performance__graph__single--interaction {
      position: relative;
      color: #111; }
      .performance .performance__graph .performance__graph__single--interaction .performance__bar {
        background-color: #FD6920;
        position: absolute;
        left: 0;
        top: 0;
        height: 100%;
        width: 0; }

.footer {
  background-color: #111;
  height: 100dvh;
  color: #ffffff;
  position: relative; }
  .footer .footer__heading {
    mix-blend-mode: difference;
    position: relative;
    z-index: 2;
    padding-top: 0.5em; }
  .footer .footer__marquee {
    white-space: nowrap;
    position: absolute;
    right: -110%;
    /* Start from outside right */
    bottom: 0;
    z-index: 1;
    font-size: 60px;
    font-weight: 500;
    mix-blend-mode: difference; }
    @media only screen and (min-width: 550px) {
      .footer .footer__marquee {
        font-size: 75px; } }
    @media only screen and (min-width: 700px) {
      .footer .footer__marquee {
        font-size: 95px; } }
    @media only screen and (min-width: 1000px) {
      .footer .footer__marquee {
        font-size: 156px; } }
    @media only screen and (min-width: 1200px) {
      .footer .footer__marquee {
        font-size: 212px; } }
    @media only screen and (min-width: 1400px) {
      .footer .footer__marquee {
        font-size: 280px; } }
    @media only screen and (min-width: 1600px) {
      .footer .footer__marquee {
        font-size: 360px; } }
  .footer .footer__background {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0%;
    /* Start at 0% */
    background: #B7F1EB;
    /* Background that grows */
    z-index: 0; }

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