/*
    Main site
 */
html {
    background-image:url("cr.png");
    background-position-x: 99%;
    background-size: cover;
    background-attachment: fixed;
    height: 100%;
}
body {
    margin: 0px
}

/*
    Nav
*/
.nav {
    font-size: 0.75em;
    display: flex;
    margin-top: 0px;
    width: 100%;
    height: 42px;
    background-color: #00000070;
}

.nav_logo {
    padding: 7px
}
.nav > a {
    font-family: 'Montserrat', sans-serif;
    font-weight: 475;
    margin-top: 13.5px !important;
    margin-bottom: 10px !important;
    border-width: 2px !important;
    text-decoration: none;
    margin: 12px;
    display: inline-flex;
    align-content: center;
    color: white
}
.homepage {
    padding: 0px;
    margin-left: 90px;
    position: absolute;
    width: 42px;
    transition-duration: 400ms;
    color: #FFF;

    font-size: 10pt;
    font-family: 'Montserrat', sans-serif;

    background: none;
    border: 0px;
}
.ingame_notice {
    margin-top: 20px !important;
    text-align: center;
    width: 880px;
    padding: 10px;
    margin: auto;
    font-family: 'Montserrat', sans-serif;
    font-weight: 475;
    font-size: 0.8em;
    background-color: #ffcc00;
}
.serverlist {
    border-bottom-style: solid !important;
    border-bottom-color: #FFF !important;
    border-bottom-width: 2px !important;
    margin-left: 90px !important;
    padding: 0px;
    position: absolute;
    width: 71px;
    transition-duration: 400ms;
    color: #FFF;

    font-size: 10pt;
    font-family: 'Montserrat', sans-serif;
    background: none;
    border: 0px;
}
.mapmaking {
    margin-left: 200px !important;
    padding: 0px;
    position: absolute;
    width: 193px;
    transition-duration: 400ms;
    color: #FFF;

    font-size: 10pt;
    font-family: 'Montserrat', sans-serif;
    background: none;
    border: 0px;
}
#nav_button {
    margin: 10px;
    background: none;
    border: none;
}
#nav_button:hover {
    transition-duration: 400ms;
    color: #EEE;
}


/*
    Colors: Server list  
 */
html {
    --server_list-background: #00000070;
    --server_list-online_server_hover: #3a3a3a25;
    --server_list-online_server: #30303070;
    --server_list-offline_server: #630c0040;
    --server_list-text-header: #CCCCCC;
    --server_list-text: #f0f0f0;
}


/*
    Server list  
 */

.server_list {
    margin: auto;
    font-size: 10;
    margin-top: 40px;
    color: var(--server_list-text); 
    border-collapse: collapse;
    padding: 30px !important;
    font-family: 'Montserrat';
}


/*
   Server list table
 */
.spacer {
    padding: 0px;
    height: 4px;
    background-color: var(--server_list-background);
}
button {
    font-weight: 475;
    font-family: 'Montserrat';
    font-size: 12px;
    transition-duration: 400ms;
    background-color: #14c5cc;
    border-style: none;
    padding: 17px;
    padding-top: 2px;
    padding-bottom: 2px;
}
button:hover {
    background-color: #1af7ff;
}
table {
    outline: var(--server_list-background) solid 20px;
}
.server, td {
    transition-duration: 200ms;
    font-size: 14px;
    padding: 6px;
    padding-left: 30px;
    font-weight: 500;
}
.server_region, .server_name, .server_address, .server_game_mode, .server_map {
    padding-left: 30px !important;
}
.server_description {
    padding-left: 29px !important;
}
.server[status="offline"] {
    background-color: var(--server_list-offline_server);
}
.server[status="online"] {
    background-color: var(--server_list-online_server);
}
.server[status="online"]:hover {
    transition-duration: 200ms;
    background-color: var(--server_list-online_server_hover);
}
th {
    color: var(--server_list-text-header);
    font-size: 12px;
    font-weight: 600;
    text-align: left;
    background-color: var(--server_list-background);
    padding-bottom: 11px;
}
details {
    padding-right: 40px;
    font-size: 10px;
    transition-duration: 200ms;
    line-height: 175%
}
details:hover {
    transition-duration: 200ms;
    background-color: var(--server_list-online_server_hover)
}


.material-symbols-outlined {
  font-size: 11px !important;
}