#gameWindow {
    display: none;
    position: fixed;
    top: 0;
    transition: opacity 2s;
    opacity: 1;
    touch-action: none;
}

#gameWindow.startup {
    opacity: 0;
}

#HUD {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    font-size: 2.5vmin;
    transition: opacity 2s;
    opacity: 1;
    touch-action: none;
    white-space: nowrap;
    cursor: grab;
    text-shadow: 0.3vmin 0.3vmin #111111;
}

#HUD.startup {
    opacity: 0;
}

#HUD #planets {
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 1vmin;
    z-index: 90;
}

#HUD #planets div {
    display: flex;
}

#HUD button {
    float: left;
    border: 2px solid darkslategray;
    width: 5vmin;
    height: 5vmin;
    margin: 0 0.5vmin;
    font-size: 6vmin;
    line-height: 6vmin;
    background-color: #111111;
    padding: 0;
}

#HUD button.disabled {
    color: #A0A1A3;
    border-color: #A0A1A3;
}

#HUD #planets button {
    flex-grow: 1;
    margin: 0.3vmin;
    width: auto;
    height: auto;
    font-size: 4vmin;
    line-height: 4vmin;
}

#currentTime, #currentTimezone {
    position: absolute;
    right: 3vmin;
    bottom: 6vmin;
    width: 30vmin;
    font-size: 4vmin;
    line-height: 6vmin;
    text-align: center;
}
#currentTimezone {
    bottom: 10vmin;
    font-size: 2.5vmin;
}

#HUD #timeZones {
    top: 10vmin;
    left: 50%;
    width: 16vmin;
    margin-left: -8vmin;
}

#HUD #timeZones div {
    display: block;
    float: left;
}

#HUD #timeZones #tz_label {
    width: 65%;
    text-align: right;
}

#HUD #timeZones #tz_value {
    width: 35%;
    text-align: left;
    padding-left: 2%;
    font-weight: bold;
}

#HUD #timeZones #tz_pointer {
    position: absolute;
    z-index: -1;
    left: 8vmin;
    top: 100%;
    width: 4px;
    height: 10vmin;
    background-color: #F3F5F3;
    border: 1px solid #111111;
    margin-left: -2px;
}

#info {
    position: absolute;
    top: 10vmin;
    left: 3vw;
    font-size: 2.3vmax;
}

#info #profilePic_border {
    float: left;
    width: 12vmax;
    height: 12vmax;
    background-color: #F3F5F3;
    border-radius: 50%;
    margin-right: 1vw;
    font-size: 1vw;
}

#info #profilePic {
    margin: 5%;
    width: 90%;
    height: 90%;
    border-radius: 50%;
    text-align: center;
    background-color: #111;
    background-size: contain;
    text-indent: 100vw;
}

#info.artist #profilePic {
    border-color: #F3F5F3;
}

#navigation {
    position: absolute;
    bottom: 6vmin;
    left: 5vw;
}

#navigation button {
    width: 12vmax;
    height: 4vmax;
    color: #F3F5F3;
    background-color: #111111;
    border: 0.2vw solid #F3F5F3;
    font-size: 3vmax;
    line-height: 3vmax;
}