/* ****** */
/* COLORS */
/* ****** */
:root {
    /* PRIMARY */
    --blue-light: #F1F5FB;
    --blue-deep: #0F284B;
    --blue-ocean: #25CDDA;
    --blue: #5EAEFF;
    --orange: #FB7800;
    --red: #F56864;
    --yellow: #F7D45C;
    --green: #7BF48D;
    --green-alt: #aff193;

    /* SECONDARY */
    --lilla-light: #E9E5FF;
    --lilla: #C2D2FF;
    --cherry: #D7355E;
    --grey-light: #F4F4F4;
    --grey-mid: #E1E2E6;

    /* NEUTRAL */
    --black: #000000;
    --white: #FFFFFF;
    --white-30: #F2F2F2;
    --white-40: #DADADA;
    --white-60: #6D6E71;
    --white-80: #1D1D1D;

    /* STATUS */
    --grey-status: #9D9D9D;
    --green-success: #07D95A;
    --red-danger: #FF2B02;

    /* BLACK OPACITY */
    --black-op-80: #000000CC;
    --black-op-60: #00000099;
    --black-op-40: #00000066;
    --black-op-30: #0000004D;
    --black-op-20: #00000033;

    /* WHITE OPACITY */
    --white-op-80: #FFFFFFCC;
    --white-op-60: #FFFFFF99;
    --white-op-40: #FFFFFF66;
    --white-op-30: #FFFFFF4D;
    --white-op-20: #FFFFFF33;
}
body * {
    color: var(--black);
}
.is-svg,
.is-svg * {
    color: inherit;
}
.text-blue-light {color: var(--blue-light);}
.text-blue-deep {color: var(--blue-deep);}
.text-blue-ocean {color: var(--blue-ocean);}
.text-blue {color: var(--blue);}
.text-orange {color: var(--orange);}
.text-red {color: var(--red);}
.text-yellow {color: var(--yellow);}
.text-green {color: var(--green);}
.text-green-alt {color: var(--green-alt);}
.text-lilla-light {color: var(--lilla-light);}
.text-lilla {color: var(--lilla);}
.text-cherry {color: var(--cherry);}
.text-grey-light {color: var(--grey-light);}
.text-grey-mid {color: var(--grey-mid);}
.text-white {color: var(--white);}
.text-white-30 {color: var(--white-30);}
.text-white-40 {color: var(--white-40);}
.text-white-60 {color: var(--white-60);}
.text-white-80 {color: var(--white-80);}
.text-grey-status {color: var(--grey-status);}
.text-green-success {color: var(--green-success);}
.text-red-danger {color: var(--red-danger);}
.text-black-op-80 {color: var(--black-op-80);}
.text-black-op-60 {color: var(--black-op-60);}
.text-black-op-40 {color: var(--black-op-40);}
.text-black-op-30 {color: var(--black-op-30);}
.text-black-op-20 {color: var(--black-op-20);}
.text-white-op-80 {color: var(--white-op-80);}
.text-white-op-60 {color: var(--white-op-60);}
.text-white-op-40 {color: var(--white-op-40);}
.text-white-op-30 {color: var(--white-op-30);}
.text-white-op-20 {color: var(--white-op-20);}

.text-blue-light > *, .text-blue-deep > *, .text-blue-ocean > *, .text-blue > *, .text-orange > *, .text-red > *, .text-green > *, .text-lilla-light > *, .text-lilla > *, .text-cherry > *, .text-grey-light > *, .text-grey-mid > *, .text-white > *, .text-white-30 > *, .text-white-40 > *, .text-white-60 > *, .text-white-80 > *, .text-grey-status > *, .text-green-success > *, .text-red-danger > *, .text-black-op-80 > *, .text-black-op-60 > *, .text-black-op-40 > *, .text-black-op-30 > *, .text-black-op-20 > *, .text-white-op-80 > *, .text-white-op-60 > *, .text-white-op-40 > *, .text-white-op-30 > *, .text-white-op-20 > * {color: inherit;}

.bg-blue-light {background-color: var(--blue-light);}
.bg-blue-deep {background-color: var(--blue-deep);}
.bg-blue-ocean {background-color: var(--blue-ocean);}
.bg-blue {background-color: var(--blue);}
.bg-orange {background-color: var(--orange);}
.bg-red {background-color: var(--red);}
.bg-yellow {background-color: var(--yellow);}
.bg-green {background-color: var(--green);}
.bg-green-alt {background-color: var(--green-alt);}
.bg-lilla-light {background-color: var(--lilla-light);}
.bg-lilla {background-color: var(--lilla);}
.bg-cherry {background-color: var(--cherry);}
.bg-grey-light {background-color: var(--grey-light);}
.bg-grey-mid {background-color: var(--grey-mid);}
.bg-white {background-color: var(--white);}
.bg-white-30 {background-color: var(--white-30);}
.bg-white-40 {background-color: var(--white-40);}
.bg-white-60 {background-color: var(--white-60);}
.bg-white-80 {background-color: var(--white-80);}
.bg-grey-status {background-color: var(--grey-status);}
.bg-green-success {background-color: var(--green-success);}
.bg-red-danger {background-color: var(--red-danger);}
.bg-black-op-80 {background-color: var(--black-op-80);}
.bg-black-op-60 {background-color: var(--black-op-60);}
.bg-black-op-40 {background-color: var(--black-op-40);}
.bg-black-op-30 {background-color: var(--black-op-30);}
.bg-black-op-20 {background-color: var(--black-op-20);}
.bg-white-op-80 {background-color: var(--white-op-80);}
.bg-white-op-60 {background-color: var(--white-op-60);}
.bg-white-op-40 {background-color: var(--white-op-40);}
.bg-white-op-30 {background-color: var(--white-op-30);}
.bg-white-op-20 {background-color: var(--white-op-20);}
/* ********** */
/* COLORS end */
/* ********** */