/* 
    Created on : 2 Jan. 2023, 7:05:11 pm
    Author     : Linko Technology PTY LTD
*/

:root {
    /*Pallete Colors*/
    --white-color: 255,255,255;
    --black-color: 66,65,61;    
    --gray-light-color: 246,245,241;
    --gray-color: 214,213,210;
    --gray-dark-color: 171,170,168;
    --red-color: 219,40,40;
    --red-dark-color: 202,16,16;
    --orange-color: 242,113,28;
    --orange-dark-color: 229,91,0;
    --yellow-color: 251,189,8;
    --yellow-dark-color: 218,163,0;
    --olive-color: 181,204,24;
    --olive-dark-color: 160,182,5;
    --green-color: 33, 186, 69;
    --green-dark-color: 14, 164, 50;
    --teal-color: 0,181,173;
    --teal-dark-color: 0,140,134;
    --blue-color: 33,133,208;
    --blue-dark-color: 13,113,187;
    --violet-color: 100,53,201;
    --violet-dark-color: 79,32,181;
    --purple-color: 163,51,200;
    --purple-dark-color: 143,30,180;
    --pink-color: 224,57,151;
    --pink-dark-color: 225,15,133;
    --brown-color: 165,103,63;
    --brown-dark-color: 144,83,43;
    --alpha: 1;    
    --bg-alpha: 1;    
    --border-alpha: 1;    
}

/* Apha transparency */
 .alpha-1
{
    --button-text-color: var(--black-color);
    --alpha: 0.1;
}

 .alpha-2
{
    --button-text-color: var(--black-color);
    --alpha: 0.2;
}

 .alpha-3
{
    --button-text-color: var(--black-color);
    --alpha: 0.3;
}
 .alpha-4
{
    --button-text-color: var(--black-color);
    --alpha: 0.4;
}
 .alpha-5
{   
    --alpha: 0.5;
}
 .alpha-6
{
    --alpha: 0.6;
}
 .alpha-7
{
    --alpha: 0.7;
}
 .alpha-8
{
    --alpha: 0.8;
}
 .alpha-9
{
    --alpha: 0.9;
}
 .alpha-10
{
    --alpha: 1;
}

 .bg-alpha-1
{
    --button-text-color: var(--black-color);
    --bg-alpha: 0.1;
}

.bg-alpha-2
{
    --button-text-color: var(--black-color);
    --bg-alpha: 0.2;
}

.bg-alpha-3
{
    --button-text-color: var(--black-color);
    --bg-alpha: 0.3;
}
.bg-alpha-4
{
    --button-text-color: var(--black-color);
    --bg-alpha: 0.4;
}
.bg-alpha-5
{   
    --bg-alpha: 0.5;
}
.bg-alpha-6
{
    --bg-alpha: 0.6;
}
.bg-alpha-7
{
    --bg-alpha: 0.7;
}
.bg-alpha-8
{
    --bg-alpha: 0.8;
}
.bg-alpha-9
{
    --bg-alpha: 0.9;
}
.bg-alpha-10
{
    --bg-alpha: 1;
}


.border-alpha-1
{
    --border-alpha: 0.1;
}

.border-alpha-2
{
    --border-alpha: 0.2;
}

.border-alpha-3
{
    --border-alpha: 0.3;
}
.border-alpha-4
{
    --border-alpha: 0.4;
}
.border-alpha-5
{   
    --border-alpha: 0.5;
}
.border-alpha-6
{
    --border-alpha: 0.6;
}
.border-alpha-7
{
    --border-alpha: 0.7;
}
.border-alpha-8
{
    --border-alpha: 0.8;
}
 .border-alpha-9
{
    --border-alpha: 0.9;
}
.border-alpha-10
{
    --border-alpha: 1;
}




.white {
   color: rgba(var(--white-color),var(--alpha)) !important;
}
.border-white {
   border-color: rgba(var(--white-color),var(--border-alpha)) !important;
}
.bg-white {
   background-color: rgba(var(--white-color),var(--bg-alpha)) !important;
}


.black {
   color: rgba(var(--black-color),var(--alpha))!important;
}
.border-black {
   border-color: rgba(var(--black-color),var(--border-alpha)) !important;
}
.bg-black {
   background-color: rgba(var(--black-color),var(--bg-alpha))!important;
}

.gray {
   color: rgba(var(--gray-color),var(--alpha)) !important;
}
.gray-light {
   color: rgba(var(--gray-light-color),var(--alpha)) !important;
}
.gray-dark {
   color: rgba(var(--gray-dark-color),var(--alpha)) !important;
}
.border-gray {
   border-color: rgba(var(--gray-color),var(--border-alpha)) !important;
}
.border-gray-light {
   border-color: rgba(var(--gray-light-color),var(--border-alpha)) !important;
}
.border-gray-dark {
   border-color: rgba(var(--gray-dark-color),var(--border-alpha)) !important;
}
.bg-gray {
   background-color: rgba(var(--gray-color),var(--bg-alpha)) !important;
}
.bg-gray-light {
   background-color: rgba(var(--gray-light-color),var(--bg-alpha)) !important;
}
.bg-gray-dark {
   background-color: rgba(var(--gray-dark-color),var(--bg-alpha)) !important;
}
.bg-gray:hover {
   background-color: rgba(var(--gray-dark-color),var(--bg-alpha)) !important;
}

.red {
   color: rgba(var(--red-color),var(--alpha)) !important;
}
.red-dark {
   color: rgba(var(--red-dark-color),var(--alpha)) !important;
}
.border-red {
   border-color: rgba(var(--red-color),var(--border-alpha)) !important;
}
.border-red-dark {
   border-color: rgba(var(--red-dark-color),var(--border-alpha)) !important;
}
.bg-red {
   background-color: rgba(var(--red-color),var(--bg-alpha)) !important;
}
.bg-red-dark {
   background-color: rgba(var(--red-dark-color),var(--bg-alpha)) !important;
}
.bg-red:hover {
   background-color: rgba(var(--red-dark-color),var(--bg-alpha)) !important;
}

.orange {
   color: rgba(var(--orange-color),var(--alpha)) !important;
}
.orange-dark {
   color: rgba(var(--orange-dark-color),var(--alpha)) !important;
}
.border-orange {
   border-color: rgba(var(--orange-color),var(--border-alpha)) !important;
}
.border-orange-dark {
   border-color: rgba(var(--orange-dark-color),var(--border-alpha)) !important;
}
.bg-orange {
   background-color: rgba(var(--orange-color),var(--bg-alpha)) !important;
}
.bg-orange-dark {
   background-color: rgba(var(--orange-dark-color),var(--bg-alpha)) !important;
}
.bg-orange:hover {
   background-color: rgba(var(--orange-dark-color),var(--bg-alpha)) !important;
}

.yellow {
   color: rgba(var(--yellow-color),var(--alpha)) !important;
}
.yellow-dark {
   color: rgba(var(--yellow-dark-color),var(--alpha)) !important;
}
.border-yellow {
   border-color: rgba(var(--yellow-color),var(--border-alpha)) !important;
}
.border-yellow-dark {
   border-color: rgba(var(--yellow-dark-color),var(--border-alpha)) !important;
}
.bg-yellow {
   background-color: rgba(var(--yellow-color),var(--bg-alpha)) !important;
}
.bg-yellow-dark {
   background-color: rgba(var(--yellow-dark-color),var(--bg-alpha)) !important;
}
.bg-yellow:hover {
   background-color: rgba(var(--yellow-dark-color),var(--bg-alpha)) !important;
}

.olive {
   color: rgba(var(--olive-color),var(--alpha)) !important;
}
.olive-dark {
   color: rgba(var(--olive-dark-color),var(--alpha)) !important;
}
.border-olive {
   border-color: rgba(var(--olive-color),var(--border-alpha)) !important;
}
.border-olive-dark {
   border-color: rgba(var(--olive-dark-color),var(--border-alpha)) !important;
}
.bg-olive {
   background-color: rgba(var(--olive-color),var(--bg-alpha)) !important;
}
.bg-olive-dark {
   background-color: rgba(var(--olive-dark-color),var(--bg-alpha)) !important;
}
.bg-olive:hover {
   background-color: rgba(var(--olive-dark-color),var(--bg-alpha)) !important;
}

.green {
   color: rgba(var(--green-color),var(--alpha)) !important;
}
.green-dark {
   color: rgba(var(--green-dark-color),var(--alpha)) !important;
}
.border-green {
   border-color: rgba(var(--green-color),var(--border-alpha)) !important;
}
.border-green-dark {
   border-color: rgba(var(--green-dark-color),var(--border-alpha)) !important;
}
.bg-green {
   background-color: rgba(var(--green-color),var(--bg-alpha)) !important;
}
.bg-green-dark {
   background-color: rgba(var(--green-dark-color),var(--bg-alpha)) !important;
}
.bg-green:hover {
   background-color: rgba(var(--green-dark-color),var(--bg-alpha)) !important;
}

.teal {
   color: rgba(var(--teal-color),var(--alpha)) !important;
}
.teal-dark {
   color: rgba(var(--teal-dark-color),var(--alpha)) !important;
}
.border-teal {
   border-color: rgba(var(--teal-color),var(--border-alpha)) !important;
}
.border-teal-dark {
   border-color: rgba(var(--teal-dark-color),var(--border-alpha)) !important;
}
.bg-teal {
   background-color: rgba(var(--teal-color),var(--bg-alpha)) !important;
}
.bg-teal-dark {
   background-color: rgba(var(--teal-dark-color),var(--bg-alpha)) !important;
}
.bg-teal:hover {
   background-color: rgba(var(--teal-dark-color),var(--bg-alpha)) !important;
}

.blue {
   color: rgba(var(--blue-color),var(--alpha)) !important;
}
.blue-dark {
   color: rgba(var(--blue-dark-color),var(--alpha)) !important;
}
.border-blue {
   border-color: rgba(var(--blue-color),var(--border-alpha)) !important;
}
.border-blue-dark {
   border-color: rgba(var(--blue-dark-color),var(--border-alpha)) !important;
}
.bg-blue {
   background-color: rgba(var(--blue-color),var(--bg-alpha)) !important;
}
.bg-blue-dark {
   background-color: rgba(var(--blue-dark-color),var(--bg-alpha)) !important;
}
.bg-blue:hover {
   background-color: rgba(var(--blue-dark-color),var(--bg-alpha)) !important;
}

.violet {
   color: rgba(var(--violet-color),var(--alpha)) !important;
}
.violet-dark {
   color: rgba(var(--violet-dark-color),var(--alpha)) !important;
}
.border-violet {
   border-color: rgba(var(--violet-color),var(--border-alpha)) !important;
}
.border-violet-dark {
   border-color: rgba(var(--violet-dark-color),var(--border-alpha)) !important;
}
.bg-violet {
   background-color: rgba(var(--violet-color),var(--bg-alpha)) !important;
}
.bg-violet-dark {
   background-color: rgba(var(--violet-dark-color),var(--bg-alpha)) !important;
}
.bg-violet:hover {
   background-color: rgba(var(--violet-dark-color),var(--bg-alpha)) !important;
}

.purple {
   color: rgba(var(--purple-color),var(--alpha)) !important;
}
.purple-dark {
   color: rgba(var(--purple-dark-color),var(--alpha)) !important;
}
.border-purple {
   border-color: rgba(var(--purple-color),var(--border-alpha)) !important;
}
.border-purple-dark {
   border-color: rgba(var(--purple-dark-color),var(--border-alpha)) !important;
}
.bg-purple {
   background-color: rgba(var(--purple-color),var(--bg-alpha)) !important;
}
.bg-purple-dark {
   background-color: rgba(var(--purple-dark-color),var(--bg-alpha)) !important;
}
.bg-purple:hover {
   background-color: rgba(var(--purple-dark-color),var(--bg-alpha)) !important;
}

.pink {
   color: rgba(var(--pink-color),var(--alpha)) !important;
}
.pink-dark {
   color: rgba(var(--pink-dark-color),var(--alpha)) !important;
}
.border-pink {
   border-color: rgba(var(--pink-color),var(--border-alpha)) !important;
}
.border-pink-dark {
   border-color: rgba(var(--pink-dark-color),var(--border-alpha)) !important;
}
.bg-pink {
   background-color: rgba(var(--pink-color),var(--bg-alpha)) !important;
}
.bg-pink-dark {
   background-color: rgba(var(--pink-dark-color),var(--bg-alpha)) !important;
}
.bg-pink-dark {
   background-color: rgba(var(--pink-dark-color),var(--bg-alpha)) !important;
}
.bg-pink:hover {
   background-color: rgba(var(--pink-dark-color),var(--bg-alpha)) !important;
}

.brown {
   color: rgba(var(--brown-color),var(--alpha)) !important;
}
.brown-dark {
   color: rgba(var(--brown-dark-color),var(--alpha)) !important;
}
.border-brown {
   border-color: rgba(var(--brown-color),var(--border-alpha)) !important;
}
.border-brown-dark {
   border-color: rgba(var(--brown-dark-color),var(--border-alpha)) !important;
}
.bg-brown {
   background-color: rgba(var(--brown-color),var(--bg-alpha)) !important;
}
.bg-brown-dark {
   background-color: rgba(var(--brown-dark-color),var(--bg-alpha)) !important;
}
.bg-brown:hover {
   background-color: rgba(var(--brown-dark-color),var(--bg-alpha)) !important;
}