body {
    background-color:pink;
    display: flex;
    justify-content: center;
}

#canvas {
    background-color: black;
    display: block;
    grid-column: 2 / 3;
    grid-row: 1 / 3;
}

#pointDisplay, #btbDisplay, #comboDisplay, #level {
    display: block;
    grid-column: 2 / 3;
    grid-row: 3 / 4;
}

#btbDisplay {
    align-self: flex-end;
    justify-self: flex-end;
    margin-top: 50px
}

#comboDisplay {
    align-self: flex-start;
    justify-self: flex-end;
}

#level {
    align-self: flex-end;
    justify-self: flex-start;
}

#hold {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    background-color: rgb(173, 216, 230)
}

#next {
    grid-column: 3 / 4;
    grid-row: 1 / 2;
    background-color: rgb(182, 93, 182);
}

#teto {
    grid-column: 3 / 4;
    grid-row: 2 / 3;
    width: 250px;
}

#grid {
    display: grid;
    grid-template-columns: auto auto auto;
    grid-template-rows: auto auto auto;
}