/*****************************************
COLORS
*****************************************/

:root {
    --error-dark: #932231;
    --error: #D0364C;
    --error-light: #FCEEF1;
    --yellow-dark: #8C3A00;
    --yellow: #FFB700;
    --yellow-medium: #FFE6A6;
    --yellow-light: #FFF9D1;
    --dark-navy: #001E3D;
    --navy-blue: #002E5D;
    --blue-button: #003DA5;
    --royal-blue: #0057B8;
    --royal-10: #EBF2FF;
    --royal-20: #D9E6FF;
    --royal-30: #B9D1FF;
    --green-light: #E0FFE5;
    --green-medium: #10A170;
    --green: #006141;
    --aqua: #006073;
    --black: #000000;
    --gray-medium: #666666;
    --gray-light: #B2B3B7;
    --gray-lighter: #E8E8EA;
    --gray-lightest: #F4F4F5;
    --white: #fff;
    --purple: #EAD9FF;
    --link-color: var(--royal-blue);
}

.bg-purple {
    background-color: var(--purple, #EAD9FF) !important;
}

/*NAVY*/
.bg-navy {
    background-color: var(--navy-blue, #002E5D) !important;
}
.text-navy {
    color: var(--navy-blue, #002E5D);
}
.border-navy {
    border-color: var(--navy-blue, #002E5D);
}

/*DARK NAVY*/
.text-dark-navy,
.content-text-dark-navy * {
    color: var(--dark-navy, #001E3D);
}
.bg-dark-navy {
    background-color: var(--dark-navy, #001E3D) !important;
}
.border-dark-navy {
    border-color: var(--dark-navy, #001E3D);
}

/*ROYAL10*/
.bg-royal-10 {
    background-color: var(--royal-10, #EBF2FF);
}
.text-royal-10 {
    color: var(--royal-10, #EBF2FF);
}
.border-royal-10 {
    border-color: var(--royal-10, #EBF2FF);
}

/*ROYAL BLUE*/
.bg-royal-blue {
    background-color: var(--royal-blue, #0057B8);
}
.text-royal-blue,
.link-royal-blue {
    color: var(--royal-blue, #0057B8);
}
.border-royal-blue {
    border-color: var(--royal-blue, #0057B8) !important;
}
.link-royal-blue:hover {
    color: var(--blue-button, #003DA5);
    text-decoration: underline;
}

/*GRAY MEDIUM*/
.text-gray-medium {
    color: var(--gray-medium, #666666);
}
.bg-gray-medium {
    background-color: var(--gray-medium, #666666);
}
.border-gray-medium {
    border-color: var(--gray-medium, #666666) !important;
}

/*YELLOW*/
.bg-yellow-byu {
    background-color: var(--yellow, #FFB700);
}
.text-yellow {
    color: var(--yellow, #FFB700);
}
.border-yellow {
    border-color: var(--yellow, #FFB700);
}

/*YELLOW LIGHT*/
.bg-yellow-light {
    background-color: var(--yellow-light, #FFF9D1);
}
.text-yellow-light {
    color: var(--yellow-light, #FFF9D1);
}
.border-yellow-light {
    border-color: var(--yellow-light, #FFF9D1);
}

/*YELLOW DARK*/
.bg-yellow-dark {
    background-color: var(--yellow-dark, #8C3A00);
}
.text-yellow-dark {
    color: var(--yellow-dark, #8C3A00);
}
.border-yellow-dark {
    border-color: var(--yellow-dark, #8C3A00);
}

/*ERROR*/
.bg-error {
    background-color: var(--error, #D0364C);
}
.text-error {
    color: var(--error, #D0364C);
}
.border-error {
    border-color: var(--error, #D0364C);
}

/*ERROR LIGHT*/
.bg-error-light {
    background-color: var(--error-light, #FCEEF1);
}
.text-error-light {
    color: var(--error-light, #FCEEF1);
}
.border-error-light {
    border-color: var(--error-light, #FCEEF1);
}

/*ERROR DARK*/
.bg-error-dark {
    background-color: var(--error-dark, #932231);
}
.text-error-dark {
    color: var(--error-dark, #932231);
}
.border-error-dark {
    border-color: var(--error-dark, #932231);
}

/*GRAY LIGHT*/
.bg-gray-light {
    background-color: var(--gray-light, #B2B3B7);
}
.text-gray-light {
    color: var(--gray-light, #B2B3B7);
}
.border-gray-light {
    border-color: var(--gray-light, #B2B3B7);
}

/*GRAY LIGHTER*/
.bg-gray-lighter {
    background-color: var(--gray-lighter, #E8E8EA);
}
.text-gray-lighter {
    color: var(--gray-lighter, #E8E8EA);
}
.border-gray-lighter {
    border-color: var(--gray-lighter, #E8E8EA);
}

/*GRAY LIGHTEST*/
.border-gray-lightest {
    border-color: var(--gray-lightest);
}

/*ROYAL 20*/
.bg-royal-20 {
    background-color: var(--royal-20, #D9E6FF);
}
.text-royal-20 {
    color: var(--royal-20, #D9E6FF);
}
.border-royal-20 {
    border-color: var(--royal-20, #D9E6FF);
}

/*GREEN*/
.bg-green {
    background-color: var(--green, #006141);
}
.text-green {
    color: var(--green, #006141);
}
.border-green {
    border-color: var(--green, #006141);
}

/*GREEN MEDIUM*/
.bg-green-medium {
    background-color: var(--green-medium, #10A170);
}
.text-green-medium {
    color: var(--green-medium, #10A170);
}
.border-green-medium {
    border-color: var(--green-medium, #10A170);
}

/*GREEN LIGHT*/
.bg-green-light {
    background-color: var(--green-light, #E0FFE5);
}
.text-green-light {
    color: var(--green-light, #E0FFE5);
}
.border-green-light {
    border-color: var(--green-light, #E0FFE5);
}

/*AQUA*/
.bg-aqua {
    background-color: var(--aqua, #006073);
}
.text-aqua {
    color: var(--aqua, #006073);
}
.border-aqua {
    border-color: var(--aqua, #006073);
}

/*BLACK*/
.bg-black {
    background-color: var(--black, #000000);
}
.text-black {
    color: var(--black, #000000);
}
.border-black {
    border-color: var(--black, #000000);
}

/*WHITE*/
.bg-white {
    background-color: var(--white, #fff);
}
.text-white {
    color: var(--white, #fff);
}
.border-white {
    border-color: var(--white, #fff);
}

/*BLUE BUTTON*/
.bg-blue-button {
    background-color: var(--blue-button, #003DA5);
}
.text-blue-button {
    color: var(--blue-button, #003DA5);
}
.border-blue-button {
    border-color: var(--blue-button, #003DA5);
}


/*HOVER COLORS*/

.hover\:text-dark-navy:hover {
    color: var(--dark-navy) !important;
}

.hover\:bg-navy:hover {
    background: var(--navy-blue, #002E5D) !important;
    background-color: var(--navy-blue, #002E5D) !important;
}
.hover\:bg-royal-blue:hover {
    background: var(--royal-blue, #0057B8) !important;
    background-color: var(--royal-blue, #0057B8) !important;
}