* {
    margin: 0;
    padding: 0;
}

body {
    font-family: 'Trebuchet MS', sans-serif;
    background-color: #a3a3a3;
    overscroll-behavior-y: contain;
}

html {
    height: -webkit-fill-available;
  }

@media (prefers-color-scheme: dark) {
    body {
        background-color: #292929;
    }
    .middleblock {
        width: 100%;
        color: rgb(204, 204, 204) !important;
    }
    .downloadinfo {
        color: rgb(204, 204, 204) !important;
    }
    table.sounds td:nth-child(3) {
        color:rgb(204, 204, 204) !important;
    }
    table.music td:nth-child(4) {
        color:rgb(204, 204, 204) !important;
    }
    td.playername {
        color: rgb(204, 204, 204) !important;
    }
    .modeltext {
        color: rgb(204, 204, 204) !important;
    }
    .modelsheader {
        color: rgb(204, 204, 204) !important;
    }
    .patronstext {
        color: rgb(204, 204, 204) !important;
    }
    .mobilebackground {
        display:none !important;
    }
    div#greetings {
        color:rgb(204, 204, 204) !important;
    }
}

h1 {
    font-size: 26px;
    text-shadow: 0px 1px 2px black;
    color: turquoise;
    line-height: 30px;
    font-weight: bold;
}

div#infoMessage {
    display:none;
}

.footer {
    width: 100%;
    color: rgb(109, 109, 109);
    text-align: center;
    font-size: 11px;
    padding-bottom: 60px;
  }
div.fixed {
    display: none;
  } 

a, a:visited, a:link {
    color:turquoise;
    text-decoration:none;
}

a:active, a:hover, a:focus {
    text-decoration:none;
}

.wrapper {
    width: 100%;
    padding: 6px 0 0 0;
}
.maps {
    top: 223px;
    left: 0;
    width: 100%;
    height: calc(100% - 275px);
    height: -webkit-calc(100% - 275px);
    height: -moz-calc(100% - 275px);
    position: fixed;
    overflow-y: scroll;
    z-index: 1;
}
.motdmaps {
    top: 223px;
    left: 0;
    width: 100%;
    height: calc(100% - 275px);
    height: -webkit-calc(100% - 275px);
    height: -moz-calc(100% - 275px);
    position: fixed;
    overflow-y: scroll;
    z-index: 1;
}

.contacts {
    left: 0;
    width: 100%;
}

.contactscontainer {
    padding: 37px 4px 0px;
}
.mapsblock {
    overflow-y:auto;
    padding: 0 5px 0 5px;
}
.mapsblockmotd {
    display: block;
    width: 30%;
    height: 100%;
    overflow-y: hidden;
}
.mapsblockmotd {
    overflow-y:auto;
    padding: 0 1.6vh 0 1.6vh;
}
.leftblockcontacts {
    overflow-y:auto;
    padding: 0 5px 0 5px
}
.rightblockcontacts {
    overflow-y:auto;
    padding: 0 5px 0 5px
}
.mapsblockright {
    overflow-y:auto;
    padding: 0 5px 0 5px;
}

.rankswrapper {
    width: 100%;
    padding: 6px 0 0 0;
    height: 100%;
    position: absolute;
}
.rankscontainer {
    display: block;
    position: absolute;
    width: 100%;
    height:100%;
    z-index: 1;
    overflow-y: hidden;
}
.modelscontainer {
    display: block;
    width: 100%;
    height: 100%;
    text-align: center;
    padding: 37px 0px 0px;
}
.modelscontainerfull {
    display: none;
}
.modelsfullcontainer {
    display: none;
}
.modelsheader {
    position: sticky;
    top: 0;
    font-size: 5vw;
    letter-spacing: 2.5px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.modeltext {
    color: #383838;
    font-size: 26px;
    letter-spacing: 4px;
}
.patronstext {
    color: #383838;
}
table.models tbody {
    width:100%;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.ranksfullcontainer {
    display: none;
}
.matchesfullcontainer {
    display: none;
}
.banscontainer {
    display: none;
}
.chatsfullcontainer {
    display: none;
}
.logowrapper {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    width: 100%;
    position: fixed;
    color: white;
    font-size: 30px;
    z-index: -1;
    top: 0;
}

.logodot {
    color:rgb(0, 212, 212);
    -webkit-text-stroke-width: 1.5px;
    -webkit-text-stroke-color: black;
    text-shadow: 0 0 4px black;
    font-weight: bold;
    font-size: 30px;
    line-height: 40px;
}

.logodotmatch {
    color:rgb(212, 0, 0);
    -webkit-text-stroke-width: 1.5px;
    -webkit-text-stroke-color: black;
    text-shadow: 0 0 4px black;
    font-weight: bold;
    font-size: 30px;
    line-height: 40px;
}

.logotext {
    color:rgb(238, 238, 238);
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: rgb(136, 136, 136);
    font-family: 'Poppins', sans-serif
}

.menudot  {
    color:rgb(0, 212, 212);
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: black;
    text-shadow: 0 0 4px black;
    font-size:20px;
}
.img-info {
    width:100%;
}

.guides {
    padding: 37px 4px 0px;
}

.img-info p {
    padding: 0px 10px 20px;
    font-size: 16px;
    color: #111;
    line-height: 24px;
}

.content {
    padding: 2px 0px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
.contentmaps {
    padding: 2px 0px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
  .contentmapsmotd {
    padding: 2px 0px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
.contentcontact {
    padding: 2px 0px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
.contentpatrons {
    padding: 2px 0px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}
.contentcontactsmaller {
    padding: 2px 0px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }

.contentfaq {
    padding: 2px 0px;
    max-height: 0;
    overflow-y:hidden;
    transition: max-height 0.2s ease-out;
  }

.collapsible {
    padding: 10px;
    background-color: rgba(119, 119, 119, 0.349);
    width: 100%;
    height: 60px;
    border: none;
    border-radius: 10px;
    text-align: left;
    font-size: 23px;
    color: turquoise;
    font-weight: normal;
    letter-spacing: 1px;
    text-shadow: 0px 1px 2px black;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    overflow-y: hidden;
    white-space: nowrap;
}

.collapsiblemotd {
    padding: 10px;
    background-color: rgba(119, 119, 119, 0.349);
    width: 100%;
    height: 8%;
    border: none;
    border-radius: 10px;
    text-align: left;
    font-size: 23px;
    color: turquoise;
    font-weight: normal;
    letter-spacing: 1px;
    text-shadow: 0px 1px 2px black;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    overflow-y: hidden;
    white-space: nowrap;
}

.leftblock {
    overflow-y: hidden;
}

.rightblock {
    overflow-y: hidden;
}

.leftblockcontacts {
    overflow-y: hidden;
}

.rightblockcontacts {
    overflow-y: hidden;
}


.active, .collapsible:hover {
    background-color: #555555;
    color: turquoise;
    border-radius: 10px;
    font-size: 23px;
    font-weight: normal;
    text-shadow: 0px 1px 2px black;
}

.active, .collapsiblemotd:hover {
    background-color: #555555;
    color: turquoise;
    border-radius: 10px;
    font-size: 23px;
    font-weight: normal;
    text-shadow: 0px 1px 2px black;
}

.collapsible:after {
    content: '\002B';
    color: turquoise;
    font-size: 23px;
    text-shadow: 0px 1px 2px black;
    font-weight: bold;
    float: right;
}

.collapsiblemotd:after {
    content: '\002B';
    color: turquoise;
    font-size: 23px;
    text-shadow: 0px 1px 2px black;
    font-weight: bold;
    float: right;
}
  
.active:after {
    content: "\2212";
    color: rgb(177, 177, 177);
    font-size: 23px;
    text-shadow: 0px 1px 2px black;
    font-weight: bold;
  }

table {
    width:100%;
}

td.tg-desc {
    text-align: left;
    text-shadow: 0px 1px 2px black;
    color: #d5d5d5;
    font-size: 19px;
    padding: 0 0 1px 0;
}

td.tg-value {
    text-align: right;
    color: white;
    text-shadow: 0px 1px 2px black;
    font-weight: bold;
    font-size: 19px;
    padding: 0 0 1px 0;
}

td.tg-description {
    text-align: justify;
    color: white;
    text-shadow: 0px 1px 2px black;
    font-weight: bold;
    font-size: 19px;
    padding: 0 0 1px 0;
}

.middleblock {
    width: 100%;
    color: rgb(75, 75, 75);
}

.middleblock p {
    text-align: center;
    padding: 10px 10px 20px;
}

span#yellow {
    color: #ffff00;
}

span#purple {
    color: #ff00ff;
}

span#green {
    color: #00ff00;
}

span#red {
    color: red;
}

div#lowerblock {
    text-align: center;
    display: block;
    position: relative;
  	margin-right: auto;
  	width: 100%;
}
.playercountsentence {
    text-align: center;
    display: block;
    position: relative;
  	margin-right: auto;
  	width: 100%;
    height: 60px;
}

.topblock {
    display:none;
}

img#youtube {
    position: fixed;
    width: 40px;
    height: auto;
    left: 39%;
    bottom: 8px;
    z-index: 4;
}

img#steam {
    position: fixed;
    width: 40px;
    height: auto;
    left: 54%;
    bottom: 8px;
    z-index: 4;
}

img#discord {
    position: fixed;
    width: 40px;
    height: auto;
    left: 69%;
    bottom: 8px;
    z-index: 4;
}

img#logosmall {
    width: 120px;
    height: auto;
    top: 0%;
}

/* Add a black background color to the top navigation */
.topnav {
    overflow: hidden;
    position: fixed;
    z-index:0;
    width: 100%;
    font-family: 'Poppins', sans-serif;
    max-height: 100%;
    overflow: auto;
    /* mobile viewport bug fix */
    height: calc(100vh - calc(100vh - 100%))
  }
  
  /* Style the links inside the navigation bar */
.topnav a {
    float: left;
    display: block;
    color: #f2f2f2;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 20px;
    letter-spacing: 4px;
  }

.homenav a {
    float: left;
    display: block;
    color: #f2f2f2;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 20px;
    letter-spacing: 4px;
  }

.menuicon {
    text-align: right;
}
  
  /* Change the color of links on hover */
.homenav a:hover {
    color: turquoise;
  }
  
  /* Add an active class to highlight the current page */
.activemenu {
    background-color: #8a8a8a;
    color: white;
  }

.topnav a {
    display: none;
}

.homenav a.icon {
    position:fixed;
    right: 0;
    bottom: 0;
    display: block;
}

div#myHomenav {
    position: fixed;
    padding: 5px 0 0 0;
    bottom: 0%;
    width: 100%;
    background-color: rgba(51, 51, 51, 0.521);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    z-index: 3;
}

.topnav.responsive {
    position: fixed;
    top: 0;
    width: 100%;
    background-color: rgba(51, 51, 51, 0.521);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    z-index: 2;
}

.homenav.responsive a.icon {
    position: fixed;
    right: 0;
    bottom: 0;
}
.topnav.responsive a {
    float: none;
     display: block;
    text-align: left;
}

img#logosmalldesktop {
    display: none;
}

img#logosmalldesktopmatch {
    display: none;
}

video {
    display:none;
  }


.menu {
    display: none;
}
.spacebetweendropdown {
    display: none;
}

.mobilechat{
    position:relative;
    width:100%;
    height: calc(100% - 50px);
    height: -webkit-calc(100% - 50px);
    height: -moz-calc(100% - 50px);
    top:0;
}
.mobilechatinput{
    width:100%;
    height:60px;
}

.chatcontainer {
    padding: 37px 0px 0px;
    height: calc(100% - 85px);
    height: -webkit-calc(100% - 85px);
    height: -moz-calc(100% - 85px);
    position: fixed;
    overflow-y: hidden;
    z-index: 1;
    width: 100%;
}
.textcontainer {
position: absolute;
width: 100%;
bottom: calc(0% + 58px);
bottom: -webkit-calc(0% + 58px);
bottom: -moz-calc(0% + 58px);
overflow-y: hidden;
z-index: 1;
}

.singleblock {
    display:block;
}

#homevid {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.9;
    overflow-x: hidden;
}

img#homevidtemp {
    display: none;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.9;
    overflow-x: hidden;
}

iframe.forum {
    height: calc(100% - 10px);
    height: -webkit-calc(100% - 10px);
    height: -moz-calc(100% - 10px);
    position: fixed;
    z-index: 1;
    width: 100%;
}

table.sounds th {
    text-align: left;
    font-weight: bold;
    white-space: nowrap;
    overflow: hidden;
    font-size: 20px;
    line-height: 2;
}
table.sounds td:nth-child(1) {
    text-transform:uppercase;
}
table.sounds td:nth-of-type(2) {
    display: none;
}
table.sounds {
    color: white;
    text-shadow:  0px 1px 2px black;
    line-height: 18pt;
    font-size: 18px;
}
table.sounds td:nth-child(3) {
    text-shadow: none;
    font-size: 13px;
    color:rgb(41, 41, 41);
}
table.music {
    color: white;
    text-shadow:  0px 1px 2px black;
    line-height: 18pt;
    font-size: 18px;
}
table.music td:nth-child(2) {
    text-transform:uppercase;
}
table.music td:nth-of-type(1) {
    display: none;
}
table.music th {
    text-align: left;
    font-weight: bold;
    font-size: 20px;
    line-height: 2;
}
table.music td:nth-child(4) {
    text-transform:capitalize;
    font-size: 13px;
    text-overflow: ellipsis;
    text-shadow: none;
    color:rgb(41, 41, 41);
  }

iframe.playlist {
    display:none;
}
iframe.saysounds {
    display:none;
}
iframe.hl1dmsaysounds {
    display:none;
}
.titleplaylist {
    display:none;
}
.titlesaysounds {
    display: none;
}
.titlehl1dmsaysounds {
    display: none;
}
.titleplaylist {
    display:none;
}
.titlesaysounds {
    display: none;
}

[data-map-name] {
    cursor: pointer;
    white-space: nowrap;
    text-shadow: 0px 1px 2px black;
    color: #d5d5d5;
    line-height: 34px;
    font-weight: bold;
    font-size: 19px;
    padding: 0 0 0 2px;
}

[data-map-name]:hover {
    background-color: rgba(0, 0, 0, .6);
}

[right] {
    float: right;
}

img#mapcopy {
    z-index: 6;
    cursor: grabbing;
}

.color {
    background-color: rgba(0, 0, 0, .6);
    text-shadow: 0px 0px 10px cyan;
}
.counter {
    color: gray;
    text-shadow:  none;
}
#map_preview {
    overflow: hidden !important;
    background-size: cover;
    display: block;
    position: absolute;
    top: 0;
    left: 4px;
    width: calc(100% - 8px);
    height: 220px;
    border-radius: 10px;
    overflow-y: hidden;
}
#map_previewback {
    display:none;
}

iframe#stats {
    height: 100%;
    width: 100%;
    display: block;
    text-align: center;
    margin: 0 auto;
    z-index: 2;
    position: relative;
}
div#map_name{
    display:none;
}

.downloadinfo {
    width: 100%;
    color: rgb(75, 75, 75);
    text-align: center;
}

.mapinfo {
    display: none;
}

div#iframecomments {
    display:none;
}

.search {
    position: sticky;
    top: 0;
    padding: 2px 0 0 1px;
}
::placeholder {
    color: rgb(223, 223, 223);
  }

div#iframebox {
    position: relative;
    height: 200px;
    width:350px;
    text-align: center;
    margin: 0 auto;
    margin-top: 21px;
}

#map {
    visibility:hidden;
    }
#mapdisabled {
    visibility:hidden;
}

#admin89 {
    color: #690461 !important;
}

#toplogoimage {
    display: none;
}

iframe#animation {
    display: none;
}

td.playername {
    color: #474747;
}

video#zglogovid {
    display: none;
}
video#bgvid {
    display: none;
}

td.tg-descadmin89 {
    font-size: 25px;
    text-align: center;
    background: purple;
    color: white;
    border-radius: 5px;
    margin: 4px;
    width: 20px;
    vertical-align: text-top;
    text-shadow: 0px 1px 2px black;
}
td.tg-descadmin6 {
    font-size: 25px;
    text-align: center;
    background: cyan;
    color: white;
    border-radius: 5px;
    margin: 4px;
    width: 20px;
    vertical-align: text-top;
    text-shadow: 0px 1px 2px black;
}
td.tg-descadmin3 {
    font-size: 25px;
    text-align: center;
    background: rgb(97, 47, 47);
    color: white;
    border-radius: 5px;
    margin: 4px;
    width: 20px;
    vertical-align: text-top;
    text-shadow: 0px 1px 2px black;
}
td.tg-descadmin2 {
    font-size: 25px;
    text-align: center;
    background: rgb(141, 141, 141);
    color: white;
    border-radius: 5px;
    margin: 4px;
    width: 20px;
    vertical-align: text-top;
    text-shadow: 0px 1px 2px black;
}
td.tg-valueadmin {
    text-shadow: 0px 1px 2px black;
    color: #d5d5d5;
    display: block !important;
    padding-left: 5px;
}

iframe.bansmobile {
    z-index: 1;
}

.topblockpatrons {
    display: none;
}

.bubbleplayersonline {
    display: none;
}

#logobottom {
    display: none;
}

.logoblock {
    display: none;
}

.playerscountmatch {
    display: none;
}
.playerscountmain {
    display: none;
}

.playerscountmatch {
    display: none;
}
.playerscountmain {
    display: none;
}
.bubbleministats {
    display: none;
}
.bubblestats {
    display: none;
}
.photo {
    display: none;
}
.bubblejoin {
    display: none;
}
.bubblechat {
    display: none;
}
.logowrapperdesktop {
    display: none;
}
.bubblerss {
    display: none;
}
.playerscountmobile {
    display:block;
    position: absolute;
    padding: 37px 0px 0px;
    width: 100%;
    height: 50px;
}
.playersonlinemob {
    display: block;
    position: absolute;
    top: 45px;
    right: 6px;
    height: 86px;
    width: 47%;
    border-style: solid;
    border-radius: 6px;
    border-width: 3px;
    border-color: #3c291d;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    background-color: #00000040;
    text-align: center;
}
.playerscountmob {
    width: 50%;
}
.scrollformore {
    position: absolute;
    width: -webkit-fill-available;
    height: 65px;
    bottom: 50px;
    margin: 5px !important;
    text-align: center;
    font-size: 27px;
    letter-spacing: 4px;
    font-family: 'Poppins', sans-serif;
    line-height: 70px;
    color:#c0c0c0;
}

  .container {
    align-items: center;
    justify-content: center;
    height: 100vh;
  }
  
  #full {
    height: 920px;
  }

  .logomobile {
    display: block;
    position: relative;
    text-align: center;
    margin: 0 auto;
    width: 50%;
    height: auto;
    top: 41%;
}

.mobilebackground {
    display: block;
    overflow: hidden !important;
    display: block;
    position: absolute;
    overflow-y: hidden;
    height: 260%;
    width: -webkit-fill-available;
    z-index: -2;
    filter: opacity(20%);
}

.bubbleplayersonlinemobile {
    display:block;
    position: inherit;
    width: -webkit-fill-available;
    height: 230px;
    top: 5px;
    border-style: solid;
    border-radius: 6px;
    border-width: 3px;
    margin: 5px !important;
    border-color: #3c291d;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    background-color: #00000040;
    overflow-x:hidden;
}
.bubbleplayersonlinemobilehl1 {
    display:block;
    position: inherit;
    width: -webkit-fill-available;
    height: 230px;
    top: 5px;
    border-style: solid;
    border-radius: 6px;
    border-width: 3px;
    margin: 5px !important;
    border-color: #3c291d;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    background-color: #00000040;
    overflow-x:hidden;
}
.bubbleplayersstatsmobile {
    display:block;
    position: inherit;
    width: -webkit-fill-available;
    height: 135px;
    top: 5px;
    border-style: solid;
    border-radius: 6px;
    border-width: 3px;
    margin: 5px !important;
    border-color: #3c291d;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    background-color: #00000040;
    color: #c0c0c0;
}
iframe.stats {
    width: 100%;
}
.bubbleplayersrecordsmobile {
    display:block;
    position: inherit;
    width: -webkit-fill-available;
    height: 135px;
    top: 5px;
    border-style: solid;
    border-radius: 6px;
    border-width: 3px;
    margin: 5px !important;
    border-color: #3c291d;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    background-color: #00000040;
    color: #c0c0c0;
}

iframe.records {
    width: 99%;
    height: 100%;
}

.bubbleplayersministatsmobile {
    display:block;
    position: inherit;
    width: -webkit-fill-available;
    height: 140px;
    top: 5px;
    border-style: solid;
    border-radius: 6px;
    border-width: 3px;
    margin: 5px !important;
    border-color: #3c291d;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    background-color: #00000040;
    color: #c0c0c0;
}
iframe.ministats {
    width: 100%;
}
iframe.online {
    overflow-y: scroll;
    width: 100%;
    height: 95%;
    margin-top: 5px;
}
iframe.onlinehl1 {
    overflow-y: scroll;
    width: 100%;
    height: 49%;
    margin-top: -9%;
}

img#logocenter {
    display: none;
}
.photopopup {
display: none;
}

.area {
    display: block;
    width: -webkit-fill-available;
    height: 99%;
}

.areapatrons {
    display: block;
    width: -webkit-fill-available;
    height: 100%;
}

.circles {
    position: absolute;
    top: 0;
    left: 0;
    width: -webkit-fill-available;
    height: 100%; /* Matches `.area` height */
    overflow: hidden;
    z-index: -1;
}

.circles li {
    position: absolute;
    display: block;
    list-style: none;
    width: 20px;
    height: 20px;
    animation: animate 25s linear infinite;
    top: -50px; /* Start above the container */
    text-align: center;
    color: rgb(238, 238, 238);
    -webkit-text-stroke-width: 0.5px;
    -webkit-text-stroke-color: rgb(136, 136, 136);
    font-family: 'Poppins', sans-serif;
    text-shadow: 2px 4px 6px rgba(87, 87, 87, 0.1), /* Shadow for depth */
                 0px 0px 4px rgba(255, 255, 255, 0.422); /* Soft glow */
    filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.5)); /* Adds a subtle glow */
}

.circles li:nth-child(1){
    left: 25%;
    width: 80px;
    height: 80px;
    animation-delay: 0s;
   font-size: 52px;
}

.circles li:nth-child(2){
    left: 10%;
    width: 20px;
    height: 20px;
    animation-delay: 2s;
    animation-duration: 12s;
   font-size: 13px;
}

.circles li:nth-child(3){
    left: 70%;
    width: 20px;
    height: 20px;
    animation-delay: 4s;
   font-size: 13px;
}

.circles li:nth-child(4){
    left: 40%;
    width: 60px;
    height: 60px;
    animation-delay: 0s;
    animation-duration: 14s;
   font-size: 40px;
}

.circles li:nth-child(5){
    left: 65%;
    width: 20px;
    height: 20px;
    animation-delay: 0s;
   font-size: 13px;
}

.circles li:nth-child(6){
    left: 75%;
    width: 100px;
    height: 100px;
    animation-delay: 3s;
   font-size: 75px;
}

.circles li:nth-child(7){
    left: 35%;
    width: 150px;
    height: 150px;
    animation-delay: 0s;
   font-size: 90px;
}

.circles li:nth-child(8){
    left: 50%;
    width: 25px;
    height: 25px;
    animation-delay: 15s;
    animation-duration: 45s;
   font-size: 16px;
}

.circles li:nth-child(9){
    left: 20%;
    width: 15px;
    height: 15px;
    animation-delay: 2s;
    animation-duration: 35s;
   font-size: 10px;
}

.circles li:nth-child(10){
    left: 20%;
    width: 400px;
    height: 20px;
    animation-delay: 0s;
   font-size: 22px;
   line-height: 1.1;
}

.circles li:nth-child(11){
    left: 21%;
    width: 400px;
    height: 20px;
    animation-delay: 2s;
    animation-duration: 12s;
   font-size: 22px;
   line-height: 1.1;
}

.circles li:nth-child(12){
    left: 43%;
    width: 400px;
    height: 20px;
    animation-delay: 4s;
   font-size: 22px;
   line-height: 1.1;
}

.circles li:nth-child(13){
    left: 30%;
    width: 400px;
    height: 20px;
    animation-delay: 0s;
    animation-duration: 18s;
   font-size: 22px;
   line-height: 1.1;
}

.circles li:nth-child(14){
    left: 32%;
    width: 450px;
    height: 20px;
    animation-delay: 0s;
   font-size: 22px;
   line-height: 1.1;
}

.circles li:nth-child(15){
    left: 50%;
    width: 400px;
    height: 20px;
    animation-delay: 3s;
    animation-duration: 30s;
   font-size: 22px;
   line-height: 1.1;
}

.circles li:nth-child(16){
    left: 25%;
    width: 400px;
    height: 17px;
    animation-delay: 7s;
   font-size: 22px;
   line-height: 1.1;
}

.circles li:nth-child(17){
    left: 40%;
    width: 400px;
    height: 20px;
    animation-delay: 15s;
    animation-duration: 45s;
   font-size: 22px;
   line-height: 1.1;
}

.circles li:nth-child(18){
    left: 15%;
    width: 400px;
    height: 20px;
    animation-delay: 2s;
    animation-duration: 35s;
   font-size: 22px;
   line-height: 1.1;
}

.circles li:nth-child(19){
    left: 30%;
    width: 400px;
    height: 20px;
    animation-delay: 4s;
    animation-duration: 35s;
   font-size: 22px;
   line-height: 1.1;
}

.circles li:nth-child(20){
    left: 40%;
    width: 500px;
    height: 20px;
    animation-delay: 10s;
    animation-duration: 31s;
   font-size: 22px;
   line-height: 1.1;
}

div#greetings {
    position: absolute;
    top: 28.6%;
    width:20%;
    margin: 0 auto;
    text-align: center;
    color: #474747;
    line-height: 28px;
    width: 100%;
    font-family: 'Poppins', sans-serif;
}

div#greetingsstranger {
    position: absolute;
    top: 28.6%;
    width:20%;
    margin: 0 auto;
    text-align: center;
    color: #474747;
    line-height: 28px;
    width: 100%;
    font-family: 'Poppins', sans-serif;
}

.loginbutton {
    color: cyan;
    width: 10%;
    border-radius: 4px;
    padding: 3px;
    border: none;
    background-color: rgba(0, 0, 0, 0.384);
    text-transform: uppercase;
    vertical-align: baseline;
    font-family: 'Exo', sans-serif;
    letter-spacing: 4px;
}

iframe.nextmapbutton {
    display: none;
}
iframe.nextmapbuttonmotd {
    display: block;
    position: absolute;
    height: 50px;
    bottom: 0;
    left: 0;
    width: 100%;
    text-align: center;
    margin: 0 auto;
    z-index: 4;
}
#adminnextmap {
    visibility: hidden;
}
.lambda {
    vertical-align: bottom;
    filter: drop-shadow(0px 0px 1px rgba(0, 0, 0, 1));
}
.ballons {
    font-size: 30px;
}
.showbirthdays {
    display: none;
}
#birthdaymessage {
    display: block;
    width: 100%;
    text-align: center;
}
.kofi {
    display: none;
}

@keyframes animate {
    0% {
        transform: translateY(-20px); /* Slightly above the starting point */
        opacity: 0;
    }
    50% {
        transform: translateY(400px); /* Moves down to be visible mid-way */
        opacity: 1;
    }
    100% {
        transform: translateY(800px); /* Ends just below the mid-point */
        opacity: 0;
    }
}
.temporary {
    display:none;
}

@media only screen and (min-width: 1024px) {

    div#greetings {
        position: absolute;
        top: 86%;
        left: 20px;
        width:20%;
        color: #e7e2e2;
        line-height: 28px;
        font-size: 17px;
        text-align: left;
        text-shadow: 0px 1px 2px black;
        font-family: 'Poppins', sans-serif;
    }

    div#greetingsstranger {
        display: block;
        position: absolute;
        width:20%;
        top: 86%;
        left: 20px;
        color: #e7e2e2;
        line-height: 28px;
        font-size: 17px;
        text-align: left;
        text-shadow: 0px 1px 2px black;
        font-family: 'Poppins', sans-serif;
    }
    
    video#zglogovid {
        display: block;
    }
    video#bgvid {
        display: block;
    }

    .spacebetweendropdown {
        display: block;
    }

    div#myHomenav {
        display: none;
    }

    .contentfaq {
        height: 150px;
        overflow-y:scroll;
      }
    img#lara {
        filter: drop-shadow( 0px -4px 10px grey);
    }

    /* width */
    .contentfaq::-webkit-scrollbar {
        width: 0px;
        }
    
        /* Track */
        .contentfaq::-webkit-scrollbar-track {
        background: transparent;
        }
    
        /* Handle */
        .contentfaq::-webkit-scrollbar-thumb {
        background: #555;
        }
    
        /* Handle on hover */
        .contentfaq::-webkit-scrollbar-thumb:hover {
        background: #555;
        }

    .topnav {
        display: none;
          }

    .leftblock {
        position: absolute;
        top: 1.5%;
        left: 1.5%;
        width: 26%;
        max-height: 75%;
    }
    .rightblock {
        position: absolute;
        top: 1.5%;
        right: 1.5%;
        width: 26%;
        max-height: 75%;
        padding: 0;
    }
    .singleblock {
        position: absolute;
        top: 3%;
        right: 1.5%;
        width: 26%;
        max-height: 100%;
        padding: 0;
    }

    .middleblock {
        position: absolute;
        top: 50%;
        height: auto;
        color: #ffffff;
        text-shadow: 0px 1px 2px black;
        z-index: -1;
    }

    div#lowerblock {
        display: none;
    }

    .active, .collapsible:hover {
        font-size: min(max(10px, 1.7vw), 23px);
        border: 1px solid turquoise;
        border-radius: 6px;
    }

    .active, .collapsiblemotd:hover {
        font-size: min(max(10px, 1.7vw), 23px);
        border: 1px solid turquoise;
        border-radius: 6px;
    }
    
    .collapsible:after {
        font-size: min(max(10px, 1.7vw), 23px);
    }

    .collapsiblemotd:after {
        font-size: min(max(10px, 1.7vw), 23px);
    }

    .collapsible {
        font-size: min(max(10px, 1.7vw), 23px);
        border: 1px solid turquoise;
        border-radius: 6px;
        margin-top: 10px;
        cursor: pointer;
    }

    .collapsiblemotd {
        font-size: min(max(10px, 1.7vw), 23px);
        border: 1px solid turquoise;
        border-radius: 6px;
        margin-top: 1.6vh;
        cursor: pointer;
    }
      
    .active:after {
        font-size: min(max(10px, 1.7vw), 23px);
      }

    .footer {
        display: none;
    }

    div.fixed {
        display: block;
        position: fixed;
        width: 600px;
        bottom: 5px;
        color: rgba(172, 172, 172, 0.544);
        margin-left: -300px;
        left: 50%;
        text-shadow:none;
        font-weight: bold;
        font-variant: normal;
        font-size: 1.1vw;
        text-align: center;
    } 

    .postaltitle {
        font-size: 32px;
    }
    .facttitle {
        font-size: 26px;
        letter-spacing: 4px;
    }

    .logowrapper {
        display: none;
    }

    .wrapper {
        width: 100%;
        padding: 0 0 0 0;
    }

    img#logosmalldesktop {
        position: absolute;
        margin: auto;
        display: block;
        width: 400px;
        height: auto;
        left: 0;
        right: 0;
        margin-top: -200px;
        top: 32%;
        text-align:center;
        filter: drop-shadow( 0px 0px 70px grey);
    }

    img#logocenter {
        position: absolute;
        margin: auto;
        display: block;
        width: 400px;
        height: auto;
        left: 0;
        right: 0;
        margin-top: -200px;
        top: 42%;
        text-align:center;
        filter: drop-shadow( 0px 0px 70px grey);
    }
    img#logobottom {
        display: block;
        width: 150px;
        height: auto;
        margin: 0 auto;
        text-align: center;
        filter: drop-shadow( 0px 0px 70px grey);
    }
    .smalllogotext {
        color: rgb(238, 238, 238);
        -webkit-text-stroke-width: 1px;
        -webkit-text-stroke-color: rgb(136, 136, 136);
        font-family: 'Poppins', sans-serif;
        letter-spacing: 3px;
        font-size: 20px;
    }
    .logoblock{
        display:none !important;
        position: absolute;
        margin: auto;
        bottom: 22%;
        right: 15px;
        height: 200px;
        text-align: center;
        display: table-cell;
    }
    .contentlogoblock {
        position: relative;
        top: 50%;
        transform: translateY(-50%);
    }

    img#logosmalldesktopmatch {
        position: absolute;
        margin: auto;
        display: block;
        width: 400px;
        height: auto;
        left: 0;
        right: 0;
        margin-top: -100px;
        top: 35%;
        text-align:center;
        filter: drop-shadow( 0px 0px 70px #DB0D00);
    }

    .leftblock {
        padding: 0;
    }

    .topblock {
        display: block;
        text-align: center;
        position: absolute;
        top: 3%;
        right: 20%;
        width: 60%;
        font-size: 16px;
        color: white;
        font-weight: bold;
        text-shadow: 0px 0px 2px rgb(0 0 0);
    }

    .topblockpatrons {
        display: block;
        text-align: center;
        position: initial;
        margin: 10px auto;
        width: 35%;
        font-size: 20px;
        color: white;
        font-weight: bold;
        text-shadow: 0px 0px 2px rgb(0 0 0);
    }

    .playercountsentence {
          margin-right: auto;
          width: 390px;
          display: block;
          text-align: center;
          position: absolute;
          top: 15%;
          right: 32.8%;
          width: 35%;
          height: 60px;
    }

    video {
        display: block;
        object-fit: cover;
        width: 100vw;
        height: 100vh;
        position: fixed;
        top: 0;
        left: 0;
        z-index: -2;
      }

    td.tg-desc {
        font-size: 16px;
    }
    
    td.tg-value {
        font-size: 16px;
    }

    td.tg-description {
        font-size: 16px;
    }

    .menubackground {
        font-size: 10px;
        display: block;
        position: fixed;
        top: 75%;
        width: 100%;
        height: 3.50em;
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        background-color: rgba(51, 51, 51, 0.521);
        z-index: 1;
    }

    .grey{  
        width:140px;
        height: 43px; 
        text-align:center;  
        overflow:hidden;
        font-size:15px;
        list-style: none;
        line-height: 149%;
        letter-spacing: 1px;
        font-family: sans-serif;
    }

    a:visited, a:link {
        color: #e7e2e2;
    }

    a:hover {
        color: cyan;
    }

    ul{
        margin:0;  
        padding:0;
    }

    .subtext{  
        padding-top:5px;
    }

    p {
        padding: 9px 1px;
    }

    nav[class^="menuitem"] {
        margin-top: -2px;
    }

    .menu {
        display: flex;
        flex-flow: row nowrap;
        justify-content: space-between;
        width: 100%;
        top: 75%;
        position: fixed;
        color: white;
        font-size: 30px;
        z-index: 2;
    }

    img#zgactive {
        position: fixed;
        margin-top: -20px;
        z-index: -1;
        filter: drop-shadow( 0px -1px 4px #0ff);
    }
     
    img[id^="zginactive"] {
        position: fixed;
        margin-top: -20px;
        z-index: -1;
        display: none;
        filter: drop-shadow( 0px -1px 4px #0ff);
    }
    
    .menuitem1:hover img#zginactive1 {
        display: block;
    }
    .menuitem2:hover img#zginactive2 {
        display: block;
    }
    .menuitem3:hover img#zginactive3 {
        display: block;
    }
    .menuitem4:hover img#zginactive4 {
        display: block;
    }
    .menuitem5:hover img#zginactive5 {
        display: block;
    }
    .menuitem6:hover img#zginactive6 {
        display: block;
    }

    img#youtube {
        left: 39%;
    }
    img#steam {
        left: 49%;
    }
    img#discord {
        left: 59%;
    }

    .mobilechat {
        height: 75%;
    }
    .chatcontainer {
        padding: 0 0 0 10px;
    }
    .textcontainer {
        padding: 0 0 0 10px;
        width: 50%;
        bottom: 31%;
    }

    .rankscontainer {
        display: none;
    }
    .modelscontainer {
        display: none;
    }
    .modelscontainerfull {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 75%;
        text-align: center;
        overflow-y: scroll;
    }
    .ranksfullcontainer {
        display: block;
        display: block;
        position: absolute;
        width: 100%;
        height: 76%;
    }
    .ranksfullcontainer2 {
        display: block;
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
    }
    .matchesfullcontainer {
        display: block;
        display: block;
        position: absolute;
        width: 100%;
        height: 76%;
    }
    .chatsfullcontainer {
        display: block;
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
    }
    .banscontainer {
        display: block;
        display: block;
        position: absolute;
        width: 100%;
        height: 77%;
    }
    .singleblock {
        display:none;
    }

    iframe.forum {
        height: 75%;
        position: absolute;
        width: 100%;
        z-index:0;
    }
    iframe.playlist {
        display:block;
        position:absolute;
        left:1%;
        top:5%;
        width:36%;
        height:68%;
    }
    iframe.saysounds {
    display: block;
    position: absolute;
    right: 1%;
    top: 5%;
    width: 36%;
    height: 30%; /* half of original 68% */
    }
    iframe.hl1dmsaysounds {
    display: block;
    position: absolute;
    right: 1%;
    top: 41%; /* 5% + 32% */
    width: 36%;
    height: 32%;
    }
    iframe.demos {
        display:block;
        position:absolute;
        left:1%;
        top:4%;
        width:48%;
        height:68%;
    }
    iframe.guide {
        display:block;
        position:absolute;
        right:1%;
        top:4%;
        width:48%;
        height:68%;
    }
    .titledemos {
        display:block;
        position:absolute;
        left:1.5%;
        top:1%;
        font-size: 24px;
        color: #00ffff;
        text-shadow: 0px 1px 2px black;
    }
    .titleguide {
        display: block;
        position:absolute;
        width:48%;
        right: 1%;
        top:1%;
        font-size: 24px;
        color: #00ffff;
        text-shadow: 0px 1px 2px black;
    }
    .titleplaylist {
        display:block;
        position:absolute;
        left:1.5%;
        top:1%;
        font-size: 24px;
        color: #00ffff;
        text-shadow: 0px 1px 2px black;
    }
    .titlesaysounds {
        display: block;
        position:absolute;
        width:35.5%;
        right: 1%;
        top:1%;
        font-size: 24px;
        color: #00ffff;
        text-shadow: 0px 1px 2px black;
    }
    .titlehl1dmsaysounds {
        display: block;
        position:absolute;
        width:35.5%;
        right: 1%;
        top:37%;
        font-size: 24px;
        color: #00ffff;
        text-shadow: 0px 1px 2px black;
    }
    .content {
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
      }

    .contentmaps {
        overflow-y: scroll;
        height: calc(100% - 350px);
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
        padding: 0 0 0 0;
    }
    .contentmapsmotd {
        overflow-y: scroll;
        height: calc(51.8% - 1.6vh);
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
        padding: 0 0 0 0;
    }
    .contentcontact {
        overflow-y: scroll;
        height: calc(100% - 350px);
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
        padding: 0 0 0 0;
    }
    .contentpatrons {
        overflow-y: scroll;
        height: calc(100% - 140px);
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
        padding: 0 0 0 0;
    }
    .contentcontactsmaller {
        overflow-y: scroll;
        height: calc(100% - 210px);
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
        padding: 0 0 0 0; 
    }

    .mapsblock {
        display: block;
        width: 30%;
        height: 100%;
        overflow-y: hidden;
    }
    .mapsblockmotd {
        display: block;
        width: 30%;
        height: 100%;
        overflow-y: hidden;
    }

    .rightblockcontacts {
        display: block;
        width: 30%;
        height: 100%;
        overflow-y: hidden;
        position: absolute;
        top: 0;
        right: 0;
        padding: 0 7px 0 0;
    }

    .leftblockcontacts {
        display: block;
        width: 30%;
        height: 100%;
        overflow-y: hidden;
    }
    .mapsblockright {
        display: block;
        width: 30%;
        height: 100%;
        overflow-y: hidden;
        position: absolute;
        top: 0;
        right: 0;
        padding: 0 7px 0 0;
    }
    .mapsblockrightmotd {
        display: block;
        width: 30%;
        height: 100%;
        overflow-y: hidden;
        position: absolute;
        top: 0;
        right: 0;
        padding: 0 1.6vh 0 1.6vh;
    }
    .maps {
        top: 0;
        height: 75%;
        z-index: 0;
        position: absolute;
        overflow-y: hidden;
    }
    .motdmaps {
        top: 0;
        height: 100%;
        z-index: 0;
        position: absolute;
        overflow-y: hidden;
    }
    .contacts {
        top: 0;
        height: 75%;
        z-index: 0;
        position: absolute;
        overflow-y: hidden;
    }
    #map_previewback {
        overflow: hidden !important;
        background-size: cover;
        display: block;
        position: absolute;
        top: -5%;
        left: -5%;
        width: 110%;
        height: 220px;
        overflow-y: hidden;
        height: 140%;
        filter: blur(30px);
        transition: background-image 1s;
        background-color: #585858;
    }
    #previewbackmotdcontainer{
        overflow: hidden;
        border-radius: 6px;
        width: 100%;
        height: 100%;
    }
    #previewbackmotd {
        overflow: hidden !important;
        background-size: cover;
        display: block;
        position: relative;
        top: -5%;
        left: -5%;
        width: 110%;
        overflow-y: hidden;
        height: 140%;
        filter: blur(30px);
        transition: background-image 1s;
        border-radius: 10px;
    }
    [data-map-name] {
        line-height: 26px;
        font-size: 17px;
        font-weight: normal;
    }

    div#topcontrol {
        top: 1.5% !important;
        left: 31% !important;
        width: 50px;
        height: 50px;
    }
    #map_preview {
        overflow: hidden !important;
        background-size: cover;
        display: block;
        width: 330px;
        height: 37%;
        max-height: 200px;
        border-radius: 10px;
        overflow-y: hidden;
        display: block;
        text-align: center;
        margin: 0 auto;
        position: relative;
    }
    #map_previewmotd {
        display: block;
        position: relative;
        overflow: hidden;
        left: 0;
        right: 0;
        z-index: 1;
        text-align: center;
        height: 30%;
        border-radius: 10px;
        width: 100%;
        max-height: 200px;
    }
    .mapinfo {
        display: block;
        position: inline;
        bottom: 255px;
        height: auto;
        color: #ffffff;
        text-shadow: 0px 1px 2px black;
        width: 100%;
        display: block;
        margin: 0 auto;
        left: 34%;
        text-align: center;
        font-family: 'Poppins', sans-serif
    }
    .downloadinfo {
        display: block;
        position: inline;
        bottom: 255px;
        height: auto;
        color: #ffffff;
        text-shadow: 0px 1px 2px black;
        width: 100%;
        display: block;
        margin: 0 auto;
        left: 34%;
        text-align: center;
        font-family: 'Poppins', sans-serif
    }
    div#iframecomments {
        display: block;
        position: relative;
        height: 14%;
        width: 300px;
        overflow: hidden;
        z-index: 1;
        text-align: center;
        margin: 0 auto;
      }
    div#iframecommentsmotd {
        display: block;
        position: relative;
        overflow: hidden;
        left: 0;
        right: 0;
        z-index: 1;
        text-align: center;
        width: 100%;
        height: 22.5%;
        overflow: auto;
        max-height: 100%;
        display: flex;
        flex-direction: column-reverse;
      }
    iframe#comments{
        width: 100%;
    }
    .counter {
        color: gray;
        text-shadow: 0px 1px 2px black;
        left: 65%;
        position: fixed;
    }
    .grouptitle{
        margin-top: -1%;
        position: absolute;
    }
    .mapdetailscontainer {
        position: absolute;
        width: 100%;
        height: 75%;
        top: 0;
    }
    .motdmapdetailscontainer {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        display: flex;
        overflow-x: hidden;
        overflow-y: hidden;
    }
    .badmap {
        display:none;
    }
    .mapsdetails {
        height: 100%;
        position: relative;
        top: 0;
        overflow-y: hidden;
        text-align: center;
        margin: 0 auto;
    }
    .mapsdetailsmotd {
        height: 100%;
        width: 29%;
        max-width: 380px;
        position: relative;
        top: 0;
        overflow-y: hidden;
        text-align: center;
        margin: 0 auto;
    }
    div#map_name{
        display:block;
        position: relative;
        height: 9%;
        width: 350px;
        overflow: hidden;
        z-index: 1;
        text-align: center;
        margin: 6px auto;
        font-size: 23px;
        text-shadow: 0px 0px 6px rgb(0 0 0 / 26%);
        color:cyan;
    }
    div#map_namemotd{
        display:block;
        position: relative;
        height: 7%;
        width: 100%;
        overflow: hidden;
        z-index: 1;
        text-align: center;
        margin: 6px auto;
        font-size: 23px;
        text-shadow: 0px 0px 6px rgb(0 0 0 / 26%);
        color:cyan;
    }
    iframe#stats {
        padding: 0 0 0 6px;
        width:100%;
    }
    iframe#statsmotd {
        padding: 0 0 0 0;
        width:100%;
    }
    div#iframebox {
        position: relative;
        height: 35%;
        width: 330px;
        text-align: center;
        margin: 0 auto;
        z-index: 1;
    }
    div#iframeboxmotd {
        position: relative;
        height: 30%;
        width: 100%;
        text-align: center;
        margin: 0 auto;
        z-index: 1;
    }
    a#map {
        width: 40px;
        height: 40px;
        z-index: 3;
        bottom: 14px;
        position: absolute;
        right: 10px;
    }
    a#mapdisabled {
        width: 40px;
        height: 40px;
        z-index: 3;
        bottom: 14px;
        position: absolute;
        right: 10px;
    }
    @media screen and ( min-width: 100px ) and ( max-height: 700px ) {
        #map_preview {
            margin: 2.5% auto;
        }
        div#iframecomments {
            display: none;
          }
          img#youtube {
            left: 95.5%;
        }
        img#steam {
            left: 1%;
        }
        img#discord {
            left: 48%;
        }
        .spacebetweendropdown{
            display:none;
        }
    }

    @media screen and ( min-width: 100px ) and ( max-height: 750px ) {
        .subtext {
            padding-top: 0px;
        }
        .bubbleplayersonline {
            display: none !important;
        }
        .bubblerss {
            display: none !important;
        }
        #birthdaymessage {
            display: none !important;
        }
    }

    #zglogovid {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        opacity: 0.9;
        overflow-x: hidden;
    }

    #homevid {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        opacity: 0.9;
        overflow-x: hidden;
    }

    img#homevidtemp {
        display: block;
        position: absolute;
        z-index: -1;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        opacity: 0.9;
        overflow-x: hidden;
    }

    .homevidoverlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: #ffffff29;
        mix-blend-mode: overlay;
        backface-visibility: hidden;
    }

    #toplogoimage {
        display: block;
        width: 390px;
        height: auto;
        text-align: center;
        margin: 0 auto;
    }

    iframe#animation {
        display: block;
        position: absolute;
        left: 24%;
        top: 9%;
    }

    td.playername {
        color: #ffffff;
        text-shadow: 0px 1px 2px black;
    }
    td.tg-value {
        display: block !important;
    }
    table.modelsfull tbody {
        width:100%;
    }
    td.tg-0lax {
        width: 16.6%;
    }
    img#fullscreenmodels {
        width: 90%;
    }
    img#fullscreenmodels:hover {
        filter: brightness(1.2);
        animation: shake 1.5s;
        animation-iteration-count: infinite;
      }
    @keyframes shake {
        0% { transform: translate(1px, 1px) rotate(0deg); }
        10% { transform: translate(-1px, -2px) rotate(-1deg); }
        20% { transform: translate(-3px, 0px) rotate(1deg); }
        30% { transform: translate(3px, 2px) rotate(0deg); }
        40% { transform: translate(1px, -1px) rotate(1deg); }
        50% { transform: translate(-1px, 2px) rotate(-1deg); }
        60% { transform: translate(-3px, 1px) rotate(0deg); }
        70% { transform: translate(3px, 1px) rotate(-1deg); }
        80% { transform: translate(-1px, -1px) rotate(1deg); }
        90% { transform: translate(1px, 2px) rotate(0deg); }
        100% { transform: translate(1px, -2px) rotate(-1deg); }
      }
    .modeltextdesktop {
        color:#e7e2e2;
        text-shadow: 0 0 4px black;
        letter-spacing: 4px;
    }
    .modeltextdesktopheader {
        color:#e7e2e2;
        text-shadow: 0 0 4px black;
        letter-spacing: 4px;
        position: sticky;
        top: 0;
        letter-spacing: 2.5px;
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        font-size: 25px;
        z-index: 2;
    }

    div#infoMessage {
        letter-spacing: 2px;
        text-shadow: none;
        position:fixed;
        display:none;
        top:332px;
        height:25.9%;
        left:42%;
        margin-left:-250px;
        width:654px;
        padding:20px;
        color: #c0c0c0;
        text-align:center;
        z-index: 0;
        cursor: default;
        text-shadow: 0px 0px 2px rgb(0 0 0 / 51%);
        font-size:15px;
        font-family: "Trebuchet MS", sans-serif;
        border-style: solid;
        border-radius: 6px;
        border-width: 3px;
        border-color: #3c291d;
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        background-color: #00000040;
        text-align: center;
        z-index: 3;
    }

    .playerscountmatch {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 272px;
    }
    .playerscountmain {
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: 272px;
    }
    .bubbleministats {
        display: block;
        position: absolute;
        left: 8px;
        top: 104px;
        width: 250px;
        height: 130px;
        border-style: solid;
        border-radius: 6px;
        border-width: 3px;
        border-color: #3c291d;
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        background-color: #00000040;
    }
    .bubblestats {
        display: block;
        position: absolute;
        right: 8px;
        top: 104px;
        width: 250px;
        height: 130px;
        border-style: solid;
        border-radius: 6px;
        border-width: 3px;
        border-color: #3c291d;
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        background-color: #00000040;
    }
    .bubblejoin {
        display: block;
        position: absolute;
        right: 8px;
        top: 248px;
        width: 250px;
        height: 70px;
        border-style: solid;
        border-radius: 6px;
        border-width: 3px;
        border-color: #3c291d;
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        background-color: #00000040;
        text-align: center;
        font-size: 30px;
        letter-spacing: 5px;
        font-family: 'Poppins', sans-serif;
        line-height: 70px;
    }
    #scrollme.row {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 100% !important;
    }
    .scroller {
        height: 70px;
        line-height: 70px;
        overflow: hidden;
     }
     .scroller .inner { animation: 10s normal infinite running scroll; }
        @keyframes scroll {
        0%  	{margin-top: 0px;}
        15% 	{margin-top: 0px;}
        25%  {margin-top: -70px;}
        40%  {margin-top: -70px;}
        50%  {margin-top: -140px;}
        65%  {margin-top: -140px;}
        75%  {margin-top: -210px;}
        90%  {margin-top: -210px;}
        100% {margin-top: 0px;}
        }
    .bubblechat {
        display: block;
        position: absolute;
        left: 8px;
        top: 248px;
        width: 250px;
        height: 70px;
        border-style: solid;
        border-radius: 6px;
        border-width: 3px;
        border-color: #3c291d;
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        background-color: #00000040;
        text-align: center;
        font-size: 30px;
        letter-spacing: 5px;
        font-family: 'Poppins', sans-serif;
        line-height: 70px;
    }
    .bubbleplayersonline {
        display: block;
        position: absolute;
        right: 8px;
        top: 332px;
        width: 250px;
        height: 29.9%;
        border-style: solid;
        border-radius: 6px;
        border-width: 3px;
        border-color: #3c291d;
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        background-color: #00000040;
        text-align: center;
        font-size: 30px;
        letter-spacing: 5px;
        font-family: 'Poppins', sans-serif;
        line-height: 70px;
    }
    .bubblerss {
        display: block;
        position: absolute;
        left: 8px;
        top: 332px;
        width: 250px;
        height: 29.9%;
        border-style: solid;
        border-radius: 6px;
        border-width: 3px;
        border-color: #3c291d;
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        background-color: #00000040;
        text-align: center;
        font-size: 30px;
        letter-spacing: 5px;
        font-family: 'Poppins', sans-serif;
        line-height: 70px;
    }
    .showbirthdays {
        display: block;
        position: absolute;
        left: 8px;
        top: 332px;
        width: 250px;
        height: 29.9%;
        text-align: center;
        font-size: 20px;
        color: #c0c0c0;
        font-family: "Trebuchet MS", sans-serif;
        text-shadow: 0px 0px 2px rgb(0 0 0 / 51%);
    }
    #birthdaymessage {
        display: block;
        width: 100%;
        top: 36%;
        position: absolute;
        margin-top: calc(-29.9%);
    }
    .photo {
        display: block;
        position: absolute;
        right: 8px;
        top: 104px;
        width: 150px;
        height: 130px;
        cursor: zoom-in;
    }

    iframe.ministats {
        margin-top: 2px;
    }
    iframe.stats {
        width: 255px;
        margin-left: 0;
    }
    iframe.online {
        width: 251px;
        height: 48.5%;
        margin-left: 0px !important;
        margin-top: 5px;
    }
    .logowrapperdesktop {
        display: flex;
        flex-flow: row nowrap;
        justify-content: space-between;
        width: 40%;
        color: white;
        font-size: 30px;
        z-index: -1;
        text-align: center;
        margin: 0 auto;
    }
    iframe.records {
        width: 100%;
        height: 100%;
    }
    .playerscountmobile {
        display:none;
    }
    .scrollformore {
        display: none;
    }
    .container {
        display: none;
    }
    #full {
        display: none;
    }
    .logomobile {
        display: none;
    }
    .mobilebackground {
        display: none;
    }
    .bubbleplayersonlinemobile {
        display: none;
    }
    .bubbleplayersonlinemobilehl1 {
        display: none;
    }
    .bubbleplayersstatsmobile {
        display:none;
    }
    .bubbleplayersrecordsmobile {
        display:none;
    }
    .bubbleplayersministatsmobile {
        display:none;
    }
    iframe#kofiframe {
        max-height: 477px;
    }
    .photopopup {
        display: block;
        overflow: hidden !important;
        background-size: cover;
        display: block;
        width: 330px;
        height: 100%;
        max-height: 200px;
        border-radius: 10px;
        overflow-y: hidden;
        display: block;
        text-align: center;
        margin: 0 auto;
        position: relative;
        z-index: 2;
        cursor: zoom-in;
    }
    .area {
        display: block;
    }
    iframe.nextmapbutton {
        display: block;
        position: relative;
        height: 50px;
        top: 0;
        left: 0;
        width: 330px;
        text-align: center;
        margin: 0 auto;
        z-index: 4;
    }
    iframe.nextmapbuttonmotd {
        display: block;
        position: relative;
        height: 50px;
        top: 0;
        left: 0;
        width: 100%;
        text-align: center;
        margin: 0 auto;
        z-index: 4;
    }
    div#motdnextmap {
        width: 100%;
    }
    #adminnextmap {
        visibility: hidden;
        height: 50px;
        z-index: 3;
    }
    iframe.kofiiframe {
        width: 100%;
        height: 100%;
    }
    .kofi {
        display: block;
        width: 50%;
        margin-left: 50%;
        height: 74%;
        position: absolute;
    }
    .temporary {
        display:block;
        overflow: hidden !important;
    display: block;
    position: absolute;
    overflow-y: hidden;
    height: 260%;
    width: -webkit-fill-available;
    z-index: -2;
    }
}