body {
    background-color: rgb(237, 234, 232);
    margin: 0;
    font-family: 'Bungee Inline', cursive;
}

#siteTitle {
    background-color: rgb(139, 176, 178);
    margin: 0;
    padding: 10px;
    color: rgb(255, 252, 250);
    text-align: center;
    font-size: 3vw;
    font-weight: bold;
    font-variant: small-caps;
    letter-spacing: 5px;
}

.white {
    background-color: rgb(255, 252, 250);
    margin: 0; 
    color: rgb(139, 176, 178);
}

#menu {
    padding: 3px;
    text-align: center;
    font-size: 1.3vw;
    letter-spacing: 2px;
}

#message {
    display: inline-block;
    width: 15%;
}

button {
    background-color: rgb(237, 234, 232);
    border: none;
    border-radius: 10%;
    padding: 8px;
    outline: none;
    font-family: 'Bungee Inline', cursive;
    color: rgb(139, 176, 178);
    text-align: center;
    font-size: 1.1vw;
    letter-spacing: 2px;
    text-decoration: none;
}

button:hover {
    color: rgb(255, 252, 250); 
}

.modeOn {
    background-color: rgb(139, 176, 178);
    color: rgb(255, 252, 250);    
}

#colorDisplay {
    padding: 8px;
    text-align: center;
    font-size: 2.5vw;
    letter-spacing: 4px;
}

#squareColors {
    max-width: 45%;
    margin: 30px auto;
}

.square {
    width: 30%;
    margin: 1.667%;
    padding-bottom: 30%;
    border-radius: 10%;
    float: left;
    background-color: black;
}