
@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_promedium';
    src: url('../fonts/dinpro_medium-webfont.woff2') format('woff2'),
    url('../fonts/dinpro_medium-webfont.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;

}

.u {text-transform: uppercase;}

* {user-select: none;}

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: linear-gradient(202.34deg, #BFAE97 -59.61%, #E8E0C8 36.95%, #A19687 111.14%), #FFFFFF;;background-size: cover;   font-family: 'din_promedium', sans-serif;margin:0; padding:0;font-size:30px;color:#fff;scroll-behavior: smooth;line-height:1.2;}

.b {font-family: 'din_probold', sans-serif;}
.m {font-family: 'din_promedium', sans-serif;}

.l-caption {
    background: linear-gradient(180deg, #BA121B -87.12%, #66000A 215.15%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    display: inline-block;
}

.expired {width:100%;height:100%;display: flex;align-items: center;justify-content: center;padding:0 0 0px 0;}
.expired.age {padding:0;}
.expired-w {width:720px;height:440px;position:relative;padding:00px 10px 40px 10px;display: flex;align-items: center;justify-content: center;text-align: center;background:url(../i/frame.webp) center center no-repeat;  ;background-size: 100% 100%;}
.expired-w.age {padding:0px 30px 00px 30px;}
.expired.splash {padding:100px 30px 250px 30px;}
.expired-caption {font-size:40px;line-height: 1.3;
    text-align: center;
    letter-spacing: -0.02em;
    text-transform: uppercase;


}
.expired-text {font-size:28px;margin-top:40px;line-height: 1.3;color:#BA121B;}

.expired-button {margin:100px auto;width:300px}


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,video {box-sizing:border-box;}

textarea.cf {
    width:100%;
    height:355px;
    margin: auto;
    line-height: 1.3;
    padding:24px 24px 24px 24px;
    font-family: 'din_promedium', sans-serif;

    border: none;
    background: url(../i/textarea.png) no-repeat;
    background-size: 100% 100%;
    box-sizing: border-box;
    outline: none !important;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    color: #BA121B;
    font-size:36px;
    display: block;

}
@media (max-height: 1150px) {
    textarea.cf {height:400px;}
}

::placeholder {
    color: #BA121B;
    opacity: 1;
    font-size:36px;
    text-align: left;
}



.button {
    padding:0;
    box-sizing:border-box;
    height:110px;
    line-height:110px;
    display: flex;
    justify-content: center;
    align-items: center;


    font-family: 'din_probold', sans-serif;
    border: none;

    width:100%;


    background: linear-gradient(90deg, #C40002 0%, #91202F 100%);
    text-transform: uppercase;

    transition:all .3s linear ;

    position: relative;

    font-size:32px;

    text-decoration:none;
    text-align:center;
    cursor:pointer;
    -webkit-tap-highlight-color: transparent;

}

.button.white {
    background: #fff;
}

.button.red .text {

    background: linear-gradient(90deg, #CAAA74 0%, #FFFFFF 40.5%, #FFEEC3 40.51%, #DBAA60 70%, #F4D9A3 70.01%), #FFFFFF;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;


}

.button.white .text {
    color:#A90E11;
    background: none;

}



.button.sm {height:96px;line-height: 96px;}



.button img {width:40px;height:44px;margin:0 15px;}

.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.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;}

@keyframes cover-black{
    0%{opacity: 1;}
    90%{opacity: 0;}
    100%{opacity: 0;}
}


.swiper-slide-age {display: flex;align-items: center;justify-content: center;}
.y-18 {text-align: center;padding:0 0 50px 0}
.y-18-caption {font-size: 60px;line-height: 1.1;transition: all 0.3s linear;opacity:0;transform: scale(0.3);
    width:720px;height:380px;
    padding:0 0 40px 0;
    background: url(../i/frame.webp) no-repeat;background-size:100% 100%;
    display: flex;align-items: center;justify-content: center;
}

.y-18-caption {}
.y-18-bttns {width:100%;display:block; margin:0px 0 0 0;}
.y-18-bttns .button {width:480px;margin:20px auto;transition:all 0.3s ease 0.4s;opacity:0;transform: translateY(50%);}
.y-18-bttns .button.button-2 {transition:all 0.3s linear 0.5s;}
.y-18-legal {color:#AB192C;font-weight:500;text-transform:none;z-index:100;transition:all 0.3s ease;opacity:0;width:100%;padding:20px 0 60px 0;line-height: 1.2;font-size: 28px;}

.metrika {color:#AB192C;font-weight:500;text-transform:none;z-index:100;transition:all 0.3s ease;width:100%;padding:20px 0 20px 0;line-height: 1.3;font-size: 24px;
    background: linear-gradient(180deg, rgba(186, 18, 27, 0.5) -87.12%, rgba(102, 0, 10, 0.5) 215.15%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    display: inline-block;
    width:100%;position:absolute;left:0;bottom:50px;
}

.expired .bttn {position:absolute;left:0;bottom:-150px;width:100%;transform: translateY(100%);opacity:0;transition: all 1s ease;}
.swiper-slide-active .expired .bttn {opacity:1;transform:none;}
.expired .bttn .button {width:480px;margin:auto;}
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;}

.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;}





.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;}




@media (max-height: 1350px) {

}


.splash-horizontal {display:none;width:100%;height:100%;left:0;top:0;position: fixed;z-index:9999;background: url(../i/vertical.webp?13e) center center no-repeat;background-size: cover;}

@media (orientation: landscape) and (max-width: 750px) {
    .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);
    }
}









.swiper-slide-main-poll {}

.swiper-slide-poll {padding:120px 0 0 0;background: linear-gradient(202.34deg, #BFAE97 -59.61%, #E8E0C8 36.95%, #A19687 111.14%), #FFFFFF;;background-size: cover;}


.swiper-container-poll {position:relative;width:100%;height:100%;z-index:100;}
.poll-caption {
    text-align: center;
    font-size:38px;
    line-height:1.3;
    margin:auto auto 40px auto;
    width:720px;
    height:400px;
    position:relative;
    padding:00px 10px 30px 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background:url(../i/frame.webp) center center no-repeat;
    background-size: 100% 100%;
}


.poll-caption span {
    background: linear-gradient(180deg, #BA121B -87.12%, #66000A 215.15%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
}

.poll-index {width:480px;margin:auto;}
.poll-index .button {margin:20px auto;width: 480px;}

.poll-wrapper {padding:0 46px;}

.poll-form-item {width:100%;}
.vote-button {
    position:relative;
    display: flex;
    height:96px;
    line-height:96px;
    background: url(../i/vb.png) no-repeat;
    background-size: 100% 100%;
    font-size: 28px;
    text-transform: uppercase;
    margin:15px 0;
    padding:0 0 0 86px;
    transition: all 0.5s ease;
    align-items: center;



}

.vote-button span {
    background: linear-gradient(90deg, #C40002 0%, #91202F 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    white-space: nowrap;
    display: block;
    overflow: hidden;
}

.vote-button.select-button span {width:500px;}

.vote-button select.cf {position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;z-index:10;}
.vote-button.text-button {font-size:32px;}
.vote-button.select-button {font-size:32px;}
.vote-button.text-button input.cf {
    position: absolute;
    right:0;
    top:0;
    height:100%;
    line-height: 100%;
    padding:0 0 0 330px;
    display: block;
    box-sizing: border-box;
    width:100%;
    background: none;
    font-family: 'din_promedium', sans-serif;
    outline: none !important;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    font-size:32px;
    text-transform: uppercase;
    border:none;

    background: linear-gradient(90deg, #CAAA74 0%, #FFFFFF 40.5%, #FFEEC3 40.51%, #DBAA60 70%, #F4D9A3 70.01%), #FFFFFF;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;

}

.poll-bttn {position:absolute;left:0;bottom:0;width:100%;padding:0 45px 70px 45px;transition: all 1s ease;}
.poll-bttn.disabled {opacity:0.1;transform:translateY(20px);}
.poll-bttn .button {width:350px;margin: auto;}

.vote-button:before {
    width:40px;
    height:40px;
    background: url(../i/votebuttondisabled.png) no-repeat;
    background-size: 100% 100%;
    border-radius:100%;
    display: block;;
    content:'';
    transition: all 0.5s ease;
    position:absolute;
    left:27px;
    top:31px;

}

.vote-button.select-button:after {
    width:40px;
    height:40px;
    background: url(../i/selectdisabled.png) no-repeat;
    background-size: 100% 100%;
    border-radius:100%;
    display: block;;
    content:'';
    transition: all 0.5s ease;
    position:absolute;
    right:27px;
    top:31px;
}

.vote-button .button.red img {width:40px;height:40px;}

.vote-button.active {background: linear-gradient(90deg, #C40002 0%, #91202F 100%);transform:none;}
.vote-button.active:before {background-image: url(../i/votebuttonactive.png)}
.vote-button.active.select-button:after {background-image: url(../i/selectactive.png)}
.vote-button.active span {
    background: linear-gradient(90deg, #CAAA74 0%, #FFFFFF 40.5%, #FFEEC3 40.51%, #DBAA60 70%, #F4D9A3 70.01%), linear-gradient(123.23deg, #CAAA74 -1.26%, #FFFFFF 41%, #FFEEC3 41.01%, #DBAA60 71.78%, #F4D9A3 103.08%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
}



@keyframes arrow{
    0%{transform: translateX(0px);}
    50%{transform: translateX(10px);}
    100%{transform: translateX(0px);}
}


.poll-done {width:100%;height:100%;padding:120px 0 0px 0;}
.poll-done .bttn {position:absolute;left:0;bottom:-150px;width:100%;opacity:0;transition: all 1s ease;z-index:-100;}
.poll-done .bttn .button {width:480px;margin:auto;}
.swiper-slide-active .poll-done .bttn {opacity:1;transform:none;z-index:100;}
.expired.age {padding:0;}
.poll-done-w {width:720px;height:400px;position:relative;padding:00px 10px 40px 10px;display: flex;align-items: center;justify-content: center;text-align: center;background:url(../i/frame.webp) center center no-repeat;  ;background-size: 100% 100%;margin: auto;}

.poll-done-caption {font-size:38px;line-height: 1.3;
    text-align: center;
    letter-spacing: -0.02em;
    text-transform: uppercase;


}

.poll-done-button {margin:100px auto;width:300px}




.personal-bubble {font-family: 'bebas_neueregular';position:fixed;left:50px;top:50px;z-index:9999;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;left:60px;top:-9px;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;
    height:61px;
    line-height:61px;
    text-align: center;
    background: linear-gradient(180deg, #BA121B -87.12%, #66000A 215.15%), #C5BEAA;
    border-radius: 237.26px;
    font-size:32px;
    text-transform: uppercase;
}

.personal-bubble .lnk a span {
    display:inline-block;
    letter-spacing: 0.02em;

    background: linear-gradient(90deg, #CAAA74 0%, #FFFFFF 40.5%, #FFEEC3 40.51%, #DBAA60 70%, #F4D9A3 70.01%), #890811;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
}




.stage-video {width:100%;height:100%;z-index:10;display:block;object-fit:cover;object-position:center center;transition: opacity 2s ease 0.5s;opacity: 0;}
.swiper-slide-active.swiper-slide-main-video .stage-video {opacity: 1;}

.main-header {position:absolute;left:0;top:50px;width:100%;z-index:100;text-align:center;transition: all 1s ease;}
.main-header.disabled {transform:translateX(-100%)}
.swiper-container-header {width:100%}

.main-header .cloud {
    display: inline-block;
    width:100%;
    font-size:50px;
    line-height: 130%;
    text-align: center;
    letter-spacing: -0.04em;
    text-transform: uppercase;
    transition: transform 1s ease;

    background: linear-gradient(180deg, #BA121B -87.12%, #66000A 215.15%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    transform:translateX(100%);
}

.main-header .cloud.cloud-2 {transition-delay: .1s;}

.main-header.stage-1 .cloud  {transform: none;}

.swiper-slide-header {overflow: hidden;}

.main-header.stage-1  .swiper-slide-header.swiper-slide-prev .cloud {transform:translateX(-100%);}
.main-header.stage-1  .swiper-slide-header.swiper-slide-next .cloud {transform:translateX(100%);}

.swiper-slide-main-video {width:100%;height:100%;position:relative;background: linear-gradient(202.34deg, #BFAE97 -59.61%, #E8E0C8 36.95%, #A19687 111.14%);}

.v-progress-button {position:absolute;left:0;bottom:0;padding:50px;z-index:100;width: 100%;transition: all 1s ease;}
.v-progress-button.disabled {transform:translateY(100%)}
.v-progress-button .button {width:408px;margin:auto;}

.p-progress-button {position:absolute;left:0;bottom:0;padding:50px;z-index:100;width: 100%;transition: all 1s ease;}
.p-progress-button.disabled {transform:translateY(100%)}
.p-progress-button .button {width:408px;margin:auto;}

.sequence-stage {width:100%;height:100%;left:0;top:0;position: absolute;z-index: 15;opacity: 0;}
.sequence-stage.active {opacity:1;}
.sequence-stage img {width:100%;height:100%;display: block;object-fit:cover;}

.sequence.sequence-1 {transition: opacity 0.3s ease;display: block;width:100%;height:100%;position: absolute;left:0;top:0;opacity: 0;z-index:10;}
.sequence.sequence-1.active {opacity:1;}

.sequence.active {opacity:0;transition: opacity .3s ease}
.stage-image {width:100%;height:100%;position: absolute;left:0;top:0;opacity:0;}
.stage-image.active {opacity:1;}
.sequence.sequence-1 .stage-image img {object-fit:cover;display: block;width:100%;height:100%;}


.s-progress-button {position:absolute;left:0;bottom:0;width:100%;height:100%;transition: transform 1s ease;z-index:100;}
.s-progress-button.disabled {transform: translateX(-100%)}
.the-hand {position:absolute;left:50px;bottom:50px;}
.the-hand img {width:60px;height:auto;display: block;animation:pointer2 1s linear infinite}

.p-progress-cost {color:#fff;font-size:28px;text-align: center;margin-bottom:50px;text-transform: none;}