style.css

#gridContainer {

    display: flex;
    flex-wrap: wrap;

    max-width: 600px;
    max-height: 600px;
    flex-grow: 0;

}

#topLevel {

    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    gap: 15px;
}

#buttonContainer {
    display: flex;
    flex-direction: column;
    max-width: 600px;
    gap: 10px;
    justify-content: space-evenly;
    align-items: center;
    flex-basis: 1;

}

.darkMode {

    filter: brightness(50%);
}

.lightMode {

    filter: brightness(150%);
}

#inverse {

    display: none;


}



#specialButtons button {
    align-items: center;
    justify-content: center;
    margin: 5px;
    text-align: center;

}



button:hover {
    filter: brightness(85%);
}

.grids {
    background-color: rgb(154, 145, 170);

    filter: brightness(1);
    /* applies brightness filter to be modified */
}



#gameTitle {

    font-size: 64px;
    font-family: Arial, Helvetica, sans-serif;

    margin: auto;
}