body {
    text-align: center;
}
h1 {
    font-size: 500;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    color: rgb(11, 136, 203);
}
h2 {
    font-size: 300;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    color: rgb(192, 18, 154);
}
.btn {
    height: 200px;
    width: 200px;
    border-radius: 50%;
    border: 5px solid black;
    margin: 2rem;
}
.btn-container {
    display: flex;
    justify-content: center;
}
.red {
    background-color: #d03664;
}
.yellow {
    background-color: #fb9739;
}
.green {
    background-color: #65ff8c;
}
.purple {
    background-color: #4372ff;
}
.flash {
    background-color: white;
}
.userflash {
    background-color: rgb(68, 40, 40);
}
.end {
    display: flex;
    align-items: center;
    justify-content: center;
}
.end span {
    font-size: 300;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    color: #b86d6d;
}