/*
 *
 * Dark, Brown, Yellow, 
 * Golden, Blue, Nature, 
 * Green, Pink, Snow
 * 
 */

:root {
  --color-dark-50: #ececec;
  --color-dark-100: #D6D6D6;
  --color-dark-200: #BFBFBF;
  --color-dark-300: #808080;
  --color-dark-400: #404040;
  --color-dark-500: #2A2A2A;
  --color-dark-600: #262626;
  --color-dark-700: #1E1E1E;
  --color-dark-800: #131314;
  --color-dark-900: #0C0C0C;
  --color-dark-950: #000000;

  --color-brown-50: #F6F0E9;
  --color-brown-100: #FFF5E1;
  --color-brown-200: #E1D3BC;
  --color-brown-300: #BFA28D;
  --color-brown-400: #998777;
  --color-brown-500: #49413C;
  --color-brown-600: #6E6258;
  --color-brown-700: #615951;
  --color-brown-800: #2E2925;
  --color-brown-900: #120D0A;
  --color-brown-950: #0C0806;

  --color-yellow-50: #FFFBE8;
  --color-yellow-100: #FFF9D1;
  --color-yellow-200: #FFF0B0;
  --color-yellow-300: #FDF285;
  --color-yellow-400: #FAFF7F;
  --color-yellow-500: #FFF055;
  --color-yellow-600: #BDAE42;
  --color-yellow-700: #7A6C2E;
  --color-yellow-800: #5A5024;
  --color-yellow-900: #302A15;
  --color-yellow-950: #1E1A0E;

  --color-golden-50: #FFFBE6;
  --color-golden-100: #FFF4D6;
  --color-golden-200: #FFEBB3;
  --color-golden-300: #FFD980;
  --color-golden-400: #FFEB8F;
  --color-golden-500: #FFE56A;
  --color-golden-600: #B89C4A;
  --color-golden-700: #6E5A27;
  --color-golden-800: #4E401C;
  --color-golden-900: #2C220C;
  --color-golden-950: #191409;

  --color-blue-50: #F6FAFF;
  --color-blue-100: #F0FCFF;
  --color-blue-200: #E0F4FF;
  --color-blue-300: #A3D7FF;
  --color-blue-400: #69BBFF;
  --color-blue-500: #508DC1;
  --color-blue-600: #3977A9;
  --color-blue-700: #18426A;
  --color-blue-800: #12304E;
  --color-blue-900: #0D1A26;
  --color-blue-950: #07101A;
  
  --color-nature-50: #F6FDEA;
  --color-nature-100: #F2FFE6;
  --color-nature-200: #E4F9BF;
  --color-nature-300: #DBFB8E;
  --color-nature-400: #C2E57D;
  --color-nature-500: #88B55E;
  --color-nature-600: #506B3A;
  --color-nature-700: #3B502B;
  --color-nature-800: #27361D;
  --color-nature-900: #1A2711;
  --color-nature-950: #0E1609;

  --color-green-50: #F4FBF0;
  --color-green-100: #E8F8D8;
  --color-green-200: #D4E6BC;
  --color-green-300: #8AD753;
  --color-green-400: #69B93A;
  --color-green-500: #577B32;
  --color-green-600: #30451E;
  --color-green-700: #213218;
  --color-green-800: #15200C;
  --color-green-900: #0F1709;
  --color-green-950: #0A1006;

  --color-pink-50: #FFFDFE;
  --color-pink-100: #FFF9FA;
  --color-pink-200: #FEDFE6;
  --color-pink-300: #F494AE;
  --color-pink-400: #F06B8E;
  --color-pink-500: #A3485B;
  --color-pink-600: #6F2F3F;
  --color-pink-700: #4E202E;
  --color-pink-800: #290E14;
  --color-pink-900: #1A060A;
  --color-pink-950: #0E0304;

  --color-snow: #FDFEF0;
}

.text-dark-50 { color: var(--color-dark-50); }
.bg-dark-50 { background-color: var(--color-dark-50); }
.text-dark-100 { color: var(--color-dark-100); }
.bg-dark-100 { background-color: var(--color-dark-100); }
.text-dark-200 { color: var(--color-dark-200); }
.bg-dark-200 { background-color: var(--color-dark-200); }
.text-dark-300 { color: var(--color-dark-300); }
.bg-dark-300 { background-color: var(--color-dark-300); }
.text-dark-400 { color: var(--color-dark-400); }
.bg-dark-400 { background-color: var(--color-dark-400); }
.text-dark-500 { color: var(--color-dark-500); }
.bg-dark-500 { background-color: var(--color-dark-500); }
.text-dark-600 { color: var(--color-dark-600); }
.bg-dark-600 { background-color: var(--color-dark-600); }
.text-dark-700 { color: var(--color-dark-700); }
.bg-dark-700 { background-color: var(--color-dark-700); }
.text-dark-800 { color: var(--color-dark-800); }
.bg-dark-800 { background-color: var(--color-dark-800); }
.text-dark-900 { color: var(--color-dark-900); }
.bg-dark-900 { background-color: var(--color-dark-900); }
.text-dark-950 { color: var(--color-dark-950); }
.bg-dark-950 { background-color: var(--color-dark-950); }
.text-brown-50 { color: var(--color-brown-50); }
.bg-brown-50 { background-color: var(--color-brown-50); }
.text-brown-100 { color: var(--color-brown-100); }
.bg-brown-100 { background-color: var(--color-brown-100); }
.text-brown-200 { color: var(--color-brown-200); }
.bg-brown-200 { background-color: var(--color-brown-200); }
.text-brown-300 { color: var(--color-brown-300); }
.bg-brown-300 { background-color: var(--color-brown-300); }
.text-brown-400 { color: var(--color-brown-400); }
.bg-brown-400 { background-color: var(--color-brown-400); }
.text-brown-500 { color: var(--color-brown-500); }
.bg-brown-500 { background-color: var(--color-brown-500); }
.text-brown-600 { color: var(--color-brown-600); }
.bg-brown-600 { background-color: var(--color-brown-600); }
.text-brown-700 { color: var(--color-brown-700); }
.bg-brown-700 { background-color: var(--color-brown-700); }
.text-brown-800 { color: var(--color-brown-800); }
.bg-brown-800 { background-color: var(--color-brown-800); }
.text-brown-900 { color: var(--color-brown-900); }
.bg-brown-900 { background-color: var(--color-brown-900); }
.text-brown-950 { color: var(--color-brown-950); }
.bg-brown-950 { background-color: var(--color-brown-950); }
.text-yellow-50 { color: var(--color-yellow-50); }
.bg-yellow-50 { background-color: var(--color-yellow-50); }
.text-yellow-100 { color: var(--color-yellow-100); }
.bg-yellow-100 { background-color: var(--color-yellow-100); }
.text-yellow-200 { color: var(--color-yellow-200); }
.bg-yellow-200 { background-color: var(--color-yellow-200); }
.text-yellow-300 { color: var(--color-yellow-300); }
.bg-yellow-300 { background-color: var(--color-yellow-300); }
.text-yellow-400 { color: var(--color-yellow-400); }
.bg-yellow-400 { background-color: var(--color-yellow-400); }
.text-yellow-500 { color: var(--color-yellow-500); }
.bg-yellow-500 { background-color: var(--color-yellow-500); }
.text-yellow-600 { color: var(--color-yellow-600); }
.bg-yellow-600 { background-color: var(--color-yellow-600); }
.text-yellow-700 { color: var(--color-yellow-700); }
.bg-yellow-700 { background-color: var(--color-yellow-700); }
.text-yellow-800 { color: var(--color-yellow-800); }
.bg-yellow-800 { background-color: var(--color-yellow-800); }
.text-yellow-900 { color: var(--color-yellow-900); }
.bg-yellow-900 { background-color: var(--color-yellow-900); }
.text-yellow-950 { color: var(--color-yellow-950); }
.bg-yellow-950 { background-color: var(--color-yellow-950); }
.text-golden-50 { color: var(--color-golden-50); }
.bg-golden-50 { background-color: var(--color-golden-50); }
.text-golden-100 { color: var(--color-golden-100); }
.bg-golden-100 { background-color: var(--color-golden-100); }
.text-golden-200 { color: var(--color-golden-200); }
.bg-golden-200 { background-color: var(--color-golden-200); }
.text-golden-300 { color: var(--color-golden-300); }
.bg-golden-300 { background-color: var(--color-golden-300); }
.text-golden-400 { color: var(--color-golden-400); }
.bg-golden-400 { background-color: var(--color-golden-400); }
.text-golden-500 { color: var(--color-golden-500); }
.bg-golden-500 { background-color: var(--color-golden-500); }
.text-golden-600 { color: var(--color-golden-600); }
.bg-golden-600 { background-color: var(--color-golden-600); }
.text-golden-700 { color: var(--color-golden-700); }
.bg-golden-700 { background-color: var(--color-golden-700); }
.text-golden-800 { color: var(--color-golden-800); }
.bg-golden-800 { background-color: var(--color-golden-800); }
.text-golden-900 { color: var(--color-golden-900); }
.bg-golden-900 { background-color: var(--color-golden-900); }
.text-golden-950 { color: var(--color-golden-950); }
.bg-golden-950 { background-color: var(--color-golden-950); }
.text-blue-50 { color: var(--color-blue-50); }
.bg-blue-50 { background-color: var(--color-blue-50); }
.text-blue-100 { color: var(--color-blue-100); }
.bg-blue-100 { background-color: var(--color-blue-100); }
.text-blue-200 { color: var(--color-blue-200); }
.bg-blue-200 { background-color: var(--color-blue-200); }
.text-blue-300 { color: var(--color-blue-300); }
.bg-blue-300 { background-color: var(--color-blue-300); }
.text-blue-400 { color: var(--color-blue-400); }
.bg-blue-400 { background-color: var(--color-blue-400); }
.text-blue-500 { color: var(--color-blue-500); }
.bg-blue-500 { background-color: var(--color-blue-500); }
.text-blue-600 { color: var(--color-blue-600); }
.bg-blue-600 { background-color: var(--color-blue-600); }
.text-blue-700 { color: var(--color-blue-700); }
.bg-blue-700 { background-color: var(--color-blue-700); }
.text-blue-800 { color: var(--color-blue-800); }
.bg-blue-800 { background-color: var(--color-blue-800); }
.text-blue-900 { color: var(--color-blue-900); }
.bg-blue-900 { background-color: var(--color-blue-900); }
.text-blue-950 { color: var(--color-blue-950); }
.bg-blue-950 { background-color: var(--color-blue-950); }
.text-nature-50 { color: var(--color-nature-50); }
.bg-nature-50 { background-color: var(--color-nature-50); }
.text-nature-100 { color: var(--color-nature-100); }
.bg-nature-100 { background-color: var(--color-nature-100); }
.text-nature-200 { color: var(--color-nature-200); }
.bg-nature-200 { background-color: var(--color-nature-200); }
.text-nature-300 { color: var(--color-nature-300); }
.bg-nature-300 { background-color: var(--color-nature-300); }
.text-nature-400 { color: var(--color-nature-400); }
.bg-nature-400 { background-color: var(--color-nature-400); }
.text-nature-500 { color: var(--color-nature-500); }
.bg-nature-500 { background-color: var(--color-nature-500); }
.text-nature-600 { color: var(--color-nature-600); }
.bg-nature-600 { background-color: var(--color-nature-600); }
.text-nature-700 { color: var(--color-nature-700); }
.bg-nature-700 { background-color: var(--color-nature-700); }
.text-nature-800 { color: var(--color-nature-800); }
.bg-nature-800 { background-color: var(--color-nature-800); }
.text-nature-900 { color: var(--color-nature-900); }
.bg-nature-900 { background-color: var(--color-nature-900); }
.text-nature-950 { color: var(--color-nature-950); }
.bg-nature-950 { background-color: var(--color-nature-950); }
.text-green-50 { color: var(--color-green-50); }
.bg-green-50 { background-color: var(--color-green-50); }
.text-green-100 { color: var(--color-green-100); }
.bg-green-100 { background-color: var(--color-green-100); }
.text-green-200 { color: var(--color-green-200); }
.bg-green-200 { background-color: var(--color-green-200); }
.text-green-300 { color: var(--color-green-300); }
.bg-green-300 { background-color: var(--color-green-300); }
.text-green-400 { color: var(--color-green-400); }
.bg-green-400 { background-color: var(--color-green-400); }
.text-green-500 { color: var(--color-green-500); }
.bg-green-500 { background-color: var(--color-green-500); }
.text-green-600 { color: var(--color-green-600); }
.bg-green-600 { background-color: var(--color-green-600); }
.text-green-700 { color: var(--color-green-700); }
.bg-green-700 { background-color: var(--color-green-700); }
.text-green-800 { color: var(--color-green-800); }
.bg-green-800 { background-color: var(--color-green-800); }
.text-green-900 { color: var(--color-green-900); }
.bg-green-900 { background-color: var(--color-green-900); }
.text-green-950 { color: var(--color-green-950); }
.bg-green-950 { background-color: var(--color-green-950); }
.text-pink-50 { color: var(--color-pink-50); }
.bg-pink-50 { background-color: var(--color-pink-50); }
.text-pink-100 { color: var(--color-pink-100); }
.bg-pink-100 { background-color: var(--color-pink-100); }
.text-pink-200 { color: var(--color-pink-200); }
.bg-pink-200 { background-color: var(--color-pink-200); }
.text-pink-300 { color: var(--color-pink-300); }
.bg-pink-300 { background-color: var(--color-pink-300); }
.text-pink-400 { color: var(--color-pink-400); }
.bg-pink-400 { background-color: var(--color-pink-400); }
.text-pink-500 { color: var(--color-pink-500); }
.bg-pink-500 { background-color: var(--color-pink-500); }
.text-pink-600 { color: var(--color-pink-600); }
.bg-pink-600 { background-color: var(--color-pink-600); }
.text-pink-700 { color: var(--color-pink-700); }
.bg-pink-700 { background-color: var(--color-pink-700); }
.text-pink-800 { color: var(--color-pink-800); }
.bg-pink-800 { background-color: var(--color-pink-800); }
.text-pink-900 { color: var(--color-pink-900); }
.bg-pink-900 { background-color: var(--color-pink-900); }
.text-pink-950 { color: var(--color-pink-950); }
.bg-pink-950 { background-color: var(--color-pink-950); }