@font-face {
    font-family: 'bebas_neuebold';
    src: url('../fonts/bebasneue_bold-webfont.woff2') format('woff2'),
    url('../fonts/bebasneue_bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'pfdin';
    src: url('../fonts/DINPro-CondensedRegular.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'bebas_neueregular';
    src: url('../fonts/bebasneue_regular-webfont.woff2') format('woff2'),
    url('../fonts/bebasneue_regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'din_probold';
    src: url('../fonts/dinpro_bold-webfont.woff2') format('woff2'),
    url('../fonts/dinpro_bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'din_procond';
    src: url('../fonts/DINPro-CondensedRegular.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'din_promedium';
    src: url('../fonts/dinpro_medium-webfont.woff2') format('woff2'),
    url('../fonts/dinpro_medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

.u {text-transform: uppercase;}

html {font-size:10px;}
td,table,img {padding:0; border:none;border-collapse:collapse;}
body {width:750px; height:100%;overflow: hidden; text-transform:uppercase; background: #112F57 url(../i/bgr.webp) center center no-repeat;background-size: cover;   font-family: 'bebas_neueregular', sans-serif;margin:0; padding:0;font-size:30px;color:#fff;scroll-behavior: smooth;line-height:1.2;}

.b {font-family: 'bebas_neuebold', sans-serif;}
.m {font-family: 'bebas_neueregular', sans-serif;}



.expired {width:100%;height:100%;display: flex;align-items: center;justify-content: center;padding:0 0 100px 0;}
.expired.age {padding:0;}
.expired-w {width:710px;padding:250px 10px 00px 10px;text-align: center;background: no-repeat;background-size: 100% 100%;position: absolute}
.expired-w.age {padding:0px 30px 00px 30px;}
.expired-w.splash {padding:100px 30px 100px 30px;}
.expired-w .icon {position:absolute;left:0;top:-95px;width:100%;text-align: center;}
.expired-caption {font-size:63px;line-height: 1.1}
.expired-text {font-size:44px;margin-top:40px;line-height: 1.3}

.expired-button {margin:100px auto;width:300px}

.expired-text {font-size:44px;margin-top:40px;line-height: 1.3}


.poll-done-button {margin:100px auto;width:300px}
.poll-done {width:100%;height:100%;display: flex;align-items: center;justify-content: center;padding:0 0 100px 0;}
.poll-done-w {width:710px;padding:250px 10px 00px 10px;text-align: center;background: no-repeat;background-size: 100% 100%;position: absolute}
.poll-done-caption {font-size:63px;line-height: 1.1}
.poll-done .p-cloud {transform: translateY(100%)}
.swiper-slide-main.swiper-slide-active .poll-done .p-cloud {transform: translateY(0%)}

td {}
form {margin:0;}
a {color:inherit;text-decoration:none;}
table {border-collapse:collapse;}

* {
    -webkit-text-size-adjust: none;
    -ms-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -webkit-text-size-adjust:none;
    text-size-adjust: none;
}

body {opacity:0;}
body.ready {opacity:1;}

sub,sup {vertical-align:baseline; position:relative;bottom:-4px;}

sup{top:-10px;}

ul, ul li {margin:0;padding:0;list-style:none;}
p,h1,h2,h3,h4,h5 {margin:0;font-weight:normal;box-sizing:border-box;}


body,div,ul,li,img,a,label,td,table,span {box-sizing:border-box;}

textarea.cf {
    width:100%;
    height:555px;
    margin: auto;
    line-height: 1.3;
    padding:24px 24px 24px 24px;

    border-radius: 20px;
    border: 2px solid rgba(255, 255, 255,1 );
    background: rgba(0, 0, 0, 0.2);
    box-sizing: border-box;

    outline: none !important;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    color: #fff;
    font-size:43px;
    display: block;

}
@media (max-height: 1150px) {
    textarea.cf {height:400px;}
}

::placeholder {
    color:rgba(255,255,255,0.6);
    opacity: 1;
    font-size:43px;
    text-align: left;
}



.button {
    padding:0 20px 0 20px;
    box-sizing:border-box;
    height:104px;
    line-height:104px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(90deg, #DAB762 0%, #F6DE97 33.67%, #C89D53 77.67%, #FAE091 100%);

    border: none;
    border-radius: 12px;
    width:100%;
    text-transform:uppercase;
    -webkit-appearance: none;
    outline:none;
    color:#402A1D;

    transition:all .3s linear ;

    position: relative;

    font-size:44px;
    font-family: 'bebas_neuebold', sans-serif;
    text-decoration:none;
    text-align:center;
    cursor:pointer;
    -webkit-tap-highlight-color: transparent;

}








.button.dark {
    background: linear-gradient(94.45deg, rgba(0, 0, 0, 0.45) 15.1%, rgba(0, 0, 0, 0.225) 115.84%);
    color:#fff;
}

.button.sm {height:96px;line-height: 96px;}



.button img {width:48px;height:48px;margin-right:10px;}

.clickable {-webkit-tap-highlight-color: rgba(0, 0, 0, 0);cursor: pointer;  -webkit-user-select: none; /* Safari */

    user-select: none; }
.button.blanque {}



.main {z-index:10;position:fixed;width:750px;margin:auto;height:100%;}


@media only screen and (max-width: 750px) {
    html,body {width:750px;margin: auto;position: relative;height: 100%;}
}

@media only screen and (min-width: 751px) {
    html,body {width:100%;margin: auto;position: relative;height: 100%;}
}


.p-cloud.p-cloud-1 {transition-delay:.3s;}
.p-cloud.p-cloud-2 {transition-delay:0.5s;}
.p-cloud.p-cloud-3 {transition-delay:0.7s;}
.p-cloud.p-cloud-4 {transition-delay:0.9s;}
.p-cloud.p-cloud-5 {transition-delay:1.1s;}
.p-cloud.p-cloud-6 {transition-delay:1.3s;}
.p-cloud.p-cloud-7 {transition-delay:1.5s;}

.cloud-wrapper {overflow:hidden;}

body {position:relative;}
body.desktop {width:100%;background: url(../i/desktop/1.webp) center center no-repeat;background-size: cover;}

html {}
.swiper-container-main {height:100%;position: fixed;left:0;top:0;width: 750px;height:100%;z-index:100;}
.swiper-wrapper {height:auto;height:100%;}
.swiper-slide {}
.swiper-slide-main {overflow: hidden;height:100%;width: 100%;}

.scrolled-page {overflow: auto;height:100%;width: 100%;position: relative;}
.p-cloud {transition:all 0.8s ease}

.y-18 .p-cloud {transform:scale(0);opacity:0;}



body.ready-loader .y-18 .p-cloud {transform:none;opacity:1;}

.cover-media {height:100%;position: fixed;left:0;top:0;width: 750px;height:1500px;z-index:1;transform: scale(1.3);transition: transform .3s linear;}
.cover-media .media {width:750px;height:1500px;object-fit: cover;}
.cover-black {height:100%;position: fixed;left:0;top:0;width: 750px;z-index:101;background: #000;}
body.ready-loader .cover-media {transform: none;}



.swiper-slide-age {display: flex;align-items: center;justify-content: center;}
.y-18 {width:620px;text-align: center;padding:0 0 100px 0;position: relative;z-index: 10;}
.y-18-caption {font-size: 72px;line-height: 1.1;padding: 80px 0 40px 0;transition: all 0.3s linear;opacity:0;transform: scale(0.3)}
.y-18-bttns {width:100%;display: flex;justify-content: center;margin:0px 0 0 0;}
.y-18-bttns .button {width:246px;margin:0 20px;transition:all 0.3s ease 0.4s;opacity:0;transform: translateY(50%);box-shadow: 20px 30px 120px rgba(0, 0, 0, 0.65);}
.y-18-bttns .button.button-2 {transition:all 0.3s linear 0.5s;}
.y-18-legal {text-align:center;letter-spacing: 0.02em;text-transform:none;z-index:100;transition:all 0.3s ease;opacity:0;position:absolute;left:0;bottom:0;width:100%;padding:50px;line-height: 1.4;font-size: 26px;}

.y-18-bg {position:absolute;left:0;top:0;width:100%;height:100%;z-index:1;}
.y-18-bg img {width:100%;height:100%;display: block;object-fit: cover;transition: all .5s ease;opacity:0;}
.confirmed .y-18-bg img {opacity: 1;}

body.ready-loader .y-18-caption {opacity: 1;transform: none;}
body.ready-loader .y-18-legal {opacity: 0.7;}
body.ready-loader .y-18-bttns .button {transform: none;opacity:1;width:240px;}

.swiper-slide-age.confirmed .y-18-caption {transform: scale(1.3);opacity:0;}
.swiper-slide-age.confirmed .y-18-legal {transform: translateY(100%);opacity:0;}
.swiper-slide-age.confirmed .y-18-bttns .button {transform: translateY(50%);opacity: 0;transition-delay: 0s;}


@keyframes pointer2{
    0%{transform:translateX(0%)}
    25%{transform:translateX(20%)}
    75%{transform:translateX(-20%)}
    100%{transform:translateX(0%)}
}


.clickable {-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}




.button:active {transform: scale(1.03)}

.input-field {background:rgba(7,30,77,0.15);border:3px solid rgba(255,255,255,0.15);border-radius:14px;min-height:115px;display:flex;align-items:center;padding:0 80px 0 32px;cursor:pointer;transition:all 0.3s ease;background:right 50px top no-repeat;}


html {}
.swiper-container-main {height:100%;position: fixed;left:0;top:0;width: 750px;height:100%;z-index:100;}
.swiper-wrapper {height:auto;height:100%;}
.swiper-slide {}
.swiper-slide-main {overflow: hidden;height:100%;width: 100%;}

.scrolled-page {overflow: auto;height:100%;width: 100%;position: relative;}
.p-cloud {transition:all 0.8s ease}

.y-18 .p-cloud {transform:scale(0);opacity:0;}


@keyframes pointer2{
    0%{transform:translateX(0%)}
    25%{transform:translateX(20%)}
    75%{transform:translateX(-20%)}
    100%{transform:translateX(0%)}
}

@media (max-height: 1350px) {

}


.splash-horizontal {display:none;width:100%;height:100%;left:0;top:0;position: fixed;z-index:9999;background: url(../i/v/1.webp?13e) center center no-repeat;background-size: cover;}

@media (orientation: landscape) {
    .splash-horizontal {display:block;}
    body {background: #000;}

}

@keyframes pointer2{
    0%{transform:translateX(0px)}
    50%{transform:translateX(20px)}
    100%{transform:translateX(0px)}
}

@keyframes rotate {
    from {
        transform: rotate(-360deg);
    }
}

@keyframes rotate2 {
    from {
        transform: rotate(360deg);
    }
}



.ball {animation: rotate 60s linear infinite;position:absolute;left: -338px;bottom: -226px;width:570px;height:570px;background: url(../i/ball.webp) no-repeat;background-size: contain}







@keyframes arrow{
    0%{transform: translateX(0px);}
    50%{transform: translateX(10px);}
    100%{transform: translateX(0px);}
}






.personal-bubble {position:fixed;right:50px;top:50px;z-index:100;transition: transform 1s ease;}
.personal-bubble.disabled {transform: translateY(-300px)}
.personal-bubble .bttn img {width:42px;height:42px;display: block;}
.personal-bubble .lnk {position:absolute;right:60px;top:-16px;font-size:32px;transition: transform 0.5s ease;transform: translateY(-200px)}
body.bubble .personal-bubble .lnk {transform: none;}
body.bubble .main-header {top:-300px;}
.personal-bubble .lnk a {display: block;width:600px;background: #0E2440;border-radius:40px;padding:20px;text-align: center;}


@keyframes do-levitation {
    0% {
        transform: translatey(0px);
    }
    50% {
        transform: translatey(-20px) rotate(3deg);
    }
    100% {
        transform: translatey(0px);
    }
}



.main-header {position: absolute;left:0;top:0;transition: all 1s ease;z-index:100;}


.club-stage-layer {position:absolute;  position:absolute;transition: all 2s ease;}


.club-stage-layer {}
.club-stage-layer img {display: block;height:auto;}
.club-stage-layer.layer-1 {z-index:10;left:100px;top:770px;}
.club-stage-layer.layer-2 {z-index:20;left: 280px;top: 1590px;}
.club-stage-layer.layer-1 img  {width:830px;height:auto;display: block;}
.club-stage-layer.layer-2 img {width:250px;height:auto;display: block;}



.club-stage-layer.layer-2 img  {}


.club-stage-layer.cloud {transition: all 1s ease;}

.club-stage-layer.layer-1.cloud {transition-duration: 2s}
.club-stage-layer.layer-2.cloud {transition-duration: 2.3s}

.club-stage-layer.layer-1.cloud {top:2000px;}
.club-stage-layer.layer-2.cloud {top:2000px;}

.swiper-slide-stage.stage-8 .club-stage-layer.layer-1.cloud {top:200px;left:30px;}
.swiper-slide-stage.stage-8 .club-stage-layer.layer-2.cloud {top: 390px;left: 200px;transform: scale(1.2);}


.club-note {text-transform:none;letter-spacing: 0.02em;transition:all 1s ease;z-index:100;opacity:0;position:absolute;bottom:20px;width:100%;left:0;color:#fff;font-size:20px;text-align:center;line-height:1.1}

.club-note.active {opacity: 1;}



.hero-stage {width:569px;height:1020px;position:absolute;left:0;bottom:-30px;z-index:100;transition: all 1s ease;transform: translateY(200px)}
.hero-stnd {position: absolute;left:0;top:0;width:100%;height:100%;}
.hero-stnd img {width:100%;height:100%;display: block;}
.hero-icon {position:absolute;z-index:100;left:265px;transition: all 1s ease;transform:translateY(100%);opacity:0;width:290px;}
.hero-icon img {width:100%;height:auto;display: block;}

.swiper-slide-stage.stage-2 .hero-stage {transform:translate(-30px, 50px)}


.swiper-slide-stage.stage-3 .hero-stage {transition: all 2s ease;transform: translate(-100%,50%)}

.hero-icon.icon-1 {top:630px;transition-delay: 0.4s;}
.hero-icon.icon-2 {top:700px;transition-delay: 0.5s;}
.hero-icon.icon-3 {top:770px;transition-delay: 0.6s;}
.hero-icon.icon-4 {top:840px;transition-delay: 0.7s;}

body.blue  .hero-icon.icon-1 {margin-top:0px;}
body.blue  .hero-icon.icon-2 {margin-top:0px;}
body.blue  .hero-icon.icon-3 {margin-top:13px}
body.blue  .hero-icon.icon-4 {margin-top:13px;}

.swiper-slide-stage.stage-2 .hero-icon {opacity: 1;transform: none;}

.hero-text {


    font-family: 'din_procond';
    position:absolute;left:15px;top:-70px;width:430px;z-index: 100;

    font-style: normal;
    font-size: 24px;
    line-height: 100%;
    text-align: center;
    text-transform: uppercase;
    color: #FFFFFF;

}

.main-caption {font-size:44px;line-height: 115%;padding:60px 0 0 40px;}
.p-cloud-wrapper {overflow: hidden;}
.main-caption .p-cloud {transform: translateY(110%);display: flex;align-items: center;}
.main-caption .ico {display: flex;font-size:40px;align-items:center;}
.main-caption .ico .image {width:40px;min-width:40px;margin:0 0px 0 15px;}
.main-caption .ico .image img {width:40px;height:40px;display: block;;}

.main-caption.active .p-cloud {transform: none;}
.main-caption.prev .p-cloud {transform:  translateY(-110%);;}

.main-caption-2 {font-size:30px;line-height: 115%;padding:60px 0 0 40px;position: absolute;left:0;top:0;}
.main-caption-2 .p-cloud {transform: translateY(110%);display: flex;align-items: center;}
.main-caption-2.active .p-cloud {transform: none;}

.main-caption-2 .p-cloud.yellow {

    font-family: 'din_procond';
    font-style: normal;
    font-weight: 700;
    font-size: 72px;
    line-height: 100%;
    /* identical to box height, or 36px */
    text-transform: uppercase;

    background: linear-gradient(90deg, #DAB762 0%, #F6DE97 33.67%, #C89D53 77.67%, #FAE091 100%), #FFFFFF;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;


}
.main-caption-2.prev .p-cloud { transform: translateY(-110%);}


.club-next {position:absolute;right:0px;top:50%;width:152px;height:172px;margin-top:-43px;z-index: 999;display: flex;justify-content: center;align-items: center;transition: opacity 0.3s ease;}
.club-next img {width:72px;height:auto;display: block;animation: arrow 1s linear infinite;}


.club-back {position:absolute;left:0px;margin-top:-43px;top:50%;width:152px;height:172px;z-index: 9999;display: flex;justify-content: center;align-items: center;transition: all 1s ease;}
.club-back.stage {transform: translateX(-200px);}
.club-back img {width:72px;height:auto;display: block;animation: arrow 1s linear infinite;}
.swiper-slide-stage.stage-3 .club-back.stage {transform: translateX(0)}

@keyframes arrow{
    0%{transform: translateX(0px);}
    50%{transform: translateX(10px);}
    100%{transform: translateX(0px);}
}



.sequence-caption {position: absolute;left:40px;top:60px;z-index:100;}
.sequence-caption {
    font-size: 72px;
    line-height: 100%;
    text-transform: uppercase;
    font-family: 'din_procond';
    font-style: normal;
}
.sequence-caption .p-cloud.yellow {

    font-weight: 700;


    background: linear-gradient(90deg, #DAB762 0%, #F6DE97 33.67%, #C89D53 77.67%, #FAE091 100%), #FFFFFF;
    background-clip: border-box, border-box;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
}
.sequence-caption-w {position:absolute;left:0;top:0;white-space: nowrap;}
.sequence-caption-w .p-cloud {transform: translateY(110%)}

.sequence-caption-w.prev .p-cloud {transform: translateY(-110%)}
.sequence-caption-w.active .p-cloud {transform: translateY(0%)}


.kv {position:absolute;right:0;bottom:-2000px;transition: all 2s ease;z-index:100;}
.kv2 {position:absolute;left:0;bottom:-2000px;transition: all 2s ease;z-index:10;}

.swiper-slide-stage.stage-8 .kv {bottom:0;}
.kv img {width:100%;height:auto;display: block;}
.swiper-slide-stage.stage-8 .sequence {transform: translateX(750px)}

.swiper-slide-stage.stage-7 .kv2 {bottom:0;}
.kv2 img {width:100%;height:auto;display: block;}

.swiper-slide-stage.stage-8 .kv2 {bottom:-2000px;}

body.sequenceInAction .club-next {opacity:0.5;}
body.sequenceInAction .club-next img {animation: none;}
body.sequenceInAction .club-back {opacity:0.5;animation: none;}
body.sequenceInAction .club-back img {animation: none;}


.stage-video {width:100%;height:100%;object-fit: cover;object-position:center top;transition: opacity 2s ease 0s;opacity: 0;}
.swiper-slide-active.swiper-slide-main-video .stage-video {opacity: 1;}
.swiper-slide-active.swiper-slide-main-video.stage-8 .stage-video {opacity: 0;}


.club-stage-icon {position:absolute;left:0;top:0;width:100%;height:100%;z-index:1;}
.club-stage-icon img {width:100%;height:100%;display: block;object-fit: cover;object-position:center top;transition: all 1.2s ease;opacity:0;transform:translateY(40px)}
.club-stage-icon.icon-2 img {transition-delay:0.3s;z-index:10;}

.club-stage-icon.active img {opacity:1;transform: none;}
.club-stage-icon.disabled img {transform:translateY(-20px)}