.btn {
    width: 50%;
    height: 48%;
    font-size: xx-large;
    border: 1px solid black;
}

#btn1 {
    background-color: red;
}

#btn2 {
    background-color: green;
}

#btn3 {
    background-color: yellow;
}

#btn4 {
    background-color: skyblue;
}


#btn1:hover {
    background-color: lightcoral;
}

#btn2:hover {
    background-color: lightgreen;
}

#btn3:hover {
    background-color: lightyellow;
}

#btn4:hover {
    background-color: rgb(195, 232, 255);
}

.page {
    width: 100%;
    height: 100%;
}

.hidden {
    display: none;
}

html,
body {
    font-family: sans-serif;
    width: 100%;
    height: 100%;
    padding: 0px;
    margin: 0;
    overflow: hidden;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#question,
#msg {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#time {
    padding: 0;
    margin: 0;
    text-align: center;
}

#input {
    text-align: center;
}

#input >button {
    background-color: white;
    border: 1px solid black;
    border-radius: 3px;
}
#input >button:hover {
    background-color: lightgray;
    border: 1px solid black;
    border-radius: 3px;
}