/********** Colors **********/

:root {
    /* --color-red-orange-dd: #b83b03;
    --color-red-orange-d: #ed4c04;
    --color-red-orange:#FB6C2C;
    --color-red-orange-l:#fc9060;
    --color-red-orange-ll:#fdb595;

    --color-orange-1: #FFA521;
    --color-orange-2: #ffb243;
    --color-orange-3: #ffbd5d;

    --color-light-orange-1: #FFC99D;
    --color-light-orange-2: #ffd2ae;
    --color-light-orange-3: #ffe1c9;

    --color-blue-1: #70F4FF;
    --color-blue-2: #93f6ff;
    --color-blue-3: #aef8ff;

    --color-beige-1: #FFECC1;
    --color-beige-2: #fef6e4;
    --color-beige-3: #ffffff; */


    /* Logo color: #95c0bb */

    --color-background:        #d2d7d7;

    --color-navbar-background: #3b6558;
    --color-navbar-text:       #F4F3F2;
    --color-navbar-text-hover: #BAD7CE;

    --color-text-main:         #050505;
    --color-text-alt:          #F4F3F2;
    --color-text-alt-2:        #838780;

    --color-footer-background: #7e7e7e;
    --color-footer-link:       #1f1e1f;
    --color-footer-link-hover: #3d3d3d;

    --color-section-main:        #FFECC1;
    --color-section-alt:         #000000;
    --color-section-transparent: #6060606a;

    --color-button-main-background:          #518982;
    --color-button-main-text:                #F4F3F2;
    --color-button-main-shadow:              #54543F;
    --color-button-main-hover-background:    #5f9f98;
    --color-button-main-hover-text:          #F4F3F2;
    --color-button-main-active-background:   #75ada7;
    --color-button-main-active-text:         #F4F3F2;
    --color-button-main-disabled-background: #7f7f7f;
    --color-button-main-disabled-text:       #F4F3F2;

    --color-button-alt-background:  #ffbd5d;
    --color-button-alt-text:        #050505;
    --color-button-alt-shadow:      #ffbd5d;
    --color-button-alt-hover:       #FFA521;
    --color-button-alt-active:      #fc9060;
    --color-button-alt-disabled:    #5b4e50;

    --color-button-cancel-background: #F4F3F2;
    --color-button-cancel-text:       #FB6C2C;
    --color-button-cancel-shadow:     #FB6C2C;
    --color-button-cancel-hover:      #e9e8e7;
    --color-button-cancel-active:     #cececd;
    --color-button-cancel-disabled:   #F4F3F2;

    --color-button-class-background:      #ffbd5d;
    --color-button-class-text:            #050505;
    --color-button-class-shadow:          #050505;
    /* --color-button-class-hover:           #FFA521; */
    /* --color-button-class-active:          #fc9060; */
    --color-button-class-passed:          #dcdbdc;
    --color-button-class-cancelled:       #adaaab;
    --color-button-class-full:            #ab8f98;
    --color-button-class-disabled-text:   #5c5c5c;
    --color-button-class-disabled-shadow: #5c5c5c;

    --color-instructor-active:       #FFA521;
    --color-instructor-passed:       #bcb0b3;

    --color-a-main: #FB6C2C;
}



/********** Colors - Other **********/

.validation-message {
    color: #475b60;
    font-weight: bold;
}

.error {
    color: #475b60;
}

.shadow {
    box-shadow: 0 4px 10px rgb(0 0 0 / 0.3), 0 -4px 10px rgb(0 0 0 / 0.3);
}



/********** Fonts **********/

@font-face {
    font-family: 'LibreBaskerville';
    src: url(/fonts/LibreBaskerville.ttf);
}

@font-face {
    font-family: 'PTSerif';
    src: url(/fonts/PTSerif.ttf);
}

@font-face {
    font-family: 'Lora';
    src: url(/fonts/Lora.ttf);
}

@font-face {
    font-family: 'Alegreya';
    src: url(/fonts/Alegreya.ttf);
}

@font-face {
    font-family: 'Caudex';
    src: url(/fonts/Caudex.ttf);
}