* {
    font-family: Verdana;
}

root {
    width: 100%;
    height: 100%;
    position: absolute;
    color: white;
    font-size: 24px;
    pointer-events: all;
}

watermark {
    padding-top: 8px;
    padding-left: 12px;
    color: white;
    font-size: 18px;
}

menu-container {
    justify-content: center;
    gap: 20px;
    cursor: default;
    width: 100%;
    height: 100%;
}

menu-rows {
    position: absolute;
    top: 5%;
    left: 34%;
    display: flex;
    flex-direction: column; /* outer: line 1 above line 2 */
    gap: 20px;
}

.option-row {
    display: flex;
    flex-direction: row; /* inner: buttons left to right */
    gap: 20px;
    justify-content: center;
}

lobby-rows {
    position: absolute;
    top: 0%;
    left: 64%;
    font-size: 24px;
    display: flex;
    flex-direction: row;
    gap: 20px;
    justify-content: center;
}

menu-button {
    font-size: 36px;
    cursor: pointer;
    pointer-events: all;
    transition: 0.2s;
    height: 36px;
}

    menu-button.play {
        position: absolute;
        top: 12%;
        left: 50%;
        transform: translateX(-50%);
        height: auto;
        font-size: 64px;
        color: green;
    }

    menu-button.load {
        position: absolute;
        top: 12%;
        left: 80%;
        transform: translateX(-50%);
        height: auto;
        font-size: 48px;
        color: blue;
    }

    menu-button.go {
        position: absolute;
        top: 62%;
        left: 50%;
        transform: translateX(-50%);
        height: auto;
        font-size: 72px;
        color: green;
    }

    menu-button.settings {
        position: absolute;
        top: 12%;
        left: 10%;
        transform: translateX(-50%);
        height: auto;
        font-size: 48px;
        color: orange;
    }

    menu-button.quit {
        position: absolute;
        top: 90%;
        left: 33%;
        font-size: 32px;
        color: red;
    }

    menu-button.select {
        position: absolute;
        bottom: 24px;
        right: 24px;
        font-size: 24px;
    }
   
    menu-button.modes {
        top: 30%;
        height: auto;
        font-size: 48px;
    }

    menu-button.modesselected {
        font-size: 48px;
        color: yellow;
    }