@font-face {
    font-family: "Nunito";
    src: url(../assets/fonts/Nunito-Regular.ttf) format('truetype');
}

@font-face {
    font-family: "Nunito Italic";
    src: url(../assets/fonts/Nunito-Italic.ttf) format("truetype");
}

@font-face {
    font-family: "Nunito Bold";
    src: url(../assets/fonts/Nunito-Bold.ttf) format("truetype");
}

@font-face {
    font-family: "Nunito Light";
    src: url(../assets/fonts/Nunito-Light.ttf) format('truetype');
}

@font-face {
    font-family: "FS Maja Web";
    src: url("../assets/fonts/FSMajaWeb-Regular.woff2") format("woff2");
}

#gof_logo_loading {
    position: absolute;
    inset: 0;
    animation-name: pulsating;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    margin: auto;
    height: 12vmin
}

#interactive_course_icon {
    animation-name: pulsating;
    animation-duration: 1s;
    animation-iteration-count: infinite;
}

@keyframes pulsating {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes make-transparent {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}


@keyframes make-opaque {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.gof-fade {
    opacity: 1;
    transition-property: opacity;
    transition-timing-function: ease;
}

.gof-fade-hidden {
    opacity: 0;
}


:root {
    --sky-05: #f0f9ff;
    --sky-10: #e0f2fe;
    --sky-20: #bae6fd;
    --sky-30: #7dd3fc;
    --sky-40: #38bdf8;
    --sky-50: #0ea5e9;
    --sky-60: #0284c7;
    --sky-70: #0369a1;
    --sky-80: #075985;
    --sky-90: #0c4a6e;
    --sky-95: #082f49;
    --blue-05: #EFF6FF;
    --blue-10: #DBEAFE;
    --blue-20: #BFDBFE;
    --blue-30: #93C5FD;
    --blue-40: #60A5FA;
    --blue-50: #3B82F6;
    --blue-60: #2563EB;
    --blue-70: #1D4ED8;
    --blue-80: #1E40AF;
    --blue-90: #1E3A8A;
    --blue-95: #172554;
    --gray-05: #f9fafb;
    --gray-10: #f3f4f6;
    --gray-20: #e5e7eb;
    --gray-30: #d1d5db;
    --gray-40: #9ca3af;
    --gray-50: #6b7280;
    --gray-60: #4b5563;
    --gray-70: #374151;
    --gray-80: #1f2937;
    --gray-90: #111827;
    --gray-95: #030712;
}

.bg-05 {
    background-color: #f0f9ff !important;
}

.bg-10 {
    background-color: #e0f2fe !important;
}

.bg-20 {
    background-color: #bae6fd !important;
}

.bg-30 {
    background-color: #7dd3fc !important;
}

.bg-40 {
    background-color: #38bdf8 !important;
}

.bg-50 {
    background-color: #0ea5e9 !important;
}

.bg-60 {
    background-color: #0284c7 !important;
}

.bg-70 {
    background-color: #0369a1 !important;
}

.bg-80 {
    background-color: #075985 !important;
}

.bg-90 {
    background-color: #0c4a6e !important;
}