dialog {
    background-color: rgba(43, 45, 70, 0.9);
    border: 1px solid #ccc;
    padding: 10px;
    width: 30vw;
    min-width: 290px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

/* Format text inside of popup menus */
dialog * {
    color: white;
}

/* Place X icon in the top right */
dialog .x-icon {
    position: absolute;
    right: 10px;
    top: 15px;
    margin: 0;
}

/* Make the input elements all the same height so the rows are evenly spaced. */
dialog input {
    height: 16px;
}

/*
For some reason, ANDI will complain about the foreground/background color contrast for the range input,
even though it has no text, so there shouldn't even be anything for ANDI to detect.
Changing the text color of this particular type of input won't do anything visually, 
but it will get ANDI to shut up.
*/
dialog input[type="range"] {
    color: black;
}

#settings-menu * {
    /* Add vertical spacing */
    margin: 7.5px 0;
}

#settings-menu h2 {
    /*
    We want the h2 to have typical h2 margins, 
    so that there is space between the top of the modal and the h2.
    */
    margin: revert;
}

#credits-menu h3 {
    margin-bottom: 0;
}

#credits-menu ul {
    margin-top: 0;
    list-style-type: none;
    padding: 0;
}