.hero{align-items:flex-end;background-image:url(/img/hero.jpg);background-position:bottom;background-position-x:center;background-position-y:70%;background-size:cover;display:flex;font-size:2.5em;justify-content:center;min-height:30%;overflow:hidden;padding:0 50px}.hero,.hero a{text-align:center}.hero a{background-color:var(--color);border:2px solid var(--color-d1);border-radius:5px;box-shadow:0 5px 10px #0003;color:#fff;margin-bottom:10%;max-width:calc(100% - 50px);padding:15px 25px;position:relative;transition:background-color .3s}.hero a:hover{background-color:var(--color-b1)}.hero a:before{animation:poke 1s ease-in-out infinite alternate;background-image:url(/img/pointer.png);background-position:50%;background-repeat:no-repeat;background-size:contain;bottom:0;content:"";height:75px;left:0;position:absolute;width:75px}@keyframes poke{0%{transform:rotate(45deg) translateY(60px)}to{transform:rotate(45deg) translateY(80px)}}.steps{display:flex;flex-direction:column;gap:50px;padding:10px 25px;text-align:center}h1{font-size:2em;font-weight:700}.steps>div{display:flex;gap:25px;justify-content:space-around}.step{display:flex;flex:1 1 0;flex-direction:column;max-width:350px;opacity:0}.anim .step:first-child{animation:slide 1s forwards}.anim .step:nth-child(2){animation:slide 1s .2s forwards}.anim .step:nth-child(3){animation:slide 1s .4s forwards}@keyframes slide{0%{opacity:0;transform:translateY(25%)}to{opacity:1;transform:translateY(0)}}.step i{color:var(--color);font-size:5em}.step span{background-color:var(--color);border-radius:50%;color:#fff;display:inline-block;font-size:.9em;font-weight:400;height:1.4em;width:1.4em}.step h3{font-size:1.5em}.step p{color:#555;font-size:.9em;margin-top:5px}.divider{background-color:#ddd;height:1px;margin:0 auto;width:calc(100% - 150px)}.premios{display:flex;flex-direction:column;gap:25px;padding:15px 0;text-align:center}.premios h1{margin:0 25px}.premios>div{display:flex;gap:25px;overflow:hidden;padding:5px;text-align:left}.twofa-authentication input.totp-check{font-size:4em;text-align:center}.premios .premio{flex-shrink:0}@media (max-width:500px){.hero{font-size:1em}.steps>div{flex-direction:column}.step{max-width:unset}}@media (max-aspect-ratio:16/9){.hero{align-items:flex-start}.hero a{margin-bottom:0;margin-top:10%}}@media (min-width:500px) and (max-width:730px){.hero{font-size:1em!important}}
