* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    user-select: none;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}
::-webkit-scrollbar {
    display: none;
}
h1 {
    text-align: center;
    background-color: grey;
    color: white;
    padding: 30px;
}
h2 {
    text-align: right;
    padding: 10px;
    background-color: lightgrey;
    font-size: 58px;
}
#flexBox {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}
#flexBox .container {
    width: 50%;
    height: 300px;
}
button {
    width: 100%;
    height: 100%;
    font-size: 48px;
    border: 1.5px solid black;
}
button:hover {
    background-color: lightgrey;
}
#longBtn {
    width: 100%;
    height: 100px;
}
#grid {
    display: grid;
    grid-template-columns: 33% 33% 34%;
    grid-template-rows: 33% 33% 34%;
    width: 100%;
    height: 100%;
}
#narrowGrid {
    display: grid;
    grid-template-columns: 50% 50%;
    grid-template-rows: 25% 25% 25% 25%;
}
.footer {
    display: grid;
    grid-template-columns: 25% 25% 33% 17%;
    grid-template-rows: 100%;
}
.footer button {
    height: 100px;
}