.font-orange {
    color: var(--orange);
}

.font-white {
    color: var(--white);
}

.font-secondary {
    color: var(--color-secondary, var(--orange)) !important;
}


.bg-purple {
    background-color: purple;
}

.bg-blue {
    background-color: var(--blue);
}

.bg-blue-light {
    background-color: var(--blue-light);
}

.bg-red {
    background-color: var(--red);
}

.bg-red-light {
    background-color: var(--red-light);
}

.bg-lightgray {
    background-color: rgb(220, 220, 220);
    color: black;
}

.bg-gray {
    background-color: gray;
}

.bg-green {
    background-color: green;
}

.bg-white {
    background-color: var(--white);
    color: black;
}

.bg-yellow {
    background-color: yellow;
    color: black;
}

.bg-orange {
    background-color: var(--orange)  !important;
    /* #f39c12 */
}