@media (max-width:1200px) {
  .section-register .box-image.warning {
    display: none;
  }
}

@media (max-width: 992px) {
  .bg-atun p {
    font-size: 1.2rem;
  }
}

@media (max-width: 768px) {

  /**Header**/
  .openAsideMenu {
    display: none;
  }

  .openAsideMenuMobile {
    display: block;
  }

  .logo-header img {
    max-width: 150px;
  }

  #offcanvasMobile .navbar-nav {
    align-items: start;
    padding-inline-start: 2rem;
  }

    #offcanvasMobile .navbar-nav .nav-item a {
      font-size: 1.8rem;
    }

  .right-header .show-login {
    display: none;
  }

  .right-header .help-btn {
    display: none;
  }

  /**Validate age**/
  .valid-age-wrap .valid-age-content .valida-header p {
    font-size: 2rem;
  }

  .valid-age-wrap .valid-age-content p {
    font-size: 4rem;
  }
  /**Home**/
  .banner {
    .button-participa

{
  font-size: 1rem;
  padding: 4px 24px;
}

.box-image.warning {
  right: 2%;
  top: 2%
}

  .box-image.warning img {
    max-width: 100px;
  }

.background-image img {
  height: 90dvh;
}


.wrapper-steps{
  flex-wrap:wrap;
}
.wrapper-steps .box-step {
  flex: 1 1 100%;
  /* En pantallas pequeñas, 1 elemento por fila */
}

  .wrapper-steps .box-step:first-of-type {
    border: none;
  }

    .wrapper-steps .box-step:first-of-type img {
      border-bottom: 2px dashed var(--color-green-main);
    }

  .wrapper-steps .box-step:nth-child(2) {
    border: none;
  }

    .wrapper-steps .box-step:nth-child(2) img {
      border-bottom: 2px dashed var(--color-green-main);
    }

.bg-atun img {
  position: relative;
}

}
/**Premios**/
.banner .wrapper-premios {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

/**Footer**/

footer .top {
  flex-direction: column;
  align-items: center;
}

  footer .top .footer-links {
    flex-direction: column;
    align-items: center;
    gap: 0 !important;
  }


#modalAceite .box-image.warning,
#modalAtun .box-image.warning {
  max-width: 80px;
}

#modalAceite .titulo-con-lineas, #modalAtun .titulo-con-lineas, #modalChangeAtun .titulo-con-lineas {
  font-size: 2.5rem;
}

#modalAceite .modal-dialog, #modalAtun .modal-dialog, #modalChangeAtun .modal-dialog {
  top: 6rem;
}

#modalAceite .modal-content .wrapper-box, #modalAtun .modal-content .wrapper-box, #modalChangeAtun .modal-content .wrapper-box {
  flex-direction: column;
  align-items:center;
}

.container-cookie {
  gap: 1rem;
  flex-direction: column;
}
.text-cookie-2 {
  font-size: 0.95rem;
  line-height: 1.3;
}
.text-cookie-1 {
  font-size: 1rem;
}
.cookie-check-container {
  gap: 1rem;
}
  .cookie-check-container p {
    font-size: 1rem;
  }

}




@media (max-width: 560px) {

  .valid-age-wrap .valid-age-content .valida-header .box-image {
    max-width: 200px;
  }

  #offcanvasMobile {
    max-width: 80%;
  }

    #offcanvasMobile .btn-close {
      top: 5%;
    }

    #offcanvasMobile .logo-header {
      width: 100%;
      justify-content: start !important;
      padding-inline-start: 2rem;
    }

    #offcanvasMobile .navbar-nav .nav-item a {
      font-size: 1.8rem;
    }

    #offcanvasMobile .navbar-nav .nav-item.item-button .nav-link {
      font-size: 1rem;
      padding: .5rem .8rem;
      font-family: "Myriadproregular";
      width: 100%;
      justify-content: center;
      font-weight: 700;
    }

    #offcanvasMobile .navbar-nav .nav-item.item-button {
      width: 80%;
    }

    #offcanvasMobile .redes_sociales {
      padding-inline-start: 2rem;
    }

      #offcanvasMobile .redes_sociales p {
        text-align: start !important;
      }

      #offcanvasMobile .redes_sociales .wrapper-icons-redes {
        justify-content: start !important;
      }

  .banner {
    .box-image.warning img

{
  max-width: 80px;
}

}

.bg-atun p {
  font-size: .6rem;
  max-width: 60%;
}

.bg-atun img {
  max-width: 80px;
  position: absolute;
}

.section-preguntas .title-preguntas {
  font-size: 4rem;
}

.seccion-perfil .title-pefil {
  font-size: 2.5rem;
  text-align: center;
}

.seccion-perfil .buttons-perfil {
  flex-direction: column;
  gap: 1rem !important;
}

.buttons-perfil .button-participa.yellow {
  font-size: 1rem;
  padding: 5px 12px;
}

.seccion-perfil .title-pefil #name-user {
  font-size: 2.5rem;
}

.details-profile .detail-participacion {
  font-size: 2.5rem;
}

  .details-profile .detail-participacion .numero {
    font-size: 2.5rem;
    padding: .2rem .5rem;
  }



#content-modal-login h2 {
  font-size: 2.5rem;
}

#loginForm .button-participa {
  font-size: 1rem;
  padding: 5px 12px;
}

#modalAceite .modal-dialog, #modalAtun .modal-dialog, #modalChangeAtun .modal-dialog {
  top: 10rem;
}
.box-form h3 {
  color: #fff;
  font-size: 1rem;
}
.box-form .referencia {
  font-size: .8rem;
  
}
.form-wrap .form-item label {
  font-size: .8rem;
}
#modalAceite .modal-footer, #modalAtun .modal-footer, #modalChangeAtun .modal-footer {
  flex-direction:column;
}
  #modalAceite .modal-footer .btn, #modalAtun .modal-footer .btn, #modalChangeAtun .modal-footer .btn {
    font-size:1rem;
  }

#modalChangeAtun .wrapper-box .box-form h2 {
  font-size: 2.5rem;
}

#modal-register-succes .modal-content .wrapper-respuesta .top {
  flex-direction:column;
  align-items:center;
}

#modal-register-succes .body-modal-register #responseApi {
  font-family: "Myriadproregular", sans-serif;
}
#modal-register-succes .modal-content .wrapper-respuesta .info h2 {
  text-align: center;
  font-size: 2.5rem;
}
#modal-register-succes .modal-content .wrapper-respuesta .info .contenido {
  text-align: center;
}

#modal-winner-premio .body-modal-register .top {
  flex-direction:column;
}

.info-premio .terminos-premios {
  display:none;
}
#modal-winner-premio .body-modal-register .bottom .terminos-premios-mobile {
  display: block;
  text-align: center;
  font-size:.6rem;
}
#modal-winner-premio .modal-dialog{
  top:5rem;
}
.info-premio .title-premio {
  font-size: 2.5rem;
}
.info-premio #winnerMessage {
  font-size: 2.5rem;
}


#modal-winner-premio .box-image-premio img{
  max-height:200px;
}
#modal-winner-premio .body-modal-register .bottom .intento {
  font-size:1rem;
}
#modal-winner-premio .bottom{
  display:flex;
  flex-direction:column;
  gap:.7rem;
}
.buttons-premios {
  flex-direction:column;
}
}