:root {
  --color-brand-dark: rgba(57, 66, 88, 1);
  --color-brand-light: rgba(255, 209, 45, 1);
  --color-brand-light-30: rgba(255, 209, 45, 0.3);
  --color-brand-light-50: rgba(255, 209, 45, 0.5);
  --color-brand-light-80: rgba(255, 209, 45, 0.8);

  --color-ui-1: rgba(41, 41, 41, 1);
  --color-ui-1-30: rgba(41, 41, 41, 0.3);
  --color-ui-1-50: rgba(41, 41, 41, 0.5);
  --color-ui-1-80: rgba(41, 41, 41, 0.8);

  --color-ui-2: rgba(207, 210, 217, 1);
  --color-ui-2-30: rgba(207, 210, 217, 0.3);
  --color-ui-2-50: rgba(207, 210, 217, 0.5);
  --color-ui-2-80: rgba(207, 210, 217, 0.8);

  --color-ui-3: rgba(240, 242, 245, 1);
  --color-ui-3-30: rgba(240, 242, 245, 0.3);
  --color-ui-3-50: rgba(240, 242, 245, 0.5);
  --color-ui-3-80: rgba(240, 242, 245, 0.8);

  --color-ui-4: rgba(255, 255, 255, 1);

  --color-highlight: var(--color-brand-light);
  --color-warning: rgba(255, 74, 74, 1);
  --color-warning-50: rgba(255, 74, 74, 0.5);
  --color-success: rgba(129, 209, 42, 1);
  --color-link: rgba(74, 144, 226, 1);
  --color-focus: rgba(74, 144, 226, 1);
  --color-focus-80: rgba(74, 144, 226, 0.8);

  --color-shadow-30: rgba(0,0,0,0.3);
  --color-shadow-10: rgba(0,0,0,0.1);

}