@font-face {font-family: 'montserrat';src: url('fonts/Montserrat-Medium.ttf') format('truetype');}
a:active{-webkit-tap-highlight-color: transparent;}
body{overflow-x: hidden;margin: 0;font-family:'montserrat';color: white;background-color: black;}
.loader-wrapper {width: 100%;height: 100vh;position: fixed;top: 0;left: 0;background:black;z-index:10;}
.loader{width:40%;}
.moonlinks,.loader-wrapper,.media,.swiper-carousel-animate-opacity{display: flex;justify-content: center;align-items: center;}
.vip{width: 12%;position: absolute;left: 50%;transform: translateX(-50%);top:1%}
.logo{width: 30%;display: block;margin:8vh auto 3vh;}.slare{width: 8vw;}
p,h1,h2,h3,h4{text-align: center;}
h1,h2,h3,h4{text-transform: uppercase;}
h1,h2{color:#f6e72a;}p{padding:0 5%;}
h1{margin: 1vh 0;}
.top .swiper-slide img{width:100%;}
.media{gap: 10vw;}
.link{width:10vw;}
.swiper-carousel-animate-opacity,.moonlinks{flex-direction: column;}
.swiper-carousel {padding-bottom: 32px;width:100%;}
.swiper-slide img{width: 80%;}
h1{font-size:1.8em;}
h2{font-size:1.6em;}
h3{opacity: 0;font-size:1.2em;width: 100vw;}
.swiper-div{margin-top:5vh;}
.swiper-slide-active h3{opacity:1;}
.swiper-div{
  background: linear-gradient(to top, #ffffff4b 0%, transparent 15%);
}
.media {
  background: linear-gradient(to top, #ffffff4b 0%, transparent 50%);
}
span{display: block;margin:-2vh auto 2vh;width: fit-content;color: #f6e72a;}
.lang{position: absolute;right: 3%;top:1%;color:black;background-color:#f6e72a;padding:2%;border-radius:30px;text-decoration: none;}
/* .swiper-slide img{filter: blur(3px);}
.swiper-slide-active img{filter: blur(0);} */
h4{font-size:1.2em;margin-top:2vh}
footer{margin-top:5vh}
footer a{text-decoration: none;color: white;}
@media only screen and (min-width: 600px){
.vip{width: 7%;}
.logo{width:20%;}
.loader{width:10%;}
.slare{width: 5vw;}
.link{width:7vw;}
h1{font-size:2.3em;}
h2{font-size:2em;}
h3{font-size:1.5em;}
p{font-size:1.3em;}
h4{font-size:1.5em;}
}
@media only screen and (min-width: 992px) {
.vip{width: 4%;}
.logo{width:15%;}
.slare{width: 3vw;}
.swiper-carousel {padding-bottom: 32px;max-width: 1200px;}
.swiper-slide img{width:60%;}
.media{gap: 5vw;}
.link{width:5vw;}.lang{padding:1%;}
}
@media only screen and (min-width: 1700px) {
.vip{width: 3%;}
.logo{width: 10%;}
.slare{width: 2vw;}
.link{width:3vw;}
.top{height:60vh;}.lang{padding:.5%;}
}