:root {
  /* COLORS example : .ep-text-color-neutral-7 */

  --gui-rgb-color-neutral-13: 255, 255, 255; /* #ffffff */
  --gui-rgb-color-neutral-12: 245, 245, 245; /* #f5f5f5 */
  --gui-rgb-color-neutral-11: 238, 238, 238; /* #eeeeee */
  --gui-rgb-color-neutral-10: 224, 224, 224; /* #e0e0e0 */
  --gui-rgb-color-neutral-9: 208, 208, 208; /* #d0d0d0 */
  --gui-rgb-color-neutral-8: 189, 189, 189; /* #bcbcbc */
  --gui-rgb-color-neutral-7: 158, 158, 158; /* #9e9e9e */
  --gui-rgb-color-neutral-6: 117, 117, 117; /* #757575 */
  --gui-rgb-color-neutral-5: 97, 97, 97; /* #616161 */
  --gui-rgb-color-neutral-4: 66, 66, 66; /* #424242 */
  --gui-rgb-color-neutral-3: 44, 44, 44; /* #2c2c2c */
  --gui-rgb-color-neutral-2: 29, 29, 27;
  --gui-rgb-color-neutral-1: 7, 8, 10;

  --gui-rgb-color-primary: 29, 29, 27;
  --gui-rgb-color-primary-active: 44, 44 ,44;
  --gui-rgb-color-primary-high: 7, 8, 10;
  --gui-rgb-color-primary-low: 238, 238, 238;

  --gui-rgb-color-secondary: 238, 238, 238;
  --gui-rgb-color-secondary-active: 255, 255, 255;
  --gui-rgb-color-secondary-high: 208, 208, 208;
  --gui-rgb-color-secondary-low: 245, 245, 245;

  --gui-rgb-color-tertiary: 249, 198, 251;
  --gui-rgb-color-tertiary-active: 254, 218, 255;
  --gui-rgb-color-tertiary-high: 245, 173, 247;
  --gui-rgb-color-tertiary-low: 254, 229, 255;

  --gui-rgb-color-complementary-1: 184, 17, 191;
  --gui-rgb-color-complementary-2: 240, 163, 4;
  --gui-rgb-color-complementary-3: 18, 129, 220;
  --gui-rgb-color-complementary-4: 199, 45, 127;
  --gui-rgb-color-complementary-5: 18, 173, 185;
  --gui-rgb-color-complementary-6: #F8F9FA;

  --gui-rgb-color-success: 160, 217, 17;
  --gui-rgb-color-success-active: 186, 230, 55;
  --gui-rgb-color-success-high: 124, 179, 5;
  --gui-rgb-color-success-low: 244, 255, 184;

  --gui-rgb-color-info: 249, 198, 251;
  --gui-rgb-color-info-active: 254, 218, 255;
  --gui-rgb-color-info-high: 245, 173, 247;
  --gui-rgb-color-info-low: 254, 229, 255;

  --gui-rgb-color-warning: 250, 173, 20;
  --gui-rgb-color-warning-active: 255, 197, 61;
  --gui-rgb-color-warning-high: 212, 136, 6;
  --gui-rgb-color-warning-low: 255, 241, 184;

  --gui-rgb-color-danger: 207, 19, 34;
  --gui-rgb-color-danger-active: 245, 34, 45;
  --gui-rgb-color-danger-high: 168, 7, 26;
  --gui-rgb-color-danger-low: 255, 204, 199;

  --gui-rgb-color-white: 255, 255, 255; /* #ffffff */
  --gui-rgb-color-black: 0, 0, 0; /* #000000 */

  --gui-rgb-color-gray: 97, 97, 97; /* #616161 */
  --gui-rgb-color-gray-high: 30, 30, 30; /* #1e1e1e */
  --gui-rgb-color-gray-low: 250, 250, 250; /* #fafafa */
  --gui-rgb-color-gray-active: 117, 117, 117; /* #757575 */

  --gui-rgb-color-background-default: var(--gui-rgb-color-neutral-13);
  --gui-rgb-color-background-default-active: var(--gui-rgb-color-neutral-12);
  --gui-rgb-color-background-default-high: var(--gui-rgb-color-neutral-2);
  --gui-rgb-color-background-default-low: var(--gui-rgb-color-neutral-10);

  /* COLOR VARIABLES (RGB wrapped) */
  --gui-color-neutral-13: rgb(var(--gui-rgb-color-neutral-13));
  --gui-color-neutral-12: rgb(var(--gui-rgb-color-neutral-12));
  --gui-color-neutral-11: rgb(var(--gui-rgb-color-neutral-11));
  --gui-color-neutral-10: rgb(var(--gui-rgb-color-neutral-10));
  --gui-color-neutral-9: rgb(var(--gui-rgb-color-neutral-9));
  --gui-color-neutral-8: rgb(var(--gui-rgb-color-neutral-8));
  --gui-color-neutral-7: rgb(var(--gui-rgb-color-neutral-7));
  --gui-color-neutral-6: rgb(var(--gui-rgb-color-neutral-6));
  --gui-color-neutral-5: rgb(var(--gui-rgb-color-neutral-5));
  --gui-color-neutral-4: rgb(var(--gui-rgb-color-neutral-4));
  --gui-color-neutral-3: rgb(var(--gui-rgb-color-neutral-3));
  --gui-color-neutral-2: rgb(var(--gui-rgb-color-neutral-2));
  --gui-color-neutral-1: rgb(var(--gui-rgb-color-neutral-1));

  --gui-color-primary: rgb(var(--gui-rgb-color-primary));
  --gui-color-primary-active: rgb(var(--gui-rgb-color-primary-active));
  --gui-color-primary-high: rgb(var(--gui-rgb-color-primary-high));
  --gui-color-primary-low: rgb(var(--gui-rgb-color-primary-low));

  --gui-color-secondary: rgb(var(--gui-rgb-color-secondary));
  --gui-color-secondary-active: rgb(var(--gui-rgb-color-secondary-active));
  --gui-color-secondary-high: rgb(var(--gui-rgb-color-secondary-high));
  --gui-color-secondary-low: rgb(var(--gui-rgb-color-secondary-low));

  --gui-color-tertiary: rgb(var(--gui-rgb-color-tertiary));
  --gui-color-tertiary-active: rgb(var(--gui-rgb-color-tertiary-active));
  --gui-color-tertiary-high: rgb(var(--gui-rgb-color-tertiary-high));
  --gui-color-tertiary-low: rgb(var(--gui-rgb-color-tertiary-low));

  --gui-color-success: rgb(var(--gui-rgb-color-success));
  --gui-color-success-active: rgb(var(--gui-rgb-color-success-active));
  --gui-color-success-high: rgb(var(--gui-rgb-color-success-high));
  --gui-color-success-low: rgb(var(--gui-rgb-color-success-low));

  --gui-color-info: rgb(var(--gui-rgb-color-info));
  --gui-color-info-active: rgb(var(--gui-rgb-color-info-active));
  --gui-color-info-high: rgb(var(--gui-rgb-color-info-high));
  --gui-color-info-low: rgb(var(--gui-rgb-color-info-low));

  --gui-color-warning: rgb(var(--gui-rgb-color-warning));
  --gui-color-warning-active: rgb(var(--gui-rgb-color-warning-active));
  --gui-color-warning-high: rgb(var(--gui-rgb-color-warning-high));
  --gui-color-warning-low: rgb(var(--gui-rgb-color-warning-low));

  --gui-color-danger: rgb(var(--gui-rgb-color-danger));
  --gui-color-danger-active: rgb(var(--gui-rgb-color-danger-active));
  --gui-color-danger-high: rgb(var(--gui-rgb-color-danger-high));
  --gui-color-danger-low: rgb(var(--gui-rgb-color-danger-low));

  --gui-color-white: rgb(var(--gui-rgb-color-white));
  --gui-color-black: rgb(var(--gui-rgb-color-black));

  --gui-color-gray: rgb(var(--gui-rgb-color-gray));
  --gui-color-gray-high: rgb(var(--gui-rgb-color-gray-high));
  --gui-color-gray-low: rgb(var(--gui-rgb-color-gray-low));
  --gui-color-gray-active: rgb(var(--gui-rgb-color-gray-active));

  --gui-shadow-small: 0px 3px 0px 0px rgba(0, 0, 0, 0.3);

  /* BORDERS */

  --gui-border-width-extra-small: 2px;
  --gui-border-width-small: 4px;
  --gui-border-width-medium: 6px;
  --gui-border-width-large: 8px;

  --gui-border-radius-extra-small: 4px;
  --gui-border-radius-small: 8px;
  --gui-border-radius-medium: 16px;
  --gui-border-radius-large: 24px;

  /* TEXT example : .text-extra-small */

  --gui-font-family-default: var(--font-mona-sans);

  --gui-text-color: var(--gui-color-neutral-2);

  --gui-text-font-size-extra-small: 11px;
  --gui-text-line-height-extra-small: 16px;

  --gui-text-font-size-small: 12px;
  --gui-text-line-height-small: 18px;

  --gui-text-font-size-medium: 14px;
  --gui-text-line-height-medium: 22px;

  --gui-text-font-size-large: 16px;
  --gui-text-line-height-large: 24px;

  --gui-text-font-size-extra-large: 21px;
  --gui-text-line-height-extra-large: 30px;

  /* FONT WEIGHT example : .text-weight-extra-light */

  --gui-text-font-weight-extra-light: 200;

  --gui-text-font-weight-light: 300;

  --gui-text-font-weight-regular: 400;

  --gui-text-font-weight-medium: 500;

  --gui-text-font-weight-semi-bold: 600;

  --gui-text-font-weight-bold: 700;

  --gui-text-font-weight-extra-bold: 800;

  --gui-text-font-weight-black: 900;

  --gui-text-font-weight: var(--gui-text-font-weight-regular);

  /* HEADINGS example : .h2 */

  --gui-font-family-heading: var(--font-oxanium), serif;

  --gui-heading-color: var(--gui-color-neutral-2);

  --gui-h1-font-size: 68px;
  --gui-h1-line-height: 72px;
  --gui-h1-font-size-mobile: 40px;
  --gui-h1-line-height-mobile: 44px;
  --gui-h1-font-weight: var(--gui-text-font-weight-bold);

  --gui-h2-font-size: 46px;
  --gui-h2-line-height: 52px;
  --gui-h2-font-size-mobile: 32px;
  --gui-h2-line-height-mobile: 36px;
  --gui-h2-font-weight: var(--gui-text-font-weight-bold);

  --gui-h3-font-size: 34px;
  --gui-h3-line-height: 38px;
  --gui-h3-font-size-mobile: 26px;
  --gui-h3-line-height-mobile: 30px;
  --gui-h3-font-weight: var(--gui-text-font-weight-bold);

  --gui-h4-font-size: 26px;
  --gui-h4-line-height: 30px;
  --gui-h4-font-size-mobile: 21px;
  --gui-h4-line-height-mobile: 24px;
  --gui-h4-font-weight: var(--gui-text-font-weight-bold);

  --gui-h5-font-size: 21px;
  --gui-h5-line-height: 24px;
  --gui-h5-font-size-mobile: 18px;
  --gui-h5-line-height-mobile: 20px;
  --gui-h5-font-weight: var(--gui-text-font-weight-bold);

  --gui-h6-font-size: 16px;
  --gui-h6-line-height: 20px;
  --gui-h6-font-size-mobile: 14px;
  --gui-h6-line-height-mobile: 15px;
  --gui-h6-font-weight: var(--gui-text-font-weight-bold);

  /* MISCELLANEOUS */

  --gui-url-static-icons: 'https://static.ep-builder.com/icons/';

  --gui-grid-container: var(--gui-grid-breakpoints-xxl);

  --gui-input-small-height: 32px;
  --gui-input-medium-height: 56px;
  --gui-input-large-height: 72px;
  --gui-input-border-color-success: var(--gui-color-neutral-11);

  /* CUSTOM */

  --gui-modal-backdrop-color: rgba(0, 0, 0, 0.5);

  --sidebar-initial-width: 16px;
  /* --sidebar-left-focus-width: 0px; */
  --sidebar-left-focus-width: 240px;
  /* --sidebar-right-focus-width: 0px; */
  --sidebar-right-focus-width: 648px;

  --header-height: 56px;
  --footer-height: 24px;

  --dpe-letter-icon-size: 10px;

  --dpe-letter-medium-font-size: 12px;
  --dpe-letter-medium-line-height: 14px;

  --dpe-letter-medium-nc-font-size: 8px;
  --dpe-letter-medium-nc-line-height: 10px;

  --dpe-letter-icon-font-size: 20px;
  --dpe-letter-icon-line-height: 22px;

  --dpe-letter-icon-nc-font-size: 12px;
  --dpe-letter-icon-nc-line-height: 22px;

  --dpe-letter-large-font-size: 28px;
  --dpe-letter-large-line-height: 32px;

  --dpe-letter-large-nc-font-size: 18px;
  --dpe-letter-large-nc-line-height: 36px;

  --dpe-letter-A-background-color: #007a01;
  --dpe-letter-B-background-color: #51a340;
  --dpe-letter-C-background-color: #c8d900;
  --dpe-letter-D-background-color: #ffef51;
  --dpe-letter-E-background-color: #ffc54d;
  --dpe-letter-F-background-color: #ff7a01;
  --dpe-letter-G-background-color: #cd0020;

  --dpe-letter-A-color: white;
  --dpe-letter-B-color: black;
  --dpe-letter-C-color: black;
  --dpe-letter-D-color: black;
  --dpe-letter-E-color: black;
  --dpe-letter-F-color: black;
  --dpe-letter-G-color: white;

  --total-dpe-width: 106px;
}

html,
body {
  scroll-behavior: smooth;
  overflow-x: hidden;
  height: 100%;
}

ul {
  --gui-list-style: none;
  --gui-list-content: '';
  --gui-list-item-size: 24px;
}