:root {
    --white: #FFFFFF;
    --yellow: #FFFF00;
    --primary-theme-color: #2D6E8D;
    --secondary-theme-color: #17315A;
    --highlight-theme-color: #E47225;
    --accent-theme-color: #F9A71C;
    --primary-hover-theme-color: #335969;
    --highlight-hover-theme-color: #C57326;
    --primary-gray-theme-color: #323A45;
    --light-gray-theme-color: #ECEEF0;
    /* success error warning */
    --success-theme-color: #3A871E;
    --success-theme-light: #DCF0DE;
    --error-theme-color: #E80D0D;
    --error-theme-color-dark: #CE0C0C;
    --danger-theme-color: #B71212;
    --error-background-color: #F8E2E2;
    --warning-theme-color: var(--accent-theme-color);
    --go-green-theme-color: #3A871E;
    --go-green-theme-hover-color: #78970d;
    --go-green-theme-text-color: #2B6516;
    /* DETEC success error warning */
    --cm-error-theme-color: var(--highlight-theme-color);
    /* primary palette */
    --primary-theme-color-50: #F8FAFB;
    --primary-theme-color-100: #E9EEF2;
    --primary-theme-color-200: #C9D6E0;
    --primary-theme-color-300: #A9BFCE;
    --primary-theme-color-400: #8AA8BC;
    --primary-theme-color-500: #6790A9;
    --primary-theme-color-600: #417895;
    --primary-theme-color-700: #2B6581;
    --primary-theme-color-800: #264F65;
    --primary-theme-color-900: #213F4F;
    /* secondary palette */
    --secondary-theme-color-50: #F9FAFB;
    --secondary-theme-color-100: #ECEDF1;
    --secondary-theme-color-200: #D2D4DE;
    --secondary-theme-color-300: #B8BCCB;
    --secondary-theme-color-400: #9EA4B8;
    --secondary-theme-color-500: #838AA4;
    --secondary-theme-color-600: #677190;
    --secondary-theme-color-700: #525E80;
    --secondary-theme-color-800: #3A4A70;
    --secondary-theme-color-900: #263B62;
    /* highlight palette */
    --highlight-theme-color-50: #FFF9F5;
    --highlight-theme-color-100: #FFE9DE;
    --highlight-theme-color-200: #FFC8AC;
    --highlight-theme-color-300: #FCA87F;
    --highlight-theme-color-400: #F38753;
    --highlight-theme-color-500: #E0672F;
    --highlight-theme-color-600: #B7552A;
    --highlight-theme-color-700: #984726;
    --highlight-theme-color-800: #783921;
    --highlight-theme-color-900: #5E2E1C;
    /* accent palette */
    --accent-theme-color-50: #FFF9F1;
    --accent-theme-color-100: #FFEBCF;
    --accent-theme-color-200: #FFCC85;
    --accent-theme-color-300: #FBAC30;
    --accent-theme-color-400: #DE951D;
    --accent-theme-color-500: #BC7E1D;
    --accent-theme-color-600: #99681C;
    --accent-theme-color-700: #7F571A;
    --accent-theme-color-800: #644517;
    --accent-theme-color-900: #4F3615;
    /* primary-gray palette */
    --primary-gray-theme-color-50: #FAFAFA;
    --primary-gray-theme-color-100: #EDEEEF;
    --primary-gray-theme-color-200: #D3D4D7;
    --primary-gray-theme-color-300: #B9BCC0;
    --primary-gray-theme-color-400: #A1A4AA;
    --primary-gray-theme-color-500: #878B92;
    --primary-gray-theme-color-600: #6D727B;
    --primary-gray-theme-color-700: #595F69;
    --primary-gray-theme-color-800: #444B56;
    --primary-gray-theme-color-900: #343C47;
    /* light-gray palette */
    --light-gray-theme-color-50: #F9FAFA;
    --light-gray-theme-color-100: #ECEEF0;
    --light-gray-theme-color-200: #D3D4D6;
    --light-gray-theme-color-300: #BBBCBE;
    --light-gray-theme-color-400: #A3A4A6;
    --light-gray-theme-color-500: #8A8B8C;
    --light-gray-theme-color-600: #717273;
    --light-gray-theme-color-700: #5E5F60;
    --light-gray-theme-color-800: #4A4B4B;
    --light-gray-theme-color-900: #3B3B3C;
    /* text color palette */
    --heading-text-color-primary: var(--primary-theme-color-700);
    --heading-text-color-secondary: var(--secondary-theme-color);
    --body-text-color: var(--light-gray-theme-color-900);
    --body-text-color-primary: var(--primary-theme-color-700);
    --body-text-color-secondary: var(--secondary-theme-color-700);
    --label-text-color: var(--light-gray-theme-color-600);
    --link-text-color: var(--primary-theme-color-600);
    --link-text-color-hover: var(--primary-theme-color-600);
    --link-text-color-visited: var(--primary-theme-color-800);
    --heading-text-light-background: var(--primary-theme-color-700);
    --heading-text-light-background-secondary: var(--secondary-theme-color-800);
    --body-text-light-background: var(--primary-theme-color-700);
    --link-text-light-background: var(--primary-theme-color-700);
    --link-text-hover-light-background: var(--primary-theme-color-800);
    --heading-text-dark-background: var(--white);
    --body-text-dark-background: var(--white);
    --link-text-dark-background: var(--primary-theme-color-100);
    --link-text-hover-dark-background: var(--primary-theme-color-300);
    --pill-text-color: var(--primary-theme-color-800);
    --pill-text-color-hover: var(--white);
    --pill-background-color: transparent;
    --pill-background-color-hover: var(--primary-theme-color);
    --pill-border: var(--primary-theme-color-800);
    --pill-border-hover: var(--primary-theme-color);
    /* background palette */
    --background-color-primary: var(--primary-theme-color);
    --background-color-light: var(--light-gray-theme-color);
    --background-color-dark: var(--primary-gray-theme-color);
    /* gradient palette */
    --gradient-background-image: linear-gradient(243deg, var(--primary-theme-color) 0%, var(--secondary-theme-color) 100%);
    --gradient-background: linear-gradient(243deg, var(--primary-theme-color) 0%, var(--secondary-theme-color) 100%) 0% 0% no-repeat padding-box;
    --linear-gradient-background: linear-gradient(to right, var(--primary-theme-color), var(--secondary-theme-color));
    /* borders palette */
    --dhcs-border-color-light: var(--primary-gray-theme-color-50);
    --dhcs-border-color: var(--primary-gray-theme-color-200);
    --dhcs-border-color-dark: var(--primary-gray-theme-color);
    --dhcs-border-radius: 5px;
    --dhcs-border-thin: 1px solid var(--dhcs-border-color);
    --dhcs-border-thin-light: 1px solid var(--primary-theme-color-50);
    --dhcs-border-thin-primary: 1px solid var(--primary-theme-color);
    --dhcs-border-dark: 1px solid var(--dhcs-border-color-dark);
    --dhcs-border-accent: 3px solid var(--highlight-theme-color);
    /* box shadows */
    --dhcs-box-shadow: 0px 2px 8px #19191933;
    --dhcs-button-focus-shadow: 0 0 0 0.25rem rgba(45, 110, 141, 0.25);
    --dhcs-input-shadow: rgba(0, 0, 0, 0.18) 0px 2px 4px;
    --dhcs-modal-shadow: var(--dhcs-modal-shadow);
    --dhcs-tall-shadow: 0px 7px 51px var(--light-gray-theme-color-500);
    /* font family */

    --dhcs-heading-font-family: var(--dhcs-font-family);
    --dhcs-body-font-family: var(--dhcs-font-family);
    /* font size */
    --dhcs-body-font-size: calc(1rem + 0.1vw);
    --dhcs-small-font-size: calc(0.875rem + 0.1vw);
    --dhcs-legal-font-size: calc(0.8rem + 0.1vw);
    /* button palette */
    --dhcs-button-primary-background: var(--primary-theme-color);
    --dhcs-button-primary-background-hover: var(--primary-hover-theme-color);
    --dhcs-button-primary-text-color: var(--white);
    --dhcs-button-primary-text-color-hover: var(--white);
    --dhcs-button-secondary-background: transparent;
    --dhcs-button-secondary-background-hover: var(--primary-hover-theme-color);
    --dhcs-button-secondary-text-color: var(--primary-theme-color);
    --dhcs-button-secondary-text-color-hover: var(--white);
    --dhcs-button-tertiary-background: var(--highlight-theme-color-600);
    --dhcs-button-tertiary-background-hover: var(--highlight-theme-color-700);
    --dhcs-button-tertiary-text-color: var(--white);
    --dhcs-button-tertiary-text-color-hover: var(--white);
    --dhcs-button-white-background: var(--white);
    --dhcs-button-white-background-hover: var(--primary-theme-color);
    --dhcs-button-white-border-color: var(--white);
    --dhcs-button-white-border-color-hover: var(--primary-theme-color);
    --dhcs-button-white-text-color: var(--primary-theme-color);
    --dhcs-button-white-text-color-hover: var(--white);
    --dhcs-button-callout-background: var(--white);
    --dhcs-button-callout-background-hover: var(--primary-theme-color);
    --dhcs-button-callout-text-color: var(--primary-theme-color);
    --dhcs-button-callout-text-color-hover: var(--white);
    --dhcs-button-icon-background: transparent;
    --dhcs-button-icon-background-hover: var(--light-gray-theme-color);
    --dhcs-button-icon-color: var(--primary-theme-color);
    --dhcs-button-icon-color-hover: var(--primary-theme-color);
    --dhcs-button-hover-tint: rgba(50, 58, 69, 0.1);
    /* icons */
    --dhcs-icon-color: var(--light-gray-theme-color-200);
    --dhcs-icon-color-dark: var(--light-gray-theme-color-600);
    /* links */
    --dhcs-link-underline: underline 2px dotted;
    --dhcs-focus-outline: solid 2px var(--primary-theme-color) !important;
    /* side nav palette */
    --dhcs-sidebar-background-color: transparent;
    --dhcs-dropdown-background-color: var(--white);
    --dhcs-sidebar-background-color-hover: var(--primary-theme-color-100);
    --dhcs-sidebar-icon-color: var(--primary-theme-color);
    /* tables */
    --dhcs-table-odd-row-background-color: var(--primary-gray-theme-color-100);
    /* side nav palette */
    --dhcs-tabs-color: var(--secondary-theme-color);
    --dhcs-tabs-border-color: var(--secondary-theme-color);
    --dhcs-tabs-bottom-border-color: var(--secondary-theme-color-200);
    /* site header & navigation palette */
    --dhcs-site-navigation-item-background: transparent;
    --dhcs-site-navigation-item-background-hover: var(--primary-theme-color-100);
    --dhcs-site-navigation-item-background-active: var(--primary-theme-color-200);
    --dhcs-site-navigation-item-color: var(--body-text-color);
    --dhcs-site-navigation-item-color-hover: var(--primary-theme-color-800);
    --dhcs-site-navigation-item-color-active: var(--primary-theme-color-800);
}