/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* //// Nine.css v3.0 /////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* //// OAK -> SCSS Variables /////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* //// NINE SCSS Mixins ////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* //// NINE SCSS Variables /////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* //// NINE CSS Variables /////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=IBM+Plex+Sans+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=IBM+Plex+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap");
:root {
  --font-primary: Roboto, sans-serif;
  --font-secondary: Roboto, sans-serif;
  --font-tertiary: Open Sans, sans-serif;
  --nav-logo-desktop-width: 8.6875rem;
  --nav-logo-desktop-scrolled-width: 6.5rem;
  --nav-logo-mobile-width: 7.8rem;
  --nav-logo-desktop-offset: 0.2rem;
  --nav-logo-desktop-scrolled-offset: 0rem;
  --nav-logo-mobile-offset: 0rem;
  --nav-desktop-height: 4.5rem;
  --nav-scrolled-height: 3rem;
  --nav-mobile-height: 4rem;
  --nav-tert-text-color: #2ba4dd;
  --nav-tert-desktop-height: 0rem;
  --nav-tert-mobile-height: 1.8rem;
  --nav-tert-font: 0.9rem;
  --nav-tert-letter-case: capitalize;
  --nav-tert-text-hover-color: #ffffff;
  --nav-tert-background-hover-color: #ffffff;
  --nav-tert-text-hover-text-decoration: underline;
  --nav-desktop-font-size: 1rem;
  --nav-desktop-scrolled-font-size: 1rem;
  --nav-dropdown-font-size: 1rem;
  --nav-mobile-font-size: 1.4rem;
  --nav-mobile-trigger-open-font-size: 1.4rem;
  --nav-mobile-trigger-close-font-size: 1.4rem;
  --nav-desktop-page-padding: 0.8rem;
  --nav-desktop-scrolled-page-padding: 0.8rem;
  --nav-color: #221E1F;
  --nav-dropdown-color: #ffffff;
  --nav-mobile-dropdown-color: rgba(34,30,31, 0.98);
  --nav-mobile-trigger-open-color: #ffffff;
  --nav-mobile-trigger-close-color: #FFFFFF;
  --nav-text-color: #ffffff;
  --nav-dropdown-text-color: #000000;
  --nav-mobile-text-color: #ffffff;
  --nav-hover-text-color: #ffffff;
  --nav-hover-dropdown-text-color: #ffffff;
  --nav-hover-effect-color: #2ba4dd;
  --nav-hover-dropdown-effect-color: #2ba4dd;
  --nav-width: 99%;
  --nav-letter-case: capitalize;
  --nav-mobile-width: 100%;
  --primary: #2ba4dd;
  --primary-rgb: 43,164,221;
  --primary-rgb-format: 43 164 221;
  --primary-rgba-translucent: rgba(var(--primary-rgb), .5);
  --primary-rgba-semi-translucent: rgba(var(--primary-rgb), .98);
  --primary-rgba-tissue: rgba(var(--primary-rgb), .8);
  --primary-rgba-0: rgba(var(--primary-rgb), 0);
  --primary-rgba-1: rgba(var(--primary-rgb), 0.1);
  --primary-rgba-2: rgba(var(--primary-rgb), 0.2);
  --primary-rgba-3: rgba(var(--primary-rgb), 0.3);
  --primary-rgba-4: rgba(var(--primary-rgb), 0.4);
  --primary-rgba-5: rgba(var(--primary-rgb), 0.5);
  --primary-rgba-6: rgba(var(--primary-rgb), 0.6);
  --primary-rgba-7: rgba(var(--primary-rgb), 0.7);
  --primary-rgba-8: rgba(var(--primary-rgb), 0.8);
  --primary-rgba-9: rgba(var(--primary-rgb), 0.9);
  --secondary: #8dc640;
  --secondary-rgb: 141,198,64;
  --secondary-rgb-format: 141 198 64;
  --secondary-rgba-translucent: rgba(var(--secondary-rgb), .5);
  --secondary-rgba-semi-translucent: rgba(var(--secondary-rgb), .98);
  --secondary-rgba-tissue: rgba(var(--secondary-rgb), .8);
  --secondary-rgba-0: rgba(var(--secondary-rgb), 0);
  --secondary-rgba-1: rgba(var(--secondary-rgb), 0.1);
  --secondary-rgba-2: rgba(var(--secondary-rgb), 0.2);
  --secondary-rgba-3: rgba(var(--secondary-rgb), 0.3);
  --secondary-rgba-4: rgba(var(--secondary-rgb), 0.4);
  --secondary-rgba-5: rgba(var(--secondary-rgb), 0.5);
  --secondary-rgba-6: rgba(var(--secondary-rgb), 0.6);
  --secondary-rgba-7: rgba(var(--secondary-rgb), 0.7);
  --secondary-rgba-8: rgba(var(--secondary-rgb), 0.8);
  --secondary-rgba-9: rgba(var(--secondary-rgb), 0.9);
  --tertiary: #221e1f;
  --tertiary-rgb: 34,30,31;
  --tertiary-rgb-format: 34 30 31;
  --tertiary-rgba-translucent: rgba(var(--tertiary-rgb), .5);
  --tertiary-rgba-semi-translucent: rgba(var(--tertiary-rgb), .98);
  --tertiary-rgba-tissue: rgba(var(--tertiary-rgb), .8);
  --tertiary-rgba-0: rgba(var(--tertiary-rgb), 0);
  --tertiary-rgba-1: rgba(var(--tertiary-rgb), 0.1);
  --tertiary-rgba-2: rgba(var(--tertiary-rgb), 0.2);
  --tertiary-rgba-3: rgba(var(--tertiary-rgb), 0.3);
  --tertiary-rgba-4: rgba(var(--tertiary-rgb), 0.4);
  --tertiary-rgba-5: rgba(var(--tertiary-rgb), 0.5);
  --tertiary-rgba-6: rgba(var(--tertiary-rgb), 0.6);
  --tertiary-rgba-7: rgba(var(--tertiary-rgb), 0.7);
  --tertiary-rgba-8: rgba(var(--tertiary-rgb), 0.8);
  --tertiary-rgba-9: rgba(var(--tertiary-rgb), 0.9);
  --quaternary: #f2f2f2;
  --quaternary-rgb: 242,242,242;
  --quaternary-rgb-format: 242 242 242;
  --quaternary-rgba-translucent: rgba(var(--quaternary-rgb), .5);
  --quaternary-rgba-semi-translucent: rgba(var(--quaternary-rgb), .98);
  --quaternary-rgba-tissue: rgba(var(--quaternary-rgb), .8);
  --quaternary-rgba-0: rgba(var(--quaternary-rgb), 0);
  --quaternary-rgba-1: rgba(var(--quaternary-rgb), 0.1);
  --quaternary-rgba-2: rgba(var(--quaternary-rgb), 0.2);
  --quaternary-rgba-3: rgba(var(--quaternary-rgb), 0.3);
  --quaternary-rgba-4: rgba(var(--quaternary-rgb), 0.4);
  --quaternary-rgba-5: rgba(var(--quaternary-rgb), 0.5);
  --quaternary-rgba-6: rgba(var(--quaternary-rgb), 0.6);
  --quaternary-rgba-7: rgba(var(--quaternary-rgb), 0.7);
  --quaternary-rgba-8: rgba(var(--quaternary-rgb), 0.8);
  --quaternary-rgba-9: rgba(var(--quaternary-rgb), 0.9);
  --light: #fff;
  --light-rgb: 255,255,255;
  --light-rgb-format: 255 255 255;
  --light-rgba-translucent: rgba(var(--light-rgb), .5);
  --light-rgba-semi-translucent: rgba(var(--light-rgb), .98);
  --light-rgba-tissue: rgba(var(--light-rgb), .8);
  --light-rgba-0: rgba(var(--light-rgb), 0);
  --light-rgba-1: rgba(var(--light-rgb), 0.1);
  --light-rgba-2: rgba(var(--light-rgb), 0.2);
  --light-rgba-3: rgba(var(--light-rgb), 0.3);
  --light-rgba-4: rgba(var(--light-rgb), 0.4);
  --light-rgba-5: rgba(var(--light-rgb), 0.5);
  --light-rgba-6: rgba(var(--light-rgb), 0.6);
  --light-rgba-7: rgba(var(--light-rgb), 0.7);
  --light-rgba-8: rgba(var(--light-rgb), 0.8);
  --light-rgba-9: rgba(var(--light-rgb), 0.9);
  --gray: #f8f9fa;
  --gray-rgb: 248,249,250;
  --gray-rgb-format: 248 249 250;
  --gray-rgba-translucent: rgba(var(--gray-rgb), .5);
  --gray-rgba-semi-translucent: rgba(var(--gray-rgb), .98);
  --gray-rgba-tissue: rgba(var(--gray-rgb), .8);
  --gray-rgba-0: rgba(var(--gray-rgb), 0);
  --gray-rgba-1: rgba(var(--gray-rgb), 0.1);
  --gray-rgba-2: rgba(var(--gray-rgb), 0.2);
  --gray-rgba-3: rgba(var(--gray-rgb), 0.3);
  --gray-rgba-4: rgba(var(--gray-rgb), 0.4);
  --gray-rgba-5: rgba(var(--gray-rgb), 0.5);
  --gray-rgba-6: rgba(var(--gray-rgb), 0.6);
  --gray-rgba-7: rgba(var(--gray-rgb), 0.7);
  --gray-rgba-8: rgba(var(--gray-rgb), 0.8);
  --gray-rgba-9: rgba(var(--gray-rgb), 0.9);
  --dark: #212529;
  --dark-rgb: 33,37,41;
  --dark-rgb-format: 33 37 41;
  --dark-rgba-translucent: rgba(var(--dark-rgb), .5);
  --dark-rgba-semi-translucent: rgba(var(--dark-rgb), .98);
  --dark-rgba-tissue: rgba(var(--dark-rgb), .8);
  --dark-rgba-0: rgba(var(--dark-rgb), 0);
  --dark-rgba-1: rgba(var(--dark-rgb), 0.1);
  --dark-rgba-2: rgba(var(--dark-rgb), 0.2);
  --dark-rgba-3: rgba(var(--dark-rgb), 0.3);
  --dark-rgba-4: rgba(var(--dark-rgb), 0.4);
  --dark-rgba-5: rgba(var(--dark-rgb), 0.5);
  --dark-rgba-6: rgba(var(--dark-rgb), 0.6);
  --dark-rgba-7: rgba(var(--dark-rgb), 0.7);
  --dark-rgba-8: rgba(var(--dark-rgb), 0.8);
  --dark-rgba-9: rgba(var(--dark-rgb), 0.9);
  --dark-gray: #5f5f5f;
  --dark-gray-rgb: 95,95,95;
  --dark-gray-rgb-format: 95 95 95;
  --dark-gray-rgba-translucent: rgba(var(--dark-gray-rgb), .5);
  --dark-gray-rgba-semi-translucent: rgba(var(--dark-gray-rgb), .98);
  --dark-gray-rgba-tissue: rgba(var(--dark-gray-rgb), .8);
  --dark-gray-rgba-0: rgba(var(--dark-gray-rgb), 0);
  --dark-gray-rgba-1: rgba(var(--dark-gray-rgb), 0.1);
  --dark-gray-rgba-2: rgba(var(--dark-gray-rgb), 0.2);
  --dark-gray-rgba-3: rgba(var(--dark-gray-rgb), 0.3);
  --dark-gray-rgba-4: rgba(var(--dark-gray-rgb), 0.4);
  --dark-gray-rgba-5: rgba(var(--dark-gray-rgb), 0.5);
  --dark-gray-rgba-6: rgba(var(--dark-gray-rgb), 0.6);
  --dark-gray-rgba-7: rgba(var(--dark-gray-rgb), 0.7);
  --dark-gray-rgba-8: rgba(var(--dark-gray-rgb), 0.8);
  --dark-gray-rgba-9: rgba(var(--dark-gray-rgb), 0.9);
  --transparent: transparent;
  --p-font-size-xs: 1.2rem;
  --p-line-height-xs: 1.4;
  --p-font-weight-xs: 400;
  --p-margin-bottom-xs: 1.5rem;
  --p-font-size-sm: 1.2rem;
  --p-line-height-sm: 1.4;
  --p-font-weight-sm: 400;
  --p-margin-bottom-sm: 1.5rem;
  --p-font-size-md: 1.25rem;
  --p-line-height-md: 1.4;
  --p-font-weight-md: 400;
  --p-margin-bottom-md: 1.5rem;
  --p-font-size-lg: 1.25rem;
  --p-line-height-lg: 1.4;
  --p-font-weight-lg: 400;
  --p-margin-bottom-lg: 1.5rem;
  --p-font-size-xl: 1.25rem;
  --p-line-height-xl: 1.4;
  --p-font-weight-xl: 400;
  --p-margin-bottom-xl: 1.5rem;
  --p-font-size-xxl: 1.25rem;
  --p-line-height-xxl: 1.4;
  --p-font-weight-xxl: 400;
  --p-margin-bottom-xxl: 1.5rem;
  --h1-font-size-xs: 3rem;
  --h1-line-height-xs: 1.1;
  --h1-font-weight-xs: 600;
  --h1-margin-bottom-xs: 1.5rem;
  --h1-font-size-sm: 3.2rem;
  --h1-line-height-sm: 1.1;
  --h1-font-weight-sm: 600;
  --h1-margin-bottom-sm: 1.5rem;
  --h1-font-size-md: 3.3rem;
  --h1-line-height-md: 1.1;
  --h1-font-weight-md: 600;
  --h1-margin-bottom-md: 1.5rem;
  --h1-font-size-lg: 3.5rem;
  --h1-line-height-lg: 1.1;
  --h1-font-weight-lg: 600;
  --h1-margin-bottom-lg: 1.5rem;
  --h1-font-size-xl: 3.5rem;
  --h1-line-height-xl: 1.1;
  --h1-font-weight-xl: 600;
  --h1-margin-bottom-xl: 1.5rem;
  --h1-font-size-xxl: 3.5rem;
  --h1-line-height-xxl: 1.1;
  --h1-font-weight-xxl: 600;
  --h1-margin-bottom-xxl: 1.5rem;
  --h2-font-size-xs: 2.75rem;
  --h2-line-height-xs: 1.16;
  --h2-font-weight-xs: 600;
  --h2-margin-bottom-xs: 1.5rem;
  --h2-font-size-sm: 2.8rem;
  --h2-line-height-sm: 1.16;
  --h2-font-weight-sm: 600;
  --h2-margin-bottom-sm: 1.5rem;
  --h2-font-size-md: 3rem;
  --h2-line-height-md: 1.16;
  --h2-font-weight-md: 600;
  --h2-margin-bottom-md: 1.5rem;
  --h2-font-size-lg: 3rem;
  --h2-line-height-lg: 1.16;
  --h2-font-weight-lg: 600;
  --h2-margin-bottom-lg: 1.5rem;
  --h2-font-size-xl: 3rem;
  --h2-line-height-xl: 1.16;
  --h2-font-weight-xl: 600;
  --h2-margin-bottom-xl: 1.5rem;
  --h2-font-size-xxl: 3rem;
  --h2-line-height-xxl: 1.16;
  --h2-font-weight-xxl: 600;
  --h2-margin-bottom-xxl: 1.5rem;
  --h3-font-size-xs: 2.2rem;
  --h3-line-height-xs: 1.16;
  --h3-font-weight-xs: 600;
  --h3-margin-bottom-xs: 1.5rem;
  --h3-font-size-sm: 2.3rem;
  --h3-line-height-sm: 1.16;
  --h3-font-weight-sm: 600;
  --h3-margin-bottom-sm: 1.5rem;
  --h3-font-size-md: 2.4rem;
  --h3-line-height-md: 1.16;
  --h3-font-weight-md: 600;
  --h3-margin-bottom-md: 1.5rem;
  --h3-font-size-lg: 2.5rem;
  --h3-line-height-lg: 1.16;
  --h3-font-weight-lg: 600;
  --h3-margin-bottom-lg: 1.5rem;
  --h3-font-size-xl: 2.5rem;
  --h3-line-height-xl: 1.16;
  --h3-font-weight-xl: 600;
  --h3-margin-bottom-xl: 1.5rem;
  --h3-font-size-xxl: 2.5rem;
  --h3-line-height-xxl: 1.16;
  --h3-font-weight-xxl: 600;
  --h3-margin-bottom-xxl: 1.5rem;
  --h4-font-size-xs: 2.25rem;
  --h4-line-height-xs: 1.16;
  --h4-font-weight-xs: 600;
  --h4-margin-bottom-xs: 1.5rem;
  --h4-font-size-sm: 2.25rem;
  --h4-line-height-sm: 1.16;
  --h4-font-weight-sm: 600;
  --h4-margin-bottom-sm: 1.5rem;
  --h4-font-size-md: 2.25rem;
  --h4-line-height-md: 1.16;
  --h4-font-weight-md: 600;
  --h4-margin-bottom-md: 1.5rem;
  --h4-font-size-lg: 2.25rem;
  --h4-line-height-lg: 1.16;
  --h4-font-weight-lg: 600;
  --h4-margin-bottom-lg: 1.5rem;
  --h4-font-size-xl: 2.25rem;
  --h4-line-height-xl: 1.16;
  --h4-font-weight-xl: 600;
  --h4-margin-bottom-xl: 1.5rem;
  --h4-font-size-xxl: 2.25rem;
  --h4-line-height-xxl: 1.16;
  --h4-font-weight-xxl: 600;
  --h4-margin-bottom-xxl: 1.5rem;
  --h5-font-size-xs: 1.875rem;
  --h5-line-height-xs: 1.16;
  --h5-font-weight-xs: 600;
  --h5-margin-bottom-xs: 1.5rem;
  --h5-font-size-sm: 1.875rem;
  --h5-line-height-sm: 1.16;
  --h5-font-weight-sm: 600;
  --h5-margin-bottom-sm: 1.5rem;
  --h5-font-size-md: 1.875rem;
  --h5-line-height-md: 1.16;
  --h5-font-weight-md: 600;
  --h5-margin-bottom-md: 1.5rem;
  --h5-font-size-lg: 1.875rem;
  --h5-line-height-lg: 1.16;
  --h5-font-weight-lg: 600;
  --h5-margin-bottom-lg: 1.5rem;
  --h5-font-size-xl: 1.875rem;
  --h5-line-height-xl: 1.16;
  --h5-font-weight-xl: 600;
  --h5-margin-bottom-xl: 1.5rem;
  --h5-font-size-xxl: 1.875rem;
  --h5-line-height-xxl: 1.16;
  --h5-font-weight-xxl: 600;
  --h5-margin-bottom-xxl: 1.5rem;
  --h6-font-size-xs: 1.5rem;
  --h6-line-height-xs: 1.16;
  --h6-font-weight-xs: 600;
  --h6-margin-bottom-xs: 1.5rem;
  --h6-font-size-sm: 1.5rem;
  --h6-line-height-sm: 1.16;
  --h6-font-weight-sm: 600;
  --h6-margin-bottom-sm: 1.5rem;
  --h6-font-size-md: 1.5rem;
  --h6-line-height-md: 1.16;
  --h6-font-weight-md: 600;
  --h6-margin-bottom-md: 1.5rem;
  --h6-font-size-lg: 1.5rem;
  --h6-line-height-lg: 1.16;
  --h6-font-weight-lg: 600;
  --h6-margin-bottom-lg: 1.5rem;
  --h6-font-size-xl: 1.5rem;
  --h6-line-height-xl: 1.16;
  --h6-font-weight-xl: 600;
  --h6-margin-bottom-xl: 1.5rem;
  --h6-font-size-xxl: 1.5rem;
  --h6-line-height-xxl: 1.16;
  --h6-font-weight-xxl: 600;
  --h6-margin-bottom-xxl: 1.5rem;
  --section-unit-xs: 4.6875rem;
  --section-unit-sm: 4.6875rem;
  --section-unit-md: 4.6875rem;
  --section-unit-lg: 4.6875rem;
  --section-unit-xl: 4.6875rem;
  --section-unit-xxl: 4.6875rem;
  --unit-xs: 1rem;
  --unit-sm: 1rem;
  --unit-md: 1rem;
  --unit-lg: 1rem;
  --unit-xl: 1rem;
  --unit-xxl: 1rem;
  --container-w-xs: 100%;
  --container-w-sm: 540px;
  --container-w-md: 720px;
  --container-w-lg: 960px;
  --container-w-xl: 1140px;
  --container-w-xxl: 1320px;
  --transition: 0.3s ease-in;
  --btn-radius: 0px;
  --border-radius: 4px;
}
:root {
  --section-unit: var(--section-unit-xs);
  --unit: var(--unit-xs);
  --container-w: var(--container-w-xs);
  --p-font-size: var(--p-font-size-xs);
  --p-font-weight: var(--p-font-weight-xs);
  --p-line-height: var(--p-line-height-xs);
  --p-margin-bottom: var(--p-margin-bottom-xs);
  --h1-font-size: var(--h1-font-size-xs);
  --h1-font-weight: var(--h1-font-weight-xs);
  --h1-line-height: var(--h1-line-height-xs);
  --h1-margin-bottom: var(--h1-margin-bottom-xs);
  --h2-font-size: var(--h2-font-size-xs);
  --h2-font-weight: var(--h2-font-weight-xs);
  --h2-line-height: var(--h2-line-height-xs);
  --h2-margin-bottom: var(--h2-margin-bottom-xs);
  --h3-font-size: var(--h3-font-size-xs);
  --h3-font-weight: var(--h3-font-weight-xs);
  --h3-line-height: var(--h3-line-height-xs);
  --h3-margin-bottom: var(--h3-margin-bottom-xs);
  --h4-font-size: var(--h4-font-size-xs);
  --h4-font-weight: var(--h4-font-weight-xs);
  --h4-line-height: var(--h4-line-height-xs);
  --h4-margin-bottom: var(--h4-margin-bottom-xs);
  --h5-font-size: var(--h5-font-size-xs);
  --h5-font-weight: var(--h5-font-weight-xs);
  --h5-line-height: var(--h5-line-height-xs);
  --h5-margin-bottom: var(--h5-margin-bottom-xs);
  --h6-font-size: var(--h6-font-size-xs);
  --h6-font-weight: var(--h6-font-weight-xs);
  --h6-line-height: var(--h6-line-height-xs);
  --h6-margin-bottom: var(--h6-margin-bottom-xs);
}
@media (min-width: 576px) {
  :root {
    --section-unit: var(--section-unit-sm);
    --unit: var(--unit-sm);
    --container-w: var(--container-w-sm);
    --p-font-size: var(--p-font-size-sm);
    --p-font-weight: var(--p-font-weight-sm);
    --p-line-height: var(--p-line-height-sm);
    --p-margin-bottom: var(--p-margin-bottom-sm);
    --h1-font-size: var(--h1-font-size-sm);
    --h1-font-weight: var(--h1-font-weight-sm);
    --h1-line-height: var(--h1-line-height-sm);
    --h1-margin-bottom: var(--h1-margin-bottom-sm);
    --h2-font-size: var(--h2-font-size-sm);
    --h2-font-weight: var(--h2-font-weight-sm);
    --h2-line-height: var(--h2-line-height-sm);
    --h2-margin-bottom: var(--h2-margin-bottom-sm);
    --h3-font-size: var(--h3-font-size-sm);
    --h3-font-weight: var(--h3-font-weight-sm);
    --h3-line-height: var(--h3-line-height-sm);
    --h3-margin-bottom: var(--h3-margin-bottom-sm);
    --h4-font-size: var(--h4-font-size-sm);
    --h4-font-weight: var(--h4-font-weight-sm);
    --h4-line-height: var(--h4-line-height-sm);
    --h4-margin-bottom: var(--h4-margin-bottom-sm);
    --h5-font-size: var(--h5-font-size-sm);
    --h5-font-weight: var(--h5-font-weight-sm);
    --h5-line-height: var(--h5-line-height-sm);
    --h5-margin-bottom: var(--h5-margin-bottom-sm);
    --h6-font-size: var(--h6-font-size-sm);
    --h6-font-weight: var(--h6-font-weight-sm);
    --h6-line-height: var(--h6-line-height-sm);
    --h6-margin-bottom: var(--h6-margin-bottom-sm);
  }
}
@media (min-width: 768px) {
  :root {
    --section-unit: var(--section-unit-md);
    --unit: var(--unit-md);
    --container-w: var(--container-w-md);
    --p-font-size: var(--p-font-size-md);
    --p-font-weight: var(--p-font-weight-md);
    --p-line-height: var(--p-line-height-md);
    --p-margin-bottom: var(--p-margin-bottom-md);
    --h1-font-size: var(--h1-font-size-md);
    --h1-font-weight: var(--h1-font-weight-md);
    --h1-line-height: var(--h1-line-height-md);
    --h1-margin-bottom: var(--h1-margin-bottom-md);
    --h2-font-size: var(--h2-font-size-md);
    --h2-font-weight: var(--h2-font-weight-md);
    --h2-line-height: var(--h2-line-height-md);
    --h2-margin-bottom: var(--h2-margin-bottom-md);
    --h3-font-size: var(--h3-font-size-md);
    --h3-font-weight: var(--h3-font-weight-md);
    --h3-line-height: var(--h3-line-height-md);
    --h3-margin-bottom: var(--h3-margin-bottom-md);
    --h4-font-size: var(--h4-font-size-md);
    --h4-font-weight: var(--h4-font-weight-md);
    --h4-line-height: var(--h4-line-height-md);
    --h4-margin-bottom: var(--h4-margin-bottom-md);
    --h5-font-size: var(--h5-font-size-md);
    --h5-font-weight: var(--h5-font-weight-md);
    --h5-line-height: var(--h5-line-height-md);
    --h5-margin-bottom: var(--h5-margin-bottom-md);
    --h6-font-size: var(--h6-font-size-md);
    --h6-font-weight: var(--h6-font-weight-md);
    --h6-line-height: var(--h6-line-height-md);
    --h6-margin-bottom: var(--h6-margin-bottom-md);
  }
}
@media (min-width: 992px) {
  :root {
    --section-unit: var(--section-unit-lg);
    --unit: var(--unit-lg);
    --container-w: var(--container-w-lg);
    --p-font-size: var(--p-font-size-lg);
    --p-font-weight: var(--p-font-weight-lg);
    --p-line-height: var(--p-line-height-lg);
    --p-margin-bottom: var(--p-margin-bottom-lg);
    --h1-font-size: var(--h1-font-size-lg);
    --h1-font-weight: var(--h1-font-weight-lg);
    --h1-line-height: var(--h1-line-height-lg);
    --h1-margin-bottom: var(--h1-margin-bottom-lg);
    --h2-font-size: var(--h2-font-size-lg);
    --h2-font-weight: var(--h2-font-weight-lg);
    --h2-line-height: var(--h2-line-height-lg);
    --h2-margin-bottom: var(--h2-margin-bottom-lg);
    --h3-font-size: var(--h3-font-size-lg);
    --h3-font-weight: var(--h3-font-weight-lg);
    --h3-line-height: var(--h3-line-height-lg);
    --h3-margin-bottom: var(--h3-margin-bottom-lg);
    --h4-font-size: var(--h4-font-size-lg);
    --h4-font-weight: var(--h4-font-weight-lg);
    --h4-line-height: var(--h4-line-height-lg);
    --h4-margin-bottom: var(--h4-margin-bottom-lg);
    --h5-font-size: var(--h5-font-size-lg);
    --h5-font-weight: var(--h5-font-weight-lg);
    --h5-line-height: var(--h5-line-height-lg);
    --h5-margin-bottom: var(--h5-margin-bottom-lg);
    --h6-font-size: var(--h6-font-size-lg);
    --h6-font-weight: var(--h6-font-weight-lg);
    --h6-line-height: var(--h6-line-height-lg);
    --h6-margin-bottom: var(--h6-margin-bottom-lg);
  }
}
@media (min-width: 1200px) {
  :root {
    --section-unit: var(--section-unit-xl);
    --unit: var(--unit-xl);
    --container-w: var(--container-w-xl);
    --p-font-size: var(--p-font-size-xl);
    --p-font-weight: var(--p-font-weight-xl);
    --p-line-height: var(--p-line-height-xl);
    --p-margin-bottom: var(--p-margin-bottom-xl);
    --h1-font-size: var(--h1-font-size-xl);
    --h1-font-weight: var(--h1-font-weight-xl);
    --h1-line-height: var(--h1-line-height-xl);
    --h1-margin-bottom: var(--h1-margin-bottom-xl);
    --h2-font-size: var(--h2-font-size-xl);
    --h2-font-weight: var(--h2-font-weight-xl);
    --h2-line-height: var(--h2-line-height-xl);
    --h2-margin-bottom: var(--h2-margin-bottom-xl);
    --h3-font-size: var(--h3-font-size-xl);
    --h3-font-weight: var(--h3-font-weight-xl);
    --h3-line-height: var(--h3-line-height-xl);
    --h3-margin-bottom: var(--h3-margin-bottom-xl);
    --h4-font-size: var(--h4-font-size-xl);
    --h4-font-weight: var(--h4-font-weight-xl);
    --h4-line-height: var(--h4-line-height-xl);
    --h4-margin-bottom: var(--h4-margin-bottom-xl);
    --h5-font-size: var(--h5-font-size-xl);
    --h5-font-weight: var(--h5-font-weight-xl);
    --h5-line-height: var(--h5-line-height-xl);
    --h5-margin-bottom: var(--h5-margin-bottom-xl);
    --h6-font-size: var(--h6-font-size-xl);
    --h6-font-weight: var(--h6-font-weight-xl);
    --h6-line-height: var(--h6-line-height-xl);
    --h6-margin-bottom: var(--h6-margin-bottom-xl);
  }
}
@media (min-width: 1400px) {
  :root {
    --section-unit: var(--section-unit-xxl);
    --unit: var(--unit-xxl);
    --container-w: var(--container-w-xxl);
    --p-font-size: var(--p-font-size-xxl);
    --p-font-weight: var(--p-font-weight-xxl);
    --p-line-height: var(--p-line-height-xxl);
    --p-margin-bottom: var(--p-margin-bottom-xxl);
    --h1-font-size: var(--h1-font-size-xxl);
    --h1-font-weight: var(--h1-font-weight-xxl);
    --h1-line-height: var(--h1-line-height-xxl);
    --h1-margin-bottom: var(--h1-margin-bottom-xxl);
    --h2-font-size: var(--h2-font-size-xxl);
    --h2-font-weight: var(--h2-font-weight-xxl);
    --h2-line-height: var(--h2-line-height-xxl);
    --h2-margin-bottom: var(--h2-margin-bottom-xxl);
    --h3-font-size: var(--h3-font-size-xxl);
    --h3-font-weight: var(--h3-font-weight-xxl);
    --h3-line-height: var(--h3-line-height-xxl);
    --h3-margin-bottom: var(--h3-margin-bottom-xxl);
    --h4-font-size: var(--h4-font-size-xxl);
    --h4-font-weight: var(--h4-font-weight-xxl);
    --h4-line-height: var(--h4-line-height-xxl);
    --h4-margin-bottom: var(--h4-margin-bottom-xxl);
    --h5-font-size: var(--h5-font-size-xxl);
    --h5-font-weight: var(--h5-font-weight-xxl);
    --h5-line-height: var(--h5-line-height-xxl);
    --h5-margin-bottom: var(--h5-margin-bottom-xxl);
    --h6-font-size: var(--h6-font-size-xxl);
    --h6-font-weight: var(--h6-font-weight-xxl);
    --h6-line-height: var(--h6-line-height-xxl);
    --h6-margin-bottom: var(--h6-margin-bottom-xxl);
  }
}
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* //// NINE Imports ///////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* //// Typography ////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
body {
  font-family: var(--font-secondary);
  color: var(--dark, #212529);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .font-display {
  font-family: var(--font-primary);
  position: relative;
}
i {
  font-family: var(--font-tertiary);
}
a {
  color: var(--primary);
  text-decoration: none;
}
a:hover {
  color: var(--tertiary);
}
.text-primary {
  color: var(--primary);
}
.text-secondary {
  color: var(--secondary);
}
.text-tertiary {
  color: var(--tertiary);
}
.text-quaternary {
  color: var(--quaternary);
}
.text-light {
  color: var(--light);
}
.text-gray {
  color: var(--gray);
}
.text-dark {
  color: var(--dark);
}
.text-dark-gray {
  color: var(--dark-gray);
}
.text-ninthroot {
  font-weight: 700;
  background: linear-gradient(230deg, #ff4e6c 0%, #f26897 25%, #3abfe0 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
p, address {
  font-size: var(--p-font-size);
  line-height: var(--p-line-height);
  font-weight: var(--p-font-weight);
  margin-bottom: var(--p-margin-bottom);
}
p.lead {
  font-size: calc(var(--p-font-size) + 0.2rem);
}
h1, .h1 {
  font-size: var(--h1-font-size);
  font-weight: var(--h1-font-weight);
  line-height: var(--h1-line-height);
  margin-bottom: var(--h1-margin-bottom);
  --element-line-height: var(--h1-line-height);
}
h2, .h2 {
  font-size: var(--h2-font-size);
  font-weight: var(--h2-font-weight);
  line-height: var(--h2-line-height);
  margin-bottom: var(--h2-margin-bottom);
  --element-line-height: var(--h2-line-height);
}
h3, .h3 {
  font-size: var(--h3-font-size);
  font-weight: var(--h3-font-weight);
  line-height: var(--h3-line-height);
  margin-bottom: var(--h3-margin-bottom);
  --element-line-height: var(--h3-line-height);
}
h4, .h4 {
  font-size: var(--h4-font-size);
  font-weight: var(--h4-font-weight);
  line-height: var(--h4-line-height);
  margin-bottom: var(--h4-margin-bottom);
  --element-line-height: var(--h4-line-height);
}
h5, .h5 {
  font-size: var(--h5-font-size);
  font-weight: var(--h5-font-weight);
  line-height: var(--h5-line-height);
  margin-bottom: var(--h5-margin-bottom);
  --element-line-height: var(--h5-line-height);
}
h6, .h6 {
  font-size: var(--h6-font-size);
  font-weight: var(--h6-font-weight);
  line-height: var(--h6-line-height);
  margin-bottom: var(--h6-margin-bottom);
  --element-line-height: var(--h6-line-height);
}
h1 span.sub, h2 span.sub, h3 span.sub, h4 span.sub, h5 span.sub, h6 span.sub, .h1 span.sub, .h2 span.sub, .h3 span.sub, .h4 span.sub, .h5 span.sub, .h6 span.sub {
  display: block;
  font-size: 60%;
  opacity: 0.7;
  margin-top: 0px;
}
.display-1 {
  font-size: calc(1rem * 0.25);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-2 {
  font-size: calc(1rem * 0.5);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-3 {
  font-size: calc(1rem * 0.75);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-4 {
  font-size: calc(1rem * 1);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-5 {
  font-size: calc(1rem * 1.25);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-6 {
  font-size: calc(1rem * 1.5);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-7 {
  font-size: calc(1rem * 1.75);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-8 {
  font-size: calc(1rem * 2);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-9 {
  font-size: calc(1rem * 2.25);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-10 {
  font-size: calc(1rem * 2.5);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-11 {
  font-size: calc(1rem * 2.75);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-12 {
  font-size: calc(1rem * 3);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-13 {
  font-size: calc(1rem * 3.25);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-14 {
  font-size: calc(1rem * 3.5);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-15 {
  font-size: calc(1rem * 3.75);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-16 {
  font-size: calc(1rem * 4);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-17 {
  font-size: calc(1rem * 4.25);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-18 {
  font-size: calc(1rem * 4.5);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-19 {
  font-size: calc(1rem * 4.75);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-20 {
  font-size: calc(1rem * 5);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-21 {
  font-size: calc(1rem * 5.25);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-22 {
  font-size: calc(1rem * 5.5);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-23 {
  font-size: calc(1rem * 5.75);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-24 {
  font-size: calc(1rem * 6);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-25 {
  font-size: calc(1rem * 6.25);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-26 {
  font-size: calc(1rem * 6.5);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-27 {
  font-size: calc(1rem * 6.75);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-28 {
  font-size: calc(1rem * 7);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-29 {
  font-size: calc(1rem * 7.25);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-30 {
  font-size: calc(1rem * 7.5);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-31 {
  font-size: calc(1rem * 7.75);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-32 {
  font-size: calc(1rem * 8);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-33 {
  font-size: calc(1rem * 8.25);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-34 {
  font-size: calc(1rem * 8.5);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-35 {
  font-size: calc(1rem * 8.75);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-36 {
  font-size: calc(1rem * 9);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-37 {
  font-size: calc(1rem * 9.25);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-38 {
  font-size: calc(1rem * 9.5);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-39 {
  font-size: calc(1rem * 9.75);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
.display-40 {
  font-size: calc(1rem * 10);
  font-weight: 300;
  line-height: var(--element-line-height, 1.2);
}
@media (min-width: 576px) {
  .display-sm-1 {
    font-size: calc(1rem * 0.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-2 {
    font-size: calc(1rem * 0.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-3 {
    font-size: calc(1rem * 0.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-4 {
    font-size: calc(1rem * 1);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-5 {
    font-size: calc(1rem * 1.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-6 {
    font-size: calc(1rem * 1.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-7 {
    font-size: calc(1rem * 1.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-8 {
    font-size: calc(1rem * 2);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-9 {
    font-size: calc(1rem * 2.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-10 {
    font-size: calc(1rem * 2.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-11 {
    font-size: calc(1rem * 2.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-12 {
    font-size: calc(1rem * 3);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-13 {
    font-size: calc(1rem * 3.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-14 {
    font-size: calc(1rem * 3.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-15 {
    font-size: calc(1rem * 3.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-16 {
    font-size: calc(1rem * 4);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-17 {
    font-size: calc(1rem * 4.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-18 {
    font-size: calc(1rem * 4.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-19 {
    font-size: calc(1rem * 4.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-20 {
    font-size: calc(1rem * 5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-21 {
    font-size: calc(1rem * 5.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-22 {
    font-size: calc(1rem * 5.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-23 {
    font-size: calc(1rem * 5.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-24 {
    font-size: calc(1rem * 6);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-25 {
    font-size: calc(1rem * 6.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-26 {
    font-size: calc(1rem * 6.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-27 {
    font-size: calc(1rem * 6.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-28 {
    font-size: calc(1rem * 7);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-29 {
    font-size: calc(1rem * 7.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-30 {
    font-size: calc(1rem * 7.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-31 {
    font-size: calc(1rem * 7.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-32 {
    font-size: calc(1rem * 8);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-33 {
    font-size: calc(1rem * 8.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-34 {
    font-size: calc(1rem * 8.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-35 {
    font-size: calc(1rem * 8.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-36 {
    font-size: calc(1rem * 9);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-37 {
    font-size: calc(1rem * 9.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-38 {
    font-size: calc(1rem * 9.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-39 {
    font-size: calc(1rem * 9.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-sm-40 {
    font-size: calc(1rem * 10);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
}
@media (min-width: 768px) {
  .display-md-1 {
    font-size: calc(1rem * 0.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-2 {
    font-size: calc(1rem * 0.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-3 {
    font-size: calc(1rem * 0.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-4 {
    font-size: calc(1rem * 1);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-5 {
    font-size: calc(1rem * 1.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-6 {
    font-size: calc(1rem * 1.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-7 {
    font-size: calc(1rem * 1.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-8 {
    font-size: calc(1rem * 2);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-9 {
    font-size: calc(1rem * 2.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-10 {
    font-size: calc(1rem * 2.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-11 {
    font-size: calc(1rem * 2.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-12 {
    font-size: calc(1rem * 3);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-13 {
    font-size: calc(1rem * 3.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-14 {
    font-size: calc(1rem * 3.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-15 {
    font-size: calc(1rem * 3.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-16 {
    font-size: calc(1rem * 4);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-17 {
    font-size: calc(1rem * 4.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-18 {
    font-size: calc(1rem * 4.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-19 {
    font-size: calc(1rem * 4.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-20 {
    font-size: calc(1rem * 5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-21 {
    font-size: calc(1rem * 5.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-22 {
    font-size: calc(1rem * 5.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-23 {
    font-size: calc(1rem * 5.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-24 {
    font-size: calc(1rem * 6);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-25 {
    font-size: calc(1rem * 6.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-26 {
    font-size: calc(1rem * 6.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-27 {
    font-size: calc(1rem * 6.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-28 {
    font-size: calc(1rem * 7);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-29 {
    font-size: calc(1rem * 7.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-30 {
    font-size: calc(1rem * 7.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-31 {
    font-size: calc(1rem * 7.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-32 {
    font-size: calc(1rem * 8);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-33 {
    font-size: calc(1rem * 8.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-34 {
    font-size: calc(1rem * 8.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-35 {
    font-size: calc(1rem * 8.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-36 {
    font-size: calc(1rem * 9);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-37 {
    font-size: calc(1rem * 9.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-38 {
    font-size: calc(1rem * 9.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-39 {
    font-size: calc(1rem * 9.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-md-40 {
    font-size: calc(1rem * 10);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
}
@media (min-width: 992px) {
  .display-lg-1 {
    font-size: calc(1rem * 0.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-2 {
    font-size: calc(1rem * 0.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-3 {
    font-size: calc(1rem * 0.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-4 {
    font-size: calc(1rem * 1);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-5 {
    font-size: calc(1rem * 1.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-6 {
    font-size: calc(1rem * 1.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-7 {
    font-size: calc(1rem * 1.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-8 {
    font-size: calc(1rem * 2);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-9 {
    font-size: calc(1rem * 2.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-10 {
    font-size: calc(1rem * 2.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-11 {
    font-size: calc(1rem * 2.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-12 {
    font-size: calc(1rem * 3);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-13 {
    font-size: calc(1rem * 3.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-14 {
    font-size: calc(1rem * 3.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-15 {
    font-size: calc(1rem * 3.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-16 {
    font-size: calc(1rem * 4);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-17 {
    font-size: calc(1rem * 4.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-18 {
    font-size: calc(1rem * 4.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-19 {
    font-size: calc(1rem * 4.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-20 {
    font-size: calc(1rem * 5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-21 {
    font-size: calc(1rem * 5.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-22 {
    font-size: calc(1rem * 5.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-23 {
    font-size: calc(1rem * 5.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-24 {
    font-size: calc(1rem * 6);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-25 {
    font-size: calc(1rem * 6.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-26 {
    font-size: calc(1rem * 6.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-27 {
    font-size: calc(1rem * 6.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-28 {
    font-size: calc(1rem * 7);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-29 {
    font-size: calc(1rem * 7.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-30 {
    font-size: calc(1rem * 7.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-31 {
    font-size: calc(1rem * 7.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-32 {
    font-size: calc(1rem * 8);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-33 {
    font-size: calc(1rem * 8.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-34 {
    font-size: calc(1rem * 8.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-35 {
    font-size: calc(1rem * 8.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-36 {
    font-size: calc(1rem * 9);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-37 {
    font-size: calc(1rem * 9.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-38 {
    font-size: calc(1rem * 9.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-39 {
    font-size: calc(1rem * 9.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-lg-40 {
    font-size: calc(1rem * 10);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
}
@media (min-width: 1200px) {
  .display-xl-1 {
    font-size: calc(1rem * 0.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-2 {
    font-size: calc(1rem * 0.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-3 {
    font-size: calc(1rem * 0.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-4 {
    font-size: calc(1rem * 1);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-5 {
    font-size: calc(1rem * 1.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-6 {
    font-size: calc(1rem * 1.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-7 {
    font-size: calc(1rem * 1.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-8 {
    font-size: calc(1rem * 2);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-9 {
    font-size: calc(1rem * 2.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-10 {
    font-size: calc(1rem * 2.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-11 {
    font-size: calc(1rem * 2.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-12 {
    font-size: calc(1rem * 3);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-13 {
    font-size: calc(1rem * 3.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-14 {
    font-size: calc(1rem * 3.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-15 {
    font-size: calc(1rem * 3.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-16 {
    font-size: calc(1rem * 4);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-17 {
    font-size: calc(1rem * 4.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-18 {
    font-size: calc(1rem * 4.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-19 {
    font-size: calc(1rem * 4.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-20 {
    font-size: calc(1rem * 5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-21 {
    font-size: calc(1rem * 5.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-22 {
    font-size: calc(1rem * 5.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-23 {
    font-size: calc(1rem * 5.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-24 {
    font-size: calc(1rem * 6);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-25 {
    font-size: calc(1rem * 6.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-26 {
    font-size: calc(1rem * 6.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-27 {
    font-size: calc(1rem * 6.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-28 {
    font-size: calc(1rem * 7);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-29 {
    font-size: calc(1rem * 7.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-30 {
    font-size: calc(1rem * 7.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-31 {
    font-size: calc(1rem * 7.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-32 {
    font-size: calc(1rem * 8);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-33 {
    font-size: calc(1rem * 8.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-34 {
    font-size: calc(1rem * 8.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-35 {
    font-size: calc(1rem * 8.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-36 {
    font-size: calc(1rem * 9);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-37 {
    font-size: calc(1rem * 9.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-38 {
    font-size: calc(1rem * 9.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-39 {
    font-size: calc(1rem * 9.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xl-40 {
    font-size: calc(1rem * 10);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
}
@media (min-width: 1400px) {
  .display-xxl-1 {
    font-size: calc(1rem * 0.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-2 {
    font-size: calc(1rem * 0.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-3 {
    font-size: calc(1rem * 0.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-4 {
    font-size: calc(1rem * 1);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-5 {
    font-size: calc(1rem * 1.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-6 {
    font-size: calc(1rem * 1.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-7 {
    font-size: calc(1rem * 1.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-8 {
    font-size: calc(1rem * 2);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-9 {
    font-size: calc(1rem * 2.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-10 {
    font-size: calc(1rem * 2.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-11 {
    font-size: calc(1rem * 2.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-12 {
    font-size: calc(1rem * 3);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-13 {
    font-size: calc(1rem * 3.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-14 {
    font-size: calc(1rem * 3.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-15 {
    font-size: calc(1rem * 3.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-16 {
    font-size: calc(1rem * 4);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-17 {
    font-size: calc(1rem * 4.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-18 {
    font-size: calc(1rem * 4.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-19 {
    font-size: calc(1rem * 4.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-20 {
    font-size: calc(1rem * 5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-21 {
    font-size: calc(1rem * 5.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-22 {
    font-size: calc(1rem * 5.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-23 {
    font-size: calc(1rem * 5.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-24 {
    font-size: calc(1rem * 6);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-25 {
    font-size: calc(1rem * 6.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-26 {
    font-size: calc(1rem * 6.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-27 {
    font-size: calc(1rem * 6.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-28 {
    font-size: calc(1rem * 7);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-29 {
    font-size: calc(1rem * 7.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-30 {
    font-size: calc(1rem * 7.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-31 {
    font-size: calc(1rem * 7.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-32 {
    font-size: calc(1rem * 8);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-33 {
    font-size: calc(1rem * 8.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-34 {
    font-size: calc(1rem * 8.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-35 {
    font-size: calc(1rem * 8.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-36 {
    font-size: calc(1rem * 9);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-37 {
    font-size: calc(1rem * 9.25);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-38 {
    font-size: calc(1rem * 9.5);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-39 {
    font-size: calc(1rem * 9.75);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
  .display-xxl-40 {
    font-size: calc(1rem * 10);
    font-weight: 300;
    line-height: var(--element-line-height, 1.2);
  }
}
.font-weight-light {
  font-weight: 200;
}
.font-weight-regular {
  font-weight: 400;
}
.font-weight-semi-bold {
  font-weight: 500;
}
.font-weight-bold {
  font-weight: 600;
}
.weight-100 {
  font-weight: 100 !important;
}
.weight-200 {
  font-weight: 200 !important;
}
.weight-300 {
  font-weight: 300 !important;
}
.weight-400 {
  font-weight: 400 !important;
}
.weight-500 {
  font-weight: 500 !important;
}
.weight-600 {
  font-weight: 600 !important;
}
.weight-700 {
  font-weight: 700 !important;
}
.weight-800 {
  font-weight: 800 !important;
}
.weight-900 {
  font-weight: 900 !important;
}
/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* //// Header ///////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
header {
  --nav-height: var(--nav-mobile-height);
  --nav-logo-width: var(--nav-logo-mobile-width);
  --nav-logo-offset: var(--nav-logo-mobile-offset);
  --nav-font-size: var(--nav-mobile-font-size);
}
body {
  --nav-tert-height: 0px;
}
@media (min-width: 992px) {
  header {
    --nav-height: var(--nav-desktop-height);
    --nav-logo-width: var(--nav-logo-desktop-width);
    --nav-logo-offset: var(--nav-logo-desktop-offset);
    --nav-font-size: var(--nav-desktop-font-size);
  }
  header.scrolled {
    --nav-height: var(--nav-scrolled-height);
    --nav-logo-width: var(--nav-logo-desktop-scrolled-width);
    --nav-logo-offset: var(--nav-logo-desktop-scrolled-offset);
    --nav-font-size: var(--nav-desktop-scrolled-font-size);
  }
  body.h-show-tert-nav {
    --nav-tert-height: var(--nav-tert-desktop-height);
  }
}
header {
  width: 100%;
  position: fixed;
  z-index: 9;
  background-color: var(--nav-color);
  font-size: 1rem;
}
header .main-nav, header .tert-nav {
  width: 100%;
  display: flex;
  align-items: center;
}
header .main-nav .items {
  transition: all var(--transition);
  height: var(--nav-height);
  flex-grow: 1;
  justify-content: flex-end;
}
.main-nav .items, .main-nav .items nav {
  display: flex;
}
header .logo {
  display: flex;
  align-items: center;
  width: var(--nav-logo-width);
  margin-bottom: var(--nav-logo-offset);
  transition: all var(--transition);
  position: relative;
}
header .logo a {
  position: absolute;
  width: 100%;
}
header .logo a img {
  width: 100%;
}
header .logo .mobile {
  display: none;
}
body.h-show-mobile-logo header .logo .mobile {
  display: block;
}
body.h-show-mobile-logo header .logo .desktop {
  display: none;
}
@media (min-width: 992px) {
  body.h-show-mobile-logo header .logo .mobile {
    display: none;
  }
  body.h-show-mobile-logo header .logo .desktop {
    display: block;
  }
}
header .logo a picture img {
  width: 100%;
}
header .nav-container {
  max-width: unset;
}
header .main-nav {
  justify-content: flex-start;
}
header .main-nav nav {
  position: fixed;
  left: 0vw;
  top: var(--top-bar, 0px);
  transition: var(--transition);
  overflow-y: hidden;
  display: flex;
  justify-content: center;
  width: 100vw;
  height: 0vh;
  background: var(--nav-mobile-dropdown-color);
}
header .main-nav .items nav ul {
  padding: 0px;
  list-style: none;
  margin: 0 20px;
}
header .main-nav .items nav li {
  position: relative;
}
header .main-nav .items nav ul li a {
  color: var(--nav-mobile-text-color);
  text-transform: var(--nav-letter-case);
  text-decoration: none;
  line-height: 1;
  display: flex;
  justify-content: space-between;
  padding: 15px 12px;
}
header .main-nav .items nav li a i {
  font-size: 0.8em;
  display: flex;
  align-items: center;
}
header .main-nav .items nav li a i:not(.icon) {
  margin-left: 0.5em;
}
header .main-nav .items nav ul.level-2 li:last-child {
  border-bottom: none;
}
header .main-nav nav .level-1 {
  position: absolute;
  top: var(--nav-height);
  transition: all var(--transition);
  width: var(--nav-mobile-width);
}
header .main-nav .items nav .level-1 > li > a {
  width: 100%;
  font-size: var(--nav-font-size);
}
header .main-nav .items nav .level-2 li a {
  font-size: 1rem;
}
header .items nav ul li a.parent i {
  transition: var(--transition);
}
header .items nav ul li a.parent.open i {
  transform: scaleY(-1);
}
header .main-nav .item-append {
  display: flex;
  align-items: center;
  position: absolute;
  right: calc(var(--nav-height) - 20px);
  height: var(--nav-height);
  transition: height var(--transition);
}
header .main-nav .items .item-append a span {
  text-decoration: none;
  line-height: 1;
}
header .main-nav .items .item-append a {
  max-height: 100%;
}
header .main-nav .items .item-append a:not(:last-child) {
  margin-right: 0.8rem;
}
header .main-nav .mobile-nav-trigger {
  position: absolute;
  right: 0px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: var(--nav-height);
  width: calc(var(--nav-height) - 20px);
}
header .main-nav .mobile-nav-trigger:hover {
  cursor: pointer;
}
header .main-nav .mobile-nav-trigger i {
  position: absolute;
  transition: var(--transition);
}
header .main-nav .mobile-nav-trigger .open-icon {
  opacity: 1;
  font-size: var(--nav-mobile-trigger-open-font-size);
  color: var(--nav-mobile-trigger-open-color);
}
header .main-nav .mobile-nav-trigger .close-icon {
  opacity: 0;
  font-size: var(--nav-mobile-trigger-close-font-size);
  color: var(--nav-mobile-trigger-close-color);
}
header.open .main-nav .mobile-nav-trigger .close-icon {
  opacity: 1;
}
header.open .main-nav .mobile-nav-trigger .open-icon {
  opacity: 0;
}
header.open .main-nav nav {
  height: calc(100vh - var(--top-bar, 0px));
  overflow-y: scroll;
}
header .main-nav .on-open-only, header .main-nav .on-close-only {
  display: none;
}
@media (max-width: 992px) {
  header:not(.open) .main-nav .on-close-only {
    display: block;
  }
  header.open .main-nav .on-open-only {
    display: block;
  }
}
header .tert-nav {
  display: none;
}
header .tert-nav > .container {
  display: flex;
  justify-content: flex-end;
}
body.h-show-tert-nav .tert-nav {
  transition: var(--transition);
  border-bottom: 1px solid #eeeeee29;
  background: linear-gradient(135deg, white 2%, white 28%, white 100%);
}
body.h-show-tert-nav.scrolled:not(.h-sticky-tert) .tert-nav {
  margin-top: calc(calc(var(--nav-tert-height) * -1) - 1px);
}
body.h-show-tert-nav .tert-nav a {
  height: var(--nav-tert-height);
  padding: 0 18px;
  display: flex;
  align-items: center;
  color: var(--nav-tert-text-color);
  font-size: var(--nav-tert-font);
  text-transform: var(--nav-tert-letter-case);
}
body.h-show-tert-nav .tert-nav a:not(:last-child) {
  border-right: 1px solid #eeeeee29;
}
body.h-show-tert-nav .tert-nav a:last-child {
  padding-right: 0px;
}
body.h-show-tert-nav .tert-nav a:hover {
  text-decoration: var(--nav-tert-text-hover-text-decoration);
  color: var(--nav-tert-text-hover-color);
  background-color: var(--nav-tert-background-hover-color);
}
@media (min-width: 992px) {
  header .main-nav .mobile-nav-trigger {
    display: none;
  }
  header .tert-nav {
    display: block;
  }
  header .main-nav .items nav .level-1 {
    top: 0px;
  }
  header .nav-container {
    max-width: var(--nav-width);
  }
  header .main-nav .items nav {
    position: relative;
    width: unset;
    height: unset;
    left: unset;
    overflow-y: unset;
    background: none;
    transition: unset;
    top: 0px;
  }
  header .main-nav .items .item-append {
    position: relative;
    right: unset;
  }
  header .main-nav {
    position: relative;
    justify-content: flex-start;
  }
  header .main-nav .items {
    justify-content: flex-end;
  }
  header .main-nav .items nav {
    padding: 0px 20px;
  }
  header .main-nav .items nav ul {
    margin: 0px;
    padding: 0px;
  }
  header .main-nav .items nav .level-1 > li > a {
    color: var(--nav-text-color);
    font-size: var(--nav-font-size);
    transition: var(--transition);
  }
  header .main-nav .items nav .level-2 li a:not(.btn) {
    font-size: var(--nav-dropdown-font-size);
    color: var(--nav-dropdown-text-color);
  }
  header .main-nav .items nav > ul > li > a {
    padding: 0 var(--nav-desktop-page-padding);
    transition: padding var(--transition);
  }
  header.scrolled .main-nav .items nav > ul > li > a {
    padding: 0 var(--nav-desktop-scrolled-page-padding);
  }
  header .main-nav .items nav li a:hover, header .main-nav .items nav li a.over {
    transition: var(--transition);
  }
  header .main-nav .items nav .level-1 > li > a:hover, header .main-nav .items nav .level-1 > li > a.over {
    color: var(--nav-hover-text-color);
    background-color: var(--nav-hover-effect-color);
  }
  header .main-nav .items nav .level-2 li a:hover, header .main-nav .items nav .level-2 li a.over {
    color: var(--nav-hover-dropdown-text-color);
    background-color: var(--nav-hover-dropdown-effect-color);
  }
  header .logo {
    left: 0px;
  }
  header .main-nav .items nav .level-1 {
    height: var(--nav-height);
    width: unset;
    display: flex;
    flex-direction: row;
    align-items: center;
    position: relative;
  }
  header .main-nav .items nav .level-1 > li {
    border: unset;
  }
  header .main-nav .items nav .level-1 > li, header .main-nav .items nav .level-1 > li:not(.mega) a, header .main-nav .items nav .level-1 > li.mega > a {
    height: 100%;
    display: flex;
    align-items: center;
  }
  header .main-nav .items nav [class^="level-"]:not(.level-1) {
    position: absolute;
    width: 230px;
    background-color: var(--nav-dropdown-color);
  }
  header .main-nav .items nav .level-1 [class^="level-"], header .main-nav .items nav .level-1 .level-2 li:last-child, header .main-nav .items nav .level-1 .level-2 li:last-child a {
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
  }
  header .main-nav .items nav .level-2 {
    top: var(--nav-height);
  }
  header .main-nav .items nav .flyout.right > .level-2 {
    left: 0px;
  }
  header .main-nav .items nav .flyout.left > .level-2 {
    right: 0px;
  }
  header .main-nav .items nav .level-2 li a {
    padding: 12px 10px;
  }
  header .main-nav .items nav .level-2 li a:not(:first-child) {
    border-top: 1px solid rgba(0, 0, 0, 0.05);
  }
  header .main-nav .items nav .level-2 li:first-child {
    border-top: 2px var(--secondary) solid;
  }
  header .main-nav .items nav [class^="level-"]:not(.level-1):not(.level-2) {
    top: -2px;
  }
  header .main-nav .items nav .flyout.right > [class^="level-"]:not(.level-2) {
    left: 100%;
  }
  header .main-nav .items nav .flyout.left > [class^="level-"]:not(.level-2) {
    right: 100%;
  }
  header .main-nav .items nav ul li a.parent i {
    transition: transform var(--transition);
  }
  header .main-nav .items nav .level-1 > li > a.parent.over i {
    transform: scaleY(-1);
  }
  header .main-nav .items nav [class^="level-"]:not(.level-1) > li > a.parent i {
    transform: rotate(-90deg);
  }
  header .main-nav .items nav [class^="level-"]:not(.level-1) > li > a.parent.over i {
    transform: rotate(-90deg) scaleY(-1);
  }
  body.h-show-tert-nav .tert-nav {
    display: flex;
  }
}
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* //// LAYOUT ////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
html {
  overflow-x: hidden;
}
body {
  background-color: white;
  overflow-x: hidden;
}
section {
  position: relative;
  margin: 0;
  padding: var(--section-unit) 0;
  background-color: #fff;
  /* default */
}
section.half-pad {
  padding: calc(var(--section-unit) / 2) 0;
}
main > section:first-of-type, main section.first-section {
  padding-top: calc(var(--nav-mobile-height) + var(--nav-tert-height) + var(--top-bar, 0px) + var(--section-unit));
}
main > section.half-pad:first-of-type, main section.half-pad.first-section {
  padding-top: calc(var(--nav-mobile-height) + var(--nav-tert-height) + var(--top-bar, 0px) + calc(var(--section-unit) / 2));
}
@media (min-width: 992px) {
  main > section:first-of-type, main section.first-section {
    padding-top: calc(var(--nav-desktop-height) + var(--nav-tert-height) + var(--top-bar, 0px) + var(--section-unit));
  }
  main > section.half-pad:first-of-type, main section.half-pad.first-section {
    padding-top: calc(var(--nav-desktop-height) + var(--nav-tert-height) + var(--top-bar, 0px) + calc(var(--section-unit) / 2));
  }
}
section.bg-overlay {
  display: flex;
  justify-content: center;
  padding: 0px !important;
}
section.bg-overlay > .overlay {
  display: flex;
  align-items: center;
  width: 100%;
  padding: var(--section-unit) 0;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.5) 49%, rgba(0, 0, 0, 0.6) 100%);
  color: #fff;
}
main > section.bg-overlay.overlay-light > .overlay {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.5) 49%, rgba(0, 0, 0, 0.3) 100%);
}
main > section.bg-overlay:first-of-type > .overlay {
  padding-top: calc(var(--nav-mobile-height) + var(--nav-tert-height) + var(--top-bar, 0px) + var(--section-unit));
  padding-bottom: var(--section-unit);
}
@media (min-width: 992px) {
  main > section.bg-overlay:first-of-type > .overlay {
    padding-top: calc(var(--nav-desktop-height) + var(--nav-tert-height) + var(--top-bar, 0px) + var(--section-unit));
    padding-bottom: var(--section-unit);
  }
}
@media (max-width: 767px) {
  section.mobile-overlay::before {
    content: "";
    display: block;
    width: 100%;
    position: absolute;
    top: 0px;
    bottom: 0px;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.5) 49%, rgba(0, 0, 0, 0.6) 100%);
  }
  section.mobile-overlay.overlay-light::before {
    background: #ffffffba;
  }
}
@media (min-width: 992px) {
  .overlap-top {
    margin-top: calc(calc(var(--section-unit) * -1) * 1.5);
  }
}
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* //// Buttons ///////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.btn {
  border-radius: var(--btn-radius);
  white-space: normal;
  -webkit-box-shadow: none;
  box-shadow: none;
  font-family: var(--font-primary);
}
.btn-lg {
  padding: 0.3rem 1.8rem;
}
.btn-icon {
  position: relative;
  overflow: hidden;
}
.btn-icon:not(.icon-right) {
  padding-left: 45px;
}
.btn-icon.icon-right {
  padding-right: 45px;
}
.btn-icon i {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  height: 100%;
  width: 35px;
  top: 0;
  background-color: rgba(0, 0, 0, 0.13);
}
.btn-icon:not(.icon-right) i {
  left: 0;
  border-right: 1px solid transparent;
}
.btn-icon.icon-right i {
  right: 0;
  border-left: 1px solid transparent;
}
.btn-count {
  position: relative;
  overflow: hidden;
  padding-left: 0px !important;
}
.btn-count span.count {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  height: 100%;
  width: auto;
  top: 0;
  left: 0;
  margin-right: 10px;
  padding: 0 8px;
  font-weight: bold;
  background-color: rgba(0, 0, 0, 0.13);
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
}
.btn-count span.count {
  border-right: 1px solid transparent;
}
.btn-sub span.sub {
  display: block;
  font-size: 60%;
  line-height: 61%;
  text-transform: uppercase;
  opacity: 0.7;
}
.btn-primary {
  background-color: var(--primary);
  border-color: var(--primary);
}
.btn-primary:hover, .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
  color: #fff;
  background-color: var(--primary);
  border-color: var(--primary);
  box-shadow: 0 0 0 0.2rem var(--primary-rgba-translucent);
}
.btn-primary.focus, .btn-primary:focus {
  box-shadow: 0 0 0 0.2rem var(--primary-rgba-translucent);
  background: var(--primary);
  border-color: var(--primary);
}
.btn-outline-primary {
  color: var(--primary);
  border-color: var(--primary);
  border-width: 2px;
  background: transparent;
}
.btn-outline-primary:hover, .btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show > .btn-outline-primary.dropdown-toggle, .btn-outline-primary.focus, .btn-outline-primary:focus {
  color: #fff;
  background-color: var(--primary);
  border-color: var(--primary);
  box-shadow: 0 0 0 0.2rem var(--primary-rgba-translucent);
}
.btn-outline-primary.btn-icon i {
  color: #fff;
  background-color: rgb(var(--primary-rgb));
}
.btn-outline-primary.btn-icon:hover i {
  background-color: rgba(0, 0, 0, 0.13);
}
/* If color primary is light then change text color to dark */
.btn-secondary {
  background-color: var(--secondary);
  border-color: var(--secondary);
}
.btn-secondary:hover, .btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show > .btn-secondary.dropdown-toggle {
  color: #fff;
  background-color: var(--secondary);
  border-color: var(--secondary);
  box-shadow: 0 0 0 0.2rem var(--secondary-rgba-translucent);
}
.btn-secondary.focus, .btn-secondary:focus {
  box-shadow: 0 0 0 0.2rem var(--secondary-rgba-translucent);
  background: var(--secondary);
  border-color: var(--secondary);
}
.btn-outline-secondary {
  color: var(--secondary);
  border-color: var(--secondary);
  border-width: 2px;
  background: transparent;
}
.btn-outline-secondary:hover, .btn-outline-secondary:not(:disabled):not(.disabled).active, .btn-outline-secondary:not(:disabled):not(.disabled):active, .show > .btn-outline-secondary.dropdown-toggle, .btn-outline-secondary.focus, .btn-outline-secondary:focus {
  color: #fff;
  background-color: var(--secondary);
  border-color: var(--secondary);
  box-shadow: 0 0 0 0.2rem var(--secondary-rgba-translucent);
}
.btn-outline-secondary.btn-icon i {
  color: #fff;
  background-color: rgb(var(--secondary-rgb));
}
.btn-outline-secondary.btn-icon:hover i {
  background-color: rgba(0, 0, 0, 0.13);
}
/* If color secondary is light then change text color to dark */
.btn-tertiary {
  background-color: var(--tertiary);
  border-color: var(--tertiary);
}
.btn-tertiary:hover, .btn-tertiary:not(:disabled):not(.disabled).active, .btn-tertiary:not(:disabled):not(.disabled):active, .show > .btn-tertiary.dropdown-toggle {
  color: #fff;
  background-color: var(--tertiary);
  border-color: var(--tertiary);
  box-shadow: 0 0 0 0.2rem var(--tertiary-rgba-translucent);
}
.btn-tertiary.focus, .btn-tertiary:focus {
  box-shadow: 0 0 0 0.2rem var(--tertiary-rgba-translucent);
  background: var(--tertiary);
  border-color: var(--tertiary);
}
.btn-outline-tertiary {
  color: var(--tertiary);
  border-color: var(--tertiary);
  border-width: 2px;
  background: transparent;
}
.btn-outline-tertiary:hover, .btn-outline-tertiary:not(:disabled):not(.disabled).active, .btn-outline-tertiary:not(:disabled):not(.disabled):active, .show > .btn-outline-tertiary.dropdown-toggle, .btn-outline-tertiary.focus, .btn-outline-tertiary:focus {
  color: #fff;
  background-color: var(--tertiary);
  border-color: var(--tertiary);
  box-shadow: 0 0 0 0.2rem var(--tertiary-rgba-translucent);
}
.btn-outline-tertiary.btn-icon i {
  color: #fff;
  background-color: rgb(var(--tertiary-rgb));
}
.btn-outline-tertiary.btn-icon:hover i {
  background-color: rgba(0, 0, 0, 0.13);
}
/* If color tertiary is light then change text color to dark */
.btn-quaternary {
  background-color: var(--quaternary);
  border-color: var(--quaternary);
}
.btn-quaternary:hover, .btn-quaternary:not(:disabled):not(.disabled).active, .btn-quaternary:not(:disabled):not(.disabled):active, .show > .btn-quaternary.dropdown-toggle {
  color: #fff;
  background-color: var(--quaternary);
  border-color: var(--quaternary);
  box-shadow: 0 0 0 0.2rem var(--quaternary-rgba-translucent);
}
.btn-quaternary.focus, .btn-quaternary:focus {
  box-shadow: 0 0 0 0.2rem var(--quaternary-rgba-translucent);
  background: var(--quaternary);
  border-color: var(--quaternary);
}
.btn-outline-quaternary {
  color: var(--quaternary);
  border-color: var(--quaternary);
  border-width: 2px;
  background: transparent;
}
.btn-outline-quaternary:hover, .btn-outline-quaternary:not(:disabled):not(.disabled).active, .btn-outline-quaternary:not(:disabled):not(.disabled):active, .show > .btn-outline-quaternary.dropdown-toggle, .btn-outline-quaternary.focus, .btn-outline-quaternary:focus {
  color: #fff;
  background-color: var(--quaternary);
  border-color: var(--quaternary);
  box-shadow: 0 0 0 0.2rem var(--quaternary-rgba-translucent);
}
.btn-outline-quaternary.btn-icon i {
  color: #fff;
  background-color: rgb(var(--quaternary-rgb));
}
.btn-outline-quaternary.btn-icon:hover i {
  background-color: rgba(0, 0, 0, 0.13);
}
/* If color quaternary is light then change text color to dark */
.btn-light {
  background-color: var(--light);
  border-color: var(--light);
}
.btn-light:hover, .btn-light:not(:disabled):not(.disabled).active, .btn-light:not(:disabled):not(.disabled):active, .show > .btn-light.dropdown-toggle {
  color: #fff;
  background-color: var(--light);
  border-color: var(--light);
  box-shadow: 0 0 0 0.2rem var(--light-rgba-translucent);
}
.btn-light.focus, .btn-light:focus {
  box-shadow: 0 0 0 0.2rem var(--light-rgba-translucent);
  background: var(--light);
  border-color: var(--light);
}
.btn-outline-light {
  color: var(--light);
  border-color: var(--light);
  border-width: 2px;
  background: transparent;
}
.btn-outline-light:hover, .btn-outline-light:not(:disabled):not(.disabled).active, .btn-outline-light:not(:disabled):not(.disabled):active, .show > .btn-outline-light.dropdown-toggle, .btn-outline-light.focus, .btn-outline-light:focus {
  color: #fff;
  background-color: var(--light);
  border-color: var(--light);
  box-shadow: 0 0 0 0.2rem var(--light-rgba-translucent);
}
.btn-outline-light.btn-icon i {
  color: #fff;
  background-color: rgb(var(--light-rgb));
}
.btn-outline-light.btn-icon:hover i {
  background-color: rgba(0, 0, 0, 0.13);
}
/* If color light is light then change text color to dark */
.btn-light:hover, .btn-light:not(:disabled):not(.disabled).active, .btn-light:not(:disabled):not(.disabled):active, .show > .btn-light.dropdown-toggle, .btn-outline-light:hover, .btn-outline-light:not(:disabled):not(.disabled).active, .btn-outline-light:not(:disabled):not(.disabled):active, .show > .btn-outline-light.dropdown-toggle, .btn-outline-light.focus, .btn-outline-light:focus, .btn-outline-light.btn-icon i {
  color: var(--dark);
}
.btn-gray {
  background-color: var(--gray);
  border-color: var(--gray);
}
.btn-gray:hover, .btn-gray:not(:disabled):not(.disabled).active, .btn-gray:not(:disabled):not(.disabled):active, .show > .btn-gray.dropdown-toggle {
  color: #fff;
  background-color: var(--gray);
  border-color: var(--gray);
  box-shadow: 0 0 0 0.2rem var(--gray-rgba-translucent);
}
.btn-gray.focus, .btn-gray:focus {
  box-shadow: 0 0 0 0.2rem var(--gray-rgba-translucent);
  background: var(--gray);
  border-color: var(--gray);
}
.btn-outline-gray {
  color: var(--gray);
  border-color: var(--gray);
  border-width: 2px;
  background: transparent;
}
.btn-outline-gray:hover, .btn-outline-gray:not(:disabled):not(.disabled).active, .btn-outline-gray:not(:disabled):not(.disabled):active, .show > .btn-outline-gray.dropdown-toggle, .btn-outline-gray.focus, .btn-outline-gray:focus {
  color: #fff;
  background-color: var(--gray);
  border-color: var(--gray);
  box-shadow: 0 0 0 0.2rem var(--gray-rgba-translucent);
}
.btn-outline-gray.btn-icon i {
  color: #fff;
  background-color: rgb(var(--gray-rgb));
}
.btn-outline-gray.btn-icon:hover i {
  background-color: rgba(0, 0, 0, 0.13);
}
/* If color gray is light then change text color to dark */
.btn-dark {
  background-color: var(--dark);
  border-color: var(--dark);
}
.btn-dark:hover, .btn-dark:not(:disabled):not(.disabled).active, .btn-dark:not(:disabled):not(.disabled):active, .show > .btn-dark.dropdown-toggle {
  color: #fff;
  background-color: var(--dark);
  border-color: var(--dark);
  box-shadow: 0 0 0 0.2rem var(--dark-rgba-translucent);
}
.btn-dark.focus, .btn-dark:focus {
  box-shadow: 0 0 0 0.2rem var(--dark-rgba-translucent);
  background: var(--dark);
  border-color: var(--dark);
}
.btn-outline-dark {
  color: var(--dark);
  border-color: var(--dark);
  border-width: 2px;
  background: transparent;
}
.btn-outline-dark:hover, .btn-outline-dark:not(:disabled):not(.disabled).active, .btn-outline-dark:not(:disabled):not(.disabled):active, .show > .btn-outline-dark.dropdown-toggle, .btn-outline-dark.focus, .btn-outline-dark:focus {
  color: #fff;
  background-color: var(--dark);
  border-color: var(--dark);
  box-shadow: 0 0 0 0.2rem var(--dark-rgba-translucent);
}
.btn-outline-dark.btn-icon i {
  color: #fff;
  background-color: rgb(var(--dark-rgb));
}
.btn-outline-dark.btn-icon:hover i {
  background-color: rgba(0, 0, 0, 0.13);
}
/* If color dark is light then change text color to dark */
.btn-dark-gray {
  background-color: var(--dark-gray);
  border-color: var(--dark-gray);
}
.btn-dark-gray:hover, .btn-dark-gray:not(:disabled):not(.disabled).active, .btn-dark-gray:not(:disabled):not(.disabled):active, .show > .btn-dark-gray.dropdown-toggle {
  color: #fff;
  background-color: var(--dark-gray);
  border-color: var(--dark-gray);
  box-shadow: 0 0 0 0.2rem var(--dark-gray-rgba-translucent);
}
.btn-dark-gray.focus, .btn-dark-gray:focus {
  box-shadow: 0 0 0 0.2rem var(--dark-gray-rgba-translucent);
  background: var(--dark-gray);
  border-color: var(--dark-gray);
}
.btn-outline-dark-gray {
  color: var(--dark-gray);
  border-color: var(--dark-gray);
  border-width: 2px;
  background: transparent;
}
.btn-outline-dark-gray:hover, .btn-outline-dark-gray:not(:disabled):not(.disabled).active, .btn-outline-dark-gray:not(:disabled):not(.disabled):active, .show > .btn-outline-dark-gray.dropdown-toggle, .btn-outline-dark-gray.focus, .btn-outline-dark-gray:focus {
  color: #fff;
  background-color: var(--dark-gray);
  border-color: var(--dark-gray);
  box-shadow: 0 0 0 0.2rem var(--dark-gray-rgba-translucent);
}
.btn-outline-dark-gray.btn-icon i {
  color: #fff;
  background-color: rgb(var(--dark-gray-rgb));
}
.btn-outline-dark-gray.btn-icon:hover i {
  background-color: rgba(0, 0, 0, 0.13);
}
/* If color dark-gray is light then change text color to dark */
@media (min-width: 576px) {
  /* If color primary is light then change text color to dark */
  /* If color secondary is light then change text color to dark */
  /* If color tertiary is light then change text color to dark */
  /* If color quaternary is light then change text color to dark */
  /* If color light is light then change text color to dark */
  /* If color gray is light then change text color to dark */
  /* If color dark is light then change text color to dark */
  /* If color dark-gray is light then change text color to dark */
  .btn-sm-primary {
    background-color: var(--primary);
    border-color: var(--primary);
  }
  .btn-sm-primary:hover, .btn-sm-primary:not(:disabled):not(.disabled).active, .btn-sm-primary:not(:disabled):not(.disabled):active, .show > .btn-sm-primary.dropdown-toggle {
    color: var(--light);
    background-color: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 0 0 0.2rem var(--primary-rgba-translucent);
  }
  .btn-sm-primary.focus, .btn-sm-primary:focus {
    box-shadow: 0 0 0 0.2rem var(--primary-rgba-translucent);
    background: var(--primary);
    border-color: var(--primary);
  }
  .btn-sm-outline-primary {
    color: var(--primary);
    border-color: var(--primary);
    border-width: 2px;
    background: transparent;
  }
  .btn-sm-outline-primary:hover, .btn-sm-outline-primary:not(:disabled):not(.disabled).active, .btn-sm-outline-primary:not(:disabled):not(.disabled):active, .show > .btn-sm-outline-primary.dropdown-toggle, .btn-sm-outline-primary.focus, .btn-sm-outline-primary:focus {
    color: var(--light);
    background-color: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 0 0 0.2rem rgb(var(--primary-rgb));
  }
  .btn-sm-outline-primary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--primary-rgb));
  }
  .btn-sm-outline-primary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-sm-secondary {
    background-color: var(--secondary);
    border-color: var(--secondary);
  }
  .btn-sm-secondary:hover, .btn-sm-secondary:not(:disabled):not(.disabled).active, .btn-sm-secondary:not(:disabled):not(.disabled):active, .show > .btn-sm-secondary.dropdown-toggle {
    color: var(--light);
    background-color: var(--secondary);
    border-color: var(--secondary);
    box-shadow: 0 0 0 0.2rem var(--secondary-rgba-translucent);
  }
  .btn-sm-secondary.focus, .btn-sm-secondary:focus {
    box-shadow: 0 0 0 0.2rem var(--secondary-rgba-translucent);
    background: var(--secondary);
    border-color: var(--secondary);
  }
  .btn-sm-outline-secondary {
    color: var(--secondary);
    border-color: var(--secondary);
    border-width: 2px;
    background: transparent;
  }
  .btn-sm-outline-secondary:hover, .btn-sm-outline-secondary:not(:disabled):not(.disabled).active, .btn-sm-outline-secondary:not(:disabled):not(.disabled):active, .show > .btn-sm-outline-secondary.dropdown-toggle, .btn-sm-outline-secondary.focus, .btn-sm-outline-secondary:focus {
    color: var(--light);
    background-color: var(--secondary);
    border-color: var(--secondary);
    box-shadow: 0 0 0 0.2rem rgb(var(--secondary-rgb));
  }
  .btn-sm-outline-secondary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--secondary-rgb));
  }
  .btn-sm-outline-secondary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-sm-tertiary {
    background-color: var(--tertiary);
    border-color: var(--tertiary);
  }
  .btn-sm-tertiary:hover, .btn-sm-tertiary:not(:disabled):not(.disabled).active, .btn-sm-tertiary:not(:disabled):not(.disabled):active, .show > .btn-sm-tertiary.dropdown-toggle {
    color: var(--light);
    background-color: var(--tertiary);
    border-color: var(--tertiary);
    box-shadow: 0 0 0 0.2rem var(--tertiary-rgba-translucent);
  }
  .btn-sm-tertiary.focus, .btn-sm-tertiary:focus {
    box-shadow: 0 0 0 0.2rem var(--tertiary-rgba-translucent);
    background: var(--tertiary);
    border-color: var(--tertiary);
  }
  .btn-sm-outline-tertiary {
    color: var(--tertiary);
    border-color: var(--tertiary);
    border-width: 2px;
    background: transparent;
  }
  .btn-sm-outline-tertiary:hover, .btn-sm-outline-tertiary:not(:disabled):not(.disabled).active, .btn-sm-outline-tertiary:not(:disabled):not(.disabled):active, .show > .btn-sm-outline-tertiary.dropdown-toggle, .btn-sm-outline-tertiary.focus, .btn-sm-outline-tertiary:focus {
    color: var(--light);
    background-color: var(--tertiary);
    border-color: var(--tertiary);
    box-shadow: 0 0 0 0.2rem rgb(var(--tertiary-rgb));
  }
  .btn-sm-outline-tertiary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--tertiary-rgb));
  }
  .btn-sm-outline-tertiary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-sm-quaternary {
    background-color: var(--quaternary);
    border-color: var(--quaternary);
  }
  .btn-sm-quaternary:hover, .btn-sm-quaternary:not(:disabled):not(.disabled).active, .btn-sm-quaternary:not(:disabled):not(.disabled):active, .show > .btn-sm-quaternary.dropdown-toggle {
    color: var(--light);
    background-color: var(--quaternary);
    border-color: var(--quaternary);
    box-shadow: 0 0 0 0.2rem var(--quaternary-rgba-translucent);
  }
  .btn-sm-quaternary.focus, .btn-sm-quaternary:focus {
    box-shadow: 0 0 0 0.2rem var(--quaternary-rgba-translucent);
    background: var(--quaternary);
    border-color: var(--quaternary);
  }
  .btn-sm-outline-quaternary {
    color: var(--quaternary);
    border-color: var(--quaternary);
    border-width: 2px;
    background: transparent;
  }
  .btn-sm-outline-quaternary:hover, .btn-sm-outline-quaternary:not(:disabled):not(.disabled).active, .btn-sm-outline-quaternary:not(:disabled):not(.disabled):active, .show > .btn-sm-outline-quaternary.dropdown-toggle, .btn-sm-outline-quaternary.focus, .btn-sm-outline-quaternary:focus {
    color: var(--light);
    background-color: var(--quaternary);
    border-color: var(--quaternary);
    box-shadow: 0 0 0 0.2rem rgb(var(--quaternary-rgb));
  }
  .btn-sm-outline-quaternary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--quaternary-rgb));
  }
  .btn-sm-outline-quaternary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-sm-light {
    background-color: var(--light);
    border-color: var(--light);
  }
  .btn-sm-light:hover, .btn-sm-light:not(:disabled):not(.disabled).active, .btn-sm-light:not(:disabled):not(.disabled):active, .show > .btn-sm-light.dropdown-toggle {
    color: var(--light);
    background-color: var(--light);
    border-color: var(--light);
    box-shadow: 0 0 0 0.2rem var(--light-rgba-translucent);
  }
  .btn-sm-light.focus, .btn-sm-light:focus {
    box-shadow: 0 0 0 0.2rem var(--light-rgba-translucent);
    background: var(--light);
    border-color: var(--light);
  }
  .btn-sm-outline-light {
    color: var(--light);
    border-color: var(--light);
    border-width: 2px;
    background: transparent;
  }
  .btn-sm-outline-light:hover, .btn-sm-outline-light:not(:disabled):not(.disabled).active, .btn-sm-outline-light:not(:disabled):not(.disabled):active, .show > .btn-sm-outline-light.dropdown-toggle, .btn-sm-outline-light.focus, .btn-sm-outline-light:focus {
    color: var(--light);
    background-color: var(--light);
    border-color: var(--light);
    box-shadow: 0 0 0 0.2rem rgb(var(--light-rgb));
  }
  .btn-sm-outline-light.btn-icon i {
    color: #fff;
    background-color: rgb(var(--light-rgb));
  }
  .btn-sm-outline-light.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-sm-light:hover, .btn-sm-light:not(:disabled):not(.disabled).active, .btn-sm-light:not(:disabled):not(.disabled):active, .show > .btn-sm-light.dropdown-toggle, .btn-sm-outline-light:hover, .btn-sm-outline-light:not(:disabled):not(.disabled).active, .btn-sm-outline-light:not(:disabled):not(.disabled):active, .show > .btn-sm-outline-light.dropdown-toggle, .btn-sm-outline-light.focus, .btn-sm-outline-light:focus, .btn-sm-outline-light.btn-icon i {
    color: var(--dark);
  }
  .btn-sm-gray {
    background-color: var(--gray);
    border-color: var(--gray);
  }
  .btn-sm-gray:hover, .btn-sm-gray:not(:disabled):not(.disabled).active, .btn-sm-gray:not(:disabled):not(.disabled):active, .show > .btn-sm-gray.dropdown-toggle {
    color: var(--light);
    background-color: var(--gray);
    border-color: var(--gray);
    box-shadow: 0 0 0 0.2rem var(--gray-rgba-translucent);
  }
  .btn-sm-gray.focus, .btn-sm-gray:focus {
    box-shadow: 0 0 0 0.2rem var(--gray-rgba-translucent);
    background: var(--gray);
    border-color: var(--gray);
  }
  .btn-sm-outline-gray {
    color: var(--gray);
    border-color: var(--gray);
    border-width: 2px;
    background: transparent;
  }
  .btn-sm-outline-gray:hover, .btn-sm-outline-gray:not(:disabled):not(.disabled).active, .btn-sm-outline-gray:not(:disabled):not(.disabled):active, .show > .btn-sm-outline-gray.dropdown-toggle, .btn-sm-outline-gray.focus, .btn-sm-outline-gray:focus {
    color: var(--light);
    background-color: var(--gray);
    border-color: var(--gray);
    box-shadow: 0 0 0 0.2rem rgb(var(--gray-rgb));
  }
  .btn-sm-outline-gray.btn-icon i {
    color: #fff;
    background-color: rgb(var(--gray-rgb));
  }
  .btn-sm-outline-gray.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-sm-dark {
    background-color: var(--dark);
    border-color: var(--dark);
  }
  .btn-sm-dark:hover, .btn-sm-dark:not(:disabled):not(.disabled).active, .btn-sm-dark:not(:disabled):not(.disabled):active, .show > .btn-sm-dark.dropdown-toggle {
    color: var(--light);
    background-color: var(--dark);
    border-color: var(--dark);
    box-shadow: 0 0 0 0.2rem var(--dark-rgba-translucent);
  }
  .btn-sm-dark.focus, .btn-sm-dark:focus {
    box-shadow: 0 0 0 0.2rem var(--dark-rgba-translucent);
    background: var(--dark);
    border-color: var(--dark);
  }
  .btn-sm-outline-dark {
    color: var(--dark);
    border-color: var(--dark);
    border-width: 2px;
    background: transparent;
  }
  .btn-sm-outline-dark:hover, .btn-sm-outline-dark:not(:disabled):not(.disabled).active, .btn-sm-outline-dark:not(:disabled):not(.disabled):active, .show > .btn-sm-outline-dark.dropdown-toggle, .btn-sm-outline-dark.focus, .btn-sm-outline-dark:focus {
    color: var(--light);
    background-color: var(--dark);
    border-color: var(--dark);
    box-shadow: 0 0 0 0.2rem rgb(var(--dark-rgb));
  }
  .btn-sm-outline-dark.btn-icon i {
    color: #fff;
    background-color: rgb(var(--dark-rgb));
  }
  .btn-sm-outline-dark.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-sm-dark-gray {
    background-color: var(--dark-gray);
    border-color: var(--dark-gray);
  }
  .btn-sm-dark-gray:hover, .btn-sm-dark-gray:not(:disabled):not(.disabled).active, .btn-sm-dark-gray:not(:disabled):not(.disabled):active, .show > .btn-sm-dark-gray.dropdown-toggle {
    color: var(--light);
    background-color: var(--dark-gray);
    border-color: var(--dark-gray);
    box-shadow: 0 0 0 0.2rem var(--dark-gray-rgba-translucent);
  }
  .btn-sm-dark-gray.focus, .btn-sm-dark-gray:focus {
    box-shadow: 0 0 0 0.2rem var(--dark-gray-rgba-translucent);
    background: var(--dark-gray);
    border-color: var(--dark-gray);
  }
  .btn-sm-outline-dark-gray {
    color: var(--dark-gray);
    border-color: var(--dark-gray);
    border-width: 2px;
    background: transparent;
  }
  .btn-sm-outline-dark-gray:hover, .btn-sm-outline-dark-gray:not(:disabled):not(.disabled).active, .btn-sm-outline-dark-gray:not(:disabled):not(.disabled):active, .show > .btn-sm-outline-dark-gray.dropdown-toggle, .btn-sm-outline-dark-gray.focus, .btn-sm-outline-dark-gray:focus {
    color: var(--light);
    background-color: var(--dark-gray);
    border-color: var(--dark-gray);
    box-shadow: 0 0 0 0.2rem rgb(var(--dark-gray-rgb));
  }
  .btn-sm-outline-dark-gray.btn-icon i {
    color: #fff;
    background-color: rgb(var(--dark-gray-rgb));
  }
  .btn-sm-outline-dark-gray.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
}
@media (min-width: 768px) {
  /* If color primary is light then change text color to dark */
  /* If color secondary is light then change text color to dark */
  /* If color tertiary is light then change text color to dark */
  /* If color quaternary is light then change text color to dark */
  /* If color light is light then change text color to dark */
  /* If color gray is light then change text color to dark */
  /* If color dark is light then change text color to dark */
  /* If color dark-gray is light then change text color to dark */
  .btn-md-primary {
    background-color: var(--primary);
    border-color: var(--primary);
  }
  .btn-md-primary:hover, .btn-md-primary:not(:disabled):not(.disabled).active, .btn-md-primary:not(:disabled):not(.disabled):active, .show > .btn-md-primary.dropdown-toggle {
    color: var(--light);
    background-color: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 0 0 0.2rem var(--primary-rgba-translucent);
  }
  .btn-md-primary.focus, .btn-md-primary:focus {
    box-shadow: 0 0 0 0.2rem var(--primary-rgba-translucent);
    background: var(--primary);
    border-color: var(--primary);
  }
  .btn-md-outline-primary {
    color: var(--primary);
    border-color: var(--primary);
    border-width: 2px;
    background: transparent;
  }
  .btn-md-outline-primary:hover, .btn-md-outline-primary:not(:disabled):not(.disabled).active, .btn-md-outline-primary:not(:disabled):not(.disabled):active, .show > .btn-md-outline-primary.dropdown-toggle, .btn-md-outline-primary.focus, .btn-md-outline-primary:focus {
    color: var(--light);
    background-color: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 0 0 0.2rem rgb(var(--primary-rgb));
  }
  .btn-md-outline-primary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--primary-rgb));
  }
  .btn-md-outline-primary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-md-secondary {
    background-color: var(--secondary);
    border-color: var(--secondary);
  }
  .btn-md-secondary:hover, .btn-md-secondary:not(:disabled):not(.disabled).active, .btn-md-secondary:not(:disabled):not(.disabled):active, .show > .btn-md-secondary.dropdown-toggle {
    color: var(--light);
    background-color: var(--secondary);
    border-color: var(--secondary);
    box-shadow: 0 0 0 0.2rem var(--secondary-rgba-translucent);
  }
  .btn-md-secondary.focus, .btn-md-secondary:focus {
    box-shadow: 0 0 0 0.2rem var(--secondary-rgba-translucent);
    background: var(--secondary);
    border-color: var(--secondary);
  }
  .btn-md-outline-secondary {
    color: var(--secondary);
    border-color: var(--secondary);
    border-width: 2px;
    background: transparent;
  }
  .btn-md-outline-secondary:hover, .btn-md-outline-secondary:not(:disabled):not(.disabled).active, .btn-md-outline-secondary:not(:disabled):not(.disabled):active, .show > .btn-md-outline-secondary.dropdown-toggle, .btn-md-outline-secondary.focus, .btn-md-outline-secondary:focus {
    color: var(--light);
    background-color: var(--secondary);
    border-color: var(--secondary);
    box-shadow: 0 0 0 0.2rem rgb(var(--secondary-rgb));
  }
  .btn-md-outline-secondary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--secondary-rgb));
  }
  .btn-md-outline-secondary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-md-tertiary {
    background-color: var(--tertiary);
    border-color: var(--tertiary);
  }
  .btn-md-tertiary:hover, .btn-md-tertiary:not(:disabled):not(.disabled).active, .btn-md-tertiary:not(:disabled):not(.disabled):active, .show > .btn-md-tertiary.dropdown-toggle {
    color: var(--light);
    background-color: var(--tertiary);
    border-color: var(--tertiary);
    box-shadow: 0 0 0 0.2rem var(--tertiary-rgba-translucent);
  }
  .btn-md-tertiary.focus, .btn-md-tertiary:focus {
    box-shadow: 0 0 0 0.2rem var(--tertiary-rgba-translucent);
    background: var(--tertiary);
    border-color: var(--tertiary);
  }
  .btn-md-outline-tertiary {
    color: var(--tertiary);
    border-color: var(--tertiary);
    border-width: 2px;
    background: transparent;
  }
  .btn-md-outline-tertiary:hover, .btn-md-outline-tertiary:not(:disabled):not(.disabled).active, .btn-md-outline-tertiary:not(:disabled):not(.disabled):active, .show > .btn-md-outline-tertiary.dropdown-toggle, .btn-md-outline-tertiary.focus, .btn-md-outline-tertiary:focus {
    color: var(--light);
    background-color: var(--tertiary);
    border-color: var(--tertiary);
    box-shadow: 0 0 0 0.2rem rgb(var(--tertiary-rgb));
  }
  .btn-md-outline-tertiary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--tertiary-rgb));
  }
  .btn-md-outline-tertiary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-md-quaternary {
    background-color: var(--quaternary);
    border-color: var(--quaternary);
  }
  .btn-md-quaternary:hover, .btn-md-quaternary:not(:disabled):not(.disabled).active, .btn-md-quaternary:not(:disabled):not(.disabled):active, .show > .btn-md-quaternary.dropdown-toggle {
    color: var(--light);
    background-color: var(--quaternary);
    border-color: var(--quaternary);
    box-shadow: 0 0 0 0.2rem var(--quaternary-rgba-translucent);
  }
  .btn-md-quaternary.focus, .btn-md-quaternary:focus {
    box-shadow: 0 0 0 0.2rem var(--quaternary-rgba-translucent);
    background: var(--quaternary);
    border-color: var(--quaternary);
  }
  .btn-md-outline-quaternary {
    color: var(--quaternary);
    border-color: var(--quaternary);
    border-width: 2px;
    background: transparent;
  }
  .btn-md-outline-quaternary:hover, .btn-md-outline-quaternary:not(:disabled):not(.disabled).active, .btn-md-outline-quaternary:not(:disabled):not(.disabled):active, .show > .btn-md-outline-quaternary.dropdown-toggle, .btn-md-outline-quaternary.focus, .btn-md-outline-quaternary:focus {
    color: var(--light);
    background-color: var(--quaternary);
    border-color: var(--quaternary);
    box-shadow: 0 0 0 0.2rem rgb(var(--quaternary-rgb));
  }
  .btn-md-outline-quaternary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--quaternary-rgb));
  }
  .btn-md-outline-quaternary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-md-light {
    background-color: var(--light);
    border-color: var(--light);
  }
  .btn-md-light:hover, .btn-md-light:not(:disabled):not(.disabled).active, .btn-md-light:not(:disabled):not(.disabled):active, .show > .btn-md-light.dropdown-toggle {
    color: var(--light);
    background-color: var(--light);
    border-color: var(--light);
    box-shadow: 0 0 0 0.2rem var(--light-rgba-translucent);
  }
  .btn-md-light.focus, .btn-md-light:focus {
    box-shadow: 0 0 0 0.2rem var(--light-rgba-translucent);
    background: var(--light);
    border-color: var(--light);
  }
  .btn-md-outline-light {
    color: var(--light);
    border-color: var(--light);
    border-width: 2px;
    background: transparent;
  }
  .btn-md-outline-light:hover, .btn-md-outline-light:not(:disabled):not(.disabled).active, .btn-md-outline-light:not(:disabled):not(.disabled):active, .show > .btn-md-outline-light.dropdown-toggle, .btn-md-outline-light.focus, .btn-md-outline-light:focus {
    color: var(--light);
    background-color: var(--light);
    border-color: var(--light);
    box-shadow: 0 0 0 0.2rem rgb(var(--light-rgb));
  }
  .btn-md-outline-light.btn-icon i {
    color: #fff;
    background-color: rgb(var(--light-rgb));
  }
  .btn-md-outline-light.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-md-light:hover, .btn-md-light:not(:disabled):not(.disabled).active, .btn-md-light:not(:disabled):not(.disabled):active, .show > .btn-md-light.dropdown-toggle, .btn-md-outline-light:hover, .btn-md-outline-light:not(:disabled):not(.disabled).active, .btn-md-outline-light:not(:disabled):not(.disabled):active, .show > .btn-md-outline-light.dropdown-toggle, .btn-md-outline-light.focus, .btn-md-outline-light:focus, .btn-md-outline-light.btn-icon i {
    color: var(--dark);
  }
  .btn-md-gray {
    background-color: var(--gray);
    border-color: var(--gray);
  }
  .btn-md-gray:hover, .btn-md-gray:not(:disabled):not(.disabled).active, .btn-md-gray:not(:disabled):not(.disabled):active, .show > .btn-md-gray.dropdown-toggle {
    color: var(--light);
    background-color: var(--gray);
    border-color: var(--gray);
    box-shadow: 0 0 0 0.2rem var(--gray-rgba-translucent);
  }
  .btn-md-gray.focus, .btn-md-gray:focus {
    box-shadow: 0 0 0 0.2rem var(--gray-rgba-translucent);
    background: var(--gray);
    border-color: var(--gray);
  }
  .btn-md-outline-gray {
    color: var(--gray);
    border-color: var(--gray);
    border-width: 2px;
    background: transparent;
  }
  .btn-md-outline-gray:hover, .btn-md-outline-gray:not(:disabled):not(.disabled).active, .btn-md-outline-gray:not(:disabled):not(.disabled):active, .show > .btn-md-outline-gray.dropdown-toggle, .btn-md-outline-gray.focus, .btn-md-outline-gray:focus {
    color: var(--light);
    background-color: var(--gray);
    border-color: var(--gray);
    box-shadow: 0 0 0 0.2rem rgb(var(--gray-rgb));
  }
  .btn-md-outline-gray.btn-icon i {
    color: #fff;
    background-color: rgb(var(--gray-rgb));
  }
  .btn-md-outline-gray.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-md-dark {
    background-color: var(--dark);
    border-color: var(--dark);
  }
  .btn-md-dark:hover, .btn-md-dark:not(:disabled):not(.disabled).active, .btn-md-dark:not(:disabled):not(.disabled):active, .show > .btn-md-dark.dropdown-toggle {
    color: var(--light);
    background-color: var(--dark);
    border-color: var(--dark);
    box-shadow: 0 0 0 0.2rem var(--dark-rgba-translucent);
  }
  .btn-md-dark.focus, .btn-md-dark:focus {
    box-shadow: 0 0 0 0.2rem var(--dark-rgba-translucent);
    background: var(--dark);
    border-color: var(--dark);
  }
  .btn-md-outline-dark {
    color: var(--dark);
    border-color: var(--dark);
    border-width: 2px;
    background: transparent;
  }
  .btn-md-outline-dark:hover, .btn-md-outline-dark:not(:disabled):not(.disabled).active, .btn-md-outline-dark:not(:disabled):not(.disabled):active, .show > .btn-md-outline-dark.dropdown-toggle, .btn-md-outline-dark.focus, .btn-md-outline-dark:focus {
    color: var(--light);
    background-color: var(--dark);
    border-color: var(--dark);
    box-shadow: 0 0 0 0.2rem rgb(var(--dark-rgb));
  }
  .btn-md-outline-dark.btn-icon i {
    color: #fff;
    background-color: rgb(var(--dark-rgb));
  }
  .btn-md-outline-dark.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-md-dark-gray {
    background-color: var(--dark-gray);
    border-color: var(--dark-gray);
  }
  .btn-md-dark-gray:hover, .btn-md-dark-gray:not(:disabled):not(.disabled).active, .btn-md-dark-gray:not(:disabled):not(.disabled):active, .show > .btn-md-dark-gray.dropdown-toggle {
    color: var(--light);
    background-color: var(--dark-gray);
    border-color: var(--dark-gray);
    box-shadow: 0 0 0 0.2rem var(--dark-gray-rgba-translucent);
  }
  .btn-md-dark-gray.focus, .btn-md-dark-gray:focus {
    box-shadow: 0 0 0 0.2rem var(--dark-gray-rgba-translucent);
    background: var(--dark-gray);
    border-color: var(--dark-gray);
  }
  .btn-md-outline-dark-gray {
    color: var(--dark-gray);
    border-color: var(--dark-gray);
    border-width: 2px;
    background: transparent;
  }
  .btn-md-outline-dark-gray:hover, .btn-md-outline-dark-gray:not(:disabled):not(.disabled).active, .btn-md-outline-dark-gray:not(:disabled):not(.disabled):active, .show > .btn-md-outline-dark-gray.dropdown-toggle, .btn-md-outline-dark-gray.focus, .btn-md-outline-dark-gray:focus {
    color: var(--light);
    background-color: var(--dark-gray);
    border-color: var(--dark-gray);
    box-shadow: 0 0 0 0.2rem rgb(var(--dark-gray-rgb));
  }
  .btn-md-outline-dark-gray.btn-icon i {
    color: #fff;
    background-color: rgb(var(--dark-gray-rgb));
  }
  .btn-md-outline-dark-gray.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
}
@media (min-width: 992px) {
  /* If color primary is light then change text color to dark */
  /* If color secondary is light then change text color to dark */
  /* If color tertiary is light then change text color to dark */
  /* If color quaternary is light then change text color to dark */
  /* If color light is light then change text color to dark */
  /* If color gray is light then change text color to dark */
  /* If color dark is light then change text color to dark */
  /* If color dark-gray is light then change text color to dark */
  .btn-lg-primary {
    background-color: var(--primary);
    border-color: var(--primary);
  }
  .btn-lg-primary:hover, .btn-lg-primary:not(:disabled):not(.disabled).active, .btn-lg-primary:not(:disabled):not(.disabled):active, .show > .btn-lg-primary.dropdown-toggle {
    color: var(--light);
    background-color: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 0 0 0.2rem var(--primary-rgba-translucent);
  }
  .btn-lg-primary.focus, .btn-lg-primary:focus {
    box-shadow: 0 0 0 0.2rem var(--primary-rgba-translucent);
    background: var(--primary);
    border-color: var(--primary);
  }
  .btn-lg-outline-primary {
    color: var(--primary);
    border-color: var(--primary);
    border-width: 2px;
    background: transparent;
  }
  .btn-lg-outline-primary:hover, .btn-lg-outline-primary:not(:disabled):not(.disabled).active, .btn-lg-outline-primary:not(:disabled):not(.disabled):active, .show > .btn-lg-outline-primary.dropdown-toggle, .btn-lg-outline-primary.focus, .btn-lg-outline-primary:focus {
    color: var(--light);
    background-color: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 0 0 0.2rem rgb(var(--primary-rgb));
  }
  .btn-lg-outline-primary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--primary-rgb));
  }
  .btn-lg-outline-primary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-lg-secondary {
    background-color: var(--secondary);
    border-color: var(--secondary);
  }
  .btn-lg-secondary:hover, .btn-lg-secondary:not(:disabled):not(.disabled).active, .btn-lg-secondary:not(:disabled):not(.disabled):active, .show > .btn-lg-secondary.dropdown-toggle {
    color: var(--light);
    background-color: var(--secondary);
    border-color: var(--secondary);
    box-shadow: 0 0 0 0.2rem var(--secondary-rgba-translucent);
  }
  .btn-lg-secondary.focus, .btn-lg-secondary:focus {
    box-shadow: 0 0 0 0.2rem var(--secondary-rgba-translucent);
    background: var(--secondary);
    border-color: var(--secondary);
  }
  .btn-lg-outline-secondary {
    color: var(--secondary);
    border-color: var(--secondary);
    border-width: 2px;
    background: transparent;
  }
  .btn-lg-outline-secondary:hover, .btn-lg-outline-secondary:not(:disabled):not(.disabled).active, .btn-lg-outline-secondary:not(:disabled):not(.disabled):active, .show > .btn-lg-outline-secondary.dropdown-toggle, .btn-lg-outline-secondary.focus, .btn-lg-outline-secondary:focus {
    color: var(--light);
    background-color: var(--secondary);
    border-color: var(--secondary);
    box-shadow: 0 0 0 0.2rem rgb(var(--secondary-rgb));
  }
  .btn-lg-outline-secondary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--secondary-rgb));
  }
  .btn-lg-outline-secondary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-lg-tertiary {
    background-color: var(--tertiary);
    border-color: var(--tertiary);
  }
  .btn-lg-tertiary:hover, .btn-lg-tertiary:not(:disabled):not(.disabled).active, .btn-lg-tertiary:not(:disabled):not(.disabled):active, .show > .btn-lg-tertiary.dropdown-toggle {
    color: var(--light);
    background-color: var(--tertiary);
    border-color: var(--tertiary);
    box-shadow: 0 0 0 0.2rem var(--tertiary-rgba-translucent);
  }
  .btn-lg-tertiary.focus, .btn-lg-tertiary:focus {
    box-shadow: 0 0 0 0.2rem var(--tertiary-rgba-translucent);
    background: var(--tertiary);
    border-color: var(--tertiary);
  }
  .btn-lg-outline-tertiary {
    color: var(--tertiary);
    border-color: var(--tertiary);
    border-width: 2px;
    background: transparent;
  }
  .btn-lg-outline-tertiary:hover, .btn-lg-outline-tertiary:not(:disabled):not(.disabled).active, .btn-lg-outline-tertiary:not(:disabled):not(.disabled):active, .show > .btn-lg-outline-tertiary.dropdown-toggle, .btn-lg-outline-tertiary.focus, .btn-lg-outline-tertiary:focus {
    color: var(--light);
    background-color: var(--tertiary);
    border-color: var(--tertiary);
    box-shadow: 0 0 0 0.2rem rgb(var(--tertiary-rgb));
  }
  .btn-lg-outline-tertiary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--tertiary-rgb));
  }
  .btn-lg-outline-tertiary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-lg-quaternary {
    background-color: var(--quaternary);
    border-color: var(--quaternary);
  }
  .btn-lg-quaternary:hover, .btn-lg-quaternary:not(:disabled):not(.disabled).active, .btn-lg-quaternary:not(:disabled):not(.disabled):active, .show > .btn-lg-quaternary.dropdown-toggle {
    color: var(--light);
    background-color: var(--quaternary);
    border-color: var(--quaternary);
    box-shadow: 0 0 0 0.2rem var(--quaternary-rgba-translucent);
  }
  .btn-lg-quaternary.focus, .btn-lg-quaternary:focus {
    box-shadow: 0 0 0 0.2rem var(--quaternary-rgba-translucent);
    background: var(--quaternary);
    border-color: var(--quaternary);
  }
  .btn-lg-outline-quaternary {
    color: var(--quaternary);
    border-color: var(--quaternary);
    border-width: 2px;
    background: transparent;
  }
  .btn-lg-outline-quaternary:hover, .btn-lg-outline-quaternary:not(:disabled):not(.disabled).active, .btn-lg-outline-quaternary:not(:disabled):not(.disabled):active, .show > .btn-lg-outline-quaternary.dropdown-toggle, .btn-lg-outline-quaternary.focus, .btn-lg-outline-quaternary:focus {
    color: var(--light);
    background-color: var(--quaternary);
    border-color: var(--quaternary);
    box-shadow: 0 0 0 0.2rem rgb(var(--quaternary-rgb));
  }
  .btn-lg-outline-quaternary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--quaternary-rgb));
  }
  .btn-lg-outline-quaternary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-lg-light {
    background-color: var(--light);
    border-color: var(--light);
  }
  .btn-lg-light:hover, .btn-lg-light:not(:disabled):not(.disabled).active, .btn-lg-light:not(:disabled):not(.disabled):active, .show > .btn-lg-light.dropdown-toggle {
    color: var(--light);
    background-color: var(--light);
    border-color: var(--light);
    box-shadow: 0 0 0 0.2rem var(--light-rgba-translucent);
  }
  .btn-lg-light.focus, .btn-lg-light:focus {
    box-shadow: 0 0 0 0.2rem var(--light-rgba-translucent);
    background: var(--light);
    border-color: var(--light);
  }
  .btn-lg-outline-light {
    color: var(--light);
    border-color: var(--light);
    border-width: 2px;
    background: transparent;
  }
  .btn-lg-outline-light:hover, .btn-lg-outline-light:not(:disabled):not(.disabled).active, .btn-lg-outline-light:not(:disabled):not(.disabled):active, .show > .btn-lg-outline-light.dropdown-toggle, .btn-lg-outline-light.focus, .btn-lg-outline-light:focus {
    color: var(--light);
    background-color: var(--light);
    border-color: var(--light);
    box-shadow: 0 0 0 0.2rem rgb(var(--light-rgb));
  }
  .btn-lg-outline-light.btn-icon i {
    color: #fff;
    background-color: rgb(var(--light-rgb));
  }
  .btn-lg-outline-light.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-lg-light:hover, .btn-lg-light:not(:disabled):not(.disabled).active, .btn-lg-light:not(:disabled):not(.disabled):active, .show > .btn-lg-light.dropdown-toggle, .btn-lg-outline-light:hover, .btn-lg-outline-light:not(:disabled):not(.disabled).active, .btn-lg-outline-light:not(:disabled):not(.disabled):active, .show > .btn-lg-outline-light.dropdown-toggle, .btn-lg-outline-light.focus, .btn-lg-outline-light:focus, .btn-lg-outline-light.btn-icon i {
    color: var(--dark);
  }
  .btn-lg-gray {
    background-color: var(--gray);
    border-color: var(--gray);
  }
  .btn-lg-gray:hover, .btn-lg-gray:not(:disabled):not(.disabled).active, .btn-lg-gray:not(:disabled):not(.disabled):active, .show > .btn-lg-gray.dropdown-toggle {
    color: var(--light);
    background-color: var(--gray);
    border-color: var(--gray);
    box-shadow: 0 0 0 0.2rem var(--gray-rgba-translucent);
  }
  .btn-lg-gray.focus, .btn-lg-gray:focus {
    box-shadow: 0 0 0 0.2rem var(--gray-rgba-translucent);
    background: var(--gray);
    border-color: var(--gray);
  }
  .btn-lg-outline-gray {
    color: var(--gray);
    border-color: var(--gray);
    border-width: 2px;
    background: transparent;
  }
  .btn-lg-outline-gray:hover, .btn-lg-outline-gray:not(:disabled):not(.disabled).active, .btn-lg-outline-gray:not(:disabled):not(.disabled):active, .show > .btn-lg-outline-gray.dropdown-toggle, .btn-lg-outline-gray.focus, .btn-lg-outline-gray:focus {
    color: var(--light);
    background-color: var(--gray);
    border-color: var(--gray);
    box-shadow: 0 0 0 0.2rem rgb(var(--gray-rgb));
  }
  .btn-lg-outline-gray.btn-icon i {
    color: #fff;
    background-color: rgb(var(--gray-rgb));
  }
  .btn-lg-outline-gray.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-lg-dark {
    background-color: var(--dark);
    border-color: var(--dark);
  }
  .btn-lg-dark:hover, .btn-lg-dark:not(:disabled):not(.disabled).active, .btn-lg-dark:not(:disabled):not(.disabled):active, .show > .btn-lg-dark.dropdown-toggle {
    color: var(--light);
    background-color: var(--dark);
    border-color: var(--dark);
    box-shadow: 0 0 0 0.2rem var(--dark-rgba-translucent);
  }
  .btn-lg-dark.focus, .btn-lg-dark:focus {
    box-shadow: 0 0 0 0.2rem var(--dark-rgba-translucent);
    background: var(--dark);
    border-color: var(--dark);
  }
  .btn-lg-outline-dark {
    color: var(--dark);
    border-color: var(--dark);
    border-width: 2px;
    background: transparent;
  }
  .btn-lg-outline-dark:hover, .btn-lg-outline-dark:not(:disabled):not(.disabled).active, .btn-lg-outline-dark:not(:disabled):not(.disabled):active, .show > .btn-lg-outline-dark.dropdown-toggle, .btn-lg-outline-dark.focus, .btn-lg-outline-dark:focus {
    color: var(--light);
    background-color: var(--dark);
    border-color: var(--dark);
    box-shadow: 0 0 0 0.2rem rgb(var(--dark-rgb));
  }
  .btn-lg-outline-dark.btn-icon i {
    color: #fff;
    background-color: rgb(var(--dark-rgb));
  }
  .btn-lg-outline-dark.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-lg-dark-gray {
    background-color: var(--dark-gray);
    border-color: var(--dark-gray);
  }
  .btn-lg-dark-gray:hover, .btn-lg-dark-gray:not(:disabled):not(.disabled).active, .btn-lg-dark-gray:not(:disabled):not(.disabled):active, .show > .btn-lg-dark-gray.dropdown-toggle {
    color: var(--light);
    background-color: var(--dark-gray);
    border-color: var(--dark-gray);
    box-shadow: 0 0 0 0.2rem var(--dark-gray-rgba-translucent);
  }
  .btn-lg-dark-gray.focus, .btn-lg-dark-gray:focus {
    box-shadow: 0 0 0 0.2rem var(--dark-gray-rgba-translucent);
    background: var(--dark-gray);
    border-color: var(--dark-gray);
  }
  .btn-lg-outline-dark-gray {
    color: var(--dark-gray);
    border-color: var(--dark-gray);
    border-width: 2px;
    background: transparent;
  }
  .btn-lg-outline-dark-gray:hover, .btn-lg-outline-dark-gray:not(:disabled):not(.disabled).active, .btn-lg-outline-dark-gray:not(:disabled):not(.disabled):active, .show > .btn-lg-outline-dark-gray.dropdown-toggle, .btn-lg-outline-dark-gray.focus, .btn-lg-outline-dark-gray:focus {
    color: var(--light);
    background-color: var(--dark-gray);
    border-color: var(--dark-gray);
    box-shadow: 0 0 0 0.2rem rgb(var(--dark-gray-rgb));
  }
  .btn-lg-outline-dark-gray.btn-icon i {
    color: #fff;
    background-color: rgb(var(--dark-gray-rgb));
  }
  .btn-lg-outline-dark-gray.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
}
@media (min-width: 1200px) {
  /* If color primary is light then change text color to dark */
  /* If color secondary is light then change text color to dark */
  /* If color tertiary is light then change text color to dark */
  /* If color quaternary is light then change text color to dark */
  /* If color light is light then change text color to dark */
  /* If color gray is light then change text color to dark */
  /* If color dark is light then change text color to dark */
  /* If color dark-gray is light then change text color to dark */
  .btn-xl-primary {
    background-color: var(--primary);
    border-color: var(--primary);
  }
  .btn-xl-primary:hover, .btn-xl-primary:not(:disabled):not(.disabled).active, .btn-xl-primary:not(:disabled):not(.disabled):active, .show > .btn-xl-primary.dropdown-toggle {
    color: var(--light);
    background-color: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 0 0 0.2rem var(--primary-rgba-translucent);
  }
  .btn-xl-primary.focus, .btn-xl-primary:focus {
    box-shadow: 0 0 0 0.2rem var(--primary-rgba-translucent);
    background: var(--primary);
    border-color: var(--primary);
  }
  .btn-xl-outline-primary {
    color: var(--primary);
    border-color: var(--primary);
    border-width: 2px;
    background: transparent;
  }
  .btn-xl-outline-primary:hover, .btn-xl-outline-primary:not(:disabled):not(.disabled).active, .btn-xl-outline-primary:not(:disabled):not(.disabled):active, .show > .btn-xl-outline-primary.dropdown-toggle, .btn-xl-outline-primary.focus, .btn-xl-outline-primary:focus {
    color: var(--light);
    background-color: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 0 0 0.2rem rgb(var(--primary-rgb));
  }
  .btn-xl-outline-primary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--primary-rgb));
  }
  .btn-xl-outline-primary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-xl-secondary {
    background-color: var(--secondary);
    border-color: var(--secondary);
  }
  .btn-xl-secondary:hover, .btn-xl-secondary:not(:disabled):not(.disabled).active, .btn-xl-secondary:not(:disabled):not(.disabled):active, .show > .btn-xl-secondary.dropdown-toggle {
    color: var(--light);
    background-color: var(--secondary);
    border-color: var(--secondary);
    box-shadow: 0 0 0 0.2rem var(--secondary-rgba-translucent);
  }
  .btn-xl-secondary.focus, .btn-xl-secondary:focus {
    box-shadow: 0 0 0 0.2rem var(--secondary-rgba-translucent);
    background: var(--secondary);
    border-color: var(--secondary);
  }
  .btn-xl-outline-secondary {
    color: var(--secondary);
    border-color: var(--secondary);
    border-width: 2px;
    background: transparent;
  }
  .btn-xl-outline-secondary:hover, .btn-xl-outline-secondary:not(:disabled):not(.disabled).active, .btn-xl-outline-secondary:not(:disabled):not(.disabled):active, .show > .btn-xl-outline-secondary.dropdown-toggle, .btn-xl-outline-secondary.focus, .btn-xl-outline-secondary:focus {
    color: var(--light);
    background-color: var(--secondary);
    border-color: var(--secondary);
    box-shadow: 0 0 0 0.2rem rgb(var(--secondary-rgb));
  }
  .btn-xl-outline-secondary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--secondary-rgb));
  }
  .btn-xl-outline-secondary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-xl-tertiary {
    background-color: var(--tertiary);
    border-color: var(--tertiary);
  }
  .btn-xl-tertiary:hover, .btn-xl-tertiary:not(:disabled):not(.disabled).active, .btn-xl-tertiary:not(:disabled):not(.disabled):active, .show > .btn-xl-tertiary.dropdown-toggle {
    color: var(--light);
    background-color: var(--tertiary);
    border-color: var(--tertiary);
    box-shadow: 0 0 0 0.2rem var(--tertiary-rgba-translucent);
  }
  .btn-xl-tertiary.focus, .btn-xl-tertiary:focus {
    box-shadow: 0 0 0 0.2rem var(--tertiary-rgba-translucent);
    background: var(--tertiary);
    border-color: var(--tertiary);
  }
  .btn-xl-outline-tertiary {
    color: var(--tertiary);
    border-color: var(--tertiary);
    border-width: 2px;
    background: transparent;
  }
  .btn-xl-outline-tertiary:hover, .btn-xl-outline-tertiary:not(:disabled):not(.disabled).active, .btn-xl-outline-tertiary:not(:disabled):not(.disabled):active, .show > .btn-xl-outline-tertiary.dropdown-toggle, .btn-xl-outline-tertiary.focus, .btn-xl-outline-tertiary:focus {
    color: var(--light);
    background-color: var(--tertiary);
    border-color: var(--tertiary);
    box-shadow: 0 0 0 0.2rem rgb(var(--tertiary-rgb));
  }
  .btn-xl-outline-tertiary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--tertiary-rgb));
  }
  .btn-xl-outline-tertiary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-xl-quaternary {
    background-color: var(--quaternary);
    border-color: var(--quaternary);
  }
  .btn-xl-quaternary:hover, .btn-xl-quaternary:not(:disabled):not(.disabled).active, .btn-xl-quaternary:not(:disabled):not(.disabled):active, .show > .btn-xl-quaternary.dropdown-toggle {
    color: var(--light);
    background-color: var(--quaternary);
    border-color: var(--quaternary);
    box-shadow: 0 0 0 0.2rem var(--quaternary-rgba-translucent);
  }
  .btn-xl-quaternary.focus, .btn-xl-quaternary:focus {
    box-shadow: 0 0 0 0.2rem var(--quaternary-rgba-translucent);
    background: var(--quaternary);
    border-color: var(--quaternary);
  }
  .btn-xl-outline-quaternary {
    color: var(--quaternary);
    border-color: var(--quaternary);
    border-width: 2px;
    background: transparent;
  }
  .btn-xl-outline-quaternary:hover, .btn-xl-outline-quaternary:not(:disabled):not(.disabled).active, .btn-xl-outline-quaternary:not(:disabled):not(.disabled):active, .show > .btn-xl-outline-quaternary.dropdown-toggle, .btn-xl-outline-quaternary.focus, .btn-xl-outline-quaternary:focus {
    color: var(--light);
    background-color: var(--quaternary);
    border-color: var(--quaternary);
    box-shadow: 0 0 0 0.2rem rgb(var(--quaternary-rgb));
  }
  .btn-xl-outline-quaternary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--quaternary-rgb));
  }
  .btn-xl-outline-quaternary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-xl-light {
    background-color: var(--light);
    border-color: var(--light);
  }
  .btn-xl-light:hover, .btn-xl-light:not(:disabled):not(.disabled).active, .btn-xl-light:not(:disabled):not(.disabled):active, .show > .btn-xl-light.dropdown-toggle {
    color: var(--light);
    background-color: var(--light);
    border-color: var(--light);
    box-shadow: 0 0 0 0.2rem var(--light-rgba-translucent);
  }
  .btn-xl-light.focus, .btn-xl-light:focus {
    box-shadow: 0 0 0 0.2rem var(--light-rgba-translucent);
    background: var(--light);
    border-color: var(--light);
  }
  .btn-xl-outline-light {
    color: var(--light);
    border-color: var(--light);
    border-width: 2px;
    background: transparent;
  }
  .btn-xl-outline-light:hover, .btn-xl-outline-light:not(:disabled):not(.disabled).active, .btn-xl-outline-light:not(:disabled):not(.disabled):active, .show > .btn-xl-outline-light.dropdown-toggle, .btn-xl-outline-light.focus, .btn-xl-outline-light:focus {
    color: var(--light);
    background-color: var(--light);
    border-color: var(--light);
    box-shadow: 0 0 0 0.2rem rgb(var(--light-rgb));
  }
  .btn-xl-outline-light.btn-icon i {
    color: #fff;
    background-color: rgb(var(--light-rgb));
  }
  .btn-xl-outline-light.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-xl-light:hover, .btn-xl-light:not(:disabled):not(.disabled).active, .btn-xl-light:not(:disabled):not(.disabled):active, .show > .btn-xl-light.dropdown-toggle, .btn-xl-outline-light:hover, .btn-xl-outline-light:not(:disabled):not(.disabled).active, .btn-xl-outline-light:not(:disabled):not(.disabled):active, .show > .btn-xl-outline-light.dropdown-toggle, .btn-xl-outline-light.focus, .btn-xl-outline-light:focus, .btn-xl-outline-light.btn-icon i {
    color: var(--dark);
  }
  .btn-xl-gray {
    background-color: var(--gray);
    border-color: var(--gray);
  }
  .btn-xl-gray:hover, .btn-xl-gray:not(:disabled):not(.disabled).active, .btn-xl-gray:not(:disabled):not(.disabled):active, .show > .btn-xl-gray.dropdown-toggle {
    color: var(--light);
    background-color: var(--gray);
    border-color: var(--gray);
    box-shadow: 0 0 0 0.2rem var(--gray-rgba-translucent);
  }
  .btn-xl-gray.focus, .btn-xl-gray:focus {
    box-shadow: 0 0 0 0.2rem var(--gray-rgba-translucent);
    background: var(--gray);
    border-color: var(--gray);
  }
  .btn-xl-outline-gray {
    color: var(--gray);
    border-color: var(--gray);
    border-width: 2px;
    background: transparent;
  }
  .btn-xl-outline-gray:hover, .btn-xl-outline-gray:not(:disabled):not(.disabled).active, .btn-xl-outline-gray:not(:disabled):not(.disabled):active, .show > .btn-xl-outline-gray.dropdown-toggle, .btn-xl-outline-gray.focus, .btn-xl-outline-gray:focus {
    color: var(--light);
    background-color: var(--gray);
    border-color: var(--gray);
    box-shadow: 0 0 0 0.2rem rgb(var(--gray-rgb));
  }
  .btn-xl-outline-gray.btn-icon i {
    color: #fff;
    background-color: rgb(var(--gray-rgb));
  }
  .btn-xl-outline-gray.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-xl-dark {
    background-color: var(--dark);
    border-color: var(--dark);
  }
  .btn-xl-dark:hover, .btn-xl-dark:not(:disabled):not(.disabled).active, .btn-xl-dark:not(:disabled):not(.disabled):active, .show > .btn-xl-dark.dropdown-toggle {
    color: var(--light);
    background-color: var(--dark);
    border-color: var(--dark);
    box-shadow: 0 0 0 0.2rem var(--dark-rgba-translucent);
  }
  .btn-xl-dark.focus, .btn-xl-dark:focus {
    box-shadow: 0 0 0 0.2rem var(--dark-rgba-translucent);
    background: var(--dark);
    border-color: var(--dark);
  }
  .btn-xl-outline-dark {
    color: var(--dark);
    border-color: var(--dark);
    border-width: 2px;
    background: transparent;
  }
  .btn-xl-outline-dark:hover, .btn-xl-outline-dark:not(:disabled):not(.disabled).active, .btn-xl-outline-dark:not(:disabled):not(.disabled):active, .show > .btn-xl-outline-dark.dropdown-toggle, .btn-xl-outline-dark.focus, .btn-xl-outline-dark:focus {
    color: var(--light);
    background-color: var(--dark);
    border-color: var(--dark);
    box-shadow: 0 0 0 0.2rem rgb(var(--dark-rgb));
  }
  .btn-xl-outline-dark.btn-icon i {
    color: #fff;
    background-color: rgb(var(--dark-rgb));
  }
  .btn-xl-outline-dark.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-xl-dark-gray {
    background-color: var(--dark-gray);
    border-color: var(--dark-gray);
  }
  .btn-xl-dark-gray:hover, .btn-xl-dark-gray:not(:disabled):not(.disabled).active, .btn-xl-dark-gray:not(:disabled):not(.disabled):active, .show > .btn-xl-dark-gray.dropdown-toggle {
    color: var(--light);
    background-color: var(--dark-gray);
    border-color: var(--dark-gray);
    box-shadow: 0 0 0 0.2rem var(--dark-gray-rgba-translucent);
  }
  .btn-xl-dark-gray.focus, .btn-xl-dark-gray:focus {
    box-shadow: 0 0 0 0.2rem var(--dark-gray-rgba-translucent);
    background: var(--dark-gray);
    border-color: var(--dark-gray);
  }
  .btn-xl-outline-dark-gray {
    color: var(--dark-gray);
    border-color: var(--dark-gray);
    border-width: 2px;
    background: transparent;
  }
  .btn-xl-outline-dark-gray:hover, .btn-xl-outline-dark-gray:not(:disabled):not(.disabled).active, .btn-xl-outline-dark-gray:not(:disabled):not(.disabled):active, .show > .btn-xl-outline-dark-gray.dropdown-toggle, .btn-xl-outline-dark-gray.focus, .btn-xl-outline-dark-gray:focus {
    color: var(--light);
    background-color: var(--dark-gray);
    border-color: var(--dark-gray);
    box-shadow: 0 0 0 0.2rem rgb(var(--dark-gray-rgb));
  }
  .btn-xl-outline-dark-gray.btn-icon i {
    color: #fff;
    background-color: rgb(var(--dark-gray-rgb));
  }
  .btn-xl-outline-dark-gray.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
}
@media (min-width: 1400px) {
  /* If color primary is light then change text color to dark */
  /* If color secondary is light then change text color to dark */
  /* If color tertiary is light then change text color to dark */
  /* If color quaternary is light then change text color to dark */
  /* If color light is light then change text color to dark */
  /* If color gray is light then change text color to dark */
  /* If color dark is light then change text color to dark */
  /* If color dark-gray is light then change text color to dark */
  .btn-xxl-primary {
    background-color: var(--primary);
    border-color: var(--primary);
  }
  .btn-xxl-primary:hover, .btn-xxl-primary:not(:disabled):not(.disabled).active, .btn-xxl-primary:not(:disabled):not(.disabled):active, .show > .btn-xxl-primary.dropdown-toggle {
    color: var(--light);
    background-color: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 0 0 0.2rem var(--primary-rgba-translucent);
  }
  .btn-xxl-primary.focus, .btn-xxl-primary:focus {
    box-shadow: 0 0 0 0.2rem var(--primary-rgba-translucent);
    background: var(--primary);
    border-color: var(--primary);
  }
  .btn-xxl-outline-primary {
    color: var(--primary);
    border-color: var(--primary);
    border-width: 2px;
    background: transparent;
  }
  .btn-xxl-outline-primary:hover, .btn-xxl-outline-primary:not(:disabled):not(.disabled).active, .btn-xxl-outline-primary:not(:disabled):not(.disabled):active, .show > .btn-xxl-outline-primary.dropdown-toggle, .btn-xxl-outline-primary.focus, .btn-xxl-outline-primary:focus {
    color: var(--light);
    background-color: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 0 0 0.2rem rgb(var(--primary-rgb));
  }
  .btn-xxl-outline-primary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--primary-rgb));
  }
  .btn-xxl-outline-primary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-xxl-secondary {
    background-color: var(--secondary);
    border-color: var(--secondary);
  }
  .btn-xxl-secondary:hover, .btn-xxl-secondary:not(:disabled):not(.disabled).active, .btn-xxl-secondary:not(:disabled):not(.disabled):active, .show > .btn-xxl-secondary.dropdown-toggle {
    color: var(--light);
    background-color: var(--secondary);
    border-color: var(--secondary);
    box-shadow: 0 0 0 0.2rem var(--secondary-rgba-translucent);
  }
  .btn-xxl-secondary.focus, .btn-xxl-secondary:focus {
    box-shadow: 0 0 0 0.2rem var(--secondary-rgba-translucent);
    background: var(--secondary);
    border-color: var(--secondary);
  }
  .btn-xxl-outline-secondary {
    color: var(--secondary);
    border-color: var(--secondary);
    border-width: 2px;
    background: transparent;
  }
  .btn-xxl-outline-secondary:hover, .btn-xxl-outline-secondary:not(:disabled):not(.disabled).active, .btn-xxl-outline-secondary:not(:disabled):not(.disabled):active, .show > .btn-xxl-outline-secondary.dropdown-toggle, .btn-xxl-outline-secondary.focus, .btn-xxl-outline-secondary:focus {
    color: var(--light);
    background-color: var(--secondary);
    border-color: var(--secondary);
    box-shadow: 0 0 0 0.2rem rgb(var(--secondary-rgb));
  }
  .btn-xxl-outline-secondary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--secondary-rgb));
  }
  .btn-xxl-outline-secondary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-xxl-tertiary {
    background-color: var(--tertiary);
    border-color: var(--tertiary);
  }
  .btn-xxl-tertiary:hover, .btn-xxl-tertiary:not(:disabled):not(.disabled).active, .btn-xxl-tertiary:not(:disabled):not(.disabled):active, .show > .btn-xxl-tertiary.dropdown-toggle {
    color: var(--light);
    background-color: var(--tertiary);
    border-color: var(--tertiary);
    box-shadow: 0 0 0 0.2rem var(--tertiary-rgba-translucent);
  }
  .btn-xxl-tertiary.focus, .btn-xxl-tertiary:focus {
    box-shadow: 0 0 0 0.2rem var(--tertiary-rgba-translucent);
    background: var(--tertiary);
    border-color: var(--tertiary);
  }
  .btn-xxl-outline-tertiary {
    color: var(--tertiary);
    border-color: var(--tertiary);
    border-width: 2px;
    background: transparent;
  }
  .btn-xxl-outline-tertiary:hover, .btn-xxl-outline-tertiary:not(:disabled):not(.disabled).active, .btn-xxl-outline-tertiary:not(:disabled):not(.disabled):active, .show > .btn-xxl-outline-tertiary.dropdown-toggle, .btn-xxl-outline-tertiary.focus, .btn-xxl-outline-tertiary:focus {
    color: var(--light);
    background-color: var(--tertiary);
    border-color: var(--tertiary);
    box-shadow: 0 0 0 0.2rem rgb(var(--tertiary-rgb));
  }
  .btn-xxl-outline-tertiary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--tertiary-rgb));
  }
  .btn-xxl-outline-tertiary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-xxl-quaternary {
    background-color: var(--quaternary);
    border-color: var(--quaternary);
  }
  .btn-xxl-quaternary:hover, .btn-xxl-quaternary:not(:disabled):not(.disabled).active, .btn-xxl-quaternary:not(:disabled):not(.disabled):active, .show > .btn-xxl-quaternary.dropdown-toggle {
    color: var(--light);
    background-color: var(--quaternary);
    border-color: var(--quaternary);
    box-shadow: 0 0 0 0.2rem var(--quaternary-rgba-translucent);
  }
  .btn-xxl-quaternary.focus, .btn-xxl-quaternary:focus {
    box-shadow: 0 0 0 0.2rem var(--quaternary-rgba-translucent);
    background: var(--quaternary);
    border-color: var(--quaternary);
  }
  .btn-xxl-outline-quaternary {
    color: var(--quaternary);
    border-color: var(--quaternary);
    border-width: 2px;
    background: transparent;
  }
  .btn-xxl-outline-quaternary:hover, .btn-xxl-outline-quaternary:not(:disabled):not(.disabled).active, .btn-xxl-outline-quaternary:not(:disabled):not(.disabled):active, .show > .btn-xxl-outline-quaternary.dropdown-toggle, .btn-xxl-outline-quaternary.focus, .btn-xxl-outline-quaternary:focus {
    color: var(--light);
    background-color: var(--quaternary);
    border-color: var(--quaternary);
    box-shadow: 0 0 0 0.2rem rgb(var(--quaternary-rgb));
  }
  .btn-xxl-outline-quaternary.btn-icon i {
    color: #fff;
    background-color: rgb(var(--quaternary-rgb));
  }
  .btn-xxl-outline-quaternary.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-xxl-light {
    background-color: var(--light);
    border-color: var(--light);
  }
  .btn-xxl-light:hover, .btn-xxl-light:not(:disabled):not(.disabled).active, .btn-xxl-light:not(:disabled):not(.disabled):active, .show > .btn-xxl-light.dropdown-toggle {
    color: var(--light);
    background-color: var(--light);
    border-color: var(--light);
    box-shadow: 0 0 0 0.2rem var(--light-rgba-translucent);
  }
  .btn-xxl-light.focus, .btn-xxl-light:focus {
    box-shadow: 0 0 0 0.2rem var(--light-rgba-translucent);
    background: var(--light);
    border-color: var(--light);
  }
  .btn-xxl-outline-light {
    color: var(--light);
    border-color: var(--light);
    border-width: 2px;
    background: transparent;
  }
  .btn-xxl-outline-light:hover, .btn-xxl-outline-light:not(:disabled):not(.disabled).active, .btn-xxl-outline-light:not(:disabled):not(.disabled):active, .show > .btn-xxl-outline-light.dropdown-toggle, .btn-xxl-outline-light.focus, .btn-xxl-outline-light:focus {
    color: var(--light);
    background-color: var(--light);
    border-color: var(--light);
    box-shadow: 0 0 0 0.2rem rgb(var(--light-rgb));
  }
  .btn-xxl-outline-light.btn-icon i {
    color: #fff;
    background-color: rgb(var(--light-rgb));
  }
  .btn-xxl-outline-light.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-xxl-light:hover, .btn-xxl-light:not(:disabled):not(.disabled).active, .btn-xxl-light:not(:disabled):not(.disabled):active, .show > .btn-xxl-light.dropdown-toggle, .btn-xxl-outline-light:hover, .btn-xxl-outline-light:not(:disabled):not(.disabled).active, .btn-xxl-outline-light:not(:disabled):not(.disabled):active, .show > .btn-xxl-outline-light.dropdown-toggle, .btn-xxl-outline-light.focus, .btn-xxl-outline-light:focus, .btn-xxl-outline-light.btn-icon i {
    color: var(--dark);
  }
  .btn-xxl-gray {
    background-color: var(--gray);
    border-color: var(--gray);
  }
  .btn-xxl-gray:hover, .btn-xxl-gray:not(:disabled):not(.disabled).active, .btn-xxl-gray:not(:disabled):not(.disabled):active, .show > .btn-xxl-gray.dropdown-toggle {
    color: var(--light);
    background-color: var(--gray);
    border-color: var(--gray);
    box-shadow: 0 0 0 0.2rem var(--gray-rgba-translucent);
  }
  .btn-xxl-gray.focus, .btn-xxl-gray:focus {
    box-shadow: 0 0 0 0.2rem var(--gray-rgba-translucent);
    background: var(--gray);
    border-color: var(--gray);
  }
  .btn-xxl-outline-gray {
    color: var(--gray);
    border-color: var(--gray);
    border-width: 2px;
    background: transparent;
  }
  .btn-xxl-outline-gray:hover, .btn-xxl-outline-gray:not(:disabled):not(.disabled).active, .btn-xxl-outline-gray:not(:disabled):not(.disabled):active, .show > .btn-xxl-outline-gray.dropdown-toggle, .btn-xxl-outline-gray.focus, .btn-xxl-outline-gray:focus {
    color: var(--light);
    background-color: var(--gray);
    border-color: var(--gray);
    box-shadow: 0 0 0 0.2rem rgb(var(--gray-rgb));
  }
  .btn-xxl-outline-gray.btn-icon i {
    color: #fff;
    background-color: rgb(var(--gray-rgb));
  }
  .btn-xxl-outline-gray.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-xxl-dark {
    background-color: var(--dark);
    border-color: var(--dark);
  }
  .btn-xxl-dark:hover, .btn-xxl-dark:not(:disabled):not(.disabled).active, .btn-xxl-dark:not(:disabled):not(.disabled):active, .show > .btn-xxl-dark.dropdown-toggle {
    color: var(--light);
    background-color: var(--dark);
    border-color: var(--dark);
    box-shadow: 0 0 0 0.2rem var(--dark-rgba-translucent);
  }
  .btn-xxl-dark.focus, .btn-xxl-dark:focus {
    box-shadow: 0 0 0 0.2rem var(--dark-rgba-translucent);
    background: var(--dark);
    border-color: var(--dark);
  }
  .btn-xxl-outline-dark {
    color: var(--dark);
    border-color: var(--dark);
    border-width: 2px;
    background: transparent;
  }
  .btn-xxl-outline-dark:hover, .btn-xxl-outline-dark:not(:disabled):not(.disabled).active, .btn-xxl-outline-dark:not(:disabled):not(.disabled):active, .show > .btn-xxl-outline-dark.dropdown-toggle, .btn-xxl-outline-dark.focus, .btn-xxl-outline-dark:focus {
    color: var(--light);
    background-color: var(--dark);
    border-color: var(--dark);
    box-shadow: 0 0 0 0.2rem rgb(var(--dark-rgb));
  }
  .btn-xxl-outline-dark.btn-icon i {
    color: #fff;
    background-color: rgb(var(--dark-rgb));
  }
  .btn-xxl-outline-dark.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
  .btn-xxl-dark-gray {
    background-color: var(--dark-gray);
    border-color: var(--dark-gray);
  }
  .btn-xxl-dark-gray:hover, .btn-xxl-dark-gray:not(:disabled):not(.disabled).active, .btn-xxl-dark-gray:not(:disabled):not(.disabled):active, .show > .btn-xxl-dark-gray.dropdown-toggle {
    color: var(--light);
    background-color: var(--dark-gray);
    border-color: var(--dark-gray);
    box-shadow: 0 0 0 0.2rem var(--dark-gray-rgba-translucent);
  }
  .btn-xxl-dark-gray.focus, .btn-xxl-dark-gray:focus {
    box-shadow: 0 0 0 0.2rem var(--dark-gray-rgba-translucent);
    background: var(--dark-gray);
    border-color: var(--dark-gray);
  }
  .btn-xxl-outline-dark-gray {
    color: var(--dark-gray);
    border-color: var(--dark-gray);
    border-width: 2px;
    background: transparent;
  }
  .btn-xxl-outline-dark-gray:hover, .btn-xxl-outline-dark-gray:not(:disabled):not(.disabled).active, .btn-xxl-outline-dark-gray:not(:disabled):not(.disabled):active, .show > .btn-xxl-outline-dark-gray.dropdown-toggle, .btn-xxl-outline-dark-gray.focus, .btn-xxl-outline-dark-gray:focus {
    color: var(--light);
    background-color: var(--dark-gray);
    border-color: var(--dark-gray);
    box-shadow: 0 0 0 0.2rem rgb(var(--dark-gray-rgb));
  }
  .btn-xxl-outline-dark-gray.btn-icon i {
    color: #fff;
    background-color: rgb(var(--dark-gray-rgb));
  }
  .btn-xxl-outline-dark-gray.btn-icon:hover i {
    background-color: rgba(0, 0, 0, 0.13);
  }
}
/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* //// Utilities ////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.d-none {
  display: none !important;
}
.d-block {
  display: block !important;
}
.d-inline {
  display: inline !important;
}
.d-inline-block {
  display: inline-block !important;
}
.d-flex {
  display: flex !important;
}
.d-inline-flex {
  display: inline-flex !important;
}
.d-grid {
  display: grid !important;
}
.d-table {
  display: table !important;
}
.d-table-row {
  display: table-row !important;
}
.d-table-cell {
  display: table-cell !important;
}
@media (min-width: 576px) {
  .d-sm-none {
    display: none !important;
  }
  .d-sm-block {
    display: block !important;
  }
  .d-sm-inline {
    display: inline !important;
  }
  .d-sm-inline-block {
    display: inline-block !important;
  }
  .d-sm-flex {
    display: flex !important;
  }
  .d-sm-inline-flex {
    display: inline-flex !important;
  }
  .d-sm-grid {
    display: grid !important;
  }
  .d-sm-table {
    display: table !important;
  }
  .d-sm-table-row {
    display: table-row !important;
  }
  .d-sm-table-cell {
    display: table-cell !important;
  }
}
@media (min-width: 768px) {
  .d-md-none {
    display: none !important;
  }
  .d-md-block {
    display: block !important;
  }
  .d-md-inline {
    display: inline !important;
  }
  .d-md-inline-block {
    display: inline-block !important;
  }
  .d-md-flex {
    display: flex !important;
  }
  .d-md-inline-flex {
    display: inline-flex !important;
  }
  .d-md-grid {
    display: grid !important;
  }
  .d-md-table {
    display: table !important;
  }
  .d-md-table-row {
    display: table-row !important;
  }
  .d-md-table-cell {
    display: table-cell !important;
  }
}
@media (min-width: 992px) {
  .d-navbrk-none {
    display: none !important;
  }
  .d-navbrk-block {
    display: block !important;
  }
  .d-navbrk-inline {
    display: inline !important;
  }
  .d-navbrk-inline-block {
    display: inline-block !important;
  }
  .d-navbrk-flex {
    display: flex !important;
  }
  .d-navbrk-inline-flex {
    display: inline-flex !important;
  }
  .d-navbrk-grid {
    display: grid !important;
  }
  .d-navbrk-table {
    display: table !important;
  }
  .d-navbrk-table-row {
    display: table-row !important;
  }
  .d-navbrk-table-cell {
    display: table-cell !important;
  }
}
@media (min-width: 992px) {
  .d-lg-none {
    display: none !important;
  }
  .d-lg-block {
    display: block !important;
  }
  .d-lg-inline {
    display: inline !important;
  }
  .d-lg-inline-block {
    display: inline-block !important;
  }
  .d-lg-flex {
    display: flex !important;
  }
  .d-lg-inline-flex {
    display: inline-flex !important;
  }
  .d-lg-grid {
    display: grid !important;
  }
  .d-lg-table {
    display: table !important;
  }
  .d-lg-table-row {
    display: table-row !important;
  }
  .d-lg-table-cell {
    display: table-cell !important;
  }
}
@media (min-width: 992px) {
  .d-navbrk-none {
    display: none !important;
  }
  .d-navbrk-block {
    display: block !important;
  }
  .d-navbrk-inline {
    display: inline !important;
  }
  .d-navbrk-inline-block {
    display: inline-block !important;
  }
  .d-navbrk-flex {
    display: flex !important;
  }
  .d-navbrk-inline-flex {
    display: inline-flex !important;
  }
  .d-navbrk-grid {
    display: grid !important;
  }
  .d-navbrk-table {
    display: table !important;
  }
  .d-navbrk-table-row {
    display: table-row !important;
  }
  .d-navbrk-table-cell {
    display: table-cell !important;
  }
}
@media (min-width: 1200px) {
  .d-xl-none {
    display: none !important;
  }
  .d-xl-block {
    display: block !important;
  }
  .d-xl-inline {
    display: inline !important;
  }
  .d-xl-inline-block {
    display: inline-block !important;
  }
  .d-xl-flex {
    display: flex !important;
  }
  .d-xl-inline-flex {
    display: inline-flex !important;
  }
  .d-xl-grid {
    display: grid !important;
  }
  .d-xl-table {
    display: table !important;
  }
  .d-xl-table-row {
    display: table-row !important;
  }
  .d-xl-table-cell {
    display: table-cell !important;
  }
}
@media (min-width: 1400px) {
  .d-xxl-none {
    display: none !important;
  }
  .d-xxl-block {
    display: block !important;
  }
  .d-xxl-inline {
    display: inline !important;
  }
  .d-xxl-inline-block {
    display: inline-block !important;
  }
  .d-xxl-flex {
    display: flex !important;
  }
  .d-xxl-inline-flex {
    display: inline-flex !important;
  }
  .d-xxl-grid {
    display: grid !important;
  }
  .d-xxl-table {
    display: table !important;
  }
  .d-xxl-table-row {
    display: table-row !important;
  }
  .d-xxl-table-cell {
    display: table-cell !important;
  }
}
.bg-primary-to-primary {
  background: var(--primary) !important;
  background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
}
.bg-primary-to-secondary {
  background: var(--primary) !important;
  background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
}
.bg-primary-to-tertiary {
  background: var(--primary) !important;
  background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
}
.bg-primary-to-quaternary {
  background: var(--primary) !important;
  background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
}
.bg-primary-to-light {
  background: var(--primary) !important;
  background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
}
.bg-primary-to-gray {
  background: var(--primary) !important;
  background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
}
.bg-primary-to-dark {
  background: var(--primary) !important;
  background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
}
.bg-primary-to-dark-gray {
  background: var(--primary) !important;
  background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
}
.bg-primary {
  background-color: var(--primary) !important;
}
.text-primary {
  color: var(--primary) !important;
}
.hover-primary:hover {
  color: var(--primary) !important;
}
.hover-bg-primary:hover {
  background-color: var(--primary) !important;
}
.hover-btn-primary:hover {
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
}
.bg-secondary-to-primary {
  background: var(--secondary) !important;
  background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
}
.bg-secondary-to-secondary {
  background: var(--secondary) !important;
  background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
}
.bg-secondary-to-tertiary {
  background: var(--secondary) !important;
  background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
}
.bg-secondary-to-quaternary {
  background: var(--secondary) !important;
  background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
}
.bg-secondary-to-light {
  background: var(--secondary) !important;
  background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
}
.bg-secondary-to-gray {
  background: var(--secondary) !important;
  background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
}
.bg-secondary-to-dark {
  background: var(--secondary) !important;
  background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
}
.bg-secondary-to-dark-gray {
  background: var(--secondary) !important;
  background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
}
.bg-secondary {
  background-color: var(--secondary) !important;
}
.text-secondary {
  color: var(--secondary) !important;
}
.hover-secondary:hover {
  color: var(--secondary) !important;
}
.hover-bg-secondary:hover {
  background-color: var(--secondary) !important;
}
.hover-btn-secondary:hover {
  background-color: var(--secondary) !important;
  border-color: var(--secondary) !important;
}
.bg-tertiary-to-primary {
  background: var(--tertiary) !important;
  background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
}
.bg-tertiary-to-secondary {
  background: var(--tertiary) !important;
  background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
}
.bg-tertiary-to-tertiary {
  background: var(--tertiary) !important;
  background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
}
.bg-tertiary-to-quaternary {
  background: var(--tertiary) !important;
  background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
}
.bg-tertiary-to-light {
  background: var(--tertiary) !important;
  background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
}
.bg-tertiary-to-gray {
  background: var(--tertiary) !important;
  background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
}
.bg-tertiary-to-dark {
  background: var(--tertiary) !important;
  background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
}
.bg-tertiary-to-dark-gray {
  background: var(--tertiary) !important;
  background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
}
.bg-tertiary {
  background-color: var(--tertiary) !important;
}
.text-tertiary {
  color: var(--tertiary) !important;
}
.hover-tertiary:hover {
  color: var(--tertiary) !important;
}
.hover-bg-tertiary:hover {
  background-color: var(--tertiary) !important;
}
.hover-btn-tertiary:hover {
  background-color: var(--tertiary) !important;
  border-color: var(--tertiary) !important;
}
.bg-quaternary-to-primary {
  background: var(--quaternary) !important;
  background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
}
.bg-quaternary-to-secondary {
  background: var(--quaternary) !important;
  background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
}
.bg-quaternary-to-tertiary {
  background: var(--quaternary) !important;
  background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
}
.bg-quaternary-to-quaternary {
  background: var(--quaternary) !important;
  background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
}
.bg-quaternary-to-light {
  background: var(--quaternary) !important;
  background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
}
.bg-quaternary-to-gray {
  background: var(--quaternary) !important;
  background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
}
.bg-quaternary-to-dark {
  background: var(--quaternary) !important;
  background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
}
.bg-quaternary-to-dark-gray {
  background: var(--quaternary) !important;
  background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
}
.bg-quaternary {
  background-color: var(--quaternary) !important;
}
.text-quaternary {
  color: var(--quaternary) !important;
}
.hover-quaternary:hover {
  color: var(--quaternary) !important;
}
.hover-bg-quaternary:hover {
  background-color: var(--quaternary) !important;
}
.hover-btn-quaternary:hover {
  background-color: var(--quaternary) !important;
  border-color: var(--quaternary) !important;
}
.bg-light-to-primary {
  background: var(--light) !important;
  background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
}
.bg-light-to-secondary {
  background: var(--light) !important;
  background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
}
.bg-light-to-tertiary {
  background: var(--light) !important;
  background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
}
.bg-light-to-quaternary {
  background: var(--light) !important;
  background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
}
.bg-light-to-light {
  background: var(--light) !important;
  background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
}
.bg-light-to-gray {
  background: var(--light) !important;
  background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
}
.bg-light-to-dark {
  background: var(--light) !important;
  background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
}
.bg-light-to-dark-gray {
  background: var(--light) !important;
  background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
}
.bg-light {
  background-color: var(--light) !important;
}
.text-light {
  color: var(--light) !important;
}
.hover-light:hover {
  color: var(--light) !important;
}
.hover-bg-light:hover {
  background-color: var(--light) !important;
}
.hover-btn-light:hover {
  background-color: var(--light) !important;
  border-color: var(--light) !important;
}
.bg-gray-to-primary {
  background: var(--gray) !important;
  background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
}
.bg-gray-to-secondary {
  background: var(--gray) !important;
  background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
}
.bg-gray-to-tertiary {
  background: var(--gray) !important;
  background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
}
.bg-gray-to-quaternary {
  background: var(--gray) !important;
  background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
}
.bg-gray-to-light {
  background: var(--gray) !important;
  background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
}
.bg-gray-to-gray {
  background: var(--gray) !important;
  background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
}
.bg-gray-to-dark {
  background: var(--gray) !important;
  background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
}
.bg-gray-to-dark-gray {
  background: var(--gray) !important;
  background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
}
.bg-gray {
  background-color: var(--gray) !important;
}
.text-gray {
  color: var(--gray) !important;
}
.hover-gray:hover {
  color: var(--gray) !important;
}
.hover-bg-gray:hover {
  background-color: var(--gray) !important;
}
.hover-btn-gray:hover {
  background-color: var(--gray) !important;
  border-color: var(--gray) !important;
}
.bg-dark-to-primary {
  background: var(--dark) !important;
  background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
}
.bg-dark-to-secondary {
  background: var(--dark) !important;
  background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
}
.bg-dark-to-tertiary {
  background: var(--dark) !important;
  background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
}
.bg-dark-to-quaternary {
  background: var(--dark) !important;
  background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
}
.bg-dark-to-light {
  background: var(--dark) !important;
  background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
}
.bg-dark-to-gray {
  background: var(--dark) !important;
  background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
}
.bg-dark-to-dark {
  background: var(--dark) !important;
  background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
}
.bg-dark-to-dark-gray {
  background: var(--dark) !important;
  background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
}
.bg-dark {
  background-color: var(--dark) !important;
}
.text-dark {
  color: var(--dark) !important;
}
.hover-dark:hover {
  color: var(--dark) !important;
}
.hover-bg-dark:hover {
  background-color: var(--dark) !important;
}
.hover-btn-dark:hover {
  background-color: var(--dark) !important;
  border-color: var(--dark) !important;
}
.bg-dark-gray-to-primary {
  background: var(--dark-gray) !important;
  background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
}
.bg-dark-gray-to-secondary {
  background: var(--dark-gray) !important;
  background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
}
.bg-dark-gray-to-tertiary {
  background: var(--dark-gray) !important;
  background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
}
.bg-dark-gray-to-quaternary {
  background: var(--dark-gray) !important;
  background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
}
.bg-dark-gray-to-light {
  background: var(--dark-gray) !important;
  background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
}
.bg-dark-gray-to-gray {
  background: var(--dark-gray) !important;
  background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
}
.bg-dark-gray-to-dark {
  background: var(--dark-gray) !important;
  background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
}
.bg-dark-gray-to-dark-gray {
  background: var(--dark-gray) !important;
  background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
}
.bg-dark-gray {
  background-color: var(--dark-gray) !important;
}
.text-dark-gray {
  color: var(--dark-gray) !important;
}
.hover-dark-gray:hover {
  color: var(--dark-gray) !important;
}
.hover-bg-dark-gray:hover {
  background-color: var(--dark-gray) !important;
}
.hover-btn-dark-gray:hover {
  background-color: var(--dark-gray) !important;
  border-color: var(--dark-gray) !important;
}
@media (min-width: 576px) {
  .bg-sm-primary-to-primary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-sm-primary-to-secondary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-sm-primary-to-tertiary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-sm-primary-to-quaternary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-sm-primary-to-light {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-sm-primary-to-gray {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-sm-primary-to-dark {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-sm-primary-to-dark-gray {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-sm-primary {
    background-color: var(--primary) !important;
  }
  .text-sm-primary {
    color: var(--primary) !important;
  }
  .hover-sm-primary:hover {
    color: var(--primary) !important;
  }
  .hover-sm-bg-primary:hover {
    background-color: var(--primary) !important;
  }
  .hover-sm-btn-primary:hover {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
  }
  .bg-sm-secondary-to-primary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-sm-secondary-to-secondary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-sm-secondary-to-tertiary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-sm-secondary-to-quaternary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-sm-secondary-to-light {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-sm-secondary-to-gray {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-sm-secondary-to-dark {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-sm-secondary-to-dark-gray {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-sm-secondary {
    background-color: var(--secondary) !important;
  }
  .text-sm-secondary {
    color: var(--secondary) !important;
  }
  .hover-sm-secondary:hover {
    color: var(--secondary) !important;
  }
  .hover-sm-bg-secondary:hover {
    background-color: var(--secondary) !important;
  }
  .hover-sm-btn-secondary:hover {
    background-color: var(--secondary) !important;
    border-color: var(--secondary) !important;
  }
  .bg-sm-tertiary-to-primary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-sm-tertiary-to-secondary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-sm-tertiary-to-tertiary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-sm-tertiary-to-quaternary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-sm-tertiary-to-light {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-sm-tertiary-to-gray {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-sm-tertiary-to-dark {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-sm-tertiary-to-dark-gray {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-sm-tertiary {
    background-color: var(--tertiary) !important;
  }
  .text-sm-tertiary {
    color: var(--tertiary) !important;
  }
  .hover-sm-tertiary:hover {
    color: var(--tertiary) !important;
  }
  .hover-sm-bg-tertiary:hover {
    background-color: var(--tertiary) !important;
  }
  .hover-sm-btn-tertiary:hover {
    background-color: var(--tertiary) !important;
    border-color: var(--tertiary) !important;
  }
  .bg-sm-quaternary-to-primary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-sm-quaternary-to-secondary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-sm-quaternary-to-tertiary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-sm-quaternary-to-quaternary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-sm-quaternary-to-light {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-sm-quaternary-to-gray {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-sm-quaternary-to-dark {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-sm-quaternary-to-dark-gray {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-sm-quaternary {
    background-color: var(--quaternary) !important;
  }
  .text-sm-quaternary {
    color: var(--quaternary) !important;
  }
  .hover-sm-quaternary:hover {
    color: var(--quaternary) !important;
  }
  .hover-sm-bg-quaternary:hover {
    background-color: var(--quaternary) !important;
  }
  .hover-sm-btn-quaternary:hover {
    background-color: var(--quaternary) !important;
    border-color: var(--quaternary) !important;
  }
  .bg-sm-light-to-primary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-sm-light-to-secondary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-sm-light-to-tertiary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-sm-light-to-quaternary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-sm-light-to-light {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-sm-light-to-gray {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-sm-light-to-dark {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-sm-light-to-dark-gray {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-sm-light {
    background-color: var(--light) !important;
  }
  .text-sm-light {
    color: var(--light) !important;
  }
  .hover-sm-light:hover {
    color: var(--light) !important;
  }
  .hover-sm-bg-light:hover {
    background-color: var(--light) !important;
  }
  .hover-sm-btn-light:hover {
    background-color: var(--light) !important;
    border-color: var(--light) !important;
  }
  .bg-sm-gray-to-primary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-sm-gray-to-secondary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-sm-gray-to-tertiary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-sm-gray-to-quaternary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-sm-gray-to-light {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-sm-gray-to-gray {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-sm-gray-to-dark {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-sm-gray-to-dark-gray {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-sm-gray {
    background-color: var(--gray) !important;
  }
  .text-sm-gray {
    color: var(--gray) !important;
  }
  .hover-sm-gray:hover {
    color: var(--gray) !important;
  }
  .hover-sm-bg-gray:hover {
    background-color: var(--gray) !important;
  }
  .hover-sm-btn-gray:hover {
    background-color: var(--gray) !important;
    border-color: var(--gray) !important;
  }
  .bg-sm-dark-to-primary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-sm-dark-to-secondary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-sm-dark-to-tertiary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-sm-dark-to-quaternary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-sm-dark-to-light {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-sm-dark-to-gray {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-sm-dark-to-dark {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-sm-dark-to-dark-gray {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-sm-dark {
    background-color: var(--dark) !important;
  }
  .text-sm-dark {
    color: var(--dark) !important;
  }
  .hover-sm-dark:hover {
    color: var(--dark) !important;
  }
  .hover-sm-bg-dark:hover {
    background-color: var(--dark) !important;
  }
  .hover-sm-btn-dark:hover {
    background-color: var(--dark) !important;
    border-color: var(--dark) !important;
  }
  .bg-sm-dark-gray-to-primary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-sm-dark-gray-to-secondary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-sm-dark-gray-to-tertiary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-sm-dark-gray-to-quaternary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-sm-dark-gray-to-light {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-sm-dark-gray-to-gray {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-sm-dark-gray-to-dark {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-sm-dark-gray-to-dark-gray {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-sm-dark-gray {
    background-color: var(--dark-gray) !important;
  }
  .text-sm-dark-gray {
    color: var(--dark-gray) !important;
  }
  .hover-sm-dark-gray:hover {
    color: var(--dark-gray) !important;
  }
  .hover-sm-bg-dark-gray:hover {
    background-color: var(--dark-gray) !important;
  }
  .hover-sm-btn-dark-gray:hover {
    background-color: var(--dark-gray) !important;
    border-color: var(--dark-gray) !important;
  }
}
@media (min-width: 768px) {
  .bg-md-primary-to-primary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-md-primary-to-secondary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-md-primary-to-tertiary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-md-primary-to-quaternary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-md-primary-to-light {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-md-primary-to-gray {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-md-primary-to-dark {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-md-primary-to-dark-gray {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-md-primary {
    background-color: var(--primary) !important;
  }
  .text-md-primary {
    color: var(--primary) !important;
  }
  .hover-md-primary:hover {
    color: var(--primary) !important;
  }
  .hover-md-bg-primary:hover {
    background-color: var(--primary) !important;
  }
  .hover-md-btn-primary:hover {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
  }
  .bg-md-secondary-to-primary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-md-secondary-to-secondary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-md-secondary-to-tertiary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-md-secondary-to-quaternary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-md-secondary-to-light {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-md-secondary-to-gray {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-md-secondary-to-dark {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-md-secondary-to-dark-gray {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-md-secondary {
    background-color: var(--secondary) !important;
  }
  .text-md-secondary {
    color: var(--secondary) !important;
  }
  .hover-md-secondary:hover {
    color: var(--secondary) !important;
  }
  .hover-md-bg-secondary:hover {
    background-color: var(--secondary) !important;
  }
  .hover-md-btn-secondary:hover {
    background-color: var(--secondary) !important;
    border-color: var(--secondary) !important;
  }
  .bg-md-tertiary-to-primary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-md-tertiary-to-secondary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-md-tertiary-to-tertiary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-md-tertiary-to-quaternary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-md-tertiary-to-light {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-md-tertiary-to-gray {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-md-tertiary-to-dark {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-md-tertiary-to-dark-gray {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-md-tertiary {
    background-color: var(--tertiary) !important;
  }
  .text-md-tertiary {
    color: var(--tertiary) !important;
  }
  .hover-md-tertiary:hover {
    color: var(--tertiary) !important;
  }
  .hover-md-bg-tertiary:hover {
    background-color: var(--tertiary) !important;
  }
  .hover-md-btn-tertiary:hover {
    background-color: var(--tertiary) !important;
    border-color: var(--tertiary) !important;
  }
  .bg-md-quaternary-to-primary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-md-quaternary-to-secondary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-md-quaternary-to-tertiary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-md-quaternary-to-quaternary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-md-quaternary-to-light {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-md-quaternary-to-gray {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-md-quaternary-to-dark {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-md-quaternary-to-dark-gray {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-md-quaternary {
    background-color: var(--quaternary) !important;
  }
  .text-md-quaternary {
    color: var(--quaternary) !important;
  }
  .hover-md-quaternary:hover {
    color: var(--quaternary) !important;
  }
  .hover-md-bg-quaternary:hover {
    background-color: var(--quaternary) !important;
  }
  .hover-md-btn-quaternary:hover {
    background-color: var(--quaternary) !important;
    border-color: var(--quaternary) !important;
  }
  .bg-md-light-to-primary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-md-light-to-secondary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-md-light-to-tertiary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-md-light-to-quaternary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-md-light-to-light {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-md-light-to-gray {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-md-light-to-dark {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-md-light-to-dark-gray {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-md-light {
    background-color: var(--light) !important;
  }
  .text-md-light {
    color: var(--light) !important;
  }
  .hover-md-light:hover {
    color: var(--light) !important;
  }
  .hover-md-bg-light:hover {
    background-color: var(--light) !important;
  }
  .hover-md-btn-light:hover {
    background-color: var(--light) !important;
    border-color: var(--light) !important;
  }
  .bg-md-gray-to-primary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-md-gray-to-secondary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-md-gray-to-tertiary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-md-gray-to-quaternary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-md-gray-to-light {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-md-gray-to-gray {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-md-gray-to-dark {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-md-gray-to-dark-gray {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-md-gray {
    background-color: var(--gray) !important;
  }
  .text-md-gray {
    color: var(--gray) !important;
  }
  .hover-md-gray:hover {
    color: var(--gray) !important;
  }
  .hover-md-bg-gray:hover {
    background-color: var(--gray) !important;
  }
  .hover-md-btn-gray:hover {
    background-color: var(--gray) !important;
    border-color: var(--gray) !important;
  }
  .bg-md-dark-to-primary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-md-dark-to-secondary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-md-dark-to-tertiary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-md-dark-to-quaternary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-md-dark-to-light {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-md-dark-to-gray {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-md-dark-to-dark {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-md-dark-to-dark-gray {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-md-dark {
    background-color: var(--dark) !important;
  }
  .text-md-dark {
    color: var(--dark) !important;
  }
  .hover-md-dark:hover {
    color: var(--dark) !important;
  }
  .hover-md-bg-dark:hover {
    background-color: var(--dark) !important;
  }
  .hover-md-btn-dark:hover {
    background-color: var(--dark) !important;
    border-color: var(--dark) !important;
  }
  .bg-md-dark-gray-to-primary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-md-dark-gray-to-secondary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-md-dark-gray-to-tertiary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-md-dark-gray-to-quaternary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-md-dark-gray-to-light {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-md-dark-gray-to-gray {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-md-dark-gray-to-dark {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-md-dark-gray-to-dark-gray {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-md-dark-gray {
    background-color: var(--dark-gray) !important;
  }
  .text-md-dark-gray {
    color: var(--dark-gray) !important;
  }
  .hover-md-dark-gray:hover {
    color: var(--dark-gray) !important;
  }
  .hover-md-bg-dark-gray:hover {
    background-color: var(--dark-gray) !important;
  }
  .hover-md-btn-dark-gray:hover {
    background-color: var(--dark-gray) !important;
    border-color: var(--dark-gray) !important;
  }
}
@media (min-width: 992px) {
  .bg-lg-primary-to-primary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-lg-primary-to-secondary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-lg-primary-to-tertiary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-lg-primary-to-quaternary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-lg-primary-to-light {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-lg-primary-to-gray {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-lg-primary-to-dark {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-lg-primary-to-dark-gray {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-lg-primary {
    background-color: var(--primary) !important;
  }
  .text-lg-primary {
    color: var(--primary) !important;
  }
  .hover-lg-primary:hover {
    color: var(--primary) !important;
  }
  .hover-lg-bg-primary:hover {
    background-color: var(--primary) !important;
  }
  .hover-lg-btn-primary:hover {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
  }
  .bg-lg-secondary-to-primary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-lg-secondary-to-secondary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-lg-secondary-to-tertiary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-lg-secondary-to-quaternary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-lg-secondary-to-light {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-lg-secondary-to-gray {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-lg-secondary-to-dark {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-lg-secondary-to-dark-gray {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-lg-secondary {
    background-color: var(--secondary) !important;
  }
  .text-lg-secondary {
    color: var(--secondary) !important;
  }
  .hover-lg-secondary:hover {
    color: var(--secondary) !important;
  }
  .hover-lg-bg-secondary:hover {
    background-color: var(--secondary) !important;
  }
  .hover-lg-btn-secondary:hover {
    background-color: var(--secondary) !important;
    border-color: var(--secondary) !important;
  }
  .bg-lg-tertiary-to-primary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-lg-tertiary-to-secondary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-lg-tertiary-to-tertiary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-lg-tertiary-to-quaternary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-lg-tertiary-to-light {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-lg-tertiary-to-gray {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-lg-tertiary-to-dark {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-lg-tertiary-to-dark-gray {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-lg-tertiary {
    background-color: var(--tertiary) !important;
  }
  .text-lg-tertiary {
    color: var(--tertiary) !important;
  }
  .hover-lg-tertiary:hover {
    color: var(--tertiary) !important;
  }
  .hover-lg-bg-tertiary:hover {
    background-color: var(--tertiary) !important;
  }
  .hover-lg-btn-tertiary:hover {
    background-color: var(--tertiary) !important;
    border-color: var(--tertiary) !important;
  }
  .bg-lg-quaternary-to-primary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-lg-quaternary-to-secondary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-lg-quaternary-to-tertiary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-lg-quaternary-to-quaternary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-lg-quaternary-to-light {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-lg-quaternary-to-gray {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-lg-quaternary-to-dark {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-lg-quaternary-to-dark-gray {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-lg-quaternary {
    background-color: var(--quaternary) !important;
  }
  .text-lg-quaternary {
    color: var(--quaternary) !important;
  }
  .hover-lg-quaternary:hover {
    color: var(--quaternary) !important;
  }
  .hover-lg-bg-quaternary:hover {
    background-color: var(--quaternary) !important;
  }
  .hover-lg-btn-quaternary:hover {
    background-color: var(--quaternary) !important;
    border-color: var(--quaternary) !important;
  }
  .bg-lg-light-to-primary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-lg-light-to-secondary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-lg-light-to-tertiary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-lg-light-to-quaternary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-lg-light-to-light {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-lg-light-to-gray {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-lg-light-to-dark {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-lg-light-to-dark-gray {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-lg-light {
    background-color: var(--light) !important;
  }
  .text-lg-light {
    color: var(--light) !important;
  }
  .hover-lg-light:hover {
    color: var(--light) !important;
  }
  .hover-lg-bg-light:hover {
    background-color: var(--light) !important;
  }
  .hover-lg-btn-light:hover {
    background-color: var(--light) !important;
    border-color: var(--light) !important;
  }
  .bg-lg-gray-to-primary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-lg-gray-to-secondary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-lg-gray-to-tertiary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-lg-gray-to-quaternary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-lg-gray-to-light {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-lg-gray-to-gray {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-lg-gray-to-dark {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-lg-gray-to-dark-gray {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-lg-gray {
    background-color: var(--gray) !important;
  }
  .text-lg-gray {
    color: var(--gray) !important;
  }
  .hover-lg-gray:hover {
    color: var(--gray) !important;
  }
  .hover-lg-bg-gray:hover {
    background-color: var(--gray) !important;
  }
  .hover-lg-btn-gray:hover {
    background-color: var(--gray) !important;
    border-color: var(--gray) !important;
  }
  .bg-lg-dark-to-primary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-lg-dark-to-secondary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-lg-dark-to-tertiary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-lg-dark-to-quaternary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-lg-dark-to-light {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-lg-dark-to-gray {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-lg-dark-to-dark {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-lg-dark-to-dark-gray {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-lg-dark {
    background-color: var(--dark) !important;
  }
  .text-lg-dark {
    color: var(--dark) !important;
  }
  .hover-lg-dark:hover {
    color: var(--dark) !important;
  }
  .hover-lg-bg-dark:hover {
    background-color: var(--dark) !important;
  }
  .hover-lg-btn-dark:hover {
    background-color: var(--dark) !important;
    border-color: var(--dark) !important;
  }
  .bg-lg-dark-gray-to-primary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-lg-dark-gray-to-secondary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-lg-dark-gray-to-tertiary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-lg-dark-gray-to-quaternary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-lg-dark-gray-to-light {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-lg-dark-gray-to-gray {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-lg-dark-gray-to-dark {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-lg-dark-gray-to-dark-gray {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-lg-dark-gray {
    background-color: var(--dark-gray) !important;
  }
  .text-lg-dark-gray {
    color: var(--dark-gray) !important;
  }
  .hover-lg-dark-gray:hover {
    color: var(--dark-gray) !important;
  }
  .hover-lg-bg-dark-gray:hover {
    background-color: var(--dark-gray) !important;
  }
  .hover-lg-btn-dark-gray:hover {
    background-color: var(--dark-gray) !important;
    border-color: var(--dark-gray) !important;
  }
}
@media (min-width: 1200px) {
  .bg-xl-primary-to-primary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-xl-primary-to-secondary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-xl-primary-to-tertiary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-xl-primary-to-quaternary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-xl-primary-to-light {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-xl-primary-to-gray {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-xl-primary-to-dark {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-xl-primary-to-dark-gray {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-xl-primary {
    background-color: var(--primary) !important;
  }
  .text-xl-primary {
    color: var(--primary) !important;
  }
  .hover-xl-primary:hover {
    color: var(--primary) !important;
  }
  .hover-xl-bg-primary:hover {
    background-color: var(--primary) !important;
  }
  .hover-xl-btn-primary:hover {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
  }
  .bg-xl-secondary-to-primary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-xl-secondary-to-secondary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-xl-secondary-to-tertiary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-xl-secondary-to-quaternary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-xl-secondary-to-light {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-xl-secondary-to-gray {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-xl-secondary-to-dark {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-xl-secondary-to-dark-gray {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-xl-secondary {
    background-color: var(--secondary) !important;
  }
  .text-xl-secondary {
    color: var(--secondary) !important;
  }
  .hover-xl-secondary:hover {
    color: var(--secondary) !important;
  }
  .hover-xl-bg-secondary:hover {
    background-color: var(--secondary) !important;
  }
  .hover-xl-btn-secondary:hover {
    background-color: var(--secondary) !important;
    border-color: var(--secondary) !important;
  }
  .bg-xl-tertiary-to-primary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-xl-tertiary-to-secondary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-xl-tertiary-to-tertiary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-xl-tertiary-to-quaternary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-xl-tertiary-to-light {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-xl-tertiary-to-gray {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-xl-tertiary-to-dark {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-xl-tertiary-to-dark-gray {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-xl-tertiary {
    background-color: var(--tertiary) !important;
  }
  .text-xl-tertiary {
    color: var(--tertiary) !important;
  }
  .hover-xl-tertiary:hover {
    color: var(--tertiary) !important;
  }
  .hover-xl-bg-tertiary:hover {
    background-color: var(--tertiary) !important;
  }
  .hover-xl-btn-tertiary:hover {
    background-color: var(--tertiary) !important;
    border-color: var(--tertiary) !important;
  }
  .bg-xl-quaternary-to-primary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-xl-quaternary-to-secondary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-xl-quaternary-to-tertiary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-xl-quaternary-to-quaternary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-xl-quaternary-to-light {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-xl-quaternary-to-gray {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-xl-quaternary-to-dark {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-xl-quaternary-to-dark-gray {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-xl-quaternary {
    background-color: var(--quaternary) !important;
  }
  .text-xl-quaternary {
    color: var(--quaternary) !important;
  }
  .hover-xl-quaternary:hover {
    color: var(--quaternary) !important;
  }
  .hover-xl-bg-quaternary:hover {
    background-color: var(--quaternary) !important;
  }
  .hover-xl-btn-quaternary:hover {
    background-color: var(--quaternary) !important;
    border-color: var(--quaternary) !important;
  }
  .bg-xl-light-to-primary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-xl-light-to-secondary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-xl-light-to-tertiary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-xl-light-to-quaternary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-xl-light-to-light {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-xl-light-to-gray {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-xl-light-to-dark {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-xl-light-to-dark-gray {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-xl-light {
    background-color: var(--light) !important;
  }
  .text-xl-light {
    color: var(--light) !important;
  }
  .hover-xl-light:hover {
    color: var(--light) !important;
  }
  .hover-xl-bg-light:hover {
    background-color: var(--light) !important;
  }
  .hover-xl-btn-light:hover {
    background-color: var(--light) !important;
    border-color: var(--light) !important;
  }
  .bg-xl-gray-to-primary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-xl-gray-to-secondary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-xl-gray-to-tertiary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-xl-gray-to-quaternary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-xl-gray-to-light {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-xl-gray-to-gray {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-xl-gray-to-dark {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-xl-gray-to-dark-gray {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-xl-gray {
    background-color: var(--gray) !important;
  }
  .text-xl-gray {
    color: var(--gray) !important;
  }
  .hover-xl-gray:hover {
    color: var(--gray) !important;
  }
  .hover-xl-bg-gray:hover {
    background-color: var(--gray) !important;
  }
  .hover-xl-btn-gray:hover {
    background-color: var(--gray) !important;
    border-color: var(--gray) !important;
  }
  .bg-xl-dark-to-primary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-xl-dark-to-secondary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-xl-dark-to-tertiary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-xl-dark-to-quaternary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-xl-dark-to-light {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-xl-dark-to-gray {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-xl-dark-to-dark {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-xl-dark-to-dark-gray {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-xl-dark {
    background-color: var(--dark) !important;
  }
  .text-xl-dark {
    color: var(--dark) !important;
  }
  .hover-xl-dark:hover {
    color: var(--dark) !important;
  }
  .hover-xl-bg-dark:hover {
    background-color: var(--dark) !important;
  }
  .hover-xl-btn-dark:hover {
    background-color: var(--dark) !important;
    border-color: var(--dark) !important;
  }
  .bg-xl-dark-gray-to-primary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-xl-dark-gray-to-secondary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-xl-dark-gray-to-tertiary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-xl-dark-gray-to-quaternary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-xl-dark-gray-to-light {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-xl-dark-gray-to-gray {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-xl-dark-gray-to-dark {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-xl-dark-gray-to-dark-gray {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-xl-dark-gray {
    background-color: var(--dark-gray) !important;
  }
  .text-xl-dark-gray {
    color: var(--dark-gray) !important;
  }
  .hover-xl-dark-gray:hover {
    color: var(--dark-gray) !important;
  }
  .hover-xl-bg-dark-gray:hover {
    background-color: var(--dark-gray) !important;
  }
  .hover-xl-btn-dark-gray:hover {
    background-color: var(--dark-gray) !important;
    border-color: var(--dark-gray) !important;
  }
}
@media (min-width: 1400px) {
  .bg-xxl-primary-to-primary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-xxl-primary-to-secondary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-xxl-primary-to-tertiary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-xxl-primary-to-quaternary {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-xxl-primary-to-light {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-xxl-primary-to-gray {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-xxl-primary-to-dark {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-xxl-primary-to-dark-gray {
    background: var(--primary) !important;
    background: linear-gradient(90deg, rgba(var(--primary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-xxl-primary {
    background-color: var(--primary) !important;
  }
  .text-xxl-primary {
    color: var(--primary) !important;
  }
  .hover-xxl-primary:hover {
    color: var(--primary) !important;
  }
  .hover-xxl-bg-primary:hover {
    background-color: var(--primary) !important;
  }
  .hover-xxl-btn-primary:hover {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
  }
  .bg-xxl-secondary-to-primary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-xxl-secondary-to-secondary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-xxl-secondary-to-tertiary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-xxl-secondary-to-quaternary {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-xxl-secondary-to-light {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-xxl-secondary-to-gray {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-xxl-secondary-to-dark {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-xxl-secondary-to-dark-gray {
    background: var(--secondary) !important;
    background: linear-gradient(90deg, rgba(var(--secondary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-xxl-secondary {
    background-color: var(--secondary) !important;
  }
  .text-xxl-secondary {
    color: var(--secondary) !important;
  }
  .hover-xxl-secondary:hover {
    color: var(--secondary) !important;
  }
  .hover-xxl-bg-secondary:hover {
    background-color: var(--secondary) !important;
  }
  .hover-xxl-btn-secondary:hover {
    background-color: var(--secondary) !important;
    border-color: var(--secondary) !important;
  }
  .bg-xxl-tertiary-to-primary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-xxl-tertiary-to-secondary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-xxl-tertiary-to-tertiary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-xxl-tertiary-to-quaternary {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-xxl-tertiary-to-light {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-xxl-tertiary-to-gray {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-xxl-tertiary-to-dark {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-xxl-tertiary-to-dark-gray {
    background: var(--tertiary) !important;
    background: linear-gradient(90deg, rgba(var(--tertiary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-xxl-tertiary {
    background-color: var(--tertiary) !important;
  }
  .text-xxl-tertiary {
    color: var(--tertiary) !important;
  }
  .hover-xxl-tertiary:hover {
    color: var(--tertiary) !important;
  }
  .hover-xxl-bg-tertiary:hover {
    background-color: var(--tertiary) !important;
  }
  .hover-xxl-btn-tertiary:hover {
    background-color: var(--tertiary) !important;
    border-color: var(--tertiary) !important;
  }
  .bg-xxl-quaternary-to-primary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-xxl-quaternary-to-secondary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-xxl-quaternary-to-tertiary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-xxl-quaternary-to-quaternary {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-xxl-quaternary-to-light {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-xxl-quaternary-to-gray {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-xxl-quaternary-to-dark {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-xxl-quaternary-to-dark-gray {
    background: var(--quaternary) !important;
    background: linear-gradient(90deg, rgba(var(--quaternary-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-xxl-quaternary {
    background-color: var(--quaternary) !important;
  }
  .text-xxl-quaternary {
    color: var(--quaternary) !important;
  }
  .hover-xxl-quaternary:hover {
    color: var(--quaternary) !important;
  }
  .hover-xxl-bg-quaternary:hover {
    background-color: var(--quaternary) !important;
  }
  .hover-xxl-btn-quaternary:hover {
    background-color: var(--quaternary) !important;
    border-color: var(--quaternary) !important;
  }
  .bg-xxl-light-to-primary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-xxl-light-to-secondary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-xxl-light-to-tertiary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-xxl-light-to-quaternary {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-xxl-light-to-light {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-xxl-light-to-gray {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-xxl-light-to-dark {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-xxl-light-to-dark-gray {
    background: var(--light) !important;
    background: linear-gradient(90deg, rgba(var(--light-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-xxl-light {
    background-color: var(--light) !important;
  }
  .text-xxl-light {
    color: var(--light) !important;
  }
  .hover-xxl-light:hover {
    color: var(--light) !important;
  }
  .hover-xxl-bg-light:hover {
    background-color: var(--light) !important;
  }
  .hover-xxl-btn-light:hover {
    background-color: var(--light) !important;
    border-color: var(--light) !important;
  }
  .bg-xxl-gray-to-primary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-xxl-gray-to-secondary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-xxl-gray-to-tertiary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-xxl-gray-to-quaternary {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-xxl-gray-to-light {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-xxl-gray-to-gray {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-xxl-gray-to-dark {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-xxl-gray-to-dark-gray {
    background: var(--gray) !important;
    background: linear-gradient(90deg, rgba(var(--gray-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-xxl-gray {
    background-color: var(--gray) !important;
  }
  .text-xxl-gray {
    color: var(--gray) !important;
  }
  .hover-xxl-gray:hover {
    color: var(--gray) !important;
  }
  .hover-xxl-bg-gray:hover {
    background-color: var(--gray) !important;
  }
  .hover-xxl-btn-gray:hover {
    background-color: var(--gray) !important;
    border-color: var(--gray) !important;
  }
  .bg-xxl-dark-to-primary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-xxl-dark-to-secondary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-xxl-dark-to-tertiary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-xxl-dark-to-quaternary {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-xxl-dark-to-light {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-xxl-dark-to-gray {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-xxl-dark-to-dark {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-xxl-dark-to-dark-gray {
    background: var(--dark) !important;
    background: linear-gradient(90deg, rgba(var(--dark-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-xxl-dark {
    background-color: var(--dark) !important;
  }
  .text-xxl-dark {
    color: var(--dark) !important;
  }
  .hover-xxl-dark:hover {
    color: var(--dark) !important;
  }
  .hover-xxl-bg-dark:hover {
    background-color: var(--dark) !important;
  }
  .hover-xxl-btn-dark:hover {
    background-color: var(--dark) !important;
    border-color: var(--dark) !important;
  }
  .bg-xxl-dark-gray-to-primary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--primary-rgb), 1) 100%) !important;
  }
  .bg-xxl-dark-gray-to-secondary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--secondary-rgb), 1) 100%) !important;
  }
  .bg-xxl-dark-gray-to-tertiary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--tertiary-rgb), 1) 100%) !important;
  }
  .bg-xxl-dark-gray-to-quaternary {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--quaternary-rgb), 1) 100%) !important;
  }
  .bg-xxl-dark-gray-to-light {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--light-rgb), 1) 100%) !important;
  }
  .bg-xxl-dark-gray-to-gray {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--gray-rgb), 1) 100%) !important;
  }
  .bg-xxl-dark-gray-to-dark {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--dark-rgb), 1) 100%) !important;
  }
  .bg-xxl-dark-gray-to-dark-gray {
    background: var(--dark-gray) !important;
    background: linear-gradient(90deg, rgba(var(--dark-gray-rgb), 1) 35%, rgba(var(--dark-gray-rgb), 1) 100%) !important;
  }
  .bg-xxl-dark-gray {
    background-color: var(--dark-gray) !important;
  }
  .text-xxl-dark-gray {
    color: var(--dark-gray) !important;
  }
  .hover-xxl-dark-gray:hover {
    color: var(--dark-gray) !important;
  }
  .hover-xxl-bg-dark-gray:hover {
    background-color: var(--dark-gray) !important;
  }
  .hover-xxl-btn-dark-gray:hover {
    background-color: var(--dark-gray) !important;
    border-color: var(--dark-gray) !important;
  }
}
.nine-h {
  height: var(--nine-h, unset) !important;
}
.nine-w {
  width: var(--nine-w, unset) !important;
}
.nine-h-max {
  max-height: var(--nine-h-max, unset) !important;
}
.nine-w-max {
  max-width: var(--nine-w-max, unset) !important;
}
.nine-h-min {
  min-height: var(--nine-h-min, unset) !important;
}
.nine-w-min {
  min-width: var(--nine-w-min, unset) !important;
}
.nine-obj-p {
  object-position: var(--nine-obj-p);
}
.nine-aspect-ratio {
  aspect-ratio: var(--nine-aspect-ratio);
}
.nine-bg-p {
  background-position: var(--nine-bg-p, center) !important;
}
.nine-bg-s {
  background-size: var(--nine-bg-p, cover) !important;
}
.nine-bg-i {
  background-image: var(--nine-bg-i) !important;
}
.nine-fs {
  font-size: var(--nine-fs) !important;
}
.nine-lh {
  line-height: var(--nine-lh) !important;
}
.nine-b {
  border: var(--nine-b) !important;
}
.nine-bt {
  border-top: var(--nine-bt) !important;
}
.nine-be {
  border-right: var(--nine-be) !important;
}
.nine-bb {
  border-bottom: var(--nine-bb) !important;
}
.nine-bs {
  border-left: var(--nine-bs) !important;
}
.nine-p {
  padding: var(--nine-p) !important;
}
.nine-pt {
  padding-top: var(--nine-pt) !important;
}
.nine-pe {
  padding-right: var(--nine-pe) !important;
}
.nine-pb {
  padding-bottom: var(--nine-pb) !important;
}
.nine-ps {
  padding-left: var(--nine-ps) !important;
}
.nine-px {
  padding-left: var(--nine-px) !important;
  padding-right: var(--nine-px) !important;
}
.nine-py {
  padding-top: var(--nine-py) !important;
  padding-bottom: var(--nine-py) !important;
}
.nine-mt {
  margin-top: var(--nine-mt) !important;
}
.nine-me {
  margin-right: var(--nine-me) !important;
}
.nine-mb {
  margin-bottom: var(--nine-mb) !important;
}
.nine-ms {
  margin-left: var(--nine-ms) !important;
}
.nine-mx {
  margin-left: var(--nine-mx) !important;
  margin-right: var(--nine-mx) !important;
}
.nine-my {
  margin-top: var(--nine-my) !important;
  margin-bottom: var(--nine-my) !important;
}
.nine-pos {
  position: var(--nine-pos) !important;
}
.nine-pos-t {
  top: var(--nine-pos-t) !important;
}
.nine-pos-r {
  right: var(--nine-pos-r) !important;
}
.nine-pos-b {
  bottom: var(--nine-pos-b) !important;
}
.nine-pos-l {
  left: var(--nine-pos-l) !important;
}
.nine-z {
  z-index: var(--nine-z) !important;
}
.nine-flex {
  flex: var(--nine-flex) !important;
}
@media (min-width: 576px) {
  .nine-h-sm {
    height: var(--nine-h-sm) !important;
  }
  .nine-w-sm {
    width: var(--nine-w-sm) !important;
  }
  .nine-h-max-sm {
    max-height: var(--nine-h-max-sm) !important;
  }
  .nine-w-max-sm {
    max-width: var(--nine-w-max-sm) !important;
  }
  .nine-h-min-sm {
    min-height: var(--nine-h-min-sm) !important;
  }
  .nine-w-min-sm {
    min-width: var(--nine-w-min-sm) !important;
  }
  .nine-obj-p-sm {
    object-position: var(--nine-obj-p-sm) !important;
  }
  .nine-aspect-ratio-sm {
    aspect-ratio: var(--nine-aspect-ratio-sm) !important;
  }
  .nine-bg-p-sm {
    background-position: var(--nine-bg-p-sm) !important;
  }
  .nine-bg-s-sm {
    background-size: var(--nine-bg-s-sm) !important;
  }
  .nine-bg-i-sm {
    background-image: var(--nine-bg-i-sm) !important;
  }
  .nine-fs-sm {
    font-size: var(--nine-fs-sm) !important;
  }
  .nine-lh-sm {
    line-height: var(--nine-lh-sm) !important;
  }
  .nine-b-sm {
    border: var(--nine-b-sm) !important;
  }
  .nine-bt-sm {
    border-top: var(--nine-bt-sm) !important;
  }
  .nine-be-sm {
    border-right: var(--nine-be-sm) !important;
  }
  .nine-bb-sm {
    border-bottom: var(--nine-bb-sm) !important;
  }
  .nine-bs-sm {
    border-left: var(--nine-bs-sm) !important;
  }
  .nine-p-sm {
    padding: var(--nine-p-sm) !important;
  }
  .nine-pt-sm {
    padding-top: var(--nine-pt-sm) !important;
  }
  .nine-pe-sm {
    padding-right: var(--nine-pe-sm) !important;
  }
  .nine-pb-sm {
    padding-bottom: var(--nine-pb-sm) !important;
  }
  .nine-ps-sm {
    padding-left: var(--nine-ps-sm) !important;
  }
  .nine-px-sm {
    padding-left: var(--nine-px-sm) !important;
    padding-right: var(--nine-px-sm) !important;
  }
  .nine-py-sm {
    padding-top: var(--nine-py-sm) !important;
    padding-bottom: var(--nine-py-sm) !important;
  }
  .nine-mt-sm {
    margin-top: var(--nine-mt-sm) !important;
  }
  .nine-me-sm {
    margin-right: var(--nine-me-sm) !important;
  }
  .nine-mb-sm {
    margin-bottom: var(--nine-mb-sm) !important;
  }
  .nine-ms-sm {
    margin-left: var(--nine-ms-sm) !important;
  }
  .nine-mx-sm {
    margin-left: var(--nine-mx-sm) !important;
    margin-right: var(--nine-mx-sm) !important;
  }
  .nine-my-sm {
    margin-top: var(--nine-my-sm) !important;
    margin-bottom: var(--nine-my-sm) !important;
  }
  .nine-pos-sm {
    position: var(--nine-pos-sm) !important;
  }
  .nine-pos-t-sm {
    top: var(--nine-pos-t-sm) !important;
  }
  .nine-pos-r-sm {
    right: var(--nine-pos-r-sm) !important;
  }
  .nine-pos-b-sm {
    bottom: var(--nine-pos-b-sm) !important;
  }
  .nine-pos-l-sm {
    left: var(--nine-pos-l-sm) !important;
  }
  .nine-z-sm {
    z-index: var(--nine-z-sm) !important;
  }
  .nine-flex-sm {
    flex: var(--nine-flex-sm) !important;
  }
}
@media (min-width: 768px) {
  .nine-h-md {
    height: var(--nine-h-md) !important;
  }
  .nine-w-md {
    width: var(--nine-w-md) !important;
  }
  .nine-h-max-md {
    max-height: var(--nine-h-max-md) !important;
  }
  .nine-w-max-md {
    max-width: var(--nine-w-max-md) !important;
  }
  .nine-h-min-md {
    min-height: var(--nine-h-min-md) !important;
  }
  .nine-w-min-md {
    min-width: var(--nine-w-min-md) !important;
  }
  .nine-obj-p-md {
    object-position: var(--nine-obj-p-md) !important;
  }
  .nine-aspect-ratio-md {
    aspect-ratio: var(--nine-aspect-ratio-md) !important;
  }
  .nine-bg-p-md {
    background-position: var(--nine-bg-p-md) !important;
  }
  .nine-bg-s-md {
    background-size: var(--nine-bg-s-md) !important;
  }
  .nine-bg-i-md {
    background-image: var(--nine-bg-i-md) !important;
  }
  .nine-fs-md {
    font-size: var(--nine-fs-md) !important;
  }
  .nine-lh-md {
    line-height: var(--nine-lh-md) !important;
  }
  .nine-b-md {
    border: var(--nine-b-md) !important;
  }
  .nine-bt-md {
    border-top: var(--nine-bt-md) !important;
  }
  .nine-be-md {
    border-right: var(--nine-be-md) !important;
  }
  .nine-bb-md {
    border-bottom: var(--nine-bb-md) !important;
  }
  .nine-bs-md {
    border-left: var(--nine-bs-md) !important;
  }
  .nine-p-md {
    padding: var(--nine-p-md) !important;
  }
  .nine-pt-md {
    padding-top: var(--nine-pt-md) !important;
  }
  .nine-pe-md {
    padding-right: var(--nine-pe-md) !important;
  }
  .nine-pb-md {
    padding-bottom: var(--nine-pb-md) !important;
  }
  .nine-ps-md {
    padding-left: var(--nine-ps-md) !important;
  }
  .nine-px-md {
    padding-left: var(--nine-px-md) !important;
    padding-right: var(--nine-px-md) !important;
  }
  .nine-py-md {
    padding-top: var(--nine-py-md) !important;
    padding-bottom: var(--nine-py-md) !important;
  }
  .nine-mt-md {
    margin-top: var(--nine-mt-md) !important;
  }
  .nine-me-md {
    margin-right: var(--nine-me-md) !important;
  }
  .nine-mb-md {
    margin-bottom: var(--nine-mb-md) !important;
  }
  .nine-ms-md {
    margin-left: var(--nine-ms-md) !important;
  }
  .nine-mx-md {
    margin-left: var(--nine-mx-md) !important;
    margin-right: var(--nine-mx-md) !important;
  }
  .nine-my-md {
    margin-top: var(--nine-my-md) !important;
    margin-bottom: var(--nine-my-md) !important;
  }
  .nine-pos-md {
    position: var(--nine-pos-md) !important;
  }
  .nine-pos-t-md {
    top: var(--nine-pos-t-md) !important;
  }
  .nine-pos-r-md {
    right: var(--nine-pos-r-md) !important;
  }
  .nine-pos-b-md {
    bottom: var(--nine-pos-b-md) !important;
  }
  .nine-pos-l-md {
    left: var(--nine-pos-l-md) !important;
  }
  .nine-z-md {
    z-index: var(--nine-z-md) !important;
  }
  .nine-flex-md {
    flex: var(--nine-flex-md) !important;
  }
}
@media (min-width: 992px) {
  .nine-h-lg {
    height: var(--nine-h-lg) !important;
  }
  .nine-w-lg {
    width: var(--nine-w-lg) !important;
  }
  .nine-h-max-lg {
    max-height: var(--nine-h-max-lg) !important;
  }
  .nine-w-max-lg {
    max-width: var(--nine-w-max-lg) !important;
  }
  .nine-h-min-lg {
    min-height: var(--nine-h-min-lg) !important;
  }
  .nine-w-min-lg {
    min-width: var(--nine-w-min-lg) !important;
  }
  .nine-obj-p-lg {
    object-position: var(--nine-obj-p-lg) !important;
  }
  .nine-aspect-ratio-lg {
    aspect-ratio: var(--nine-aspect-ratio-lg) !important;
  }
  .nine-bg-p-lg {
    background-position: var(--nine-bg-p-lg) !important;
  }
  .nine-bg-s-lg {
    background-size: var(--nine-bg-s-lg) !important;
  }
  .nine-bg-i-lg {
    background-image: var(--nine-bg-i-lg) !important;
  }
  .nine-fs-lg {
    font-size: var(--nine-fs-lg) !important;
  }
  .nine-lh-lg {
    line-height: var(--nine-lh-lg) !important;
  }
  .nine-b-lg {
    border: var(--nine-b-lg) !important;
  }
  .nine-bt-lg {
    border-top: var(--nine-bt-lg) !important;
  }
  .nine-be-lg {
    border-right: var(--nine-be-lg) !important;
  }
  .nine-bb-lg {
    border-bottom: var(--nine-bb-lg) !important;
  }
  .nine-bs-lg {
    border-left: var(--nine-bs-lg) !important;
  }
  .nine-p-lg {
    padding: var(--nine-p-lg) !important;
  }
  .nine-pt-lg {
    padding-top: var(--nine-pt-lg) !important;
  }
  .nine-pe-lg {
    padding-right: var(--nine-pe-lg) !important;
  }
  .nine-pb-lg {
    padding-bottom: var(--nine-pb-lg) !important;
  }
  .nine-ps-lg {
    padding-left: var(--nine-ps-lg) !important;
  }
  .nine-px-lg {
    padding-left: var(--nine-px-lg) !important;
    padding-right: var(--nine-px-lg) !important;
  }
  .nine-py-lg {
    padding-top: var(--nine-py-lg) !important;
    padding-bottom: var(--nine-py-lg) !important;
  }
  .nine-mt-lg {
    margin-top: var(--nine-mt-lg) !important;
  }
  .nine-me-lg {
    margin-right: var(--nine-me-lg) !important;
  }
  .nine-mb-lg {
    margin-bottom: var(--nine-mb-lg) !important;
  }
  .nine-ms-lg {
    margin-left: var(--nine-ms-lg) !important;
  }
  .nine-mx-lg {
    margin-left: var(--nine-mx-lg) !important;
    margin-right: var(--nine-mx-lg) !important;
  }
  .nine-my-lg {
    margin-top: var(--nine-my-lg) !important;
    margin-bottom: var(--nine-my-lg) !important;
  }
  .nine-pos-lg {
    position: var(--nine-pos-lg) !important;
  }
  .nine-pos-t-lg {
    top: var(--nine-pos-t-lg) !important;
  }
  .nine-pos-r-lg {
    right: var(--nine-pos-r-lg) !important;
  }
  .nine-pos-b-lg {
    bottom: var(--nine-pos-b-lg) !important;
  }
  .nine-pos-l-lg {
    left: var(--nine-pos-l-lg) !important;
  }
  .nine-z-lg {
    z-index: var(--nine-z-lg) !important;
  }
  .nine-flex-lg {
    flex: var(--nine-flex-lg) !important;
  }
}
@media (min-width: 1200px) {
  .nine-h-xl {
    height: var(--nine-h-xl) !important;
  }
  .nine-w-xl {
    width: var(--nine-w-xl) !important;
  }
  .nine-h-max-xl {
    max-height: var(--nine-h-max-xl) !important;
  }
  .nine-w-max-xl {
    max-width: var(--nine-w-max-xl) !important;
  }
  .nine-h-min-xl {
    min-height: var(--nine-h-min-xl) !important;
  }
  .nine-w-min-xl {
    min-width: var(--nine-w-min-xl) !important;
  }
  .nine-obj-p-xl {
    object-position: var(--nine-obj-p-xl) !important;
  }
  .nine-aspect-ratio-xl {
    aspect-ratio: var(--nine-aspect-ratio-xl) !important;
  }
  .nine-bg-p-xl {
    background-position: var(--nine-bg-p-xl) !important;
  }
  .nine-bg-s-xl {
    background-size: var(--nine-bg-s-xl) !important;
  }
  .nine-bg-i-xl {
    background-image: var(--nine-bg-i-xl) !important;
  }
  .nine-fs-xl {
    font-size: var(--nine-fs-xl) !important;
  }
  .nine-lh-xl {
    line-height: var(--nine-lh-xl) !important;
  }
  .nine-b-xl {
    border: var(--nine-b-xl) !important;
  }
  .nine-bt-xl {
    border-top: var(--nine-bt-xl) !important;
  }
  .nine-be-xl {
    border-right: var(--nine-be-xl) !important;
  }
  .nine-bb-xl {
    border-bottom: var(--nine-bb-xl) !important;
  }
  .nine-bs-xl {
    border-left: var(--nine-bs-xl) !important;
  }
  .nine-p-xl {
    padding: var(--nine-p-xl) !important;
  }
  .nine-pt-xl {
    padding-top: var(--nine-pt-xl) !important;
  }
  .nine-pe-xl {
    padding-right: var(--nine-pe-xl) !important;
  }
  .nine-pb-xl {
    padding-bottom: var(--nine-pb-xl) !important;
  }
  .nine-ps-xl {
    padding-left: var(--nine-ps-xl) !important;
  }
  .nine-px-xl {
    padding-left: var(--nine-px-xl) !important;
    padding-right: var(--nine-px-xl) !important;
  }
  .nine-py-xl {
    padding-top: var(--nine-py-xl) !important;
    padding-bottom: var(--nine-py-xl) !important;
  }
  .nine-mt-xl {
    margin-top: var(--nine-mt-xl) !important;
  }
  .nine-me-xl {
    margin-right: var(--nine-me-xl) !important;
  }
  .nine-mb-xl {
    margin-bottom: var(--nine-mb-xl) !important;
  }
  .nine-ms-xl {
    margin-left: var(--nine-ms-xl) !important;
  }
  .nine-mx-xl {
    margin-left: var(--nine-mx-xl) !important;
    margin-right: var(--nine-mx-xl) !important;
  }
  .nine-my-xl {
    margin-top: var(--nine-my-xl) !important;
    margin-bottom: var(--nine-my-xl) !important;
  }
  .nine-pos-xl {
    position: var(--nine-pos-xl) !important;
  }
  .nine-pos-t-xl {
    top: var(--nine-pos-t-xl) !important;
  }
  .nine-pos-r-xl {
    right: var(--nine-pos-r-xl) !important;
  }
  .nine-pos-b-xl {
    bottom: var(--nine-pos-b-xl) !important;
  }
  .nine-pos-l-xl {
    left: var(--nine-pos-l-xl) !important;
  }
  .nine-z-xl {
    z-index: var(--nine-z-xl) !important;
  }
  .nine-flex-xl {
    flex: var(--nine-flex-xl) !important;
  }
}
@media (min-width: 1400px) {
  .nine-h-xxl {
    height: var(--nine-h-xxl) !important;
  }
  .nine-w-xxl {
    width: var(--nine-w-xxl) !important;
  }
  .nine-h-max-xxl {
    max-height: var(--nine-h-max-xxl) !important;
  }
  .nine-w-max-xxl {
    max-width: var(--nine-w-max-xxl) !important;
  }
  .nine-h-min-xxl {
    min-height: var(--nine-h-min-xxl) !important;
  }
  .nine-w-min-xxl {
    min-width: var(--nine-w-min-xxl) !important;
  }
  .nine-obj-p-xxl {
    object-position: var(--nine-obj-p-xxl) !important;
  }
  .nine-aspect-ratio-xxl {
    aspect-ratio: var(--nine-aspect-ratio-xxl) !important;
  }
  .nine-bg-p-xxl {
    background-position: var(--nine-bg-p-xxl) !important;
  }
  .nine-bg-s-xxl {
    background-size: var(--nine-bg-s-xxl) !important;
  }
  .nine-bg-i-xxl {
    background-image: var(--nine-bg-i-xxl) !important;
  }
  .nine-fs-xxl {
    font-size: var(--nine-fs-xxl) !important;
  }
  .nine-lh-xxl {
    line-height: var(--nine-lh-xxl) !important;
  }
  .nine-b-xxl {
    border: var(--nine-b-xxl) !important;
  }
  .nine-bt-xxl {
    border-top: var(--nine-bt-xxl) !important;
  }
  .nine-be-xxl {
    border-right: var(--nine-be-xxl) !important;
  }
  .nine-bb-xxl {
    border-bottom: var(--nine-bb-xxl) !important;
  }
  .nine-bs-xxl {
    border-left: var(--nine-bs-xxl) !important;
  }
  .nine-p-xxl {
    padding: var(--nine-p-xxl) !important;
  }
  .nine-pt-xxl {
    padding-top: var(--nine-pt-xxl) !important;
  }
  .nine-pe-xxl {
    padding-right: var(--nine-pe-xxl) !important;
  }
  .nine-pb-xxl {
    padding-bottom: var(--nine-pb-xxl) !important;
  }
  .nine-ps-xxl {
    padding-left: var(--nine-ps-xxl) !important;
  }
  .nine-px-xxl {
    padding-left: var(--nine-px-xxl) !important;
    padding-right: var(--nine-px-xxl) !important;
  }
  .nine-py-xxl {
    padding-top: var(--nine-py-xxl) !important;
    padding-bottom: var(--nine-py-xxl) !important;
  }
  .nine-mt-xxl {
    margin-top: var(--nine-mt-xxl) !important;
  }
  .nine-me-xxl {
    margin-right: var(--nine-me-xxl) !important;
  }
  .nine-mb-xxl {
    margin-bottom: var(--nine-mb-xxl) !important;
  }
  .nine-ms-xxl {
    margin-left: var(--nine-ms-xxl) !important;
  }
  .nine-mx-xxl {
    margin-left: var(--nine-mx-xxl) !important;
    margin-right: var(--nine-mx-xxl) !important;
  }
  .nine-my-xxl {
    margin-top: var(--nine-my-xxl) !important;
    margin-bottom: var(--nine-my-xxl) !important;
  }
  .nine-pos-xxl {
    position: var(--nine-pos-xxl) !important;
  }
  .nine-pos-t-xxl {
    top: var(--nine-pos-t-xxl) !important;
  }
  .nine-pos-r-xxl {
    right: var(--nine-pos-r-xxl) !important;
  }
  .nine-pos-b-xxl {
    bottom: var(--nine-pos-b-xxl) !important;
  }
  .nine-pos-l-xxl {
    left: var(--nine-pos-l-xxl) !important;
  }
  .nine-z-xxl {
    z-index: var(--nine-z-xxl) !important;
  }
  .nine-flex-xxl {
    flex: var(--nine-flex-xxl) !important;
  }
}
header .fran-identifier {
  margin-top: 0.25rem;
  font-size: 13px;
  font-weight: 500;
  color: var(--tertiary);
  transition: margin-top var(--transition);
}
header.scrolled .fran-identifier {
  margin-top: 0px;
}
@media (max-width: 991px) {
  body.franchise .item-append {
    margin-top: -4px;
  }
}
hr.primary {
  border: 1px solid var(--primary);
  opacity: 1;
  background-color: var(--primary);
}
hr.secondary {
  border: 1px solid var(--secondary);
  opacity: 1;
  background-color: var(--secondary);
}
hr.tertiary {
  border: 1px solid var(--tertiary);
  opacity: 1;
  background-color: var(--tertiary);
}
hr.quaternary {
  border: 1px solid var(--quaternary);
  opacity: 1;
  background-color: var(--quaternary);
}
hr.light {
  border: 1px solid var(--light);
  opacity: 1;
  background-color: var(--light);
}
hr.gray {
  border: 1px solid var(--gray);
  opacity: 1;
  background-color: var(--gray);
}
hr.dark {
  border: 1px solid var(--dark);
  opacity: 1;
  background-color: var(--dark);
}
hr.dark-gray {
  border: 1px solid var(--dark-gray);
  opacity: 1;
  background-color: var(--dark-gray);
}
:root {
  --border-color: #dee2e6;
}
.border-primary {
  --border-color: var(--primary);
}
.border-secondary {
  --border-color: var(--secondary);
}
.border-tertiary {
  --border-color: var(--tertiary);
}
.border-quaternary {
  --border-color: var(--quaternary);
}
.border-light {
  --border-color: var(--light);
}
.border-gray {
  --border-color: var(--gray);
}
.border-dark {
  --border-color: var(--dark);
}
.border-dark-gray {
  --border-color: var(--dark-gray);
}
.border-faded {
  --border-color: rgba(112, 114, 114, 0.5);
}
.border {
  border: 1px solid var(--border-color) !important;
}
.border-0 {
  border: 0 !important;
}
.border-start {
  border-left: 1px solid var(--border-color) !important;
}
.border-start-0 {
  border-left: 0 !important;
}
.border-end {
  border-right: 1px solid var(--border-color) !important;
}
.border-end-0 {
  border-right: 0 !important;
}
.border-bottom {
  border-bottom: 1px solid var(--border-color) !important;
}
.border-bottom-0 {
  border-bottom: 0 !important;
}
.border-top {
  border-top: 1px solid var(--border-color) !important;
}
.border-top-0 {
  border-top: 0 !important;
}
@media (min-width: 576px) {
  .border-sm {
    border: 1px solid var(--border-color) !important;
  }
  .border-sm-0 {
    border: 0 !important;
  }
  .border-sm-start {
    border-left: 1px solid var(--border-color) !important;
  }
  .border-sm-start-0 {
    border-left: 0 !important;
  }
  .border-sm-end {
    border-right: 1px solid var(--border-color) !important;
  }
  .border-sm-end-0 {
    border-right: 0 !important;
  }
  .border-sm-bottom {
    border-bottom: 1px solid var(--border-color) !important;
  }
  .border-sm-bottom-0 {
    border-bottom: 0 !important;
  }
  .border-sm-top {
    border-top: 1px solid var(--border-color) !important;
  }
  .border-sm-top-0 {
    border-top: 0 !important;
  }
}
@media (min-width: 768px) {
  .border-md {
    border: 1px solid var(--border-color) !important;
  }
  .border-md-0 {
    border: 0 !important;
  }
  .border-md-start {
    border-left: 1px solid var(--border-color) !important;
  }
  .border-md-start-0 {
    border-left: 0 !important;
  }
  .border-md-end {
    border-right: 1px solid var(--border-color) !important;
  }
  .border-md-end-0 {
    border-right: 0 !important;
  }
  .border-md-bottom {
    border-bottom: 1px solid var(--border-color) !important;
  }
  .border-md-bottom-0 {
    border-bottom: 0 !important;
  }
  .border-md-top {
    border-top: 1px solid var(--border-color) !important;
  }
  .border-md-top-0 {
    border-top: 0 !important;
  }
}
@media (min-width: 992px) {
  .border-lg {
    border: 1px solid var(--border-color) !important;
  }
  .border-lg-0 {
    border: 0 !important;
  }
  .border-lg-start {
    border-left: 1px solid var(--border-color) !important;
  }
  .border-lg-start-0 {
    border-left: 0 !important;
  }
  .border-lg-end {
    border-right: 1px solid var(--border-color) !important;
  }
  .border-lg-end-0 {
    border-right: 0 !important;
  }
  .border-lg-bottom {
    border-bottom: 1px solid var(--border-color) !important;
  }
  .border-lg-bottom-0 {
    border-bottom: 0 !important;
  }
  .border-lg-top {
    border-top: 1px solid var(--border-color) !important;
  }
  .border-lg-top-0 {
    border-top: 0 !important;
  }
}
@media (min-width: 1200px) {
  .border-xl {
    border: 1px solid var(--border-color) !important;
  }
  .border-xl-0 {
    border: 0 !important;
  }
  .border-xl-start {
    border-left: 1px solid var(--border-color) !important;
  }
  .border-xl-start-0 {
    border-left: 0 !important;
  }
  .border-xl-end {
    border-right: 1px solid var(--border-color) !important;
  }
  .border-xl-end-0 {
    border-right: 0 !important;
  }
  .border-xl-bottom {
    border-bottom: 1px solid var(--border-color) !important;
  }
  .border-xl-bottom-0 {
    border-bottom: 0 !important;
  }
  .border-xl-top {
    border-top: 1px solid var(--border-color) !important;
  }
  .border-xl-top-0 {
    border-top: 0 !important;
  }
}
@media (min-width: 1400px) {
  .border-xxl {
    border: 1px solid var(--border-color) !important;
  }
  .border-xxl-0 {
    border: 0 !important;
  }
  .border-xxl-start {
    border-left: 1px solid var(--border-color) !important;
  }
  .border-xxl-start-0 {
    border-left: 0 !important;
  }
  .border-xxl-end {
    border-right: 1px solid var(--border-color) !important;
  }
  .border-xxl-end-0 {
    border-right: 0 !important;
  }
  .border-xxl-bottom {
    border-bottom: 1px solid var(--border-color) !important;
  }
  .border-xxl-bottom-0 {
    border-bottom: 0 !important;
  }
  .border-xxl-top {
    border-top: 1px solid var(--border-color) !important;
  }
  .border-xxl-top-0 {
    border-top: 0 !important;
  }
}
.accordion .accordion-item .accordion-header h1, .accordion .accordion-item .accordion-header h2, .accordion .accordion-item .accordion-header h3, .accordion .accordion-item .accordion-header h4, .accordion .accordion-item .accordion-header h5, .accordion .accordion-item .accordion-header h6 {
  margin-bottom: 0;
}
.accordion .accordion-body {
  padding: 20px;
}
/* Accordion Text and Background Color Options */
/* Default */
.accordion .accordion-header button.accordion-button:focus {
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.13);
}
.accordion .accordion-header button.accordion-button:not(.collapsed) {
  background-color: inherit;
}
.accordion.accordion-text-light .accordion-header button.accordion-button {
  color: #fff !important;
}
.accordion.accordion-text-light-hover .accordion-header button.accordion-button:hover {
  color: #fff !important;
}
.accordion.accordion-text-dark .accordion-header button.accordion-button {
  color: #5d5d5d !important;
}
.accordion.accordion-text-dark-hover .accordion-header button.accordion-button:hover {
  color: #5d5d5d !important;
}
.accordion.accordion-bg-light .accordion-header button.accordion-button {
  background-color: #fff !important;
  color: #5d5d5d;
}
.accordion.accordion-bg-light-hover .accordion-header button:hover {
  background-color: #fff !important;
}
.accordion.accordion-bg-dark .accordion-header button.accordion-button {
  background-color: #5d5d5d !important;
  color: #fff;
}
.accordion.accordion-bg-dark-hover .accordion-header button.accordion-button:hover {
  background-color: #5d5d5d !important;
}
.accordion.accordion-text-primary .accordion-header button.accordion-button {
  color: var(--primary) !important;
}
.accordion.accordion-text-primary-hover .accordion-header button.accordion-button:hover {
  color: var(--primary) !important;
}
.accordion.accordion-bg-primary .accordion-header button.accordion-button {
  background-color: var(--primary) !important;
  color: #fff;
}
.accordion.accordion-bg-primary-hover .accordion-header button.accordion-button:hover {
  background-color: var(--primary) !important;
}
.accordion.accordion-text-secondary .accordion-header button.accordion-button {
  color: var(--secondary) !important;
}
.accordion.accordion-text-secondary-hover .accordion-header button.accordion-button:hover {
  color: var(--secondary) !important;
}
.accordion.accordion-bg-secondary .accordion-header button.accordion-button {
  background-color: var(--secondary) !important;
  color: #fff;
}
.accordion.accordion-bg-secondary-hover .accordion-header button.accordion-button:hover {
  background-color: var(--secondary) !important;
}
.accordion.accordion-text-tertiary .accordion-header button.accordion-button {
  color: var(--tertiary) !important;
}
.accordion.accordion-text-tertiary-hover .accordion-header button.accordion-button:hover {
  color: var(--tertiary) !important;
}
.accordion.accordion-bg-tertiary .accordion-header button.accordion-button {
  background-color: var(--tertiary) !important;
  color: #fff;
}
.accordion.accordion-bg-tertiary-hover .accordion-header button.accordion-button:hover {
  background-color: var(--tertiary) !important;
}
.accordion.accordion-text-quaternary .accordion-header button.accordion-button {
  color: var(--quaternary) !important;
}
.accordion.accordion-text-quaternary-hover .accordion-header button.accordion-button:hover {
  color: var(--quaternary) !important;
}
.accordion.accordion-bg-quaternary .accordion-header button.accordion-button {
  background-color: var(--quaternary) !important;
  color: #fff;
}
.accordion.accordion-bg-quaternary-hover .accordion-header button.accordion-button:hover {
  background-color: var(--quaternary) !important;
}
.accordion.accordion-text-light .accordion-header button.accordion-button {
  color: var(--light) !important;
}
.accordion.accordion-text-light-hover .accordion-header button.accordion-button:hover {
  color: var(--light) !important;
}
.accordion.accordion-bg-light .accordion-header button.accordion-button {
  background-color: var(--light) !important;
  color: #fff;
}
.accordion.accordion-bg-light-hover .accordion-header button.accordion-button:hover {
  background-color: var(--light) !important;
}
.accordion.accordion-text-gray .accordion-header button.accordion-button {
  color: var(--gray) !important;
}
.accordion.accordion-text-gray-hover .accordion-header button.accordion-button:hover {
  color: var(--gray) !important;
}
.accordion.accordion-bg-gray .accordion-header button.accordion-button {
  background-color: var(--gray) !important;
  color: #fff;
}
.accordion.accordion-bg-gray-hover .accordion-header button.accordion-button:hover {
  background-color: var(--gray) !important;
}
.accordion.accordion-text-dark .accordion-header button.accordion-button {
  color: var(--dark) !important;
}
.accordion.accordion-text-dark-hover .accordion-header button.accordion-button:hover {
  color: var(--dark) !important;
}
.accordion.accordion-bg-dark .accordion-header button.accordion-button {
  background-color: var(--dark) !important;
  color: #fff;
}
.accordion.accordion-bg-dark-hover .accordion-header button.accordion-button:hover {
  background-color: var(--dark) !important;
}
.accordion.accordion-text-dark-gray .accordion-header button.accordion-button {
  color: var(--dark-gray) !important;
}
.accordion.accordion-text-dark-gray-hover .accordion-header button.accordion-button:hover {
  color: var(--dark-gray) !important;
}
.accordion.accordion-bg-dark-gray .accordion-header button.accordion-button {
  background-color: var(--dark-gray) !important;
  color: #fff;
}
.accordion.accordion-bg-dark-gray-hover .accordion-header button.accordion-button:hover {
  background-color: var(--dark-gray) !important;
}
section.bg-video {
  position: relative;
  color: #fff;
  background-color: transparent;
  overflow: hidden;
}
section.bg-video video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: -100;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  background-repeat: no-repeat;
  background-size: cover;
}
.yt-wrapper {
  position: absolute;
  top: 0%;
  left: 0%;
  min-width: 100%;
  min-height: 100%;
  z-index: 0;
}
section.bg-video .yt-wrapper {
  z-index: -100;
}
.yt-wrapper iframe {
  min-width: 100%;
  min-height: 100%;
}
.yt-poster {
  z-index: 0;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%;
  width: 100%;
  top: 0;
  position: absolute;
  left: 0;
  z-index: 1;
}
section.bg-video .yt-poster {
  z-index: -99;
}
.ui-timepicker-container {
  z-index: 1 !important;
}