:root {
  --primary-main-color-blue: #3276b5;
  --primary-main-color-blue-dark: #1c4265;

  --header-color: var(--primary-main-color-blue-dark);
  --footer-color: var(--primary-main-color-blue-dark);

  --primary-color-white: #ffffff;
  --primary-color-white-soft: #f8fafb;

  --primary-color-dark: #0a1a24;

  --primary-color-grey: #707070;
  --primary-color-grey-soft: #edeef0;
  --primary-color-grey-light: #f4f7f9;

  --secondary-main-color-blue: #36abd9;
  --secondary-color-blue-medium: #8fb4d8;
  --secondary-color-blue-soft: #afd3fc;
  --secondary-color-blue-light: #ebf2fa;

  --secondary-color-grey: #d9d9d9;
  --secondary-color-grey-light: #f4f7f9;

  --color-success: #aae3a84d;
  --color-success-light: #aae3a8;
  --color-warning: #ffe0ba4d;
  --color-critical: #d32f2f;
  --color-critical-light: #fb8080;

  --color-info: var(--primary-main-color-blue);

  --color-grey-font: #b5b5c3;
  --color-blue-grey-font: #4c577d08;
  --color-success-font: #4caf50;
  --color-success-font-light: #71c26e;
  --color-warning-font: #98662e;
  --color-warning-font-light: #ffc374;
  --color-critical-font: var(--color-critical);
  --color-critical-font-light: var(--color-critical-light);
  --color-info-font: var(--primary-color-white);
  --color-purple-alert-font: #9663ed;

  --color-black-shadow: #00000040;
  --color-black-shadow-soft: #00000029;
  --color-black-shadow-hard: #000000bd;
  --color-blue-shadow: #0e223812;
  --color-white-shadow: #ffffff05;

  --font-family: "Heebo", sans-serif;
  --font-family-alt: "Open Sans", sans-serif;
}