header, footer {
    text-align: center;
    list-style-position: inside;
}

.instructions {
    font-family: Arial, Helvetica, sans-serif;
}

body {
    background: #FFFFCC;
    color: #330000;
    font-family: 'Press Start 2P', cursive, sans-serif;
}

main {
    display: grid;
    grid-template-rows: 125px 400px 40px 125px;
    grid-template-columns: 1fr 1fr 1fr;
}

.top {
    grid-row: 1;
    text-align: center;

    /* display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center; */
}

.timer, .resetGame {
    grid-column: 1;
}

.score, .resetScore {
    grid-column: 2;
}

.moves, .solve {
    grid-column: 3;
}

.containers {
    grid-row: 2;
    grid-column: 1 / span 3;

    /* display: flex;
    justify-content: space-around; */
    display: grid;
    grid-template-rows: 400px;
    grid-template-columns: 1fr 1fr 1fr;
}

.base {
    grid-row: 3;
    grid-column: 1 / span 3;
    width: auto;
    background: black;
}

.container {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.peg {
    height: 400px;
    width: 25px;
    margin: 0 auto;
    background: black;
    border: 1px solid black;
    border-bottom: none;
}

.ring {
    margin: 0 auto;
    height: 25px;
    border: 2.5px solid black;
    text-align: center;
    background: white;
}

.bottom {
    grid-row: 4;

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