@font-face {
    font-family:"Casio";
    src: url("/static/casio_fx_9860gii/casio-fx-9860gii.ttf") format("truetype");
}

body {
    font-family: "JetBrains Mono", "Menlo", monospace;
}

.material-symbols-outlined {
    font-variation-settings:
            'FILL' 0,
            'wght' 400,
            'GRAD' 0,
            'opsz' 24
}

.casio-text {
    font-family: "Casio";
    font-size: 2rem;
}

.fade {
    opacity: 0;
    transition: opacity 1s ease-in-out;
}

@keyframes correctAnswer {
    0%   { background-color: #FFFFFF; }
    25%  { background-color: #d1e7dd; }
    100% { background-color: #FFFFFF; }
}

@keyframes wrongAnswer {
    0%   { background-color: #FFFFFF; }
    25%  { background-color: #f8d7da; }
    100% { background-color: #FFFFFF; }
}

.correct-answer-animation{
    animation: correctAnswer 1s ease-in-out;
}

.wrong-answer-animation{
    animation: wrongAnswer 1s ease-in-out;
}