:root {

    /* ----------------------------- */
    /* ?COLORS                       */
    /* ----------------------------- */

    /* ##Primary */
    --color-accent-primary: #000000;
    --color-accent-primary-50: #808080;
    --color-accent-primary-dark: #000000;
    --color-accent-primary-darker: #000000;

    /* ##Secondary */
    --color-accent-secondary: #949494;
    --color-accent-secondary-50: #C9C9C9;

    /* ##Tertiary */
    --color-accent-tertiary: #ECECEC;
    --color-accent-tertiary-50: #F5F5F5;

    /* ##Accents */
    --color-accent-1: #A80002;
    --color-accent-2: #CB4700;
    --color-accent-3: #E1C42C;

    /* ##Common */
    --color-black: #000;
    --color-white: #F6F6F6;
    --color-neutral: #F6F6F6;
    --color-border: #DCDCDC;
    --color-overlay: #000;
    --overlay-opacity: 0.6;
    --overlay-opacity-light: 0.8;
    --overlay-opacity-lighter: 0.3;
    --overlay-opacity-darker: 0.75;

    /* ##Headings */
    --color-h1: #000;
    --color-h2: #000;
    --color-h3: #000;
    --color-h-sub: #000;

    /* ##Body */
    --color-text: #000; 
    --color-text-darkbg: #fff;

    /* ----------------------------- */
    /* ?TYPOGRAPHY                   */
    /* ----------------------------- */

    /* ##Fonts */
    --font-stack-primary: 'aktiv-grotesk', sans-serif;
    --font-stack-secondary: 'aktiv-grotesk',sans-serif;
    --font-stack-charts: 'Mulish', sans-serif;
    --font-stack-body: 'aktiv-grotesk', sans-serif;

    /* ##Heading & paragraph scale (shared metrics) */
    --heading-line-height: 1.15em;
    --heading-letter-spacing: -0.04em;
    --paragraph-line-height: 1.8em;
    --paragraph-letter-spacing: -0.01em;
    --paragraph-size-1: 1.2rem;
    --paragraph-size-2: 1rem;
    --paragraph-size-3: 0.9rem;
    --misc-text-size: 1rem;
    --misc-line-height: 1.2em;
    --misc-letter-spacing: 0em;

    /* ##H1 */
    --heading-1-size-value: 5.6;
    --h1-fluid-size: calc((var(--heading-1-size-value) - 1) * 1.2vw + 1rem);
    --h1-size: 64px;
    --h1-font-weight: 400;
    --h1-mobile-size: 42px;

    /* ##H2 */
    --h2-size: 4rem;
    --h2-font-weight: 700;
    --h2-separation-distance: 50px;
    --h2-mobile-size: 2.5rem;

    /* ##H3 */
    --h3-size: 2.2rem;
    --h3-font-weight: 400;
    --h3-mobile-size: 1.65rem;

    /* ##H4 */
    --h4-size: 1.2rem;
    --h4-font-weight: 400;
    --h4-mobile-size: 1.05rem;

    /* ##H5 */
    --h5-size: 1rem;
    --h5-font-weight: 400;
    --h5-mobile-size: 0.95rem;

    /* ##H6 */
    --h6-size: 0.9rem;
    --h6-font-weight: 400;
    --h6-mobile-size: 0.85rem;

    /* ##Body Styles */
    --large-body: 22px;
    --large-weight: 400;
    --large-height: 1.6;

    --medium-body: 16px;
    --medium-weight: 400;
    --medium-height: 1.8;

    --small-body: 17px;
    --small-weight: 400;
    --small-height: 1.5;

    --x-small-body: 14px;
    --x-small-weight: 400;
    --x-small-height: 1.5;

    /* ##Date and Time Styles */
    --date-time-size: 12px;
    --date-time-weight: 400;
    --date-time-font-family: var(--font-stack-primary);
    --date-time-color: var(--color-text);
    --date-time-transform: none;

    /* ##Footnote Styles */
    --footnote-size: 12px;
    --footnote-weight: 400;
    --footnote-font-family: var(--font-stack-primary);
    --footnote-color: var(--color-text);

    /* ##Metric Styles */
    --metric-small: 12px;
    --metric-xsmall: 8px;

    /* ----------------------------- */
    /* ?LINKS                        */
    /* ----------------------------- */

    /* ##Button Default */
    --button-background: transparent;
    --button-border-width: 2px;
    --button-border-color: var(--color-black);
    --button-border-radius: 0;
    --button-color: var(--color-black);
    --button-font-size: 16px;
    --button-font-weight: 400;
    --button-font-family: var(--font-stack-secondary);
    --button-padding-tb: 28px;
    --button-padding-lr: 115px;
    --button-letter-spacing: 0;
    --button-icon-size: 24px;
    --button-icon-weight: normal;

    /* ##Button Default Hover */
    --button-hover-color: #fff;
    --button-hover-background: var(--color-black);
    --button-hover-border-width: 2px;
    --button-hover-border-color: var(--color-black);

    /* ##Dark */
    --button-dark-background: transparent;
    --button-dark-border-width: 2px;
    --button-dark-border-color: #fff;
    --button-dark-color: var(--color-text-darkbg);

    /* ##Dark Hover */
    --button-dark-hover-background: #fff;
    --button-dark-hover-border-width: 2px;
    --button-dark-hover-border-color: #fff;
    --button-dark-hover-color: #000;

    /* ##Block Links Default */
    --block-link-font-family: var(--font-stack-secondary);
    --block-link-font-size: 16px;
    --block-link-font-weight: 400;
    --block-link-color: #000;
    --block-link-arrow-color: var(--color-black);

    /* ##Block Links Hover */
    --block-link-hover-color: #000;
    --block-link-hover-arrow-color: var(--color-black);

    /* ##Block Links Dark */
    --block-link-dark-color: #fff;
    --block-link-dark-arrow-color: #fff;

    /* ##Block Links Dark Hover */
    --block-link-dark-hover-color: #fff;
    --block-link-dark-hover-arrow-color: #fff;

    /* ##Text Links Default */
    --color-link: var(--color-black);

    /* ##Text Links Hover */
    --color-link-hover: var(--color-black);

    /* ##Text Links Dark */
    --color-link-darkbg: #fff;

    /* ##Text Links Dark Hover */
    --color-link-darkbg-hover: #fff;

    /* ##Text Links Paragraph Hover */
    --color-link-text-hover: #000;

    /* ##Text Links Paragraph Hover Dark */
    --color-link-darkbg-text-hover: #EDEDED;

    /* ----------------------------- */
    /* ?TABLES                       */
    /* ----------------------------- */

    /* ##Table Headings */
    --table-heading-background: var(--color-accent-primary);
    --table-heading-padding-tb: 16px;
    --table-heading-padding-lr: 24px;
    --table-heading-size: 14px;
    --table-heading-font-weight: 400;
    --table-heading-color: #fff;
    --table-heading-text-transform: capitalze;

    /* ##Table Data */
    --table-data-background: #fff;
    --table-data-padding: 24px;
    --table-data-size: 17px;
    --table-data-color: var(--color-accent-primary);

    /* ##Table Alternates */
    --table-data-alternate-background: var(--color-neutral);
    --table-data-neutral-background: var(--color-neutral);
    --table-data-alternate-link-color: var(--color-accent-primary);
    --table-data-alternate-link-hover-color: var(--color-link-hover);

    /* ----------------------------- */
    /* ?GENERAL                      */
    /* ----------------------------- */
    --body-top-padding: 0;
    --body-font-size: var(--medium-body);
    --body-font-weight: var(--medium-weight);
    --body-line-height: var(--medium-height);
    --main-content-margin-tb: 75px; 
    --main-content-margin-lr: 0;
    --main-content-margin-mobile-tb: 50px;
    --main-content-margin-mobile-lr: 0;

    /* ----------------------------- */
    /* ?HEADER                       */
    /* ----------------------------- */

    /* ##Zero Nav */
    --zero-nav-background-color: var(--color-white);
    --zero-nav-padding-top: 6px;
    --zero-nav-padding-right: 0;
    --zero-nav-padding-bottom: 6px;
    --zero-nav-padding-left: 0;
    --zero-nav-color: #000;
    --zero-nav-active-color: #000;

    /* ##Main Background */
    --header-bg: var(--color-black);
    --header-bg-affixed: #fff;

    /* ##Main Font */
    --nav-font-family: var(--font-stack-primary);
    --nav-font-size: 16px;
    --nav-font-weight: 400;
    --nav-text-transform: none;
    --nav-color: #000;
    --nav-color-hover: var(--color-black);
    --nav-color-active: var(--color-black);
    --nav-accent-color: var(--color-black);

    /* ##Main Spacing */
    --main-menu-top-position: 19px;
    --nav-padding-top: 0;
    --nav-padding-right: 6px;
    --nav-padding-bottom: 31px;
    --nav-padding-left: 3vw;
    --nav-inline-padding: 3vw;
    --nav-inline-padding-end: 6px;
    --nav-inline-padding-lg: 3vw;
    --nav-inline-padding-lg-end: 6px;
    --nav-accent-bottom-position: 27px;

    /* ##Main Dropdown */
    --nav-dropdown-top-position: 55px;
    --nav-dropdown-bg: #fff;
    --nav-dropdown-font-weight: 400;
    --nav-dropdown-font-size: 16px;
    --nav-dropdown-text-transform: none;
    --nav-dropdown-color: var(--color-black);
    --nav-dropdown-color-hover: var(--color-white);
    --nav-dropdown-hover-background-color: var(--color-black);
    --nav-dropdown-shadow: 0px 5px 10px 0px #949494;

    /* ##Main Mobile */
    --nav-mobile-font-size: 16px;
    --nav-mobile-padding-top: 0;
    --nav-mobile-padding-right: 15px;
    --nav-mobile-padding-bottom: 35px;
    --nav-mobile-padding-left: 15px;
    --nav-color-mobile: var(--color-black);
    --mobile-trigger-top-position: 0;
    --mobile-trigger-color: #ffffff;
    --mobile-trigger-background-color: var(--color-accent-primary);
    --mobile-nav-background: var(--color-white);

    /* ----------------------------- */
    /* ?SUB NAVIGATION               */
    /* ----------------------------- */
    --sub-nav-top-position: 0;
    --sub-nav-background: var(--color-white);
    --sub-nav-link-font-size: 16px;
    --sub-nav-link-font-family: var(--font-stack-primary);
    --sub-nav-link-color: var(--color-black);
    --sub-nav-link-hover-background: var(--color-black);
    --sub-nav-active-link-color: var(--color-white);
    --sub-nav-link-font-weight: 400;
    --sub-nav-link-text-transform: none;

    /* ##Mobile Sub Navigation Title */
    --sub-nav-section-title-text-transform: uppercase;
    --sub-nav-section-title-font-size: 16px;
    --sub-nav-section-title-font-weight: 600;
    --sub-nav-section-title-font-color: var(--color-black);

    /* ----------------------------- */
    /* ?TERTIARY NAVIGATION          */
    /* ----------------------------- */

    /* ##Mobile Tertiary Nav Title */
    --tertiary-nav-margin-top: 60px;
    --tertiary-nav-title-font-size: 18px;
    --tertiary-nav-title-font-weight: 700;

    /* ##Mobile Tertiary Nav Links */
    --tertiary-nav-link-color: var(--color-text);
    --tertiary-nav-link-color-hover: var(--color-accent-primary);
    --tertiary-nav-link-color-active: var(--color-accent-primary);
    --tertiary-nav-link-font-size: 16px;
    --tertiary-nav-link-font-weight: 400;
    --tertiary-nav-link-padding-tb: 10px;
    --tertiary-nav-link-padding-lr: 0;

    /* ----------------------------- */
    /* ?QUICK LINKS                  */
    /* ----------------------------- */
    --quick-links-background: var(--color-accent-primary);
    --quick-links-padding-tb: 16px;
    --quick-links-padding-lr: 13.5px;
    --quick-links-font-size: 16px;
    --quick-links-font-weight: 400;
    --quick-links-font-family: var(--font-stack-primary);
    --quick-links-color: var(--color-accent-secondary);
    --quick-links-color-hover:  var(--color-accent-secondary);
    --quick-links-icon-size: 16px;
    --quick-links-icon-color: var(--color-accent-secondary);

    /* ----------------------------- */
    /* ?FOOTER                       */
    /* ----------------------------- */

    /* ##Footer Links */
    --footer-bg: var(--color-black);
    --footer-color: var(--color-accent-secondary);
    --footer-font-size: 16px;

    /* ##Social Icons */
    --social-icon-bg: #fff;
    --social-icon-hover-bg: #000;
    --social-icon-color: var(--color-accent-primary);
    --social-icon-hover-color: #fff;
    --social-icon-width: 32px;
    --social-icon-height: 32px;

    /* ##QMod */
    --qmod-background:  var(--color-accent-primary);
    --qmod-color:  var(--color-accent-secondary);
    --qmod-font-size: 12px;

    /* ----------------------------- */
    /* ?PAGE BANNERS                 */
    /* ----------------------------- */

    /* ##Homepage */
    --home-banner-height: 690px;
    --home-page-banner-h2-color: #fff;
    --home-page-banner-h2-size: 90px;
    --home-page-banner-h2-font-weight: 400;
    --home-page-banner-subtitle-color: #fff;
    --home-page-banner-subtitle-size: 20px;
    --home-page-banner-subtitle-weight: 400;

    /* ##Interior Banner */
    --interior-banner-height: 500px;
    --interior-banner-mobile-height: 300px;
    --interior-page-banner-h1-color: #000;
    --interior-page-banner-h1-size: 90px;
    --interior-page-banner-h1-font-weight: 400;
    --interior-page-banner-subtitle-color: #fff;
    --interior-page-banner-subtitle-size: 20px;
    --interior-page-banner-subtitle-weight: 400;

    /* ##IR Banner */
    --ir-banner-height: 500px;

    /* ##IR CTA H2 */
    --ir-cta-h2-size: var(--h2-size);
    --ir-cta-h2-font-weight: var(--h2-font-weight);
    --ir-cta-h2-line-height: 1.2;
    --ir-cta-h2-letter-spacing: 0;
    --ir-cta-h2-mobile-size: var(--h2-mobile-size);
    --ir-cta-h2-mobile-line-height: 1.2;
    --ir-cta-h2-mobile-letter-spacing: 0;

    /* ##Page Banner Alignment */
    --page-banner-alignment: center;
    --row-page-banner-alignment: center;

    /* ----------------------------- */
    /* ?FORMS                        */
    /* ----------------------------- */

    /* ##Form Colors */
    --color-form-border: #757575;
    --color-form-error-text: #d40033;
    --color-form-border-dark: #fa003a;
    --color-checkbox-border: var(--color-text);
    --color-checkbox-active: var(--color-accent-primary);
    --color-check: var(--color-white);
    --color-checkbox-border-dark: var(--color-text-darkbg);
    --color-check-dark: var(--color-text-darkbg);

    /* ##Text */
    --checkbox-label-font-size: 13px;
    --checkbox-label-font-weight: 400;

    /* ##Elements */
    --form-input-border-radius: 8px;
    --checkbox-height: 16px;
    --checkbox-width: 16px;

    /* ##Form Labels */
    --form-label-font-size: 12px;
    --form-label-font-weight: 400;
    --form-label-font-family: var(--font-stack-secondary);
    --form-label-margin-bottom: 0.5rem;

    /* ##Form Inputs */
    --form-input-height: 53px;
    --form-input-font-size: 16px;
    --form-input-font-weight: 400;
    --form-input-margin-top: 5px;
    --form-input-margin-bottom: 20px;
    --form-input-border-width: 1px;
    --form-input-padding: 8px;

    /* ----------------------------- */
    /* ?LIST ITEMS                   */
    /* ----------------------------- */
    --ul-before-color: var(--color-accent-primary);
    --ul-before-size: 1em;
    --ol-before-color: var(--color-accent-primary);
    --ol-before-size: 1em;

    /* ----------------------------- */
    /* ?CHARTS - QMOD                */
    /* ----------------------------- */

    /* ##Default */
    --color-chart-point: var(--color-accent-primary);
    --color-chart-graph: var(--color-accent-primary);
    --color-chart-bars: var(--color-accent-primary);
    --color-chart-markers: var(--color-accent-primary);

    /* ##Dark */
    --color-dark-chart-point: #00d6e6;
    --color-dark-chart-graph: #5ea4ce;
    --color-dark-chart-bars: #00d6e6;
    --color-dark-chart-markers: #5ea4ce;

    /* ----------------------------- */
    /* ?CHARTS - CHART LIBRARY       */
    /* ----------------------------- */

    /* ##Elements */
    --chart-axis-label-color: #333333;
    --chart-axis-line-color:  #DCDCDC;
    --chart-grid-line-color:  #DCDCDC;
}