a{
    color: var(--medium-blue);
}

a:hover{
    color: var(--yellow) !important;
}

.white{
    color: white;
}

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

.black{
    color: black !important;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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