/* 
    QRWaiter UI Kit

    Colors Pallete
*/


:root {
    --white-10-color:#fff;
    --white-9-color:#FCFCFC;
    --white-8-color:#FAFAFA;
    --white-7-color:#F7F7F7;
    --white-6-color:#F5F5F5;
    --white-5-color:#F2F2F2;
    --white-4-color:#F0F0F0;
    --white-3-color:#EDEDED;
    --white-2-color:#EBEBEB;
    --white-1-color:#E8E8E8;

    --black-10-color:#000;    
    --black-9-color:#050505;    
    --black-8-color:#0A0A0A;    
    --black-7-color:#0F0F0F;    
    --black-6-color:#141414;    
    --black-5-color:#1A1A1A;    
    --black-4-color:#1F1F1F;    
    --black-3-color:#242424;    
    --black-2-color:#292929;    
    --black-1-color:#2E2E2E; 
    
    --grey-10-color:#4C4C4C;    
    --grey-9-color:#595959;    
    --grey-8-color:#666666;    
    --grey-7-color:#737373;    
    --grey-6-color:#808080;    
    --grey-5-color:#8C8C8C;    
    --grey-4-color:#999999;    
    --grey-3-color:#A6A6A6;    
    --grey-2-color:#B2B2B2;    
    --grey-1-color:#BFBFBF; 

    --green-10-color:#073B31;    
    --green-9-color:#0C5B4C;    
    --green-8-color:#157A67;    
    --green-7-color:#239680;    
    --green-6-color:#34AD96;    
    --green-5-color:#4BC0A9;    
    --green-4-color:#6AD3BF;    
    --green-3-color:#8DDDCE;    
    --green-2-color:#ADE1D7;    
    --green-1-color:#C9E0DB; 

    --red-10-color:#A10116;    
    --red-9-color:#B1051B;    
    --red-8-color:#BF0820;    
    --red-7-color:#CB1028;    
    --red-6-color:#D71831;    
    --red-5-color:#D71831;    
    --red-4-color:#E2223B;    
    --red-3-color:#F33C54;    
    --red-2-color:#F84C62;    
    --red-1-color:#FD5B70; 
    
    --brown-10-color:#57300C;    
    --brown-9-color:#723F10;    
    --brown-8-color:#8D5018;    
    --brown-7-color:#A66223;    
    --brown-6-color:#BE7533;    
    --brown-5-color:#D28A48;    
    --brown-4-color:#E2A062;    
    --brown-3-color:#F0B682;    
    --brown-2-color:#F7CBA3;    
    --brown-1-color:#FBDEC3; 
    
    --orange-10-color:#903502;    
    --orange-9-color:#A23C03;    
    --orange-8-color:#B44506;    
    --orange-7-color:#C54F0C;    
    --orange-6-color:#D45A15;    
    --orange-5-color:#E16823;    
    --orange-4-color:#EE7632;    
    --orange-3-color:#F78647;    
    --orange-2-color:#FC965C;    
    --orange-1-color:#FDA270; 

    --blue-10-color:#031E37;    
    --blue-9-color:#083157;    
    --blue-8-color:#0F4374;    
    --blue-7-color:#1D5991;    
    --blue-6-color:#306EA8;    
    --blue-5-color:#4985BF;    
    --blue-4-color:#669CCF;    
    --blue-3-color:#87B3DB;    
    --blue-2-color:#AAC8E3;    
    --blue-1-color:#CBD9E6;
}


.white-1-color {
    color: var(--white-1-color);
}
.white-2-color {
   color: var(--white-2-color);
}
.white-3-color {
    color: var(--white-3-color);
}
.white-4-color {
    color: var(--white-4-color);
}
.white-5-color {
    color: var(--white-5-color);
}
.white-6-color {
     color: var(--white-6-color);
}
.white-7-color {
     color: var(--white-7-color);
}
.white-8-color {
     color: var(--white-8-color);
}
.white-9-color {
     color: var(--white-9-color);
}
.white-10-color {
    color: var(--white-10-color);
}


.black-1-color {
    color: var(--black-1-color);
}
.black-2-color {
    color: var(--black-2-color);
}
.black-3-color {
    color: var(--black-3-color);
}
.black-4-color {
    color: var(--black-4-color);
}
.black-5-color {
    color: var(--black-5-color);
}
.black-6-color {
    color: var(--black-6-color);
}
.black-7-color {
    color: var(--black-7-color);
}
.black-8-color {
    color: var(--black-8-color);
}
.black-9-color {
    color: var(--black-9-color);
}
.black-10-color {
    color: var(--black-10-color);
}


.grey-1-color {
    color: var(--grey-1-color);
}
.grey-2-color {
    color: var(--grey-2-color);
}
.grey-3-color {
    color: var(--grey-3-color);
}
.grey-4-color {
    color: var(--grey-4-color);
}
.grey-5-color {
    color: var(--grey-5-color);
}
.grey-6-color {
    color: var(--grey-6-color);
}
.grey-7-color {
    color: var(--grey-7-color);
}
.grey-8-color {
    color: var(--grey-8-color);
}
.grey-9-color {
    color: var(--grey-9-color);
}
.grey-10-color {
    color: var(--grey-10-color);
}


.green-1-color {
    color: var(--green-1-color);
}
.green-2-color {
    color: var(--green-2-color);
}
.green-3-color {
    color: var(--green-3-color);
}
.green-4-color {
    color: var(--green-4-color);
}
.green-5-color {
    color: var(--green-5-color);
}
.green-6-color {
    color: var(--green-6-color);
}
.green-7-color {
    color: var(--green-7-color);
}
.green-8-color {
    color: var(--green-8-color);
}
.green-9-color {
    color: var(--green-9-color);
}
.green-10-color {
    color: var(--green-10-color);
}


.red-1-color {
    color: var(--red-1-color);
}
.red-2-color {
    color: var(--red-2-color);
}
.red-3-color {
     color: var(--red-3-color);
}
.red-4-color {
     color: var(--red-4-color);
}
.red-5-color {
     color: var(--red-5-color);
}
.red-6-color {
     color: var(--red-6-color);
}
.red-7-color {
     color: var(--red-7-color);   
}
.red-8-color {
     color: var(--red-8-color);
}
.red-9-color {
     color: var(--red-9-color);
}
.red-10-color {
     color: var(--red-10-color);
}


.brown-1-color {
 color: var(--brown-1-color);
}
.brown-2-color {
 color: var(--brown-2-color);
}
.brown-3-color {
 color: var(--brown-3-color);
}
.brown-4-color {
 color: var(--brown-4-color);
}
.brown-5-color {
 color: var(--brown-5-color);
}
.brown-6-color {
 color: var(--brown-6-color);
}
.brown-7-color {
 color: var(--brown-7-color);
}
.brown-8-color {
 color: var(--brown-8-color);
}
.brown-9-color {
 color: var(--brown-9-color);
}
.brown-10-color {
 color: var(--brown-10-color);
}


.orange-1-color {
     color: var(--orange-1-color);
}
.orange-2-color {
     color: var(--orange-2-color);
}
.orange-3-color {
     color: var(--orange-3-color);
}
.orange-4-color {
     color: var(--orange-4-color);

}
.orange-5-color {
     color: var(--orange-5-color);
    
}
.orange-6-color {
    color: var(--orange-6-color);
}
.orange-7-color {
    color: var(--orange-7-color);
}
.orange-8-color {
    color: var(--orange-8-color);
}
.orange-9-color {
    color: var(--orange-9-color);
}
.orange-10-color {
    color: var(--orange-10-color);
}

.blue-1-color {
  color: var(--blue-1-color);
}
.blue-2-color {
  color: var(--blue-2-color);
}
.blue-3-color {
  color: var(--blue-3-color);
}
.blue-4-color {
  color: var(--blue-4-color);
}
.blue-5-color {
  color: var(--blue-5-color);
}
.blue-6-color {
  color: var(--blue-6-color);
}
.blue-7-color {
  color: var(--blue-7-color);
}
.blue-8-color {
  color: var(--blue-8-color);
}
.blue-9-color {
  color: var(--blue-9-color);
}
.blue-10-color {
  color: var(--blue-10-color);
}
