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

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

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

@font-face {
    font-family: Fredoka;
    src: url('../fonts/Fredoka-VariableFont_wdth,wght.ttf');
}

body {
    background-image: url('../img/background.png');
    background-size: cover;
    font-family: Fredoka;
}

h1:hover {
    background-color: transparent;
    color: white;
    font-style: italic;
}

#title {
    color:rgb(42, 33, 158);
    background-color: #c1ffff;
    font-size: 50px;
    font-family: Vidaloka;
    text-align: center;
    border-style: ridge solid ridge solid;
    border-color:rgb(32, 27, 100);
    border-width: 2mm;
    border-radius: 15px;
}

#quiz_desc {
    text-align: center;
    font-size: 30px;
    color: white;
    padding: 30px 0px 30px 0px;
}

#start_quiz {
    text-align: center;

}

#start_quiz_button {
    font-size: 45px;
    font-family: Fredoka;

    border-radius: 12px;
    border-width: 6px;

    background-color: rgba(112, 255, 255, 0.53);
    border-color: rgba(57, 215, 215, 0.749);
    color: white;
}

#questions {
    padding: 40px 0px 40px 0px;
    text-align: center;
    font-size: 50px;
    color: white;
}

#choice_result {
    text-align: center;
    font-size: 50px;
    color: white;
}

#answer_choices {
    text-align: center;
}

#return {
    text-align: center;
}

#return_button {
    padding: 10px 20px 10px 20px;
    font-size: 30px;
    font-family: Fredoka;
    border-radius: 15px;
    border-width: 5px;
    border-color: rgba(255, 255, 255, 0.5);
    color: white;
    background-color: rgba(0, 0, 0, 0.5);
}

#answer_choices button {
    margin: 40px 70px 40px 70px;
    padding: 10px 20px 10px 20px;
    font-size: 30px;
    font-family: Fredoka;
    border-radius: 15px;
    border-width: 5px;
    border-color: rgba(255, 255, 255, 0.5);
    color: white;
    background-color: rgba(0, 0, 0, 0.5);
}

