@font-face {
    font-family: 'dynamo';
    src: url('Dynamo.ttf') format('truetype');
    font-weight: bold;
}

@font-face {
    font-family: 'monterchi';
    src: url('Monterchi-Sans-Thin-trial.ttf') format('truetype');
}

body {
    font-family: 'monterchi';
    background: linear-gradient(to bottom, #ebb7db 207px, #6b3a7b 207px);
    min-height: 100vh;
    color: white;
}

.curved-text {
    font-size: 60px;
    font-weight: bold;
    fill: #6b3a7b;
}

.text-content {
    text-align: center;
    margin: auto;
    font-family: 'Trebuchet MS', sans-serif;
}

.or-text {
    font-size: 70px;
    fill: white;
    /*make it white later */
    text-anchor: middle;
    font-family: 'Trebuchet MS', sans-serif;
}

.quiz-text {
    text-anchor: middle;
    font-family: 'Trebuchet MS', sans-serif;
    fill: white;
    font-size: 70px;
}

#Lisa {
    font-size: 100px;
    font-family: 'dynamo';
}

#Lena {
    font-size: 100px;
    font-family: 'dynamo';
    fill: #ebb7db;
}

.normal-text {
    width: 300px;
    margin: auto;
    text-align: center;
    text-anchor: middle;
}

.quiz-button {
    background-color: #ebb7db;
    color: #bf428b;
    border-color: #bf428b;
    border-radius: 5px;
    box-shadow: none;
    border-style: solid;
    font-family: 'Trebuchet MS', sans-serif;
    padding: 5px;
    font-size: 20px;
    cursor: pointer;
}

#backgorund {
    position: relative;
    min-height: 100vh;
}

#background img {
    opacity: 0.4;
}

.background-img {
    position: absolute;
    pointer-events: none;
    animation: float 4s ease-in-out infinite alternate;
}