:root {
    --wpe-font-family: OpenSans, sans-serif;
}

@font-face {
    font-family: OpenSans;
    src: url("https://fonts.locaware.one/OpenSans/light.ttf");
    font-weight: 300;
    font-style: normal;
    ascent-override: 100%;
}

@font-face {
    font-family: OpenSans;
    src: url("https://fonts.locaware.one/OpenSans/regular.ttf");
    font-weight: normal;
    font-style: normal;
    ascent-override: 100%;
}

@font-face {
    font-family: OpenSans;
    src: url("https://fonts.locaware.one/OpenSans/medium.ttf");
    font-weight: 500;
    font-style: normal;
    ascent-override: 100%;
}

@font-face {
    font-family: OpenSans;
    src: url("https://fonts.locaware.one/OpenSans/bold.ttf");
    font-weight: bold;
    font-style: normal;
    ascent-override: 100%;
}

 /* Variables  */
 :root {
  --color-black-black-100: rgba(0, 0, 0, 1);
  --color-black-black-5: rgba(0, 0, 0, 0.05);
  --color-black-black-4: rgba(0, 0, 0, 0.04);
  --color-black-black-10: rgba(0, 0, 0, 0.1);
  --color-black-black-15: rgba(0, 0, 0, 0.15);
  --color-black-black-20: rgba(0, 0, 0, 0.2);
  --color-black-black-25: rgba(0, 0, 0, 0.25);
  --color-black-black-35: rgba(0, 0, 0, 0.35);
  --color-black-black-50: rgba(0, 0, 0, 0.5);
  --color-black-black-60: rgba(0, 0, 0, 0.6);
  --color-white-white-100: rgba(255, 255, 255, 1);
  --color-white-white-5: rgba(255, 255, 255, 0.05);
  --color-white-white-15: rgba(255, 255, 255, 0.15);
  --color-white-white-25: rgba(255, 255, 255, 0.25);
  --color-white-white-35: rgba(255, 255, 255, 0.35);
  --color-white-white-50: rgba(255, 255, 255, 0.5);
  --color-white-white-75: rgba(255, 255, 255, 0.75);
  --color-white-white-85: rgba(255, 255, 255, 0.85);
  --color-white-white-90: rgba(255, 255, 255, 0.9);
  --color-signal-colors-red-signal-100: rgba(224, 0, 0, 1);
  --color-signal-colors-red-signal-10: rgba(224, 0, 0, 0.1);
  --color-signal-colors-red-signal-15: rgba(224, 0, 0, 0.15);
  --color-signal-colors-red-signal-20: rgba(224, 0, 0, 0.2);
  --color-signal-colors-red-signal-25: rgba(224, 0, 0, 0.25);
  --color-signal-colors-red-signal-50: rgba(224, 0, 0, 0.5);
  --color-signal-colors-green-signal-100: rgba(0, 136, 2, 1);
  --color-signal-colors-green-signal-5: rgba(0, 136, 2, 0.05);
  --color-signal-colors-green-signal-10: rgba(0, 136, 2, 0.1);
  --color-signal-colors-green-signal-15: rgba(0, 136, 2, 0.15);
  --color-signal-colors-green-signal-25: rgba(0, 136, 2, 0.25);
  --color-signal-colors-green-signal-35: rgba(0, 136, 2, 0.35);
  --color-signal-colors-green-signal-50: rgba(0, 136, 2, 0.5);
  --color-signal-colors-yellow-signal-10: rgba(255, 149, 0, 0.1);
  --color-signal-colors-yellow-signal-100: rgba(255, 149, 0, 1);
  --color-blue-active-focus-500: rgba(0, 102, 204, 1);
  --color-blue-active-focus-800: rgba(170, 204, 238, 1);
  --color-blue-active-focus-700: rgba(113, 170, 226, 1);
  --color-blue-active-focus-600: rgba(56, 136, 215, 1);
  --color-blue-active-focus-250: rgba(0, 45, 90, 1);
  --color-signal-colors-red-signal-3: rgba(224, 0, 0, 0.03);
  --color-black-black-75: rgba(0, 0, 0, 0.75);
  --color-white-white-10: rgba(255, 255, 255, 0.1);
  --color-white-white-20: rgba(255, 255, 255, 0.2);
  --color-signal-colors-red-signal-on-dark: rgba(243, 153, 153, 1);
  --font-size-text-xxs: 10px;
  --font-size-text-xs: 11px;
  --font-size-text-s: 12px;
  --font-size-text-m: 14px;
  --font-size-text-l: 16px;
  --font-size-text-xl: 18px;
  --font-size-title-s: 20px;
  --font-size-title-m: 22px;
  --font-size-title-l: 26px;
  --font-size-title-xl: 32px;
  --font-size-title-xxl: 40px;
  --font-line-height-text-xxs: 12px;
  --font-line-height-text-xs: 16px;
  --font-line-height-text-s: 16px;
  --font-line-height-text-m: 20px;
  --font-line-height-text-l: 24px;
  --font-line-height-text-xl: 24px;
  --font-line-height-title-s: 24px;
  --font-line-height-title-m: 28px;
  --font-line-height-title-l: 32px;
  --font-line-height-title-xl: 40px;
  --font-line-height-title-xxl: 48px;
  --color-black-black-85: rgba(0, 0, 0, 0.85);
  --radius-button-pill: 28px;
  --radius-button-rectangle: 8px;
  --radius-button-rectangle-plus4px: 12px;
  --color-white-white-65: rgba(255, 255, 255, 0.65);
  --color-white-white-0: rgb(255, 255, 255);
  --color-greys-grey-950: rgba(247, 247, 247, 1);
  --color-greys-grey-900: rgba(233, 233, 233, 1);
  --color-greys-grey-850: rgba(226, 226, 226, 1);
  --color-greys-grey-800: rgba(212, 212, 212, 1);
  --color-greys-grey-750: rgba(198, 198, 198, 1);
  --color-greys-grey-700: rgba(184, 184, 184, 1);
  --color-greys-grey-650: rgba(170, 170, 170, 1);
  --color-greys-grey-600: rgba(156, 156, 156, 1);
  --color-greys-grey-550: rgba(142, 142, 142, 1);
  --color-greys-grey-500: rgba(128, 128, 128, 1);
  --color-greys-grey-450: rgba(113, 113, 113, 1);
  --color-greys-grey-400: rgba(99, 99, 99, 1);
  --color-greys-grey-350: rgba(85, 85, 85, 1);
  --color-greys-grey-300: rgba(71, 71, 71, 1);
  --color-greys-grey-250: rgba(56, 56, 56, 1);
  --color-greys-grey-200: rgba(42, 42, 42, 1);
  --color-greys-grey-150: rgba(28, 28, 28, 1);
  --color-greys-grey-100: rgba(14, 14, 14, 1);
  --color-greys-grey-50: rgba(7, 7, 7, 1);
  --color-primitives-brand-950: rgba(253, 241, 241, 1);
  --color-primitives-brand-900: rgba(250, 213, 215, 1);
  --color-primitives-brand-850: rgba(248, 199, 202, 1);
  --color-primitives-brand-800: rgba(245, 172, 176, 1);
  --color-primitives-brand-750: rgba(242, 144, 150, 1);
  --color-primitives-brand-700: rgba(239, 116, 123, 1);
  --color-primitives-brand-650: rgba(236, 89, 97, 1);
  --color-primitives-brand-600: rgba(233, 61, 71, 1);
  --color-primitives-brand-550: rgba(230, 33, 45, 1);
  --color-primitives-brand-500: rgba(227, 6, 19, 1);
  --color-primitives-brand-450: rgba(201, 5, 16, 1);
  --color-primitives-brand-400: rgba(176, 4, 14, 1);
  --color-primitives-brand-350: rgba(151, 4, 12, 1);
  --color-primitives-brand-300: rgba(126, 3, 10, 1);
  --color-primitives-brand-250: rgba(100, 2, 8, 1);
  --color-primitives-brand-200: rgba(75, 2, 6, 1);
  --color-primitives-brand-150: rgba(50, 1, 4, 1);
  --color-primitives-brand-100: rgba(25, 0, 2, 1);
  --color-primitives-brand-50: rgba(12, 0, 1, 1);
  --spacing-semantic-vertical-adj-text-top: 1px;
  --color-category-colors-category-purple: rgba(112, 0, 198, 1);
  --color-category-colors-category-grey: rgba(149, 149, 149, 1);
  --color-category-colors-category-green: rgba(0, 161, 45, 1);
  --color-category-colors-category-purple-light: rgba(191, 107, 255, 1);
  --color-category-colors-category-grey-light: rgba(202, 202, 202, 1);
  --color-category-colors-category-green-light: rgba(128, 208, 150, 1);
  --color-category-colors-category-blue: rgba(21, 109, 241, 1);
  --color-category-colors-category-blue-light: rgba(122, 169, 239, 1);
  --color-greys-grey-925: rgba(240, 240, 240, 1);
  --spacing-semantic-vertical-adj-text-bot: 3px;
  --color-primitives-brand-975: rgba(254, 250, 250, 1);
  --color-primitives-brand-925: rgba(251, 227, 228, 1);
  --color-signal-colors-signal-green-350: rgba(0, 108, 22, 1);
  --color-primitives-transparent-brand-500-50: rgba(227, 6, 19, 0.5);
  --color-primitives-transparent-brand-500-65: rgba(227, 6, 19, 0.65);
  --color-primitives-transparent-brand-500-85: rgba(227, 6, 19, 0.85);
  --color-primitives-transparent-brand-950-65: rgba(253, 241, 241, 0.65);
  --color-primitives-transparent-brand-800-65: rgba(253, 241, 241, 0.65);
  --color-primitives-transparent-brand-900-65: rgba(253, 241, 241, 0.65);
  --color-primitives-transparent-brand-250-75: rgba(100, 2, 8, 0.75);
  --color-blue-active-focus-900: rgba(212, 229, 246, 1);
  --color-primitives-transparent-brand-500-5: rgba(227, 6, 19, 0.05);
  --color-signal-colors-yellow-signal-25: rgba(255, 149, 0, 0.25);
  --color-primitives-transparent-brand-500-10: rgba(227, 6, 19, 0.1);
  --color-primitives-transparent-brand-800-25: rgba(253, 241, 241, 0.25);
  --color-primitives-transparent-brand-300-50: rgba(126, 3, 10, 0.5);
  --color-blue-active-focus-400: rgba(0, 79, 158, 1);
  --color-blue-active-focus-300: rgba(0, 56, 113, 1);
  --color-blue-active-focus-200: rgba(0, 34, 68, 1);
  --color-blue-active-focus-850: rgba(198, 221, 243, 1);
  --color-blue-active-focus-825: rgba(184, 212, 240, 1);
  --color-blue-active-focus-750: rgba(141, 187, 232, 1);
  --color-signal-colors-red-signal-40: rgba(224, 0, 0, 0.4);
  --color-signal-colors-green-signal-40: rgba(0, 136, 2, 0.4);
  --color-signal-colors-yellow-signal-40: rgba(255, 149, 0, 0.4);
  --color-signal-colors-yellow-signal-15: rgba(255, 149, 0, 0.15);
  --font-size-display-title-m: 64px;
  --font-line-height-display-title-m: 72px;
  --color-primitives-transparent-brand-100-3: rgba(25, 0, 2, 0.03);
  --font-line-height-display-title-s: 68px;
  --font-size-display-title-s: 56px;
  --color-primitives-transparent-brand-200-3: rgba(75, 2, 6, 0.03);
  --color-signal-colors-yellow-signal-wcag-500: rgba(170, 99, 0, 1);
  --color-signal-colors-green-signal-wcag-500: rgba(0, 136, 2, 1);
  --color-signal-colors-red-signal-wcag-500: rgba(219, 6, 6, 1);
  --color-primitives-transparent-brand-150-80: rgba(50, 1, 4, 0.8);
  --color-greys-grey-975: rgba(252, 252, 252, 1);
  --color-primitives-transparent-brand-500-25: rgba(227, 6, 19, 0.25);
  --color-blue-active-focus-950: rgba(240, 246, 252, 1);
  --radius-button-button-radius: 8px;
  --spacing-primitives-space-1: 1px;
  --spacing-primitives-space-2: 2px;
  --spacing-primitives-space-3: 3px;
  --spacing-primitives-space-4: 4px;
  --spacing-primitives-space-5: 5px;
  --spacing-primitives-space-0: 0px;
  --color-primitives-brand-secondary-500: rgba(227, 6, 19, 1);
  --color-primitives-brand-tertiary-500: rgba(227, 6, 19, 1);
  --spacing-primitives-space-6: 6px;
  --color-primitives-brand-500-2: rgba(227, 6, 19, 1);
  --color-category-colors-category-orange: rgba(255, 98, 0, 1);
  --color-category-colors-category-orange-light: rgba(255, 195, 158, 1);
  --color-primitives-transparent-brand-800-85: rgba(253, 241, 241, 0.85);
  --color-primitives-transparent-brand-900-85: rgba(253, 241, 241, 0.85);
}

 /* Aliases  */
 :root {
  --color-semantic-background-disabled: var(--color-greys-grey-850);
  --color-semantic-icon-disabled: var(--color-greys-grey-600);
  --color-semantic-text-disabled: var(--color-greys-grey-600);
  --color-semantic-background-active: var(--color-primitives-brand-900);
  --color-semantic-stroke-disabled: var(--color-greys-grey-850);
  --color-semantic-stroke-default: var(--color-greys-grey-850);
  --color-semantic-background-default: var(--color-white-white-100);
  --color-semantic-text-dark: var(--color-greys-grey-200);
  --color-semantic-stroke-hover: var(--color-greys-grey-600);
  --color-semantic-stroke-pressed: var(--color-greys-grey-300);
  --color-semantic-stroke-active: var(--color-primitives-brand-200);
  --color-semantic-stroke-error: var(--color-signal-colors-red-signal-100);
  --color-semantic-icon-brand-dark: var(--color-primitives-brand-250);
  --color-semantic-text-light: var(--color-greys-grey-450);
  --color-semantic-stroke-selectable: var(--color-greys-grey-700);
  --color-semantic-text-brand-dark: var(--color-primitives-brand-250);
  --color-semantic-background-brand-light: var(--color-white-white-100);
  --color-semantic-text-medium: var(--color-greys-grey-300);
  --color-semantic-text-brand-light: var(--color-primitives-brand-650);
  --color-semantic-icon-brand-light: var(--color-primitives-brand-650);
  --color-semantic-background-brand-dark: var(--color-primitives-brand-350);
  --color-semantic-stroke-brand-default: var(--color-primitives-brand-500);
  --color-semantic-stroke-brand-dark: var(--color-primitives-brand-250);
  --color-semantic-icon-brand-default: var(--color-primitives-brand-500);
  --color-semantic-background-light-grey: var(--color-greys-grey-925);
  --color-semantic-stroke-light: var(--color-greys-grey-900);
  --color-semantic-background-lighter-grey: var(--color-greys-grey-950);
  --color-semantic-stroke-dark: var(--color-greys-grey-800);
  --color-semantic-background-brand-lighter: var(--color-greys-grey-950);
  --color-semantic-text-signalgreen-dark: var(--color-signal-colors-signal-green-350);
  --color-semantic-background-brand-default: var(--color-primitives-brand-500);
  --color-semantic-stroke-brand-light: var(--color-primitives-brand-800);
  --color-semantic-text-light-dark-mode: var(--color-greys-grey-450);
  --color-semantic-text-medium-dark-mode: var(--color-greys-grey-300);
  --color-semantic-text-dark-dark-mode: var(--color-greys-grey-200);
  --color-semantic-text-white: var(--color-white-white-100);
  --color-semantic-icon-white: var(--color-white-white-100);
  --color-semantic-background-brand-darker: var(--color-primitives-brand-150);
  --color-semantic-stroke-brand-darker: var(--color-primitives-brand-200);
  --color-semantic-stroke-brand-lighter: var(--color-primitives-brand-850);
  --color-semantic-text-black: var(--color-black-black-100);
  --color-semantic-icon-black: var(--color-black-black-100);
  --color-semantic-background-medium-grey: var(--color-greys-grey-900);
  --color-semantic-text-brand-lighter: var(--color-primitives-brand-925);
  --color-semantic-icon-brand-lighter: var(--color-primitives-brand-925);
  --color-semantic-surface-brand-hover: var(--color-primitives-brand-350);
  --color-semantic-surface-brand-pressed: var(--color-primitives-brand-400);
  --color-semantic-surface-brand-active: var(--color-white-white-100);
  --color-semantic-surface-brand-default: var(--color-primitives-brand-500);
  --color-semantic-text-brand-default: var(--color-primitives-brand-500);
  --color-semantic-icon-light: var(--color-greys-grey-450);
  --color-semantic-icon-medium: var(--color-greys-grey-300);
  --color-semantic-icon-dark: var(--color-greys-grey-200);
  --color-semantic-stroke-white: var(--color-white-white-100);
  --spacing-semantic-vert-adj-s: var(--spacing-primitives-space-2);
  --spacing-semantic-vert-adj-sm: var(--spacing-primitives-space-3);
  --spacing-semantic-vert-adj-xs: var(--spacing-primitives-space-1);
  --spacing-component-text-vert-adj: var(--spacing-semantic-vert-adj-s);
  --color-semantic-surface-pri: var(--color-primitives-brand-500);
  --color-semantic-text-inverted-sf-pri: var(--color-semantic-text-white);
  --color-semantic-text-inverted-sf-sec: var(--color-semantic-text-black);
  --color-semantic-surface-sec: var(--color-white-white-100);
  --color-semantic-ico-inverted-sf-pri: var(--color-semantic-icon-white);
  --color-semantic-ico-inverted-sf-sec: var(--color-semantic-icon-black);
  --spacing-semantic-vert-adj-0: var(--spacing-primitives-space-0);
  --color-semantic-surface-disabled: var(--color-greys-grey-800);
  --spacing-component-text-vert-adj-small: var(--spacing-semantic-vert-adj-s);
  --spacing-component-text-vert-adj-medium: var(--spacing-semantic-vert-adj-sm);
  --spacing-semantic-vert-adj-m: var(--spacing-primitives-space-4);
}
