

@font-face {
    font-family: 'winstonbold';
    src: url('../fonts/winston_bold-webfont.woff2') format('woff2'),
    url('../fonts/winston_bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'winstonmedium';
    src: url('../fonts/winston_medium-webfont.woff2') format('woff2'),
    url('../fonts/winston_medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'winstonthin';
    src: url('../fonts/winston_thin-webfont.woff2') format('woff2'),
    url('../fonts/winston_thin-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
.u {text-transform: uppercase;}

* {prefers-color-scheme: light !important; color-scheme: only light !important;}


html {font-size:10px;}
td,table,img {padding:0; border:none;border-collapse:collapse;}
body {width:750px; height:100%;overflow: hidden; background: #fff url(../i/bg.webp) no-repeat;background-size: 100% 100%;   font-family: 'winstonmedium', sans-serif;margin:0; padding:0;font-size:36px;color:#000;scroll-behavior: smooth;line-height:1.2;}

.b {font-family: 'winstonbold', sans-serif;}
.t {font-family: 'winstonthin', sans-serif;}
.m {font-family: 'winstonmedium', sans-serif;}




body.desktop {background:#fff url(../i/desktop.webp) center bottom no-repeat;background-size:cover;}


div.expired {width:100%;height:100%;display: flex;align-items: center;justify-content: center;text-align:left;}
div.expired-w {width:710px;padding:150px 30px 00px 100px;background: no-repeat;background-size: 100% 100%;position: absolute}
div.expired-w.age {padding:0px 0px 00px 60px;}
div.expired-w.splash {padding:100px 30px 100px 40px;}
div.expired-w .icon {position:absolute;left:0;top:-95px;width:100%;}
div.expired-caption {font-size:44px;line-height: 1.2}
div.expired-text {font-size:36px;margin-top:40px;line-height: 1.2}

.expired-button {margin:50px auto;}

.main-done {width:100%;height:100%;display: flex;align-items: center;justify-content: center;}
.main-done-w {width:710px;padding:250px 30px 00px 30px;text-align: center;background: no-repeat;background-size: 100% 100%;position: absolute}

.main-done-caption {font-size:44px;line-height: 1.2;letter-spacing: 0.05em;}
.expired-text {font-size:24px;margin-top:40px;line-height: 1.3}

.main-done-caption .p-cloud {transform:translateY(100%)}
.swiper-slide-main-done.swiper-slide-active  .main-done-caption .p-cloud {transform:translateY(0%)}
.main-done-button {width:460px;margin:100px auto;}
.main-done {}

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;
    /* Safari */
    user-select: 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:710px;
    height:230px;
    margin: auto;
    line-height: 1.3;
    padding:24px 24px 24px 24px;

    border-radius: 15px;
    border: none;
    outline: none;

    background: #fff url(../i/poll/textarea.png) no-repeat;

    background-size: 100% 100%;
    border-radius: 20px;

    box-sizing:border-box;

    text-transform: uppercase;
    font-family: inherit;

    color: #382304;
    font-size:34px;
    display: block;

    -webkit-tap-highlight-color: rgba(0,0,0,0.01);
    filter: brightness(1.01);


}


::placeholder {

    opacity: 1;
    font-size:40px;
    text-align: left;
}




.button {
    padding:0 20px 0 20px;
    box-sizing:border-box;
    height:110px;
    line-height:110px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: url(../i/button.webp) center center no-repeat;
    background-size: 100% 100%;
    border: none;
    border-radius: 0;



    width:100%;
    text-transform:uppercase;
    -webkit-appearance: none;
    outline:none;
    color:#000;

    transition:all .3s linear ;

    position: relative;


    font-size:40px;

    font-family: inherit;
    text-decoration:none;
    text-align:center;
    cursor:pointer;


}

.button.sm {width:420px}




.button img {width:32px;height:32px;margin-left: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%;}

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;}
body.ready-loader .cover-black {animation:cover-black 1s linear;animation-fill-mode:forwards}

@keyframes cover-black{
    0%{opacity: 1;}
    90%{opacity: 0;}
    100%{opacity: 0;}
}


.swiper-slide-age {display: flex;align-items: center;justify-content: center;background:url(../i/bg18.webp) no-repeat;background-size: 100% 100%;}
.y-18 {width:580px;text-align: center;margin:0 0 100px 0;position: relative;z-index:10;}
.y-18-caption {font-size: 44px;line-height: 1.2;padding: 0px 0 80px 0;transition: all 0.3s linear;opacity:0;transform: scale(0.3)}
.y-18-bttns {width:100%;display: flex;justify-content: flex-start;margin:0px 0 0 0;}
.y-18-bttns a {display: block;margin:0 40px 0 0;}
.y-18-bttns .button {width:266px;margin:0 40px 0 0;transition:all 0.3s ease 0.4s;opacity:0;transform: translateY(50%);background-image: url(../i/button18.webp)}
.y-18-bttns .button.button-2 {transition:all 0.3s linear 0.5s;background-image: url(../i/buttonw.webp)}
.y-18-legal {transition:all 0.3s ease;opacity:0;position:absolute;left:0;bottom:50px;width:100%;padding:50px;line-height: 1.4;font-size: 24px;color:#999; font-family: "Roboto", serif;z-index: 10;text-align: center;}

@media (prefers-color-scheme:dark) {
}


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-w {transform: scale(1.3);opacity:0;transition: all 0.5s ease;}
.swiper-slide-age.confirmed .y-18-legal {transform: translateY(100%);opacity:0;}


@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 {overflow: hidden;}
.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.webp?13e) center bottom no-repeat;background-size: cover;}

.swiper-slide-splash {background: url(../i/bg.webp) no-repeat;background-size: 100% 100%}

@media (orientation: landscape) {
    body {width:100% !important;}
    .splash-horizontal {display:block;}

}

@keyframes pointer2{
    0%{transform:translateX(0px)}
    50%{transform:translateX(20px)}
    100%{transform:translateX(0px)}
}




.p-cloud-wrapper  {overflow: hidden;}


.i-caption img {display: block;width:auto;}
.i-caption.x2 img {height:124px;}
.i-caption.x3 img {height:240px;}


.swiper-slide-main-poll {background: #fff url(../i/poll/bg.webp) center top no-repeat;background-size: 100% auto;}

.image-repo {position:fixed;left:0;top:0;width:1px;height:1px;overflow: hidden;opacity:0;}


* {-webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; }
.swiper-container-controls {width:100%;height:100%;position: absolute;left:0;top:0;z-index: 100;}
.swiper-slide-utp {width:430px;height:100%;padding-bottom:100px;display: flex;align-items: flex-end;justify-content: center;}
.swiper-container-sku {width:100%;height:100%;}
.swiper-slide-sku img {width:100%;height:100%;object-fit: cover;}
.swiper-slide-sku {background: #fff;}

.utp-button {transform:scale(0.85);transition: transform 1.5s ease;position:relative;width:430px;height:188px;background: #fff;border-radius:20px}
.utp-wrapper {width:430px;height:188px;position:relative;z-index:10;transform:translateY(-100%);display: flex;padding:24px;align-items: center;color:#382304;font-size:40px;line-height: 1;}
.utp-button .icon {margin:0 40px 0 0;}
.utp-button .caption {}
.utp-button .icon img {width:140px;height:140px;display: block;}

.utp-button .bg {opacity:0;transition: opacity 5s ease}
.utp-button .bg img {display: block;width:100%;height:100%;}
.swiper-slide-utp.swiper-slide-active .utp-button .bg {opacity:1;}
.swiper-slide-utp.swiper-slide-active .utp-button {transform: scale(1)}

.utp-caption {margin:20px 0 0 0;font-size:28px;width:100%;text-transform: uppercase;text-align: center;position:absolute;left:0;bottom:30px;opacity:0;transition: opacity 0.5s ease;}
.swiper-slide-utp.swiper-slide-active .utp-caption  {opacity:1;}
.utp-caption.arrow {display: flex;align-items:center;justify-content: center;width:100%;}
.utp-caption.arrow img {animation:arrow 1s linear infinite;}

@keyframes arrow {
    0%{transform:translateX(10px);}
    50%{transform:translateX(20px);}
    100%{transform:translateX(10px);;}
}

.stage-video {width:100%;height:101%;display: block;object-fit: cover;}

.video-js .vjs-tech {object-fit: cover;}

.intro-button {
    display: flex;
    position:absolute;
    left:0;
    text-transform: uppercase;
    font-size:48px;
    align-items: center;
    padding:90px 80px;
    transition: all 1s ease;
    bottom:-300px;
    color:#000 !important;
}

@media (prefers-color-scheme: dark) {
    .intro-button {color:#000 !important;}
}

.intro-button img {margin:0 20px 0 0;display: block;}

.intro-button.active {bottom:0;}