/* variables */

* {
  --sans: 'Open Sans', 'Noto Sans Japanese', 'Noto Sans Traditional Chinese', sans-serif;
  --sans-ja: 'Noto Sans Japanese', sans-serif;
  --sans-zh: 'Noto Sans Traditional Chinese', sans-serif;
  --heading: 'Titillium Web';
  --monospace: 'Source Code Pro', monospace;
  --math: 'Computer Modern Serif', serif;

  --dark-bg-color: hsl(0, 0%, 00.00%);
  --darkish-bg-color: hsl(0, 0%, 04.17%);
  --main-bg-color: hsl(0, 0%, 08.33%);
  --light-bg-color: hsl(0, 0%, 16.67%);

  --dark-fg-color: hsl(0, 0%, 50.00%);
  --main-fg-color: hsl(0, 0%, 75.00%);
  --light-fg-color: hsl(0, 0%, 83.33%);
  --lighter-fg-color: hsl(0, 0%, 91.67%);
  --lightest-fg-color: hsl(0, 0%, 100.00%);

  --error-color: hsl(000, 100%, 55%);
  --warning-color: hsl(045, 100%, 55%);
  --success-color: hsl(150, 100%, 55%);
  --info-color: hsl(210, 100%, 55%);
  

  --glowing: hsla(0, 0%, 100%, 0.75) 0 0 0.25em;
}