:root {
  --breakpoint-xs: 320px;
  --breakpoint-s: 576px;
  --breakpoint-m: 768px;
  --breakpoint-l: 992px;
  --breakpoint-xl: 1248px;
  --breakpoint-xxl: 1440px;
  --container-width-xs: 288px;
  --container-width-s: 544px;
  --container-width-m: 720px;
  --container-width-l: 944px;
  --container-width-xl: 1200px;
  --color-brick: #bd2719;
  --color-brick-light: #ffeeed;
  --color-brick-medium-light: #facbc8;
  --color-brick-dark: #800e04;
  --color-bus: #0000bf;
  --color-bus-light: #f0f0ff;
  --color-bus-medium-light: #ccccff;
  --color-bus-dark: #00005e;
  --color-coat-of-arms: #0072c6;
  --color-coat-of-arms-light: #e6f4ff;
  --color-coat-of-arms-medium-light: #b5daf7;
  --color-coat-of-arms-dark: #005799;
  --color-copper: #00d7a7;
  --color-copper-light: #cffaf1;
  --color-copper-medium-light: #9ef0de;
  --color-copper-dark: #00a17d;
  --color-engel: #ffe977;
  --color-engel-light: #fff9db;
  --color-engel-medium-light: #fff3b8;
  --color-engel-dark: #dbc030;
  --color-fog: #9fc9eb;
  --color-fog-light: #e8f3fc;
  --color-fog-medium-light: #d0e6f7;
  --color-fog-dark: #72a5cf;
  --color-gold: #c2a251;
  --color-gold-light: #f7f2e4;
  --color-gold-medium-light: #e8d7a7;
  --color-gold-dark: #9e823c;
  --color-metro: #fd4f00;
  --color-metro-light: #ffeee6;
  --color-metro-medium-light: #ffcab3;
  --color-metro-dark: #bd2f00;
  --color-silver: #dedfe1;
  --color-silver-light: #f7f7f8;
  --color-silver-medium-light: #efeff0;
  --color-silver-dark: #b0b8bf;
  --color-summer: #ffc61e;
  --color-summer-light: #fff4d4;
  --color-summer-medium-light: #ffe49c;
  --color-summer-dark: #cc9200;
  --color-suomenlinna: #f5a3c7;
  --color-suomenlinna-light: #fff0f7;
  --color-suomenlinna-medium-light: #ffdbeb;
  --color-suomenlinna-dark: #e673a5;
  --color-tram: #008741;
  --color-tram-light: #dff7eb;
  --color-tram-medium-light: #a3e3c2;
  --color-tram-dark: #006631;
  --color-focus-outline: #0072c6;
  --color-black: #000000;
  --color-white: #ffffff;
  --color-black-5: #f2f2f2;
  --color-black-10: #e6e6e6;
  --color-black-20: #cccccc;
  --color-black-30: #b3b3b3;
  --color-black-40: #999999;
  --color-black-50: #808080;
  --color-black-60: #595959;
  --color-black-70: #4d4d4d;
  --color-black-80: #333333;
  --color-black-90: #1a1a1a;
  --color-error: #b01038;
  --color-error-light: #f6e2e6;
  --color-error-dark: #8d0d2d;
  --color-success: #007a64;
  --color-success-light: #e2f5f3;
  --color-success-dark: #006250;
  --color-alert: #ffda07;
  --color-alert-light: #fff4b4;
  --color-alert-dark: #c27900;
  --color-info: #0062b9;
  --color-info-light: #e5eff8;
  --color-info-dark: #004f94;
  --box-shadow-s: 0px 2px 10px 0px rgba(0, 0, 0, 0.07);
  --box-shadow-m: 0px 2px 10px 0px rgba(0, 0, 0, 0.1);
  --box-shadow-l: 0px 2px 20px 0px rgba(0, 0, 0, 0.2);
  --spacing-layout-2-xs: 1rem; /* 16px */
  --spacing-layout-xs: 1.5rem; /* 24px */
  --spacing-layout-s: 2rem; /* 32px */
  --spacing-layout-m: 3rem; /* 48px */
  --spacing-layout-l: 4rem; /* 64px */
  --spacing-layout-xl: 6rem; /* 96px */
  --spacing-layout-2-xl: 8rem; /* 128px */
  --spacing-4-xs: 0.125rem; /* 2px */
  --spacing-3-xs: 0.25rem; /* 4px */
  --spacing-2-xs: 0.5rem; /* 8px */
  --spacing-xs: 0.75rem; /* 12px */
  --spacing-s: 1rem; /* 16px */
  --spacing-m: 1.5rem; /* 24px */
  --spacing-l: 2rem; /* 32px */
  --spacing-xl: 2.5rem; /* 40px */
  --spacing-2-xl: 3.0rem; /* 48px */
  --spacing-3-xl: 3.5rem; /* 56px */
  --spacing-4-xl: 4rem; /* 64px */
  --spacing-5-xl: 4.5rem; /* 72px */
  --fontsize-heading-xxl: 4rem; /* 64px */
  --fontsize-heading-xl: 3rem; /* 48px */
  --fontsize-heading-xl-mobile: 2.5rem; /* 40px */
  --fontsize-heading-l: 2rem; /* 32px */
  --fontsize-heading-m: 1.5rem; /* 24px */
  --fontsize-heading-s: 1.25rem; /* 20px */
  --fontsize-heading-xs: 1.125rem; /* 18px */
  --fontsize-heading-xxs: 1rem; /* 16px */
  --fontsize-body-s: 0.875rem; /* 14px */
  --fontsize-body-m: 1rem; /* 16px */
  --fontsize-body-l: 1.125rem; /* 18px */
  --fontsize-body-xl: 1.25rem; /* 20px */
  --font-default: HelsinkiGroteskPro, Arial, sans-serif;
  --lineheight-s: 1;
  --lineheight-m: 1.2;
  --lineheight-l: 1.5;
  --lineheight-xl: 1.75;
}