:root {
/* old talab colors */
    --cream: #F5F0E1;
    --blue: #1F47B9;
    --orange: #FCB042;
    --red: #CF5355;

/* new root talab colors */
    --yellow: #FFF259;
    --green: #68AE00;
    --cyan: #00A8A8;
    --teal: #056C63;

    --white: #FFFFF7;
    --black: #1E1E1E;

    --white-alpha-900: rgba(255, 255, 255, 0.90);
    --white-alpha-800: rgba(255, 255, 255, 0.80);
    --white-alpha-700: rgba(255, 255, 255, 0.70);
    --white-alpha-600: rgba(255, 255, 255, 0.60);
    --white-alpha-500: rgba(255, 255, 255, 0.50);
    --white-alpha-400: rgba(255, 255, 255, 0.40);
    --white-alpha-300: rgba(255, 255, 255, 0.30);
    --white-alpha-200: rgba(255, 255, 255, 0.20);
    --white-alpha-100: rgba(255, 255, 255, 0.10);

    --black-alpha-900: rgba(0, 0, 0, 0.90);
    --black-alpha-800: rgba(0, 0, 0, 0.80);
    --black-alpha-700: rgba(0, 0, 0, 0.70);
    --black-alpha-600: rgba(0, 0, 0, 0.60);
    --black-alpha-500: rgba(0, 0, 0, 0.50);
    --black-alpha-400: rgba(0, 0, 0, 0.40);
    --black-alpha-300: rgba(0, 0, 0, 0.30);
    --black-alpha-200: rgba(0, 0, 0, 0.20);
    --black-alpha-100: rgba(0, 0, 0, 0.10);

    --cool-gray-900: #111827;
    --cool-gray-800: #1F2937;
    --cool-gray-700: #374151;
    --cool-gray-600: #4B5563;
    --cool-gray-500: #6B7280;
    --cool-gray-400: #9CA3AF;
    --cool-gray-300: #D1D5DB;
    --cool-gray-200: #E5E7EB;
    --cool-gray-100: #F3F4F6;
    --cool-gray-50: #F9FAFB;

 /* old shades & tints */
    --cream-900: #B14700;
    --cream-800: #B85F00;
    --cream-700: #BE6D00;
    --cream-600: #C27C00;
    --cream-500: #C48600;
    --cream-400: #CA9700;
    --cream-300: #D1A837;
    --cream-200: #DCC074;
    --cream-100: #E9D9AE;
    --cream-50: #F5F0E1;

    --blue-900: #00218E;
    --blue-800: #0034A1;
    --blue-700: #103EAD;
    --blue-600: #1F48B9;
    --blue-500: #2650C3;
    --blue-400: #4F6ACD;
    --blue-300: #7185D5;
    --blue-200: #9AA8E1;
    --blue-100: #C3CAED;
    --blue-50: #E7EAF8;

    --orange-900: #E14200;
    --orange-800: #EA5F00;
    --orange-700: #F17000;
    --orange-600: #F68000;
    --orange-500: #FA8C00;
    --orange-400: #FB9D11;
    --orange-300: #FCAF42;
    --orange-200: #FDC679;
    --orange-100: #FEDCAE;
    --orange-50: #FFF2DE;

    --red-900: #962526;
    --red-800: #A42F31;
    --red-700: #B13537;
    --red-600: #C33C3D;
    --red-500: #D14440;
    --red-400: #CF5355;
    --red-300: #C87074;
    --red-200: #D99699;
    --red-100: #F1CBD0;
    --red-50: #F9EAED;

/* new shades & tints */
    --yellow-100: #333012;
    --yellow-90: #55511e;
    --yellow-80: #80792d;
    --yellow-70: #aaa13b;
    --yellow-60: #d5ca4a;
    --yellow-50: #fff475;
    --yellow-40: #fff690;
    --yellow-30: #fff9ac;
    --yellow-20: #fffbc8;
    --yellow-10: #fffcde;

    --green-100: #152300;
    --green-90: #233a00;
    --green-80: #345700;
    --green-70: #457400;
    --green-60: #579100;
    --green-50: #81bc2a;
    --green-40: #9ac955;
    --green-30: #b4d780;
    --green-20: #cde4aa;
    --green-10: #e1efcc;

    --cyan-100: #002222;
    --cyan-90: #003838;
    --cyan-80: #005454;
    --cyan-70: #007070;
    --cyan-60: #008c8c;
    --cyan-50: #2ab7b7;
    --cyan-40: #55c5c5;
    --cyan-30: #80d4d4;
    --cyan-20: #aae2e2;
    --cyan-10: #cceeee;

    --teal-100: #011614;
    --teal-90: #022421;
    --teal-80: #033632;
    --teal-70: #034842;
    --teal-60: #045a53;
    --teal-50: #2f857d;
    --teal-40: #589d97;
    --teal-30: #82b6b1;
    --teal-20: #accecb;
    --teal-10: #cde2e0;

    --blue-box-shadow: 4px 4px var(--blue);
    --teal-box-shadow: 4px 4px #DD702D;
}