/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
    line-height: 1.15; /* 1 */
    -webkit-text-size-adjust: 100%; /* 2 */
  }

/* Sections
     ========================================================================== */

/**
   * Remove the margin in all browsers.
   */

body {
    margin: 0;
  }

/**
   * Render the `main` element consistently in IE.
   */

main {
    display: block;
  }

/**
   * Correct the font size and margin on `h1` elements within `section` and
   * `article` contexts in Chrome, Firefox, and Safari.
   */

h1 {
    font-size: 2em;
    margin: 0.67em 0;
  }

/* Grouping content
     ========================================================================== */

/**
   * 1. Add the correct box sizing in Firefox.
   * 2. Show the overflow in Edge and IE.
   */

hr {
    box-sizing: content-box; /* 1 */
    height: 0; /* 1 */
    overflow: visible; /* 2 */
  }

/**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */

pre {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }

/* Text-level semantics
     ========================================================================== */

/**
   * Remove the gray background on active links in IE 10.
   */

a {
    background-color: transparent;
  }

/**
   * 1. Remove the bottom border in Chrome 57-
   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
   */

abbr[title] {
    border-bottom: none; /* 1 */
    -webkit-text-decoration: underline;
    text-decoration: underline; /* 2 */
    text-decoration: underline;
    -webkit-text-decoration: underline dotted;
            text-decoration: underline dotted; /* 2 */
  }

/**
   * Add the correct font weight in Chrome, Edge, and Safari.
   */

b,
  strong {
    font-weight: bolder;
  }

/**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */

code,
  kbd,
  samp {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }

/**
   * Add the correct font size in all browsers.
   */

small {
    font-size: 80%;
  }

/**
   * Prevent `sub` and `sup` elements from affecting the line height in
   * all browsers.
   */

sub,
  sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }

sub {
    bottom: -0.25em;
  }

sup {
    top: -0.5em;
  }

/* Embedded content
     ========================================================================== */

/**
   * Remove the border on images inside links in IE 10.
   */

img {
    border-style: none;
  }

/* Forms
     ========================================================================== */

/**
   * 1. Change the font styles in all browsers.
   * 2. Remove the margin in Firefox and Safari.
   */

button,
  input,
  optgroup,
  select,
  textarea {
    font-family: inherit; /* 1 */
    font-size: 100%; /* 1 */
    line-height: 1.15; /* 1 */
    margin: 0; /* 2 */
  }

/**
   * Show the overflow in IE.
   * 1. Show the overflow in Edge.
   */

button,
  input { /* 1 */
    overflow: visible;
  }

/**
   * Remove the inheritance of text transform in Edge, Firefox, and IE.
   * 1. Remove the inheritance of text transform in Firefox.
   */

button,
  select { /* 1 */
    text-transform: none;
  }

/**
   * Correct the inability to style clickable types in iOS and Safari.
   */

button,
  [type="button"],
  [type="reset"],
  [type="submit"] {
    -webkit-appearance: button;
  }

/**
   * Remove the inner border and padding in Firefox.
   */

button::-moz-focus-inner,
  [type="button"]::-moz-focus-inner,
  [type="reset"]::-moz-focus-inner,
  [type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
  }

/**
   * Restore the focus styles unset by the previous rule.
   */

button:-moz-focusring,
  [type="button"]:-moz-focusring,
  [type="reset"]:-moz-focusring,
  [type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText;
  }

/**
   * Correct the padding in Firefox.
   */

fieldset {
    padding: 0.35em 0.75em 0.625em;
  }

/**
   * 1. Correct the text wrapping in Edge and IE.
   * 2. Correct the color inheritance from `fieldset` elements in IE.
   * 3. Remove the padding so developers are not caught out when they zero out
   *    `fieldset` elements in all browsers.
   */

legend {
    box-sizing: border-box; /* 1 */
    color: inherit; /* 2 */
    display: table; /* 1 */
    max-width: 100%; /* 1 */
    padding: 0; /* 3 */
    white-space: normal; /* 1 */
  }

/**
   * Add the correct vertical alignment in Chrome, Firefox, and Opera.
   */

progress {
    vertical-align: baseline;
  }

/**
   * Remove the default vertical scrollbar in IE 10+.
   */

textarea {
    overflow: auto;
  }

/**
   * 1. Add the correct box sizing in IE 10.
   * 2. Remove the padding in IE 10.
   */

[type="checkbox"],
  [type="radio"] {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
  }

/**
   * Correct the cursor style of increment and decrement buttons in Chrome.
   */

[type="number"]::-webkit-inner-spin-button,
  [type="number"]::-webkit-outer-spin-button {
    height: auto;
  }

/**
   * 1. Correct the odd appearance in Chrome and Safari.
   * 2. Correct the outline style in Safari.
   */

[type="search"] {
    -webkit-appearance: textfield; /* 1 */
    outline-offset: -2px; /* 2 */
  }

/**
   * Remove the inner padding in Chrome and Safari on macOS.
   */

[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
  }

/**
   * 1. Correct the inability to style clickable types in iOS and Safari.
   * 2. Change font properties to `inherit` in Safari.
   */

::-webkit-file-upload-button {
    -webkit-appearance: button; /* 1 */
    font: inherit; /* 2 */
  }

/* Interactive
     ========================================================================== */

/*
   * Add the correct display in Edge, IE 10+, and Firefox.
   */

details {
    display: block;
  }

/*
   * Add the correct display in all browsers.
   */

summary {
    display: list-item;
  }

/* Misc
     ========================================================================== */

/**
   * Add the correct display in IE 10+.
   */

template {
    display: none;
  }

/**
   * Add the correct display in IE 10.
   */

[hidden] {
    display: none;
  }

/**
 * RESET
 *
 * Not really a reset, but rather a restart
 */

html {
    font-size: 16px;
}

/**
 * Happy box models for all
 */

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

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

/**
 * Link styles
 */

a,
.text-link {
    color: var(--color-text-links, rgb(0, 168, 45));
}

.text-link--primary {
    color: var(--color-text-primary-links);
}

.text-link--dark {
    color: var(--color-text-dark-links);
}

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

pre {
    white-space: pre-wrap;
}

hr {
    border-style: solid;
    border-width: 1px 0 0;
    color: inherit;
    height: 0;
    overflow: visible;
}

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

u,
ins {
    -webkit-text-decoration: none;
    text-decoration: none;
}

/**
 * Apply faux underline via `border-bottom`.
 */

ins {
    border-bottom: 1px solid;
}

/**
 * A block element is usually what we want for these
 * type of elements
 */

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
    display: block;
    max-width: 100%;
}

/**
 * Maintain intrinsic aspect ratios when `max-width` is applied
 * (iframe, embed, and object have no intrinsic ratio, set height explicitly)
 * Cite: https://github.com/mozdevs/cssremedy
 */

img,
svg,
video,
canvas {
    height: auto;
}

/**
 * So that `alt` text is visually offset if images don’t load.
 */

img {
    font-style: italic;
}

/**
 * Give form elements some cursor interactions...
 */

label,
input,
textarea,
button,
select,
option {
    cursor: pointer;
}

.text-input:active,
.text-input:focus,
textarea:active,
textarea:focus {
    cursor: text;
    outline: none;
}

i.reset {
    font-style: normal;
}

/**
 * Add option to reset abbr tag
 */

abbr[title].reset {
    border-bottom: none;
    -webkit-text-decoration: none;
    text-decoration: none;
}

/**
 * Styles to help prevent Flash of Unstyled Text (FOUT) when using
 * Google WebFont Loader
 */

.wf-loading h1,
.wf-loading h2,
.wf-loading h3,
.wf-loading h4,
.wf-loading h5,
.wf-loading h6,
.wf-loading p,
.wf-loading button,
.wf-loading li,
.wf-loading a {
    visibility: hidden;
}

/**
 * Remove list bullet image for lists contained in a <nav>
 */

nav ul,
nav ol {
    list-style: none;
    list-style-image: none;
}

.angle-top-left,
.angle-top-left-5 {
    -webkit-clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% 100%, 0 100%);
            clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% 100%, 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-top-right,
.angle-top-right-5 {
    -webkit-clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% 100%, 0 100%);
            clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% 100%, 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-bottom-left,
.angle-bottom-left-5 {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 4vw));
            clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 4vw));
    -webkit-transform: scaleZ(1.1);
}

.angle-bottom-right,
.angle-bottom-right-5 {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% calc(100% - 4vw), 0 100%);
            clip-path: polygon(0 0, 100% 0, 100% calc(100% - 4vw), 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-both-left-left,
.angle-both-left-left-5 {
    -webkit-clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% 100%, 0 calc(100% - 4vw));
            clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% 100%, 0 calc(100% - 4vw));
    -webkit-transform: scaleZ(1.1);
}

.angle-both-left-right,
.angle-both-left-right-5 {
    -webkit-clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% calc(100% - 4vw), 0 100%);
            clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% calc(100% - 4vw), 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-both-right-left,
.angle-both-right-left-5 {
    -webkit-clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% 100%, 0 calc(100% - 4vw));
            clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% 100%, 0 calc(100% - 4vw));
    -webkit-transform: scaleZ(1.1);
}

.angle-both-right-right,
.angle-both-right-right-5 {
    -webkit-clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% calc(100% - 4vw), 0 100%);
            clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% calc(100% - 4vw), 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-top-left-10 {
    -webkit-clip-path: polygon(0 calc(0% + 8vw), 100% 0, 100% 100%, 0 100%);
            clip-path: polygon(0 calc(0% + 8vw), 100% 0, 100% 100%, 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-bottom-left-10 {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 8vw));
            clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 8vw));
    -webkit-transform: scaleZ(1.1);
}

.angle-top-right-10 {
    -webkit-clip-path: polygon(0 0, 100% calc(0% + 8vw), 100% 100%, 0 100%);
            clip-path: polygon(0 0, 100% calc(0% + 8vw), 100% 100%, 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-bottom-right-10 {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8vw), 0 100%);
            clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8vw), 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-both-left-left-10 {
    -webkit-clip-path: polygon(0 calc(0% + 8vw), 100% 0, 100% 100%, 0 calc(100% - 8vw));
            clip-path: polygon(0 calc(0% + 8vw), 100% 0, 100% 100%, 0 calc(100% - 8vw));
    -webkit-transform: scaleZ(1.1);
}

.angle-both-left-right-10 {
    -webkit-clip-path: polygon(0 calc(0% + 8vw), 100% 0, 100% calc(100% - 8vw), 0 100%);
            clip-path: polygon(0 calc(0% + 8vw), 100% 0, 100% calc(100% - 8vw), 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-both-right-right-10 {
    -webkit-clip-path: polygon(0 0, 100% calc(0% + 8vw), 100% calc(100% - 8vw), 0 100%);
            clip-path: polygon(0 0, 100% calc(0% + 8vw), 100% calc(100% - 8vw), 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-both-right-left-10 {
    -webkit-clip-path: polygon(0 0, 100% calc(0% + 8vw), 100% 100%, 0 calc(100% - 8vw));
            clip-path: polygon(0 0, 100% calc(0% + 8vw), 100% 100%, 0 calc(100% - 8vw));
    -webkit-transform: scaleZ(1.1);
}

.angle-top-left-15 {
    -webkit-clip-path: polygon(0 calc(0% + 12vw), 100% 0, 100% 100%, 0 100%);
            clip-path: polygon(0 calc(0% + 12vw), 100% 0, 100% 100%, 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-bottom-left-15 {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 12vw));
            clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 12vw));
    -webkit-transform: scaleZ(1.1);
}

.angle-top-right-15 {
    -webkit-clip-path: polygon(0 0, 100% calc(0% + 12vw), 100% 100%, 0 100%);
            clip-path: polygon(0 0, 100% calc(0% + 12vw), 100% 100%, 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-bottom-right-15 {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% calc(100% - 12vw), 0 100%);
            clip-path: polygon(0 0, 100% 0, 100% calc(100% - 12vw), 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-both-left-left-15 {
    -webkit-clip-path: polygon(0 calc(0% + 12vw), 100% 0, 100% 100%, 0 calc(100% - 12vw));
            clip-path: polygon(0 calc(0% + 12vw), 100% 0, 100% 100%, 0 calc(100% - 12vw));
    -webkit-transform: scaleZ(1.1);
}

.angle-both-left-right-15 {
    -webkit-clip-path: polygon(0 calc(0% + 12vw), 100% 0, 100% calc(100% - 12vw), 0 100%);
            clip-path: polygon(0 calc(0% + 12vw), 100% 0, 100% calc(100% - 12vw), 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-both-right-right-15 {
    -webkit-clip-path: polygon(0 0, 100% calc(0% + 12vw), 100% calc(100% - 12vw), 0 100%);
            clip-path: polygon(0 0, 100% calc(0% + 12vw), 100% calc(100% - 12vw), 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-both-right-left-15 {
    -webkit-clip-path: polygon(0 0, 100% calc(0% + 12vw), 100% 100%, 0 calc(100% - 12vw));
            clip-path: polygon(0 0, 100% calc(0% + 12vw), 100% 100%, 0 calc(100% - 12vw));
    -webkit-transform: scaleZ(1.1);
}

.angle-top-left-20 {
    -webkit-clip-path: polygon(0 calc(0% + 16vw), 100% 0, 100% 100%, 0 100%);
            clip-path: polygon(0 calc(0% + 16vw), 100% 0, 100% 100%, 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-top-right-20 {
    -webkit-clip-path: polygon(0 0, 100% calc(0% + 16vw), 100% 100%, 0 100%);
            clip-path: polygon(0 0, 100% calc(0% + 16vw), 100% 100%, 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-bottom-left-20 {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 16vw));
            clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 16vw));
    -webkit-transform: scaleZ(1.1);
}

.angle-bottom-right-20 {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% calc(100% - 16vw), 0 100%);
            clip-path: polygon(0 0, 100% 0, 100% calc(100% - 16vw), 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-both-left-left-20 {
    -webkit-clip-path: polygon(0 calc(0% + 16vw), 100% 0, 100% 100%, 0 calc(100% - 16vw));
            clip-path: polygon(0 calc(0% + 16vw), 100% 0, 100% 100%, 0 calc(100% - 16vw));
    -webkit-transform: scaleZ(1.1);
}

.angle-both-left-right-20 {
    -webkit-clip-path: polygon(0 calc(0% + 16vw), 100% 0, 100% calc(100% - 16vw), 0 100%);
            clip-path: polygon(0 calc(0% + 16vw), 100% 0, 100% calc(100% - 16vw), 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-both-right-right-20 {
    -webkit-clip-path: polygon(0 0, 100% calc(0% + 16vw), 100% calc(100% - 16vw), 0 100%);
            clip-path: polygon(0 0, 100% calc(0% + 16vw), 100% calc(100% - 16vw), 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.angle-both-right-left-20 {
    -webkit-clip-path: polygon(0 0, 100% calc(0% + 16vw), 100% 100%, 0 calc(100% - 16vw));
            clip-path: polygon(0 0, 100% calc(0% + 16vw), 100% 100%, 0 calc(100% - 16vw));
    -webkit-transform: scaleZ(1.1);
}

:root {
    --animate-duration: 0.5s;
    --animate-delay: 0.5s;
    --animate-repeat: 1;
}

.animate {
    animation-duration: var(--animate-duration);
    animation-fill-mode: both;
}

.blink {
    animation: blink 1s step-end infinite;
}

@keyframes blink {
    0% {
        opacity: 1;
    }

    49% {
        opacity: 1;
    }

    60% {
        opacity: 0;
    }

    99% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.animate-fade-in {
    animation-name: fadein;
}

@keyframes fadeout {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

.animate-fade-out {
    animation-name: fadeout;
}

/*
 * .bg
 * Utility for adding background color to elements
 */

.bg,
.bg--white {
    background-color: var(--color-base-white);
}

/*
 * Applies our Cboe blue
 */

.bg--primary {
    background-color: var(--color-base-primary);
}

.bg--blue-1 {
    background-color: var(--color-base-blue-1);
}

.bg--blue-2 {
    background-color: var(--color-base-blue-1);
}

.bg-neutral-100 {
            background-color: var(--color-base-neutral-100) !important;
        }

.bg-neutral-100 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-neutral-200 {
            background-color: var(--color-base-neutral-200) !important;
        }

.bg-neutral-200 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-neutral-300 {
            background-color: var(--color-base-neutral-300) !important;
        }

.bg-neutral-300 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-neutral-400 {
            background-color: var(--color-base-neutral-400) !important;
        }

.bg-neutral-400 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-neutral-500 {
            background-color: var(--color-base-neutral-500) !important;
        }

.bg-neutral-500 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-neutral-600 {
            background-color: var(--color-base-neutral-600) !important;
        }

.bg-neutral-600 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-neutral-700 {
            background-color: var(--color-base-neutral-700) !important;
        }

.bg-neutral-700 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-neutral-800 {
            background-color: var(--color-base-neutral-800) !important;
        }

.bg-neutral-800 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-neutral-900 {
            background-color: var(--color-base-neutral-900) !important;
        }

.bg-neutral-900 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-neutral-1000 {
            background-color: var(--color-base-neutral-1000) !important;
        }

.bg-neutral-1000 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-neutral-1100 {
            background-color: var(--color-base-neutral-1100) !important;
        }

.bg-neutral-1100 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-neutral-1200 {
            background-color: var(--color-base-neutral-1200) !important;
        }

.bg-neutral-1200 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-neutral-1300 {
            background-color: var(--color-base-neutral-1300) !important;
        }

.bg-neutral-1300 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-neutral-1400 {
            background-color: var(--color-base-neutral-1400) !important;
        }

.bg-neutral-1400 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-neutral-1500 {
            background-color: var(--color-base-neutral-1500) !important;
        }

.bg-neutral-1500 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-blue-100 {
            background-color: var(--color-base-blue-100) !important;
        }

.bg-blue-100 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-blue-200 {
            background-color: var(--color-base-blue-200) !important;
        }

.bg-blue-200 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-blue-300 {
            background-color: var(--color-base-blue-300) !important;
        }

.bg-blue-300 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-blue-400 {
            background-color: var(--color-base-blue-400) !important;
        }

.bg-blue-400 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-blue-500 {
            background-color: var(--color-base-blue-500) !important;
        }

.bg-blue-500 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-blue-600 {
            background-color: var(--color-base-blue-600) !important;
        }

.bg-blue-600 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-blue-700 {
            background-color: var(--color-base-blue-700) !important;
        }

.bg-blue-700 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-blue-800 {
            background-color: var(--color-base-blue-800) !important;
        }

.bg-blue-800 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-blue-900 {
            background-color: var(--color-base-blue-900) !important;
        }

.bg-blue-900 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-blue-1000 {
            background-color: var(--color-base-blue-1000) !important;
        }

.bg-blue-1000 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-blue-1100 {
            background-color: var(--color-base-blue-1100) !important;
        }

.bg-blue-1100 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-blue-1200 {
            background-color: var(--color-base-blue-1200) !important;
        }

.bg-blue-1200 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-blue-1300 {
            background-color: var(--color-base-blue-1300) !important;
        }

.bg-blue-1300 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-blue-1400 {
            background-color: var(--color-base-blue-1400) !important;
        }

.bg-blue-1400 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-blue-1500 {
            background-color: var(--color-base-blue-1500) !important;
        }

.bg-blue-1500 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-green-100 {
            background-color: var(--color-base-green-100) !important;
        }

.bg-green-100 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-green-200 {
            background-color: var(--color-base-green-200) !important;
        }

.bg-green-200 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-green-300 {
            background-color: var(--color-base-green-300) !important;
        }

.bg-green-300 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-green-400 {
            background-color: var(--color-base-green-400) !important;
        }

.bg-green-400 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-green-500 {
            background-color: var(--color-base-green-500) !important;
        }

.bg-green-500 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-green-600 {
            background-color: var(--color-base-green-600) !important;
        }

.bg-green-600 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-green-700 {
            background-color: var(--color-base-green-700) !important;
        }

.bg-green-700 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-green-800 {
            background-color: var(--color-base-green-800) !important;
        }

.bg-green-800 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-green-900 {
            background-color: var(--color-base-green-900) !important;
        }

.bg-green-900 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-green-1000 {
            background-color: var(--color-base-green-1000) !important;
        }

.bg-green-1000 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-green-1100 {
            background-color: var(--color-base-green-1100) !important;
        }

.bg-green-1100 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-green-1200 {
            background-color: var(--color-base-green-1200) !important;
        }

.bg-green-1200 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-green-1300 {
            background-color: var(--color-base-green-1300) !important;
        }

.bg-green-1300 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-green-1400 {
            background-color: var(--color-base-green-1400) !important;
        }

.bg-green-1400 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-green-1500 {
            background-color: var(--color-base-green-1500) !important;
        }

.bg-green-1500 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-teal-100 {
            background-color: var(--color-base-teal-100) !important;
        }

.bg-teal-100 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-teal-200 {
            background-color: var(--color-base-teal-200) !important;
        }

.bg-teal-200 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-teal-300 {
            background-color: var(--color-base-teal-300) !important;
        }

.bg-teal-300 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-teal-400 {
            background-color: var(--color-base-teal-400) !important;
        }

.bg-teal-400 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-teal-500 {
            background-color: var(--color-base-teal-500) !important;
        }

.bg-teal-500 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-teal-600 {
            background-color: var(--color-base-teal-600) !important;
        }

.bg-teal-600 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-teal-700 {
            background-color: var(--color-base-teal-700) !important;
        }

.bg-teal-700 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-teal-800 {
            background-color: var(--color-base-teal-800) !important;
        }

.bg-teal-800 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-teal-900 {
            background-color: var(--color-base-teal-900) !important;
        }

.bg-teal-900 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-teal-1000 {
            background-color: var(--color-base-teal-1000) !important;
        }

.bg-teal-1000 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-teal-1100 {
            background-color: var(--color-base-teal-1100) !important;
        }

.bg-teal-1100 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-teal-1200 {
            background-color: var(--color-base-teal-1200) !important;
        }

.bg-teal-1200 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-teal-1300 {
            background-color: var(--color-base-teal-1300) !important;
        }

.bg-teal-1300 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-teal-1400 {
            background-color: var(--color-base-teal-1400) !important;
        }

.bg-teal-1400 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

.bg-teal-1500 {
            background-color: var(--color-base-teal-1500) !important;
        }

.bg-teal-1500 {
            /* stylelint-disable  function-whitespace-after */
            /* stylelint-enable  function-whitespace-after */
        }

/**
 * .columns
 * CSS Multi-column layout
 * Defaults to two columns
 * For mobile devices, maximum
 * amount of columns is three
 */

.columns {
    -moz-column-count: 2;
         column-count: 2;
    margin-bottom: 24px;
}

.columns--3,
.columns--4,
.columns--5,
.columns--6 {
    -moz-column-count: 3;
         column-count: 3;
}

.columns--wide-gap {
    -moz-column-gap: var(--spacing-5);
         column-gap: var(--spacing-5);
}

.columns--narrow-gap {
    -moz-column-gap: var(--spacing-1);
         column-gap: var(--spacing-1);
}

@media only screen and (min-width: 544px) {
    .columns--4 {
        -moz-column-count: 4;
             column-count: 4;
    }

    .columns--5,
    .columns--6 {
        -moz-column-count: 5;
             column-count: 5;
    }

    .columns--2-tablet {
        -moz-column-count: 2;
             column-count: 2;
    }

    .columns--3-tablet {
        -moz-column-count: 3;
             column-count: 3;
    }

    .columns--4-tablet {
        -moz-column-count: 4;
             column-count: 4;
    }

    .columns--5-tablet {
        -moz-column-count: 5;
             column-count: 5;
    }
}

@media only screen and (min-width: 960px) {
    .columns--6 {
        -moz-column-count: 6;
             column-count: 6;
    }

    .columns--2-desktop {
        -moz-column-count: 2;
             column-count: 2;
    }

    .columns--3-desktop {
        -moz-column-count: 3;
             column-count: 3;
    }

    .columns--4-desktop {
        -moz-column-count: 4;
             column-count: 4;
    }

    .columns--5-desktop {
        -moz-column-count: 5;
             column-count: 5;
    }

    .columns--6-desktop {
        -moz-column-count: 6;
             column-count: 6;
    }
}

.elevation-100 {
    box-shadow: var(--elevation-100);
  }

.elevation-100-I {
    box-shadow: var(--elevation-100);
  }

.elevation-200 {
    box-shadow: var(--elevation-200);
  }

.elevation-200-I {
    box-shadow: var(--elevation-200);
  }

.elevation-300 {
    box-shadow: var(--elevation-300);
  }

.elevation-300-I {
    box-shadow: var(--elevation-300);
  }

.elevation-400 {
    box-shadow: var(--elevation-400);
  }

.elevation-400-I {
    box-shadow: var(--elevation-400);
  }

.error-page section {
    padding: 96px 0;
}

.error-page h1 {
    color: var(--color-base-gray-4);
    font-size: 100px;
    font-weight: bold;
    margin-top: var(--spacing-2);
    margin-bottom: var(--spacing-3);
    text-align: center;
}

.error-page h2 {
    color: var(--color-text-brand);
    margin-bottom: var(--spacing-4);
    text-align: center;
}

.error-page__description {
    margin: auto;
    max-width: 720px;
    text-align: center;
}

.error-page img {
    margin: var(--spacing-4) auto;
}

/**
 * .flex
 * Utility for creating flex display elements
 *
 * Note: This is a mobile first approach, so by default
 * the flex direction is set to column. For larger displays,
 * the default flex direction is set to row and each flex
 * item will have a left margin greater than 0
 */

.flex {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
}

.flex--inline {
    display: inline-flex;
}

.flex--column {
    flex-direction: column;
}

.flex--row {
    flex-direction: row;
}

.flex--direction-row {
    flex-direction: row;
}

.flex--direction-row-I {
    flex-direction: row !important;
}

.flex--direction-row-reverse {
    flex-direction: row-reverse;
}

.flex--direction-row-reverse-I {
    flex-direction: row-reverse !important;
}

.flex--direction-column {
    flex-direction: column;
}

.flex--direction-column-I {
    flex-direction: column !important;
}

.flex--direction-column-reverse {
    flex-direction: column-reverse;
}

.flex--direction-column-reverse-I {
    flex-direction: column-reverse !important;
}

.flex--justify-center {
    justify-content: center;
}

.flex--justify-center-I {
    justify-content: center !important;
}

.flex--justify-start {
    justify-content: start;
}

.flex--justify-start-I {
    justify-content: start !important;
}

.flex--justify-end {
    justify-content: end;
}

.flex--justify-end-I {
    justify-content: end !important;
}

.flex--justify-flex-start {
    justify-content: flex-start;
}

.flex--justify-flex-start-I {
    justify-content: flex-start !important;
}

.flex--justify-flex-end {
    justify-content: flex-end;
}

.flex--justify-flex-end-I {
    justify-content: flex-end !important;
}

.flex--justify-left {
    justify-content: left;
}

.flex--justify-left-I {
    justify-content: left !important;
}

.flex--justify-right {
    justify-content: right;
}

.flex--justify-right-I {
    justify-content: right !important;
}

.flex--justify-normal {
    justify-content: normal;
}

.flex--justify-normal-I {
    justify-content: normal !important;
}

.flex--justify-space-between {
    justify-content: space-between;
}

.flex--justify-space-between-I {
    justify-content: space-between !important;
}

.flex--justify-space-around {
    justify-content: space-around;
}

.flex--justify-space-around-I {
    justify-content: space-around !important;
}

.flex--justify-space-evenly {
    justify-content: space-evenly;
}

.flex--justify-space-evenly-I {
    justify-content: space-evenly !important;
}

.flex--justify-stretch {
    justify-content: stretch;
}

.flex--justify-stretch-I {
    justify-content: stretch !important;
}

.flex--justify-safe-center {
    justify-content: safe center;
}

.flex--justify-safe-center-I {
    justify-content: safe center !important;
}

.flex--justify-unsafe-center {
    justify-content: unsafe center;
}

.flex--justify-unsafe-center-I {
    justify-content: unsafe center !important;
}

.flex--justify-inherit {
    justify-content: inherit;
}

.flex--justify-inherit-I {
    justify-content: inherit !important;
}

.flex--justify-revert {
    justify-content: revert;
}

.flex--justify-revert-I {
    justify-content: revert !important;
}

.flex--justify-revert-layer {
    justify-content: revert-layer;
}

.flex--justify-revert-layer-I {
    justify-content: revert-layer !important;
}

.flex--justify-unset {
    justify-content: initial;
}

.flex--justify-unset-I {
    justify-content: unset !important;
}

.flex--wrap {
    flex-wrap: wrap;
}

.flex--wrap-I {
    flex-wrap: wrap !important;
}

.flex--nowrap {
    flex-wrap: nowrap;
}

.flex--nowrap-I {
    flex-wrap: nowrap !important;
}

.flex--wrap-reverse {
    flex-wrap: wrap-reverse;
}

.flex--wrap-reverse-I {
    flex-wrap: wrap-reverse !important;
}

.flex--align-content-start {
    align-content: start;
}

.flex--align-content-start-I {
    align-content: start !important;
}

.flex--align-content-end {
    align-content: end;
}

.flex--align-content-end-I {
    align-content: end !important;
}

.flex--align-content-flex-start {
    align-content: flex-start;
}

.flex--align-content-flex-start-I {
    align-content: flex-start !important;
}

.flex--align-content-flex-end {
    align-content: flex-end;
}

.flex--align-content-flex-end-I {
    align-content: flex-end !important;
}

.flex--align-content-center {
    align-content: center;
}

.flex--align-content-center-I {
    align-content: center !important;
}

.flex--align-content-normal {
    align-content: normal;
}

.flex--align-content-normal-I {
    align-content: normal !important;
}

.flex--align-content-baseline {
    align-content: baseline;
}

.flex--align-content-baseline-I {
    align-content: baseline !important;
}

.flex--align-content-space-between {
    align-content: space-between;
}

.flex--align-content-space-between-I {
    align-content: space-between !important;
}

.flex--align-content-space-around {
    align-content: space-around;
}

.flex--align-content-space-around-I {
    align-content: space-around !important;
}

.flex--align-content-space-evenly {
    align-content: space-evenly;
}

.flex--align-content-space-evenly-I {
    align-content: space-evenly !important;
}

.flex--align-content-stretch {
    align-content: stretch;
}

.flex--align-content-stretch-I {
    align-content: stretch !important;
}

.flex--align-content-safe {
    align-content: safe;
}

.flex--align-content-safe-I {
    align-content: safe !important;
}

.flex--align-content-unsafe {
    align-content: unsafe;
}

.flex--align-content-unsafe-I {
    align-content: unsafe !important;
}

.flex--align-content-first-baseline {
    align-content: first baseline;
}

.flex--align-content-first-baseline-I {
    align-content: first baseline !important;
}

.flex--align-content-last-baseline {
    align-content: last baseline;
}

.flex--align-content-last-baseline-I {
    align-content: last baseline !important;
}

.flex--align-items-center {
    align-items: center;
}

.flex--align-items-center-I {
    align-items: center !important;
}

.flex--align-items-normal {
    align-items: normal;
}

.flex--align-items-normal-I {
    align-items: normal !important;
}

.flex--align-items-stretch {
    align-items: stretch;
}

.flex--align-items-stretch-I {
    align-items: stretch !important;
}

.flex--align-items-start {
    align-items: start;
}

.flex--align-items-start-I {
    align-items: start !important;
}

.flex--align-items-end {
    align-items: end;
}

.flex--align-items-end-I {
    align-items: end !important;
}

.flex--align-items-self-start {
    align-items: self-start;
}

.flex--align-items-self-start-I {
    align-items: self-start !important;
}

.flex--align-items-self-end {
    align-items: self-end;
}

.flex--align-items-self-end-I {
    align-items: self-end !important;
}

.flex--align-items-baseline {
    align-items: baseline;
}

.flex--align-items-baseline-I {
    align-items: baseline !important;
}

.flex--align-items-first-baseline {
    align-items: first baseline;
}

.flex--align-items-first-baseline-I {
    align-items: first baseline !important;
}

.flex--align-items-last-baseline {
    align-items: last baseline;
}

.flex--align-items-last-baseline-I {
    align-items: last baseline !important;
}

.flex--align-items-safe-center {
    align-items: safe center;
}

.flex--align-items-safe-center-I {
    align-items: safe center !important;
}

.flex--align-items-unsafe-center {
    align-items: unsafe center;
}

.flex--align-items-unsafe-center-I {
    align-items: unsafe center !important;
}

.flex--align-items-unset {
    align-items: initial;
}

.flex--align-items-unset-I {
    align-items: unset !important;
}

.flex--align-self-auto {
    align-self: auto;
}

.flex--align-self-auto-I {
    align-self: auto !important;
}

.flex--align-self-normal {
    align-self: normal;
}

.flex--align-self-normal-I {
    align-self: normal !important;
}

.flex--align-self-center {
    align-self: center;
}

.flex--align-self-center-I {
    align-self: center !important;
}

.flex--align-self-start {
    align-self: start;
}

.flex--align-self-start-I {
    align-self: start !important;
}

.flex--align-self-end {
    align-self: end;
}

.flex--align-self-end-I {
    align-self: end !important;
}

.flex--align-self-self-start {
    align-self: self-start;
}

.flex--align-self-self-start-I {
    align-self: self-start !important;
}

.flex--align-self-self-end {
    align-self: self-end;
}

.flex--align-self-self-end-I {
    align-self: self-end !important;
}

.flex--align-self-flex-start {
    align-self: flex-start;
}

.flex--align-self-flex-start-I {
    align-self: flex-start !important;
}

.flex--align-self-flex-end {
    align-self: flex-end;
}

.flex--align-self-flex-end-I {
    align-self: flex-end !important;
}

.flex--align-self-baseline {
    align-self: baseline;
}

.flex--align-self-baseline-I {
    align-self: baseline !important;
}

.flex--align-self-first-baseline {
    align-self: first baseline;
}

.flex--align-self-first-baseline-I {
    align-self: first baseline !important;
}

.flex--align-self-last-baseline {
    align-self: last baseline;
}

.flex--align-self-last-baseline-I {
    align-self: last baseline !important;
}

.flex--align-self-stretch {
    align-self: stretch;
}

.flex--align-self-stretch-I {
    align-self: stretch !important;
}

.flex--align-self-safe-center {
    align-self: safe center;
}

.flex--align-self-safe-center-I {
    align-self: safe center !important;
}

.flex--align-self-unsafe-center {
    align-self: unsafe center;
}

.flex--align-self-unsafe-center-I {
    align-self: unsafe center !important;
}

.flex--reverse-mobile {
    flex-direction: column-reverse;
}

.flex-item-column {
    flex-grow: 1;
    flex-basis: 0;
}

.flex-1-1-auto {
    flex: 1 1 auto;
}

.flex--shrink-0 {
        flex-shrink: 0;
    }

.flex--grow-0 {
        flex-grow: 0;
    }

.flex--shrink-1 {
        flex-shrink: 1;
    }

.flex--grow-1 {
        flex-grow: 1;
    }

.flex--shrink-2 {
        flex-shrink: 2;
    }

.flex--grow-2 {
        flex-grow: 2;
    }

.flex--shrink-3 {
        flex-shrink: 3;
    }

.flex--grow-3 {
        flex-grow: 3;
    }

.flex--shrink-4 {
        flex-shrink: 4;
    }

.flex--grow-4 {
        flex-grow: 4;
    }

.flex--shrink-5 {
        flex-shrink: 5;
    }

.flex--grow-5 {
        flex-grow: 5;
    }

.flex--shrink-6 {
        flex-shrink: 6;
    }

.flex--grow-6 {
        flex-grow: 6;
    }

.flex--shrink-7 {
        flex-shrink: 7;
    }

.flex--grow-7 {
        flex-grow: 7;
    }

.flex--shrink-8 {
        flex-shrink: 8;
    }

.flex--grow-8 {
        flex-grow: 8;
    }

.flex--shrink-9 {
        flex-shrink: 9;
    }

.flex--grow-9 {
        flex-grow: 9;
    }

.flex--shrink-10 {
        flex-shrink: 10;
    }

.flex--grow-10 {
        flex-grow: 10;
    }

.flex--shrink-11 {
        flex-shrink: 11;
    }

.flex--grow-11 {
        flex-grow: 11;
    }

.flex--shrink-12 {
        flex-shrink: 12;
    }

.flex--grow-12 {
        flex-grow: 12;
    }

@media only screen and (min-width: 544px) {
    .flex {
        flex-direction: row;
    }

    .flex > * {
        margin-right: var(--spacing-1);
    }

    .flex > *:last-child {
        margin-right: 0;
    }

    .flex--column,
    .flex--column-tablet {
        flex-direction: column;
    }

    /* stylelint-disable no-descending-specificity */
    .flex--column > * {
        margin-right: 0;
    }
    /* stylelint-enable no-descending-specificity */

    .flex--reverse-mobile {
        flex-direction: row;
    }

    .flex--reverse-tablet {
        flex-direction: row-reverse;
    }
        .flex--direction-row-tablet {
        flex-direction: row;
    }
        .flex--direction-row-tablet-I {
        flex-direction: row !important;
    }
        .flex--direction-row-reverse-tablet {
        flex-direction: row-reverse;
    }
        .flex--direction-row-reverse-tablet-I {
        flex-direction: row-reverse !important;
    }
        .flex--direction-column-tablet {
        flex-direction: column;
    }
        .flex--direction-column-tablet-I {
        flex-direction: column !important;
    }
        .flex--direction-column-reverse-tablet {
        flex-direction: column-reverse;
    }
        .flex--direction-column-reverse-tablet-I {
        flex-direction: column-reverse !important;
    }
        .flex--direction-inherit-tablet {
        flex-direction: inherit;
    }
        .flex--direction-inherit-tablet-I {
        flex-direction: inherit !important;
    }
        .flex--direction-initial-tablet {
        flex-direction: initial;
    }
        .flex--direction-initial-tablet-I {
        flex-direction: initial !important;
    }
        .flex--direction-revert-tablet {
        flex-direction: revert;
    }
        .flex--direction-revert-tablet-I {
        flex-direction: revert !important;
    }
        .flex--direction-revert-layer-tablet {
        flex-direction: revert-layer;
    }
        .flex--direction-revert-layer-tablet-I {
        flex-direction: revert-layer !important;
    }
        .flex--direction-unset-tablet {
        flex-direction: initial;
    }
        .flex--direction-unset-tablet-I {
        flex-direction: unset !important;
    }
        .flex--wrap-tablet {
        flex-wrap: wrap;
    }
        .flex--wrap-tablet-I {
        flex-wrap: wrap !important;
    }
        .flex--nowrap-tablet {
        flex-wrap: nowrap;
    }
        .flex--nowrap-tablet-I {
        flex-wrap: nowrap !important;
    }
        .flex--wrap-reverse-tablet {
        flex-wrap: wrap-reverse;
    }
        .flex--wrap-reverse-tablet-I {
        flex-wrap: wrap-reverse !important;
    }
        .flex--justify-center-tablet {
        justify-content: center;
    }
        .flex--justify-center-tablet-I {
        justify-content: center !important;
    }
        .flex--justify-start-tablet {
        justify-content: start;
    }
        .flex--justify-start-tablet-I {
        justify-content: start !important;
    }
        .flex--justify-end-tablet {
        justify-content: end;
    }
        .flex--justify-end-tablet-I {
        justify-content: end !important;
    }
        .flex--justify-flex-start-tablet {
        justify-content: flex-start;
    }
        .flex--justify-flex-start-tablet-I {
        justify-content: flex-start !important;
    }
        .flex--justify-flex-end-tablet {
        justify-content: flex-end;
    }
        .flex--justify-flex-end-tablet-I {
        justify-content: flex-end !important;
    }
        .flex--justify-left-tablet {
        justify-content: left;
    }
        .flex--justify-left-tablet-I {
        justify-content: left !important;
    }
        .flex--justify-right-tablet {
        justify-content: right;
    }
        .flex--justify-right-tablet-I {
        justify-content: right !important;
    }
        .flex--justify-normal-tablet {
        justify-content: normal;
    }
        .flex--justify-normal-tablet-I {
        justify-content: normal !important;
    }
        .flex--justify-space-between-tablet {
        justify-content: space-between;
    }
        .flex--justify-space-between-tablet-I {
        justify-content: space-between !important;
    }
        .flex--justify-space-around-tablet {
        justify-content: space-around;
    }
        .flex--justify-space-around-tablet-I {
        justify-content: space-around !important;
    }
        .flex--justify-space-evenly-tablet {
        justify-content: space-evenly;
    }
        .flex--justify-space-evenly-tablet-I {
        justify-content: space-evenly !important;
    }
        .flex--justify-stretch-tablet {
        justify-content: stretch;
    }
        .flex--justify-stretch-tablet-I {
        justify-content: stretch !important;
    }
        .flex--justify-safe-uncenter-tablet {
        justify-content: safe uncenter;
    }
        .flex--justify-safe-uncenter-tablet-I {
        justify-content: safe uncenter !important;
    }
        .flex--justify-unsafe-center-tablet {
        justify-content: unsafe center;
    }
        .flex--justify-unsafe-center-tablet-I {
        justify-content: unsafe center !important;
    }
        .flex--justify-inherit-tablet {
        justify-content: inherit;
    }
        .flex--justify-inherit-tablet-I {
        justify-content: inherit !important;
    }
        .flex--justify-revert-tablet {
        justify-content: revert;
    }
        .flex--justify-revert-tablet-I {
        justify-content: revert !important;
    }
        .flex--justify-revert-layer-tablet {
        justify-content: revert-layer;
    }
        .flex--justify-revert-layer-tablet-I {
        justify-content: revert-layer !important;
    }
        .flex--justify-unset-tablet {
        justify-content: initial;
    }
        .flex--justify-unset-tablet-I {
        justify-content: unset !important;
    }
        .flex--align-content-start-tablet {
        align-content: start;
    }
        .flex--align-content-start-tablet-I {
        align-content: start !important;
    }
        .flex--align-content-end-tablet {
        align-content: end;
    }
        .flex--align-content-end-tablet-I {
        align-content: end !important;
    }
        .flex--align-content-flex-start-tablet {
        align-content: flex-start;
    }
        .flex--align-content-flex-start-tablet-I {
        align-content: flex-start !important;
    }
        .flex--align-content-flex-end-tablet {
        align-content: flex-end;
    }
        .flex--align-content-flex-end-tablet-I {
        align-content: flex-end !important;
    }
        .flex--align-content-center-tablet {
        align-content: center;
    }
        .flex--align-content-center-tablet-I {
        align-content: center !important;
    }
        .flex--align-content-normal-tablet {
        align-content: normal;
    }
        .flex--align-content-normal-tablet-I {
        align-content: normal !important;
    }
        .flex--align-content-baseline-tablet {
        align-content: baseline;
    }
        .flex--align-content-baseline-tablet-I {
        align-content: baseline !important;
    }
        .flex--align-content-space-between-tablet {
        align-content: space-between;
    }
        .flex--align-content-space-between-tablet-I {
        align-content: space-between !important;
    }
        .flex--align-content-space-around-tablet {
        align-content: space-around;
    }
        .flex--align-content-space-around-tablet-I {
        align-content: space-around !important;
    }
        .flex--align-content-space-evenly-tablet {
        align-content: space-evenly;
    }
        .flex--align-content-space-evenly-tablet-I {
        align-content: space-evenly !important;
    }
        .flex--align-content-stretch-tablet {
        align-content: stretch;
    }
        .flex--align-content-stretch-tablet-I {
        align-content: stretch !important;
    }
        .flex--align-content-safe-tablet {
        align-content: safe;
    }
        .flex--align-content-safe-tablet-I {
        align-content: safe !important;
    }
        .flex--align-content-unsafe-tablet {
        align-content: unsafe;
    }
        .flex--align-content-unsafe-tablet-I {
        align-content: unsafe !important;
    }
        .flex--align-content-first-baseline-tablet {
        align-content: first baseline;
    }
        .flex--align-content-first-baseline-tablet-I {
        align-content: first baseline !important;
    }
        .flex--align-content-last-baseline-tablet {
        align-content: last baseline;
    }
        .flex--align-content-last-baseline-tablet-I {
        align-content: last baseline !important;
    }
        .flex--align-items-center-tablet {
        align-items: center;
    }
        .flex--align-items-center-tablet-I {
        align-items: center !important;
    }
        .flex--align-items-normal-tablet {
        align-items: normal;
    }
        .flex--align-items-normal-tablet-I {
        align-items: normal !important;
    }
        .flex--align-items-stretch-tablet {
        align-items: stretch;
    }
        .flex--align-items-stretch-tablet-I {
        align-items: stretch !important;
    }
        .flex--align-items-start-tablet {
        align-items: start;
    }
        .flex--align-items-start-tablet-I {
        align-items: start !important;
    }
        .flex--align-items-end-tablet {
        align-items: end;
    }
        .flex--align-items-end-tablet-I {
        align-items: end !important;
    }
        .flex--align-items-self-start-tablet {
        align-items: self-start;
    }
        .flex--align-items-self-start-tablet-I {
        align-items: self-start !important;
    }
        .flex--align-items-self-end-tablet {
        align-items: self-end;
    }
        .flex--align-items-self-end-tablet-I {
        align-items: self-end !important;
    }
        .flex--align-items-baseline-tablet {
        align-items: baseline;
    }
        .flex--align-items-baseline-tablet-I {
        align-items: baseline !important;
    }
        .flex--align-items-first-baseline-tablet {
        align-items: first baseline;
    }
        .flex--align-items-first-baseline-tablet-I {
        align-items: first baseline !important;
    }
        .flex--align-items-last-baseline-tablet {
        align-items: last baseline;
    }
        .flex--align-items-last-baseline-tablet-I {
        align-items: last baseline !important;
    }
        .flex--align-items-safe-center-tablet {
        align-items: safe center;
    }
        .flex--align-items-safe-center-tablet-I {
        align-items: safe center !important;
    }
        .flex--align-items-unsafe-center-tablet {
        align-items: unsafe center;
    }
        .flex--align-items-unsafe-center-tablet-I {
        align-items: unsafe center !important;
    }
        .flex--align-items-unset-tablet {
        align-items: initial;
    }
        .flex--align-items-unset-tablet-I {
        align-items: unset !important;
    }
        .flex--align-self-auto-tablet {
        align-self: auto;
    }
        .flex--align-self-auto-tablet-I {
        align-self: auto !important;
    }
        .flex--align-self-normal-tablet {
        align-self: normal;
    }
        .flex--align-self-normal-tablet-I {
        align-self: normal !important;
    }
        .flex--align-self-center-tablet {
        align-self: center;
    }
        .flex--align-self-center-tablet-I {
        align-self: center !important;
    }
        .flex--align-self-start-tablet {
        align-self: start;
    }
        .flex--align-self-start-tablet-I {
        align-self: start !important;
    }
        .flex--align-self-end-tablet {
        align-self: end;
    }
        .flex--align-self-end-tablet-I {
        align-self: end !important;
    }
        .flex--align-self-self-start-tablet {
        align-self: self-start;
    }
        .flex--align-self-self-start-tablet-I {
        align-self: self-start !important;
    }
        .flex--align-self-self-end-tablet {
        align-self: self-end;
    }
        .flex--align-self-self-end-tablet-I {
        align-self: self-end !important;
    }
        .flex--align-self-flex-start-tablet {
        align-self: flex-start;
    }
        .flex--align-self-flex-start-tablet-I {
        align-self: flex-start !important;
    }
        .flex--align-self-flex-end-tablet {
        align-self: flex-end;
    }
        .flex--align-self-flex-end-tablet-I {
        align-self: flex-end !important;
    }
        .flex--align-self-baseline-tablet {
        align-self: baseline;
    }
        .flex--align-self-baseline-tablet-I {
        align-self: baseline !important;
    }
        .flex--align-self-first-baseline-tablet {
        align-self: first baseline;
    }
        .flex--align-self-first-baseline-tablet-I {
        align-self: first baseline !important;
    }
        .flex--align-self-last-baseline-tablet {
        align-self: last baseline;
    }
        .flex--align-self-last-baseline-tablet-I {
        align-self: last baseline !important;
    }
        .flex--align-self-stretch-tablet {
        align-self: stretch;
    }
        .flex--align-self-stretch-tablet-I {
        align-self: stretch !important;
    }
        .flex--align-self-safe-center-tablet {
        align-self: safe center;
    }
        .flex--align-self-safe-center-tablet-I {
        align-self: safe center !important;
    }
        .flex--align-self-unsafe-center-tablet {
        align-self: unsafe center;
    }
        .flex--align-self-unsafe-center-tablet-I {
        align-self: unsafe center !important;
    }
}

@media only screen and (min-width: 1080px) {
    .flex--column-desktop {
        flex-direction: column;
    }

    .flex--reverse-desktop {
        flex-direction: row-reverse;
    }
        .flex--wrap-desktop {
        flex-wrap: wrap;
    }
        .flex--wrap-desktop {
        flex-wrap: wrap !important;
    }
        .flex--nowrap-desktop {
        flex-wrap: nowrap;
    }
        .flex--nowrap-desktop {
        flex-wrap: nowrap !important;
    }
        .flex--wrap-reverse-desktop {
        flex-wrap: wrap-reverse;
    }
        .flex--wrap-reverse-desktop {
        flex-wrap: wrap-reverse !important;
    }
        .flex--justify-center-desktop {
        justify-content: center;
    }
        .flex--justify-center-desktop-I {
        justify-content: center !important;
    }
        .flex--justify-start-desktop {
        justify-content: start;
    }
        .flex--justify-start-desktop-I {
        justify-content: start !important;
    }
        .flex--justify-end-desktop {
        justify-content: end;
    }
        .flex--justify-end-desktop-I {
        justify-content: end !important;
    }
        .flex--justify-flex-start-desktop {
        justify-content: flex-start;
    }
        .flex--justify-flex-start-desktop-I {
        justify-content: flex-start !important;
    }
        .flex--justify-flex-end-desktop {
        justify-content: flex-end;
    }
        .flex--justify-flex-end-desktop-I {
        justify-content: flex-end !important;
    }
        .flex--justify-left-desktop {
        justify-content: left;
    }
        .flex--justify-left-desktop-I {
        justify-content: left !important;
    }
        .flex--justify-right-desktop {
        justify-content: right;
    }
        .flex--justify-right-desktop-I {
        justify-content: right !important;
    }
        .flex--justify-normal-desktop {
        justify-content: normal;
    }
        .flex--justify-normal-desktop-I {
        justify-content: normal !important;
    }
        .flex--justify-space-between-desktop {
        justify-content: space-between;
    }
        .flex--justify-space-between-desktop-I {
        justify-content: space-between !important;
    }
        .flex--justify-space-around-desktop {
        justify-content: space-around;
    }
        .flex--justify-space-around-desktop-I {
        justify-content: space-around !important;
    }
        .flex--justify-space-evenly-desktop {
        justify-content: space-evenly;
    }
        .flex--justify-space-evenly-desktop-I {
        justify-content: space-evenly !important;
    }
        .flex--justify-stretch-desktop {
        justify-content: stretch;
    }
        .flex--justify-stretch-desktop-I {
        justify-content: stretch !important;
    }
        .flex--justify-safe-uncenter-desktop {
        justify-content: safe uncenter;
    }
        .flex--justify-safe-uncenter-desktop-I {
        justify-content: safe uncenter !important;
    }
        .flex--justify-unsafe-center-desktop {
        justify-content: unsafe center;
    }
        .flex--justify-unsafe-center-desktop-I {
        justify-content: unsafe center !important;
    }
        .flex--justify-inherit-desktop {
        justify-content: inherit;
    }
        .flex--justify-inherit-desktop-I {
        justify-content: inherit !important;
    }
        .flex--justify-revert-desktop {
        justify-content: revert;
    }
        .flex--justify-revert-desktop-I {
        justify-content: revert !important;
    }
        .flex--justify-revert-layer-desktop {
        justify-content: revert-layer;
    }
        .flex--justify-revert-layer-desktop-I {
        justify-content: revert-layer !important;
    }
        .flex--justify-unset-desktop {
        justify-content: initial;
    }
        .flex--justify-unset-desktop-I {
        justify-content: unset !important;
    }
        .flex--align-content-start-desktop {
        align-content: start;
    }
        .flex--align-content-start-desktop-I {
        align-content: start !important;
    }
        .flex--align-content-end-desktop {
        align-content: end;
    }
        .flex--align-content-end-desktop-I {
        align-content: end !important;
    }
        .flex--align-content-flex-start-desktop {
        align-content: flex-start;
    }
        .flex--align-content-flex-start-desktop-I {
        align-content: flex-start !important;
    }
        .flex--align-content-flex-end-desktop {
        align-content: flex-end;
    }
        .flex--align-content-flex-end-desktop-I {
        align-content: flex-end !important;
    }
        .flex--align-content-center-desktop {
        align-content: center;
    }
        .flex--align-content-center-desktop-I {
        align-content: center !important;
    }
        .flex--align-content-normal-desktop {
        align-content: normal;
    }
        .flex--align-content-normal-desktop-I {
        align-content: normal !important;
    }
        .flex--align-content-baseline-desktop {
        align-content: baseline;
    }
        .flex--align-content-baseline-desktop-I {
        align-content: baseline !important;
    }
        .flex--align-content-space-between-desktop {
        align-content: space-between;
    }
        .flex--align-content-space-between-desktop-I {
        align-content: space-between !important;
    }
        .flex--align-content-space-around-desktop {
        align-content: space-around;
    }
        .flex--align-content-space-around-desktop-I {
        align-content: space-around !important;
    }
        .flex--align-content-space-evenly-desktop {
        align-content: space-evenly;
    }
        .flex--align-content-space-evenly-desktop-I {
        align-content: space-evenly !important;
    }
        .flex--align-content-stretch-desktop {
        align-content: stretch;
    }
        .flex--align-content-stretch-desktop-I {
        align-content: stretch !important;
    }
        .flex--align-content-safe-desktop {
        align-content: safe;
    }
        .flex--align-content-safe-desktop-I {
        align-content: safe !important;
    }
        .flex--align-content-unsafe-desktop {
        align-content: unsafe;
    }
        .flex--align-content-unsafe-desktop-I {
        align-content: unsafe !important;
    }
        .flex--align-content-first-baseline-desktop {
        align-content: first baseline;
    }
        .flex--align-content-first-baseline-desktop-I {
        align-content: first baseline !important;
    }
        .flex--align-content-last-baseline-desktop {
        align-content: last baseline;
    }
        .flex--align-content-last-baseline-desktop-I {
        align-content: last baseline !important;
    }
        .flex--align-items-center-desktop {
        align-items: center;
    }
        .flex--align-items-center-desktop-I {
        align-items: center !important;
    }
        .flex--align-items-normal-desktop {
        align-items: normal;
    }
        .flex--align-items-normal-desktop-I {
        align-items: normal !important;
    }
        .flex--align-items-stretch-desktop {
        align-items: stretch;
    }
        .flex--align-items-stretch-desktop-I {
        align-items: stretch !important;
    }
        .flex--align-items-start-desktop {
        align-items: start;
    }
        .flex--align-items-start-desktop-I {
        align-items: start !important;
    }
        .flex--align-items-end-desktop {
        align-items: end;
    }
        .flex--align-items-end-desktop-I {
        align-items: end !important;
    }
        .flex--align-items-self-start-desktop {
        align-items: self-start;
    }
        .flex--align-items-self-start-desktop-I {
        align-items: self-start !important;
    }
        .flex--align-items-self-end-desktop {
        align-items: self-end;
    }
        .flex--align-items-self-end-desktop-I {
        align-items: self-end !important;
    }
        .flex--align-items-baseline-desktop {
        align-items: baseline;
    }
        .flex--align-items-baseline-desktop-I {
        align-items: baseline !important;
    }
        .flex--align-items-first-baseline-desktop {
        align-items: first baseline;
    }
        .flex--align-items-first-baseline-desktop-I {
        align-items: first baseline !important;
    }
        .flex--align-items-last-baseline-desktop {
        align-items: last baseline;
    }
        .flex--align-items-last-baseline-desktop-I {
        align-items: last baseline !important;
    }
        .flex--align-items-safe-center-desktop {
        align-items: safe center;
    }
        .flex--align-items-safe-center-desktop-I {
        align-items: safe center !important;
    }
        .flex--align-items-unsafe-center-desktop {
        align-items: unsafe center;
    }
        .flex--align-items-unsafe-center-desktop-I {
        align-items: unsafe center !important;
    }
        .flex--align-items-unset-desktop {
        align-items: initial;
    }
        .flex--align-items-unset-desktop-I {
        align-items: unset !important;
    }
        .flex--align-self-auto-desktop {
        align-self: auto;
    }
        .flex--align-self-auto-desktop-I {
        align-self: auto !important;
    }
        .flex--align-self-normal-desktop {
        align-self: normal;
    }
        .flex--align-self-normal-desktop-I {
        align-self: normal !important;
    }
        .flex--align-self-center-desktop {
        align-self: center;
    }
        .flex--align-self-center-desktop-I {
        align-self: center !important;
    }
        .flex--align-self-start-desktop {
        align-self: start;
    }
        .flex--align-self-start-desktop-I {
        align-self: start !important;
    }
        .flex--align-self-end-desktop {
        align-self: end;
    }
        .flex--align-self-end-desktop-I {
        align-self: end !important;
    }
        .flex--align-self-self-start-desktop {
        align-self: self-start;
    }
        .flex--align-self-self-start-desktop-I {
        align-self: self-start !important;
    }
        .flex--align-self-self-end-desktop {
        align-self: self-end;
    }
        .flex--align-self-self-end-desktop-I {
        align-self: self-end !important;
    }
        .flex--align-self-flex-start-desktop {
        align-self: flex-start;
    }
        .flex--align-self-flex-start-desktop-I {
        align-self: flex-start !important;
    }
        .flex--align-self-flex-end-desktop {
        align-self: flex-end;
    }
        .flex--align-self-flex-end-desktop-I {
        align-self: flex-end !important;
    }
        .flex--align-self-baseline-desktop {
        align-self: baseline;
    }
        .flex--align-self-baseline-desktop-I {
        align-self: baseline !important;
    }
        .flex--align-self-first-baseline-desktop {
        align-self: first baseline;
    }
        .flex--align-self-first-baseline-desktop-I {
        align-self: first baseline !important;
    }
        .flex--align-self-last-baseline-desktop {
        align-self: last baseline;
    }
        .flex--align-self-last-baseline-desktop-I {
        align-self: last baseline !important;
    }
        .flex--align-self-stretch-desktop {
        align-self: stretch;
    }
        .flex--align-self-stretch-desktop-I {
        align-self: stretch !important;
    }
        .flex--align-self-safe-center-desktop {
        align-self: safe center;
    }
        .flex--align-self-safe-center-desktop-I {
        align-self: safe center !important;
    }
        .flex--align-self-unsafe-center-desktop {
        align-self: unsafe center;
    }
        .flex--align-self-unsafe-center-desktop-I {
        align-self: unsafe center !important;
    }
}

.flex-grid {
    flex-wrap: wrap;
    display: flex;
    justify-content: flex-start;
}

.flex-grid > * {
    margin-right: 2%;
}

.flex-grid--1 > * {
    flex: 1 1 100%;
    margin-right: 0;
    width: 100%;
}

/**
 * The grid columns were calculated based on the following formula:
    column-gap is a percentage
    content-width = site-width - (site left padding + site right padding) 
    column-width = (content-width - (columns - 1))
    width = content-width - (content-width * column-gap * (column-count - 1)) / column-count / content-width * 100
 */

.flex-grid--2 > * {
    width: 49%;
    /* width: calc(((var(--content-width) - var(--column-gap)) / 2)); */
}

.flex-grid--2 > *:nth-child(even),
.flex-grid--2-mobile > *:nth-child(even),
.flex-grid--3 > *:nth-child(3n), 
.flex-grid--4 > *:nth-child(4n), 
.flex-grid--5 > *:nth-child(5n), 
.flex-grid--6 > *:nth-child(6n), 
.flex-grid--7 > *:nth-child(7n),
.flex-grid--8 > *:nth-child(8n),
.flex-grid--9 > *:nth-child(9n),
.flex-grid--10 > *:nth-child(10n),
.flex-grid--11 > *:nth-child(11n),
.flex-grid--12 > *:nth-child(12n) {
    margin-right: 0;
}

/**
 * No flex-grid mobile support for anything larger than 4 columns
 */

.flex-grid--3 > *,
.flex-grid--4 > *,
.flex-grid--5 > *,
.flex-grid--6 > *,
.flex-grid--7 > *,
.flex-grid--8 > *,
.flex-grid--9 > *,
.flex-grid--10 > *,
.flex-grid--11 > *,
.flex-grid--12 > * {
    width: 32%;
}

.flex-grid--2 > *:nth-child(even),
.flex-grid--3 > *:nth-child(3n), 
.flex-grid--4 > *:nth-child(3n), 
.flex-grid--5 > *:nth-child(3n), 
.flex-grid--6 > *:nth-child(3n), 
.flex-grid--7 > *:nth-child(3n),
.flex-grid--8 > *:nth-child(3n),
.flex-grid--9 > *:nth-child(3n),
.flex-grid--10 > *:nth-child(3n),
.flex-grid--11 > *:nth-child(3n),
.flex-grid--12 > *:nth-child(3n) {
    margin-right: 0;
}

.flex-grid--4 > *:nth-child(n+4),
.flex-grid--5 > *:nth-child(n+4),
.flex-grid--6 > *:nth-child(n+4),
.flex-grid--7 > *:nth-child(n+4),
.flex-grid--8 > *:nth-child(n+4),
.flex-grid--9 > *:nth-child(n+4),
.flex-grid--10 > *:nth-child(n+4),
.flex-grid--11 > *:nth-child(n+4),
.flex-grid--12 > *:nth-child(n+4) {
    margin-top: 2%;
}

@media only screen and (max-width: 543px) {
    .flex-grid--1-mobile > * {
        flex: 1 1 100%;
        margin-right: 0;
        width: 100%;
    }

    .flex-grid--2-mobile > * {
        width: 49%;
    }
}

@media only screen and (min-width: 544px) {
    .flex--column,
    .flex--column-tablet {
        flex-direction: column;
    }

    .flex--column > * {
        margin-right: 0;
    }

    .flex--reverse-mobile {
        flex-direction: row;
    }

    .flex--reverse-tablet {
        flex-direction: row-reverse;
    }

    .flex-grid > * {
        margin-top: 0;
    }
    
    .flex-grid--1-tablet > * {
        margin-right: 0;
        width: 100%;
    }

    .flex-grid--2-tablet > * {
        width: 49%;
    }

    .flex-grid--4 > *:nth-child(3n), 
    .flex-grid--5 > *:nth-child(3n), 
    .flex-grid--6 > *:nth-child(3n), 
    .flex-grid--7 > *:nth-child(3n),
    .flex-grid--8 > *:nth-child(3n),
    .flex-grid--9 > *:nth-child(3n),
    .flex-grid--10 > *:nth-child(3n),
    .flex-grid--11 > *:nth-child(3n),
    .flex-grid--12 > *:nth-child(3n),
    .flex-grid--4-tablet > *:nth-child(3n), 
    .flex-grid--5-tablet > *:nth-child(3n), 
    .flex-grid--6-tablet > *:nth-child(3n), 
    .flex-grid--7-tablet > *:nth-child(3n),
    .flex-grid--8-tablet > *:nth-child(3n),
    .flex-grid--9-tablet > *:nth-child(3n),
    .flex-grid--10-tablet > *:nth-child(3n),
    .flex-grid--11-tablet > *:nth-child(3n),
    .flex-grid--12-tablet > *:nth-child(3n) {
        margin-right: 2%;
    }

    .flex-grid--2 > *:nth-child(even),
    .flex-grid--3 > *:nth-child(3n), 
    .flex-grid--4 > *:nth-child(4n), 
    .flex-grid--5 > *:nth-child(5n), 
    .flex-grid--6 > *:nth-child(6n), 
    .flex-grid--7 > *:nth-child(7n),
    .flex-grid--8 > *:nth-child(8n),
    .flex-grid--9 > *:nth-child(9n),
    .flex-grid--10 > *:nth-child(10n),
    .flex-grid--11 > *:nth-child(11n),
    .flex-grid--12 > *:nth-child(12n),
    .flex-grid--2-tablet > *:nth-child(even),
    .flex-grid--3-tablet > *:nth-child(3n), 
    .flex-grid--4-tablet > *:nth-child(4n), 
    .flex-grid--5-tablet > *:nth-child(5n), 
    .flex-grid--6-tablet > *:nth-child(6n), 
    .flex-grid--7-tablet > *:nth-child(7n),
    .flex-grid--8-tablet > *:nth-child(8n),
    .flex-grid--9-tablet > *:nth-child(9n),
    .flex-grid--10-tablet > *:nth-child(10n),
    .flex-grid--11-tablet > *:nth-child(11n),
    .flex-grid--12-tablet > *:nth-child(12n) {
        margin-right: 0;
    }

    .flex-grid--4 > *:nth-child(n+4),
    .flex-grid--5 > *:nth-child(n+4),
    .flex-grid--6 > *:nth-child(n+4),
    .flex-grid--7 > *:nth-child(n+4),
    .flex-grid--8 > *:nth-child(n+4),
    .flex-grid--9 > *:nth-child(n+4),
    .flex-grid--10 > *:nth-child(n+4),
    .flex-grid--11 > *:nth-child(n+4),
    .flex-grid--12 > *:nth-child(n+4),
    .flex-grid--4-tablet > *:nth-child(n+4),
    .flex-grid--5-tablet > *:nth-child(n+4),
    .flex-grid--6-tablet > *:nth-child(n+4),
    .flex-grid--7-tablet > *:nth-child(n+4),
    .flex-grid--8-tablet > *:nth-child(n+4),
    .flex-grid--9-tablet > *:nth-child(n+4),
    .flex-grid--10-tablet > *:nth-child(n+4),
    .flex-grid--11-tablet > *:nth-child(n+4),
    .flex-grid--12-tablet > *:nth-child(n+4) {
        margin-top: 0;
    }

    .flex-grid--3-tablet > * {
        width: 32%;
    }
    
    .flex-grid--4 > *,
    .flex-grid--4-tablet > * {
        width: 23.5%;
    }

    .flex-grid--5 > *,
    .flex-grid--5-tablet > * {
        width: 18.4%;
    }

    .flex-grid--6 > *,
    .flex-grid--6-tablet > * {
        width: 15%;
    }

    .flex-grid--7 > *,
    .flex-grid--7-tablet > * {
        width: 12.5714%;
    }

    .flex-grid--8 > *,
    .flex-grid--8-tablet > * {
        width: 10.75%;
    }

    .flex-grid--9 > *,
    .flex-grid--9-tablet > * {
        width: 9.3333%;
    }

    .flex-grid--10 > *,
    .flex-grid--10-tablet > * {
        width: 8.2%
    }

    .flex-grid--11 > *,
    .flex-grid--11-tablet > * {
        width: 7.2727%;
    }

    .flex-grid--12 > *,
    .flex-grid--12-tablet > * {
        width: 6.5%;
    }
}

@media only screen and (min-width: 1080px) {
   
    .flex-grid--1-desktop > * {
        flex: 1 1 100%;
        margin-right: 0;
        width: 100%;
    }

    .flex-grid--2-desktop > * {
        width: 49%;
    }

    .flex-grid--4-desktop > *:nth-child(3n), 
    .flex-grid--5-desktop > *:nth-child(3n), 
    .flex-grid--6-desktop > *:nth-child(3n), 
    .flex-grid--7-desktop > *:nth-child(3n),
    .flex-grid--8-desktop > *:nth-child(3n),
    .flex-grid--9-desktop > *:nth-child(3n),
    .flex-grid--10-desktop > *:nth-child(3n),
    .flex-grid--11-desktop > *:nth-child(3n),
    .flex-grid--12-desktop > *:nth-child(3n) {
        margin-right: 2%;
    }

    .flex-grid--2-desktop > *:nth-child(even),
    .flex-grid--3-desktop > *:nth-child(3n), 
    .flex-grid--4-desktop > *:nth-child(4n), 
    .flex-grid--5-desktop > *:nth-child(5n), 
    .flex-grid--6-desktop > *:nth-child(6n), 
    .flex-grid--7-desktop > *:nth-child(7n),
    .flex-grid--8-desktop > *:nth-child(8n),
    .flex-grid--9-desktop > *:nth-child(9n),
    .flex-grid--10-desktop > *:nth-child(10n),
    .flex-grid--11-desktop > *:nth-child(11n),
    .flex-grid--12-desktop > *:nth-child(12n) {
        margin-right: 0;
    }

    .flex-grid--4-desktop > *:nth-child(n+4),
    .flex-grid--5-desktop > *:nth-child(n+4),
    .flex-grid--6-desktop > *:nth-child(n+4),
    .flex-grid--7-desktop > *:nth-child(n+4),
    .flex-grid--8-desktop > *:nth-child(n+4),
    .flex-grid--9-desktop > *:nth-child(n+4),
    .flex-grid--10-desktop > *:nth-child(n+4),
    .flex-grid--11-desktop > *:nth-child(n+4),
    .flex-grid--12-desktop > *:nth-child(n+4) {
        margin-top: 0;
    }

    .flex-grid--3-desktop > * {
        width: 32%;
    }
    
    .flex-grid--4-desktop > * {
        width: 23.5%;
    }

    .flex-grid--5-desktop > * {
        width: 18.4%;
    }

    .flex-grid--6-desktop > * {
        width: 15%;
    }

    .flex-grid--7-desktop > * {
        width: 12.5714%;
    }

    .flex-grid--8-desktop > * {
        width: 10.75%;
    }

    .flex-grid--9-desktop > * {
        width: 9.3333%;
    }

    .flex-grid--10-desktop > * {
        width: 8.2%
    }

    .flex-grid--11-desktop > * {
        width: 7.2727%;
    }

    .flex-grid--12-desktop > * {
        width: 6.5%;
    }
}

/*
 *  Do not edit directly
 *  Generated on 2020-06-17 14:35:52.098602
 */

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 700;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Bold_special.woff2) format("woff2");
    unicode-range: U+0259,U+0300-03C0,U+2070-2073,U+2075-20AB,U+20AD-2121,U+2123-218F,U+21BC-2211,U+2213-2214,U+2216-F8FE,U+FB01-FB02;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 700;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-BoldIt_special.woff2) format("woff2");
    unicode-range: U+0259,U+0300-03C0,U+2070-2073,U+2075-20AB,U+20AD-2121,U+2123-218F,U+21BC-2211,U+2213-2214,U+2216-F8FE,U+FB01-FB02;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 400;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-It_special.woff2) format("woff2");
    unicode-range: U+0259,U+0300-03C0,U+2070-2073,U+2075-20AB,U+20AD-2121,U+2123-218F,U+21BC-2211,U+2213-2214,U+2216-F8FE,U+FB01-FB02;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 300;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Light_special.woff2) format("woff2");
    unicode-range: U+0259,U+0300-03C0,U+2070-2073,U+2075-20AB,U+20AD-2121,U+2123-218F,U+21BC-2211,U+2213-2214,U+2216-F8FE,U+FB01-FB02;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 300;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-LightIt_special.woff2) format("woff2");
    unicode-range: U+0259,U+0300-03C0,U+2070-2073,U+2075-20AB,U+20AD-2121,U+2123-218F,U+21BC-2211,U+2213-2214,U+2216-F8FE,U+FB01-FB02;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 400;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Regular_special.woff2) format("woff2");
    unicode-range: U+0259,U+0300-03C0,U+2070-2073,U+2075-20AB,U+20AD-2121,U+2123-218F,U+21BC-2211,U+2213-2214,U+2216-F8FE,U+FB01-FB02;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 600;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Semibold_special.woff2) format("woff2");
    unicode-range: U+0259,U+0300-03C0,U+2070-2073,U+2075-20AB,U+20AD-2121,U+2123-218F,U+21BC-2211,U+2213-2214,U+2216-F8FE,U+FB01-FB02;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 600;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-SemiboldIt_special.woff2) format("woff2");
    unicode-range: U+0259,U+0300-03C0,U+2070-2073,U+2075-20AB,U+20AD-2121,U+2123-218F,U+21BC-2211,U+2213-2214,U+2216-F8FE,U+FB01-FB02;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 700;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Bold_latin_4.woff2) format("woff2");
    unicode-range: U+1E00-1EFF;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 700;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-BoldIt_latin_4.woff2) format("woff2");
    unicode-range: U+1E00-1EFF;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 400;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-It_latin_4.woff2) format("woff2");
    unicode-range: U+1E00-1EFF;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 300;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Light_latin_4.woff2) format("woff2");
    unicode-range: U+1E00-1EFF;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 300;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-LightIt_latin_4.woff2) format("woff2");
    unicode-range: U+1E00-1EFF;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 400;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Regular_latin_4.woff2) format("woff2");
    unicode-range: U+1E00-1EFF;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 600;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Semibold_latin_4.woff2) format("woff2");
    unicode-range: U+1E00-1EFF;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 600;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-SemiboldIt_latin_4.woff2) format("woff2");
    unicode-range: U+1E00-1EFF;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 700;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Bold_latin_3.woff2) format("woff2");
    unicode-range: U+0180-024F;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 700;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-BoldIt_latin_3.woff2) format("woff2");
    unicode-range: U+0180-024F;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 400;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-It_latin_3.woff2) format("woff2");
    unicode-range: U+0180-024F;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 300;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Light_latin_3.woff2) format("woff2");
    unicode-range: U+0180-024F;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 300;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-LightIt_latin_3.woff2) format("woff2");
    unicode-range: U+0180-024F;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 400;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Regular_latin_3.woff2) format("woff2");
    unicode-range: U+0180-024F;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 600;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Semibold_latin_3.woff2) format("woff2");
    unicode-range: U+0180-024F;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 600;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-SemiboldIt_latin_3.woff2) format("woff2");
    unicode-range: U+0180-024F;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 700;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Bold_latin_2.woff2) format("woff2");
    unicode-range: U+0100-0130,U+0132-0151,U+0154-017F;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 700;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-BoldIt_latin_2.woff2) format("woff2");
    unicode-range: U+0100-0130,U+0132-0151,U+0154-017F;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 400;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-It_latin_2.woff2) format("woff2");
    unicode-range: U+0100-0130,U+0132-0151,U+0154-017F;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 300;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Light_latin_2.woff2) format("woff2");
    unicode-range: U+0100-0130,U+0132-0151,U+0154-017F;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 300;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-LightIt_latin_2.woff2) format("woff2");
    unicode-range: U+0100-0130,U+0132-0151,U+0154-017F;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 400;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Regular_latin_2.woff2) format("woff2");
    unicode-range: U+0100-0130,U+0132-0151,U+0154-017F;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 600;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Semibold_latin_2.woff2) format("woff2");
    unicode-range: U+0100-0130,U+0132-0151,U+0154-017F;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 600;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-SemiboldIt_latin_2.woff2) format("woff2");
    unicode-range: U+0100-0130,U+0132-0151,U+0154-017F;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 700;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Bold_latin_1.woff2) format("woff2");
    unicode-range: U+00A1,U+00AA-00AB,U+00AF,U+00B8,U+00BB,U+00BF-00D6,U+00D8-00F6,U+00F8-00FF,U+0131,U+0152-0153,U+02B0-02FF;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 700;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-BoldIt_latin_1.woff2) format("woff2");
    unicode-range: U+00A1,U+00AA-00AB,U+00AF,U+00B8,U+00BB,U+00BF-00D6,U+00D8-00F6,U+00F8-00FF,U+0131,U+0152-0153,U+02B0-02FF;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 400;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-It_latin_1.woff2) format("woff2");
    unicode-range: U+00A1,U+00AA-00AB,U+00AF,U+00B8,U+00BB,U+00BF-00D6,U+00D8-00F6,U+00F8-00FF,U+0131,U+0152-0153,U+02B0-02FF;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 300;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Light_latin_1.woff2) format("woff2");
    unicode-range: U+00A1,U+00AA-00AB,U+00AF,U+00B8,U+00BB,U+00BF-00D6,U+00D8-00F6,U+00F8-00FF,U+0131,U+0152-0153,U+02B0-02FF;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 300;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-LightIt_latin_1.woff2) format("woff2");
    unicode-range: U+00A1,U+00AA-00AB,U+00AF,U+00B8,U+00BB,U+00BF-00D6,U+00D8-00F6,U+00F8-00FF,U+0131,U+0152-0153,U+02B0-02FF;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 400;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Regular_latin_1.woff2) format("woff2");
    unicode-range: U+00A1,U+00AA-00AB,U+00AF,U+00B8,U+00BB,U+00BF-00D6,U+00D8-00F6,U+00F8-00FF,U+0131,U+0152-0153,U+02B0-02FF;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 600;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Semibold_latin_1.woff2) format("woff2");
    unicode-range: U+00A1,U+00AA-00AB,U+00AF,U+00B8,U+00BB,U+00BF-00D6,U+00D8-00F6,U+00F8-00FF,U+0131,U+0152-0153,U+02B0-02FF;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 600;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-SemiboldIt_latin_1.woff2) format("woff2");
    unicode-range: U+00A1,U+00AA-00AB,U+00AF,U+00B8,U+00BB,U+00BF-00D6,U+00D8-00F6,U+00F8-00FF,U+0131,U+0152-0153,U+02B0-02FF;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 700;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Bold_english.woff2) format("woff2");
    unicode-range: U+0000-00A0,U+00A2-00A9,U+00AC-00AE,U+00B0-00B7,U+00B9-00BA,U+00BC-00BE,U+00D7,U+00F7,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-21BB,U+2212,U+2215,U+F8FF,U+FEFF,U+FFFD;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 700;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-BoldIt_english.woff2) format("woff2");
    unicode-range: U+0000-00A0,U+00A2-00A9,U+00AC-00AE,U+00B0-00B7,U+00B9-00BA,U+00BC-00BE,U+00D7,U+00F7,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-21BB,U+2212,U+2215,U+F8FF,U+FEFF,U+FFFD;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 400;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-It_english.woff2) format("woff2");
    unicode-range: U+0000-00A0,U+00A2-00A9,U+00AC-00AE,U+00B0-00B7,U+00B9-00BA,U+00BC-00BE,U+00D7,U+00F7,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-21BB,U+2212,U+2215,U+F8FF,U+FEFF,U+FFFD;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 300;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Light_english.woff2) format("woff2");
    unicode-range: U+0000-00A0,U+00A2-00A9,U+00AC-00AE,U+00B0-00B7,U+00B9-00BA,U+00BC-00BE,U+00D7,U+00F7,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-21BB,U+2212,U+2215,U+F8FF,U+FEFF,U+FFFD;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 300;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-LightIt_english.woff2) format("woff2");
    unicode-range: U+0000-00A0,U+00A2-00A9,U+00AC-00AE,U+00B0-00B7,U+00B9-00BA,U+00BC-00BE,U+00D7,U+00F7,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-21BB,U+2212,U+2215,U+F8FF,U+FEFF,U+FFFD;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 400;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Regular_english.woff2) format("woff2");
    unicode-range: U+0000-00A0,U+00A2-00A9,U+00AC-00AE,U+00B0-00B7,U+00B9-00BA,U+00BC-00BE,U+00D7,U+00F7,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-21BB,U+2212,U+2215,U+F8FF,U+FEFF,U+FFFD;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 600;
    font-style: normal;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-Semibold_english.woff2) format("woff2");
    unicode-range: U+0000-00A0,U+00A2-00A9,U+00AC-00AE,U+00B0-00B7,U+00B9-00BA,U+00BC-00BE,U+00D7,U+00F7,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-21BB,U+2212,U+2215,U+F8FF,U+FEFF,U+FFFD;
}

@font-face {
    font-family: 'source-sans-pro';
    font-display: swap;
    font-weight: 600;
    font-style: italic;
    src: url(/res/_css/organic/bin/assets/fonts/source-sans-pro/SourceSansPro-SemiboldIt_english.woff2) format("woff2");
    unicode-range: U+0000-00A0,U+00A2-00A9,U+00AC-00AE,U+00B0-00B7,U+00B9-00BA,U+00BC-00BE,U+00D7,U+00F7,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-21BB,U+2212,U+2215,U+F8FF,U+FEFF,U+FFFD;
}

.grid-row {
    display: flex;
    flex-wrap: wrap;
}

.grid-row--equal-height > *[class^="grid-col"] {
    flex-basis: 0;
    flex-grow: 1;
}

.grid-row > :last-child {
    margin-right: 0;
}

.grid-gutter {
    margin-left: calc(var(--grid-gutter) * -1);
    margin-right: calc(var(--grid-gutter) * -1);
}

.grid-gutter > [class*="grid-col"] {
        padding: 0 var(--grid-gutter);
    }

.grid-col {
    flex: 1 0 0%;
    width: 100%;
}

.grid-row-cols {
    display: flex;
    flex-wrap: wrap;
    gap: 1%;
    justify-content: space-between;
}

.grid-row-cols--auto {
    display: flex;
    flex-wrap: wrap;
    gap: 1%;
    justify-content: space-between;
}

.grid-row-cols--auto > * {
        flex: 1 0 0%;
    }

.grid-row-cols--1 {
        display: flex;
        flex-wrap: wrap;
        gap: 1%;
        justify-content: space-between;
    }

.grid-row-cols--1 > * {
            width: 100%;
        }

.grid-col--1 {
        flex: 0 0 auto;
        width: 25%;
    }

.grid-row-cols--2 {
        display: flex;
        flex-wrap: wrap;
        gap: 1%;
        justify-content: space-between;
    }

.grid-row-cols--2 > * {
            width: 49.5%;
        }

.grid-col--2 {
        flex: 0 0 auto;
        width: 50%;
    }

.grid-row-cols--3 {
        display: flex;
        flex-wrap: wrap;
        gap: 1%;
        justify-content: space-between;
    }

.grid-row-cols--3 > * {
            width: 32.666666666666664%;
        }

.grid-col--3 {
        flex: 0 0 auto;
        width: 75%;
    }

.grid-row-cols--4 {
        display: flex;
        flex-wrap: wrap;
        gap: 1%;
        justify-content: space-between;
    }

.grid-row-cols--4 > * {
            width: 24.25%;
        }

.grid-col--4 {
        flex: 0 0 auto;
        width: 100%;
    }

/**
 * No grid-row-cols--* mobile support for anything larger than 4 columns
 */

/* stylelint-disable no-descending-specificity */

.grid-row-cols--5 > *,
.grid-row-cols--6 > *,
.grid-row-cols--7 > *,
.grid-row-cols--8 > *,
.grid-row-cols--9 > *,
.grid-row-cols--10 > *,
.grid-row-cols--11 > *,
.grid-row-cols--12 > * {
    width: 24.25%;
}

/* stylelint-enable no-descending-specificity */

@media only screen and (max-width: 543px) {
        .grid-col--1-mobile {
            flex: 0 0 auto;
            width: 25%;
        }
        .grid-col--2-mobile {
            flex: 0 0 auto;
            width: 50%;
        }
        .grid-col--3-mobile {
            flex: 0 0 auto;
            width: 75%;
        }
        .grid-col--4-mobile {
            flex: 0 0 auto;
            width: 100%;
        }

    .grid-row-cols--1-mobile {
        display: flex;
        flex-direction: column;
    }

    .grid-row-cols--1-mobile > * {
        width: 100%;
    }

    .grid-row-cols--2-mobile {
        display: flex;
        flex-wrap: wrap;
        gap: 1%;
        justify-content: space-between;
    }

        .grid-row-cols--2-mobile > * {
            width: 49.5%;
        }

    .grid-row-cols--3-mobile {
        display: flex;
        flex-wrap: wrap;
        gap: 1%;
        justify-content: space-between;
    }

        .grid-row-cols--3-mobile > * {
            width: 32.666666666666664%;
        }

    .grid-row-cols--4-mobile {
        display: flex;
        flex-wrap: wrap;
        gap: 1%;
        justify-content: space-between;
    }

        .grid-row-cols--4-mobile > * {
            width: 24.25%;
        }
}

@media only screen and (min-width: 544px) {
        .grid-row-cols--1 {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--1 > * {
                width: 100%;
            }

        .grid-row-cols--1-tablet {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--1-tablet > * {
                width: 100%;
            }
        .grid-col--1,
        .grid-col--1-tablet {
            flex: 0 0 auto;
            width: 8.333333333333332%;
        }
        .grid-row-cols--2 {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--2 > * {
                width: 49.5%;
            }

        .grid-row-cols--2-tablet {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--2-tablet > * {
                width: 49.5%;
            }
        .grid-col--2,
        .grid-col--2-tablet {
            flex: 0 0 auto;
            width: 16.666666666666664%;
        }
        .grid-row-cols--3 {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--3 > * {
                width: 32.666666666666664%;
            }

        .grid-row-cols--3-tablet {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--3-tablet > * {
                width: 32.666666666666664%;
            }
        .grid-col--3,
        .grid-col--3-tablet {
            flex: 0 0 auto;
            width: 25%;
        }
        .grid-row-cols--4 {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--4 > * {
                width: 24.25%;
            }

        .grid-row-cols--4-tablet {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--4-tablet > * {
                width: 24.25%;
            }
        .grid-col--4,
        .grid-col--4-tablet {
            flex: 0 0 auto;
            width: 33.33333333333333%;
        }
        .grid-row-cols--5 {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--5 > * {
                width: 19.2%;
            }

        .grid-row-cols--5-tablet {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--5-tablet > * {
                width: 19.2%;
            }
        .grid-col--5,
        .grid-col--5-tablet {
            flex: 0 0 auto;
            width: 41.66666666666667%;
        }
        .grid-row-cols--6 {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--6 > * {
                width: 15.833333333333332%;
            }

        .grid-row-cols--6-tablet {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--6-tablet > * {
                width: 15.833333333333332%;
            }
        .grid-col--6,
        .grid-col--6-tablet {
            flex: 0 0 auto;
            width: 50%;
        }
        .grid-row-cols--7 {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--7 > * {
                width: 13.428571428571429%;
            }

        .grid-row-cols--7-tablet {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--7-tablet > * {
                width: 13.428571428571429%;
            }
        .grid-col--7,
        .grid-col--7-tablet {
            flex: 0 0 auto;
            width: 58.333333333333336%;
        }
        .grid-row-cols--8 {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--8 > * {
                width: 11.625%;
            }

        .grid-row-cols--8-tablet {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--8-tablet > * {
                width: 11.625%;
            }
        .grid-col--8,
        .grid-col--8-tablet {
            flex: 0 0 auto;
            width: 66.66666666666666%;
        }
        .grid-row-cols--9 {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--9 > * {
                width: 10.222222222222221%;
            }

        .grid-row-cols--9-tablet {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--9-tablet > * {
                width: 10.222222222222221%;
            }
        .grid-col--9,
        .grid-col--9-tablet {
            flex: 0 0 auto;
            width: 75%;
        }
        .grid-row-cols--10 {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--10 > * {
                width: 9.1%;
            }

        .grid-row-cols--10-tablet {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--10-tablet > * {
                width: 9.1%;
            }
        .grid-col--10,
        .grid-col--10-tablet {
            flex: 0 0 auto;
            width: 83.33333333333334%;
        }
        .grid-row-cols--11 {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--11 > * {
                width: 8.181818181818182%;
            }

        .grid-row-cols--11-tablet {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--11-tablet > * {
                width: 8.181818181818182%;
            }
        .grid-col--11,
        .grid-col--11-tablet {
            flex: 0 0 auto;
            width: 91.66666666666666%;
        }
        .grid-row-cols--12 {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--12 > * {
                width: 7.416666666666666%;
            }

        .grid-row-cols--12-tablet {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--12-tablet > * {
                width: 7.416666666666666%;
            }
        .grid-col--12,
        .grid-col--12-tablet {
            flex: 0 0 auto;
            width: 100%;
        }
}

@media only screen and (min-width: 1080px) {
    .grid-row-cols--1-desktop {
        display: flex;
        flex-wrap: wrap;
        gap: 1%;
        justify-content: space-between;
        /* stylelint-enable no-descending-specificity */
    }

        /* stylelint-disable no-descending-specificity */
        .grid-row-cols--1-desktop > * {
            flex: 1 1 100%;
        }
        .grid-row-cols--2-desktop {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--2-desktop > * {
                width: 49.5%;
            }
        .grid-col--2-desktop {
            flex: 0 0 auto;
            width: 16.666666666666664%;
        }
        .grid-row-cols--3-desktop {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--3-desktop > * {
                width: 32.666666666666664%;
            }
        .grid-col--3-desktop {
            flex: 0 0 auto;
            width: 25%;
        }
        .grid-row-cols--4-desktop {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--4-desktop > * {
                width: 24.25%;
            }
        .grid-col--4-desktop {
            flex: 0 0 auto;
            width: 33.33333333333333%;
        }
        .grid-row-cols--5-desktop {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--5-desktop > * {
                width: 19.2%;
            }
        .grid-col--5-desktop {
            flex: 0 0 auto;
            width: 41.66666666666667%;
        }
        .grid-row-cols--6-desktop {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--6-desktop > * {
                width: 15.833333333333332%;
            }
        .grid-col--6-desktop {
            flex: 0 0 auto;
            width: 50%;
        }
        .grid-row-cols--7-desktop {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--7-desktop > * {
                width: 13.428571428571429%;
            }
        .grid-col--7-desktop {
            flex: 0 0 auto;
            width: 58.333333333333336%;
        }
        .grid-row-cols--8-desktop {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--8-desktop > * {
                width: 11.625%;
            }
        .grid-col--8-desktop {
            flex: 0 0 auto;
            width: 66.66666666666666%;
        }
        .grid-row-cols--9-desktop {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--9-desktop > * {
                width: 10.222222222222221%;
            }
        .grid-col--9-desktop {
            flex: 0 0 auto;
            width: 75%;
        }
        .grid-row-cols--10-desktop {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--10-desktop > * {
                width: 9.1%;
            }
        .grid-col--10-desktop {
            flex: 0 0 auto;
            width: 83.33333333333334%;
        }
        .grid-row-cols--11-desktop {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--11-desktop > * {
                width: 8.181818181818182%;
            }
        .grid-col--11-desktop {
            flex: 0 0 auto;
            width: 91.66666666666666%;
        }
        .grid-row-cols--12-desktop {
            display: flex;
            flex-wrap: wrap;
            gap: 1%;
            justify-content: space-between;
        }

            .grid-row-cols--12-desktop > * {
                width: 7.416666666666666%;
            }
        .grid-col--12-desktop {
            flex: 0 0 auto;
            width: 100%;
        }
}

/**
 * Helpers
 *
 * A series of helper classes to use sparingly. Only use a helper class if an an element
 * or component doesn't already have a class to which you could apply this style.
 */

/**
 * Add/remove floats
 */

.float-right,
.float--right {
    float: right !important;
}

.float-left,
.float--left {
    float: left !important;
}

.float-none,
.float--none {
    float: none !important;
}

/**
 * Text Alignment
 */

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

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

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

.text-justify,
.text--justy {
    text-align: justify !important;
}

/**
 * Center block horizontally
 */

.center {
    margin-left: auto !important;
    margin-right: auto !important;
}

/**
 * Font Weights
 */

.weight-light,
.weight--light {
    font-weight: var(--font-weight-light);
}

.weight-light-I {
    font-weight: var(--font-weight-light) !important;
}

.weight-normal,
.weight--normal {
    font-weight: var(--font-weight-regular);
}

.weight-normal-I {
    font-weight: var(--font-weight-regular) !important;
}

.weight-semibold,
.weight--semibold {
    font-weight: 600;
}

.weight-semibold-I {
    font-weight: 600 !important;
}

.weight-bold,
.weight--bold {
    font-weight: var(--font-weight-bold);
}

.weight-bold-I {
    font-weight: var(--font-weight-bold) !important;
}

/**
 * Text Shading Helpers
 * These implies the text is already using black as a base color
 */

.txt-shade75 {
    color: rgba(0, 0, 0, 0.75);
}

.txt-shade50 {
    color: rgba(0, 0, 0, 0.5);
}

/**
 * Spacing helpers
 * Please use judiciously. You want to be using defaults most of the time,
 * these are exceptions!
 *
 * Guide:
 * p,m = padding,margin
 * a,t,r,b,l,h,v = all,top,right,bottom,left,horizontal,vertical
 * t,s,m,l,n = tiny(4px),small(8px),medium( 16px),large( 24px),none(0)
 * alternatively:
 * 0,1,2,3,4 = uses spacing-n definitions
 */

.ptn,
.pvn,
.pan {
    padding-top: 0 !important;
}

.pts,
.pvs,
.pas {
    padding-top: 8px !important;
}

.ptm,
.pvm,
.pam {
    padding-top: 16px !important;
}

.ptl,
.pvl,
.pal {
    padding-top: 24px !important;
}

.prn,
.phn,
.pan {
    padding-right: 0 !important;
}

.prs,
.phs,
.pas {
    padding-right: 8px !important;
}

.prm,
.phm,
.pam {
    padding-right: 16px !important;
}

.prl,
.phl,
.pal {
    padding-right: 24px !important;
}

.pbn,
.pvn,
.pan {
    padding-bottom: 0 !important;
}

.pbs,
.pvs,
.pas {
    padding-bottom: 8px !important;
}

.pbm,
.pvm,
.pam {
    padding-bottom: 16px !important;
}

.pbl,
.pvl,
.pal {
    padding-bottom: 24px !important;
}

.pln,
.phn,
.pan {
    padding-left: 0 !important;
}

.pls,
.phs,
.pas {
    padding-left: 8px !important;
}

.plm,
.phm,
.pam {
    padding-left: 16px !important;
}

.pll,
.phl,
.pal {
    padding-left: 24px !important;
}

.pt0,
.pv0,
.pa0 {
    padding-top: var(--spacing-0) !important;
}

.pt1,
.pv1,
.pa1 {
    padding-top: var(--spacing-1) !important;
}

.pt2,
.pv2,
.pa2 {
    padding-top: var(--spacing-2) !important;
}

.pt3,
.pv3,
.pa3 {
    padding-top: var(--spacing-3) !important;
}

.pt4,
.pv4,
.pa4 {
    padding-top: var(--spacing-4) !important;
}

.mtn,
.mvn,
.man {
    margin-top: 0 !important;
}

.mts,
.mvs,
.mas {
    margin-top: 8px !important;
}

.mtm,
.mvm,
.mam {
    margin-top: 16px !important;
}

.mtl,
.mvl,
.mal {
    margin-top: 24px !important;
}

.mrn,
.mhn,
.man {
    margin-right: 0 !important;
}

.mrs,
.mhs,
.mas {
    margin-right: 8px !important;
}

.mrm,
.mhm,
.mam {
    margin-right: 16px !important;
}

.mrl,
.mhl,
.mal {
    margin-right: 24px !important;
}

.mbn,
.mvn,
.man {
    margin-bottom: 0 !important;
}

.mbt,
.mvt,
.mat {
    margin-bottom: 4px !important;
}

.mbs,
.mvs,
.mas {
    margin-bottom: 8px !important;
}

.mbm,
.mvm,
.mam {
    margin-bottom: 16px !important;
}

.mbl,
.mvl,
.mal {
    margin-bottom: 24px !important;
}

.mln,
.mhn,
.man {
    margin-left: 0 !important;
}

.mls,
.mhs,
.mas {
    margin-left: 8px !important;
}

.mlm,
.mhm,
.mam {
    margin-left: 16px !important;
}

.mll,
.mhl,
.mal {
    margin-left: 24px !important;
}

.pt0,
    .pv0,
    .pa0 {
        padding-top: var(--spacing-0) !important;
    }

.pr0,
    .ph0,
    .pa0 {
        padding-right: var(--spacing-0) !important;
    }

.pb0,
    .pv0,
    .pa0 {
        padding-bottom: var(--spacing-0) !important;
    }

.pl0,
    .ph0,
    .pa0 {
        padding-left: var(--spacing-0) !important;
    }

.mt0,
    .mv0,
    .ma0 {
        margin-top: var(--spacing-0) !important;
    }

.mr0,
    .mh0,
    .ma0 {
        margin-right: var(--spacing-0) !important;
    }

.mb0,
    .mv0,
    .ma0 {
        margin-bottom: var(--spacing-0) !important;
    }

.ml0,
    .mh0,
    .ma0 {
        margin-left: var(--spacing-0) !important;
    }

.mt0-minus,
    .mv0-minus,
    .ma0-minus {
        margin-top: calc(var(--spacing-0) * -1) !important;
    }

.mr0-minus,
    .mh0-minus,
    .ma0-minus {
        margin-right: calc(var(--spacing-0) * -1) !important;
    }

.mb0-minus,
    .mv0-minus,
    .ma0-minus {
        margin-bottom: calc(var(--spacing-0) * -1) !important;
    }

.ml0-minus,
    .mh0-minus,
    .ma0-minus {
        margin-left: calc(var(--spacing-0) * -1) !important;
    }

.pt1,
    .pv1,
    .pa1 {
        padding-top: var(--spacing-1) !important;
    }

.pr1,
    .ph1,
    .pa1 {
        padding-right: var(--spacing-1) !important;
    }

.pb1,
    .pv1,
    .pa1 {
        padding-bottom: var(--spacing-1) !important;
    }

.pl1,
    .ph1,
    .pa1 {
        padding-left: var(--spacing-1) !important;
    }

.mt1,
    .mv1,
    .ma1 {
        margin-top: var(--spacing-1) !important;
    }

.mr1,
    .mh1,
    .ma1 {
        margin-right: var(--spacing-1) !important;
    }

.mb1,
    .mv1,
    .ma1 {
        margin-bottom: var(--spacing-1) !important;
    }

.ml1,
    .mh1,
    .ma1 {
        margin-left: var(--spacing-1) !important;
    }

.mt1-minus,
    .mv1-minus,
    .ma1-minus {
        margin-top: calc(var(--spacing-1) * -1) !important;
    }

.mr1-minus,
    .mh1-minus,
    .ma1-minus {
        margin-right: calc(var(--spacing-1) * -1) !important;
    }

.mb1-minus,
    .mv1-minus,
    .ma1-minus {
        margin-bottom: calc(var(--spacing-1) * -1) !important;
    }

.ml1-minus,
    .mh1-minus,
    .ma1-minus {
        margin-left: calc(var(--spacing-1) * -1) !important;
    }

.pt2,
    .pv2,
    .pa2 {
        padding-top: var(--spacing-2) !important;
    }

.pr2,
    .ph2,
    .pa2 {
        padding-right: var(--spacing-2) !important;
    }

.pb2,
    .pv2,
    .pa2 {
        padding-bottom: var(--spacing-2) !important;
    }

.pl2,
    .ph2,
    .pa2 {
        padding-left: var(--spacing-2) !important;
    }

.mt2,
    .mv2,
    .ma2 {
        margin-top: var(--spacing-2) !important;
    }

.mr2,
    .mh2,
    .ma2 {
        margin-right: var(--spacing-2) !important;
    }

.mb2,
    .mv2,
    .ma2 {
        margin-bottom: var(--spacing-2) !important;
    }

.ml2,
    .mh2,
    .ma2 {
        margin-left: var(--spacing-2) !important;
    }

.mt2-minus,
    .mv2-minus,
    .ma2-minus {
        margin-top: calc(var(--spacing-2) * -1) !important;
    }

.mr2-minus,
    .mh2-minus,
    .ma2-minus {
        margin-right: calc(var(--spacing-2) * -1) !important;
    }

.mb2-minus,
    .mv2-minus,
    .ma2-minus {
        margin-bottom: calc(var(--spacing-2) * -1) !important;
    }

.ml2-minus,
    .mh2-minus,
    .ma2-minus {
        margin-left: calc(var(--spacing-2) * -1) !important;
    }

.pt3,
    .pv3,
    .pa3 {
        padding-top: var(--spacing-3) !important;
    }

.pr3,
    .ph3,
    .pa3 {
        padding-right: var(--spacing-3) !important;
    }

.pb3,
    .pv3,
    .pa3 {
        padding-bottom: var(--spacing-3) !important;
    }

.pl3,
    .ph3,
    .pa3 {
        padding-left: var(--spacing-3) !important;
    }

.mt3,
    .mv3,
    .ma3 {
        margin-top: var(--spacing-3) !important;
    }

.mr3,
    .mh3,
    .ma3 {
        margin-right: var(--spacing-3) !important;
    }

.mb3,
    .mv3,
    .ma3 {
        margin-bottom: var(--spacing-3) !important;
    }

.ml3,
    .mh3,
    .ma3 {
        margin-left: var(--spacing-3) !important;
    }

.mt3-minus,
    .mv3-minus,
    .ma3-minus {
        margin-top: calc(var(--spacing-3) * -1) !important;
    }

.mr3-minus,
    .mh3-minus,
    .ma3-minus {
        margin-right: calc(var(--spacing-3) * -1) !important;
    }

.mb3-minus,
    .mv3-minus,
    .ma3-minus {
        margin-bottom: calc(var(--spacing-3) * -1) !important;
    }

.ml3-minus,
    .mh3-minus,
    .ma3-minus {
        margin-left: calc(var(--spacing-3) * -1) !important;
    }

.pt4,
    .pv4,
    .pa4 {
        padding-top: var(--spacing-4) !important;
    }

.pr4,
    .ph4,
    .pa4 {
        padding-right: var(--spacing-4) !important;
    }

.pb4,
    .pv4,
    .pa4 {
        padding-bottom: var(--spacing-4) !important;
    }

.pl4,
    .ph4,
    .pa4 {
        padding-left: var(--spacing-4) !important;
    }

.mt4,
    .mv4,
    .ma4 {
        margin-top: var(--spacing-4) !important;
    }

.mr4,
    .mh4,
    .ma4 {
        margin-right: var(--spacing-4) !important;
    }

.mb4,
    .mv4,
    .ma4 {
        margin-bottom: var(--spacing-4) !important;
    }

.ml4,
    .mh4,
    .ma4 {
        margin-left: var(--spacing-4) !important;
    }

.mt4-minus,
    .mv4-minus,
    .ma4-minus {
        margin-top: calc(var(--spacing-4) * -1) !important;
    }

.mr4-minus,
    .mh4-minus,
    .ma4-minus {
        margin-right: calc(var(--spacing-4) * -1) !important;
    }

.mb4-minus,
    .mv4-minus,
    .ma4-minus {
        margin-bottom: calc(var(--spacing-4) * -1) !important;
    }

.ml4-minus,
    .mh4-minus,
    .ma4-minus {
        margin-left: calc(var(--spacing-4) * -1) !important;
    }

.z-index-0 {
        z-index: 0;
    }

.z-index-1 {
        z-index: 1;
    }

.z-index-2 {
        z-index: 2;
    }

.z-index-3 {
        z-index: 3;
    }

.z-index-4 {
        z-index: 4;
    }

.z-index-5 {
        z-index: 5;
    }

.z-index-6 {
        z-index: 6;
    }

.z-index-7 {
        z-index: 7;
    }

.z-index-8 {
        z-index: 8;
    }

.z-index-9 {
        z-index: 9;
    }

.z-index-10 {
        z-index: 10;
    }

.break {
    margin-bottom: calc(var(--spacing-1) * 7);
}

/**
 * Pull items full width of `.island` parents.
 */

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

.full-bleed .islet {
    margin-right: -12px !important;
    margin-left: -12px !important;
}

/**
 * Add a help cursor to any element that gives the user extra information on
 * `:hover`.
 */

.informative {
    cursor: help !important;
}

.muted {
    opacity: 0.5 !important;
    filter: alpha(opacity = 50) !important;
}

/**
 * Add a pointer cursor to any element
 */

.pointer {
    cursor: pointer !important;
}

/**
 * Align items to the right where they imply progression/movement forward, e.g.:
 *
   <p class=proceed><a href=#>Read more...</a></p>
 *
 */

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

/**
 * Add a right-angled quote to links that imply movement, e.g.:
 *
   <a href=# class=go>Read more</a>
 *
 */

.go::after {
    content: "\00A0" "\00BB" !important;
}

/**
 * Apply capital case to an element.
 */

.caps {
    text-transform: uppercase !important;
}

/**
 * Title case
 */

.capitalize {
    text-transform: capitalize;
}

/**
 * Apply italics to an element
 */

.em,
.italic {
    font-style: italic;
}

/**
 * Apply strike line
 */

.strike {
    -webkit-text-decoration: line-through;
    text-decoration: line-through;
}

/**
 * Apply underline
 */

.underline {
    -webkit-text-decoration: underline;
    text-decoration: underline;
}

.normal {
  font-style: normal;
}

/**
 * Padding helpers
 * Very useful when using the grid styles
 */

.in16 {
    padding: 0 16px;
}

.in12 {
    padding: 0 12px;
}

.in8 {
    padding: 0 8px;
}

/**
 * Helper class that sets a visible overflow, relative position, and 0 z-index.
 * I find this helpful when I need a child element to be displayed outside of its parent element's boundaries.
 */

.vrz0 {
    overflow: visible;
    position: relative;
    z-index: 0;
}

.pos-relative {
    position: relative;
}

.pos-absolute {
    position: absolute;
}

.pos-fixed {
    position: fixed;
}

.pos-static {
    position: static;
}

.pos-sticky {
    position: sticky;
}

/**
 * Visibility Helpers
 */

.v-h,
.v--h {
    visibility: hidden !important;
}

.v-v,
.v--v {
    visibility: visible !important;
}

.v-c,
.v--c {
    visibility: collapse !important;
}

.unlink {
    -webkit-text-decoration: none;
    text-decoration: none;
}

.unlink--hover:hover {
    cursor: pointer;
    -webkit-text-decoration: underline;
    text-decoration: underline;
}

/**
 * .hide,
 * .js-hide
 * Hides content in an accessible by position the content off the screen.
 */

.hide,
.js-hide {
    left: -9999px;
    position: absolute;
    top: -9999px;
}

.js-remove {
    display: none !important;
}

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

figcaption,
.figcaption {
    font-size: 12px;
    text-align: center;
}

/*
 * Display helpers
 */

.block,
.display-block {
    display: block !important;
}

.inline,
.display-inline {
    display: inline !important;
}

.inline-block,
.display-inline-block {
    display: inline-block !important;
}

.none,
.display-none {
    display: none !important;
}

/**
 * Overflow helpers
 */

.overflow-h {
    overflow: hidden !important;
}

/**
 * .noscroll
 * Helper that prevents an element from scrolling
 */

.noscroll {
    overflow: hidden !important;
}

/**
 * .scroll-x
 */

.scroll-x {
    overflow-x: auto !important;
}

/**
 * .milli
 * Font size utility helper
 */

.milli {
    font-size: 10 !important;
}

.break-word {
    word-wrap: break-word !important;
}

/**
 * Background property helpers
 */

.background-cover {
    background-repeat: no-repeat !important;
    background-size: cover !important;
}

/**
 * Object-Fit property helpers
 */

.object-fit--cover {
    -o-object-fit: cover !important;
       object-fit: cover !important;
}

.object-fit--contain {
    -o-object-fit: contain !important;
       object-fit: contain !important;
}

.object-fit--fill {
    -o-object-fit: fill !important;
       object-fit: fill !important;
}

.object-fit--none {
    -o-object-fit: none !important;
       object-fit: none !important;
}

.object-fit--scale-down {
    -o-object-fit: scale-down !important;
       object-fit: scale-down !important;
}

/**
 * Height helpers
 */

.height-full {
    height: 100% !important;
}

.height-2x {
    height: calc(var(--spacing-base) * 2);
}

.height-3x {
    height: calc(var(--spacing-base) * 3);
}

.height-4x {
    height: calc(var(--spacing-base) * 4);
}

.height-5x {
    height: calc(var(--spacing-base) * 5);
}

.height-6x {
    height: calc(var(--spacing-base) * 6);
}

.height-7x {
    height: calc(var(--spacing-base) * 7);
}

.height-8x {
    height: calc(var(--spacing-base) * 8);
}

.height-9x {
    height: calc(var(--spacing-base) * 9);
}

.height-10x {
    height: calc(var(--spacing-base) * 10);
}

.height-11x {
    height: calc(var(--spacing-base) * 11);
}

.height-12x {
    height: calc(var(--spacing-base) * 12);
}

.height-13x {
    height: calc(var(--spacing-base) * 13);
}

.height-14x {
    height: calc(var(--spacing-base) * 14);
}

.height-15x {
    height: calc(var(--spacing-base) * 15);
}

.height-16x {
    height: calc(var(--spacing-base) * 16);
}

.height-17x {
    height: calc(var(--spacing-base) * 17);
}

.height-18x {
    height: calc(var(--spacing-base) * 18);
}

.height-19x {
    height: calc(var(--spacing-base) * 19);
}

.height-20x {
    height: calc(var(--spacing-base) * 20);
}

/**
 * Width Helpers
 */

.width-full {
    width: 100% !important;
}

.va-baseline {
    vertical-align: baseline !important;
}

.va-bottom {
    vertical-align: bottom !important;
}

.va-middle {
    vertical-align: middle !important;
}

.va-top {
    vertical-align: top !important;
}

.plunge {
    margin-bottom: calc(var(--spacing-4) * -1) !important;
}

/**
 * Responsive helpers
 */

@media only screen and (max-width: 543px) {
    .hide-mobile {
        left: -9999px !important;
        position: absolute !important;
        top: -9999px !important;
    }

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

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

    .display-inline-mobile {
        display: inline !important;
    }

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

    .display-flex-mobile {
        display: flex;
    }

    .object-fit--cover-mobile {
        -o-object-fit: cover !important;
           object-fit: cover !important;
    }

    .object-fit--contain-mobile {
        -o-object-fit: contain !important;
           object-fit: contain !important;
    }

    .object-fit--fill-mobile {
        -o-object-fit: fill !important;
           object-fit: fill !important;
    }

    .object-fit--none-mobile {
        -o-object-fit: none !important;
           object-fit: none !important;
    }

    .object-fit--scale-down-mobile {
        -o-object-fit: scale-down !important;
           object-fit: scale-down !important;
    }
        .text-center-mobile {
        text-align: center;
    }
        .text-center-mobile-I {
        text-align: center !important;
    }
        .text-left-mobile {
        text-align: left;
    }
        .text-left-mobile-I {
        text-align: left !important;
    }
        .text-right-mobile {
        text-align: right;
    }
        .text-right-mobile-I {
        text-align: right !important;
    }
        .text-justify-mobile {
        text-align: justify;
    }
        .text-justify-mobile-I {
        text-align: justify !important;
    }
        .pt0--mobile,
        .pv0--mobile,
        .pa0--mobile {
            padding-top: var(--spacing-0) !important;
        }

        .pr0--mobile,
        .ph0--mobile,
        .pa0--mobile {
            padding-right: var(--spacing-0) !important;
        }

        .pb0--mobile,
        .pv0--mobile,
        .pa0--mobile {
            padding-bottom: var(--spacing-0) !important;
        }

        .pl0--mobile,
        .ph0--mobile,
        .pa0--mobile {
            padding-left: var(--spacing-0) !important;
        }

        .mt0--mobile,
        .mv0--mobile,
        .ma0--mobile {
            margin-top: var(--spacing-0) !important;
        }

        .mr0--mobile,
        .mh0--mobile,
        .ma0--mobile {
            margin-right: var(--spacing-0) !important;
        }

        .mb0--mobile,
        .mv0--mobile,
        .ma0--mobile {
            margin-bottom: var(--spacing-0) !important;
        }

        .ml0--mobile,
        .mh0--mobile,
        .ma0--mobile {
            margin-left: var(--spacing-0) !important;
        }

        .mt0-minus--mobile,
        .mv0-minus--mobile,
        .ma0-minus--mobile {
            margin-top: calc(var(--spacing-0) * -1) !important;
        }

        .mr0-minus--mobile,
        .mh0-minus--mobile,
        .ma0-minus--mobile {
            margin-right: calc(var(--spacing-0) * -1) !important;
        }

        .mb0-minus--mobile,
        .mv0-minus--mobile,
        .ma0-minus--mobile {
            margin-bottom: calc(var(--spacing-0) * -1) !important;
        }

        .ml0-minus--mobile,
        .mh0-minus--mobile,
        .ma0-minus--mobile {
            margin-left: calc(var(--spacing-0) * -1) !important;
        }
        .pt1--mobile,
        .pv1--mobile,
        .pa1--mobile {
            padding-top: var(--spacing-1) !important;
        }

        .pr1--mobile,
        .ph1--mobile,
        .pa1--mobile {
            padding-right: var(--spacing-1) !important;
        }

        .pb1--mobile,
        .pv1--mobile,
        .pa1--mobile {
            padding-bottom: var(--spacing-1) !important;
        }

        .pl1--mobile,
        .ph1--mobile,
        .pa1--mobile {
            padding-left: var(--spacing-1) !important;
        }

        .mt1--mobile,
        .mv1--mobile,
        .ma1--mobile {
            margin-top: var(--spacing-1) !important;
        }

        .mr1--mobile,
        .mh1--mobile,
        .ma1--mobile {
            margin-right: var(--spacing-1) !important;
        }

        .mb1--mobile,
        .mv1--mobile,
        .ma1--mobile {
            margin-bottom: var(--spacing-1) !important;
        }

        .ml1--mobile,
        .mh1--mobile,
        .ma1--mobile {
            margin-left: var(--spacing-1) !important;
        }

        .mt1-minus--mobile,
        .mv1-minus--mobile,
        .ma1-minus--mobile {
            margin-top: calc(var(--spacing-1) * -1) !important;
        }

        .mr1-minus--mobile,
        .mh1-minus--mobile,
        .ma1-minus--mobile {
            margin-right: calc(var(--spacing-1) * -1) !important;
        }

        .mb1-minus--mobile,
        .mv1-minus--mobile,
        .ma1-minus--mobile {
            margin-bottom: calc(var(--spacing-1) * -1) !important;
        }

        .ml1-minus--mobile,
        .mh1-minus--mobile,
        .ma1-minus--mobile {
            margin-left: calc(var(--spacing-1) * -1) !important;
        }
        .pt2--mobile,
        .pv2--mobile,
        .pa2--mobile {
            padding-top: var(--spacing-2) !important;
        }

        .pr2--mobile,
        .ph2--mobile,
        .pa2--mobile {
            padding-right: var(--spacing-2) !important;
        }

        .pb2--mobile,
        .pv2--mobile,
        .pa2--mobile {
            padding-bottom: var(--spacing-2) !important;
        }

        .pl2--mobile,
        .ph2--mobile,
        .pa2--mobile {
            padding-left: var(--spacing-2) !important;
        }

        .mt2--mobile,
        .mv2--mobile,
        .ma2--mobile {
            margin-top: var(--spacing-2) !important;
        }

        .mr2--mobile,
        .mh2--mobile,
        .ma2--mobile {
            margin-right: var(--spacing-2) !important;
        }

        .mb2--mobile,
        .mv2--mobile,
        .ma2--mobile {
            margin-bottom: var(--spacing-2) !important;
        }

        .ml2--mobile,
        .mh2--mobile,
        .ma2--mobile {
            margin-left: var(--spacing-2) !important;
        }

        .mt2-minus--mobile,
        .mv2-minus--mobile,
        .ma2-minus--mobile {
            margin-top: calc(var(--spacing-2) * -1) !important;
        }

        .mr2-minus--mobile,
        .mh2-minus--mobile,
        .ma2-minus--mobile {
            margin-right: calc(var(--spacing-2) * -1) !important;
        }

        .mb2-minus--mobile,
        .mv2-minus--mobile,
        .ma2-minus--mobile {
            margin-bottom: calc(var(--spacing-2) * -1) !important;
        }

        .ml2-minus--mobile,
        .mh2-minus--mobile,
        .ma2-minus--mobile {
            margin-left: calc(var(--spacing-2) * -1) !important;
        }
        .pt3--mobile,
        .pv3--mobile,
        .pa3--mobile {
            padding-top: var(--spacing-3) !important;
        }

        .pr3--mobile,
        .ph3--mobile,
        .pa3--mobile {
            padding-right: var(--spacing-3) !important;
        }

        .pb3--mobile,
        .pv3--mobile,
        .pa3--mobile {
            padding-bottom: var(--spacing-3) !important;
        }

        .pl3--mobile,
        .ph3--mobile,
        .pa3--mobile {
            padding-left: var(--spacing-3) !important;
        }

        .mt3--mobile,
        .mv3--mobile,
        .ma3--mobile {
            margin-top: var(--spacing-3) !important;
        }

        .mr3--mobile,
        .mh3--mobile,
        .ma3--mobile {
            margin-right: var(--spacing-3) !important;
        }

        .mb3--mobile,
        .mv3--mobile,
        .ma3--mobile {
            margin-bottom: var(--spacing-3) !important;
        }

        .ml3--mobile,
        .mh3--mobile,
        .ma3--mobile {
            margin-left: var(--spacing-3) !important;
        }

        .mt3-minus--mobile,
        .mv3-minus--mobile,
        .ma3-minus--mobile {
            margin-top: calc(var(--spacing-3) * -1) !important;
        }

        .mr3-minus--mobile,
        .mh3-minus--mobile,
        .ma3-minus--mobile {
            margin-right: calc(var(--spacing-3) * -1) !important;
        }

        .mb3-minus--mobile,
        .mv3-minus--mobile,
        .ma3-minus--mobile {
            margin-bottom: calc(var(--spacing-3) * -1) !important;
        }

        .ml3-minus--mobile,
        .mh3-minus--mobile,
        .ma3-minus--mobile {
            margin-left: calc(var(--spacing-3) * -1) !important;
        }
        .pt4--mobile,
        .pv4--mobile,
        .pa4--mobile {
            padding-top: var(--spacing-4) !important;
        }

        .pr4--mobile,
        .ph4--mobile,
        .pa4--mobile {
            padding-right: var(--spacing-4) !important;
        }

        .pb4--mobile,
        .pv4--mobile,
        .pa4--mobile {
            padding-bottom: var(--spacing-4) !important;
        }

        .pl4--mobile,
        .ph4--mobile,
        .pa4--mobile {
            padding-left: var(--spacing-4) !important;
        }

        .mt4--mobile,
        .mv4--mobile,
        .ma4--mobile {
            margin-top: var(--spacing-4) !important;
        }

        .mr4--mobile,
        .mh4--mobile,
        .ma4--mobile {
            margin-right: var(--spacing-4) !important;
        }

        .mb4--mobile,
        .mv4--mobile,
        .ma4--mobile {
            margin-bottom: var(--spacing-4) !important;
        }

        .ml4--mobile,
        .mh4--mobile,
        .ma4--mobile {
            margin-left: var(--spacing-4) !important;
        }

        .mt4-minus--mobile,
        .mv4-minus--mobile,
        .ma4-minus--mobile {
            margin-top: calc(var(--spacing-4) * -1) !important;
        }

        .mr4-minus--mobile,
        .mh4-minus--mobile,
        .ma4-minus--mobile {
            margin-right: calc(var(--spacing-4) * -1) !important;
        }

        .mb4-minus--mobile,
        .mv4-minus--mobile,
        .ma4-minus--mobile {
            margin-bottom: calc(var(--spacing-4) * -1) !important;
        }

        .ml4-minus--mobile,
        .mh4-minus--mobile,
        .ma4-minus--mobile {
            margin-left: calc(var(--spacing-4) * -1) !important;
        }
}

@media only screen and (min-width: 544px) {
    /**
    * Center block horizontally for tablet and larger
    */
    .center-tablet {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .hide-tablet {
        left: -9999px !important;
        position: absolute !important;
        top: -9999px !important;
    }

    .display-none-tablet {
        display: none !important;
    }

    .display-block-tablet {
        display: block !important;
    }

    .display-flex-tablet {
        display: block !important;
    }

    .display-inline-tablet {
        display: inline !important;
    }

    .display-inline-block-tablet {
        display: inline-block !important;
    }

    .object-fit--cover-tablet {
        -o-object-fit: cover !important;
           object-fit: cover !important;
    }

    .object-fit--contain-tablet {
        -o-object-fit: contain !important;
           object-fit: contain !important;
    }

    .object-fit--fill-tablet {
        -o-object-fit: fill !important;
           object-fit: fill !important;
    }

    .object-fit--none-tablet {
        -o-object-fit: none !important;
           object-fit: none !important;
    }

    .object-fit--scale-down-tablet {
        -o-object-fit: scale-down !important;
           object-fit: scale-down !important;
    }
        .text-center-tablet {
        text-align: center !important;
    }
        .text-left-tablet {
        text-align: left !important;
    }
        .text-right-tablet {
        text-align: right !important;
    }
        .pt0--tablet,
        .pv0--tablet,
        .pa0--tablet {
            padding-top: var(--spacing-0) !important;
        }

        .pr0--tablet,
        .ph0--tablet,
        .pa0--tablet {
            padding-right: var(--spacing-0) !important;
        }

        .pb0--tablet,
        .pv0--tablet,
        .pa0--tablet {
            padding-bottom: var(--spacing-0) !important;
        }

        .pl0--tablet,
        .ph0--tablet,
        .pa0--tablet {
            padding-left: var(--spacing-0) !important;
        }

        .mt0--tablet,
        .mv0--tablet,
        .ma0--tablet {
            margin-top: var(--spacing-0) !important;
        }

        .mr0--tablet,
        .mh0--tablet,
        .ma0--tablet {
            margin-right: var(--spacing-0) !important;
        }

        .mb0--tablet,
        .mv0--tablet,
        .ma0--tablet {
            margin-bottom: var(--spacing-0) !important;
        }

        .ml0--tablet,
        .mh0--tablet,
        .ma0--tablet {
            margin-left: var(--spacing-0) !important;
        }

        .mt0-minus--tablet,
        .mv0-minus--tablet,
        .ma0-minus--tablet {
            margin-top: calc(var(--spacing-0) * -1) !important;
        }

        .mr0-minus--tablet,
        .mh0-minus--tablet,
        .ma0-minus--tablet {
            margin-right: calc(var(--spacing-0) * -1) !important;
        }

        .mb0-minus--tablet,
        .mv0-minus--tablet,
        .ma0-minus--tablet {
            margin-bottom: calc(var(--spacing-0) * -1) !important;
        }

        .ml0-minus--tablet,
        .mh0-minus--tablet,
        .ma0-minus--tablet {
            margin-left: calc(var(--spacing-0) * -1) !important;
        }
        .pt1--tablet,
        .pv1--tablet,
        .pa1--tablet {
            padding-top: var(--spacing-1) !important;
        }

        .pr1--tablet,
        .ph1--tablet,
        .pa1--tablet {
            padding-right: var(--spacing-1) !important;
        }

        .pb1--tablet,
        .pv1--tablet,
        .pa1--tablet {
            padding-bottom: var(--spacing-1) !important;
        }

        .pl1--tablet,
        .ph1--tablet,
        .pa1--tablet {
            padding-left: var(--spacing-1) !important;
        }

        .mt1--tablet,
        .mv1--tablet,
        .ma1--tablet {
            margin-top: var(--spacing-1) !important;
        }

        .mr1--tablet,
        .mh1--tablet,
        .ma1--tablet {
            margin-right: var(--spacing-1) !important;
        }

        .mb1--tablet,
        .mv1--tablet,
        .ma1--tablet {
            margin-bottom: var(--spacing-1) !important;
        }

        .ml1--tablet,
        .mh1--tablet,
        .ma1--tablet {
            margin-left: var(--spacing-1) !important;
        }

        .mt1-minus--tablet,
        .mv1-minus--tablet,
        .ma1-minus--tablet {
            margin-top: calc(var(--spacing-1) * -1) !important;
        }

        .mr1-minus--tablet,
        .mh1-minus--tablet,
        .ma1-minus--tablet {
            margin-right: calc(var(--spacing-1) * -1) !important;
        }

        .mb1-minus--tablet,
        .mv1-minus--tablet,
        .ma1-minus--tablet {
            margin-bottom: calc(var(--spacing-1) * -1) !important;
        }

        .ml1-minus--tablet,
        .mh1-minus--tablet,
        .ma1-minus--tablet {
            margin-left: calc(var(--spacing-1) * -1) !important;
        }
        .pt2--tablet,
        .pv2--tablet,
        .pa2--tablet {
            padding-top: var(--spacing-2) !important;
        }

        .pr2--tablet,
        .ph2--tablet,
        .pa2--tablet {
            padding-right: var(--spacing-2) !important;
        }

        .pb2--tablet,
        .pv2--tablet,
        .pa2--tablet {
            padding-bottom: var(--spacing-2) !important;
        }

        .pl2--tablet,
        .ph2--tablet,
        .pa2--tablet {
            padding-left: var(--spacing-2) !important;
        }

        .mt2--tablet,
        .mv2--tablet,
        .ma2--tablet {
            margin-top: var(--spacing-2) !important;
        }

        .mr2--tablet,
        .mh2--tablet,
        .ma2--tablet {
            margin-right: var(--spacing-2) !important;
        }

        .mb2--tablet,
        .mv2--tablet,
        .ma2--tablet {
            margin-bottom: var(--spacing-2) !important;
        }

        .ml2--tablet,
        .mh2--tablet,
        .ma2--tablet {
            margin-left: var(--spacing-2) !important;
        }

        .mt2-minus--tablet,
        .mv2-minus--tablet,
        .ma2-minus--tablet {
            margin-top: calc(var(--spacing-2) * -1) !important;
        }

        .mr2-minus--tablet,
        .mh2-minus--tablet,
        .ma2-minus--tablet {
            margin-right: calc(var(--spacing-2) * -1) !important;
        }

        .mb2-minus--tablet,
        .mv2-minus--tablet,
        .ma2-minus--tablet {
            margin-bottom: calc(var(--spacing-2) * -1) !important;
        }

        .ml2-minus--tablet,
        .mh2-minus--tablet,
        .ma2-minus--tablet {
            margin-left: calc(var(--spacing-2) * -1) !important;
        }
        .pt3--tablet,
        .pv3--tablet,
        .pa3--tablet {
            padding-top: var(--spacing-3) !important;
        }

        .pr3--tablet,
        .ph3--tablet,
        .pa3--tablet {
            padding-right: var(--spacing-3) !important;
        }

        .pb3--tablet,
        .pv3--tablet,
        .pa3--tablet {
            padding-bottom: var(--spacing-3) !important;
        }

        .pl3--tablet,
        .ph3--tablet,
        .pa3--tablet {
            padding-left: var(--spacing-3) !important;
        }

        .mt3--tablet,
        .mv3--tablet,
        .ma3--tablet {
            margin-top: var(--spacing-3) !important;
        }

        .mr3--tablet,
        .mh3--tablet,
        .ma3--tablet {
            margin-right: var(--spacing-3) !important;
        }

        .mb3--tablet,
        .mv3--tablet,
        .ma3--tablet {
            margin-bottom: var(--spacing-3) !important;
        }

        .ml3--tablet,
        .mh3--tablet,
        .ma3--tablet {
            margin-left: var(--spacing-3) !important;
        }

        .mt3-minus--tablet,
        .mv3-minus--tablet,
        .ma3-minus--tablet {
            margin-top: calc(var(--spacing-3) * -1) !important;
        }

        .mr3-minus--tablet,
        .mh3-minus--tablet,
        .ma3-minus--tablet {
            margin-right: calc(var(--spacing-3) * -1) !important;
        }

        .mb3-minus--tablet,
        .mv3-minus--tablet,
        .ma3-minus--tablet {
            margin-bottom: calc(var(--spacing-3) * -1) !important;
        }

        .ml3-minus--tablet,
        .mh3-minus--tablet,
        .ma3-minus--tablet {
            margin-left: calc(var(--spacing-3) * -1) !important;
        }
        .pt4--tablet,
        .pv4--tablet,
        .pa4--tablet {
            padding-top: var(--spacing-4) !important;
        }

        .pr4--tablet,
        .ph4--tablet,
        .pa4--tablet {
            padding-right: var(--spacing-4) !important;
        }

        .pb4--tablet,
        .pv4--tablet,
        .pa4--tablet {
            padding-bottom: var(--spacing-4) !important;
        }

        .pl4--tablet,
        .ph4--tablet,
        .pa4--tablet {
            padding-left: var(--spacing-4) !important;
        }

        .mt4--tablet,
        .mv4--tablet,
        .ma4--tablet {
            margin-top: var(--spacing-4) !important;
        }

        .mr4--tablet,
        .mh4--tablet,
        .ma4--tablet {
            margin-right: var(--spacing-4) !important;
        }

        .mb4--tablet,
        .mv4--tablet,
        .ma4--tablet {
            margin-bottom: var(--spacing-4) !important;
        }

        .ml4--tablet,
        .mh4--tablet,
        .ma4--tablet {
            margin-left: var(--spacing-4) !important;
        }

        .mt4-minus--tablet,
        .mv4-minus--tablet,
        .ma4-minus--tablet {
            margin-top: calc(var(--spacing-4) * -1) !important;
        }

        .mr4-minus--tablet,
        .mh4-minus--tablet,
        .ma4-minus--tablet {
            margin-right: calc(var(--spacing-4) * -1) !important;
        }

        .mb4-minus--tablet,
        .mv4-minus--tablet,
        .ma4-minus--tablet {
            margin-bottom: calc(var(--spacing-4) * -1) !important;
        }

        .ml4-minus--tablet,
        .mh4-minus--tablet,
        .ma4-minus--tablet {
            margin-left: calc(var(--spacing-4) * -1) !important;
        }
}

@media only screen and (min-width: 1080px) {
    .block-desktop {
        display: block !important;
    }

    .hide-desktop {
        left: -9999px !important;
        position: absolute !important;
    }

    .hide-desktop {
        top: -9999px;
    }

    .display-none-desktop {
        display: none !important;
    }

    .display-block-desktop {
        display: block !important;
    }

    .display-flex-desktop {
        display: flex !important;
    }

    .display-inline-desktop {
        display: inline !important;
    }

    .display-inline-block-desktop {
        display: inline-block !important;
    }

    .object-fit--cover-desktop {
        -o-object-fit: cover !important;
           object-fit: cover !important;
    }

    .object-fit--contain-desktop {
        -o-object-fit: contain !important;
           object-fit: contain !important;
    }

    .object-fit--fill-desktop {
        -o-object-fit: fill !important;
           object-fit: fill !important;
    }

    .object-fit--none-desktop {
        -o-object-fit: none !important;
           object-fit: none !important;
    }

    .object-fit--scale-down-desktop {
        -o-object-fit: scale-down !important;
           object-fit: scale-down !important;
    }
        .text-center-desktop {
        text-align: center !important;
    }
        .text-left-desktop {
        text-align: left !important;
    }
        .text-right-desktop {
        text-align: right !important;
    }
        .pt0--desktop,
        .pv0--desktop,
        .pa0--desktop {
            padding-top: var(--spacing-0) !important;
        }

        .pr0--desktop,
        .ph0--desktop,
        .pa0--desktop {
            padding-right: var(--spacing-0) !important;
        }

        .pb0--desktop,
        .pv0--desktop,
        .pa0--desktop {
            padding-bottom: var(--spacing-0) !important;
        }

        .pl0--desktop,
        .ph0--desktop,
        .pa0--desktop {
            padding-left: var(--spacing-0) !important;
        }

        .mt0--desktop,
        .mv0--desktop,
        .ma0--desktop {
            margin-top: var(--spacing-0) !important;
        }

        .mr0--desktop,
        .mh0--desktop,
        .ma0--desktop {
            margin-right: var(--spacing-0) !important;
        }

        .mb0--desktop,
        .mv0--desktop,
        .ma0--desktop {
            margin-bottom: var(--spacing-0) !important;
        }

        .ml0--desktop,
        .mh0--desktop,
        .ma0--desktop {
            margin-left: var(--spacing-0) !important;
        }

        .mt0-minus--desktop,
        .mv0-minus--desktop,
        .ma0-minus--desktop {
            margin-top: calc(var(--spacing-0) * -1) !important;
        }

        .mr0-minus--desktop,
        .mh0-minus--desktop,
        .ma0-minus--desktop {
            margin-right: calc(var(--spacing-0) * -1) !important;
        }

        .mb0-minus--desktop,
        .mv0-minus--desktop,
        .ma0-minus--desktop {
            margin-bottom: calc(var(--spacing-0) * -1) !important;
        }

        .ml0-minus--desktop,
        .mh0-minus--desktop,
        .ma0-minus--desktop {
            margin-left: calc(var(--spacing-0) * -1) !important;
        }
        .pt1--desktop,
        .pv1--desktop,
        .pa1--desktop {
            padding-top: var(--spacing-1) !important;
        }

        .pr1--desktop,
        .ph1--desktop,
        .pa1--desktop {
            padding-right: var(--spacing-1) !important;
        }

        .pb1--desktop,
        .pv1--desktop,
        .pa1--desktop {
            padding-bottom: var(--spacing-1) !important;
        }

        .pl1--desktop,
        .ph1--desktop,
        .pa1--desktop {
            padding-left: var(--spacing-1) !important;
        }

        .mt1--desktop,
        .mv1--desktop,
        .ma1--desktop {
            margin-top: var(--spacing-1) !important;
        }

        .mr1--desktop,
        .mh1--desktop,
        .ma1--desktop {
            margin-right: var(--spacing-1) !important;
        }

        .mb1--desktop,
        .mv1--desktop,
        .ma1--desktop {
            margin-bottom: var(--spacing-1) !important;
        }

        .ml1--desktop,
        .mh1--desktop,
        .ma1--desktop {
            margin-left: var(--spacing-1) !important;
        }

        .mt1-minus--desktop,
        .mv1-minus--desktop,
        .ma1-minus--desktop {
            margin-top: calc(var(--spacing-1) * -1) !important;
        }

        .mr1-minus--desktop,
        .mh1-minus--desktop,
        .ma1-minus--desktop {
            margin-right: calc(var(--spacing-1) * -1) !important;
        }

        .mb1-minus--desktop,
        .mv1-minus--desktop,
        .ma1-minus--desktop {
            margin-bottom: calc(var(--spacing-1) * -1) !important;
        }

        .ml1-minus--desktop,
        .mh1-minus--desktop,
        .ma1-minus--desktop {
            margin-left: calc(var(--spacing-1) * -1) !important;
        }
        .pt2--desktop,
        .pv2--desktop,
        .pa2--desktop {
            padding-top: var(--spacing-2) !important;
        }

        .pr2--desktop,
        .ph2--desktop,
        .pa2--desktop {
            padding-right: var(--spacing-2) !important;
        }

        .pb2--desktop,
        .pv2--desktop,
        .pa2--desktop {
            padding-bottom: var(--spacing-2) !important;
        }

        .pl2--desktop,
        .ph2--desktop,
        .pa2--desktop {
            padding-left: var(--spacing-2) !important;
        }

        .mt2--desktop,
        .mv2--desktop,
        .ma2--desktop {
            margin-top: var(--spacing-2) !important;
        }

        .mr2--desktop,
        .mh2--desktop,
        .ma2--desktop {
            margin-right: var(--spacing-2) !important;
        }

        .mb2--desktop,
        .mv2--desktop,
        .ma2--desktop {
            margin-bottom: var(--spacing-2) !important;
        }

        .ml2--desktop,
        .mh2--desktop,
        .ma2--desktop {
            margin-left: var(--spacing-2) !important;
        }

        .mt2-minus--desktop,
        .mv2-minus--desktop,
        .ma2-minus--desktop {
            margin-top: calc(var(--spacing-2) * -1) !important;
        }

        .mr2-minus--desktop,
        .mh2-minus--desktop,
        .ma2-minus--desktop {
            margin-right: calc(var(--spacing-2) * -1) !important;
        }

        .mb2-minus--desktop,
        .mv2-minus--desktop,
        .ma2-minus--desktop {
            margin-bottom: calc(var(--spacing-2) * -1) !important;
        }

        .ml2-minus--desktop,
        .mh2-minus--desktop,
        .ma2-minus--desktop {
            margin-left: calc(var(--spacing-2) * -1) !important;
        }
        .pt3--desktop,
        .pv3--desktop,
        .pa3--desktop {
            padding-top: var(--spacing-3) !important;
        }

        .pr3--desktop,
        .ph3--desktop,
        .pa3--desktop {
            padding-right: var(--spacing-3) !important;
        }

        .pb3--desktop,
        .pv3--desktop,
        .pa3--desktop {
            padding-bottom: var(--spacing-3) !important;
        }

        .pl3--desktop,
        .ph3--desktop,
        .pa3--desktop {
            padding-left: var(--spacing-3) !important;
        }

        .mt3--desktop,
        .mv3--desktop,
        .ma3--desktop {
            margin-top: var(--spacing-3) !important;
        }

        .mr3--desktop,
        .mh3--desktop,
        .ma3--desktop {
            margin-right: var(--spacing-3) !important;
        }

        .mb3--desktop,
        .mv3--desktop,
        .ma3--desktop {
            margin-bottom: var(--spacing-3) !important;
        }

        .ml3--desktop,
        .mh3--desktop,
        .ma3--desktop {
            margin-left: var(--spacing-3) !important;
        }

        .mt3-minus--desktop,
        .mv3-minus--desktop,
        .ma3-minus--desktop {
            margin-top: calc(var(--spacing-3) * -1) !important;
        }

        .mr3-minus--desktop,
        .mh3-minus--desktop,
        .ma3-minus--desktop {
            margin-right: calc(var(--spacing-3) * -1) !important;
        }

        .mb3-minus--desktop,
        .mv3-minus--desktop,
        .ma3-minus--desktop {
            margin-bottom: calc(var(--spacing-3) * -1) !important;
        }

        .ml3-minus--desktop,
        .mh3-minus--desktop,
        .ma3-minus--desktop {
            margin-left: calc(var(--spacing-3) * -1) !important;
        }
        .pt4--desktop,
        .pv4--desktop,
        .pa4--desktop {
            padding-top: var(--spacing-4) !important;
        }

        .pr4--desktop,
        .ph4--desktop,
        .pa4--desktop {
            padding-right: var(--spacing-4) !important;
        }

        .pb4--desktop,
        .pv4--desktop,
        .pa4--desktop {
            padding-bottom: var(--spacing-4) !important;
        }

        .pl4--desktop,
        .ph4--desktop,
        .pa4--desktop {
            padding-left: var(--spacing-4) !important;
        }

        .mt4--desktop,
        .mv4--desktop,
        .ma4--desktop {
            margin-top: var(--spacing-4) !important;
        }

        .mr4--desktop,
        .mh4--desktop,
        .ma4--desktop {
            margin-right: var(--spacing-4) !important;
        }

        .mb4--desktop,
        .mv4--desktop,
        .ma4--desktop {
            margin-bottom: var(--spacing-4) !important;
        }

        .ml4--desktop,
        .mh4--desktop,
        .ma4--desktop {
            margin-left: var(--spacing-4) !important;
        }

        .mt4-minus--desktop,
        .mv4-minus--desktop,
        .ma4-minus--desktop {
            margin-top: calc(var(--spacing-4) * -1) !important;
        }

        .mr4-minus--desktop,
        .mh4-minus--desktop,
        .ma4-minus--desktop {
            margin-right: calc(var(--spacing-4) * -1) !important;
        }

        .mb4-minus--desktop,
        .mv4-minus--desktop,
        .ma4-minus--desktop {
            margin-bottom: calc(var(--spacing-4) * -1) !important;
        }

        .ml4-minus--desktop,
        .mh4-minus--desktop,
        .ma4-minus--desktop {
            margin-left: calc(var(--spacing-4) * -1) !important;
        }
}

.ink-brand-primary {
        color: var(--ink-brand-primary);
    }

.ink-brand-secondary {
        color: var(--ink-brand-secondary);
    }

.ink-brand-tertiary {
        color: var(--ink-brand-tertiary);
    }

.ink-common-inv-01 {
        color: var(--ink-common-inv-01);
    }

.ink-common-inv-02 {
        color: var(--ink-common-inv-02);
    }

.ink-common-base-01 {
        color: var(--ink-common-base-01);
    }

.ink-common-base-02 {
        color: var(--ink-common-base-02);
    }

.ink-common-base-03 {
        color: var(--ink-common-base-03);
    }

.ink-common-base-04 {
        color: var(--ink-common-base-04);
    }

.ink-common-base-05 {
        color: var(--ink-common-base-05);
    }

.ink-status-positive-01 {
            color: var(--ink-status-positive-01);
        }

.ink-status-positive-02 {
            color: var(--ink-status-positive-02);
        }

.ink-status-positive-03 {
            color: var(--ink-status-positive-03);
        }

.ink-status-notice-01 {
            color: var(--ink-status-notice-01);
        }

.ink-status-notice-02 {
            color: var(--ink-status-notice-02);
        }

.ink-status-notice-03 {
            color: var(--ink-status-notice-03);
        }

.ink-status-negative-01 {
            color: var(--ink-status-negative-01);
        }

.ink-status-negative-02 {
            color: var(--ink-status-negative-02);
        }

.ink-status-negative-03 {
            color: var(--ink-status-negative-03);
        }

.ink-status-informative-01 {
            color: var(--ink-status-informative-01);
        }

.ink-status-informative-02 {
            color: var(--ink-status-informative-02);
        }

.ink-status-informative-03 {
            color: var(--ink-status-informative-03);
        }

.ink-common-light-01 {
    color: var(--ink-common-light-01);
}

.ink-common-dark-01 {
    color: var(--ink-common-dark-01);
}

.interface-common-base-01 {
    background-color: var(--interface-common-base-01);
  }

.interface-common-base-02 {
    background-color: var(--interface-common-base-02);
  }

.interface-common-base-03 {
    background-color: var(--interface-common-base-03);
  }

.interface-common-base-04 {
    background-color: var(--interface-common-base-04);
  }

.interface-common-base-05 {
    background-color: var(--interface-common-base-05);
  }

.interface-common-base-06 {
    background-color: var(--interface-common-base-06);
  }

.interface-common-base-07 {
    background-color: var(--interface-common-base-07);
  }

.interface-common-base-08 {
    background-color: var(--interface-common-base-08);
  }

.interface-brand-accent-01 {
    background-color: var(--interface-brand-accent-01);
  }

.interface-brand-accent-02 {
    background-color: var(--interface-brand-accent-02);
  }

.interface-brand-accent-03 {
    background-color: var(--interface-brand-accent-03);
  }

.interface-brand-accent-04 {
    background-color: var(--interface-brand-accent-04);
  }

.interface-brand-primary-01 {
    background-color: var(--interface-brand-primary-01);
  }

.interface-brand-primary-02 {
    background-color: var(--interface-brand-primary-02);
  }

.interface-brand-primary-03 {
    background-color: var(--interface-brand-primary-03);
  }

.interface-brand-primary-04 {
    background-color: var(--interface-brand-primary-04);
  }

.interface-brand-primary-05 {
    background-color: var(--interface-brand-primary-05);
  }

.interface-brand-primary-06 {
    background-color: var(--interface-brand-primary-06);
  }

.interface-brand-primary-07 {
    background-color: var(--interface-brand-primary-07);
  }

.interface-brand-secondary-01 {
    background-color: var(--interface-brand-secondary-01);
  }

.interface-brand-secondary-02 {
    background-color: var(--interface-brand-secondary-02);
  }

.interface-brand-secondary-03 {
    background-color: var(--interface-brand-secondary-03);
  }

.interface-brand-secondary-04 {
    background-color: var(--interface-brand-secondary-04);
  }

.interface-brand-secondary-05 {
    background-color: var(--interface-brand-secondary-05);
  }

.interface-brand-secondary-06 {
    background-color: var(--interface-brand-secondary-06);
  }

.interface-status-positive-01 {
      background-color: var(--interface-status-positive-01);
    }

.interface-status-positive-02 {
      background-color: var(--interface-status-positive-02);
    }

.interface-status-positive-03 {
      background-color: var(--interface-status-positive-03);
    }

.interface-status-positive-04 {
      background-color: var(--interface-status-positive-04);
    }

.interface-status-positive-05 {
      background-color: var(--interface-status-positive-05);
    }

.interface-status-positive-06 {
      background-color: var(--interface-status-positive-06);
    }

.interface-status-notice-01 {
      background-color: var(--interface-status-notice-01);
    }

.interface-status-notice-02 {
      background-color: var(--interface-status-notice-02);
    }

.interface-status-notice-03 {
      background-color: var(--interface-status-notice-03);
    }

.interface-status-notice-04 {
      background-color: var(--interface-status-notice-04);
    }

.interface-status-notice-05 {
      background-color: var(--interface-status-notice-05);
    }

.interface-status-notice-06 {
      background-color: var(--interface-status-notice-06);
    }

.interface-status-negative-01 {
      background-color: var(--interface-status-negative-01);
    }

.interface-status-negative-02 {
      background-color: var(--interface-status-negative-02);
    }

.interface-status-negative-03 {
      background-color: var(--interface-status-negative-03);
    }

.interface-status-negative-04 {
      background-color: var(--interface-status-negative-04);
    }

.interface-status-negative-05 {
      background-color: var(--interface-status-negative-05);
    }

.interface-status-negative-06 {
      background-color: var(--interface-status-negative-06);
    }

.interface-status-informative-01 {
      background-color: var(--interface-status-informative-01);
    }

.interface-status-informative-02 {
      background-color: var(--interface-status-informative-02);
    }

.interface-status-informative-03 {
      background-color: var(--interface-status-informative-03);
    }

.interface-status-informative-04 {
      background-color: var(--interface-status-informative-04);
    }

.interface-status-informative-05 {
      background-color: var(--interface-status-informative-05);
    }

.interface-status-informative-06 {
      background-color: var(--interface-status-informative-06);
    }

.site--section {
    margin: auto;
}

.section-wrapper {
    padding: 0 var(--spacing-1);
    width: var(--mq-desktop);
    margin: 0 auto;
}

.section-wrapper--large {
    width: 1500px;
}

.section-wrapper__ignore-padding {
    margin-left: calc(var(--spacing-1) * -1);
    margin-right: calc(var(--spacing-1) * -1);
}

.line {
    overflow: hidden;
}

.unit {
    float: left;
}

.unit--right {
    float: right;
}

.size1of1 {
    width: 100%;
}

.size1of2 {
    width: 50%;
}

.size1of2--gutter {
    width: 49%;
}

.size1of3 {
    width: 33.33333%;
}

.size1of3--gutter {
    width: 30.33333%;
}

.size2of3 {
    width: 66.66666%;
}

.size1of4 {
    width: 25%;
}

.size3of4 {
    width: 75%;
}

.size3of4--gutter {
    width: 75%;
    *width: 72%;
}

.size1of5 {
    width: 20%;
}

.size2of5 {
    width: 40%;
}

.size3of5 {
    width: 60%;
}

.size4of5 {
    width: 80%;
}

.size1of6 {
    width: 16.6666%;
}

.size5of6 {
    width: 83.3333%;
}

.size1080 {
    width: 1080px;
}

.size1080--max {
    max-width: 1080px;
    width: 100%;
}

/*
    This needs to be deprecated once we move to PostCSS
 */

.site--main > section:not(.tile) {
    padding: 48px 0;
}

.site--main > section.tile-grid {
    padding: 0;
}

@media only screen and (max-width: 543px) {
    .section-wrapper__ignore-padding--mobile {
        margin-left: calc(var(--spacing-1) * -1);
        margin-right: calc(var(--spacing-1) * -1);
    }
}

@media only screen and (min-width: 544px) {
    .section-wrapper__ignore-padding--tablet {
        margin-left: calc(var(--spacing-1) * -1);
        margin-right: calc(var(--spacing-1) * -1);
    }

    .size1of1-tablet {
        width: 100%;
    }

    .size1of2-tablet {
        width: 50%;
    }

    .size1of2-tablet--gutter {
        margin-right: 1%;
        width: 49%;
    }

    .size1of3-tablet {
        width: 33.33333%;
    }

    .size1of3-tablet--gutter {
        width: 30.33333%;
    }

    .size2of3-tablet--gutter {
        width: 63.3333%;
    }

    .size2of3-tablet {
        width: 66.66666%;
    }

    .size1of4-tablet {
        width: 25%;
    }

    .size3of4-tablet {
        width: 75%;
    }

    .size3of4-tablet--gutter {
        width: 75%;
        *width: 72%;
    }

    .size1of5-tablet {
        width: 20%;
    }

    .size2of5-tablet {
        width: 40%;
    }

    .size3of5-tablet {
        width: 60%;
    }

    .size4of5-tablet {
        width: 80%;
    }

    .size1of6-tablet {
        width: 16.6666%;
    }

    .size5of6-tablet {
        width: 83.3333%;
    }

    .size1080-tablet {
        width: 1080px;
    }

    .size1080-tablet--max {
        max-width: 1080px;
        width: 100%;
    }
}

@media only screen and (min-width: 960px) {

    .section-wrapper__ignore-padding--desktop {
        margin-left: calc(var(--spacing-1) * -1);
        margin-right: calc(var(--spacing-1) * -1);
    }

    .size1of1-desktop {
        width: 100%;
    }

    .size1of2-desktop {
        width: 50%;
    }

    .size1of2-desktop--gutter {
        width: 49%;
    }

    .size1of3-desktop {
        width: 33.33333%;
    }

    .size1of3-desktop--gutter {
        width: 30.33333%;
    }

    .size2of3-desktop {
        width: 66.66666%;
    }

    .size2of3-desktop--gutter {
        width: 64.3333%;
    }

    .size1of4-desktop {
        width: 25%;
    }

    .size3of4-desktop {
        width: 75%;
    }

    .size3of4-desktop--gutter {
        width: 75%;
    }

    .size1of5-desktop {
        width: 20%;
    }

    .size2of5-desktop {
        width: 40%;
    }

    .size3of5-desktop {
        width: 60%;
    }

    .size4of5-desktop {
        width: 80%;
    }

    .size1of6-desktop {
        width: 16.6666%;
    }

    .size5of6-desktop {
        width: 83.3333%;
    }

    .size1080-desktop {
        width: 1080px;
    }

    .size1080-desktop--max {
        max-width: 1080px;
        width: 100%;
    }
}

@media only screen and (max-width: 1500px) {
    .section-wrapper--large {
        width: 100%;
    }
}

@media only screen and (max-width: 1080px) {
    .section-wrapper {
        margin: auto;
        padding: 0 var(--spacing-1);
        width: 100%;
    }
}

html {
    font: 1rem/var(--spacing-base) var(--font-family-base);
    line-height: var(--spacing-base);
    min-height: 100%;
    overflow-y: auto;
}

.measure-44 {
    max-width: var(--size-measure-44);
}

.measure-60 {
    max-width: var(--size-measure-60);
}

.measure-64 {
    max-width: var(--size-measure-64);
}

.measure-68 {
    max-width: var(--size-measure-68);
}

.measure-72 {
    max-width: var(--size-measure-72);
}

.measure-80 {
    max-width: var(--size-measure-80);
}

.measure-88 {
    max-width: var(--size-measure-88);
}

.measure-none {
    max-width: var(--size-measure-none);
}

.order-0 {
        order: 0;
    }

.order-1 {
        order: 1;
    }

.order-2 {
        order: 2;
    }

.order-3 {
        order: 3;
    }

.order-4 {
        order: 4;
    }

.order-5 {
        order: 5;
    }

.order-6 {
        order: 6;
    }

.order-7 {
        order: 7;
    }

.order-8 {
        order: 8;
    }

.order-9 {
        order: 9;
    }

.order-10 {
        order: 10;
    }

.order-11 {
        order: 11;
    }

.order-12 {
        order: 12;
    }

@media only screen and (max-width: 543px) {
        .order-0--mobile {
            order: 0;
        }
        .order-1--mobile {
            order: 1;
        }
        .order-2--mobile {
            order: 2;
        }
        .order-3--mobile {
            order: 3;
        }
        .order-4--mobile {
            order: 4;
        }
        .order-5--mobile {
            order: 5;
        }
        .order-6--mobile {
            order: 6;
        }
        .order-7--mobile {
            order: 7;
        }
        .order-8--mobile {
            order: 8;
        }
        .order-9--mobile {
            order: 9;
        }
        .order-10--mobile {
            order: 10;
        }
        .order-11--mobile {
            order: 11;
        }
        .order-12--mobile {
            order: 12;
        }
}

@media only screen and (min-width: 544px) {
        .order-0--tablet {
            order: 0;
        }
        .order-1--tablet {
            order: 1;
        }
        .order-2--tablet {
            order: 2;
        }
        .order-3--tablet {
            order: 3;
        }
        .order-4--tablet {
            order: 4;
        }
        .order-5--tablet {
            order: 5;
        }
        .order-6--tablet {
            order: 6;
        }
        .order-7--tablet {
            order: 7;
        }
        .order-8--tablet {
            order: 8;
        }
        .order-9--tablet {
            order: 9;
        }
        .order-10--tablet {
            order: 10;
        }
        .order-11--tablet {
            order: 11;
        }
        .order-12--tablet {
            order: 12;
        }
}

@media only screen and (min-width: 1080px) {
        .order-0--desktop {
            order: 0;
        }
        .order-1--desktop {
            order: 1;
        }
        .order-2--desktop {
            order: 2;
        }
        .order-3--desktop {
            order: 3;
        }
        .order-4--desktop {
            order: 4;
        }
        .order-5--desktop {
            order: 5;
        }
        .order-6--desktop {
            order: 6;
        }
        .order-7--desktop {
            order: 7;
        }
        .order-8--desktop {
            order: 8;
        }
        .order-9--desktop {
            order: 9;
        }
        .order-10--desktop {
            order: 10;
        }
        .order-11--desktop {
            order: 11;
        }
        .order-12--desktop {
            order: 12;
        }
}

.rounded {
        border-radius: var(--rounded);
    }

.rounded-I {
        border-radius: var(--rounded) !important;
    }

.rounded-none {
        border-radius: var(--rounded-none);
    }

.rounded-none-I {
        border-radius: var(--rounded-none) !important;
    }

.rounded-sm {
        border-radius: var(--rounded-sm);
    }

.rounded-sm-I {
        border-radius: var(--rounded-sm) !important;
    }

.rounded-md {
        border-radius: var(--rounded-md);
    }

.rounded-md-I {
        border-radius: var(--rounded-md) !important;
    }

.rounded-lg {
        border-radius: var(--rounded-lg);
    }

.rounded-lg-I {
        border-radius: var(--rounded-lg) !important;
    }

.rounded-xl {
        border-radius: var(--rounded-xl);
    }

.rounded-xl-I {
        border-radius: var(--rounded-xl) !important;
    }

/**
 * Vertical Rhythm
 *  (http://csswizardry.com/2012/06/single-direction-margin-declarations/)
 * Here we are defining all our margins in one direction. This means
 * we will always use margin-bottom to push elements down the page,
 * and margin-left to push elements across the page.
 *
 * Benefits:
 *  - Easier to define vertical rhythm all at once and conveniently in once stylesheet
 *  - More confidence in moving and removing components if you know their margins all push
 *    in the same direction.
 *  - Don't have to worry about collapsing margins
 *  - Elements don't have to live in a certain order if their margins aren't dependent on
 *    adjoining sides.
 *
 * NOTE:
 *  The units are all based off of a base unit(1rem)
 */

h1,
h2,
h3,
h4,
h5,
h6,
hgroup,
ul,
ol,
dl,
blockquote,
p,
address,
table,
fieldset,
figure,
pre,
.media,
.island,
.islet {
    margin-bottom: var(--spacing-base);
}

/**
 *  calculcated by base unit - 1px
 */

hr {
    margin-bottom: calc(var(--spacing-base) - 0.0625rem);
}

/**
 * Here we are concerned with determining a consistent margin-left for lists.
 * =(2 * base unit)
 */

ul,
ol {
    margin-left: var(--spacing-3);
}

dt,
dd {
    margin-bottom: var(--spacing-1);
}

/**
 * Sprite
 *
 * .sprite will throw the element into sprite mode and apply a background image
 * .icon will throw an element into icon mode and will not add a background. .icon should
 * be used for icon fonts as populated through a data-icon attribute and the :after
 * pseudo-element
 *
 * Browser Support: Most modern browsers should work, however, for IE version > 7, support
 * is disabled by default.

 * Examples:
 *
 * Sprites:
    <a class="sprite sprite--diamond" href="#">Market Volume</a>
    or
    <a href="#"><i class="sprite sprite--diamond"></i> Market Volume</a>

 * Icons
    <a href="#"><i class="icon" data-icon="&#xF000;"></i> Market Volume</a>

 */

.sprite,
.icon,
.svg-icon {
    display: inline-block;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    position: relative;
    text-align: center;
    vertical-align: middle;
}

/*
  * HSBP image replacement technique
  * https://github.com/h5bp/html5-boilerplate/commit/adecc5da035d6d76b77e3fa95c6abde841073da2
  */

.sprite {
    /* The actual background image isn't defined yet */
    height: 16px;
    overflow: hidden;
    top: -1px;
    width: 16px;
}

.sprite::before {
    content: "";
    display: block;
    height: 100%;
    width: 0;
}

/**
  * Set up icon font
  */

.icon {
    font-family: 'icomoon', var(--font-family-headline);
    font-size: var(--font-size-16);
    font-style: normal;
    font-weight: normal;
    font-feature-settings: normal;
    font-variant: normal;
    height: 1rem;
    text-transform: none;
    width: 1rem;
}

.icon::before {
    content: attr(data-icon);
    -webkit-font-smoothing: antialiased;
}

/**
* Icon modifiers
*/

.icon--size-1 {
    font-size: var(--font-size-10);
}

.icon--size-2 {
    font-size: var(--font-size-12);
}

.icon--size-3 {
    font-size: var(--font-size-16);
}

.icon--size-4 {
    font-size: var(--font-size-18);
}

.icon--size-5 {
    font-size: var(--font-size-24);
}

.svg-icon {
    /* background-image: (var(--svn-icon)); */
}

.svg-icon--pdf {
    background: url(/res/_css/organic/bin/assets/icons/pdf.svg) no-repeat 0 0;
    height: 16px;
    width: 16px;
}

.svg-icon--download {
    background: url(/res/_css/organic/bin/assets/icons/download.svg) no-repeat 0 0;
    height: 16px;
    width: 16px;
}

.svg-icon--pagestack {
    background: url(/res/_css/organic/bin/assets/icons/pagestack.svg) no-repeat 0 0;
    height: 64px;
    width: 64px;
}

.svg-icon--monitor {
    background: url(/res/_css/organic/bin/assets/icons/monitor.svg) no-repeat 0 0;
    height: 64px;
    width: 64px;
}

.svg-icon--lock {
    background: url(/res/_css/organic/bin/assets/icons/lock.svg) no-repeat 0 0;
    height: 16px;
    width: 16px;
    filter: brightness(20%);
    background-position: 2px center;
    background-size: 10px;
}

/**
 * Font size utilities using the Organic font scale
 */

.text-xs {
    font-size: var(--font-size-10);
}

.text-s {
    font-size: var(--font-size-12);
}

.text-base {
    font-size: var(--font-size-16);
}

.text-l {
    font-size: var(--font-size-18);
}

.text-xl {
    font-size: var(--font-size-18);
}

.text-2xl {
    font-size: var(--font-size-24);
}

.text-3xl {
    font-size: var(--font-size-32);
}

.text-4xl {
    font-size: var(--font-size-44);
}

.text-primary {
    color: var(--color-base-primary) !important;
}

.text-white {
    color: var(--color-base-white) !important;
}

.text-size-8 {
        font-size: var(--font-size-8);
    }

.text-size-10 {
        font-size: var(--font-size-10);
    }

.text-size-12 {
        font-size: var(--font-size-12);
    }

.text-size-14 {
        font-size: var(--font-size-14);
    }

.text-size-16 {
        font-size: var(--font-size-16);
    }

.text-size-18 {
        font-size: var(--font-size-18);
    }

.text-size-20 {
        font-size: var(--font-size-20);
    }

.text-size-24 {
        font-size: var(--font-size-24);
    }

.text-size-26 {
        font-size: var(--font-size-26);
    }

.text-size-28 {
        font-size: var(--font-size-28);
    }

.text-size-32 {
        font-size: var(--font-size-32);
    }

.text-size-34 {
        font-size: var(--font-size-34);
    }

.text-size-40 {
        font-size: var(--font-size-40);
    }

.text-size-44 {
        font-size: var(--font-size-44);
    }

.text-size-48 {
        font-size: var(--font-size-48);
    }

.text-size-50 {
        font-size: var(--font-size-50);
    }

.text-size-58 {
        font-size: var(--font-size-58);
    }

.text-size-62 {
        font-size: var(--font-size-62);
    }

.text-size-70 {
        font-size: var(--font-size-70);
    }

.text-size-72 {
        font-size: var(--font-size-72);
    }

.text-size-78 {
        font-size: var(--font-size-78);
    }

.text-size-84 {
        font-size: var(--font-size-84);
    }

.text-size-98 {
        font-size: var(--font-size-98);
    }

.text-size-100 {
        font-size: var(--font-size-100);
    }

.text-size-122 {
        font-size: var(--font-size-122);
    }

.text-blue {
        color: var(--color-base-blue-5) !important;
    }

.text-blue-1 {
            color: var(--color-base-blue-1) !important;
        }

.text-blue-2 {
            color: var(--color-base-blue-2) !important;
        }

.text-blue-3 {
            color: var(--color-base-blue-3) !important;
        }

.text-blue-4 {
            color: var(--color-base-blue-4) !important;
        }

.text-blue-5 {
            color: var(--color-base-blue-5) !important;
        }

.text-blue-6 {
            color: var(--color-base-blue-6) !important;
        }

.text-blue-7 {
            color: var(--color-base-blue-7) !important;
        }

.text-blue-8 {
            color: var(--color-base-blue-8) !important;
        }

.text-blue-9 {
            color: var(--color-base-blue-9) !important;
        }

.text-cyan {
        color: var(--color-base-cyan-5) !important;
    }

.text-cyan-1 {
            color: var(--color-base-cyan-1) !important;
        }

.text-cyan-2 {
            color: var(--color-base-cyan-2) !important;
        }

.text-cyan-3 {
            color: var(--color-base-cyan-3) !important;
        }

.text-cyan-4 {
            color: var(--color-base-cyan-4) !important;
        }

.text-cyan-5 {
            color: var(--color-base-cyan-5) !important;
        }

.text-cyan-6 {
            color: var(--color-base-cyan-6) !important;
        }

.text-cyan-7 {
            color: var(--color-base-cyan-7) !important;
        }

.text-cyan-8 {
            color: var(--color-base-cyan-8) !important;
        }

.text-cyan-9 {
            color: var(--color-base-cyan-9) !important;
        }

.text-gray {
        color: var(--color-base-gray-5) !important;
    }

.text-gray-1 {
            color: var(--color-base-gray-1) !important;
        }

.text-gray-2 {
            color: var(--color-base-gray-2) !important;
        }

.text-gray-3 {
            color: var(--color-base-gray-3) !important;
        }

.text-gray-4 {
            color: var(--color-base-gray-4) !important;
        }

.text-gray-5 {
            color: var(--color-base-gray-5) !important;
        }

.text-gray-6 {
            color: var(--color-base-gray-6) !important;
        }

.text-gray-7 {
            color: var(--color-base-gray-7) !important;
        }

.text-gray-8 {
            color: var(--color-base-gray-8) !important;
        }

.text-gray-9 {
            color: var(--color-base-gray-9) !important;
        }

.text-darkgray {
        color: var(--color-base-darkgray-5) !important;
    }

.text-darkgray-1 {
            color: var(--color-base-darkgray-1) !important;
        }

.text-darkgray-2 {
            color: var(--color-base-darkgray-2) !important;
        }

.text-darkgray-3 {
            color: var(--color-base-darkgray-3) !important;
        }

.text-darkgray-4 {
            color: var(--color-base-darkgray-4) !important;
        }

.text-darkgray-5 {
            color: var(--color-base-darkgray-5) !important;
        }

.text-darkgray-6 {
            color: var(--color-base-darkgray-6) !important;
        }

.text-darkgray-7 {
            color: var(--color-base-darkgray-7) !important;
        }

.text-darkgray-8 {
            color: var(--color-base-darkgray-8) !important;
        }

.text-darkgray-9 {
            color: var(--color-base-darkgray-9) !important;
        }

.text-green {
        color: var(--color-base-green-5) !important;
    }

.text-green-1 {
            color: var(--color-base-green-1) !important;
        }

.text-green-2 {
            color: var(--color-base-green-2) !important;
        }

.text-green-3 {
            color: var(--color-base-green-3) !important;
        }

.text-green-4 {
            color: var(--color-base-green-4) !important;
        }

.text-green-5 {
            color: var(--color-base-green-5) !important;
        }

.text-green-6 {
            color: var(--color-base-green-6) !important;
        }

.text-green-7 {
            color: var(--color-base-green-7) !important;
        }

.text-green-8 {
            color: var(--color-base-green-8) !important;
        }

.text-green-9 {
            color: var(--color-base-green-9) !important;
        }

.text-red {
        color: var(--color-base-red-5) !important;
    }

.text-red-1 {
            color: var(--color-base-red-1) !important;
        }

.text-red-2 {
            color: var(--color-base-red-2) !important;
        }

.text-red-3 {
            color: var(--color-base-red-3) !important;
        }

.text-red-4 {
            color: var(--color-base-red-4) !important;
        }

.text-red-5 {
            color: var(--color-base-red-5) !important;
        }

.text-red-6 {
            color: var(--color-base-red-6) !important;
        }

.text-red-7 {
            color: var(--color-base-red-7) !important;
        }

.text-red-8 {
            color: var(--color-base-red-8) !important;
        }

.text-red-9 {
            color: var(--color-base-red-9) !important;
        }

.text-yellow {
        color: var(--color-base-yellow-5) !important;
    }

.text-yellow-1 {
            color: var(--color-base-yellow-1) !important;
        }

.text-yellow-2 {
            color: var(--color-base-yellow-2) !important;
        }

.text-yellow-3 {
            color: var(--color-base-yellow-3) !important;
        }

.text-yellow-4 {
            color: var(--color-base-yellow-4) !important;
        }

.text-yellow-5 {
            color: var(--color-base-yellow-5) !important;
        }

.text-yellow-6 {
            color: var(--color-base-yellow-6) !important;
        }

.text-yellow-7 {
            color: var(--color-base-yellow-7) !important;
        }

.text-yellow-8 {
            color: var(--color-base-yellow-8) !important;
        }

.text-yellow-9 {
            color: var(--color-base-yellow-9) !important;
        }

.text-e-blue {
        color: var(--color-base-e-blue-5) !important;
    }

.text-e-blue-1 {
            color: var(--color-base-e-blue-1) !important;
        }

.text-e-blue-2 {
            color: var(--color-base-e-blue-2) !important;
        }

.text-e-blue-3 {
            color: var(--color-base-e-blue-3) !important;
        }

.text-e-blue-4 {
            color: var(--color-base-e-blue-4) !important;
        }

.text-e-blue-5 {
            color: var(--color-base-e-blue-5) !important;
        }

.text-e-blue-6 {
            color: var(--color-base-e-blue-6) !important;
        }

.text-e-blue-7 {
            color: var(--color-base-e-blue-7) !important;
        }

.text-e-blue-8 {
            color: var(--color-base-e-blue-8) !important;
        }

.text-e-blue-9 {
            color: var(--color-base-e-blue-9) !important;
        }

.text-e-carrot {
        color: var(--color-base-e-carrot-5) !important;
    }

.text-e-carrot-1 {
            color: var(--color-base-e-carrot-1) !important;
        }

.text-e-carrot-2 {
            color: var(--color-base-e-carrot-2) !important;
        }

.text-e-carrot-3 {
            color: var(--color-base-e-carrot-3) !important;
        }

.text-e-carrot-4 {
            color: var(--color-base-e-carrot-4) !important;
        }

.text-e-carrot-5 {
            color: var(--color-base-e-carrot-5) !important;
        }

.text-e-carrot-6 {
            color: var(--color-base-e-carrot-6) !important;
        }

.text-e-carrot-7 {
            color: var(--color-base-e-carrot-7) !important;
        }

.text-e-carrot-8 {
            color: var(--color-base-e-carrot-8) !important;
        }

.text-e-carrot-9 {
            color: var(--color-base-e-carrot-9) !important;
        }

.text-e-cyan {
        color: var(--color-base-e-cyan-5) !important;
    }

.text-e-cyan-1 {
            color: var(--color-base-e-cyan-1) !important;
        }

.text-e-cyan-2 {
            color: var(--color-base-e-cyan-2) !important;
        }

.text-e-cyan-3 {
            color: var(--color-base-e-cyan-3) !important;
        }

.text-e-cyan-4 {
            color: var(--color-base-e-cyan-4) !important;
        }

.text-e-cyan-5 {
            color: var(--color-base-e-cyan-5) !important;
        }

.text-e-cyan-6 {
            color: var(--color-base-e-cyan-6) !important;
        }

.text-e-cyan-7 {
            color: var(--color-base-e-cyan-7) !important;
        }

.text-e-cyan-8 {
            color: var(--color-base-e-cyan-8) !important;
        }

.text-e-cyan-9 {
            color: var(--color-base-e-cyan-9) !important;
        }

.text-e-gray {
        color: var(--color-base-e-gray-5) !important;
    }

.text-e-gray-1 {
            color: var(--color-base-e-gray-1) !important;
        }

.text-e-gray-2 {
            color: var(--color-base-e-gray-2) !important;
        }

.text-e-gray-3 {
            color: var(--color-base-e-gray-3) !important;
        }

.text-e-gray-4 {
            color: var(--color-base-e-gray-4) !important;
        }

.text-e-gray-5 {
            color: var(--color-base-e-gray-5) !important;
        }

.text-e-gray-6 {
            color: var(--color-base-e-gray-6) !important;
        }

.text-e-gray-7 {
            color: var(--color-base-e-gray-7) !important;
        }

.text-e-gray-8 {
            color: var(--color-base-e-gray-8) !important;
        }

.text-e-gray-9 {
            color: var(--color-base-e-gray-9) !important;
        }

.text-e-darkgray {
        color: var(--color-base-e-darkgray-5) !important;
    }

.text-e-darkgray-1 {
            color: var(--color-base-e-darkgray-1) !important;
        }

.text-e-darkgray-2 {
            color: var(--color-base-e-darkgray-2) !important;
        }

.text-e-darkgray-3 {
            color: var(--color-base-e-darkgray-3) !important;
        }

.text-e-darkgray-4 {
            color: var(--color-base-e-darkgray-4) !important;
        }

.text-e-darkgray-5 {
            color: var(--color-base-e-darkgray-5) !important;
        }

.text-e-darkgray-6 {
            color: var(--color-base-e-darkgray-6) !important;
        }

.text-e-darkgray-7 {
            color: var(--color-base-e-darkgray-7) !important;
        }

.text-e-darkgray-8 {
            color: var(--color-base-e-darkgray-8) !important;
        }

.text-e-darkgray-9 {
            color: var(--color-base-e-darkgray-9) !important;
        }

.text-e-green {
        color: var(--color-base-e-green-5) !important;
    }

.text-e-green-1 {
            color: var(--color-base-e-green-1) !important;
        }

.text-e-green-2 {
            color: var(--color-base-e-green-2) !important;
        }

.text-e-green-3 {
            color: var(--color-base-e-green-3) !important;
        }

.text-e-green-4 {
            color: var(--color-base-e-green-4) !important;
        }

.text-e-green-5 {
            color: var(--color-base-e-green-5) !important;
        }

.text-e-green-6 {
            color: var(--color-base-e-green-6) !important;
        }

.text-e-green-7 {
            color: var(--color-base-e-green-7) !important;
        }

.text-e-green-8 {
            color: var(--color-base-e-green-8) !important;
        }

.text-e-green-9 {
            color: var(--color-base-e-green-9) !important;
        }

.text-e-lime {
        color: var(--color-base-e-lime-5) !important;
    }

.text-e-lime-1 {
            color: var(--color-base-e-lime-1) !important;
        }

.text-e-lime-2 {
            color: var(--color-base-e-lime-2) !important;
        }

.text-e-lime-3 {
            color: var(--color-base-e-lime-3) !important;
        }

.text-e-lime-4 {
            color: var(--color-base-e-lime-4) !important;
        }

.text-e-lime-5 {
            color: var(--color-base-e-lime-5) !important;
        }

.text-e-lime-6 {
            color: var(--color-base-e-lime-6) !important;
        }

.text-e-lime-7 {
            color: var(--color-base-e-lime-7) !important;
        }

.text-e-lime-8 {
            color: var(--color-base-e-lime-8) !important;
        }

.text-e-lime-9 {
            color: var(--color-base-e-lime-9) !important;
        }

.text-e-navy {
        color: var(--color-base-e-navy-5) !important;
    }

.text-e-navy-1 {
            color: var(--color-base-e-navy-1) !important;
        }

.text-e-navy-2 {
            color: var(--color-base-e-navy-2) !important;
        }

.text-e-navy-3 {
            color: var(--color-base-e-navy-3) !important;
        }

.text-e-navy-4 {
            color: var(--color-base-e-navy-4) !important;
        }

.text-e-navy-5 {
            color: var(--color-base-e-navy-5) !important;
        }

.text-e-navy-6 {
            color: var(--color-base-e-navy-6) !important;
        }

.text-e-navy-7 {
            color: var(--color-base-e-navy-7) !important;
        }

.text-e-navy-8 {
            color: var(--color-base-e-navy-8) !important;
        }

.text-e-navy-9 {
            color: var(--color-base-e-navy-9) !important;
        }

.text-e-purple {
        color: var(--color-base-e-purple-5) !important;
    }

.text-e-purple-1 {
            color: var(--color-base-e-purple-1) !important;
        }

.text-e-purple-2 {
            color: var(--color-base-e-purple-2) !important;
        }

.text-e-purple-3 {
            color: var(--color-base-e-purple-3) !important;
        }

.text-e-purple-4 {
            color: var(--color-base-e-purple-4) !important;
        }

.text-e-purple-5 {
            color: var(--color-base-e-purple-5) !important;
        }

.text-e-purple-6 {
            color: var(--color-base-e-purple-6) !important;
        }

.text-e-purple-7 {
            color: var(--color-base-e-purple-7) !important;
        }

.text-e-purple-8 {
            color: var(--color-base-e-purple-8) !important;
        }

.text-e-purple-9 {
            color: var(--color-base-e-purple-9) !important;
        }

.text-e-sea {
        color: var(--color-base-e-sea-5) !important;
    }

.text-e-sea-1 {
            color: var(--color-base-e-sea-1) !important;
        }

.text-e-sea-2 {
            color: var(--color-base-e-sea-2) !important;
        }

.text-e-sea-3 {
            color: var(--color-base-e-sea-3) !important;
        }

.text-e-sea-4 {
            color: var(--color-base-e-sea-4) !important;
        }

.text-e-sea-5 {
            color: var(--color-base-e-sea-5) !important;
        }

.text-e-sea-6 {
            color: var(--color-base-e-sea-6) !important;
        }

.text-e-sea-7 {
            color: var(--color-base-e-sea-7) !important;
        }

.text-e-sea-8 {
            color: var(--color-base-e-sea-8) !important;
        }

.text-e-sea-9 {
            color: var(--color-base-e-sea-9) !important;
        }

.text-e-violet {
        color: var(--color-base-e-violet-5) !important;
    }

.text-e-violet-1 {
            color: var(--color-base-e-violet-1) !important;
        }

.text-e-violet-2 {
            color: var(--color-base-e-violet-2) !important;
        }

.text-e-violet-3 {
            color: var(--color-base-e-violet-3) !important;
        }

.text-e-violet-4 {
            color: var(--color-base-e-violet-4) !important;
        }

.text-e-violet-5 {
            color: var(--color-base-e-violet-5) !important;
        }

.text-e-violet-6 {
            color: var(--color-base-e-violet-6) !important;
        }

.text-e-violet-7 {
            color: var(--color-base-e-violet-7) !important;
        }

.text-e-violet-8 {
            color: var(--color-base-e-violet-8) !important;
        }

.text-e-violet-9 {
            color: var(--color-base-e-violet-9) !important;
        }

.text-neutral-100 {
            color: var(--color-base-neutral-100) !important;
        }

.text-neutral-200 {
            color: var(--color-base-neutral-200) !important;
        }

.text-neutral-300 {
            color: var(--color-base-neutral-300) !important;
        }

.text-neutral-400 {
            color: var(--color-base-neutral-400) !important;
        }

.text-neutral-500 {
            color: var(--color-base-neutral-500) !important;
        }

.text-neutral-600 {
            color: var(--color-base-neutral-600) !important;
        }

.text-neutral-700 {
            color: var(--color-base-neutral-700) !important;
        }

.text-neutral-800 {
            color: var(--color-base-neutral-800) !important;
        }

.text-neutral-900 {
            color: var(--color-base-neutral-900) !important;
        }

.text-neutral-1000 {
            color: var(--color-base-neutral-1000) !important;
        }

.text-neutral-1100 {
            color: var(--color-base-neutral-1100) !important;
        }

.text-neutral-1200 {
            color: var(--color-base-neutral-1200) !important;
        }

.text-neutral-1300 {
            color: var(--color-base-neutral-1300) !important;
        }

.text-neutral-1400 {
            color: var(--color-base-neutral-1400) !important;
        }

.text-neutral-1500 {
            color: var(--color-base-neutral-1500) !important;
        }

.text-blue-100 {
            color: var(--color-base-blue-100) !important;
        }

.text-blue-200 {
            color: var(--color-base-blue-200) !important;
        }

.text-blue-300 {
            color: var(--color-base-blue-300) !important;
        }

.text-blue-400 {
            color: var(--color-base-blue-400) !important;
        }

.text-blue-500 {
            color: var(--color-base-blue-500) !important;
        }

.text-blue-600 {
            color: var(--color-base-blue-600) !important;
        }

.text-blue-700 {
            color: var(--color-base-blue-700) !important;
        }

.text-blue-800 {
            color: var(--color-base-blue-800) !important;
        }

.text-blue-900 {
            color: var(--color-base-blue-900) !important;
        }

.text-blue-1000 {
            color: var(--color-base-blue-1000) !important;
        }

.text-blue-1100 {
            color: var(--color-base-blue-1100) !important;
        }

.text-blue-1200 {
            color: var(--color-base-blue-1200) !important;
        }

.text-blue-1300 {
            color: var(--color-base-blue-1300) !important;
        }

.text-blue-1400 {
            color: var(--color-base-blue-1400) !important;
        }

.text-blue-1500 {
            color: var(--color-base-blue-1500) !important;
        }

.text-green-100 {
            color: var(--color-base-green-100) !important;
        }

.text-green-200 {
            color: var(--color-base-green-200) !important;
        }

.text-green-300 {
            color: var(--color-base-green-300) !important;
        }

.text-green-400 {
            color: var(--color-base-green-400) !important;
        }

.text-green-500 {
            color: var(--color-base-green-500) !important;
        }

.text-green-600 {
            color: var(--color-base-green-600) !important;
        }

.text-green-700 {
            color: var(--color-base-green-700) !important;
        }

.text-green-800 {
            color: var(--color-base-green-800) !important;
        }

.text-green-900 {
            color: var(--color-base-green-900) !important;
        }

.text-green-1000 {
            color: var(--color-base-green-1000) !important;
        }

.text-green-1100 {
            color: var(--color-base-green-1100) !important;
        }

.text-green-1200 {
            color: var(--color-base-green-1200) !important;
        }

.text-green-1300 {
            color: var(--color-base-green-1300) !important;
        }

.text-green-1400 {
            color: var(--color-base-green-1400) !important;
        }

.text-green-1500 {
            color: var(--color-base-green-1500) !important;
        }

.text-teal-100 {
            color: var(--color-base-teal-100) !important;
        }

.text-teal-200 {
            color: var(--color-base-teal-200) !important;
        }

.text-teal-300 {
            color: var(--color-base-teal-300) !important;
        }

.text-teal-400 {
            color: var(--color-base-teal-400) !important;
        }

.text-teal-500 {
            color: var(--color-base-teal-500) !important;
        }

.text-teal-600 {
            color: var(--color-base-teal-600) !important;
        }

.text-teal-700 {
            color: var(--color-base-teal-700) !important;
        }

.text-teal-800 {
            color: var(--color-base-teal-800) !important;
        }

.text-teal-900 {
            color: var(--color-base-teal-900) !important;
        }

.text-teal-1000 {
            color: var(--color-base-teal-1000) !important;
        }

.text-teal-1100 {
            color: var(--color-base-teal-1100) !important;
        }

.text-teal-1200 {
            color: var(--color-base-teal-1200) !important;
        }

.text-teal-1300 {
            color: var(--color-base-teal-1300) !important;
        }

.text-teal-1400 {
            color: var(--color-base-teal-1400) !important;
        }

.text-teal-1500 {
            color: var(--color-base-teal-1500) !important;
        }

.display-lg {
    font: var(--font-weight-900) italic var(--font-size-900)/var(--line-height-xs) var(--font-family-decorative);
}

.display-md {
    font: var(--font-weight-900) italic var(--font-size-800)/var(--line-height-xs) var(--font-family-decorative);
}

.display-sm {
    font: var(--font-weight-900) italic var(--font-size-700)/var(--line-height-xs) var(--font-family-decorative);
}

.heading-lg {
    font: var(--font-weight-600) var(--font-size-700)/var(--line-height-sm) var(--font-family-primary);
}

.heading-md {
    font: var(--font-weight-600) var(--font-size-600)/var(--line-height-sm) var(--font-family-primary);
}

.heading-sm {
    font: var(--font-weight-600) var(--font-size-400)/var(--line-height-sm) var(--font-family-primary);
}

.heading-xs {
    font: var(--font-weight-600) var(--font-size-300)/var(--line-height-sm) var(--font-family-primary);
}

.body-lg {
    font: var(--body-lg);
}

.body-md {
    font: var(--body-md);
}

.body-sm {
    font: var(--body-sm);
}

.detail-lg {
    font: var(--font-weight-600) var(--font-size-200)/var(--line-height-lg) var(--font-family-primary);
}

.detail-md {
    font: var(--font-weight-600) var(--font-size-100)/var(--line-height-lg) var(--font-family-primary);
}

.detail-sm {
    font: var(--font-weight-600) var(--font-size-050)/var(--line-height-lg) var(--font-family-primary);
}

.detail-xs {
    font: var(--font-weight-600) var(--font-size-025)/var(--line-height-lg) var(--font-family-primary);
}

.quote-lg {
    font: italic var(--font-weight-300) var(--font-size-700)/var(--line-height-md) var(--font-family-primary);
}

.data-md {
    font: var(--data-md);
}

.data-bold-md {
    font: var(--data-bold-md);
}

.refs-md {
    font: var(--refs-md);
}

.code-md {
    font: var(--code-md);
}

.label-lg {
        font: var(--label-lg);
    }

.label-sm {
        font: var(--label-sm);
    }

.action-sm {
    font: var(--font-weight-600) var(font-size-200)/var(--line-height-sm) var(font-family-primary);
}

/**
 * .banner-full
 *
 * Selector that displays an image across the entire width of the site
 * The naming convention closely follows the naming
 * convention set by the advertising industry.
 */

.banner-full {
    background-position: 50% 0;
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: 0;
}

/**
 * .banner-full--hero
 *
 * Extends .banner-full
 * This should appear once on a page and needs to display the image immediately after the
 * main navigation.
 * See breakpoints for use
 * Currently not used for mobile
 */

.banner-track {
    display: flex;
}

.banner-track > * {
    height: 108px;
}

/**
 * .banner-grid
 * Creates a 2 x 2 grid layout
 * The first column spans two rows to create space for one large image.
 * The second column has two rows for each row displays a smaller graphic
 */

.banner-grid {
    display: grid;
    grid-template-areas: "main";
    height: auto;
    margin: auto;
    margin-bottom: var(--spacing-base);
    width: 100%;
}

.banner-grid__main {
    grid-area: main;
}

.banner-grid__main > img {
    height: auto;
    width: 100%;
}

.banner-grid__secondary {
    display: none;
    grid-area: secondary;
    width: 366px;
}

.banner-grid__tertiary {
    display: none;
    grid-area: tertiary;
    width: 366px;
}

.banner-grid--bg .banner-grid__main {
    background-position: 50% 0;
    background-size: cover;
    padding-top: 46%;
}

/**
 * .banner-promo
 * Shows 3 small banners below a full banner
 */

.banner-promo {
    display: flex;
    justify-content: space-between;
    margin-bottom: var(--spacing-2);
}

.banner-promo > * {
    width: 32%;
}

/**
 * .banner-overlay
 *
 * Styles for banners with text overlays, controlled by the MarComms tool
 */

.banner-overlay {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.banner-overlay img {
    width: 100%;
}

.banner-overlay__text {
    max-width: 880px;
    margin: var(--spacing-4) var(--spacing-2);
}

.banner-overlay__text--light {
        color: var(--color-text-dark-default) !important;
    }

.banner-overlay__text--light {
        /** !important mostly needed for <a> text color */
    }

.banner-overlay__text--dark {
        color: var(--color-text-default) !important;
    }

.banner-overlay__text--dark {
        /** !important mostly needed for <a> text color */
    }

.banner-overlay__text h1 {
    text-align: left;
    margin: 0;
    margin-bottom: var(--spacing-1);
    font-size: var(--font-size-7);
}

.banner-overlay__text p {
    margin-bottom: var(--spacing-1);
    font-size: var(--font-size-3);
    line-height: var(--spacing-base);
}

.banner-overlay__text a {
    color: var(--color-text-primary-default);
    -webkit-text-decoration: underline;
    text-decoration: underline;
    font-size: var(--font-size-3);
}

@media only screen and (max-width: 650px) {
    .banner-promo {
        display: none;
    }
}

@media only screen and (min-width: 800px) {
    .banner-full {
        display: block;
        height: 180px;
    }
}

@media only screen and (min-width: 820px) {
    .banner-grid {
        height: 329px;
        grid-template-areas:
            "main secondary "
            "main tertiary";
        max-width: var(--mq-desktop);
        overflow: hidden;
    }

    .banner-grid > * {
        display: block;
    }

    .banner-grid__main {
        width: 714px;
    }

    .banner-grid--bg .banner-grid__main {
        padding-top: 0;
    }
}

/**
 * These images are expected to be 1080px by 250px
 */

@media only screen and (max-width: 1080px) {
    .banner-full {
        display: block;
        height: calc((100vw / 1080) * 250);
        height: calc(calc(100vw / 1080) * 250);
    }
}

@media only screen and (min-width: 1080px) {
    .banner-full {
        display: block;
        height: 250px;
    }

    .banner-overlay__text {
        margin: var(--spacing-4) 0;
    }
}

@media only screen and (min-width: 1280px) {
    .banner-full {
        height: auto;
        padding-top: 15.4%;
    }
}

.box {
    border: 1px solid var(--color-base-gray-2);
    display: flex;
    flex-direction: column;
    margin-bottom: var(--spacing-base);
}

.box > * {
    padding: var(--spacing-1);
}

/**
 * This prevents the image from stretching
 * the full width of the box
 */

.box > img {
    align-self: flex-start;
}

.box__hd {
    margin-bottom: 0;
}

.box.box__bd > * {
    padding: 0;
}

.box__bd {
    flex-grow: 1 1 auto;
}

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

/**
 * .box--pad
 * Removes default padding for flexed items and applies the padding
 * to the parent
 */

.box--pad {
    padding: var(--spacing-1);
}

/* stylelint-disable no-descending-specificity */

.box--pad > * {
    padding: 0;
}

/**
 * .box--no-pad
 * Removes default padding for flexed items
 */

.box--no-pad > * {
    padding: 0;
}

/* stylelint-enable no-descending-specificity */

/**
 * Box Modifiers
 */

/**
 * .box--header-fill
 * This applies a gray background color to the header
 */

.box--header-fill .box__hd {
    background-color: var(--color-base-gray-2);
}

/**
 * .box--elevate-(n)
 * Adds a shadow around the box
 * n = the size of the shadow, larger the number, large the shadow
 */

/* offset-x | offset-y | blur-radius | spread-radius | color */

.box--elevate-1 {
    border-radius: 4px;
    box-shadow: var(--shadow-level-1);
}

.box--elevate-2 {
    border-radius: 4px;
    box-shadow: var(--shadow-level-2);
}

.box--elevate-3 {
    border-radius: 4px;
    box-shadow: var(--shadow-level-3);
}

.box--elevate-4 {
    border-radius: 4px;
    box-shadow: var(--shadow-level-4);
}

.box--elevate-5 {
    border-radius: 4px;
    box-shadow: var(--shadow-level-5);
}

.box--site-notification {
    background-color: var(--color-base-yellow-2);
    border-color: transparent;
    margin: 0 auto;
    position: fixed;
    text-align: center;
    z-index: 1000;
}

.box--negative {
    border-color: var(--color-base-red-5);
    color: var(--color-base-red-9);
}

.box--positive {
    border-color: var(--color-base-secondary);
    color: var(--color-base-secondary);
}

.box-center {
    max-width: var(--mq-tablet);
    margin-left: auto;
    margin-right: auto;
}

.box--correct {
    background-color: var(--color-base-white);
    border-color: var(--color-base-white);
    border-radius: 3px 3px 0 0;
    border-top: 3px solid var(--color-base-green-6);
    box-shadow: var(--shadow-level-1);
}

.box--correct .box__hd {
    color: var(--color-base-green-6);
}

.box--correct .box__hd svg {
    fill: var(--color-base-green-6);
}

.box--incorrect {
    background-color: var(--color-base-white);
    border-color: var(--color-base-gray-2);
    border-radius: 3px 3px 0 0;
    border-top: 3px solid var(--color-base-red-5);
}

.box--incorrect .box__hd {
    color: var(--color-base-red-5);
}

.box--incorrect .box__hd svg {
    fill: var(--color-base-red-5);
}

button,
.button,
.button--default,
.button--plain {
    align-items: center;
    background: transparent;
    border: 1px solid transparent;
    border-radius: var(--size-border-radius-button);
    color: var(--color-text-button-text-base);
    display: inline-flex;
    font-size: var(--font-size-button);
    justify-content: stretch;
    line-height: calc(var(--font-size-base) * 1.5);
    overflow: hidden;
    padding: var(--spacing-button-padding-vertical) var(--spacing-button-padding-horizontal);
    -webkit-text-decoration: none;
    text-decoration: none;
}

button:hover,
.button:hover {
    background-color: var(--color-background-button-text-hover);
}

button:active,
.button:active {
    background-color: var(--color-background-button-text-active);
    color: var(--color-text-button-text-active);
}

button:focus,
.button:focus {
    outline: var(--size-outline-button) dotted var(--color-outline-button);
}

button:disabled,
.button:disabled {
    cursor: default;
    opacity: 0.35;
}

button:disabled:hover,
.button:disabled:hover {
    background-color: var(--color-background-button-text-base);
    color: var(--color-text-button-text-base);
}

.button--shelf,
.button--shelf:visited {
    color: var(--color-base-primary);
}

.button--shelf:hover {
    background-color: var(--color-base-gray-1);
}

.button--shelf:active {
    background-color: transparent;
    color: var(--color-base-primary);
}

.button--solid {
    background-color: var(--color-background-button-solid-base);
    border: 1px solid var(--color-border-button-solid-base);
    border-radius: var(--size-border-radius-button);
    color: var(--color-text-button-solid-base);
}

.button--solid:hover {
    background-color: var(--color-background-button-solid-hover);
}

.button--solid:active {
    background-color: var(--color-background-button-solid-active);
}

.button--solid:disabled:hover {
    background-color: var(--color-background-button-solid-base);
    color: var(--color-text-button-solid-base);
}

.button--line {
    background-color: var(--color-background-button-line-base);
    border: 1px solid var(--color-border-button-line-base);
    border-radius: var(--size-border-radius-button);
    color: var(--color-text-button-line-base);
}

.button--line:hover {
    background-color: var(--color-background-button-text-hover);
    border-color: var(--color-border-button-line-base);
}

.button--line:active {
    background-color: var(--color-background-button-line-active);
    border-color: var(--color-border-button-line-active);
    color: var(--color-text-button-line-active);
}

.button--danger {
    background-color: var(--color-background-button-danger-base);
    border-color: var(--color-border-button-danger-base);
    color: var(--color-text-button-danger-base);
}

.button--danger:hover {
    background-color: var(--color-background-button-danger-hover);
}

.button--danger:active {
    background-color: var(--color-background-button-danger-active);
}

.button--danger:disabled:hover {
    background-color: var(--color-background-button-danger-base);
    color: var(--color-text-button-danger-base);
}

.button--text {
    background-color: var(--color-background-button-text-base);
    border-color: var(--color-border-button-text-base);
    color: var(--color-text-button-text-base);
}

.button--text:hover {
    background-color: var(--color-background-button-text-hover);
}

.button--text:active {
    background-color: var(--color-background-button-text-active);
    color: var(--color-text-button-text-active);
}

.button--callout {
    background-color: var(--color-background-button-callout-base);
    border-color: var(--color-border-button-callout-base);
    color: var(--color-text-button-callout-base);
}

.button--callout:hover {
    background-color: var(--color-background-button-callout-hover);
}

.button--callout:active {
    background-color: var(--color-background-button-callout-active);
}

.button--callout:disabled:hover {
    background-color: var(--color-background-button-callout-base);
    color: var(--color-text-button-callout-base);
}

/**
 * .button--icon
 * Adds a font icon
 * The dom element must have a data-icon attribute set to the
 */

.button--icon {
    border-radius: 0 var(--size-border-radius-button) var(--size-border-radius-button) 0;
    margin-left: 2rem;
    overflow: visible;
    position: relative;
}

.button--icon::before {
    background-color: inherit;
    border-radius: var(--size-border-radius-button) 0 0 var(--size-border-radius-button);
    border-width: 1px;
    border-style: solid;
    border-color: transparent;
    border-right-width: 0;
    display: inline-flex;
    content: attr(data-icon);
    font-family: 'icomoon';
    font-size: var(--font-size-16);
    font-style: normal;
    font-weight: normal;
    font-feature-settings: normal;
    font-variant: normal;
    height: auto;
    left: -2rem;
    margin-bottom: 0;
    min-width: 31px;
    padding: var(--spacing-button-padding-vertical) 0.4375rem;
    position: absolute;
    text-transform: none;
    top: -1px;
    width: auto;
    -webkit-font-smoothing: antialiased;
}

.button--icon:hover {
    /* border: 1px solid var(--color-background-button-text-hover); */
}

.button--icon:focus::before {
    outline: 1px dotted var(--color-base-blue-7);
}

.button--icon:hover::before,
.button--icon:active::before,
.button--danger.button--icon:active::before,
.button--text.button--icon:hover::before {
    background-color: inherit;
}

.button--solid::before {
    background-color: var(--color-background-button-solid-hover);
}

.button--icon.icon {
    display: inline-flex;
}

.button--danger.button--icon::before {
    background-color: var(--color-background-button-danger-hover);
}

.button--text.button--icon::before {
    background-color: var(--color-background-button-text-base);
}

/**
 * .button--svg
 * button modifier that adds inline/embeded svg
 **/

.button--svg {
    padding: 0;
    vertical-align: middle;
}

.button--svg:active {
    background: inherit;
    border-left-color: var(--color-background-button-default-active);
}

.button--svg > * {
    align-items: center;
    display: flex;
    justify-content: center;
    line-height: var(--spacing-base);
}

.button--svg > *:first-child {
    align-self: stretch;
    background-color: inherit;
    width: 36px;
}

.button--svg > *:nth-child(2) {
    padding: var(--spacing-button-padding-vertical) var(--spacing-button-padding-horizontal);
}

.button--svg svg {
    fill: currentColor;
    height: 20px;
    width: 20px;
}

.button--svg object {
    filter: invert(100%);
}

/*
.button--svg > svg,
.button--svg > object {
    align-self: center;
    height: 18px;
    left: -1.6rem;
    position: absolute;
    width: 18px;
}
*/

.button--solid.button--svg > *:first-child {
    background-color: var(--color-background-button-solid-hover);
}

.button--line.button--svg > *:first-child {
    border-right: 1px solid var(--color-border-button-line-base);
}

.button--line.button--svg:active > *:first-child {
    border-right-color: var(--color-border-button-line-active);
}

/* stylelint-disable no-descending-specificity */

.button--danger.button--svg > *:first-child {
    background: var(--color-background-button-danger-hover);
}

.button--danger.button--svg:active > *:first-child {
    background-color: var(--color-background-button-danger-active);
}

.button--text.button--svg > *:nth-child(2) {
    padding-left: 0;
}

/* stylelint-enable no-descending-specificity */

.button--login-link,
.button--login-link:visited {
    background-color: rgb(0, 32, 81);
    border: none;
    border-radius: 5px;
    color: #fff;
    display: inline-block;
    font-family: "Cabin", var(--font-family-base);
    font-size: 13px;
    padding: 3px 0;
    text-align: center;
    -webkit-text-decoration: none;
    text-decoration: none;
    width: 75px;
}

.button--login-link:hover {
    color: #fff;
    -webkit-text-decoration: underline;
    text-decoration: underline;
}

/**
 * .callout
 * Used for providing feedback to users. It should most commonly be used towards the top of the
 * page. It comes a few variants with 'neutral' being the default.
 */

.callout {
    background-color: var(--color-base-gray-1);
    border: 1px solid var(--color-base-gray-5);
    color: var(--color-text-default);
    display: block;
    padding: calc(var(--spacing-1) - 1px) calc(var(--spacing-1) * 0.5);
    margin-bottom: var(--spacing-1);
    width: 100%;
}

.callout--success {
    background-color: var(--color-base-green-1);
    border-color: var(--color-base-green-3);
    color: var(--color-base-green-10);
}

.callout--info {
    background-color: var(--color-base-blue-1);
    border-color: var(--color-base-blue-2);
    color: var(--color-base-blue-10);
}

.callout--warning {
    background-color: var(--color-base-yellow-2);
    border-color: var(--color-base-yellow-4);
    color: var(--color-base-yellow-10);
}

.callout--error {
    background-color: var(--color-base-red-1);
    border-color: var(--color-base-red-3);
    color: var(--color-base-red-10);
}

.callout--rounded {
    border-radius: var(--size-border-radius-button);
}

.cards {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.card {
    min-width: 250px;
    padding: var(--spacing-2);
    margin: 3px;
    background-color: var(--color-base-white);
    border: 1px solid var(--color-base-gray-2);
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.cards > .card {
    flex-grow: 1;
    flex-basis: 0;
}

.card-title,
.card__title,
.card__title-1,
.card h3 {
    text-align: center;
    min-height: 60px;
}

.card__title.highlight,
.card__title-1.highlight {
    min-height: 72px;
}

.card__title-2,
.card h4 {
    min-height: 48px;
    margin-bottom: var(--spacing-2);
    font-weight: var(--font-weight-normal);
}

.card p {
    flex: 1 1 auto;
}

/**
 * .card--rounded
 * Modifier for adding rounded corners to a card
 */

.card--rounded {
    border-radius: 5px;
}

/**
 * .card--circle
 * Creates a card in the shape of a circle
 * The height and width default to 240px, but the modifiers below
 * allow for predefined sizes.
 *
  .card--circle-{base line height multiplier}
  .card--circle-10 = {
    height: 10 * Base line-height(12px)
    width: 10 * Base line-height(12px)
  }
  .card--circle-11 = {
    height: 11 * Base line-height(12px)
    width: 11 * Base line-height(12px)
  }
*/

.card--circle {
    align-items: center;
    background-color: var(--color-base-gray-1);
    border-color: transparent;
    border-radius: 100%;
    flex-basis: initial;
    flex-direction: column;
    flex-grow: initial;
    height: 240px;
    justify-content: center;
    min-width: auto;
    width: 240px;
}

.card--circle-10 {
    height: 120px;
    width: 120px;
}

.card--circle-11 {
    height: 132px;
    width: 132px;
}

.card--circle-12 {
    height: 144px;
    width: 144px;
}

.card--circle-13 {
    height: 156px;
    width: 156px;
}

.card--circle-14 {
    height: 168px;
    width: 168px;
}

.card--circle-15 {
    height: 180px;
    width: 180px;
}

.card--circle-16 {
    height: 192px;
    width: 192px;
}

.card--circle-17 {
    height: 204px;
    width: 204px;
}

.card--circle-18 {
    height: 216px;
    width: 216px;
}

.card--circle-19 {
    height: 228px;
    width: 228px;
}

.card--circle-20 {
    height: 240px;
    width: 240px;
}

@media (max-width: 544px) {
    .card {
        flex-basis: auto;
    }
}

.card-deck {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-left: calc(var(--grid-gutter) * -1);
    margin-right: calc(var(--grid-gutter) * -1);
}

.card-beta {
    margin-bottom: var(--spacing-1);
}

.card-beta__container {
        background-color: var(--color-background-card-default);
        border: 1px solid var(--color-border-card-default);
        border-radius: var(--size-border-radius-card);
        display: flex;
        flex-direction: column;
        height: 100%;
        padding: var(--size-400);
        position: relative;
    }

.card-beta__title {
        color: var(--color-text-card-title-base);
        font-size: var(--font-size-card-title);
        line-height: var(--size-450);
        margin-bottom: var(--size-150);
        order: 2;
        text-align: left;
    }

.card-beta__subtitle {
        color: var(--color-text-card-subtitle-fill);
        font-size: var(--font-size-card-subtitle);
        line-height: var(--size-325);
        margin-bottom: var(--size-400);
        order: 0;
        text-align: left;
    }

.card-beta__media {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: var(--size-400);
        order: 1;
    }

.card-beta__description {
        flex: 1 1 auto;
        margin-bottom: var(--size-150);
        order: 3;
    }

.card-beta__description p {
        color: var(--color-text-card-description-base);
        font-size: var(--font-size-card-description);
        line-height: var(--size-400);
    }

.card-beta__description p:last-child {
        margin-bottom: 0;
    }

.card-beta__buttons {
        align-content: flex-start;
        align-items: flex-start;
        display: flex;
        order: 4;
    }

.card-beta__buttons--reverse {
        justify-content: flex-end;
    }

.card-beta__buttons > * {
        margin-right: 4px;
    }

.card-beta--elevate .card-beta__container {
        box-shadow: var(--shadow-level-2);
    }

.card-beta--no-border .card-beta__container {
        border-color: transparent;
    }

.card-beta--badge .card-beta__container {
        display: grid;
        grid-gap: 0 5%;
        gap: 0 5%;
        grid-template-columns: auto 3fr;
    }

.card-beta--badge .card-beta__container > * {
            grid-column-start: 2;
            order: initial;
        }

.card-beta--badge .card-beta__media {
        align-items: flex-start;
        grid-column-start: 1;
        justify-self: start;
        margin-bottom: var(--size-0);
    }

.card-beta--badge .card-beta__title {
        font-size: var(--font-size-18);
        font-weight: var(--font-weight-bold);
        line-height: var(--size-300);
    }

.card-beta--badge .card-beta__description p {
        font-size: var(--font-size-16);
        font-weight: var(--font-weight-regular);
    }

@media only screen and (min-width: 544px) {
        .card-beta--badge .card-beta__container {
            display: flex;
            flex-direction: column;
        }

        .card-beta--badge .card-beta__media {
            margin-bottom: var(--size-400);
        }
    }

.card-beta--fill .card-beta__container {
        background: var(--color-background-card-fill);
    }

.card-beta--fill .card-beta__title {
        color: var(--color-text-card-title-fill);
    }

.card-beta--fill .card-beta__description p {
        color: var(--color-text-card-description-fill);
    }

.card-beta--fill .card-beta__buttons--reverse a {
        color: var(--color-text-card-buttons-fill);
    }

.card-beta--fill .card-beta__buttons--reverse a::after {
        border-color: var(--color-border-card-buttons-link-fill);
    }

.card-beta--unorder .card-beta__title,
    .card-beta--unorder .card-beta__subtitle,
    .card-beta--unorder .card-beta__media,
    .card-beta--unorder .card-beta__description,
    .card-beta--unorder .card-beta__buttons {
        order: initial;
    }

.card-deck > .card-beta .card-beta__container {
    margin-left: var(--grid-gutter);
    margin-right: var(--grid-gutter);
}

/**
 * Code
 */

pre {
    background-color: var(--color-base-gray-9);
    color: var(--color-base-gray-1);
    overflow: auto;
    padding: 4px 4px var(--spacing-1) 4px;
}

pre.pre-wrap {
    white-space: pre-wrap;
    width: auto;
}

pre[data-lang]::before {
    background-color: var(--color-base-gray-7);
    color: var(--color-base-white);
    content: attr(data-lang);
    display: block;
    margin-bottom: var(--spacing-1);
    padding: 0 0.5rem;
}

mark {
    background-color: var(--color-base-cyan-2);
    color: var(--color-text-default);
    margin-right: 2px;
    padding: 0 4px;
}

pre mark {
    background: none;
    border-bottom: 1px solid;
    color: inherit;
}

/**
 * Adds comments to your code examples, e.g.:
 */

.code-comment {
    opacity: 0.75;
}

/**
 * You can add line numbers to your code examples but be warned, it requires
 * some pretty funky looking markup, e.g.:
 *
   <ol class=line-numbers>
       <li><code>.nav{</code></li>
       <li><code>    list-style:none;</code></li>
       <li><code>    margin-left:0;</code></li>
       <li><code>}</code></li>
       <li><code>    .nav > li,</code></li>
       <li><code>        .nav > li > a{</code></li>
       <li><code>            display:inline-block;</code></li>
       <li><code>           *display:inline-block;</code></li>
       <li><code>            zoom:1;</code></li>
       <li><code>        }</code></li>
   </ol>
 *
 * 1. Make the list look like code.
 * 2. Give the list flush numbers with a leading zero.
 * 3. Make sure lines of code don’t wrap.
 * 4. Give the code form by forcing the `code` to honour white-space.
 */

.line-numbers {
    font-family: monospace, serif;
    list-style: decimal-leading-zero inside;
    white-space: nowrap;
    overflow: auto;
    margin-left: 0;
}

.line-numbers code {
    white-space: pre;
}

@media only screen and (min-width: 544px) {
    pre {
        width: -moz-max-content;
        width: max-content;
    }
}

.data-table tbody th,
.data-table tbody td {
    line-height: 24px;
    padding: 0 1rem;
}

.data-table th {
    font-size: var(--font-size-data-table-heading);
}

.data-table td {
    font-size: var(--font-size-data-table-cell);
}

.data-table--zebra tbody tr:nth-child(2n) th,
.data-table--zebra tbody tr:nth-child(2n) td {
    background-color: var(--color-background-table-row-zebra);
}

.data-table--compress thead th,
.data-table--compress thead td {
    background-color: transparent;
    padding: var(--spacing-1) 0;
}

.data-table--compress thead th {
    font-weight: var(--font-weight-bold);
}

.data-table--compress tbody th,
.data-table--compress tbody td {
    border-width: 0;
    padding: 0 0;
}

.display-table {
    background-color: var(--color-base-white);
    border: 1px solid var(--color-base-gray-1);
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 8px;
}

.display-table thead th,
.display-table thead td {
    background-color: var(--color-base-white);
    color: var(--color-base-gray-7);
    font-size: var(--font-size-16);
    font-weight: var(--font-weight-light);
    line-height: var(--spacing-base);
    padding: calc(1rem + var(--size-smallest)) 1rem calc(1rem + var(--size-smallest) * 2);
}

.display-table th:first-child {
    border-top-left-radius: 8px;
}

.display-table th:last-child {
    border-top-right-radius: 8px;
}

.display-table th,
.display-table td {
    border-color: transparent;
}

.display-table tbody tr:last-child th,
.display-table tbody tr:last-child td {
    border-bottom: none;
}

/* stylelint-disable no-descending-specificity */

.display-table--border th {
    border-bottom: 1px solid var(--color-base-gray-1);
}

/* stylelint-enable no-descending-specificity */

.display-table--border th:first-child {
    border-top-left-radius: 8px;
    border-bottom-left-radius: 0;
}

.display-table--border th:last-child {
    border-top-right-radius: 8px;
    border-bottom-right-radius: 0;
}

.display-table--border th,
.display-table--border td {
    border-color: var(--color-base-gray-1);
    border-right: 1px solid var(--color-base-gray-1);
}

.display-table--border tr th:last-child,
.display-table--border tr td:last-child {
    border-right: none;
}

.display-table--border tbody tr:last-child td {
    border-bottom: none;
}

.document-list {
    list-style: none;
    list-style-position: outside;
    margin: 0 0 var(--spacing-2) 0;
}

.document-list > li,
    .document-list__item {
        align-content: flex-start;
        align-items: flex-start;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        line-height: var(--spacing-base);
        margin: 0 0 var(--spacing-1) 0;
    }

.document-list > li > a {
        align-items: center;
        display: inline-flex;
        margin-right: calc(var(--spacing-1) * 0.5);
    }

.document-list__item-description {
        flex: 0 0 100%;
        margin-bottom: 0;
    }

.document-list > li > a > .icon,
    .document-list > li > .svg-icon,
    .document-list > li > a > .svg-icon {
        align-self: flex-start;
        margin-right: calc(var(--spacing-1) * 0.5);
        margin-top: 4px;
        flex-shrink: 0;
    }

.document-list > li > a > svg {
        flex-shrink: 0;
        height: 16px;
        margin-right: calc(var(--spacing-1) * 0.5);
        width: 16px;
    }

.document-list > li > .svg-icon {
        top: 5px;
    }

.feature {
    display: flex;
    gap: 4%;
}

.feature__content {
        margin-bottom: 0;
        width: auto;
    }

.feature__content .feature__title {
            font-family: var(--asset-font-sourcesanspro-name);
            color: var(--color-text-feature-title, var(--color-base-secondary));
            font-size: var(--font-size-18);
            font-weight: var(--font-weight-bold);
            line-height: var(--spacing-2);
            text-transform: uppercase;
            margin-bottom: var(--size-200);
            padding-top: 0;
        }

.feature__content .feature__description {
            font-family: var(--asset-font-opensans-name);
            font-size: var(--font-size-16);
            line-height: var(--spacing-padding-vertical-box-default);
            margin: 0;
        }

.feature__media {
    flex: 0 0 100px;
}

.feature-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
}

.feature-grid .feature {
        margin-bottom: var(--spacing-padding-vertical-box-default);
        margin-right: var(--size-200);
        padding-left: 0;
    }

.feature-grid--3 .feature {
        width: 31.4%;
    }

.feature-grid--2,
.feature-grid--3 {
    justify-content: center;
}

.feature-grid--1 {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    max-width: 544px;
}

.feature-grid--1 .feature {
        margin-right: 0;
        width: 100%;
    }

.feature-grid--1 .feature:nth-of-type(even) {
        flex-direction: row-reverse;
    }

.feature-grid--1 .feature:nth-of-type(even) .feature__media > * {
        margin-left: var(--size-200);
        margin-right: 0;
    }

.feature-grid .feature:last-child {
    margin-bottom: 0;
}

@media only screen and (max-width: 544px) {
    .feature-grid {
        flex-direction: column;
        justify-content: center;
        width: 100%;
    }

        .feature-grid .feature {
            margin-right: 0;
            width: 100%;
        }

        .feature-grid .feature:nth-of-type(even) {
            flex-direction: row-reverse;
        }

        .feature-grid .feature:nth-of-type(even) .feature__media > * {
            margin-left: var(--size-200);
            margin-right: 0;
        }

    .feature-grid--2 .feature:nth-child(2n+1):nth-last-child(-n+1),
    .feature-grid--2 .feature:nth-child(2n+1):nth-last-child(-n+1) ~ div,
    .feature-grid--3 .feature:nth-child(3n+1):nth-last-child(-n+1),
    .feature-grid--3 .feature:nth-child(3n+1):nth-last-child(-n+1) ~ div {
        margin-bottom: var(--spacing-padding-vertical-box-default);
    }
}

@media only screen and (max-width: 800px) and (min-width: 545px) {
    .feature-grid--3 {
        justify-content: flex-start;
    }

        .feature-grid--3 .feature {
            width: 30%;
        }
}

@media only screen and (min-width: 545px) {
        .feature-grid--2 .feature {
            width: 42%;
        }

    .feature-grid--2 .feature:nth-child(2n+1):nth-last-child(-n+2),
    .feature-grid--2 .feature:nth-child(2n+1):nth-last-child(-n+2) ~ div,
    .feature-grid--3 .feature:nth-child(3n+1):nth-last-child(-n+3),
    .feature-grid--3 .feature:nth-child(3n+1):nth-last-child(-n+3) ~ div {
        margin-bottom: 0;
    }
}

.feature-list {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
}

.feature-list > * {
    padding-left: 100px;
}

.feature-list dt {
    color: var(--color-text-subhead-1);
    font-size: var(--font-size-subhead);
    font-weight: var(--font-weight-regular);
    line-height: var(--spacing-3);
    padding-top: 0;
}

.feature-list dt::before {
    background-position: 0 0;
    background-repeat: no-repeat;
    content: '';
    height: 84px;
    margin-left: -96px;
    margin-top: 0;
    position: absolute;
    width: 84px;
}

.feature-list dd {
    margin: 0;
}

.feature-list__clock dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/clock.svg);
}

.feature-list__pagesize dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/pagesize.svg);
}

.feature-list__gavel dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/gavel.svg);
}

.feature-list__dollar dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/dollar.svg);
}

.feature-list__percentage dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/percentage.svg);
}

.feature-list__monitor dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/monitor.svg);
}

.feature-list__pagestack dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/pagestack1.svg);
}

.feature-list__target dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/target.svg);
}

.feature-list__transaction dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/transaction.svg);
}

.feature-list__dollarsign dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/dollarsign.svg);
}

.feature-list__umbrella dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/umbrella.svg);
}

.feature-list__globemarkers dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/globemarkers.svg);
}

.feature-list__scale dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/scale.svg);
}

.feature-list__sprout dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/sprout.svg);
}

.feature-list__lightbulb dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/lightbulb.svg);
}

.feature-list__circle-arrowforward dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/cboe/circle_arrowforward.svg);
}

.feature-list__package-delivery dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/cboe/package_delivery.svg);
}

.feature-list__magnifying-glass dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/magnifyingglass.svg);
}

.feature-list__ribbon dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/ribbon.svg);
}

.feature-list__trophy dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/trophy.svg);
}

.feature-list__handshake dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/handshake.svg);
}

.feature-list__ascending-bar-chart dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/marketing/ascending_bar_chart.svg);
}

.feature-list__securemoney dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/cboe/secure_money.svg);
}

.feature-list__global dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/cboe/global.svg);
}

.feature-list__documentsize dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/cboe/document_size.svg);
}

.feature-list__calendar dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/cboe/large_calendar.svg);
}

.feature-list__cboeumbrella dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/cboe/umbrella.svg);
}

.feature-list__cboedollar dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/cboe/dollar.svg);
}

.feature-list__leaf dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/cboe/leaf.svg);
}

.feature-list__cboetarget dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/cboe/target.svg);
}

.feature-list__moneywallet dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/cboe/money_wallet.svg);
}

.feature-list__thumbsup dt::before {
    background-image: url(/res/_css/organic/bin/assets/icons/cboe/thumbs_up.svg);
}

@media only screen and (min-width: 630px) {
    .feature-list {
        flex-direction: row;
        width: 100%;
    }

    .feature-list > * {
        margin-left: 8%;
        padding-left: 0;
        width: 40%;
    }

    .feature-list dt {
        padding-top: 84px;
    }

    .feature-list dt::before {
        background-position: 0 0;
        margin: -84px 0 0 -12px;
    }

    .feature-list__pagesize dt::before {
        background-position: 2px 4px;
    }

    .feature-list__dollar dt::before {
        background-position: 2px 12px;
    }

    .feature-list__percentage dt::before {
        background-position: -10px 7px;
    }

    .feature-list__monitor dt::before {
        background-position: -3px 5px;
    }

    .feature-list__pagestack dt::before {
        background-position: -8px 3px;
    }

    .feature-list__target dt::before {
        background-position: -4px 4px;
    }

    .feature-list__transaction dt::before {
        background-position: 4px -3px;
    }

    .feature-list__dollarsign dt::before {
        background-position: -16px -1px;
    }

    .feature-list__umbrella dt::before {
        background-position: -1px -1px;
    }
}

@media only screen and (min-width: 781px) {
    .feature-list > * {
        margin-left: 18%;
        width: 30%;
    }

    .feature-list dt {
        color: var(--color-text-subhead-1);
        font-size: var(--font-size-subhead);
        font-weight: var(--font-weight-regular);
        line-height: var(--spacing-3);
        padding-top: 0;
    }

    .feature-list dt::before {
        background-position: 0 0;
        background-repeat: no-repeat;
        content: '';
        height: 108px;
        margin-left: -120px;
        margin-top: 0;
        position: absolute;
        width: 108px;
    }
}

/*
    Experimental
 */

.link-list {
    list-style: none;
    list-style-position: outside;
    margin: 0 0 var(--spacing-2) 0;
}

.link-list > li,
    .link-list__item {
        align-content: flex-start;
        align-items: flex-start;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        line-height: var(--spacing-base);
        margin: 0 0 var(--spacing-1) 0;
    }

.link-list > li:last-child {
        margin-bottom: 0;
    }

.link-list__link,
    .link-list > li > a {
        display: flex;
        align-items: flex-start;
        margin-right: calc(var(--spacing-1) * 0.5);
    }

.link-list__link__bullet {
        flex-shrink: 0;
        height: 16px;
        margin-right: calc(var(--spacing-1) * 0.5);
        margin-top: calc(1 / 6 * var(--spacing-base));
        width: 16px;
    }

.link-list__link__text {
        display: list-item;
        margin-bottom: 0;
    }

.link-list--hover-forward .link-list__link__text {
    transition-property: transform;
    transition-duration: 0.3s;
}

.link-list--hover-forward li > a:hover .link-list__link__text {
    transform: translateX(var(--spacing-1));
}

h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
    font-family: var(--font-family-headline);
    font-feature-settings: 'case';
    color: var(--color-text-default);
}

h2,
.h2,
h3,
.h3 {
    margin-bottom: var(--spacing-1);
}

h1,
.h1 {
    font-size: var(--font-size-h-1);
    line-height: var(--spacing-4);
    font-weight: var(--font-weight-h-1);
}

h2,
.h2 {
    font-size: var(--font-size-h-2);
    font-weight: var(--font-weight-h-2);
    line-height: var(--spacing-3);
}

h3,
.h3 {
    font-size: var(--font-size-h-3);
    line-height: var(--spacing-3);
    font-weight: var(--font-weight-h-3);
}

h4,
.h4,
h5,
.h5,
h6,
.h6 {
    margin-bottom: 0;
}

h4,
.h4 {
    line-height: var(--spacing-2);
    font-size: var(--font-size-h-4);
    font-weight: var(--font-weight-h-4);
}

h5,
.h5 {
    line-height: var(--spacing-2);
    font-size: var(--font-size-h-5);
    font-weight: var(--font-weight-h-5);
}

h6,
.h6 {
    line-height: var(--spacing-2);
    font-size: var(--font-size-h-6);
    font-weight: var(--font-weight-h-6);
}

/**
 * .headline styles
 * A heading style that applies color. Similar to an h1, h2...
 * but applies a color. Probably should be constrained to h1's
 *
 * Modifiers:
 *     --primary-[n]: Use this modifier when applying a heading where the background
 *     will be the Cboe primary brand color (the dark blue). Any of the --primary-1 or
 *     --primary-2 is acceptible.
 *     --dark-[n]: Use this modifier when applying a heading where the background
 *     will be a dark background color such as black. Any of the --dark-1 or
 *     --dark-2 is acceptible.
 */

.headline,
.headline--1 {
    color: var(--color-text-headline-1);
    font-size: var(--font-size-headline);
    font-weight: var(--font-weight-headline);
    line-height: var(--spacing-4);
}

.headline--2 {
    color: var(--color-text-headline-2);
}

.headline--primary-1 {
    color: var(--color-text-primary-headline-1);
}

.headline--primary-2 {
    color: var(--color-text-primary-headline-2);
}

.headline--dark-1 {
    color: var(--color-text-dark-headline-1);
}

.headline--dark-2 {
    color: var(--color-text-dark-headline-2);
}

.highlight,
.highlight--1 {
    color: var(--color-text-highlights-1);
    font-size: var(--font-size-highlight);
    font-weight: var(--font-weight-light);
    line-height: var(--spacing-3);
}

.highlight--2 {
    color: var(--color-text-highlights-2);
}

.highlight--primary-1 {
    color: var(--color-text-primary-highlights-1);
}

.highlight--primary-2 {
    color: var(--color-text-primary-highlights-2);
}

.highlight--dark-1 {
    color: var(--color-text-dark-highlights-1);
}

.highlight--dark-2 {
    color: var(--color-text-dark-highlights-2);
}

.subhead,
.subhead--1 {
    color: var(--color-text-subhead-1);
    font-size: var(--font-size-subhead);
    font-weight: var(--font-weight-subhead);
    line-height: var(--spacing-3);
}

.subhead--2 {
    color: var(--color-text-subhead-2);
}

.subhead--3 {
    color: var(--color-text-subhead-3);
}

.subhead--primary-1 {
    color: var(--color-text-primary-subhead-1);
}

.subhead--dark-subhead-1 {
    color: var(--color-text-dark-subhead-1);
}

.subhead--dark-subhead-2 {
    color: var(--color-text-dark-subhead-2);
}

.subhead--dark-subhead-3 {
    color: var(--color-text-dark-subhead-3);
}

.subhead--line-separator {
    border-bottom: 1px solid var(--color-base-gray-3);
}

.category {
    color: var(--color-text-category);
    font-family: var(--font-family-category);
}

.category--primary {
    color: var(--color-text-primary-category);
}

.category--dark {
    color: var(--color-text-dark-category);
}

[data-category]::before {
    color: var(--color-text-category);
    content: attr(data-category);
    display: block;
    font-family: var(--font-family-category);
    font-size: var(--font-size-base);
    line-height: var(--spacing-base);
    margin-bottom: var(--spacing-1);
    text-transform: uppercase;
}

.font-size-base {
    font-size: var(--font-size-base);
}

/*
 ## Small Fonts ##
 A series of classes for setting small type
 <p class="milli">This is small text.</p>
 <p class="micro">This is even small text<p>
 */

.micro {
    font-family: var(--font-family-base);
    font-size: var(--font-size-10);
}

small,
.milli {
    font-size: var(--font-size-12);
}

.hero {
    width: 100%;
    display: flex;
    flex-direction: column;
    background-color: var(--color-base-neutral-1000);
    padding: var(--size-900) var(--size-0);
    align-items: center;
}

.hero > * {
        padding: 0 var(--grid-gutter);
        width: 100%;
    }

@media only screen and (min-width: 1080px) {

.hero > * {
            width: var(--mq-desktop)
    }
        }

.hero__title {
        font-weight: var(--font-weight-bold);
        font-size: var(--font-size-72);
        line-height: var(--size-975);
        color: var(--color-base-white);
        text-align: center;
    }

.hero__description {
        font-size: var(--font-size-44);
        line-height: var(--size-600);
        color: var(--color-base-white);
        text-align: center;
    }

.hero__cta {
        display: flex;
        flex-direction: column;
        padding: var(--grid-gutter);
        align-self: center;
        justify-content: center;
    }

.hero__cta > * {
            display: flex;
            flex-direction: column;
            flex: 1 0 0%;
            width: 100%;
        }

.hero__cta > div:nth-child(2) {
            display: inherit;
            background-color: var(--color-base-blue-300);
        }

.hero__cta > div:nth-child(2) > img {
                padding: var(--size-250);
                margin: var(--size-0);
            }

.hero__cta > div:first-child {
            background-color: var(--color-base-white);
        }

.hero__cta > div:first-child > div {
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                margin: var(--size-300);
                align-items: flex-start;
            }

.hero__cta > div:first-child > div > h2,
                .hero__cta > div:first-child > div p {
                    padding-bottom: var(--size-300);
                }

.hero__cta > div:first-child > div > a.button {
                    width: 100%;
                    justify-content: center;
                }

@media only screen and (min-width: 544px) {
    .hero__cta {
        flex-direction: column;
        padding: 0 var(--grid-gutter);
        flex: 0 0 auto;
        width: 75%;
    }
            .hero__cta > div:nth-child(2) > img {
                margin: auto;
            }
            .hero__cta > div:first-child > div {
                padding: var(--size-600);
            }

                .hero__cta > div:first-child > div > a.button {
                    max-width: 224px;
                }
}

@media only screen and (min-width: 1080px) {
    .hero__cta {
        flex-direction: row;
        width: var(--mq-desktop);
    }
}

.link {
    display: inline-flex;
    align-items: center;
    -webkit-text-decoration: none;
    text-decoration: none;
}

.link:hover {
    -webkit-text-decoration: underline;
    text-decoration: underline;
}

.link::after,
.link::before {
    border-color: var(--color-text-links);
    border-style: solid;
    border-width: 3px 3px 0 0;
    content: '';
    display: none;
    height: 11px;
    width: 11px;
}

/**
 * Link modifier that adds a left or right arrow
 **/

.link--forward::after,
.link--backward::before {
    display: block;
}

.link--forward::after {
    margin-left: 0.25rem;
    transform: rotate(45deg);
}

.link--backward::before {
    margin-right: 0.25rem;
    transform: rotate(-135deg);
}

ul > li,
ol > li {
    margin-bottom: var(--spacing-list-item-margin-vertical);
}

/**
 * Remove vertical spacing from nested lists
 */

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

ul > li > ul {
    margin-top: var(--spacing-list-item-margin-vertical);
}

dt {
    font-family: var(--font-family-dt);
    font-size: var(--font-size-dt);
    font-weight: var(--font-weight-dt);
    margin-bottom: var(--spacing-dt-vertical);
}

dd {
    font-size: var(--font-size-dd);
    margin-bottom: var(--spacing-vertical-dd);
    margin-left: 0;
}

dd > dl {
    margin-left: var(--spacing-1);
    margin-top: var(--spacing-1);
}

/**
 * .no-bullet-list
 * Displays a generic list with no bullet/markers
 */

.no-bullet-list {
    list-style: none;
    margin-left: 0;
}

/**
 * .trim-list
 * Removes margin from list items
 */

.trim-list > *,
.trim-list > * > ul,
.trim-list > * > ol,
.trim-list > * > ul > li,
.trim-list > * > ol > li {
    margin-bottom: 0;
    margin-top: 0;
}

/**
 * .numbered-list allows for a numbered 'ul' without the semantics implied by
 * using an 'ol' element. If spacing is desired when using the .numbered-list class,
 * extend the 'base' class
 */

ol.base li,
.numbered-list {
    list-style-type: decimal;
}

.lower-roman-list li {
    list-style-type: lower-roman;
}

.lower-alpha-list > li {
    list-style-type: lower-alpha;
}

/**
 * .compact-list
 * Removes bottom margin for each list item
 */

.compact-list > li,
.compact-list dd,
.compact-list dt {
    margin-bottom: 0;
}

/**
 * .spaced-list
 * Adds a large amount of whitespace between list items
 */

ul.spaced-list li,
ol.spaced-list li,
dl.spaced-list dt,
dl.spaced-list dd {
    margin-bottom: var(--spacing-2);
}

/*
 * This is a custom numbered list useful for footnotes
 */

.footnote-list {
    counter-reset: footnote-counter;
    margin-bottom: var(--spacing-2);
    margin-left: 0;
    padding-left: 0;
}

.footnote-list > li,
.footnote-list__item {
    line-height: var(--spacing-2);
    list-style: none;
    padding-left: var(--spacing-1);
    position: relative;
}

.footnote-list > *::before,
.footnote-list__item::before {
    content: counter(footnote-counter);
    counter-increment: footnote-counter;
    font-size: 9px;
    left: 0;
    position: absolute;
    text-align: right;
    top: -3px;
}

.footnote-list ul,
.footnote-list__item ul {
    list-style-type: disc;
    margin-left: var(--spacing-3);
}

.footnote-list > li ul li ul,
.footnote-list__item ul li ul {
    list-style-type: circle;
}

/*
 * Custom numerical list where the number is encased inside a pair of parentheses
 */

.num-parentheses-list {
    counter-reset: num-parentheses-counter;
    margin-left: var(--spacing-3);
    padding-left: 0;
}

.num-parentheses-list > li {
    list-style: none;
    position: relative;
}

.num-parentheses-list > li::before {
    content: '(' counter(num-parentheses-counter) ')';
    counter-increment: num-parentheses-counter;
    margin-left: -24px;
    position: absolute;
}

/*
 * .asterisk-list
 *
 * List where each list item has an asterisk as each marker. The total amount of asterisks will
 * equal the index value of the list. For example, the first list item will have one asterisk, the * second list item will two asterisk, and so on. This will only support up to five list items. If * you have a requirement that needs more, then use a different approach, such as the footnote-list
 * or num-parentheses-list
 */

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

.asterisk-list > li {
    font-size: var(--font-size-12);
    margin-left: var(--spacing-3);
}

.asterisk-list > li:nth-child(n+6) {
    display: none;
}

.asterisk-list > li::before {
    content: '*';
    display: block;
    font-size: var(--font-size-10);
    position: absolute;
    margin-left: -2.3125rem;
    text-align: right;
    width: 2.25rem;
}

.asterisk-list > li:nth-child(2)::before {
    content: '**';
}

.asterisk-list > li:nth-child(3)::before {
    content: '***';
}

.asterisk-list > li:nth-child(4)::before {
    content: '****';
}

.asterisk-list > li:nth-child(5)::before {
    content: '*****';
}

/*
* Custom timeline with vertical guide
*/

dl.timeline {
    display: flex;
    flex-flow: row wrap;
    max-width: var(--mq-desktop);
}

dl.timeline > dt,
dl.timeline dd {
    margin-bottom: var(--spacing-2);
}

dl.timeline > dt {
    width: 20%;
    text-align: right;
    position: relative;
    font-size: var(--font-size-24);
    color: var(--color-base-blue-8);
    font-weight: bold;
}

dl.timeline > dd {
    margin-left: var(--spacing-3);
    position: relative;
    width: 70%;
}

dl.timeline > dd + dd {
    margin-left: calc(20% + var(--spacing-3));
}

/* Circle styles */

dl.timeline > dt::before,
dl.timeline dd::before {
    content: '';
    border-radius: 50%;
    position: absolute;
    z-index: 1;
}

/* Large circle next to each year */

dl.timeline > dt::before {
    width: var(--size-timeline-bullet-2);
    height: var(--size-timeline-bullet-2);
    top: calc((var(--spacing-base) - var(--size-timeline-bullet-2)) / 2);

    /* Horizontally center circle to the middle of dd's left margin */
    right: calc(0px - ((var(--size-timeline-bullet-2) + var(--spacing-3)) / 2));
    background-color: var(--color-base-blue-2);
}

/* Smaller circles next to each item */

dl.timeline > dd::before {
    width: var(--size-timeline-bullet-1);
    height: var(--size-timeline-bullet-1);
    top: calc((var(--spacing-base) - var(--size-timeline-bullet-1)) / 2);

    /* Horizontally center circle to the middle of dd's left margin */
    left: calc(0px - ((var(--size-timeline-bullet-1) + var(--spacing-3)) / 2));
    background-color: var(--color-base-blue-4);

    /* Solid white outline */
    box-shadow: 0 0 0 2px white;
}

/* Solid vertical line, minus the last item */

dl.timeline > dd:not(:last-child)::after {
    content: '';
    width: 4px;
    height: calc(100% + var(--spacing-2));
    position: absolute;
    top: 8px;
    left: calc(0px - (var(--spacing-3) / 2) - 2px);
    background-color: var(--color-base-blue-2);
}

@media (max-width: 544px) {
    dl.timeline > dt {
        width: 10%;
        font-size: var(--font-size-16);
    }

    dl.timeline > dd {
        width: 75%;
    }

    dl.timeline > dd + dd {
        margin-left: calc(10% + var(--spacing-3));
    }
}

dl.timeline--show-all-vertical-lines > dd:last-child::after {
    content: '';
    width: 4px;
    height: calc(100% + var(--spacing-2));
    position: absolute;
    top: 8px;
    left: calc(0px - (var(--spacing-3) / 2) - 2px);
    background-color: var(--color-base-blue-2);
}

.marker {
    counter-reset: marker-counter;
}

.marker__item {
    position: relative;
}

.marker__item::before {
    background-color: var(--color-base-gray-10);
    border-radius: 50%;
    color: var(--color-base-white);
    content: counter(marker-counter);
    counter-increment: marker-counter;
    font-weight: var(--font-weight-bold);
    font-size: 16px;
    line-height: 12px;
    padding: 12px;
    position: absolute;
    text-align: center;
}

/**
 * Nav styles
 *
 * When used with an ordered or unordered list, this class will display the list horizontally.
 * Note: you may need to extend the clearfix class (.cf)
 * Example:
 *
    <ul class="nav">
        <li><a href="#">Home</a></li>
        <li><a href="#">Markets</a></li>
        <li><a href="#">Resources</a></li>
        <li><a href="#">Contact</a></li>
    </ul>
 */

/* stylelint-disable no-descending-specificity */

nav,
nav.nav {
    display: block;
}

.nav {
    margin-bottom: var(--spacing-2);
}

.nav,
.nav > ul,
.nav > ol,
nav.nav > * {
    display: flex;
    list-style: none;
    margin-left: 0;
    justify-content: space-between;
}

.nav > ul,
.nav > ol,
nav.nav > * {
    margin-bottom: 0;
}

.nav > * > * {
    margin-right: var(--spacing-1);
}

.nav a {
    -webkit-text-decoration: none;
    text-decoration: none;
}

.nav__selected > *,
.nav__selected > a {
    -webkit-text-decoration: underline;
    text-decoration: underline;
}

/**
 * .nav--tab
 * Tab like navigation style
 */

nav.nav--tab > *,
.nav--tab > * {
    border-bottom: 2px solid var(--color-base-gray-2);
    justify-content: flex-start;
}

.nav--tab > * > *,
.nav--tab .nav__item {
    margin-bottom: -2px;
    margin-right: 0;
    padding: calc(var(--spacing-1) - var(--size-smallest)) var(--spacing-2);
}

.nav--tab > * > *,
.nav--tab a {
    color: var(--color-base-gray-9);
    -webkit-text-decoration: none;
    text-decoration: none;
}

.nav--tab .nav__selected {
    border-bottom: 2px solid var(--color-base-blue-7);
}

/**
 * .nav--wrap
 * @extends .nav
 * By default, .nav does not wrap, this will allow nav items
 * to wrap to the next line
 */

.nav--wrap,
.nav--wrap > ul,
.nav--wrap > ol {
    flex-wrap: wrap;
    justify-content: flex-start;
}

.nav--wrap > * > * {
    margin-bottom: calc(var(--spacing-1) * 0.5);
}

/**
* .nav--stacked
* @extends .nav
*
* Example:
*
    <ul class="nav nav--stacked">
        <li><a href="#">Menu Item 1</a></li>
        <li><a href="#">Menu Item 2</a></li>
        <li><a href="#">Menu Item 3</a></li>
        <li><a href="#">Menu Item 4</a></li>
        <li><a href="#">Menu Item 5</a></li>
        <li><a href="#">Menu Item 6</a></li>
    </ul>
*/

.nav--stacked {
    display: flex;
    overflow: hidden;
}

nav.nav--stacked ul,
nav.nav--stacked ol,
ul.nav--stacked,
ol.nav--stacked {
    display: flex;
    flex-direction: column;
    float: left;
}

.nav--stacked ul > li,
.nav--stacked ol > li,
.nav--stacked > li {
    display: list-item;
}

.nav--stacked ul > li > a,
.nav--stacked ol > li > a,
.nav--stacked > li > a {
    display: block;
}

/* stylelint-enable no-descending-specificity */

.quote {
    display: flex;
    flex-direction: column;
}

.quote__portrait {
        width: 100%;
    }

.quote__portrait > img,
        .quote__portrait > svg {
            margin: auto;
        }

.quote__content {
        width: 100%;
    }

.quote__text,
    .quote__text > * {
        color: var(--color-text-quote-text);
        font-family: var(--font-family-secondary);
        font-size: var(--font-size-32);
        font-style: italic;
        font-weight: var(--font-weight-light);
        line-height: 48px;
    }

.quote__text {
        margin-bottom: var(--spacing-base);
    }

.quote__text > * {
        margin-bottom: var(--spacing-base);
    }

.quote__author-name {
        font-weight: var(--font-weight-bold);
    }

.quote__author-info {
        color: var(--color-text-quote-author-meta);
        list-style: none;
        font-size: var(--font-size-quote-author-meta);
        margin-bottom: 0;
        margin-left: 0;
    }

.quote__author-info > * {
            margin-bottom: 0;
            line-height: var(--size-300);
        }

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

@media only screen and (min-width: 544px) {
    .quote {
        flex-direction: row;
    }

        .quote__portrait {
            flex: 0 0 auto;
            width: 33.33333333333333%;
        }

        .quote__content {
            flex: 0 0 auto;
            width: 66.66666666666666%;
        }
        .quote--3-by-12 .quote__portrait {
            flex: 0 0 auto;
            width: 25%;
        }

        .quote--3-by-12 .quote__content {
            flex: 0 0 auto;
            width: 75%;
        }
        .quote--4-by-12 .quote__portrait {
            flex: 0 0 auto;
            width: 33.33333333333333%;
        }

        .quote--4-by-12 .quote__content {
            flex: 0 0 auto;
            width: 66.66666666666666%;
        }
        .quote--5-by-12 .quote__portrait {
            flex: 0 0 auto;
            width: 41.66666666666667%;
        }

        .quote--5-by-12 .quote__content {
            flex: 0 0 auto;
            width: 58.333333333333336%;
        }
        .quote--6-by-12 .quote__portrait {
            flex: 0 0 auto;
            width: 50%;
        }

        .quote--6-by-12 .quote__content {
            flex: 0 0 auto;
            width: 50%;
        }
        .quote--7-by-12 .quote__portrait {
            flex: 0 0 auto;
            width: 58.333333333333336%;
        }

        .quote--7-by-12 .quote__content {
            flex: 0 0 auto;
            width: 41.66666666666667%;
        }
        .quote--8-by-12 .quote__portrait {
            flex: 0 0 auto;
            width: 66.66666666666666%;
        }

        .quote--8-by-12 .quote__content {
            flex: 0 0 auto;
            width: 33.33333333333333%;
        }
        .quote--9-by-12 .quote__portrait {
            flex: 0 0 auto;
            width: 75%;
        }

        .quote--9-by-12 .quote__content {
            flex: 0 0 auto;
            width: 25%;
        }
        .quote--flip .quote__portrait {
            order: 1;
        }

        .quote--flip .quote__content {
            order: 0;
        }
}

.report-tile {
    position: relative;
    margin-bottom: var(--size-800);
}

.report-tile__container {
        align-items: center;
        background: var(--color-base-primary);
        display: flex;
        flex-direction: column;
        padding: 0 var(--size-400) var(--size-400) var(--size-400);
        position: relative;
    }

.report-tile__container::after {
        background: url(/res/_css/organic/bin/assets/images/Report-Background.png) no-repeat;
        background-size: cover;
        content: ' ';
        display: block;
        height: 100%;
        left: 0;
        opacity: 0.1;
        position: absolute;
        top: 0;
        width: 100%;
        z-index: 0;
    }

.report-tile__body {
        order: 1;
        position: relative;
        z-index: 1;
    }

.report-tile__title {
        color: var(--color-base-white);
    }

.report-tile__content {
        color: var(--color-base-white);
        line-height: var(--size-400);
        margin-bottom: var(--size-200);
    }

.report-tile__media {
        order: 0;
        margin-bottom: var(--size-200);
        margin-top: -140px;
        position: relative;
        flex: 0 0 auto;
        width: 75%;
        z-index: 1;
    }

@media (min-width: 544px) {
    .report-tile {
        display: block;
        margin-bottom: 176px;
        position: relative;
    }

        .report-tile__container {
            background: var(--color-base-primary);
            display: flex;
            flex-direction: row;
            justify-content: flex-end;
            margin-top: 0;
            padding: var(--size-400);
            position: relative;
        }

        .report-tile__container::after {
            background-size: cover;
            content: ' ';
            display: block;
            height: 100%;
            left: 0;
            opacity: 0.1;
            position: absolute;
            top: 0;
            width: 100%;
            z-index: 0;
        }

        .report-tile__body {
            position: relative;
            flex: 0 0 auto;
            width: 50%;
            z-index: 1;
        }

        .report-tile__title {
            color: var(--color-base-white);
        }

        .report-tile__content {
            color: var(--color-base-white);
            line-height: var(--size-400);
            margin-bottom: var(--size-200);
        }

        .report-tile__media {
            left: 0;
            margin: var(--size-600) 0 0 var(--size-800);
            position: absolute;
            top: 0;
            flex: 0 0 auto;
            width: 50%;
        } 
}

.summary-box {
    background-color: var(--color-background-summary-base);
    padding: 32px;
}

.summary-box * {
        color: var(--color-text-summary-box-base);
    }

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

.summary-box a {
        color: var(--color-text-links, rgb(0, 168, 45));
    }

.summary-box__title {
        font-family: var(--font-family-headline);
        font-size: var(--font-size-summary-box-title);
        margin-bottom: var(--spacing-1);
    }

.summary-box--blue {
        background-color: var(--color-background-summary-blue);
    }

.summary-box--blue * {
        color: var(--color-text-summary-box-blue);
    }

.summary-box--cyan {
        background-color: var(--color-background-summary-cyan);
    }

.summary-box--cyan * {
        color: var(--color-text-summary-box-cyan);
    }

.summary-box--green {
        background-color: var(--color-background-summary-green);
    }

.summary-box--green * {
        color: var(--color-text-summary-box-green);
    }

.summary-box--red {
        background-color: var(--color-background-summary-red);
    }

.summary-box--red * {
        color: var(--color-text-summary-box-red);
    }

.summary-box--yellow {
        background-color: var(--color-background-summary-yellow);
    }

.summary-box--yellow * {
        color: var(--color-text-summary-box-yellow);
    }

.summary-box--e-green {
        background-color: var(--color-background-summary-e-green);
    }

.summary-box--e-green * {
        color: var(--color-text-summary-box-e-green);
    }

.summary-box--e-cyan {
        background-color: var(--color-background-summary-e-cyan);
    }

.summary-box--e-cyan * {
        color: var(--color-text-summary-box-e-cyan);
    }

.summary-box--e-sea {
        background-color: var(--color-background-summary-e-sea);
    }

.summary-box--e-sea * {
        color: var(--color-text-summary-box-e-sea);
    }

.summary-box--e-blue {
        background-color: var(--color-background-summary-e-blue);
    }

.summary-box--e-blue * {
        color: var(--color-text-summary-box-e-blue);
    }

.summary-box--e-navy {
        background-color: var(--color-background-summary-e-navy);
    }

.summary-box--e-navy * {
        color: var(--color-text-summary-box-e-navy);
    }

.summary-box--e-violet {
        background-color: var(--color-background-summary-e-violet);
    }

.summary-box--e-violet * {
        color: var(--color-text-summary-box-e-violet);
    }

.summary-box--e-purple {
        background-color: var(--color-background-summary-e-purple);
    }

.summary-box--e-purple * {
        color: var(--color-text-summary-box-e-purple);
    }

.summary-box--e-carrot {
        background-color: var(--color-background-summary-e-carrot);
    }

.summary-box--e-carrot * {
        color: var(--color-text-summary-box-e-carrot);
    }

.summary-box--e-gray {
        background-color: var(--color-background-summary-e-gray);
    }

.summary-box--e-gray * {
        color: var(--color-text-summary-box-e-gray);
    }

table {
    border-collapse: collapse;
    width: 100%;
}

thead th {
    background-color: var(--color-base-gray-1);
    border-right: 1px solid var(--color-base-white);
    border-bottom-width: 0;
    color: var(--color-base-gray-7);
    font-size: var(--font-size-10);
    font-weight: var(--font-weight-regular);
    line-height: var(--spacing-1);
    padding: var(--spacing-1) 1rem;
    text-align: left;
    text-transform: uppercase;
}

tbody th {
    font-weight: var(--font-weight-bold);
}

tbody th,
tbody td {
    border-bottom: 1px solid var(--color-base-gray-1);
    font-size: var(--font-size-16);
    line-height: var(--spacing-2);
    padding: var(--spacing-1) 1rem calc(var(--spacing-1) - var(--size-smallest));
    text-align: left;
}

thead th:last-child {
    border-right: none;
}

thead tr th:first-child {
    border-radius: 4px 0 0 4px;
    text-align: left;
}

thead tr th:last-child {
    border-radius: 0 4px 4px 0;
}

.table__number {
    text-align: right;
}

/**
 * Available column width helpers.  Suggested use is to apply these to 'col' elements
 * which should be inside of a 'colgroup' element.
 * Ex
    <table class="base">
        <colgroup>
            <col class="t10">
            <col class="t20">
            <col class="20">
            <col>
        </colgroup>
        <thead>
            <tr>
                <th>Lorem</th>
                <th>Ipsum</th>
                <th>Dolor</th>
                <th>Sit</th>
            </tr>
        </thead>
        <tbody>
           <tr>
               <th>Sit</th>
               <td>Dolor</td>
               <td class="numerical">03.788</td>
               <td>Lorem</td>
           </tr>
           <tr>
               <td>Dolor</td>
               <td class="numerical">32.210</td>
               <td>Lorem</td>
           </tr>
        </tbody>
    </table>
 */

.t5 { width: 5%; }

.t10 { width: 10%; }

.t12 { width: 12.5%; }

/* 1/8 */

.t15 { width: 15%; }

.t20 { width: 20%; }

.t25 { width: 25%; }

/* 1/4 */

.t30 { width: 30%; }

.t33 { width: 33.333%; }

/* 1/3 */

.t35 { width: 35%; }

.t37 { width: 37.5%; }

/* 3/8 */

.t40 { width: 40%; }

.t45 { width: 45%; }

.t50 { width: 50%; }

/* 1/2 */

.t55 { width: 55%; }

.t60 { width: 60%; }

.t62 { width: 62.5%; }

/* 5/8 */

.t65 { width: 65%; }

.t66 { width: 66.666%; }

/* 2/3 */

.t70 { width: 70%; }

.t75 { width: 75%; }

/* 3/4 */

.t80 { width: 80%; }

.t85 { width: 85%; }

.t87 { width: 87.5%; }

/* 7/8 */

.t90 { width: 90%; }

.t95 { width: 95%; }

.table--va-baseline tbody tr > * {
    vertical-align: baseline;
}

.table--va-bottom tbody tr > * {
    vertical-align: bottom;
}

.table--va-middle tbody tr > * {
    vertical-align: middle;
}

.table--va-top tbody tr > * {
    vertical-align: top;
}

.table--column-1-weight-bold tr > *:nth-child(1) {
        font-weight: var(--font-weight-bold);
    }

.table--column-1-text-left tr > *:nth-child(1) {
        text-align: left;
    }

.table--column-1-text-right tr > *:nth-child(1) {
        text-align: right;
    }

.table--column-1-text-center tr > *:nth-child(1) {
        text-align: center;
    }

.table--column-1-va-bottom tr > *:nth-child(1) {
        vertical-align: bottom;
    }

.table--column-1-va-middle tr > *:nth-child(1) {
        vertical-align: middle;
    }

.table--column-1-va-top tr > *:nth-child(1) {
        vertical-align: top;
    }

.table--column-2-weight-bold tr > *:nth-child(2) {
        font-weight: var(--font-weight-bold);
    }

.table--column-2-text-left tr > *:nth-child(2) {
        text-align: left;
    }

.table--column-2-text-right tr > *:nth-child(2) {
        text-align: right;
    }

.table--column-2-text-center tr > *:nth-child(2) {
        text-align: center;
    }

.table--column-2-va-bottom tr > *:nth-child(2) {
        vertical-align: bottom;
    }

.table--column-2-va-middle tr > *:nth-child(2) {
        vertical-align: middle;
    }

.table--column-2-va-top tr > *:nth-child(2) {
        vertical-align: top;
    }

.table--column-3-weight-bold tr > *:nth-child(3) {
        font-weight: var(--font-weight-bold);
    }

.table--column-3-text-left tr > *:nth-child(3) {
        text-align: left;
    }

.table--column-3-text-right tr > *:nth-child(3) {
        text-align: right;
    }

.table--column-3-text-center tr > *:nth-child(3) {
        text-align: center;
    }

.table--column-3-va-bottom tr > *:nth-child(3) {
        vertical-align: bottom;
    }

.table--column-3-va-middle tr > *:nth-child(3) {
        vertical-align: middle;
    }

.table--column-3-va-top tr > *:nth-child(3) {
        vertical-align: top;
    }

.table--column-4-weight-bold tr > *:nth-child(4) {
        font-weight: var(--font-weight-bold);
    }

.table--column-4-text-left tr > *:nth-child(4) {
        text-align: left;
    }

.table--column-4-text-right tr > *:nth-child(4) {
        text-align: right;
    }

.table--column-4-text-center tr > *:nth-child(4) {
        text-align: center;
    }

.table--column-4-va-bottom tr > *:nth-child(4) {
        vertical-align: bottom;
    }

.table--column-4-va-middle tr > *:nth-child(4) {
        vertical-align: middle;
    }

.table--column-4-va-top tr > *:nth-child(4) {
        vertical-align: top;
    }

.table--column-5-weight-bold tr > *:nth-child(5) {
        font-weight: var(--font-weight-bold);
    }

.table--column-5-text-left tr > *:nth-child(5) {
        text-align: left;
    }

.table--column-5-text-right tr > *:nth-child(5) {
        text-align: right;
    }

.table--column-5-text-center tr > *:nth-child(5) {
        text-align: center;
    }

.table--column-5-va-bottom tr > *:nth-child(5) {
        vertical-align: bottom;
    }

.table--column-5-va-middle tr > *:nth-child(5) {
        vertical-align: middle;
    }

.table--column-5-va-top tr > *:nth-child(5) {
        vertical-align: top;
    }

.table--column-6-weight-bold tr > *:nth-child(6) {
        font-weight: var(--font-weight-bold);
    }

.table--column-6-text-left tr > *:nth-child(6) {
        text-align: left;
    }

.table--column-6-text-right tr > *:nth-child(6) {
        text-align: right;
    }

.table--column-6-text-center tr > *:nth-child(6) {
        text-align: center;
    }

.table--column-6-va-bottom tr > *:nth-child(6) {
        vertical-align: bottom;
    }

.table--column-6-va-middle tr > *:nth-child(6) {
        vertical-align: middle;
    }

.table--column-6-va-top tr > *:nth-child(6) {
        vertical-align: top;
    }

.table--column-7-weight-bold tr > *:nth-child(7) {
        font-weight: var(--font-weight-bold);
    }

.table--column-7-text-left tr > *:nth-child(7) {
        text-align: left;
    }

.table--column-7-text-right tr > *:nth-child(7) {
        text-align: right;
    }

.table--column-7-text-center tr > *:nth-child(7) {
        text-align: center;
    }

.table--column-7-va-bottom tr > *:nth-child(7) {
        vertical-align: bottom;
    }

.table--column-7-va-middle tr > *:nth-child(7) {
        vertical-align: middle;
    }

.table--column-7-va-top tr > *:nth-child(7) {
        vertical-align: top;
    }

.table--column-8-weight-bold tr > *:nth-child(8) {
        font-weight: var(--font-weight-bold);
    }

.table--column-8-text-left tr > *:nth-child(8) {
        text-align: left;
    }

.table--column-8-text-right tr > *:nth-child(8) {
        text-align: right;
    }

.table--column-8-text-center tr > *:nth-child(8) {
        text-align: center;
    }

.table--column-8-va-bottom tr > *:nth-child(8) {
        vertical-align: bottom;
    }

.table--column-8-va-middle tr > *:nth-child(8) {
        vertical-align: middle;
    }

.table--column-8-va-top tr > *:nth-child(8) {
        vertical-align: top;
    }

.table--column-9-weight-bold tr > *:nth-child(9) {
        font-weight: var(--font-weight-bold);
    }

.table--column-9-text-left tr > *:nth-child(9) {
        text-align: left;
    }

.table--column-9-text-right tr > *:nth-child(9) {
        text-align: right;
    }

.table--column-9-text-center tr > *:nth-child(9) {
        text-align: center;
    }

.table--column-9-va-bottom tr > *:nth-child(9) {
        vertical-align: bottom;
    }

.table--column-9-va-middle tr > *:nth-child(9) {
        vertical-align: middle;
    }

.table--column-9-va-top tr > *:nth-child(9) {
        vertical-align: top;
    }

.table--column-10-weight-bold tr > *:nth-child(10) {
        font-weight: var(--font-weight-bold);
    }

.table--column-10-text-left tr > *:nth-child(10) {
        text-align: left;
    }

.table--column-10-text-right tr > *:nth-child(10) {
        text-align: right;
    }

.table--column-10-text-center tr > *:nth-child(10) {
        text-align: center;
    }

.table--column-10-va-bottom tr > *:nth-child(10) {
        vertical-align: bottom;
    }

.table--column-10-va-middle tr > *:nth-child(10) {
        vertical-align: middle;
    }

.table--column-10-va-top tr > *:nth-child(10) {
        vertical-align: top;
    }

.table--column-11-weight-bold tr > *:nth-child(11) {
        font-weight: var(--font-weight-bold);
    }

.table--column-11-text-left tr > *:nth-child(11) {
        text-align: left;
    }

.table--column-11-text-right tr > *:nth-child(11) {
        text-align: right;
    }

.table--column-11-text-center tr > *:nth-child(11) {
        text-align: center;
    }

.table--column-11-va-bottom tr > *:nth-child(11) {
        vertical-align: bottom;
    }

.table--column-11-va-middle tr > *:nth-child(11) {
        vertical-align: middle;
    }

.table--column-11-va-top tr > *:nth-child(11) {
        vertical-align: top;
    }

.table--column-12-weight-bold tr > *:nth-child(12) {
        font-weight: var(--font-weight-bold);
    }

.table--column-12-text-left tr > *:nth-child(12) {
        text-align: left;
    }

.table--column-12-text-right tr > *:nth-child(12) {
        text-align: right;
    }

.table--column-12-text-center tr > *:nth-child(12) {
        text-align: center;
    }

.table--column-12-va-bottom tr > *:nth-child(12) {
        vertical-align: bottom;
    }

.table--column-12-va-middle tr > *:nth-child(12) {
        vertical-align: middle;
    }

.table--column-12-va-top tr > *:nth-child(12) {
        vertical-align: top;
    }

.tag {
    background-color: var(--color-base-gray-9);
    border-radius: var(--size-border-radius-button);
    color: var(--color-base-white);
    display: inline-flex;
    font-size: var(--font-size-tag);
    justify-content: center;
    line-height: var(--spacing-base);
    margin-bottom: var(--spacing-1);
    min-width: 5rem;
    padding: 0 calc(1rem / 2);
    text-transform: uppercase;
}

.tag--primary {
    background-color: var(--color-base-primary);
}

.tag--secondary {
    background-color: var(--color-base-secondary);
}

.tag--alert {
    background-color: var(--color-background-button-danger-base);
}

.tile {
    background-color: var(--interface-common-base-01);
    padding: var(--spacing-tile-vertical) 0;
}

.tile--short {
    padding: var(--spacing-tile-short-vertical) 0;
}

.tile--short > *:first-child > *:first-child {
    margin-bottom: 0;
    margin-top: 0;
}

.tile--primary,
.tile--primary-mobile {
    background-color: var(--interface-brand-primary-05);
}

.tile--primary--02,
.tile--primary--02-mobile {
    background-color: var(--interface-brand-primary-03);
    color: var(--color-text-primary-default);
}

.tile--secondary,
.tile--secondary-mobile {
    background-color: var(--color-background-tile-secondary);
}

.tile--gray,
.tile--gray-mobile {
    background-color: var(--interface-common-base-02);
}

.tile--darkgray,
.tile--darkgray--1,
.tile--darkgray-mobile,
.tile--darkgray--1-mobile {
    background-color: var(--palette-neutral-1300);
    color: var(--color-text-primary-default);
}

.tile--darkgray--2,
.tile--darkgray--2-mobile {
    background-color: var(--palette-neutral-1400);
}

.tile--darkgray--3,
.tile--darkgray--3-mobile {
    background-color: var(--palette-neutral-1500);
}

.tile--darkgray--4,
.tile--darkgray--4-mobile {
    background-color: var(--palette-neutral-1600);
}

.tile--cyan,
.tile--cyan-mobile {
    background-color: hsl(var(--color-hue-cyan) 20% 50%);
    color: var(--color-base-white);
}

.tile-grid {
    display: grid;
    grid-template-columns: 100%;
    padding: 0;
}

.tile--angle-top-left {
    -webkit-clip-path: polygon(0 calc(0% + 8vw), 100% 0, 100% 100%, 0 100%);
            clip-path: polygon(0 calc(0% + 8vw), 100% 0, 100% 100%, 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.tile--angle-top-right {
    -webkit-clip-path: polygon(0 0, 100% calc(0% + 8vw), 100% 100%, 0 100%);
            clip-path: polygon(0 0, 100% calc(0% + 8vw), 100% 100%, 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.tile--angle-bottom-left {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 8vw));
            clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 8vw));
    -webkit-transform: scaleZ(1.1);
}

.tile--angle-bottom-right {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8vw), 0 100%);
            clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8vw), 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.tile--angle-both-right-left {
    -webkit-clip-path: polygon(0 0, 100% calc(0% + 8vw), 100% 100%, 0 calc(100% - 8vw));
            clip-path: polygon(0 0, 100% calc(0% + 8vw), 100% 100%, 0 calc(100% - 8vw));
    -webkit-transform: scaleZ(1.1);
}

.tile--angle-both-right-right {
    -webkit-clip-path: polygon(0 0, 100% calc(0% + 8vw), 100% calc(100% - 8vw), 0 100%);
            clip-path: polygon(0 0, 100% calc(0% + 8vw), 100% calc(100% - 8vw), 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.tile--angle-both-left-right {
    -webkit-clip-path: polygon(0 calc(0% + 8vw), 100% 0, 100% calc(100% - 8vw), 0 100%);
            clip-path: polygon(0 calc(0% + 8vw), 100% 0, 100% calc(100% - 8vw), 0 100%);
    -webkit-transform: scaleZ(1.1);
}

.tile--angle-both-left-left {
    -webkit-clip-path: polygon(0 calc(0% + 8vw), 100% 0, 100% 100%, 0 calc(100% - 8vw));
            clip-path: polygon(0 calc(0% + 8vw), 100% 0, 100% 100%, 0 calc(100% - 8vw));
    -webkit-transform: scaleZ(1.1);
}

@media only screen and (min-width: 544px) {
    .tile--primary-tablet {
        background-color: var(--interface-brand-primary-05);
        color: var(--color-text-primary-default);
    }

    .tile--primary--02-tablet {
        background-color: var(--interface-brand-primary-03);
        color: var(--color-text-primary-default);
    }

    .tile--secondary-tablet {
        background-color: var(--color-background-tile-secondary);
    }

    .tile--gray-tablet {
        background-color: var(--interface-common-base-02);
    }

    .tile--darkgray-tablet,
    .tile--darkgray--1-tablet {
        background-color: var(--palette-neutral-1300);
        color: var(--color-text-primary-default);
    }

    .tile--darkgray--2-tablet {
        background-color: var(--palette-neutral-1400);
    }

    .tile--darkgray--3-tablet {
        background-color: var(--palette-neutral-1500);
    }

    .tile--darkgray--4-tablet {
        background-color: var(--palette-neutral-1600);
    }

    .tile--cyan-tablet {
        background-color: hsl(var(--color-hue-cyan) 20% 50%);
        color: var(--color-base-white);
    }

    .tile-grid {
        grid-template-columns: 50% 50%;
    }

    .tile-grid > *:nth-child(odd) .section-wrapper {
        margin: 0 0 0 auto;
    }

    .tile-grid > *:nth-child(even) .section-wrapper {
        margin: 0 auto 0 0;
    }
}

@media only screen and (min-width: 1080px) {
    .tile--primary-desktop {
        background-color: var(--interface-brand-primary-05);
        color: var(--color-text-primary-default);
    }

    .tile--primary--02-desktop {
        background-color: var(--interface-brand-primary-03);
        color: var(--color-text-primary-default);
    }

    .tile--secondary-desktop {
        background-color: var(--color-background-tile-secondary);
    }

    .tile--gray-desktop {
        background-color: var(--interface-common-base-02);
    }

    .tile--darkgray-desktop,
    .tile--darkgray--1-desktop {
        background-color: var(--palette-neutral-1300);
        color: var(--color-text-primary-default);
    }

    .tile--darkgray--2-desktop {
        background-color: var(--palette-neutral-1400);
    }

    .tile--darkgray--3-desktop {
        background-color: var(--palette-neutral-1500);
    }

    .tile--darkgray--4-desktop {
        background-color: var(--palette-neutral-1600);
    }

    .tile--cyan-desktop {
        background-color: hsl(var(--color-hue-cyan) 20% 50%);
        color: var(--color-base-white);
    }

    .tile-grid .section-wrapper {
        width: 540px;
    }
}

.tile--primary a.button--line,
.tile--primary .button--line {
    border-color: var(--color-border-button-line-base);
    color: var(--color-text-button-text-base);
}

@media only screen and (max-width: 543px) {
    .tile--primary-mobile a.button--line,
    .tile--primary-mobile .button--line {
        border-color: var(--color-border-button-line-base);
        color: var(--color-text-button-text-base);
    }
}

@media only screen and (min-width: 544px) {
    .tile--primary-tablet a.button--line,
    .tile--primary-tablet .button--line {
        border-color: var(--color-border-button-line-base);
        color: var(--color-text-button-text-base);
    }
}

@media only screen and (min-width: 1080px) {
    .tile--primary-desktop a.button--line,
    .tile--primary-desktop .button--line {
        border-color: var(--color-border-button-line-base);
        color: var(--color-text-button-text-base);
    }
}

.tile--primary .callout {
    color: var(--color-text-default);
}

.tile--primary .callout--success {
    color: var(--color-base-green-10);
}

.tile--primary .callout--info {
    color: var(--color-base-blue-10);
}

.tile--primary .callout--warning {
    color: var(--color-base-yellow-10);
}

.tile--primary .callout--error {
    color: var(--color-base-red-10);
}

.tile--primary .card a:not(.button) {
    color: var(--color-text-links);
}

.tile--primary .card .link::after,
.tile--primary .card .link::before {
    border-color: var(--color-text-links);
}

.tile--primary .card .category {
    color: var(--color-text-category);
}

.tile--primary .card p,
.tile--primary .card li {
    color: var(--color-text-default);
}

.tile--primary .card-title,
.tile--primary .card__title-1,
.tile--primary .card h3 {
    color: var(--color-text-default);
}

.tile--primary .display-table tbody th,
.tile--primary-mobile .display-table tbody th,
.tile--primary-tablet .display-table tbody th,
.tile--primary-desktop .display-table tbody th,
.tile--primary .display-table tbody td,
.tile--primary-mobile .display-table tbody td,
.tile--primary-tablet .display-table tbody td,
.tile--primary-desktop .display-table tbody td {
    color: var(--color-base-gray-7);
}

@media only screen and (max-width: 543px) {
    .tile--primary-mobile .display-table tbody th,
    .tile--primary-mobile .display-table tbody td {
        color: var(--color-base-gray-7);
    }
}

@media only screen and (min-width: 544px) {
    .tile--primary-tablet .display-table tbody th,
    .tile--primary-tablet .display-table tbody td {
        color: var(--color-base-gray-7);
    }
}

@media only screen and (min-width: 1080px) {
    .tile--primary-desktop .display-table tbody th,
    .tile--primary-desktop .display-table tbody td {
        color: var(--color-base-gray-7);
    }
}

/**
 * Style overrides for .tile--primary
 */

.tile--primary h1,
.tile--primary .h1 {
    color: var(--color-text-primary-headline-1);
}

.tile--primary h2,
.tile--primary .h2 {
    color: var(--color-text-primary-subhead-1);
}

.tile--primary h3,
.tile--primary .h3 {
    color: var(--color-text-primary-highlights-1);
}

.tile--primary h4,
.tile--primary .h4,
.tile--primary h5,
.tile--primary .h5,
.tile--primary h6,
.tile--primary .h6 {
    color: var(--color-text-primary-default);
}

.tile--primary p,
.tile--primary li {
    color: var(--color-text-primary-default);
}

.tile--primary .category {
    color: var(--color-text-primary-category);
}

@media only screen and (max-width: 543px) {
    .tile--primary-mobile h1,
    .tile--primary-mobile .h1 {
        color: var(--color-text-primary-headline-1);
    }

    .tile--primary-mobile h2,
    .tile--primary-mobile .h2 {
        color: var(--color-text-primary-subhead-1);
    }

    .tile--primary-mobile h3,
    .tile--primary-mobile .h3 {
        color: var(--color-text-primary-highlights-1);
    }

    .tile--primary-mobile p,
    .tile--primary-mobile li {
        color: var(--color-text-primary-default);
    }

    .tile--primary-mobile .category {
        color: var(--color-text-category);
    }
}

@media only screen and (min-width: 544px) {
    .tile--primary-tablet h1,
    .tile--primary-tablet .h1 {
        color: var(--color-text-primary-headline-1);
    }

    .tile--primary-tablet h2,
    .tile--primary-tablet .h2 {
        color: var(--color-text-primary-subhead-1);
    }

    .tile--primary-tablet h3,
    .tile--primary-tablet .h3 {
        color: var(--color-text-primary-highlights-1);
    }

    .tile--primary-tablet p,
    .tile--primary-tablet li {
        color: var(--color-text-primary-default);
    }

    .tile--primary-tablet .category {
        color: var(--color-text-category);
    }
}

@media only screen and (min-width: 1080px) {
    .tile--primary-desktop h1,
    .tile--primary-desktop .h1 {
        color: var(--color-text-primary-headline-1);
    }

    .tile--primary-desktop h2,
    .tile--primary-desktop .h2 {
        color: var(--color-text-primary-subhead-1);
    }

    .tile--primary-desktop h3,
    .tile--primary-desktop .h3 {
        color: var(--color-text-primary-highlights-1);
    }

    .tile--primary-desktop p,
    .tile--primary-desktop li {
        color: var(--color-text-primary-default);
    }

    .tile--primary-desktop .category {
        color: var(--color-text-category);
    }
}

.tile--primary a:not(.button),
.tile--primary .link::after,
.tile--primary .link::before {
    border-color: var(--color-base-cyan-2);
    color: var(--color-base-cyan-2);
}

@media only screen and (max-width: 543px) {
    .tile--primary-mobile a:not(.button),
    .tile--primary-mobile .link::after,
    .tile--primary-mobile .link::before {
        border-color: var(--color-base-cyan-2);
        color: var(--color-base-cyan-2);
    }
}

@media only screen and (min-width: 544px) {
    .tile--primary-tablet a:not(.button),
    .tile--primary-tablet .link::after,
    .tile--primary-tablet .link::before {
        border-color: var(--color-base-cyan-2);
        color: var(--color-base-cyan-2);
    }
}

@media only screen and (min-width: 1080px) {
    .tile--primary-desktop a:not(.button),
    .tile--primary-desktop .link::after,
    .tile--primary-desktop .link::before {
        border-color: var(--color-base-cyan-2);
        color: var(--color-base-cyan-2);
    }
}

.tile--primary table tbody th,
.tile--primary table tbody td {
    color: var(--color-base-white);
}

@media only screen and (max-width: 543px) {
    .tile--primary-mobile table tbody th,
    .tile--primary-mobile table tbody td {
        color: var(--color-base-white);
    }
}

@media only screen and (min-width: 544px) {
    .tile--primary-tablet table tbody th,
    .tile--primary-tablet table tbody td {
        color: var(--color-base-white);
    }
}

@media only screen and (min-width: 1080px) {
    .tile--primary-desktop table tbody th,
    .tile--primary-desktop table tbody td {
        color: var(--color-base-white);
    }
}

.tile--darkgray .card h1,
.tile--darkgray .card .h1,
.tile--darkgray .card h2,
.tile--darkgray .card .h2,
.tile--darkgray .card h3,
.tile--darkgray .card .h3,
.tile--darkgray .card h4,
.tile--darkgray .card .h4,
.tile--darkgray .card h5,
.tile--darkgray .card .h5,
.tile--darkgray .card h6,
.tile--darkgray .card .h6,
.tile--darkgray .card > p {
    color: var(--color-text-default);
}

.tile--darkgray .card a,
.tile--darkgray .card a:not(.button),
.tile--darkgray .card .link::after,
.tile--darkgray .card .link::before {
    color: var(--color-text-links);
}

.tile--darkgray .callout {
    color: var(--color-text-default);
}

.tile--darkgray .callout--success {
    color: var(--color-base-green-10);
}

.tile--darkgray .callout--info {
    color: var(--color-base-blue-10);
}

.tile--darkgray .callout--warning {
    color: var(--color-base-yellow-10);
}

.tile--darkgray .callout--error {
    color: var(--color-base-red-10);
}

.tile--darkgray .data-table--zebra tbody tr:nth-child(2n) th,
.tile--darkgray .data-table--zebra tbody tr:nth-child(2n) td {
    background-color: var(--color-base-gray-8);
}

@media only screen and (max-width: 543px) {
    .tile--darkgray-mobile .data-table--zebra tbody tr:nth-child(2n) th,
    .tile--darkgray-mobile .data-table--zebra tbody tr:nth-child(2n) td {
        background-color: var(--color-base-gray-8);
    }
}

@media only screen and (min-width: 544px) {
    .tile--darkgray-tablet .data-table--zebra tbody tr:nth-child(2n) th,
    .tile--darkgray-tablet .data-table--zebra tbody tr:nth-child(2n) td {
        background-color: var(--color-base-gray-8);
    }
}

@media only screen and (min-width: 1080px) {
    .tile--darkgray-desktop .data-table--zebra tbody tr:nth-child(2n) th,
    .tile--darkgray-desktop .data-table--zebra tbody tr:nth-child(2n) td {
        background-color: var(--color-base-gray-8);
    }
}

.tile--darkgray .display-table {
    background-color: var(--color-background-tile-darkgray);
    border: 1px solid var(--color-base-gray-6);
}

.tile--darkgray .display-table thead th,
.tile--darkgray .display-table thead td {
    background-color: var(--color-background-tile-darkgray);
}

.tile--darkgray .display-table--border th {
    border-bottom: 1px solid var(--color-base-gray-6);
}

.tile--darkgray .display-table--border th, 
.tile--darkgray .display-table--border td {
    border-color: var(--color-base-gray-6);
    border-right: 1px solid var(--color-base-gray-6);
}

.tile--darkgray .display-table tbody th,
.tile--darkgray .display-table tbody td {
    color: var(--color-text-primary-default);
}

@media only screen and (max-width: 543px) {
    .tile--darkgray-mobile .display-table {
        background-color: var(--color-background-tile-darkgray);
        border: 1px solid var(--color-base-gray-6);
    }

    .tile--darkgray-mobile .display-table thead th,
    .tile--darkgray-mobile .display-table thead td {
        background-color: var(--color-background-tile-darkgray);
    }

    .tile--darkgray-mobile .display-table--border th {
        border-bottom: 1px solid var(--color-base-gray-6);
    }

    .tile--darkgray-mobile .display-table--border th, 
    .tile--darkgray-mobile .display-table--border td {
        border-color: var(--color-base-gray-6);
        border-right: 1px solid var(--color-base-gray-6);
    }

    .tile--darkgray-mobile .display-table tbody th,
    .tile--darkgray-mobile .display-table tbody td {
        color: var(--color-text-primary-default);
    }
}

@media only screen and (min-width: 544px) {
    .tile--darkgray-tablet .display-table {
        background-color: var(--color-background-tile-darkgray);
        border: 1px solid var(--color-base-gray-6);
    }

    .tile--darkgray-tablet .display-table thead th,
    .tile--darkgray-tablet .display-table thead td {
        background-color: var(--color-background-tile-darkgray);
    }

    .tile--darkgray-tablet .display-table--border th {
        border-bottom: 1px solid var(--color-base-gray-6);
    }

    .tile--darkgray-tablet .display-table--border th, 
    .tile--darkgray-tablet .display-table--border td {
        border-color: var(--color-base-gray-6);
        border-right: 1px solid var(--color-base-gray-6);
    }

    .tile--darkgray-tablet .display-table tbody th,
    .tile--darkgray-tablet .display-table tbody td {
        color: var(--color-text-primary-default);
    }
}

@media only screen and (min-width: 1080px) {
    .tile--darkgray-desktop .display-table {
        background-color: var(--color-background-tile-darkgray);
        border: 1px solid var(--color-base-gray-6);
    }

    .tile--darkgray-desktop .display-table thead th,
    .tile--darkgray-desktop .display-table thead td {
        background-color: var(--color-background-tile-darkgray);
    }

    .tile--darkgray-desktop .display-table--border th {
        border-bottom: 1px solid var(--color-base-gray-6);
    }

    .tile--darkgray-desktop .display-table--border th, 
    .tile--darkgray-desktop .display-table--border td {
        border-color: var(--color-base-gray-6);
        border-right: 1px solid var(--color-base-gray-6);
    }

    .tile--darkgray-desktop .display-table tbody th,
    .tile--darkgray-desktop .display-table tbody td {
        color: var(--color-text-primary-default);
    }
}

/**
 * Style overrides for .tile--darkgray
 */

.tile--darkgray h1,
.tile--darkgray .h1 {
    color: var(--color-text-primary-headline-1);
}

.tile--darkgray h2,
.tile--darkgray .h2 {
    color: var(--color-text-primary-subhead-1);
}

.tile--darkgray h3,
.tile--darkgray .h3 {
    color: var(--color-text-primary-highlights-1);
}

.tile--darkgray h4,
.tile--darkgray .h4,
.tile--darkgray h5,
.tile--darkgray .h5,
.tile--darkgray h6,
.tile--darkgray .h6,
.tile--darkgray p,
.tile--darkgray li {
    color: var(--color-text-primary-default);
}

@media only screen and (max-width: 543px) {
    .tile--darkgray-mobile h1,
    .tile--darkgray-mobile .h1 {
        color: var(--color-text-primary-headline-1);
    }

    .tile--darkgray-mobile h2,
    .tile--darkgray-mobile .h2 {
        color: var(--color-text-primary-subhead-1);
    }

    .tile--darkgray-mobile h3,
    .tile--darkgray-mobile .h3 {
        color: var(--color-text-primary-highlights-1);
    }

    .tile--darkgray-mobile p,
    .tile--darkgray-mobile li {
        color: var(--color-text-primary-default);
    }
}

@media only screen and (min-width: 544px) {
    .tile--darkgray-tablet h1,
    .tile--darkgray-tablet .h1 {
        color: var(--color-text-primary-headline-1);
    }

    .tile--darkgray-tablet h2,
    .tile--darkgray-tablet .h2 {
        color: var(--color-text-primary-subhead-1);
    }

    .tile--darkgray-tablet h3,
    .tile--darkgray-tablet .h3 {
        color: var(--color-text-primary-highlights-1);
    }

    .tile--darkgray-tablet p,
    .tile--darkgray-tablet li {
        color: var(--color-text-primary-default);
    }
}

@media only screen and (min-width: 1080px) {
    .tile--darkgray-desktop h1,
    .tile--darkgray-desktop .h1 {
        color: var(--color-text-primary-headline-1);
    }

    .tile--darkgray-desktop h2,
    .tile--darkgray-desktop .h2 {
        color: var(--color-text-primary-subhead-1);
    }

    .tile--darkgray-desktop h3,
    .tile--darkgray-desktop .h3 {
        color: var(--color-text-primary-highlights-1);
    }

    .tile--darkgray-desktop p,
    .tile--darkgray-desktop li {
        color: var(--color-text-primary-default);
    }
}

.tile--darkgray a:not(.button),
.tile--darkgray .link::after,
.tile--darkgray .link::before {
    border-color: var(--color-text-dark-links);
    color: var(--color-text-dark-links);
}

@media only screen and (max-width: 543px) {
    .tile--darkgray-mobile a:not(.button),
    .tile--darkgray-mobile .link::after,
    .tile--darkgray-mobile .link::before {
        border-color: var(--color-text-dark-links);
        color: var(--color-text-dark-links);
    }
}

@media only screen and (min-width: 544px) {
    .tile--darkgray-tablet a:not(.button),
    .tile--darkgray-tablet .link::after,
    .tile--darkgray-tablet .link::before {
        border-color: var(--color-text-dark-links);
        color: var(--color-text-dark-links);
    }
}

@media only screen and (min-width: 1080px) {
    .tile--darkgray-desktop a:not(.button),
    .tile--darkgray-desktop .link::after,
    .tile--darkgray-desktop .link::before {
        border-color: var(--color-text-dark-links);
        color: var(--color-text-dark-links);
    }
}

.tile--darkgray table th {
    color: var(--color-base-white);
    background-color: var(--color-base-gray-8);
    border-right: 1px solid var(--color-background-tile-darkgray);
}

.tile--darkgray table th:last-child {
    border-right: 0;
}

.tile--darkgray table tbody th,
.tile--darkgray table tbody td {
    border-bottom: 1px solid var(--color-base-gray-6);
    color: var(--color-base-white);
}

@media only screen and (max-width: 543px) {
    .tile--darkgray-mobile table th {
        color: var(--color-base-white);
        background-color: var(--color-base-gray-8);
        border-right: 1px solid var(--color-background-tile-darkgray);
    }

    .tile--darkgray-mobile table th:last-child {
        border-right: 0;
    }

    .tile--darkgray-mobile table tbody th,
    .tile--darkgray-mobile table tbody td {
        border-bottom: 1px solid var(--color-base-gray-6);
        color: var(--color-base-white);
    }
}

@media only screen and (min-width: 544px) {
    .tile--darkgray-tablet table th {
        color: var(--color-base-white);
        background-color: var(--color-base-gray-8);
        border-right: 1px solid var(--color-background-tile-darkgray);
    }

    .tile--darkgray-tablet table th:last-child {
        border-right: 0;
    }

    .tile--darkgray-tablet table tbody th,
    .tile--darkgray-tablet table tbody td {
        border-bottom: 1px solid var(--color-base-gray-6);
        color: var(--color-base-white);
    }
}

@media only screen and (min-width: 1080px) {
    .tile--darkgray-desktop table th {
        color: var(--color-base-white);
        background-color: var(--color-base-gray-8);
        border-right: 1px solid var(--color-background-tile-darkgray);
    }

    .tile--darkgray-desktop table th:last-child {
        border-right: 0;
    }

    .tile--darkgray-desktop table tbody th,
    .tile--darkgray-desktop table tbody td {
        border-bottom: 1px solid var(--color-base-gray-6);
        color: var(--color-base-white);
    }
}

.tile--gray .card--circle {
    background-color: var(--color-base-white);
}

@media only screen and (max-width: 543px) {
    .tile--gray-mobile .card--circle {
        background-color: var(--color-base-white);
    }
}

@media only screen and (min-width: 544px) {
    .tile--gray-tablet .card--circle {
        background-color: var(--color-base-white);
    }
}

@media only screen and (min-width: 1080px) {
    .tile--gray-desktop .card--circle {
        background-color: var(--color-base-white);
    }
}

.tile--gray .data-table--zebra tbody tr:nth-child(2n) th,
.tile--gray .data-table--zebra tbody tr:nth-child(2n) td {
    background-color: var(--color-base-white);
}

@media only screen and (max-width: 543px) {
    .tile--gray-mobile .data-table--zebra tbody tr:nth-child(2n) th,
    .tile--gray-mobile .data-table--zebra tbody tr:nth-child(2n) td {
        background-color: var(--color-base-white);
    }

}

@media only screen and (min-width: 544px) {
    .tile--gray-tablet .data-table--zebra tbody tr:nth-child(2n) th,
    .tile--gray-tablet .data-table--zebra tbody tr:nth-child(2n) td {
        background-color: var(--color-base-white);
    }

}

@media only screen and (min-width: 1080px) {
    .tile--gray-desktop .data-table--zebra tbody tr:nth-child(2n) th,
    .tile--gray-desktop .data-table--zebra tbody tr:nth-child(2n) td {
        background-color: var(--color-base-white);
    }

}

/**
 * Style overrides for .tile--gray
 */

.tile--gray h1,
.tile--gray .h1 {
    color: var(--color-text-headline-2);
}

.tile--gray h2,
.tile--gray .h2 {
    color: var(--color-text-subhead-1);
}

.tile--gray h3,
.tile--gray .h3 {
    color: var(--color-text-default);
}

.tile--gray .highlight {
    color: var(--color-text-highlights-1);
}

.tile--gray .subhead--3 {
    color: var(--color-text-subhead-3);
}

.tile--gray .category {
    color: var(--color-text-category);
}

.tile--gray p,
.tile--gray li {
    color: var(--color-text-default);
}

@media only screen and (max-width: 543px) {
    .tile--gray-mobile h1,
    .tile--gray-mobile .h1 {
        color: var(--color-text-headline-2);
    }
     
    .tile--gray-mobile h2,
    .tile--gray-mobile .h2 {
        color: var(--color-text-subhead-1);
    }
     
    .tile--gray-mobile h3,
    .tile--gray-mobile .h3,
    .tile--gray-mobile .highlight {
        color: var(--color-text-highlights-1);
    }

    .tile--gray-mobile .subhead--3 {
        color: var(--color-text-subhead-3);
    }

    .tile--gray-mobile .category {
        color: var(--color-text-category);
    }
     
    .tile--gray-mobile p,
    .tile--gray-mobile li {
        color: var(--color-text-default);
    }

}

@media only screen and (min-width: 544px) {
    .tile--gray-tablet h1,
    .tile--gray-tablet .h1 {
        color: var(--color-text-headline-2);
    }
    
    .tile--gray-tablet h2,
    .tile--gray-tablet .h2 {
        color: var(--color-text-subhead-1);
    }
    .tile--gray-tablet p,
    .tile--gray-tablet li {
        color: var(--color-text-default);
    }

    .tile--gray-tablet .category {
        color: var(--color-text-category);
    }

    .tile--gray-tablet h3,
    .tile--gray-tablet .h3,
    .tile--gray-tablet .highlight {
        color: var(--color-text-highlights-1);
    }

    .tile--gray-tablet .subhead--3 {
        color: var(--color-text-subhead-3);
    }
}

@media only screen and (min-width: 1080px) {
    .tile--gray-desktop h1,
    .tile--gray-desktop .h1 {
        color: var(--color-text-headline-2);
    }
    
    .tile--gray-desktop h2,
    .tile--gray-desktop .h2 {
        color: var(--color-text-subhead-1);
    }

    .tile--gray-desktop p,
    .tile--gray-desktop li {
        color: var(--color-text-default);
    }
    .tile--gray-desktop h3,
    .tile--gray-desktop .h3,
    .tile--gray-desktop .highlight {
        color: var(--color-text-highlights-1);
    }

    .tile--gray-desktop .subhead--3 {
        color: var(--color-text-subhead-3);
    }

    .tile--gray-desktop .category {
        color: var(--color-text-category);
    }
}

.tile--gray thead th {
    background-color: var(--color-base-white);
    border-right-color: var(--color-base-gray-1);
    color: var(--color-base-gray-8);
    font-weight: var(--font-weight-regular);
}

.tile--gray tbody th,
.tile--gray tbody td {
    border-bottom-color: var(--color-base-gray-2);
    color: var(--color-base-gray-7);
}

@media only screen and (max-width: 543px) {
    .tile--gray-mobile thead th {
        background-color: var(--color-base-white);
        border-right-color: var(--color-base-gray-1);
        color: var(--color-base-gray-8);
        font-weight: var(--font-weight-regular);
    }
}

@media only screen and (min-width: 544px) {
    .tile--gray-tablet thead th {
        background-color: var(--color-base-white);
        border-right-color: var(--color-base-gray-1);
        color: var(--color-base-gray-8);
        font-weight: var(--font-weight-regular);
    }
}

@media only screen and (min-width: 1080px) {
    .tile--gray-desktop thead th {
        background-color: var(--color-base-white);
        border-right-color: var(--color-base-gray-1);
        color: var(--color-base-gray-8);
        font-weight: var(--font-weight-regular);
    }
}

.tile--cyan .card * {
    color: var(--color-text-default);
}

.tile--cyan .card-title,
.tile--cyan .card__title-1,
.tile--cyan .card h3 {
    color: var(--color-text-default);
}

.tile--cyan .card a:not(.button) {
    color: var(--color-text-links);
}

.tile--cyan .card .link::after,
.tile--cyan .card .link::before {
    border-color: var(--color-text-links);
}

.tile--cyan .card .category {
    color: var(--color-text-category);
}

.tile--cyan .card p,
.tile--cyan .card li {
    color: var(--color-text-default);
}

.tile--cyan .display-table thead th,
.tile--cyan-mobile .display-table thead th,
.tile--cyan-tablet .display-table thead th,
.tile--cyan-desktop .display-table thead th {
    color: hsl(var(--color-hue-cyan) 20% 40%);
}

.tile--cyan .display-table tbody th,
.tile--cyan-mobile .display-table tbody th,
.tile--cyan-tablet .display-table tbody th,
.tile--cyan-desktop .display-table tbody th,
.tile--cyan .display-table tbody td,
.tile--cyan-mobile .display-table tbody td,
.tile--cyan-tablet .display-table tbody td,
.tile--cyan-desktop .display-table tbody td {
    color: var(--color-text-default);
}

@media only screen and (max-width: 543px) {
    .tile--cyan-mobile .display-table thead th {
        color: hsl(var(--color-hue-cyan) 20% 40%);
    }

    .tile--cyan-mobile .display-table tbody th,
    .tile--cyan-mobile .display-table tbody td {
        color: var(--color-text-default);
    }
}

@media only screen and (min-width: 544px) {
    .tile--cyan-tablet .display-table thead th {
        color: hsl(var(--color-hue-cyan) 20% 40%);
    }

    .tile--cyan-tablet .display-table tbody th,
    .tile--cyan-tablet .display-table tbody td {
        color: var(--color-text-default);
    }
}

@media only screen and (min-width: 1080px) {
    .tile--cyan-desktop .display-table thead th {
        color: hsl(var(--color-hue-cyan) 20% 40%);
    }

    .tile--cyan-desktop .display-table tbody th,
    .tile--cyan-desktop .display-table tbody td {
        color: var(--color-text-default);
    }
}

.tile--cyan h1,
.tile--cyan .h1,
.tile--cyan h2,
.tile--cyan .h2,
.tile--cyan h3,
.tile--cyan .h3,
.tile--cyan h4,
.tile--cyan .h4,
.tile--cyan h5,
.tile--cyan .h5,
.tile--cyan h6,
.tile--cyan .h6 {
    color: var(--color-base-white);
}

.tile--cyan .subhead--2,
.tile--cyan-mobile .subhead--2,
.tile--cyan-tablet .subhead--2,
.tile--cyan-desktop .subhead--2 {
    color: var(--color-text-dark-subhead-1);
}

.tile--cyan .subhead--line-separator,
.tile--cyan-mobile .subhead--line-separator,
.tile--cyan-tablet .subhead--line-separator,
.tile--cyan-desktop .subhead--line-separator {
    border-bottom-color: var(--color-base-white);
}

.tile--cyan .highlight,
.tile--cyan-mobile .highlight,
.tile--cyan-tablet .highlight,
.tile--cyan-desktop .highlight {
    color: var(--color-base-white);
}

.tile--cyan .category,
.tile--cyan-mobile .category,
.tile--cyan-tablet .category,
.tile--cyan-desktop .category {
    color: var(--color-base-e-carrot-3);
}

@media only screen and (max-width: 543px) {
    .tile--cyan-mobile .subhead--2 {
        color: var(--color-text-dark-subhead-1);
    }
    .tile--cyan-mobile .subhead--line-separator {
        border-bottom-color: var(--color-base-white);
    }

    .tile--cyan-mobile .highlight {
        color: var(--color-base-white);
    }

    .tile--cyan-mobile .category {
        color: var(--color-base-e-carrot-3);
    }
}

@media only screen and (min-width: 544px) {
    .tile--cyan-tablet .subhead--2 {
        color: var(--color-text-dark-subhead-1);
    }

    .tile--cyan-tablet .subhead--line-separator {
        border-bottom-color: var(--color-base-white);
    }

    .tile--cyan-tablet .highlight {
        color: var(--color-base-white);
    }

    .tile--cyan-tablet .category {
        color: var(--color-base-e-carrot-3);
    }
}

@media only screen and (min-width: 1080px) {
    .tile--cyan-desktop .subhead--2 {
        color: var(--color-text-dark-subhead-1);
    }

    .tile--cyan-desktop .subhead--line-separator {
        border-bottom-color: var(--color-base-white);
    }

    .tile--cyan-desktop .highlight {
        color: var(--color-base-white);
    }

    .tile--cyan-desktop .category {
        color: var(--color-base-e-carrot-3);
    }
}

.tile--cyan a:not(.button),
.tile--cyan .link::after,
.tile--cyan .link::before {
    border-color: var(--color-base-cyan-2);
    color: var(--color-base-cyan-2);
}

@media only screen and (max-width: 543px) {
    .tile--cyan-mobile a:not(.button),
    .tile--cyan-mobile .link::after,
    .tile--cyan-mobile .link::before {
        border-color: var(--color-base-cyan-2);
        color: var(--color-base-cyan-2);
    }
}

@media only screen and (min-width: 544px) {
    .tile--cyan-mobile a:not(.button),
    .tile--cyan-tablet a:not(.button),
    .tile--cyan-desktop a:not(.button),
    .tile--cyan-mobile .link::after,
    .tile--cyan-tablet .link::after,
    .tile--cyan-desktop .link::after,
    .tile--cyan-mobile .link::before,
    .tile--cyan-tablet .link::before,
    .tile--cyan-desktop .link::before {
        border-color: var(--color-base-cyan-2);
        color: var(--color-base-cyan-2);
    }
}

@media only screen and (min-width: 1080px) {
    .tile--cyan-mobile a:not(.button),
    .tile--cyan-tablet a:not(.button),
    .tile--cyan-desktop a:not(.button),
    .tile--cyan-mobile .link::after,
    .tile--cyan-tablet .link::after,
    .tile--cyan-desktop .link::after,
    .tile--cyan-mobile .link::before,
    .tile--cyan-tablet .link::before,
    .tile--cyan-desktop .link::before {
        border-color: var(--color-base-cyan-2);
        color: var(--color-base-cyan-2);
    }
}

.hide-organic-missing-message {
    display: none !important;
}

/**
 * Collection of styles for quickly creating a quick wireframe
 */

.wireframe-box {
    background-color: var(--color-base-gray-7);
    color: var(--color-base-gray-1);
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    font-family: sans-serif;
    font-size: 12px;
    justify-content: center;
    text-align: center;
}

.wireframe-box--1 {
        min-height: calc(var(--spacing-1) * 1);
    }

.wireframe-box--2 {
        min-height: calc(var(--spacing-1) * 2);
    }

.wireframe-box--3 {
        min-height: calc(var(--spacing-1) * 3);
    }

.wireframe-box--4 {
        min-height: calc(var(--spacing-1) * 4);
    }

.wireframe-box--5 {
        min-height: calc(var(--spacing-1) * 5);
    }

.wireframe-box--6 {
        min-height: calc(var(--spacing-1) * 6);
    }

.wireframe-box--7 {
        min-height: calc(var(--spacing-1) * 7);
    }

.wireframe-box--8 {
        min-height: calc(var(--spacing-1) * 8);
    }

.wireframe-box--9 {
        min-height: calc(var(--spacing-1) * 9);
    }

.wireframe-box--10 {
        min-height: calc(var(--spacing-1) * 10);
    }

.wireframe-box--11 {
        min-height: calc(var(--spacing-1) * 11);
    }

.wireframe-box--12 {
        min-height: calc(var(--spacing-1) * 12);
    }

.wireframe-box--13 {
        min-height: calc(var(--spacing-1) * 13);
    }

.wireframe-box--14 {
        min-height: calc(var(--spacing-1) * 14);
    }

.wireframe-box--15 {
        min-height: calc(var(--spacing-1) * 15);
    }

.wireframe-box--16 {
        min-height: calc(var(--spacing-1) * 16);
    }

.wireframe-box--17 {
        min-height: calc(var(--spacing-1) * 17);
    }

.wireframe-box--18 {
        min-height: calc(var(--spacing-1) * 18);
    }

.wireframe-box--19 {
        min-height: calc(var(--spacing-1) * 19);
    }

.wireframe-box--20 {
        min-height: calc(var(--spacing-1) * 20);
    }

.wireframe-box--21 {
        min-height: calc(var(--spacing-1) * 21);
    }

.wireframe-box--22 {
        min-height: calc(var(--spacing-1) * 22);
    }

.wireframe-box--23 {
        min-height: calc(var(--spacing-1) * 23);
    }

.wireframe-box--24 {
        min-height: calc(var(--spacing-1) * 24);
    }

.wireframe-box--25 {
        min-height: calc(var(--spacing-1) * 25);
    }

.wireframe-box--26 {
        min-height: calc(var(--spacing-1) * 26);
    }

.wireframe-box--27 {
        min-height: calc(var(--spacing-1) * 27);
    }

.wireframe-box--28 {
        min-height: calc(var(--spacing-1) * 28);
    }

.wireframe-box--29 {
        min-height: calc(var(--spacing-1) * 29);
    }

.wireframe-box--30 {
        min-height: calc(var(--spacing-1) * 30);
    }

.wireframe-box--31 {
        min-height: calc(var(--spacing-1) * 31);
    }

.wireframe-box--32 {
        min-height: calc(var(--spacing-1) * 32);
    }

.wireframe-box--33 {
        min-height: calc(var(--spacing-1) * 33);
    }

.wireframe-box--34 {
        min-height: calc(var(--spacing-1) * 34);
    }

.wireframe-box--35 {
        min-height: calc(var(--spacing-1) * 35);
    }
:root{--font-family-otherlanguages:'Noto Sans','Noto Sans JP','Noto Sans TC','Noto Sans SC','Noto Sans KR';--font-family-base:'Open Sans',var(--font-family-otherlanguages),arial,helvetica,sans-serif;--font-family-headline:'source-sans-pro',var(--font-family-otherlanguages),arial,helvetica,sans-serif;--font-family-primary:var(--asset-font-inter-name),var(--font-family-base); --font-family-secondary:'source-sans-pro',var(--font-family-otherlanguages),arial,helvetica,sans-serif;} .capitalize{text-transform:capitalize !important;} .center{margin-left:auto !important;margin-right:auto !important;} .data-table--no-borders tbody th,.data-table--no-borders tbody td{border-width:0;} .flex--nowrap{flex-wrap:nowrap !important;} .mt-auto{margin-top:auto;} .mr-auto{margin-right:auto;} .ml-auto{margin-left:auto;} .mb-auto{margin-left:auto;} .display-flex{display:flex;} .gap-1{gap:var(--spacing-1);} .gap-2{gap:var(--spacing-2);} .gap-3{gap:var(--spacing-3);} .gap-4{gap:var(--spacing-4);} .width-max-content{width:max-content;} .width-min-content{width:min-content;} .height-min-content{height:min-content;} .bg-accent-tertiary{background-color:var(--color-accent-tertiary) !important;} .fill-current-color{fill:currentColor;} .bottom-border-1-subdued{border-bottom:1px solid var(--ink-common-subdued);} .border-1-base{border:1px solid var(--ink-common-base-01);} .border-width-0{border-width:0px;} .border-width-0-I{border-width:0px !important;} .measure-95{max-width:var(--size-measure-95);} .va-super{vertical-align:super !important;} .sup{font-size:.6rem;line-height:0;vertical-align:super;} .tile--gray .display-table thead th,.tile--gray .display-table tbody td{border-color:transparent;border-bottom-color:transparent;} @media only screen and (min-width:544px){.flex--row-tablet{flex-direction:row;} .mr-auto-tablet{margin-right:auto;} .ml-auto-tablet{margin-left:auto;} .text-left-tablet{text-align:left !important;} .text-center-tablet{text-align:center !important;}} @media only screen and (min-width:1080px){.flex--row-desktop{flex-direction:row;} .text-left-desktop{text-align:left !important;}}