






@font-face {
    font-family: 'rodeo';
    src: url('../fonts/RODEO.eot');
    src: url('../fonts/RODEO.woff2') format('woff2'),
    url('../fonts/RODEO.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'cricket';
    src: url('../fonts/CRICKETHEAVY.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


html {font-size:10px;}
td,table,img {padding:0; border:none;border-collapse:collapse;}
body {width:750px;    font-family: 'rodeo', sans-serif; margin:0; padding:0; background:#000;font-size:36px;color:#4D3535;scroll-behavior: smooth;}
.r {font-family: 'Roboto Slab', serif;}
td {}
form {margin:0;}
a {color:inherit;text-decoration:none;}
table {border-collapse:collapse;}

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;}
strong {font-weight: normal;}

body,div,ul,li,img,a,label,td,table,span {box-sizing:border-box;}



.cf {
    padding:30px 20px 0 20px;
    box-sizing:border-box;
    display:inline-block;
    height:250px;
    line-height:1;
    background: none;

    width:100%;
    -webkit-appearance: none;
    outline:none;
    color:#fff;

    transition:box-shadow .3s ease ;
    border: 3px solid rgba(255, 255, 255, 0.5);
    border-radius:20px;
    font-size:36px;

    text-decoration:none;

}
::placeholder {
    color:rgba(255, 255, 255, .5);
    opacity: 1; /* Firefox */
}


textarea.cf {
    border-radius: 13px;
    border: 8px solid #FFF;
    background: rgba(255, 255, 255, 0.50);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(9px);
    width:100%;
    color: #4D3535;

    font-family: 'Jost', sans-serif;


}

.button {
    padding:0 20px 0 20px;
    box-sizing:border-box;


    height:95px;

    display: flex;;
    flex-direction: column;
    align-items: center;;
    justify-content: center;

    width:100%;
    text-transform:uppercase;
    -webkit-appearance: none;
    outline:none;
    color:#4D3535;
    filter: drop-shadow(0px 20px 40px rgba(0, 0, 0, 0.2));


    border-radius: 16px;
    border: 6px solid #FFF;
    background: rgba(137, 102, 91, 0.20);
    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);


    transition:all .3s ease ;

    font-size:32px;
    font-family:'Roboto Slab', serif;;
    text-decoration:none;
    text-align:center;
    cursor:pointer;

}

button.button {height:110px;}
button.button small {font-family: Jost;text-transform: none;display: block;line-height:1;font-size: 28px;}
button.button {height:110px;}
a.button {height:110px;}

a.button small {font-family: Jost;text-transform: none;display: block;line-height:1;font-size: 28px;}
.button.white {color:#fff;background: rgba(137, 102, 91, 0.50);backdrop-filter: blur(20px);-webkit-backdrop-filter: blur(20x);}
.button.dark {background: rgba(137, 102, 91, 0.40);}
.button.green {background: rgba(0, 138, 100, 0.60);}

.button.blanque {background: none;border-color:rgba(255, 255, 255, 0.50);color:#fff;}


.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;}


.main {z-index:10;position:fixed;width:790px;margin:auto;height:100%;}


html,body {width:790px;height:100%;overflow:hidden;margin: auto}

body {position:relative;width:100%;height:100%;left:0;bottom:0;padding-bottom: env(safe-area-inset-bottom);;}
body.desktop {width:100%;}

body {}
.swiper-container {height:100%;}

.a-splash {height: calc(var(--vh, 1vh) * 100);}


-bttns .button {margin:0 40px 0 0px;width:230px;}


.p-cloud {transition:all 0.8s ease}

.y-18 .p-cloud {transform:translateY(50px);opacity:0;}



body.ready-loader .y-18 .p-cloud {transform:translateY(0px);opacity:1;}


body.ready-loader .swiper-slide-prev .p-18 .p-cloud {transform:translateY(-50px);opacity:0;transition:transform 0.5s ease,opacity 0.5s ease}

.p-cloud.cloud-1 {transition-delay:0s;}
.p-cloud.cloud-2 {transition-delay:.1s;}
.p-cloud.cloud-3 {transition-delay:.2s;}
.p-cloud.cloud-4 {transition-delay:.3s;}
.p-cloud.cloud-5 {transition-delay:.6s;}
.p-cloud.cloud-6 {transition-delay:.8s;}



@keyframes pointer{
    0%{transform:translateY(0%)}
    50%{transform:translateY(10%)}
    100%{transform:translateY(0%)}
}


@keyframes pulse {
    0%{transform:scale(1)}
    50%{transform:scale(1.2)}
    100%{transform:scale(1)}
}

@keyframes pointer2{
    0%{transform:translateX(0%)}
    50%{transform:translateX(40%)}
    100%{transform:translateX(0%)}
}






@media (max-height: 1250px) {

    .a-intro-image img {max-height: 700px}

}

.a-bttn-vote {position: absolute;bottom:74px;left:0;width: 100%;padding:0 70px}
.a-bttn-vote .button {width:610px;margin:auto;display:block;}

.vote {}

.expired {font-family:'Roboto Slab', serif;;position:absolute;left:0;top:0;width: 100%;height:100%;display: flex;align-items: center;justify-content: center;text-align:center;text-transform: uppercase;}

.expired-image img {width:211px;height:auto;}
.expired-caption {font-size:80px;line-height: 1.25;}
.expired-caption-2 {font-size:40px;line-height: 1.25;margin-top:20px;}
body.expired.desktop {background: #000;}
.expired-desktop.expired .expired-caption {font-size:36px;}
.expired {background: #FAF5EF;background-size:100% 100%;}
.expired-desktop {background: #FAF5EF url(../i/za.webp) center center no-repeat; background-size: cover;}
body.desktop {position: inherit}
body.expired {position: inherit}


.main {background:#000 }

.swiper-slide-age {background: #FAF5EF url(../i/18.webp) center center no-repeat; background-size: cover;justify-content: center;align-items: center;display: flex;}
.swiper-slide-splash {background: #FAF5EF url(../i/18.webp) center center no-repeat; background-size: cover;}
.swiper-slide-splash.expired {background: #FAF5EF url(../i/18.webp) center center no-repeat; background-size: cover;}


.main-age {text-transform: uppercase;}
.main-age strong {font-weight: normal;}
.logo {position:absolute;left:46px;top:36px;}

.y-18 {text-align: center;}
.y-18 .caption {font-family: 'Roboto Slab', serif;;font-size:42px;line-height:1.25;text-transform: uppercase;}

.y-18 .buttons {padding:48px 0 0 00px;width: 100%;display: flex;justify-content: center;}
.y-18 .buttons .button {width:288px;margin:0 20px 0px 20px;}

.y-18-legal {text-transform: none;line-height: 1.25;text-align: center;padding:0px 00px 60px 0px;}

.splash-w .caption  {line-height: 1.25;font-family: 'Roboto Slab', serif;;font-size: 42px;margin-bottom:30px;}
.splash-w .caption-2  { font-family: 'Jost', sans-serif; text-transform:none;margin-top:10px;line-height: 1.25;text-align: center;}
.splash-w span {;}

.swiper-slide-splash {display: flex;justify-content: center;align-items: center;text-align: center;}
.splash-w .button {width:600px;margin:50px auto;}
.splash-w img {}

body.splash {background: url(../i/splash.png) center center no-repeat;background-size: cover;position: relative;}
.h-card {position:absolute;left:50%;top:50%;width:600px;height:800px;margin:-400px 0 0 -300px;border-radius: 40px;background: #FFF;
    background: rgba(255, 255, 255, 0.40);
    backdrop-filter: blur(17px);
    -webkit-backdrop-filter: blur(17px);;
    border: 2px solid rgba(255, 255, 255, 0.40);
    transition: transform .5s ease, opacity 1s ease;
    transform:translateY(1400px);
    opacity:1;

    display: flex;
    align-items: center;
    z-index: 60;

    justify-content: center;
    box-shadow: -1px 0px 168px 150px rgba(0, 0, 0, 0.31)
}
.h-card.active  {transform:translateY(0px);opacity:1;}
.h-card-close {position: absolute;right:0;top:0;width:120px;height:120px;display: flex;align-items: center;justify-content: center;}
.h-card-wrapper {padding:0px 0px 0 0px;text-align: center;font-size: 36px;}
.h-card-caption {font-family: 'cricket';font-size: 100px;color:rgba(255,255,255,0);-webkit-text-stroke: 2px #000000;text-stroke: 2px #000000;}
.h-card p {margin:0 0 8px 0;line-height: 120%;}

.h-card-image-top {position:absolute;}
.h-card-image-bottom {position:absolute;}

.h-card-image-bottom.image-1 {bottom:-11px;right:-2px;}
.h-card-image-top.image-1 {top:-230px;left:-50px;}

.h-card-image-bottom.image-2 {bottom:-11px;right:0px;}
.h-card-image-bottom.image-2 img {border-radius: 0 0 40px 0}
.h-card-image-top.image-2 {top:-100px;left:-50px;}

.h-card-image-bottom.image-3 {bottom:-10px;right:0px;}
.h-card-image-bottom.image-3 img {border-radius: 0 0 40px 0}
.h-card-image-top.image-3 {top:-190px;left:-50px;}

.h-card-image-bottom.image-4 {bottom:-107px;left:-70px;}
.h-card-image-top.image-4 {top:-100px;left:40px;}

.h-card-image-bottom.image-5 {bottom:-100px;right:20px;}
.h-card-image-top.image-5 {top:-150px;left:-50px;}

.h-card-image-bottom.image-6 {bottom: -80px;left: 40px;;}
.h-card-image-top.image-6 {top:0px;left:-00px;}
.h-card-image-top.image-6 img {border-radius: 40px 0 40px 0}

.h-card-image-bottom.image-7 {bottom:-10px;right:0px;}
.h-card-image-bottom.image-7 img {border-radius: 40px 0 40px 0}
.h-card-image-top.image-7 {top:-150px;left:-30px;}

.h-bullets {height:1274px;width:82px;position:absolute;z-index:60;right:12px;top:50%;margin:-637px 0 0 0;background: url(../i/bullets/bg.png) center center no-repeat;display: flex;flex-direction: column;justify-content: center;transition: all 2s ease 2s;}
.h-bullets.disabled {opacity: 0;transform: translateY(1500px)}
.h-bullet {width:82px;height:82px;border-radius: 100%;border:10px solid rgba(243,239,231,0.4);display: flex;justify-content: center;align-items: center;margin: 30px 0;transition: all 1s ease;opacity: 0.5;}
.h-bullet.active {opacity: 1;}
.h-bullet.scaled {transform: scale(1.5)}
.h-bullet img {width:62px;height:62px;background: #fff;object-fit:scale-down;border-radius: 100%;}

.logo {position: absolute;top:30px;left:0;width:100%;text-align: center;z-index: 100;}
.logo img {width:220px;height:auto;}
.logo.disabled {display: none;}

.home-button {position: absolute;top:30px;left:0;width:100%;z-index: 100;cursor:pointer;}
.home-button.disabled {display: none;}
.swiper-slide-home {background: url(../i/splash.webp) center center no-repeat;background-size: cover}
.swiper-slide-sku {background: url(../i/skubg.webp) center top no-repeat;background-size: cover;padding:180px 0 0 0;}
.swiper-slide-poll {background: url(../i/skubg.webp) center top no-repeat;background-size: cover;padding:200px 0 0 0;display: flex;align-items: center;justify-content: center;}
.home-intro {width:100%;height:100%;padding:190px 0 0 0;background: url(../i/bghome.webp) no-repeat;background-size: 100% 100%;      backdrop-filter: blur(3px);-webkit-backdrop-filter: blur(3px);}
.sku-intro {width:100%;height:100%;}

.road-page-blind {position: absolute;left:0;top:0;z-index:30;background: #000;width: 100%;height: 100%;display: none;}

.poll-field {border-radius: 40px;
    border: 2px solid rgba(255, 255, 255, 0.40);
    background: rgba(255, 255, 255, 0.60);
    backdrop-filter: blur(40px);
    width:700px;height:730px;
    -webkit-backdrop-filter: blur(40px);
    display: flex;align-items: center;
    justify-content: center;;
    padding:0 50px;
    text-align:center;
    transition: all 1s ease;
    transform: translateY(1000px);
}

.swiper-slide-main.swiper-slide-active .poll-field {transform: translateY(0);}
.swiper-slide-main.swiper-slide-prev .poll-field {transform: translateY(-1000px);}

.poll-caption {margin:0 0 50px 0;}
.poll-caption-2 {margin:-20px 0 50px 0;}
.poll-field-w {width:100%;}
.poll-buttons {margin:40px 0 0 0;}
.poll-button {margin:20px 0 0 0;}

.vote-button.active {transform:scale(1.12);}
.vote-button.disabled {transform:scale(0);}

.poll-buttons-next {margin:20px 0 0 0;transition: all 0.3s ease;}
.poll-buttons-next.disabled {transform:translateY(200px);opacity:0;}

.vote-stars-v2 {width:100%;display: flex;justify-content:center;position: relative;z-index: 100;margin:0 0 100px 0}
.vote-star-v2 {width:96px;height:80px;margin:0 10px;background: url(../i/count2.png) left center no-repeat;background-size: auto 80px;display: flex;align-items:center;justify-content: center;color: #007DEF;font-size: 32px;}
.vote-star-v2.active {opacity:1;transition: opacity .3s ease;background-image: url(../i/count.png);color:#fff;}

.cover-bg.cover-bg-stars {background: url(../i/c2.webp) no-repeat;background-size: 98% 100%;transition: all 1s ease;transform: scale(0,1)}


.vote-star-v2 {opacity:0;transition:opacity .3s ease;}
.vote-star-v2.star-1 {transition-delay: .7s;}
.vote-star-v2.star-2 {transition-delay: .6s;}
.vote-star-v2.star-3 {transition-delay: .5s;}
.vote-star-v2.star-4 {transition-delay: .6s;}
.vote-star-v2.star-5 {transition-delay: .7s;}


@keyframes star-bounse{
    0%{transform:translateX(0%) scale(1);}
    50%{transform:translateX(-0px)  scale(1.05,1)}
    100% {transform:translateX(0%)}
}
.swiper-slide-poll.swiper-slide-active .vote-star-v2 {opacity:1;}

.home-intro-caption {text-align: center;font-size: 40px;line-height: 120%;}
.sku-intro-caption {text-align: center;font-size: 32px;line-height: 120%;text-transform: uppercase;}



.two .swiper-slide {width: 320px;padding:100px 0 0 0;}
.two .swiper-slide img {width: 100%;}
.two .slider-image {transition: all .3s ease;transform-origin: center bottom}


.two .swiper-slide.swiper-slide-active {position: relative;z-index: 100;}
.two .swiper-slide.swiper-slide-prev .slider-image {transform: translate(140px,-50px) scale(0.8);}
.two .swiper-slide.swiper-slide-next .slider-image {transform: translate(-140px,-40px) scale(0.83);}
.two .swiper-slide.swiper-slide-active .slider-image {transform: translateX(33px) scale(1.1);}

.home-intro-buttons {padding:0px 90px 0 90px}
.home-intro-button {margin:10px 0;}

.slider-button {position: absolute;z-index: 120;top:360px;}
.slider-button-next {right:-20px;}
.slider-button-prev {left:-20px;}
.slider-button-sku-prev {top:200px;left:-60px;}
.slider-button-sku-next {top:200px;right:-60px}

.slider-image-sku {text-align: center;}
.slider-image-sku img {height:380px;width:auto;}
.swiper-container-sku .caption {text-align: center;font-size: 24px;text-transform: uppercase;color: #4D3535;}
.swiper-container-sku {width:100%;margin: auto;}
.swiper-container-sku .swiper-slide {display: flex;width:100%;justify-content: center;align-items: flex-end;}
.sku-slide {padding: 0 20px;}
.sku-slide img {width:240px;height:auto; }

.sku-icons {padding:40px 60px 20px 60px;}
.sku-icon {display: flex;width:100%;align-items: center;line-height: 120%; font-size:28px;text-transform: uppercase;}
.sku-icon .icon {height:100px;width:280px;display: flex;align-items: center;justify-content: center;}

.swiper-slide-road {display: flex;background: #fff;}
.swiper-slide-road .button.white {background:rgb(137, 102, 91);;}

.swiper-slide-main.swiper-slide-road .logo {z-index:5;}

.swiper-container-vertical {width:100%;height:100%;position:relative;z-index:40;}
.swiper-container-vertical  .swiper-slide {position: relative;}
.road-page {position:absolute;left:0;bottom:0;width:100%;color:#fff;text-align: center;min-height:290px;font-size:44px;line-height: 120%;;display: flex;justify-content: center;align-items: center;text-transform: uppercase;}

 .road-page-after {    background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, #220F0F 100%);height:500px;width:100%;display: block;content:'';position: absolute;left:bottom;bottom:0;z-index: 1;border:10px solid red;}
.road-caption {transition: all 1.4s ease 0s;transform:translateY(500px);opacity:0;position: relative;z-index: 10;}
.road-caption.road-caption-first {transition: all 1.4s ease 0s;}

.road-page-last {display: block;padding:0 90px 40px 90px;}
.road-page-last .road-caption {margin:0 0 40px 0;}

body.card-mode .swiper-container-vertical .swiper-slide-active  .road-page {transition: all .4s ease 0s;transform:translateY(500px);}

.road-bttn {transition: all 2.4s ease 1s;transform:translateY(500px);}

.swiper-slide {}
.swiper-container-vertical  .swiper-slide-active .road-caption.active {transform: translateY(0px);opacity: 1;}
.swiper-container-vertical  .swiper-slide-active .road-bttn {transform: translateY(0px);opacity: 1;}
.swiper-container-vertical  .swiper-slide-prev .road-caption {transform: translateY(0px);opacity:0;transition: opacity 0.2s ease;}

.card-button {position:absolute;right: 100px;
    top: 700px;
    height: 200px;
    width: 200px;display: flex;align-items: center;justify-content: center;opacity: 1;transition: opacity 1s ease 0s, transform .2s ease 0s}
.card-button img {animation: pulse 1s linear infinite}
.card-button.first {transition: all 1s ease 0s , transform .2s ease 0s}
.card-button {opacity:0;}
.swiper-container-vertical  .swiper-slide-active .card-button.active {opacity:1}
.card-button.focus {transform: scale(2)}


.card-button.button-1 {}
.card-button.button-2 {}
.card-button.button-3 {}
.card-button.button-4 {}
.card-button.button-5 {}
.card-button.button-6 {}

.sequence.active {}
.sequence.sequence-1 {display: block;width:100%;height:100%;position: absolute;left:0;top:0;z-index:15;transform-origin: center bottom;}


.sequence.active {}
.stage-image {width:100%;height:100%;position: absolute;left:0;bottom:0;opacity:0;;}
.stage-image.active {opacity:1;}
.sequence.sequence-1 .stage-image img {display: block;width:100%;height:100%;object-fit: cover;object-position: center bottom;transition: object-position 1s ease}
.sequence.started .stage-image img {object-position: center center;}


.road-intro  {position:absolute;left:0;top:300px;text-align: center;font-family: Jost;width:100%;z-index: 100;}
.road-intro.disabled {z-index:5;}
.road-intro .caption {font-family: Jost;font-size:36px;line-height: 130%;margin-bottom:20px;}
.road-intro .caption-2 {;font-size:40px;line-height: 130%;;text-transform: uppercase;margin-bottom:60px;}

.road-ptr {position:absolute;left:50%;bottom:00px;z-index:100;transform: translateY(600px);transition: transform 1s ease;margin-left:-115px;}
body.card-mode .road-ptr {transform: none;}


