@charset "utf-8";
/* CSS Document */

/* ------- webfonts ------- */

@font-face {
    font-family: 'arial-narrow';
    src: url('fonts/ArialNarrow-Bold.eot');
    src: url('fonts/ArialNarrow-Bold.eot?#iefix') format('embedded-opentype'),
        url('fonts/ArialNarrow-Bold.woff2') format('woff2'),
        url('fonts/ArialNarrow-Bold.woff') format('woff'),
        url('fonts/ArialNarrow-Bold.ttf') format('truetype'),
        url('fonts/ArialNarrow-Bold.svg#ArialNarrow-Bold') format('svg');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* GENERAL */
*{outline:none;margin:0;padding:0;font-family:'arial-narrow';box-sizing:border-box;font-size:inherit;line-height:inherit;color:#FFF;text-transform:uppercase}
body{font-weight:700;-webkit-font-smoothing:antialiased!important;font-smoothing:antialiased!important;overflow-x:hidden;position:relative;margin:20px;background-color:#000;font-size:20px;line-height:22px}
body.scroll-disabled{overflow:hidden!important;overflow-x:hidden;-webkit-overflow-scrolling:touch}

h1,h2,h3,h4,h5{font-weight:400;font-size:inherit}
p{font-size:inherit}

a{cursor:pointer;text-decoration:none;color:inherit;font-size:inherit;display:block}
a:hover{opacity:.7}
li{list-style:none}
img{width:100%;display:block}
svg{width:100%;display:block}

input::-webkit-outer-spin-button, input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
input[type=number]{-moz-appearance:textfield}
::-webkit-input-placeholder{color:rgba(255, 0, 0, 1)}
:-moz-placeholder{color:rgba(255, 0, 0, 1);opacity:1}
::-moz-placeholder{color:rgba(255, 0, 0, 1);opacity:1}
:-ms-input-placeholder{color:rgba(255, 0, 0, 1)}
::-ms-input-placeholder{color:rgba(255, 0, 0, 1)}
input[type="submit"]{border:0;appearance:none;-webkit-appearance:none;border-radius:0}
input[type="submit"]:hover{cursor:pointer;opacity:.7}
input[type="text"], input[type="number"], input[type="email"], input[type="tel"], input[type="password"]{border:none;border-top:1px solid rgba(255, 0, 0, 1);font-size:inherit;line-height:inherit;width:100%;background:transparent;font-weight:inherit;appearance:none;webkit-appearance:none;border-radius:0;padding-top:10px}
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill{background-color:transparent}
input[type="radio"]{display:none}
.radio-wrapper{margin-left:20px}
.radio-wrapper .bullet{width:25px;height:25px;border:1px solid;display:inline-block;border-radius:15px;vertical-align:bottom;margin-left:5px;cursor:pointer}
.radio-wrapper input:checked ~ label .bullet{background-color:#FF0000}

.fs-s{font-size:12px;line-height:14px}
.fs-m{font-size:40px;line-height:44px}
.fs-l{font-size:60px;line-height:60px}
.line-through{text-decoration:line-through}
.underlined{text-decoration:underline}
.display-block{display:block}
.display-inline{display:inline-block}
.ta-left{text-align:left}
.ta-right{text-align:right}
.ta-center{text-align:center}
.color-red{color:#FF0000!important}
.background-red{background-color:#FF0000!important}
.centered{margin:0 auto}
.position-relative{position:relative}
.margin-top-60{margin-top:60px}
.margin-top-40{margin-top:40px}
.margin-top-20{margin-top:20px}
.border-top{border-top:1px solid;padding-top:10px}

/* .btn */
.btn{padding:12px 20px;background-color:#FFF;color:#000;text-align:center;align-content:center}
.btn.full-width{width:100%}

/* columns */
.grid{display:grid;column-gap:20px;row-gap:60px;margin:0 auto;width:100%;grid-template-columns:repeat(2, 1fr)}
.grid > *{grid-column-end:span 2}
.fit-content{height:fit-content}
.align-center{align-content:center}

.grid .c-1{grid-column-end:span 1}
.grid .c-1  > *{grid-column-end:span 1}
.grid .c-2{grid-column-end:span 2}
.grid .c-2  > *{grid-column-end:span 2}
.grid .p-1{grid-column-start:1}
.grid .p-2{grid-column-start:2}

/* .lazy-img */
.thumb{background-color:transparent;position:relative}
.aspect{opacity:0;visibility:hidden}
.lazy{opacity:0;visibility:hidden;transition:opacity .3s ease, transform .3s ease;transform:translateY(10px)}
.lazy.visible{opacity:1;visibility:visible;transform:translateY(0)}
.lazy-img-wrapper{position:relative;overflow:hidden;background-color:var(--color-secondary);transition:background .2s ease}
.lazy-img-wrapper .img{position:absolute;top:0;left:0;bottom:0;width:100%;display:none;background-position:center;background-size:cover;background-repeat:no-repeat}
.lazy-img-wrapper.loaded{background-color:transparent}
.lazy-img-wrapper.loaded .img{display:block}

/* .background */
.background{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:-1}
.background video{position:absolute;min-width:100%;min-height:100%;width:auto;height:auto;top:50%;left:50%;transform:translate(-50%, -50%)}

/* .master-wrapper */
body.visible .master-wrapper{opacity:1}
.master-wrapper{width:100%;position:relative}

header.master{position:fixed;top:20px;left:20px;z-index:10;width:calc(100vw - 40px);height:calc(100vh - 40px);pointer-events:none}
header.master img{position:absolute;width:50px}
header.master img.top{top:0;left:50%;transform:translateX(-50%)}
header.master img.right{top:50%;right:0;transform:translateY(-50%)}
header.master img.bottom{bottom:0;left:50%;transform:translateX(-50%)}
header.master img.left{top:50%;left:0;transform:translateY(-50%)}

section{width:100%;max-width:680px;position:relative;display:block}
section.full-height{min-height:calc(100vh - 40px);padding:120px 0}

main{width:100%;max-width:680px;position:relative;display:block}
main.full-height{min-height:calc(100vh - 40px);padding:120px 0}

section.form ul li{margin-bottom:20px}
section.form > *{display:none}
section.form[data-form=""][data-step=""]{display:none}
section.form:not([data-form=""][data-step=""]){display:grid}
section.form[data-form="form-verification"][data-step="step-verification"] .form-verification{display:block}
section.form[data-form="form-afiliate"][data-step="step-confirmation"] .form-afiliate{display:block}
section.form[data-form="form-evento"][data-step="step-confirmation"] .form-evento{display:block}

@media (max-width: 960px){
    body{font-size:11px;line-height:13px}
    .fs-s{font-size:8px;line-height:10px}
    .fs-m{font-size:16px;line-height:18px}
    .fs-l{font-size:20px;line-height:22px}

    .grid{row-gap:30px}

    header.master{height:calc(100svh - 40px)}
    header.master img{width:20px}

    section{width:calc(100% - 120px)!important}
    section.full-height{min-height:calc(100svh - 40px);padding:80px 0}

    main{width:calc(100% - 120px)!important}
    main.full-height{min-height:calc(100svh - 40px);padding:80px 0}
}