:root {
  --font-color: #535353;

  --blue-color-900: #002a38;
  --blue-color-800: #00384b;
  --blue-color-700: #005571;
  --blue-color-600: #007197;
  --blue-color-500: #008ebd;
  --blue-color-400: #32a4ca;
  --blue-color-300: #66bbd7;
  --blue-color-200: #cce8f1;
  --blue-color-100: #ebf5f8;
  --blue-color: var(--blue-color-500);
  --blue-color-transparent: #007197B3;

  --orange-color-900: #211400;
  --orange-color-800: #4e3100;
  --orange-color-700: #7d4f00;
  --orange-color-600: #cd8303;
  --orange-color-500: #F19902;
  --orange-color-400: #f3ad34;
  --orange-color-300: #f6c46d;
  --orange-color-200: #fadeae;
  --orange-color-100: #fff5e7;
  --orange-color: var(--orange-color-500);
  --orange-color-transparent: #F19902e8;

  --green-color-900: #252712;
  --green-color-800: #4a4e25;
  --green-color-700: #6f7637;
  --green-color-600: #949d4a;
  --green-color-500: #b9c55d;
  --green-color-400: #c7d07d;
  --green-color-300: #d5dc9d;
  --green-color-200: #e3e7be;
  --green-color-100: #f7f9e7;
  --green-color: var(--green-color-500);
  --green-color-transparent: #b9c55de8;

  --violet-color-900: #210523;
  --violet-color-800: #330830;
  --violet-color-700: #5c0f54;
  --violet-color-600: #8a187a;
  --violet-color-500: #A41D8F;
  --violet-color-400: #c977b4;
  --violet-color-300: #d99dbd;
  --violet-color-200: #e2b1c2;
  --violet-color-100: #f3e0e4;
  --violet-color: var(--violet-color-500);
  --violet-color-transparent: #A41D8FB3;
}