body {
    box-sizing: border-box;

    justify-content: center;
    align-items: center;
    background: rgb(64, 58, 179);
    background: linear-gradient(
        0deg,
        rgba(64, 58, 179, 1) 2%,
        rgba(99, 99, 242, 1) 33%,
        rgba(12, 195, 254, 1) 70%,
        rgba(58, 222, 255, 1) 100%
    );
}

#board {
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
}

.slot {
    width: 100px;
    height: 100px;
    background-color: blue;
    border: 1.5px black solid;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.hole {
    width: 85px;
    height: 85px;
    border-radius: 50%;
    border: 3px black solid;
    background-color: #fff;
    transition: width 0.5s, height 0.5s, background-color 0.5s, transform 0.5s;
}

.empty-board {
    background-color: blue;
    width: 0;
    height: 0;
}

.game-menu {
    margin: 0 auto;
    width: 450px;
    height: 450px;
    display: flex;
    flex-flow: column wrap;
    text-align: center;
}

h1,
button {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
        Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
    margin: 3px;
    padding: 5px;
}

button {
    height: 35px;
    width: 250px;
    margin: 3px auto;
    border-radius: 17.5px;
    border: 3px solid black;
    background-color: lightblue;
}

button:hover {
    border: 3px solid black;
    background-color: rgb(205, 255, 129);
}

.on {
    color: red;
    font-weight: bolder;
    background-color: aliceblue;
}

.player1 {
    background-color: yellow;
}
.player2 {
    background-color: red;
}