main {
    --width: 400px;
}

#countries {
    width: 300px;
}

#game .row {
    width: var(--width);
    margin-bottom: 2em;
}

#flag {
    text-align: center;
}

#outline {
    width: var(--width);
}

#choices {
    width: 100%;
}

#choices tr {
    border-bottom: 2px solid var(--bs-body-bg);
}

#choices td {
    text-align: center;
    color: var(--bs-body-bg);
    font-weight: bold;
    padding: 5px;
}

#flag div[data-animation="pop"] {
    animation-name: PopIn;
    animation-duration: 800ms;
    animation-timing-function: ease-in;
}

@media (max-width: 400px) {
    main {
        --width: 310px;
    }

    #countries {
        width: 200px;
    }
}