:root {
--white: 255, 255, 255;
--black: 0, 0, 0;
--black-light: 68, 68, 68;
--grey: 187, 187, 187;
--grey-light: 238, 238, 238;
--red: 204, 0, 0;
--red-light: 247, 0, 0;
--red-dark: 153, 0, 0;
--green: 0, 153, 0;
--green-light: 0, 198, 183;
--green-dark: 0, 127, 118;
--blue:23, 171, 222;
--blue-light: 170, 218, 255;
--blue-dark: 24, 41, 52;
--yellow: 247, 209, 35;
--yellow-light: 255, 243, 107;
--yellow-dark: 253, 236, 0;
--orange: 245, 159, 18;
--orange-light: 255, 195, 35;
--orange-dark: 255, 130, 0;
--custom1: transparent;
--custom1-light: transparent;
--custom1-dark: transparent;
--custom2: transparent;
--custom2-light: transparent;
--custom2-dark: transparent;
--custom3: transparent;
--custom3-light: transparent;
--custom3-dark: transparent;
--custom4: transparent;
--custom3-light: transparent;
--custom3-dark: transparent;
}

.bg-white {background-color:rgba(var(--white), 1);}
.bg-black {background-color:rgba(var(--black), 1);}
.bg-black-light {background-color: rgba(var(--black-light), 1);}
.bg-grey {background-color: rgba(var(--grey), 1);}
.bg-grey-light {background-color: rgba(var(--grey-light), 1);}
.bg-red {background-color: rgba(var(--red), 1);}
.bg-red-light {background-color: rgba(var(--red-light), 1);}
.bg-red-dark {background-color: rgba(var(--red-dark), 1);}
.bg-green {background-color: rgba(var(--green), 1);}
.bg-green-light {background-color: rgba(var(--green-light), 1);}
.bg-green-dark {background-color: rgba(var(--green-dark), 1);}
.bg-blue {background-color: rgba(var(--blue), 1);}
.bg-blue-light {background-color: rgba(var(--blue-light), 1);}
.bg-blue-dark {background-color: rgba(var(--blue-dark), 1);}
.bg-yellow {background-color: rgba(var(--yellow), 1);}
.bg-yellow-light {background-color: rgba(var(--yellow-light), 1);}
.bg-yellow-dark {background-color: rgba(var(--yellow-dark), 1);}
.bg-orange {background-color: rgba(var(--orange), 1);}
.bg-orange-light {background-color: rgba(var(--orange-light), 1);}
.bg-orange-dark {background-color: rgba(var(--orange-dark), 1);}
.bg-custom1 {background-color: rgba(var(--custom1), 1);}
.bg-custom1-light {background-color: rgba(var(--custom1-light), 1);}
.bg-custom1-dark {background-color: rgba(var(--custom1-dark), 1);}
.bg-custom2 {background-color: rgba(var(--custom2), 1);}
.bg-custom2-light {background-color: rgba(var(--custom2-light), 1);}
.bg-custom2-dark {background-color: rgba(var(--custom2-dark), 1);}
.bg-custom3 {background-color: rgba(var(--custom3), 1);}
.bg-custom3-light {background-color: rgba(var(--custom3-light), 1);}
.bg-custom3-dark {background-color: rgba(var(--custom3-dark), 1);}
.bg-custom4 {background-color: rgba(var(--custom4), 1);}
.bg-custom3-light {background-color: rgba(var(--custom3-light), 1);}
.bg-custom3-dark {background-color: rgba(var(--custom3-dark), 1);}

.bg-white-hover:hover {background-color:rgba(var(--white), 1);}
.bg-black-hover:hover {background-color:rgba(var(--black), 1);}
.bg-black-light-hover:hover {background-color: rgba(var(--black-light), 1);}
.bg-grey-hover:hover {background-color: rgba(var(--grey), 1);}
.bg-grey-light-hover:hover {background-color: rgba(var(--grey-light), 1);}
.bg-red-hover:hover {background-color: rgba(var(--red), 1);}
.bg-red-light-hover:hover {background-color: rgba(var(--red-light), 1);}
.bg-red-dark-hover:hover {background-color: rgba(var(--red-dark), 1);}
.bg-green-hover:hover {background-color: rgba(var(--green), 1);}
.bg-green-light-hover:hover {background-color: rgba(var(--green-light), 1);}
.bg-green-dark-hover:hover {background-color: rgba(var(--green-dark), 1);}
.bg-blue-hover:hover {background-color: rgba(var(--blue), 1);}
.bg-blue-light-hover:hover {background-color: rgba(var(--blue-light), 1);}
.bg-blue-dark-hover:hover {background-color: rgba(var(--blue-dark), 1);}
.bg-yellow-hover:hover {background-color: rgba(var(--yellow), 1);}
.bg-yellow-light-hover:hover {background-color: rgba(var(--yellow-light), 1);}
.bg-yellow-dark-hover:hover {background-color: rgba(var(--yellow-dark), 1);}
.bg-orange-hover:hover {background-color: rgba(var(--orange), 1);}
.bg-orange-light-hover:hover {background-color: rgba(var(--orange-light), 1);}
.bg-orange-dark-hover:hover {background-color: rgba(var(--orange-dark), 1);}
.bg-custom1-hover:hover {background-color: rgba(var(--custom1), 1);}
.bg-custom1-light-hover:hover {background-color: rgba(var(--custom1-light), 1);}
.bg-custom1-dark-hover:hover {background-color: rgba(var(--custom1-dark), 1);}
.bg-custom2-hover:hover {background-color: rgba(var(--custom2), 1);}
.bg-custom2-light-hover:hover {background-color: rgba(var(--custom2-light), 1);}
.bg-custom2-dark-hover:hover {background-color: rgba(var(--custom2-dark), 1);}
.bg-custom3-hover:hover {background-color: rgba(var(--custom3), 1);}
.bg-custom3-light-hover:hover {background-color: rgba(var(--custom3-light), 1);}
.bg-custom3-dark-hover:hover {background-color: rgba(var(--custom3-dark), 1);}
.bg-custom4-hover:hover {background-color: rgba(var(--custom4), 1);}
.bg-custom3-light-hover:hover {background-color: rgba(var(--custom3-light), 1);}
.bg-custom3-dark-hover:hover {background-color: rgba(var(--custom3-dark), 1);}

.text-white {color:rgba(var(--white), 1);}
.text-black {color:rgba(var(--black), 1);}
.text-black-light {color: rgba(var(--black-light), 1);}
.text-grey {color: rgba(var(--grey), 1);}
.text-grey-light {color: rgba(var(--grey-light), 1);}
.text-red {color: rgba(var(--red), 1);}
.text-red-light {color: rgba(var(--red-light), 1);}
.text-red-dark {color: rgba(var(--red-dark), 1);}
.text-green {color: rgba(var(--green), 1);}
.text-green-light {color: rgba(var(--green-light), 1);}
.text-green-dark {color: rgba(var(--green-dark), 1);}
.text-blue {color: rgba(var(--blue), 1);}
.text-blue-light {color: rgba(var(--blue-light), 1);}
.text-blue-dark {color: rgba(var(--blue-dark), 1);}
.text-yellow {color: rgba(var(--yellow), 1);}
.text-yellow-light {color: rgba(var(--yellow-light), 1);}
.text-yellow-dark {color: rgba(var(--yellow-dark), 1);}
.text-orange {color: rgba(var(--orange), 1);}
.text-orange-light {color: rgba(var(--orange-light), 1);}
.text-orange-dark {color: rgba(var(--orange-dark), 1);}
.text-custom1 {color: rgba(var(--custom1), 1);}
.text-custom1-light {color: rgba(var(--custom1-light), 1);}
.text-custom1-dark {color: rgba(var(--custom1-dark), 1);}
.text-custom2 {color: rgba(var(--custom2), 1);}
.text-custom2-light {color: rgba(var(--custom2-light), 1);}
.text-custom2-dark {color: rgba(var(--custom2-dark), 1);}
.text-custom3 {color: rgba(var(--custom3), 1);}
.text-custom3-light {color: rgba(var(--custom3-light), 1);}
.text-custom3-dark {color: rgba(var(--custom3-dark), 1);}
.text-custom4 {color: rgba(var(--custom4), 1);}
.text-custom3-light {color: rgba(var(--custom3-light), 1);}
.text-custom3-dark {color: rgba(var(--custom3-dark), 1);}

.text-white-hover:hover {color:rgba(var(--white), 1);}
.text-black-hover:hover {color:rgba(var(--black), 1);}
.text-black-light-hover:hover {color: rgba(var(--black-light), 1);}
.text-grey-hover:hover {color: rgba(var(--grey), 1);}
.text-grey-light-hover:hover {color: rgba(var(--grey-light), 1);}
.text-red-hover:hover {color: rgba(var(--red), 1);}
.text-red-light-hover:hover {color: rgba(var(--red-light), 1);}
.text-red-dark-hover:hover {color: rgba(var(--red-dark), 1);}
.text-green-hover:hover {color: rgba(var(--green), 1);}
.text-green-light-hover:hover {color: rgba(var(--green-light), 1);}
.text-green-dark-hover:hover {color: rgba(var(--green-dark), 1);}
.text-blue-hover:hover {color: rgba(var(--blue), 1);}
.text-blue-light-hover:hover {color: rgba(var(--blue-light), 1);}
.text-blue-dark-hover:hover {color: rgba(var(--blue-dark), 1);}
.text-yellow-hover:hover {color: rgba(var(--yellow), 1);}
.text-yellow-light-hover:hover {color: rgba(var(--yellow-light), 1);}
.text-yellow-dark-hover:hover {color: rgba(var(--yellow-dark), 1);}
.text-orange-hover:hover {color: rgba(var(--orange), 1);}
.text-orange-light-hover:hover {color: rgba(var(--orange-light), 1);}
.text-orange-dark-hover:hover {color: rgba(var(--orange-dark), 1);}
.text-custom1-hover:hover {color: rgba(var(--custom1), 1);}
.text-custom1-light-hover:hover {color: rgba(var(--custom1-light), 1);}
.text-custom1-dark-hover:hover {color: rgba(var(--custom1-dark), 1);}
.text-custom2-hover:hover {color: rgba(var(--custom2), 1);}
.text-custom2-light-hover:hover {color: rgba(var(--custom2-light), 1);}
.text-custom2-dark-hover:hover {color: rgba(var(--custom2-dark), 1);}
.text-custom3-hover:hover {color: rgba(var(--custom3), 1);}
.text-custom3-light-hover:hover {color: rgba(var(--custom3-light), 1);}
.text-custom3-dark-hover:hover {color: rgba(var(--custom3-dark), 1);}
.text-custom4-hover:hover {color: rgba(var(--custom4), 1);}
.text-custom3-light-hover:hover {color: rgba(var(--custom3-light), 1);}
.text-custom3-dark-hover:hover {color: rgba(var(--custom3-dark), 1);}