#gridwrapper {
    display: flex;
    justify-content: flex-start;
    width: 100%;
}

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

#gamegrid {
    display: inline-grid;
    grid-template-columns: auto auto;
    grid-template-rows: auto;
    justify-content: flex-start;
}

#grid div {
    padding: 0px 0.75em 0.75em 0.5em;
}

.number {
    font-weight: bold;
}

.gametitle {
    font-weight: bold;
    color: black;
}

.points {
    font-weight: bold;
    color: green;
}

.nomargin {
    margin: 0px;
    padding: 0px;
}

#messagebox {
    color: green;
    border: 2px ridge #0060df;
    padding: 0.5em;
    margin-left: 30px;
    opacity: 0;
}


@media (prefers-color-scheme: dark) {

    #answer,
    .gametitle {
        color: #fff;
    }

    .points,
    #messagebox {
        color: lightgreen;
    }
}