/* Define otros estilos de la fuente si es necesario */

*,
::after,
::before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border: 0 solid;
  padding: 0;
  margin: 0;
}

body {
  background: #000 !important;
  margin: 0;
  font-family: "Saira", sans-serif;
  font-weight: 500;
}

div {
  display: grid;
}

a {
  text-decoration: none;
  color: #fff;
}

ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

img {
  width: 100%;
  height: 100%;
}

/*  Subrayado del menu del header */
.subrayado {
  text-decoration: none;
  /* Eliminamos el subrayado predeterminado del enlace */
  position: relative;
  /* Color del texto del enlace */
  transition: color 0.3s;
  -webkit-transition: color 0.3s;
  /* Transición suave del color */
}

.subrayado::after {
  content: "";
  position: absolute;
  left: 0;
  top: 3rem;
  bottom: 0;
  width: 100%;
  height: 3px;
  /* Ajusta esta altura según lo necesites */
  background-color: #ffd900;
  /* Color del subrayado */
  transition: height 0.3s, opacity 0.3s;
  -webkit-transition: height 0.3s opacity 0.3s;

  /* Transición suave de la altura y opacidad */
  transform: scaleX(0);
  -webkit-transform: scaleX(0);
  /* Inicialmente, el subrayado tiene una altura de 0 */
  transform-origin: bottom left;
  -webkit-transform-origin: bottom left;
  /* El subrayado crece desde la esquina inferior izquierda */
  opacity: 0;
  /* Inicialmente, el subrayado está invisible */
}

.subrayado:hover::after {
  transform: scaleX(1);
  -webkit-transform: scaleX(1);
  /* Al hacer hover, el subrayado crece a su altura completa */
  opacity: 1;
  /* Al hacer hover, el subrayado se vuelve visible */
}

.subrayado::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  /* Ajusta esta altura según lo necesites */
  animation: fadeOut 0.7s ease forwards;
  -webkit-animation: fadeOut 0.7s ease forwards;
  /* Animación de desvanecimiento */
  transform-origin: bottom left;
  -webkit-transform-origin: bottom left;

  /* El subrayado desaparece hacia la esquina inferior izquierda */
  opacity: 0;
  /* Inicialmente, el subrayado está invisible */
  visibility: hidden;
  /* Inicialmente, el subrayado está oculto */
}

@keyframes fadeOut {
  to {
    opacity: 0;
    /* Al final de la animación, el subrayado está completamente invisible */
  }
}

.subrayado:hover::before {
  visibility: visible;
  /* Al hacer hover, el subrayado se vuelve visible */
}

/* Colors */
.color-yellow {
  color: #ffd900;
}

.color-white {
  color: #fff;
}

.color-black {
  color: #000000;
}

/* Backgrounds-Colors */
.bg-yellow {
  background: #ffd900;
}

.bg-black {
  background-color: #000000;
}

/* Statics styles */
.d-flex {
  display: flex;
  display: -webkit-flex;
}

.d-grid {
  display: grid;
}

.justify-end {
  justify-content: end;
}

.justify-center {
  justify-content: center;
}

.self-center {
  justify-self: center;
}

.text-center {
  text-align: center;
}

.object-contain {
  object-fit: contain;
}

.cursor-pointer {
  cursor: pointer;
}

.cursor-default {
  cursor: default;
}

/* Fonts */
.font-size {
  font-size: xxx-large;
}

.font-w-8 {
  font-weight: 800;
}

.font-w-5 {
  font-weight: 500;
}

.font-w-600 {
  font-weight: 600;
}

.font-w-3{
  font-weight: 300; 
}

.font-bienvenido {
  font-size: 7rem;
  font-weight: 800;
  font-family: sans-serif;
}

.m-2 {
  margin: 2rem;
}

.w-auto {
  width: auto;
}

.h-auto {
  height: auto;
}

.w-100 {
  width: 61%;
}

.w-50 {
  width: 50rem;
}

.sticky {
  position: static;
  top: 0;
  width: 100%;
}

.z-index {
  z-index: -1;
}

.w-13 {
  width: 13rem;
}

.miembro {
  align-items: center;
  padding: 10px;
}

.bg-miembro {
  background: #fbe800;
  border-radius: 2rem;
  padding-left: 12px;
}

.btn {
  background: #000000;
  width: 32rem;
  border-radius: 12px;
  margin-bottom: 1.8rem;
  height: 4.3rem;
  font-size: 2rem;
  font-weight: 700;
  margin-left: 12rem;
}

.w-7 {
  width: 7rem;
}

.h-7 {
  height: 7rem;
}

.h-4 {
  height: 4rem;
}

.border-rad {
  border-radius: 1rem;
}

/* ScrollUp styles */
.scrollUp {
  padding: 10px 20px;
  background-color: #ffee00;
  color: #fff;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}

.scrollUp:hover {
  background-color: #ffee00;
}

.scroll-up-btn {
  background: none;
  position: fixed;
  bottom: 20px;
  right: 67px;
  width: 3rem;
  height: 3rem;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  z-index: 999;
  top: 30vw;
}
.scroll-up-btn.wa {
  top: calc(30vw + 72px + 8px); 
}


.scroll-up-btn.show {
  display: block;
  /* Muestra el botón cuando es necesario */
}

.border-rad-circle {
  border-radius: 50%;
}

.mr-32 {
  margin-right: 32rem;
}

.mr-3 {
  margin-right: 3rem;
}

.w-20 {
  width: 20rem;
  height: auto;
}

.plasta {
  z-index: -1;
  position: absolute;
  margin: -28rem;
  height: 132rem;
  object-fit: scale-down;
  background-size: cover;
  background-attachment: fixed;
  margin-left: -8rem;
  width: 127rem;
}

.lobo {
  position: absolute;
  margin-left: 16rem;
  margin-top: 8rem;
}

.font-text {
  margin-left: 53rem;
  margin-top: 7rem;
}

.soy-miembro {
  margin-top: -3.5rem;
  margin-left: 0.5rem;
  font-weight: 600;
}

.w-10 {
  width: 10rem;
}

.w-15 {
  width: 15rem;
}

.h-3 {
  height: 3rem;
}

.mt-3 {
  margin-top: 3rem;
}

.m-1 {
  margin: 1rem;
}

.boton-entrenamiento {
  z-index: 1;
  margin: -6.3rem 1rem 0rem 2rem;
  background: no-repeat;
  transition: 0.5s ease;
  -webkit-transition: 0.5s ease;
}

.img-boton-negro {
  background-image: url("/assets/img/WEB/BOTTON/BÓTON\ NEGRO.webp");
}

.img-boton-transparente {
  background-image: url("/assets/img/WEB/BOTTON/MÁS\ ACTIVIDADES.webp");
}

.texto-entrenamiento {
  position: relative;
  color: #ffd900;
  margin: 1.4rem;
  font-size: x-large;
  font-family: "Roboto";
  font-weight: 500;
  transition: color 0.3s ease;
  -webkit-transition: color 0.3s ease;

  z-index: 1;
}

.mt-1 {
  margin-top: 1rem;
}

.mt-1-1 {
  margin-top: 1.1rem;
}

.font-s-2 {
  font-size: 2rem;
}

.font-size-22 {
  font-size: 22px;
}

.ml-07 {
  margin-left: 0.7rem;
}

.texto-entrenamiento:hover {
  color: #000000;
}

.contenedor:hover .texto-entrenamiento {
  color: #000000;
  /* Cambia el color del texto al hacer hover */
}

.boton-entrenamiento:hover {
  background-image: url("./img/WEB/BOTTON/BÓTON\ AMARILLO.webp");
}

.mas-entrenamiento {
  margin-top: 0rem;
  height: 5rem;
  margin-left: 0rem;
  width: 16rem;
}

.manada {
  position: static;
  margin-top: -4rem;
  width: 40rem;
  height: auto;
}

.texto-p {
  /* margin-top: -2rem; */
  font-size: 23px;
}

.w-46 {
  width: 46rem;
}

.mt-4 {
  margin-top: -4rem;
}

.btn-font {
  font-family: "Saira";
}

.mr-14 {
  margin-right: 14rem;
}

.w-17 {
  width: 17rem;
}

.mb-0 {
  margin-bottom: 0rem;
}

.m-15 {
  margin-left: 4rem;
  margin-right: 5rem;
  margin-bottom: 10rem;
}

.calendario {
  margin-left: 6rem;
  margin-top: 9rem;
  width: 35rem;
  height: auto;
}

.registrar {
  font-size: 3rem;
  font-weight: 700;
  margin-top: -5rem;
  margin-left: 2rem;
  height: 4rem;
  width: 26rem;
}

.texto-calendario {
  font-size: 3rem;
  margin-top: 21rem;
  width: 31rem;
}

.div-registrar {
  width: 42rem;
  margin-left: 12rem;
}

.btn-registrar {
  color: #000000;
  width: 19rem;
  height: 4rem;
  margin-left: 5rem;
  background: #fbe800;
  border-radius: 12px;
  font-size: 1.7rem;
  font-weight: 700;
  cursor: pointer;
}

.garra {
  z-index: -1;
  position: absolute;
  margin-left: 82%;
  margin-top: 8rem;
}

.garra-calendario {
  z-index: -1;
  position: absolute;
  margin-left: 8%;
  margin-top: 8rem;
  height: auto;
  width: auto;
}

.w-h-garra-100 {
  width: 100%;
  height: auto;
}

.mt-5 {
  margin-top: 5rem;
}

.w-38 {
  width: 38rem;
}

.titulo-coaches {
  font-size: 3rem;
  font-weight: 600;
}

.texto-coaches {
  font-size: 1.5rem;
  margin-top: -1rem;
}

.ml-1 {
  margin-left: 1rem;
}

.w-119 {
  width: 119rem;
}

.galeria {
  width: 30rem;
  height: 26rem;
}

#map {
  height: 435px;
  width: 100%;
}

.mb-5 {
  margin-bottom: 5rem;
}

.logo-footer {
  margin: 4rem;
  margin-left: 10rem;
}

.footer-registrar {
  width: 42rem;
  margin-left: 15rem;
}

.texto-footer {
  font-size: 3rem;
  width: 31rem;
}

.registrar-footer {
  font-size: 3rem;
  font-weight: 700;
  margin-top: -5rem;
  margin-left: 2rem;
  height: 4rem;
}

.garra-footer {
  z-index: -1;
  position: absolute;
  margin-left: 88%;
  width: 18rem;
}

.redes {
  color: black;
  border-radius: 50%;
}

.sociales {
  width: 32px;
  height: 32px;
  margin-top: 7px;
}

.redes-sociales {
  margin-top: -2rem;
  margin-bottom: 3rem;
}

.mr-10 {
  margin-right: 10px;
}

.mt--1 {
  margin-top: -1rem;
}

.form-contacto {
  position: absolute;
  background: black;
  width: 27rem;
  margin-left: 12rem;
  color: white;
  margin-top: -24rem;
  height: 20rem;
}

.ml-6 {
  margin-left: 6rem;
}

.linea-contacto {
  background: #fbe800;
  width: 0.5rem;
  height: 12.5rem;
  z-index: 0;
  position: absolute;
}

.contacto {
  font-size: 44px;
  color: #fbe800;
  margin: 0.5rem 0 0 3rem;
  font-weight: 500;
}

.manada-bienvenido {
  height: 66rem;
  margin-bottom: 8rem;
}

.actividades-div {
  height: 4rem;
  display: flex;
  margin-left: 90rem;
}

.div-whats {
  display: flex;
  margin-left: 3rem;
}

.telefono {
  font-size: 20px;
  margin-left: 1rem;
  margin-top: 1rem;
}

.address {
  display: flex;
  margin-left: 3rem;
}

.logo-address {
  height: 2.5rem;
  width: 3rem;
  margin-top: 1rem;
}

.direccion {
  font-size: 22px;
  margin-top: 0.5rem;
  margin-left: 1rem;
}

.line-footer {
  background: #fbe800;
  width: 2px;
  height: 13rem;
  margin-top: 8rem;
}

.info {
  color: #fbe800;
  margin-left: 4rem;
  margin-top: 6rem;
  font-size: 20px;
}

.mt-7 {
  margin-top: 7rem;
}

.img-direccion {
  width: 42.044px;
  height: 42.45px;
}

.img-whats {
  width: 42.915px;
  height: 42.131px;
  margin-top: 0.7rem;
}

.h-2 {
  height: 2rem;
}

.img-movil {
  display: none;
}

.texto-movil {
  display: none;
}

.mt-21 {
  margin-top: 18rem;
}

.mb-1 {
  margin-bottom: 1rem;
}

#menu {
  display: flex;
}

#menuBtn {
  display: none;
}

body.modal-open {
  overflow: hidden;
}

.modal {
  display: none;
  position: fixed;
  z-index: 1;
  padding-top: 145px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.9);
}

.modal-content {
  margin: auto;
  display: block;
  width: 50%;
  height: 90%;
}

.close {
  position: absolute;
  top: 15px;
  right: 35px;
  color: #ffffff;
  font-size: 40px;
  font-weight: bold;
  transition: 0.3s;
  -webkit-transition: 0.3s;
}

.close:hover,
.close:focus {
  color: #aaaaaa;
  text-decoration: none;
  cursor: pointer;
}

.ml-16 {
  margin-left: 16rem;
}

/* Formulario */
/* Estilos para el modal */
.modal-form {
  display: none;
  /* Por defecto, el modal está oculto */
  position: fixed;
  /* Se posiciona de forma fija en la ventana */
  z-index: 1;
  /* Una capa z-index alta para que esté por encima del contenido */
  left: 0;
  top: 0;
  width: 100%;
  /* Ocupa todo el ancho de la pantalla */
  height: 100%;
  /* Ocupa toda la altura de la pantalla */
  overflow: hidden;
  /* Permite desplazar el contenido si el modal es más grande que la pantalla */
  background-color: rgba(0, 0, 0, 0.4);
  /* Fondo oscuro semitransparente */
  font-weight: 400;
  font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
  color: #33475b;
}

/* Estilos para el contenido del modal */
.modal-form-content {
  overflow: auto;
  background-color: #fefefe;
  margin: 6rem auto;
  padding: 20px;
  border: 1px solid #888;
  width: 50rem;
  height: 95%;
}

.input-form {
  display: inline-block;
  width: 20rem;
  height: 40px;
  padding: 9px 10px;
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  color: #33475b;
  background-color: #f5f8fa;
  border: 1px solid #959494;
  border-radius: 3px;
}

.m-5 {
  margin: 5px;
}

[type="email"]:focus,
[type="number"]:focus,
[type="string"]:focus,
[type="tel"]:focus,
[type="text"]:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: #005fcc;
}

.required {
  margin-left: 2px;
  color: #e51520;
}

/* Estilo para el mensaje de error */
.error-message {
  display: none;
  /* Por defecto, el mensaje de error está oculto */
  color: red;
  /* Color rojo para el mensaje de error */
  font-size: 12px;
  /* Tamaño de fuente más pequeño */
}

/* Estilo para el borde rojo del campo de entrada */
.input-error {
  border-color: red;
  /* Borde rojo */
}

.text-area-form {
  display: inline-block;
  height: auto;
  width: 100%;
  padding: 9px 10px;
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  color: #33475b;
  background-color: #f5f8fa;
  border: 1px solid #959494;
  box-sizing: border-box;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  border-radius: 3px;
}

.btn-form {
  background-color: rgb(255, 115, 0);
  width: 5rem;
  height: 2rem;
  border-radius: 0.3rem;
  font-weight: 600;
  margin: 0.5rem;
}

.text-form {
  text-align: justify;
  line-height: 23px;
  font-size: 15px;
}

/* Estilos para el botón de cierre */
.close-form {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
  width: 2rem;
  height: 2rem;
}

.close-form:hover,
.close-form:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

.m-0 {
  margin: 0;
}

.mar-15 {
  margin-left: 15rem;
  margin-right: 15rem;
  margin-bottom: 15rem;
}

.lobo-movil {
  height: auto;
}

.garra-bienvenido {
  height: auto;
  width: auto;
}

.img-movil {
  height: auto;
}

.img-desktop {
  height: auto;
  width: auto;
}

.garra-footer {
  height: auto;
}

@media (min-width: 1920px) and (max-width: 2560px) {
  .justify-end {
    justify-content: end;
  }

  .m-2 {
    margin: 2rem;
  }

  .justify-center {
    justify-content: center;
  }

  .self-center {
    justify-self: center;
  }

  .text-center {
    text-align: center;
  }

  .object-contain {
    object-fit: contain;
  }

  .cursor-pointer {
    cursor: pointer;
  }

  .cursor-default {
    cursor: default;
  }

  .font-size-2 {
    font-size: 1vw;
  }

  .div-carousel {
    width: 100%;
    height: auto;
    margin-bottom: 7vw;
  }

  .div-entrenamiento {
    width: 30vw;
    height: auto;
    padding: 1rem;
  }

  /* Fonts */
  .font-size {
    font-size: 3vw;
  }

  .font-w-8 {
    font-weight: 800;
  }

  .font-w-5 {
    font-weight: 500;
  }

  .font-w-600 {
    font-weight: 600;
  }

  .font-bienvenido {
    font-size: 7rem;
    font-weight: 800;
    font-family: sans-serif;
  }

  .w-100 {
    width: 100%;
  }

  .w-50 {
    width: 45vw;
  }

  .sticky {
    position: static;
    top: 0;
    width: 100%;
  }

  .z-index {
    z-index: -1;
  }

  .w-13 {
    width: 15vw;
  }

  .miembro {
    align-items: center;
    padding: 10px;
  }

  .bg-miembro {
    background: #fbe800;
    border-radius: 2rem;
    padding-left: 12px;
  }

  .btn {
    background: #000000;
    width: 32rem;
    border-radius: 12px;
    margin-bottom: 1.8rem;
    height: 4.3rem;
    font-size: 2rem;
    font-weight: 700;
    margin-left: 12rem;
  }

  .w-7 {
    width: 7rem;
  }

  .h-7 {
    height: 7rem;
  }

  .h-4 {
    height: 4rem;
  }

  .border-rad {
    border-radius: 1rem;
  }

  /* ScrollUp styles */
  .scrollUp {
    padding: 10px 20px;
    background-color: #ffee00;
    color: #fff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
  }

  .scrollUp:hover {
    background-color: #ffee00;
  }

  .scroll-up-btn {
    background: none;
    position: fixed;
    bottom: 20px;
    right: 67px;
    width: 3rem;
    height: 3rem;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    z-index: 999;
    top: 30vw;
  }
  .scroll-up-btn.wa {
    top: calc(30vw + 72px + 8px); 
  }

  .scroll-up-btn.show {
    display: block;
    /* Muestra el botón cuando es necesario */
  }

  .border-rad-circle {
    border-radius: 50%;
  }

  .mr-32 {
    margin-right: 12rem;
  }

  .mr-3 {
    margin-right: 3rem;
  }

  .w-20 {
    width: 25rem;
    height: auto;
  }

  .plasta {
    height: auto;
    margin-left: 0rem;
    width: 100%;
    margin-top: 0rem;
    background-size: cover;
    object-fit: cover;
  }

  .lobo {
    width: 32%;
    position: absolute;
    margin-left: 12vw;
    margin-top: 7vw;
  }

  .font-text {
    margin-left: 44%;
    margin-top: 6%;
    width: 43vw;
    height: 44vw;
  }

  .h-bienvenido {
    width: 75%;
    height: 95%;
  }

  .soy-miembro {
    font-size: 1vw;
    margin-top: -3.3vw;
    margin-left: 0.5rem;
    font-weight: 600;
  }

  .w-10 {
    width: 10vw;
  }

  .w-15 {
    width: 15rem;
  }

  .h-3 {
    height: 3vw;
  }

  .mt-3 {
    margin-top: 3rem;
  }

  .m-1 {
    margin: 1rem;
  }

  .boton-entrenamiento {
    z-index: 1;
    margin: -6.3rem 1rem 0rem 2rem;
    background: no-repeat;
    transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
  }

  .img-boton-negro {
    background-image: url("/assets/img/WEB/BOTTON/BÓTON NEGRO.webp");
    background-size: contain;
    margin: 0;
    margin-top: -16%;
    width: 60%;
    position: relative;
    height: auto;
  }

  .img-boton-transparente {
    background-image: url("/assets/img/WEB/BOTTON/MÁS\ ACTIVIDADES.webp");
    background-size: contain;
  }

  .img-entrenamiento {
    width: 100%;
    height: auto;
    margin: 0;
  }

  .texto-entrenamiento {
    position: relative;
    color: #ffd900;
    margin: 0rem;
    font-family: "Roboto";
    font-weight: 500;
    transition: color 0.3s ease;
    -webkit-transition: color 0.3s ease;
    margin-top: 0.9vw;
    margin-left: 1rem;
    font-size: 1.4vw;

    z-index: 1;
  }

  .entrenamiento {
    justify-content: center;
  }

  .mt-1 {
    margin-top: 1.1vw;
  }

  .mt-1-1 {
    margin-top: 1.1rem;
  }

  .font-s-2 {
    font-size: 2vw;
  }

  .texto-form {
    font-size: 1vw;
  }

  .label-size {
    font-size: 1.2vw;
  }

  .ml-07 {
    margin-left: 0.7rem;
  }

  .texto-entrenamiento:hover {
    color: #000000;
  }

  .contenedor:hover .texto-entrenamiento {
    color: #000000;
    /* Cambia el color del texto al hacer hover */
  }

  .boton-entrenamiento:hover {
    background-image: url("./img/WEB/BOTTON/BÓTON\ AMARILLO.webp");
  }

  .mas-entrenamiento {
    margin-top: 10%;
    height: 5vw;
    margin-left: 0;
    width: 18vw;
  }

  .mas-actividades {
    width: 21vw;
    height: auto;
  }

  .manada {
    position: static;
    margin-top: -3rem;
    width: 40rem;
    height: auto;
  }

  .texto-p {
    /* margin-top: -2rem; */
    font-size: 1.3vw;
  }

  .texto-actividades {
    margin-top: 1.3vw;
  }

  .w-46 {
    width: 46rem;
  }

  .mt-4 {
    margin-top: 0rem;
  }

  .btn-font {
    font-family: "Saira";
  }

  .mr-14 {
    margin-right: 0rem;
  }

  .w-carousel {
    width: 28%;
    height: auto;
  }

  .w-17 {
    width: 15vw;
  }

  .w-actividades {
    width: 18vw;
  }

  .mb-0 {
    margin-bottom: 0rem;
  }

  .m-15 {
    margin-left: 4rem;
    margin-right: 5rem;
    margin-bottom: 10rem;
  }

  .calendario {
    margin-left: -20rem;
    margin-top: 0rem;
    width: 30vw;
    height: auto;
  }

  .registrar {
    font-size: 2.5vw;
    font-weight: 700;
    margin-top: 0rem;
    margin-left: 2rem;
    height: 5rem;
    width: 26vw;
  }

  .texto-calendario {
    font-size: 2.5vw;
    margin-top: 0rem;
    width: 35vw;
    height: 7vw;
  }

  .div-registrar {
    width: 35vw;
    margin-left: 6vw;
    height: 18vw;
    margin-top: 10vw;
  }

  .btn-registrar {
    color: #000000;
    width: 17vw;
    height: 3vw;
    margin-left: 3vw;
    background: #fbe800;
    border-radius: 12px;
    font-size: 1.5vw;
    font-weight: 700;
    cursor: pointer;
  }

  .garra {
    z-index: -1;
    position: absolute;
    margin-left: 86%;
    margin-top: 10rem;
  }

  .garra-calendario {
    z-index: -1;
    position: absolute;
    margin-left: -5%;
    margin-top: 6vw;
    width: 17vw;
    height: auto;
  }

  .w-h-garra-100 {
    width: 100%;
    height: auto;
  }

  .mt-5 {
    margin-top: 10vw;
  }

  .w-38 {
    width: 36vw;
    height: 26vw;
  }

  .titulo-coaches {
    font-size: 3vw;
    font-weight: 600;
  }

  .texto-coaches {
    font-size: 2vw;
    margin-top: -1rem;
  }

  .coaches-section {
    justify-content: center;
  }

  .div-coaches {
    width: 100%;
    height: auto;
  }

  .div-img-coaches {
    width: 52%;
    height: 100%;
  }

  .m-2-coaches {
    width: auto;
    height: 23vw;
  }

  .ml-1 {
    margin-left: 1rem;
  }

  .w-119 {
    width: 100%;
  }

  .galeria {
    width: 25%;
    height: auto;
  }

  #map {
    height: 30vw;
    width: 100%;
  }

  .mb-5 {
    margin-bottom: 5rem;
  }

  .logo-footer {
    margin: 1vw 4vw 7vw 4vw;
    margin-left: 8vw;
    width: 19vw;
    height: auto;
  }

  .footer-registrar {
    width: 34vw;
    margin-left: 7vw;
    height: 100%;
  }

  .texto-footer {
    font-size: 2.5vw;
    width: 31vw;
    height: 100%;
    margin-top: 0;
  }

  .registrar-footer {
    font-size: 2.5vw;
    font-weight: 700;
    margin-top: 0rem;
    margin-left: 2rem;
    height: 5vw;
  }

  .garra-footer {
    z-index: -1;
    position: absolute;
    margin-left: 84%;
    width: 14vw;
  }

  .redes {
    color: black;
    border-radius: 50%;
  }

  .sociales {
    width: 2.5vw;
    height: 2.5vw;
    margin-top: 7px;
  }

  .redes-sociales {
    margin-top: 0vw;
    margin-bottom: -3vw;
  }

  .mr-10 {
    margin-right: 10px;
  }

  .mt--1 {
    margin-top: 0rem;
  }

  .form-contacto {
    position: absolute;
    background: black;
    width: 29vw;
    margin-left: 12vw;
    color: #ffff;
    margin-top: -24vw;
    height: 20vw;
  }

  .ml-6 {
    margin-left: 0rem;
  }

  .linea-contacto {
    background: #fbe800;
    width: 0.5rem;
    height: 13.5vw;
    z-index: 0;
    position: absolute;
  }

  .contacto {
    font-size: 3vw;
    color: #fbe800;
    margin: 0.5rem 0 0 3rem;
    font-weight: 500;
  }

  .manada-bienvenido {
    height: 57vw;
    margin-bottom: 0rem;
  }

  .actividades-div {
    display: flex;
    margin-left: 70vw;
  }

  .div-whats {
    display: flex;
    margin-left: 3rem;
  }

  .telefono {
    font-size: 1.5vw;
    margin-left: 1rem;
    margin-top: -1vw;
  }

  .address {
    display: flex;
    margin-left: 3rem;
  }

  .logo-address {
    height: 2.5rem;
    width: 3rem;
    margin-top: 1rem;
  }

  .direccion {
    font-size: 1.3vw;
    margin-top: 0.5rem;
    margin-left: 1rem;
  }

  .line-footer {
    background: #fbe800;
    width: 0.2vw;
    height: 14vw;
    margin-top: 2rem;
  }

  .info {
    color: #fbe800;
    margin-left: 4rem;
    margin-top: 0;
    font-size: 1.7vw;
  }

  .redes-contacto {
    margin-left: 3vw;
    margin-top: 0vw;
  }

  .mt-7 {
    margin-top: 2vw;
  }

  .img-direccion {
    width: 3vw;
    height: 3vw;
  }

  .img-whats {
    width: 3.915vw;
    height: 3.131vw;
    margin-top: -1.3vw;
  }

  .h-2 {
    height: auto;
  }

  .img-movil {
    display: none;
  }

  .texto-movil {
    display: none;
  }

  .mt-21 {
    margin-top: 11rem;
  }

  .mb-1 {
    margin-bottom: 1rem;
  }

  #menu {
    display: flex;
  }

  #menuBtn {
    display: none;
  }

  body.modal-open {
    overflow: hidden;
  }

  .modal {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 145px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
  }

  .modal-content {
    margin: auto;
    display: block;
  }

  .close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #ffffff;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
    -webkit-transition: 0.3s;
  }

  .close:hover,
  .close:focus {
    color: #aaaaaa;
    text-decoration: none;
    cursor: pointer;
  }

  .ml-16 {
    margin-left: 0rem;
  }

  .carousel-entrenamiento {
    width: 100%;
    height: auto;
  }

  /* Formulario */
  /* Estilos para el modal */
  .modal-form {
    display: none;
    /* Por defecto, el modal está oculto */
    position: fixed;
    /* Se posiciona de forma fija en la ventana */
    z-index: 1;
    /* Una capa z-index alta para que esté por encima del contenido */
    left: 0;
    top: 0;
    width: 100%;
    /* Ocupa todo el ancho de la pantalla */
    height: 100%;
    /* Ocupa toda la altura de la pantalla */
    overflow: hidden;
    /* Permite desplazar el contenido si el modal es más grande que la pantalla */
    background-color: rgba(0, 0, 0, 0.4);
    /* Fondo oscuro semitransparente */
    font-weight: 400;
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    color: #33475b;
  }

  /* Estilos para el contenido del modal */
  .modal-form-content {
    overflow: auto;
    background-color: #fefefe;
    margin: 1rem auto;
    padding: 20px;
    border: 1px solid #888;
    width: 50vw;
    height: 95%;
  }

  .input-form {
    display: inline-block;
    width: 20vw;
    height: 2vw;
    padding: 9px 10px;
    font-size: 1.1vw;
    font-weight: 400;
    line-height: 22px;
    color: #33475b;
    background-color: #f5f8fa;
    border: 1px solid #959494;
    border-radius: 3px;
  }

  .m-5 {
    margin: 5px;
  }

  [type="email"]:focus,
  [type="number"]:focus,
  [type="string"]:focus,
  [type="tel"]:focus,
  [type="text"]:focus,
  select:focus,
  textarea:focus {
    outline: none;
    border-color: #005fcc;
  }

  .required {
    margin-left: 2px;
    color: #e51520;
  }

  /* Estilo para el mensaje de error */
  .error-message {
    display: none;
    /* Por defecto, el mensaje de error está oculto */
    color: red;
    /* Color rojo para el mensaje de error */
    font-size: 1vw;
    /* Tamaño de fuente más pequeño */
  }

  /* Estilo para el borde rojo del campo de entrada */
  .input-error {
    border-color: red;
    /* Borde rojo */
  }

  .text-area-form {
    display: inline-block;
    height: auto;
    width: 100%;
    padding: 9px 10px;
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    color: #33475b;
    background-color: #f5f8fa;
    border: 1px solid #959494;
    box-sizing: border-box;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
  }

  .btn-form {
    background-color: rgb(255, 115, 0);
    width: 5rem;
    height: 2rem;
    border-radius: 0.3rem;
    font-weight: 600;
    margin: 0.5rem;
  }

  .text-form {
    text-align: justify;
    line-height: 1.8vw;
    font-size: 1vw;
    padding: 1vw;
  }

  /* Estilos para el botón de cierre */
  .close-form {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
    width: 2rem;
    height: 2rem;
  }

  .close-form:hover,
  .close-form:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
  }

  .m-0 {
    margin: 0;
  }

  .mar-15 {
    margin-left: 4vw;
    margin-right: 4vw;
    margin-bottom: 0rem;
  }

  .section-calendario {
    display: grid;
    justify-content: center;
  }
}

@media (min-width: 1600px) and (max-width: 1919px) {
  .ml-1 {
    margin-left: 1rem;
  }

  .font-size-2 {
    font-size: 21px;
  }

  .ml-cross {
    margin-left: 10rem;
  }

  .soy-miembro {
    margin-top: -3.2rem;
    margin-left: 0.5rem;
    font-weight: 600;
    font-size: 16px;
  }

  .footer-section {
    justify-content: center;
  }

  .w-10 {
    width: 10rem;
  }

  .scroll-up-btn {
    position: fixed;
    bottom: 20px;
    right: 67px;
    width: 3rem;
    height: 3rem;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    z-index: 999;
    top: 30vw;
  }

  .sticky {
    width: 100%;
  }

  .w-100 {
    width: 100%;
  }

  .img-manada {
    width: 44%;
    height: 85%;
  }

  .mt--1 {
    margin-top: 0;
  }

  .galeria {
    width: 21vw;
    height: 20vw;
  }

  .h-bienvenido {
    width: 54%;
    height: 79%;
  }

  .manada-bienvenido {
    height: 56vw;
    margin-bottom: 0;
  }

  .galeria-section {
    justify-content: center;
  }

  .div-carousel {
    width: 95%;
    height: auto;
    margin-right: 0;
    margin: 1rem;
  }

  .w-17 {
    width: 13vw;
  }

  .img-boton-negro {
    background-size: contain;
    margin: 0;
    margin-top: -16%;
    width: 60%;
    position: relative;
    height: auto;
  }

  .mas-entrenamiento {
    margin-top: 10%;
    height: 5vw;
    margin-left: 0;
    width: 18vw;
  }

  .img-boton-transparente {
    background-size: contain;
  }

  .texto-entrenamiento {
    margin-top: 0.9vw;
    margin-left: 1rem;
    font-size: 1.4vw;
  }

  .texto-actividades {
    margin-top: 1.3vw;
  }

  .font-size {
    font-size: 2.5vw;
  }

  .mas-actividades {
    width: 21vw;
    height: auto;
  }

  .carousel-slide-entrenamiento {
    width: 100%;
    height: auto;
  }

  .mr-32 {
    margin-right: 14rem;
  }

  .plasta {
    height: auto;
    margin-left: 0rem;
    width: 100%;
    margin-top: 0rem;
    background-size: cover;
    object-fit: cover;
  }

  .lobo {
    margin-left: 8rem;
    margin-top: 7vw;
    width: 30%;
  }

  .img-entrenamiento {
    width: 100%;
    height: auto;
    margin: 0;
  }

  .carousel-entrenamiento {
    width: 100%;
    height: auto;
  }

  .div-entrenamiento {
    width: 27%;
    height: auto;
    padding: 1rem;
  }

  .font-text {
    margin-left: 39%;
    margin-top: 4%;
    width: 44%;
    height: 82%;
  }

  .font-bienvenido {
    font-size: 5rem;
    margin: 0;
    margin-top: 0rem;
    height: auto;
    width: 36rem;
  }

  .manada {
    margin-top: 0rem;
    width: 29rem;
    height: auto;
  }

  .w-77-home {
    width: 100%;
  }

  .texto-p {
    margin-top: 0rem;
    font-size: 1.3vw;
    width: 100%;
    height: auto;
  }

  .mb-2 {
    margin-bottom: 0rem;
  }

  .mt-0-5 {
    margin-top: 0;
  }

  .btn {
    width: 25rem;
    height: 4rem;
    font-size: 1.5rem;
    margin-left: 15rem;
    margin-top: 1rem;
    margin-bottom: 0;
  }

  .garra {
    margin-left: 83%;
    margin-top: 10rem;
  }

  .nosotros {
    width: 100%;
  }

  .entrenamiento {
    width: 100%;
    height: auto;
  }

  .ml-6 {
    margin-left: 0;
  }

  .ml-16 {
    margin-left: 0rem;
  }

  .actividades-div {
    margin-left: 70vw;
  }

  .calendario {
    margin-left: -12vw;
    margin-top: 0rem;
    width: 27vw;
    height: auto;
  }

  .div-registrar {
    width: 50%;
    height: 55%;
    margin-left: 1rem;
    margin-top: 5rem;
  }

  .section-calendario {
    margin-top: 5rem;
    display: grid;
    justify-content: center;
    width: 100%;
    height: auto;
  }

  .div-calendario {
    width: 100%;
    height: auto;
  }

  .registrar {
    margin-top: 0rem;
    font-size: 2.5vw;
    margin-left: 2rem;
    height: 4rem;
    width: 26rem;
  }

  .garra-calendario {
    width: 15vw;
    margin-top: 0rem;
    margin-left: 4rem;
  }

  .w-38 {
    width: 30rem;
    height: 24rem;
  }

  .texto-calendario {
    margin-top: 0rem;
    font-size: 2.5vw;
    width: 27vw;
  }

  .ml-3 {
    margin-left: 0rem;
  }

  .div-coaches {
    margin-left: 0rem;
    margin-top: 1rem;
  }

  .coaches {
    margin-left: -2rem;
  }

  .coaches-section {
    justify-content: center;
  }

  .texto-coaches {
    font-size: 1.5vw;
    margin-top: -1rem;
  }

  .m-2-coaches {
    width: 100%;
    height: auto;
  }

  .w-34 {
    width: 34rem;
  }

  .titulo-coaches {
    font-size: 1.7vw;
  }

  .div-img-coaches {
    margin-left: 1rem;
    width: 45%;
    height: auto;
  }

  .ml-17 {
    margin-left: 0rem;
  }

  .w-119 {
    width: 85vw;
  }

  .modal {
    padding-top: 50px;
  }

  #map {
    width: 100%;
  }

  .redes-contacto {
    margin-left: 6rem;
  }

  .logo-footer {
    margin: 1rem 3rem 3rem 3rem;
    margin-left: -9rem;
    width: 20rem;
    height: auto;
  }

  .info {
    margin-left: 3rem;
    margin-top: 0rem;
    font-size: 20px;
    width: 15%;
    height: auto;
    margin-bottom: 0rem;
  }

  .footer-menu {
    width: 100%;
    height: 100%;
  }

  .redes-sociales {
    margin-top: 0;
    margin-bottom: 0;
  }

  .line-footer {
    margin-top: 2rem;
    width: 3px;
  }

  .mt-footer {
    margin-top: 0rem;
  }

  .img-row {
    width: 4rem;
    height: 4rem;
  }

  .footer-registrar {
    margin-left: 0rem;
    width: 27%;
    height: 17rem;
    margin-top: 0rem;
  }

  .texto-footer {
    font-size: 2.4rem;
    width: 26rem;
    height: 5rem;
  }

  .form-contacto {
    position: absolute;
    background: #000;
    width: 27rem;
    margin-left: 12rem;
    color: #fff;
    margin-top: -24rem;
    height: 20rem;
  }

  .registrar-footer {
    margin-top: 0rem;
    font-size: 2.4rem;
    font-weight: 700;
    margin-left: 20px;
    height: 3rem;
  }

  .btn-registrar {
    margin-top: 1rem;
    width: 17rem;
    height: 3.5rem;
    margin-left: 4vw;
    font-size: 1.7rem;
  }

  .btn-footer {
    margin-top: 0rem;
    width: 19rem;
    height: 3.5rem;
    margin-left: 2rem;
    font-size: 2.5rem;
  }

  .garra-footer {
    margin-left: 76%;
    width: 13rem;
    margin-top: -2rem;
  }

  .texto-form {
    margin: 0;
    height: 3rem;
  }

  .text-form {
    margin: 7px;
    font-size: 13px;
  }

  .form-size {
    margin-top: 1rem;
  }

  .m-15 {
    margin-left: 0rem;
    margin-right: 0rem;
    margin-bottom: 0rem;
    margin-top: 0;
    padding: 3rem;
  }

  /* Formulario */
  /* Estilos para el modal */
  .modal-form-content {
    background-color: #fefefe;
    margin: 1rem auto;
    padding: 20px;
    border: 1px solid #888;
    width: 50rem;
    height: 95%;
  }
}

@media (max-width: 1599px) {
  .ml-1 {
    margin-left: 1rem;
  }

  .font-size-2 {
    font-size: 21px;
  }

  .ml-cross {
    margin-left: 10rem;
  }

  .soy-miembro {
    margin-top: -3.2rem;
    margin-left: 0.5rem;
    font-weight: 600;
    font-size: 16px;
  }

  .w-10 {
    width: 10rem;
  }

  .scroll-up-btn {
    position: fixed;
    bottom: 20px;
    right: 67px;
    width: 3rem;
    height: 3rem;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    z-index: 999;
    top: 30vw;
  }
  .scroll-up-btn.wa {
    top: calc(30vw + 72px + 8px); 
  }

  .sticky {
    width: 100%;
  }

  .w-100 {
    width: 100%;
  }

  .img-manada {
    width: 44%;
    height: 85%;
  }

  .mt--1 {
    margin-top: 0;
  }

  .galeria {
    width: 21rem;
    height: 18rem;
  }

  .h-bienvenido {
    width: 54%;
    height: 79%;
  }

  .manada-bienvenido {
    height: 23%;
    margin-bottom: 0;
  }

  .div-carousel {
    width: 95%;
    height: auto;
    margin-right: 0;
    margin: 1rem;
  }

  .w-17 {
    width: 11rem;
  }

  .img-boton-negro {
    background-size: contain;
    margin: 0;
    margin-top: -4rem;
    width: 15rem;
  }

  .mas-entrenamiento {
    margin-top: 0;
    height: 5rem;
    margin-left: 0;
    width: 18rem;
  }

  .img-boton-transparente {
    background-size: contain;
  }

  .texto-entrenamiento {
    margin-top: 0.9rem;
    margin-left: 1rem;
    font-size: x-large;
  }

  .texto-actividades {
    margin-top: 1.2rem;
  }

  .font-size {
    font-size: xx-large;
  }

  .mas-actividades {
    width: 21rem;
    height: auto;
  }

  .carousel-slide-entrenamiento {
    width: 100%;
    height: auto;
  }

  .mr-32 {
    margin-right: 14rem;
  }

  .plasta {
    height: auto;
    margin-left: 0rem;
    width: 100%;
    margin-top: 0rem;
    background-size: cover;
    object-fit: cover;
  }

  .lobo {
    margin-left: 8rem;
    margin-top: 7rem;
    width: 25rem;
  }

  .img-entrenamiento {
    width: 100%;
    height: auto;
    margin: 0;
  }

  .carousel-entrenamiento {
    width: 100%;
    height: auto;
  }

  .div-entrenamiento {
    width: 27%;
    height: auto;
    padding: 1rem;
  }

  .font-text {
    margin-left: 33rem;
    margin-top: 4rem;
    width: 67%;
    height: 82%;
  }

  .font-bienvenido {
    font-size: 5rem;
    margin: 0;
    margin-top: 0rem;
    height: auto;
    width: 36rem;
  }

  .manada {
    margin-top: 0rem;
    width: 29rem;
    height: auto;
  }

  .w-77-home {
    width: 77%;
  }

  .texto-p {
    margin-top: 0rem;
    font-size: 21px;
    width: 100%;
    height: auto;
  }

  .mb-2 {
    margin-bottom: 0rem;
  }

  .mt-0-5 {
    margin-top: 0;
  }

  .btn {
    width: 25rem;
    height: 4rem;
    font-size: 1.5rem;
    margin-left: 15rem;
    margin-top: 1rem;
    margin-bottom: 0;
  }

  .garra {
    margin-left: 83%;
    margin-top: 10rem;
  }

  .nosotros {
    width: 100%;
  }

  .entrenamiento {
    width: 100%;
    height: auto;
  }

  .ml-6 {
    margin-left: 0;
  }

  .ml-16 {
    margin-left: 0rem;
  }

  .actividades-div {
    margin-left: 70rem;
  }

  .calendario {
    margin-left: 9rem;
    margin-top: 0rem;
    width: 23rem;
    height: auto;
  }

  .div-registrar {
    width: 35%;
    height: 100%;
    margin-left: 5rem;
    margin-top: 5rem;
  }

  .section-calendario {
    margin-top: 5rem;
  }

  .registrar {
    margin-top: 0rem;
    font-size: 2.5rem;
    margin-left: 2rem;
    height: 4rem;
    width: 26rem;
  }

  .garra-calendario {
    width: 15rem;
    margin-top: 0rem;
    margin-left: 0rem;
    height: auto;
  }

  .w-38 {
    width: 30rem;
  }

  .texto-calendario {
    margin-top: 0rem;
    font-size: 2.5rem;
    width: auto;
  }

  .btn-registrar {
    margin-top: 1rem;
  }

  .ml-3 {
    margin-left: 9rem;
  }

  .div-coaches {
    margin-left: 12rem;
    margin-top: 1rem;
  }

  .coaches {
    margin-left: -2rem;
  }

  .w-34 {
    width: 34rem;
  }

  .titulo-coaches {
    font-size: 1.7rem;
  }

  .ml-17 {
    margin-left: 0rem;
  }

  .w-119 {
    width: 84rem;
  }

  .modal {
    padding-top: 50px;
  }

  #map {
    width: 100%;
  }

  .redes-contacto {
    margin-left: 6rem;
  }

  .logo-footer {
    margin: 1rem 3rem 3rem 3rem;
    margin-left: 1rem;
    width: 20rem;
    height: auto;
  }

  .info {
    margin-left: 3rem;
    margin-top: 0rem;
    font-size: 20px;
    width: 15%;
    height: auto;
    margin-bottom: 0rem;
  }

  .footer-menu {
    width: 100%;
    height: 100%;
  }

  .redes-sociales {
    margin-top: 0;
    margin-bottom: 0;
  }

  .line-footer {
    margin-top: 2rem;
    width: 3px;
  }

  .mt-footer {
    margin-top: 0rem;
  }

  .img-row {
    width: 4rem;
    height: 4rem;
  }

  .footer-registrar {
    margin-left: 2rem;
    width: 27%;
    height: 17rem;
    margin-top: 0rem;
  }

  .texto-footer {
    font-size: 2.4rem;
    width: 26rem;
    height: 5rem;
  }

  .form-contacto {
    position: absolute;
    background: #000;
    width: 27rem;
    margin-left: 12rem;
    color: #fff;
    margin-top: -24rem;
    height: 20rem;
  }

  .registrar-footer {
    margin-top: 0rem;
    font-size: 2.4rem;
    font-weight: 700;
    margin-left: 20px;
    height: 3rem;
  }

  .btn-registrar {
    width: 17rem;
    height: 3.5rem;
    margin-left: 4rem;
    font-size: 1.7rem;
  }

  .btn-footer {
    margin-top: 0rem;
    width: 19rem;
    height: 3.5rem;
    margin-left: 2rem;
    font-size: 2.5rem;
  }

  .garra-footer {
    margin-left: 76%;
    width: 13rem;
    margin-top: -2rem;
  }

  .texto-form {
    margin: 0;
    height: 3rem;
  }

  .text-form {
    margin: 7px;
    font-size: 13px;
  }

  .form-size {
    margin-top: 1rem;
  }

  .m-15 {
    margin-left: 0rem;
    margin-right: 0rem;
    margin-bottom: 0rem;
    margin-top: 0;
    padding: 3rem;
  }

  /* Formulario */
  /* Estilos para el modal */
  .modal-form-content {
    background-color: #fefefe;
    margin: 1rem auto;
    padding: 20px;
    border: 1px solid #888;
    width: 50rem;
    height: 95%;
  }
}

/* Laptop L - Mackbook Air */
@media (max-width: 1440px) {
  .soy-miembro {
    margin-top: -3.5rem;
    margin-left: 0.5rem;
    font-weight: 600;
    font-size: 15px;
  }

  .w-10 {
    width: 9rem;
  }

  .font-size-2 {
    font-size: 15px;
  }

  .scroll-up-btn {
    position: fixed;
    bottom: 20px;
    right: 67px;
    width: 3rem;
    height: 3rem;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    z-index: 999;
    top: 30vw;
  }

  .sticky {
    width: 100%;
  }

  .w-100 {
    width: 100%;
  }

  .img-manada {
    width: 44%;
    height: 85%;
  }

  .mt--1 {
    margin-top: 0;
  }

  .galeria {
    width: 21rem;
    height: 18rem;
  }

  .h-bienvenido {
    width: 46%;
    height: 85%;
  }

  .manada-bienvenido {
    height: 20%;
    margin-bottom: 0;
  }

  .div-carousel {
    width: 95%;
    height: auto;
    margin-right: 0;
    margin: 1rem;
  }

  .w-17 {
    width: 11rem;
  }

  .img-boton-negro {
    background-size: contain;
    margin: 0;
    margin-top: -3.6rem;
    width: 13.5rem;
  }

  .mas-entrenamiento {
    margin-top: 0;
    height: 5rem;
    margin-left: 0;
    width: 14rem;
  }

  .img-boton-transparente {
    background-size: contain;
  }

  .texto-entrenamiento {
    margin-top: 0.9rem;
    margin-left: 1rem;
    font-size: larger;
  }

  .font-size {
    font-size: xx-large;
  }

  .mas-actividades {
    width: 17rem;
    height: auto;
  }

  .carousel-slide-entrenamiento {
    width: 100%;
    height: auto;
  }

  .mr-32 {
    margin-right: 14rem;
  }

  .plasta {
    height: 50rem;
    margin-left: 0rem;
    width: 100%;
    margin-top: -2rem;
    background-size: cover;
    object-fit: scale-down;
  }

  .lobo {
    margin-left: 8rem;
    margin-top: 7rem;
    width: 36%;
    max-width: 28%;
  }

  .img-entrenamiento {
    width: 100%;
    height: auto;
    margin: 0;
  }

  .carousel-entrenamiento {
    width: 100%;
    height: auto;
  }

  .div-entrenamiento {
    width: 27%;
    height: auto;
    padding: 1rem;
  }

  .font-text {
    margin-left: 33rem;
    margin-top: 4rem;
    width: 100%;
    height: 79%;
  }

  .font-bienvenido {
    font-size: 4rem;
    margin: 0;
    margin-top: 0rem;
    height: auto;
    width: 26rem;
  }

  .manada {
    margin-top: 0rem;
    width: 23rem;
    height: auto;
  }

  .texto-p {
    margin-top: 0rem;
    font-size: 18px;
    width: 84%;
    height: auto;
    margin-bottom: 0;
  }

  .mb-2 {
    margin-bottom: 0rem;
  }

  .mt-0-5 {
    margin-top: 0;
  }

  .btn {
    width: 25rem;
    height: 4rem;
    font-size: 1.5rem;
    margin-left: 6rem;
    margin-top: 1rem;
    margin-bottom: 0;
  }

  .garra {
    margin-left: 78%;
    margin-top: 7rem;
  }

  .nosotros {
    width: 100%;
  }

  .entrenamiento {
    width: 100%;
    height: auto;
  }

  .ml-6 {
    margin-left: 0;
  }

  .ml-16 {
    margin-left: 0rem;
  }

  .ml-cross {
    margin-left: 9rem;
  }

  .actividades-div {
    margin-left: 67rem;
  }

  .calendario {
    margin-left: 9rem;
    margin-top: 0rem;
    width: 23rem;
    height: auto;
  }

  .div-registrar {
    width: 35%;
    height: 100%;
    margin-left: 5rem;
    margin-top: 5rem;
  }

  .section-calendario {
    margin-top: 5rem;
  }

  .registrar {
    margin-top: 0rem;
    font-size: 2.5rem;
    margin-left: 2rem;
    height: 4rem;
    width: 26rem;
  }

  .garra-calendario {
    width: 15rem;
    margin-top: 0rem;
    margin-left: 0rem;
    height: auto;
  }

  .w-38 {
    width: 30rem;
  }

  .texto-calendario {
    margin-top: 0rem;
    font-size: 2.5rem;
    width: auto;
  }

  .btn-registrar {
    margin-top: 1rem;
  }

  .ml-3 {
    margin-left: 3rem;
  }

  .div-coaches {
    margin-left: 12rem;
    margin-top: 1rem;
  }

  .coaches {
    margin-left: -2rem;
  }

  .w-34 {
    width: 34rem;
  }

  .titulo-coaches {
    font-size: 1.7rem;
  }

  .ml-17 {
    margin-left: 0rem;
  }

  .w-119 {
    width: 84rem;
  }

  .modal {
    padding-top: 50px;
  }

  #map {
    width: 100%;
  }

  .redes-contacto {
    margin-left: 6rem;
  }

  .logo-footer {
    margin: 1rem 3rem 3rem 3rem;
    margin-left: 1rem;
    width: 20rem;
    height: auto;
  }

  .info {
    margin-left: 3rem;
    margin-top: 0rem;
    font-size: 20px;
    width: 15%;
    height: auto;
    margin-bottom: 0rem;
  }

  .footer-menu {
    width: 100%;
    height: 100%;
  }

  .redes-sociales {
    margin-top: 0;
    margin-bottom: 0;
  }

  .line-footer {
    margin-top: 2rem;
    width: 3px;
  }

  .mt-footer {
    margin-top: 0rem;
  }

  .footer-registrar {
    margin-left: 3rem;
    width: 26%;
    height: 11rem;
    margin-top: 3rem;
  }

  .texto-footer {
    font-size: 1.7rem;
    width: 23rem;
    height: 5rem;
  }

  .form-contacto {
    position: absolute;
    background: #000;
    width: 27rem;
    margin-left: 12rem;
    color: #fff;
    margin-top: -24rem;
    height: 20rem;
  }

  .registrar-footer {
    margin-top: 0rem;
    font-size: 1.7rem;
    font-weight: 700;
    margin-left: 20px;
    height: 3rem;
  }

  .btn-registrar {
    width: 17rem;
    height: 3.5rem;
    margin-left: 4rem;
    font-size: 1.7rem;
  }

  .btn-footer {
    margin-top: 0rem;
    width: 13rem;
    height: 2.5rem;
    margin-left: 2rem;
    font-size: 1.5rem;
  }

  .garra-footer {
    margin-left: 76%;
    width: 13rem;
    margin-top: -2rem;
  }

  .texto-form {
    margin: 0;
    height: 3rem;
  }

  .text-form {
    margin: 7px;
    font-size: 13px;
  }

  .form-size {
    margin-top: 1rem;
  }

  .m-15 {
    margin-left: 0rem;
    margin-right: 0rem;
    margin-bottom: 0rem;
    margin-top: 0;
    padding: 3rem;
  }

  /* Formulario */
  /* Estilos para el modal */
  .modal-form-content {
    background-color: #fefefe;
    margin: 1rem auto;
    padding: 20px;
    border: 1px solid #888;
    width: 50rem;
    height: 95%;
  }
}

@media (min-width: 1025px) and (max-width: 1439px) {
  .soy-miembro {
    margin-top: -3.5rem;
    margin-left: 0.5rem;
    font-weight: 600;
    font-size: 15px;
  }

  .ml-cross {
    margin-left: 1rem;
  }

  .ml-1 {
    margin-left: 0rem;
  }

  .m-2-coaches {
    margin: 1rem;
  }

  .w-10 {
    width: 9rem;
  }

  .scroll-up-btn {
    position: fixed;
    bottom: 20px;
    right: 67px;
    width: 3rem;
    height: 3rem;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    z-index: 999;
    top: 30vw;
  }

  .sticky {
    width: 100%;
  }

  .justify-end {
    justify-content: end;
  }

  .w-100 {
    width: 100%;
  }

  .div-menu {
    width: 100%;
    margin-left: 0rem;
  }

  .w-30 {
    width: 30%;
  }

  .w-89 {
    width: 18rem;
    position: relative;
    height: auto;
  }

  .img-manada {
    width: 100%;
    height: 100%;
  }

  .img-whats {
    width: 33.915px;
    height: 37.131px;
    margin-top: 0.7rem;
  }

  .img-direccion {
    width: 33.044px;
    height: 37.45px;
    margin-top: 0;
  }

  .direccion {
    font-size: 18px;
    margin-top: 0rem;
    margin-left: 1rem;
  }

  .mt--1 {
    margin-top: 0;
  }

  .telefono {
    font-size: 18px;
    margin-left: 1rem;
    margin-top: 1rem;
  }

  .galeria {
    width: 15rem;
    height: 15rem;
  }

  .galeria-section {
    width: 100%;
    height: auto;
    justify-content: center;
  }

  .texto-coaches {
    font-size: 1.2rem;
    margin-top: -1rem;
  }

  .div-img-coaches {
    width: 35rem;
    height: 18rem;
  }

  .h-bienvenido {
    width: 100%;
    height: auto;
  }

  .manada-bienvenido {
    height: 17%;
    margin-bottom: 0;
    margin-top: 0rem;
    width: 100%;
  }

  .nav-menu {
    margin-right: 0;
  }

  .ul-menu {
    margin-left: 0;
    width: 100%;
    margin-right: 2vw;
  }

  .w-13 {
    width: 9rem;
  }

  .font-size-2 {
    font-size: 15px;
  }

  .div-carousel {
    width: 95%;
    height: auto;
    margin-right: 0;
    margin: 1rem;
  }

  .w-17 {
    width: 11rem;
  }

  .img-boton-negro {
    background-size: contain;
    margin: 0;
    margin-top: -16%;
    width: 60%;
    position: relative;
  }

  .mas-entrenamiento {
    margin-top: 0;
    height: 5rem;
    margin-left: 0;
    width: 14rem;
  }

  .img-boton-transparente {
    background-size: contain;
    margin: 0;
    margin-top: 7%;
    width: 85%;
    position: relative;
  }

  .texto-entrenamiento {
    margin-top: 6%;
    margin-left: 0.5rem;
    font-size: 1.7vw;
  }

  .texto-actividades {
    margin-top: 0.9rem;
  }

  .font-size {
    font-size: xx-large;
  }

  .mas-actividades {
    width: 24%;
    height: auto;
  }

  .carousel-slide-entrenamiento {
    width: 100%;
    height: auto;
  }

  .mr-32 {
    margin-right: 0rem;
  }

  .plasta {
    height: auto;
    margin-left: 0rem;
    width: 100%;
    margin-top: 0rem;
    background-size: cover;
    object-fit: scale-down;
    position: absolute;
  }

  .lobo {
    margin-left: 7vw;
    margin-top: 5rem;
    width: 36%;
    max-width: 28%;
  }

  .img-entrenamiento {
    width: 100%;
    height: auto;
    margin: 0;
  }

  .carousel-entrenamiento {
    width: 100%;
    height: auto;
  }

  .div-entrenamiento {
    width: 32%;
    height: auto;
    padding: 1rem;
  }

  .font-text {
    margin-left: 36vw;
    margin-top: 3rem;
    width: 48%;
    height: 45vw;
  }

  .font-bienvenido {
    font-size: 4vw;
    margin: 0;
    margin-top: 0rem;
    height: 3rem;
    width: 22rem;
  }

  .manada {
    margin-top: 0rem;
    width: 52%;
    height: auto;
  }

  .w-77-home {
    width: 100%;
    height: auto;
  }

  .texto-p {
    margin-top: 0rem;
    font-size: 1.4vw;
    width: 100%;
    height: auto;
    margin-bottom: 0;
  }

  .mb-2 {
    margin-bottom: 0rem;
  }

  .mt-0-5 {
    margin-top: 0;
  }

  .btn {
    width: 18rem;
    height: 2.5rem;
    font-size: 1rem;
    margin-left: 8rem;
    margin-top: 0rem;
    margin-bottom: 0;
  }

  .garra {
    margin-left: 82%;
    margin-top: 6rem;
    width: 10%;
  }

  .nosotros {
    width: 100%;
    margin-top: 9cqi;
  }

  .entrenamiento {
    width: 100%;
    height: auto;
  }

  .ml-6 {
    margin-left: 1rem;
  }

  .ml-16 {
    margin-left: 0rem;
  }

  .actividades-div {
    margin-left: 75%;
  }

  .calendario {
    margin-left: 3rem;
    margin-top: 0rem;
    width: 18rem;
    height: auto;
  }

  .div-registrar {
    width: 33%;
    height: 65%;
    margin-left: 3rem;
    margin-top: 5rem;
  }

  .section-calendario {
    margin-top: 5rem;
    width: 100%;
    height: auto;
    justify-content: center;
    display: grid;
  }

  .w-h-garra-100 {
    width: 100%;
    height: auto;
  }

  .registrar {
    margin-top: 0rem;
    font-size: 2rem;
    margin-left: 1rem;
    height: 3rem;
    width: 20rem;
  }

  .coaches-section {
    width: 100%;
    height: auto;
    justify-content: center;
  }

  .garra-calendario {
    width: 13rem;
    margin-top: 0rem;
    margin-left: 0rem;
    height: auto;
  }

  .div-calendario {
    justify-content: center;
  }

  .w-38 {
    width: 24rem;
  }

  .texto-calendario {
    margin-top: 0rem;
    font-size: 2rem;
    width: auto;
  }

  .ml-3 {
    margin-left: 2rem;
  }

  .div-coaches {
    margin-left: 2rem;
    margin-top: 2rem;
  }

  .coaches {
    margin-left: 0rem;
  }

  .w-34 {
    width: 34rem;
  }

  .titulo-coaches {
    font-size: 1.4rem;
  }

  .ml-17 {
    margin-left: 0rem;
  }

  .w-119 {
    width: 60rem;
  }

  .modal {
    padding-top: 50px;
  }

  #map {
    width: 100%;
  }

  .redes-contacto {
    margin-left: 6rem;
  }

  .logo-footer {
    margin: 1rem 3rem 3rem 3rem;
    margin-left: 1rem;
    width: 14rem;
    height: auto;
  }

  .info {
    margin-left: 2rem;
    margin-top: 0rem;
    font-size: 20px;
    width: 15%;
    height: auto;
    margin-bottom: 0rem;
  }

  .footer-menu {
    width: 100%;
    height: 100%;
  }

  .redes-sociales {
    margin-top: 0;
    margin-bottom: 0;
  }

  .line-footer {
    margin-top: 1.5rem;
    width: 3px;
    height: 10rem;
  }

  .mt-footer {
    margin-top: 0rem;
  }

  .footer-registrar {
    margin-left: 2rem;
    width: 26%;
    height: 11rem;
    margin-top: 1rem;
  }

  .texto-footer {
    font-size: 1.7rem;
    width: 23rem;
    height: 5rem;
  }

  .img-row {
    width: 4rem;
    height: 4rem;
  }

  .form-contacto {
    position: absolute;
    background: #000;
    width: 25rem;
    margin-left: 4rem;
    color: #fff;
    margin-top: -20rem;
    height: 16rem;
  }

  .registrar-footer {
    margin-top: 0rem;
    font-size: 1.7rem;
    font-weight: 700;
    margin-left: 20px;
    height: 3rem;
  }

  .btn-registrar {
    width: 15rem;
    height: 3.5rem;
    margin-left: 2rem;
    font-size: 1.7rem;
    margin-top: 1rem;
  }

  .btn-footer {
    margin-top: 0rem;
    width: 13rem;
    height: 2.5rem;
    margin-left: 2rem;
    font-size: 1.5rem;
  }

  .garra-footer {
    margin-left: 81%;
    width: 10rem;
    margin-top: -1rem;
  }

  .texto-form {
    margin: 0;
    height: 3rem;
  }

  .text-form {
    margin: 7px;
    font-size: 13px;
  }

  .form-size {
    margin-top: 1rem;
  }

  .m-15 {
    margin-left: 0rem;
    margin-right: 0rem;
    margin-bottom: 0rem;
    margin-top: 0;
    padding: 3rem;
  }

  .formulario-size {
    margin-top: 1rem;
  }

  /* Formulario */
  /* Estilos para el modal */
  .modal-form-content {
    background-color: #fefefe;
    margin: 2rem auto;
    padding: 20px;
    border: 1px solid #888;
    width: 50rem;
    height: 95%;
  }
}

/* ipad - Laptop */
@media (min-width: 768px) and (max-width: 1024px) {
  .ml-cross {
    margin-left: 1rem;
  }

  .soy-miembro {
    margin-top: -3.2rem;
    margin-left: 0.1rem;
    font-weight: 600;
    font-size: 12px;
  }

  .input-form {
    width: 15rem;
  }

  .w-10 {
    width: 7rem;
  }

  .scroll-up-btn {
    position: fixed;
    bottom: 20px;
    right: 67px;
    width: 3rem;
    height: 3rem;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    z-index: 999;
    top: 30vw;
  }

  .sticky {
    width: 100%;
  }

  .m-2 {
    margin: 1rem;
  }

  .justify-end {
    justify-content: end;
  }

  .w-100 {
    width: 100%;
  }

  .div-menu {
    width: 100%;
    margin-left: 0rem;
  }

  .w-30 {
    width: 27%;
  }

  .w-89 {
    width: 12rem;
    position: relative;
    height: auto;
  }

  .img-manada {
    width: 100%;
    height: 100%;
  }

  .img-whats {
    width: 33.915px;
    height: 37.131px;
    margin-top: 0.7rem;
  }

  .img-direccion {
    width: 33.044px;
    height: 37.45px;
    margin-top: 0;
  }

  .direccion {
    font-size: 18px;
    margin-top: 0rem;
    margin-left: 1rem;
  }

  .mt--1 {
    margin-top: 0;
  }

  .telefono {
    font-size: 18px;
    margin-left: 1rem;
    margin-top: 1rem;
  }

  .galeria {
    width: 10rem;
    height: 10rem;
  }

  .galeria-section {
    width: 100%;
    height: auto;
    justify-content: center;
  }

  .texto-coaches {
    font-size: 1rem;
    margin-top: -1rem;
  }

  .div-img-coaches {
    width: 25rem;
    height: 12rem;
  }

  .h-bienvenido {
    width: 100%;
    height: auto;
  }

  .manada-bienvenido {
    height: 14%;
    margin-bottom: 0;
    margin-top: 0rem;
    width: 100%;
  }

  .nav-menu {
    margin-right: 0;
  }

  .ul-menu {
    margin-left: 0;
    width: 100%;
    margin-right: 2vw;
  }

  .w-13 {
    width: 9rem;
  }

  .font-size-2 {
    font-size: 1.6vw;
  }

  .miembro {
    padding: 7px;
  }

  .div-carousel {
    width: 95%;
    height: auto;
    margin-right: 0;
    margin: 1rem;
  }

  .w-17 {
    width: 9rem;
  }

  .img-boton-negro {
    background-size: contain;
    margin: 0;
    margin-top: -16%;
    width: 60%;
    position: relative;
  }

  .mas-entrenamiento {
    margin-top: 0;
    height: 5rem;
    margin-left: 0;
    width: 14rem;
  }

  .img-boton-transparente {
    background-size: contain;
    margin: 0;
    margin-top: 7%;
    width: 85%;
    position: relative;
  }

  .texto-entrenamiento {
    margin-top: 6%;
    margin-left: 0.5rem;
    font-size: 1.7vw;
  }

  .texto-actividades {
    margin-top: 0.9rem;
  }

  .font-size {
    font-size: xx-large;
  }

  .mas-actividades {
    width: 27%;
    height: auto;
  }

  .carousel-slide-entrenamiento {
    width: 100%;
    height: auto;
  }

  .mr-32 {
    margin-right: 0rem;
  }

  .plasta {
    height: auto;
    margin-left: 0rem;
    width: 100%;
    margin-top: 0rem;
    background-size: cover;
    object-fit: scale-down;
    position: absolute;
  }

  .lobo {
    margin-left: 7vw;
    margin-top: 5rem;
    width: 36%;
    max-width: 28%;
  }

  .img-entrenamiento {
    width: 100%;
    height: auto;
    margin: 0;
  }

  .carousel-entrenamiento {
    width: 100%;
    height: auto;
  }

  .div-entrenamiento {
    width: 32%;
    height: auto;
    padding: 1rem;
  }

  .font-text {
    margin-left: 36vw;
    margin-top: 3rem;
    width: 46vw;
    height: 45vw;
  }

  .font-bienvenido {
    font-size: 4vw;
    margin: 0;
    margin-top: 0rem;
    height: 2.5rem;
    width: 17rem;
  }

  .manada {
    margin-top: 0rem;
    width: 55%;
    height: auto;
  }

  .w-77-home {
    width: 100%;
    height: auto;
  }

  .texto-p {
    margin-top: 0rem;
    font-size: 1.4vw;
    width: 100%;
    height: auto;
    margin-bottom: 0;
  }

  .mb-2 {
    margin-bottom: 0rem;
  }

  .mt-0-5 {
    margin-top: 0;
  }

  .btn {
    width: 17rem;
    height: 2.5rem;
    font-size: 1rem;
    margin-left: 1rem;
    margin-top: 0rem;
    margin-bottom: 0;
  }

  .garra {
    margin-left: 82%;
    margin-top: 6rem;
    width: 10%;
  }

  .nosotros {
    width: 100%;
    margin-top: 9vw;
  }

  .entrenamiento {
    width: 100%;
    height: auto;
  }

  .ml-6 {
    margin-left: 1rem;
  }

  .ml-16 {
    margin-left: 0rem;
  }

  .actividades-div {
    margin-left: 72%;
  }

  .calendario {
    margin-left: -9rem;
    margin-top: 0rem;
    width: 16rem;
    height: auto;
  }

  .div-registrar {
    width: 60%;
    height: 55%;
    margin-left: 3rem;
    margin-top: 5rem;
  }

  .section-calendario {
    margin-top: 5rem;
    width: 100%;
    height: auto;
    justify-content: center;
    display: grid;
  }

  .w-h-garra-100 {
    width: 100%;
    height: auto;
  }

  .registrar {
    margin-top: 0rem;
    font-size: 1.5rem;
    margin-left: 0rem;
    height: 3rem;
    width: 13rem;
  }

  .coaches-section {
    width: 100%;
    height: auto;
    justify-content: center;
  }

  .garra-calendario {
    width: 10rem;
    margin-top: 2rem;
    margin-left: 1rem;
  }

  .div-calendario {
    justify-content: center;
  }

  .w-38 {
    width: 17rem;
  }

  .texto-calendario {
    margin-top: 0rem;
    font-size: 1.3rem;
    width: 14rem;
  }

  .ml-3 {
    margin-left: 0rem;
  }

  .div-coaches {
    margin-left: 2rem;
    margin-top: 2rem;
  }

  .coaches {
    margin-left: 0rem;
  }

  .w-34 {
    width: 34rem;
  }

  .titulo-coaches {
    font-size: 1rem;
  }

  .ml-17 {
    margin-left: 0rem;
  }

  .ml-1 {
    margin-left: 1rem;
  }

  .w-119 {
    width: 40rem;
  }

  .modal {
    padding-top: 50px;
  }

  #map {
    width: 100%;
  }

  .redes-contacto {
    margin-left: 6rem;
  }

  .contacto {
    font-size: 35px;
    color: #fbe800;
    margin: 0.5rem 0 0 3rem;
    font-weight: 500;
  }

  .logo-footer {
    margin: 1rem 3rem 3rem 3rem;
    margin-left: 1rem;
    width: 20vw;
    height: auto;
  }

  .info {
    margin-left: 2rem;
    margin-top: 0rem;
    font-size: 15px;
    width: 15%;
    height: auto;
    margin-bottom: 0rem;
  }

  .footer-menu {
    width: 100%;
    height: 100%;
  }

  .redes-sociales {
    margin-top: 0;
    margin-bottom: 0;
  }

  .line-footer {
    margin-top: 1.5rem;
    width: 3px;
    height: 7rem;
  }

  .mt-footer {
    margin-top: 0rem;
  }

  .footer-registrar {
    margin-left: 2rem;
    width: 26%;
    height: 8rem;
    margin-top: 1rem;
  }

  .texto-footer {
    font-size: 1.2rem;
    width: 13rem;
    height: 4rem;
  }

  .img-row {
    width: 4rem;
    height: 4rem;
  }

  .form-contacto {
    position: absolute;
    background: #000;
    width: 19rem;
    margin-left: 3rem;
    color: #fff;
    margin-top: -20rem;
    height: 17rem;
  }

  .registrar-footer {
    margin-top: 0rem;
    font-size: 1.2rem;
    font-weight: 700;
    margin-left: 9px;
    height: 2rem;
  }

  .btn-registrar {
    width: 13rem;
    height: 3rem;
    margin-left: 0rem;
    font-size: 1.3rem;
    margin-top: 0rem;
  }

  .btn-footer {
    margin-top: 0rem;
    width: 10rem;
    height: 2rem;
    margin-left: 1rem;
    font-size: 1.2rem;
  }

  .garra-footer {
    margin-left: 81%;
    width: 8rem;
    margin-top: -1rem;
  }

  .texto-form {
    margin: 0;
    height: 3rem;
  }

  .text-form {
    margin: 7px;
    font-size: 13px;
  }

  .form-size {
    margin-top: 1rem;
  }

  .m-15 {
    margin-left: 0rem;
    margin-right: 0rem;
    margin-bottom: 0rem;
    margin-top: 0;
    padding: 3rem;
  }

  .formulario-size {
    margin-top: 1rem;
  }

  /* Formulario */
  /* Estilos para el modal */
  .modal-form-content {
    background-color: #fefefe;
    margin: 2rem auto;
    padding: 20px;
    border: 1px solid #888;
    width: 40rem;
    height: 95%;
  }
}

@media (max-width: 480px) {
  body {
    background: #000;
    font-family: "Saira", sans-serif;
    font-weight: 500;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    position: relative;
  }

  .section-calendario {
    width: 100%;
    height: auto;
  }

  .container {
    width: 100%;
    height: 100%;
    position: relative;
  }

  .carousel {
    position: relative;
  }

  .carousel.pointer-event {
    touch-action: pan-y;
  }

  .carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden;
    display: block;
  }

  .carousel-inner::after {
    display: block;
    clear: both;
    content: "";
  }

  .carousel-item {
    position: relative;
    display: none;
    float: left;
    width: 100%;
    margin-right: -100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transition: transform 0.6s ease-in-out;
    padding: 10%;
  }

  @media (prefers-reduced-motion: reduce) {
    .carousel-item {
      transition: none;
    }
  }

  .carousel-item-next,
  .carousel-item-prev,
  .carousel-item.active {
    background: none;
    display: block;
  }

  .active.carousel-item-end,
  .carousel-item-next:not(.carousel-item-start) {
    transform: translateX(100%);
  }

  .active.carousel-item-start,
  .carousel-item-prev:not(.carousel-item-end) {
    transform: translateX(-100%);
  }

  .carousel-fade .carousel-item {
    opacity: 0;
    transition-property: opacity;
    transform: none;
  }

  .carousel-item.active {
    z-index: 1;
    opacity: 1;
  }

  .d-block {
    display: block;
  }

  .ml-4 {
    margin-left: 1rem;
  }

  .img-movil {
    display: block;
  }

  .texto-movil {
    display: block;
  }

  .texto-desktop {
    display: none;
  }

  .manada-bienvenido {
    height: 27%;
    margin-bottom: 0rem;
    width: 100%;
    margin-top: 0;
  }

  .font-bienvenido {
    font-size: 3rem;
    font-weight: 800;
    font-family: sans-serif;
    margin-left: 2rem;
    margin: 0;
    height: 64px;
    width: 100%;
  }

  .plasta-movil {
    z-index: -1;
    width: 100%;
    height: 25%;
    position: absolute;
    margin-left: 0rem;
    margin-top: 1rem;
  }

  .div-lobo {
    width: 100%;
    height: auto;
    position: absolute;
  }

  .plasta {
    display: none;
  }

  .manada {
    position: static;
    margin-top: 0rem;
    margin-left: 0rem;
    width: 73%;
    height: auto;
  }

  .text-bienvenido {
    /* width: 50rem; */
    margin-left: 0rem;
    margin-top: 1rem;
  }

  .texto-p {
    margin-top: 0rem;
    font-size: 18px;
    width: 100%;
    height: auto;
  }

  .descripcion-bienvenido {
    text-align: center;
    width: 100%;
    /* margin-left: -10rem; */
    font-weight: 600;
    margin-top: 0rem;
    height: auto;
  }

  .font-w-700 {
    font-weight: 700;
  }

  span {
    width: 100%;
  }

  .texto-entrenamiento {
    font-size: 1.3rem;
    margin: 0.7rem;
    margin-top: 0.9rem;
    margin-left: 1rem;
  }

  .font-text {
    margin-left: 0rem;
    margin-top: 0rem;
    height: 86rem;
  }

  .font-size-22 {
    font-size: 1.5rem;
  }

  .texto-calendario {
    font-size: 2rem;
    margin-top: 0rem;
    font-weight: 400;
    width: 100%;
    margin-bottom: 0;
  }

  .registrar {
    font-size: 2rem;
    margin-top: 0rem;
    margin-left: 0rem;
    height: auto;
    width: 100%;
    margin-bottom: 0rem;
  }

  .btn-registrar {
    width: 70%;
    height: 3.5rem;
    margin-left: 0rem;
    font-size: 2rem;
    margin-top: 1rem;
    border-radius: 1rem;
  }

  .btn {
    background: #000000;
    width: 100%;
    border-radius: 9px;
    margin-bottom: 0rem;
    height: 3.6rem;
    font-size: 1.2rem;
    font-weight: 700;
    margin-left: 0rem;
    margin-top: 2rem;
  }

  .mas-entrenamiento {
    margin-left: 0rem;
    margin: 0;
    width: 65%;
    height: 7rem;
    background-size: contain;
  }

  .w-100 {
    width: 100%;
    height: auto;
  }

  .lobo-movil {
    width: 55%;
    position: absolute;
    margin-left: 0rem;
    margin-top: 6rem;
    z-index: 1;
    left: 3rem;
    top: 0rem;
  }

  .div-calendario {
    height: 275vw;
  }

  .w-h-garra-100 {
    justify-items: center;
  }

  .lobo {
    margin-left: 0;
    margin-top: 1rem;
  }

  .titulo-coaches {
    font-size: 2rem;
    margin-left: 0rem;
    margin-top: 0rem;
    width: 23rem;
  }

  .texto-coaches {
    font-size: 4.2vw;
    margin-top: 1rem;
    margin-left: 0rem;
    width: 24rem;
  }

  .p-1 {
    padding: 1rem;
  }

  .div-img-coaches {
    width: 100%;
    height: auto;
    justify-content: center;
  }

  .galeria {
    width: 100% !important;
    height: 24rem;
    margin-left: 0rem;
  }

  .contacto {
    font-size: 33px;
    color: #fbe800;
    margin: 0.5rem 0px 0px 2rem;
    font-weight: 600;
    margin-left: 2.5rem;
  }

  .info {
    margin-left: 7rem;
    margin-top: 33rem;
    font-size: 1.3rem;
    position: absolute;
    width: 15rem;
    height: 6%;
  }

  .logo-address {
    height: 1rem;
    width: 1.5rem;
    margin-top: 0.2rem;
  }

  .direccion {
    font-size: 1.2rem;
    /* margin-top: 3.2rem; */
    margin-left: 0rem;
  }

  .carousel-entrenamiento {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
  }

  .carousel-slide-entrenamiento {
    scroll-snap-align: none;
    flex: 0 0 auto;
  }

  .carousel-section {
    margin-left: 0rem;
    width: 100%;
    margin-top: 0rem;
    padding-bottom: 3rem;
  }

  .font-size {
    font-size: 2rem;
  }

  .ml-20 {
    margin-left: 0rem;
  }

  .ml-25 {
    margin-left: 0rem;
  }

  .div-carousel {
    margin-left: 0rem;
    width: 100%;
    height: 13rem;
    margin-right: 0;
  }

  .w-carousel {
    width: 70%;
    height: auto;
  }

  .w-25 {
    width: 80%;
  }

  .img-absolute {
    position: absolute;
  }

  .img-relative {
    position: relative;
  }

  .w-77 {
    width: 100%;
    justify-content: center;
  }

  .w-55 {
    width: 19rem;
    height: auto;
  }

  .ml-46 {
    margin-left: 46rem;
  }

  .ml-40 {
    margin-left: 40rem;
  }

  .ml-4 {
    margin-left: 0rem;
  }

  .m-1 {
    margin: 1rem;
  }

  .self-center {
    justify-content: center;
  }

  .ml-8 {
    margin-left: 5rem;
  }

  .w-65 {
    width: 23rem;
  }

  .m-left {
    margin-left: 6rem;
  }

  .ml-12 {
    margin-left: 0rem;
  }

  .ml-13 {
    margin-left: 6rem;
  }

  .ml-entrenamiento {
    margin-left: 0;
  }

  .m-top-1 {
    margin-top: 0rem;
  }

  .h-60 {
    height: 60rem;
  }

  .w-70 {
    width: 19rem;
  }

  .btn-entrenamiento {
    width: 60%;
    height: 6rem;
    background-size: contain;
    margin-top: -3.8rem;
    margin-left: 0rem;
  }

  .w-40 {
    width: 11rem;
  }

  /* Estilos para los botones indicadores */
  .indicator {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    transition: background-color 0.3s ease;
    -webkit-transition: background-color 0.3s ease;
    background-color: #ffd00094;
  }

  /* Estilo para el botón indicador activo */
  .active {
    background-color: #ffd000;
    /* Amarillo fuerte */
  }

  /* Estilo para los botones indicadores anteriores */
  .previous {
    background-color: #ffd00094;
    /* Amarillo más oscuro */
  }

  .mr-5 {
    margin-right: 3rem;
  }

  .ml-30 {
    margin-left: 8rem;
  }

  .ml-2 {
    margin-left: 0rem;
  }

  .ml-16 {
    margin-left: 0rem;
  }

  .ml-5 {
    margin-left: 3rem;
  }

  .ml-08 {
    margin-left: 0rem;
  }

  .actividades-div {
    /* height: 8rem; */
    display: flex;
    margin-left: 0rem;
    width: 100%;
    margin-top: 0rem;
    justify-content: center;
  }

  .mt-2-9 {
    margin-top: 1.4rem;
  }

  .div-grid {
    display: grid;
  }

  .ml-7 {
    margin-left: 7rem;
  }

  .garra {
    z-index: -1;
    /* position: absolute; */
    margin-left: 7rem;
    margin-top: 56rem;
    /* width: 32rem; */
  }

  .garra-bienvenido {
    z-index: -1;
    position: absolute;
    margin-left: 17rem;
    margin-top: 14rem;
    width: 27%;
  }

  .calendario {
    margin-left: 0rem;
    margin-top: 0rem;
    width: 80%;
    justify-self: center;
    height: auto;
  }

  .div-registrar {
    width: 100%;
    margin-left: 0rem;
    text-align: center;
    margin-top: 0px;
    justify-items: center;
  }

  .garra-calendario {
    z-index: -1;
    position: relative;
    margin-left: 0rem;
    margin-top: 0rem;
    width: 15rem;
    top: 0rem;
    left: 0rem;
    height: auto;
  }

  .p-relative {
    position: relative;
  }

  .div-map {
    width: 100%;
    height: 100%;
  }

  .map {
    border: 0;
    width: 100%;
    height: 45rem;
  }

  .form-contacto {
    position: absolute;
    background: black;
    width: 22rem;
    margin-left: 1rem;
    color: white;
    margin-top: -20rem;
    height: 19rem;
  }

  .linea-contacto {
    background: #fbe800;
    width: 1rem;
    height: 14.5rem;
    z-index: 0;
    position: absolute;
  }

  .img-whats {
    width: 70.915px;
    height: 38.131px;
    /* margin-top: -3.3rem; */
    /* margin-left: 2rem; */
  }

  .telefono {
    font-size: 1.2rem;
    margin-left: 0rem;
    margin-top: 1rem;
  }

  .address {
    display: flex;
    margin-left: 3rem;
  }

  .img-direccion {
    width: 71.044px;
    height: 38.45px;
  }

  .sociales {
    width: 37px;
    height: 49px;
    /* margin-top: -3px; */
  }

  .garra-footer {
    z-index: -1;
    position: absolute;
    width: 9rem;
    margin-top: 0;
    margin-left: 0;
    left: 15rem;
    top: 422rem;
  }

  .logo-footer {
    margin: 0rem;
    margin-left: 3rem;
    width: 20rem;
    margin-top: 0rem;
    height: auto;
  }

  .line-footer {
    background: #fbe800;
    width: 5px;
    height: 14rem;
    margin-top: 34.5rem;
    position: absolute;
    margin-left: 4rem;
  }

  .m-top-5 {
    margin-top: 1rem;
  }

  .redes-sociales {
    margin-top: 0rem;
    margin-bottom: 0rem;
    height: 3rem;
    margin-left: 0rem;
  }

  .footer-registrar {
    width: 85%;
    margin-left: 3rem;
    margin-top: 9px;
    height: 100%;
  }

  .texto-footer {
    font-size: 2rem;
    width: 21rem;
    margin-bottom: 0rem;
    margin-top: 0rem;
    margin-left: 0rem;
    height: 6rem;
  }

  .registrar-footer {
    font-size: 2rem;
    font-weight: 700;
    margin-top: 0rem;
    margin-left: 1rem;
    height: 5rem;
    width: auto;
    margin-bottom: 0;
  }

  .btn-registrar-footer {
    width: 18rem;
    height: auto;
    margin-left: 1rem;
    font-size: 2rem;
    margin-top: 0rem;
    border-radius: 1rem;
  }

  #menu {
    display: none;
  }

  #menuBtn {
    display: block;
    position: absolute;
    margin-left: -6rem;
    margin-top: 3rem;
    background-color: unset;
    color: #ffd000;
  }

  .img-menu {
    width: 3.5rem;
    height: 8rem;
  }

  .img-lobo-menu {
    width: 13rem;
    margin-right: -32rem;
    margin-top: 5rem;
    margin-left: 1rem;
    height: auto;
  }

  .menu-movil {
    position: absolute;
    margin-left: -17rem;
    background: #000000;
    margin-top: 10rem;
    width: 16rem;
    height: 23rem;
    box-shadow: #ffff -15px 13px 5px;
    border-radius: 3rem;
  }

  .menu-tag {
    margin-left: 5rem;
    margin-top: 2rem;
  }

  .miembro {
    height: 19rem;
    margin-top: -6rem;
    margin-left: 3rem;
    align-items: center;
    padding: 10px;
  }

  .font-size-2 {
    font-size: 1rem;
  }

  .wh-miembro {
    width: 10rem;
    height: 8rem;
  }

  .soy-miembro {
    margin-top: -18rem;
    font-size: 1rem;
    margin-left: 0.5rem;
    font-weight: 600;
  }

  .linea-menu {
    margin-left: 3rem;
    margin-top: 2rem;
    width: 4px;
    height: 12rem;
    background: #fbe800;
    z-index: 0;
    position: absolute;
  }

  .scroll-up-btn {
    position: fixed;
    bottom: 20px;
    right: 67px;
    width: 4rem;
    height: 4rem;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    z-index: 999;
    top: 29rem;
    left: 80%;
  }
  .scroll-up-btn.wa {
    top: calc(29rem + 72px + 8px); 
  }

  .row-img {
    width: 2rem;
    height: 2rem;
  }

  .menu-redes {
    margin-left: 3rem;
    margin-top: -8rem;
    display: flex;
  }

  .menu-sociales {
    width: 55px;
    height: 46px;
    margin-top: -53px;
  }

  /* Estilos CSS */

  .div-flex {
    display: flex;
  }

  .justify-end {
    justify-content: unset;
  }

  .sticky {
    position: static;
    top: 0;
    width: 100%;
  }

  .menu-visible {
    display: block !important;
  }

  .modal-content {
    margin-top: 66rem;
    margin-left: 10rem;
    display: block;
    width: 65rem;
  }

  .ml-10 {
    margin-left: 0rem;
  }

  .w-30 {
    width: 100%;
  }

  .form {
    display: block;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(255, 255, 255, 0.952);
    font-weight: 400;
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    color: #33475b;
  }

  /* Estilos para el contenido del modal en pantallas pequeñas */
  .form-content {
    height: auto;
    /* Altura automática para adaptarse al contenido */
    margin-top: 6rem;
    margin-left: 2rem;
    /* Margen alrededor del modal */
    width: 85%;
    font-size: 5rem;
    box-shadow: 0 4px 8px 0 rgba(53, 105, 128, 0.3),
      0 6px 20px 0 rgba(165, 200, 213, 0.41);
  }

  .font-s-2 {
    font-size: 2rem;
  }

  .texto-form {
    font-size: 1rem;
    text-align: left;
    margin: 1rem;
  }

  .form-size {
    font-size: 1rem;
  }

  .form-w {
    width: 100%;
  }

  /* Estilos para los campos de entrada en pantallas pequeñas */
  .input-form {
    width: 18rem;
    font-size: 1rem;
    height: 2rem;
  }

  /* Estilos para el botón de cierre en pantallas pequeñas */
  .close-form {
    font-size: 2rem;
    width: 6rem;
    height: 3rem;
    margin: 1rem;
  }

  .g-recaptcha {
    margin-left: 2rem;
  }

  .mr-3 {
    margin-right: -3rem;
    width: 22rem;
  }

  .text-form {
    text-align: justify;
    line-height: 2rem;
    font-size: 1rem;
    width: 20rem;
    margin: 1rem;
  }

  .check {
    width: 1rem;
    height: 1rem;
  }

  .btn-form {
    background-color: rgb(255, 115, 0);
    width: 7rem;
    height: 3rem;
    border-radius: 0.3rem;
    font-weight: 600;
    margin: 1rem;
    font-size: 1rem;
  }

  .text-area-form {
    width: 19rem;
    font-size: 1rem;
    height: 4rem;
    /* padding: 2rem; */
    margin-left: 0.5rem;
  }

  .error-message {
    font-size: 1rem;
  }

  .form-ml-1 {
    margin-left: 1rem;
  }

  .form-m-2 {
    margin: 2rem;
  }

  main {
    width: 100%;
  }

  .div-bienvenido {
    width: 100%;
    height: auto;
  }

  .texto-de-bienvenida {
    width: 100%;
    margin-top: 2rem;
    height: auto;
    margin-bottom: 0;
  }

  .w-42 {
    width: 100%;
    height: auto;
    margin-top: 1rem;
  }

  .w-42-h-4 {
    width: 100%;
    height: auto;
    margin-top: 1rem;
  }

  .w-0 {
    width: 0;
  }

  .coaches-section {
    margin-top: 0rem;
    width: 100%;
    margin-left: 0rem;
  }

  .div-coaches {
    width: 100%;
    height: auto;
    justify-content: center;
  }

  .galeria-section {
    margin-left: 0rem;
    width: 100%;
    justify-content: center;
  }

  .w-h-100 {
    width: 100%;
    height: auto;
  }

  .footer-section {
    width: 100%;
    height: auto;
    margin-top: 0rem;
    margin-left: 0rem;
  }

  .h-bienvenido {
    height: 64px;
    width: 100%;
  }

  .w-manada {
    display: block;
    width: 100%;
  }

  .mt-limites {
    margin-top: 0rem;
  }

  .instructores {
    font-size: 1.2rem;
    width: 100%;
    height: auto;
  }

  .m-15 {
    margin-left: 0rem;
    margin-bottom: 0rem;
    margin-right: 0rem;
    padding: 0;
    margin-top: 3rem;
  }

  .bienvenido-mt {
    margin-top: 0rem;
  }

  .img-manada {
    width: 100%;
    height: auto;
  }

  .div-inicio {
    position: absolute;
    width: 80%;
    height: auto;
    top: 39rem;
    left: 1rem;
  }

  .titulo-form {
    width: 100%;
    margin-top: 0rem;
  }

  .m-5 {
    margin: 0;
  }

  .introduccion {
    width: 90%;
    height: auto;
  }

  #myForm {
    width: 100%;
  }

  .terminos {
    width: 18rem;
  }

  .section-map {
    width: 100%;
    height: auto;
    position: relative;
    margin-left: 0rem;
  }

  .img-row {
    width: 90%;
    height: auto;
  }

  .ml-gym {
    margin-left: 1rem;
  }

  .img-desktop {
    display: none;
  }
}

@media (max-width: 420px) {
  body {
    background: #000;
    font-family: "Saira", sans-serif;
    font-weight: 500;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    position: relative;
  }

  .section-calendario {
    width: 100%;
    height: auto;
  }

  .container {
    width: 100%;
    height: 100%;
    position: relative;
  }

  .carousel {
    position: relative;
  }

  .carousel.pointer-event {
    touch-action: pan-y;
  }

  .carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden;
    display: block;
  }

  .carousel-inner::after {
    display: block;
    clear: both;
    content: "";
  }

  .carousel-item {
    position: relative;
    display: none;
    float: left;
    width: 100%;
    margin-right: -100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transition: transform 0.6s ease-in-out;
    padding: 10%;
  }

  @media (prefers-reduced-motion: reduce) {
    .carousel-item {
      transition: none;
    }
  }

  .carousel-item-next,
  .carousel-item-prev,
  .carousel-item.active {
    background: none;
    display: block;
  }

  .active.carousel-item-end,
  .carousel-item-next:not(.carousel-item-start) {
    transform: translateX(100%);
  }

  .active.carousel-item-start,
  .carousel-item-prev:not(.carousel-item-end) {
    transform: translateX(-100%);
  }

  .carousel-fade .carousel-item {
    opacity: 0;
    transition-property: opacity;
    transform: none;
  }

  .carousel-item.active {
    z-index: 1;
    opacity: 1;
  }

  .d-block {
    display: block;
  }

  .ml-4 {
    margin-left: 1rem;
  }

  .img-movil {
    display: block;
  }

  .texto-movil {
    display: block;
  }

  .texto-desktop {
    display: none;
  }

  .manada-bienvenido {
    height: 28%;
    margin-bottom: 0rem;
    width: 100%;
    margin-top: 0;
  }

  .font-bienvenido {
    font-size: 3rem;
    font-weight: 800;
    font-family: sans-serif;
    margin-left: 2rem;
    margin: 0;
    height: 64px;
    width: 100%;
  }

  .plasta-movil {
    z-index: -1;
    width: 100%;
    height: 27%;
    position: absolute;
    margin-left: 0rem;
    margin-top: 1rem;
  }

  .div-lobo {
    width: 100%;
    height: auto;
    position: absolute;
  }

  .plasta {
    display: none;
  }

  .manada {
    position: static;
    margin-top: 0rem;
    margin-left: 0rem;
    width: 73%;
    height: auto;
  }

  .text-bienvenido {
    /* width: 50rem; */
    margin-left: 0rem;
    margin-top: 1rem;
  }

  .texto-p {
    margin-top: 0rem;
    font-size: 18px;
    width: 100%;
    height: auto;
  }

  .descripcion-bienvenido {
    text-align: center;
    width: 100%;
    /* margin-left: -10rem; */
    font-weight: 600;
    margin-top: 0rem;
    height: auto;
  }

  .font-w-700 {
    font-weight: 700;
  }

  span {
    width: 100%;
  }

  .texto-entrenamiento {
    font-size: 1.2rem;
    margin: 0.7rem;
    margin-top: 0.6rem;
    margin-left: 1rem;
  }

  .font-text {
    margin-left: 0rem;
    margin-top: 0rem;
    height: 86rem;
  }

  .font-size-22 {
    font-size: 1.5rem;
  }

  .texto-calendario {
    font-size: 2rem;
    margin-top: 0rem;
    font-weight: 400;
    width: 100%;
    margin-bottom: 0;
  }

  .registrar {
    font-size: 2rem;
    margin-top: 0rem;
    margin-left: 0rem;
    height: auto;
    width: 100%;
    margin-bottom: 0rem;
  }

  .btn-registrar {
    width: 70%;
    height: 3.5rem;
    margin-left: 0rem;
    font-size: 2rem;
    margin-top: 1rem;
    border-radius: 1rem;
  }

  .btn {
    background: #000000;
    width: 100%;
    border-radius: 9px;
    margin-bottom: 0rem;
    height: 3.6rem;
    font-size: 1.2rem;
    font-weight: 700;
    margin-left: 0rem;
    margin-top: 2rem;
  }

  .mas-entrenamiento {
    margin-left: 0rem;
    margin: 0;
    width: 65%;
    height: 7rem;
    background-size: contain;
  }

  .w-100 {
    width: 100%;
    height: auto;
  }

  .lobo-movil {
    width: 55%;
    position: absolute;
    margin-left: 0rem;
    margin-top: 6rem;
    z-index: 1;
    left: 3rem;
    top: 0rem;
  }

  .div-calendario {
    height: 275vw;
  }

  .w-h-garra-100 {
    justify-items: center;
  }

  .lobo {
    margin-left: 0;
    margin-top: 1rem;
  }

  .titulo-coaches {
    font-size: 2rem;
    margin-left: 0rem;
    margin-top: 0rem;
    width: 23rem;
  }

  .texto-coaches {
    font-size: 4.2vw;
    margin-top: 1rem;
    margin-left: 0rem;
    width: 24rem;
  }

  .p-1 {
    padding: 1rem;
  }

  .div-img-coaches {
    width: 100%;
    height: auto;
    justify-content: center;
  }

  .galeria {
    width: 100% !important;
    height: 24rem;
    margin-left: 0rem;
  }

  .contacto {
    font-size: 33px;
    color: #fbe800;
    margin: 0.5rem 0px 0px 2rem;
    font-weight: 600;
    margin-left: 2.5rem;
  }

  .info {
    margin-left: 7rem;
    margin-top: 33rem;
    font-size: 1.3rem;
    position: absolute;
    width: 15rem;
    height: 6%;
  }

  .logo-address {
    height: 1rem;
    width: 1.5rem;
    margin-top: 0.2rem;
  }

  .direccion {
    font-size: 1.2rem;
    /* margin-top: 3.2rem; */
    margin-left: 0rem;
  }

  .carousel-entrenamiento {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
  }

  .carousel-slide-entrenamiento {
    scroll-snap-align: none;
    flex: 0 0 auto;
  }

  .carousel-section {
    margin-left: 0rem;
    width: 100%;
    margin-top: 5rem;
  }

  .font-size {
    font-size: 2rem;
  }

  .ml-20 {
    margin-left: 0rem;
  }

  .ml-25 {
    margin-left: 0rem;
  }

  .div-carousel {
    margin-left: 0rem;
    width: 100%;
    height: 13rem;
    margin-right: 0;
  }

  .w-carousel {
    width: 70%;
    height: auto;
  }

  .w-25 {
    width: 80%;
  }

  .img-absolute {
    position: absolute;
  }

  .img-relative {
    position: relative;
  }

  .w-77 {
    width: 100%;
    justify-content: center;
  }

  .w-55 {
    width: 19rem;
    height: auto;
  }

  .ml-46 {
    margin-left: 46rem;
  }

  .ml-40 {
    margin-left: 40rem;
  }

  .ml-4 {
    margin-left: 0rem;
  }

  .m-1 {
    margin: 1rem;
  }

  .self-center {
    justify-content: center;
  }

  .ml-8 {
    margin-left: 5rem;
  }

  .w-65 {
    width: 23rem;
  }

  .m-left {
    margin-left: 6rem;
  }

  .ml-12 {
    margin-left: 0rem;
  }

  .ml-13 {
    margin-left: 6rem;
  }

  .ml-entrenamiento {
    margin-left: 0;
  }

  .m-top-1 {
    margin-top: 0rem;
  }

  .h-60 {
    height: 60rem;
  }

  .w-70 {
    width: 19rem;
  }

  .btn-entrenamiento {
    width: 60%;
    height: 6rem;
    background-size: contain;
    margin-top: -3.4rem;
    margin-left: 0rem;
  }

  .w-40 {
    width: 11rem;
  }

  /* Estilos para los botones indicadores */
  .indicator {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    transition: background-color 0.3s ease;
    -webkit-transition: background-color 0.3s ease;
    background-color: #ffd00094;
  }

  /* Estilo para el botón indicador activo */
  .active {
    background-color: #ffd000;
    /* Amarillo fuerte */
  }

  /* Estilo para los botones indicadores anteriores */
  .previous {
    background-color: #ffd00094;
    /* Amarillo más oscuro */
  }

  .mr-5 {
    margin-right: 3rem;
  }

  .ml-30 {
    margin-left: 8rem;
  }

  .ml-2 {
    margin-left: 0rem;
  }

  .ml-16 {
    margin-left: 0rem;
  }

  .ml-5 {
    margin-left: 3rem;
  }

  .ml-08 {
    margin-left: 0rem;
  }

  .actividades-div {
    /* height: 8rem; */
    display: flex;
    margin-left: 0rem;
    width: 100%;
    margin-top: 0rem;
    justify-content: center;
  }

  .mt-2-9 {
    margin-top: 1.4rem;
  }

  .div-grid {
    display: grid;
  }

  .ml-7 {
    margin-left: 7rem;
  }

  .garra {
    z-index: -1;
    /* position: absolute; */
    margin-left: 7rem;
    margin-top: 56rem;
    /* width: 32rem; */
  }

  .garra-bienvenido {
    z-index: -1;
    position: absolute;
    margin-left: 17rem;
    margin-top: 14rem;
    width: 27%;
  }

  .calendario {
    margin-left: 0rem;
    margin-top: 0rem;
    width: 80%;
    justify-self: center;
    height: auto;
  }

  .div-registrar {
    width: 100%;
    margin-left: 0rem;
    text-align: center;
    margin-top: 0px;
    justify-items: center;
  }

  .garra-calendario {
    z-index: -1;
    position: relative;
    margin-left: 0rem;
    margin-top: 0rem;
    width: 15rem;
    top: 0rem;
    left: 0rem;
    height: auto;
  }

  .p-relative {
    position: relative;
  }

  .div-map {
    width: 100%;
    height: 100%;
  }

  .map {
    border: 0;
    width: 100%;
    height: 45rem;
  }

  .form-contacto {
    position: absolute;
    background: black;
    width: 22rem;
    margin-left: 1rem;
    color: white;
    margin-top: -20rem;
    height: 19rem;
  }

  .linea-contacto {
    background: #fbe800;
    width: 1rem;
    height: 14.5rem;
    z-index: 0;
    position: absolute;
  }

  .img-whats {
    width: 70.915px;
    height: 38.131px;
    /* margin-top: -3.3rem; */
    /* margin-left: 2rem; */
  }

  .telefono {
    font-size: 1.2rem;
    margin-left: 0rem;
    margin-top: 1rem;
  }

  .address {
    display: flex;
    margin-left: 3rem;
  }

  .img-direccion {
    width: 71.044px;
    height: 38.45px;
  }

  .sociales {
    width: 37px;
    height: 49px;
    /* margin-top: -3px; */
  }

  .garra-footer {
    z-index: -1;
    position: absolute;
    width: 9rem;
    margin-top: 0;
    margin-left: 0;
    left: 15rem;
    top: 412rem;
  }

  .logo-footer {
    margin: 0rem;
    margin-left: 3rem;
    width: 20rem;
    height: auto;
    margin-top: 0rem;
  }

  .line-footer {
    background: #fbe800;
    width: 5px;
    height: 14rem;
    margin-top: 34.5rem;
    position: absolute;
    margin-left: 4rem;
  }

  .m-top-5 {
    margin-top: 1rem;
  }

  .redes-sociales {
    margin-top: 0rem;
    margin-bottom: 0rem;
    height: 3rem;
    margin-left: 0rem;
  }

  .footer-registrar {
    width: 85%;
    margin-left: 3rem;
    margin-top: 9px;
    height: 100%;
  }

  .texto-footer {
    font-size: 2rem;
    width: 21rem;
    margin-bottom: 0rem;
    margin-top: 0rem;
    margin-left: 0rem;
    height: 6rem;
  }

  .registrar-footer {
    font-size: 2rem;
    font-weight: 700;
    margin-top: 0rem;
    margin-left: 1rem;
    height: 5rem;
    width: auto;
    margin-bottom: 0;
  }

  .btn-registrar-footer {
    width: 18rem;
    height: auto;
    margin-left: 1rem;
    font-size: 2rem;
    margin-top: 0rem;
    border-radius: 1rem;
  }

  #menu {
    display: none;
  }

  #menuBtn {
    display: block;
    position: absolute;
    margin-left: -6rem;
    margin-top: 3rem;
    background-color: unset;
    color: #ffd000;
  }

  .img-menu {
    width: 3.5rem;
    height: 8rem;
  }

  .img-lobo-menu {
    width: 13rem;
    margin-right: -32rem;
    margin-top: 5rem;
    margin-left: 1rem;
    height: auto;
  }

  .menu-movil {
    position: absolute;
    margin-left: -17rem;
    background: #000000;
    margin-top: 10rem;
    width: 16rem;
    height: 23rem;
    box-shadow: #ffff -15px 13px 5px;
    border-radius: 3rem;
  }

  .menu-tag {
    margin-left: 5rem;
    margin-top: 2rem;
  }

  .miembro {
    height: 19rem;
    margin-top: -6rem;
    margin-left: 3rem;
    align-items: center;
    padding: 10px;
  }

  .font-size-2 {
    font-size: 1rem;
  }

  .wh-miembro {
    width: 10rem;
    height: 8rem;
  }

  .soy-miembro {
    margin-top: -18rem;
    font-size: 1rem;
    margin-left: 0.5rem;
    font-weight: 600;
  }

  .linea-menu {
    margin-left: 3rem;
    margin-top: 2rem;
    width: 4px;
    height: 12rem;
    background: #fbe800;
    z-index: 0;
    position: absolute;
  }

  .scroll-up-btn {
    position: fixed;
    bottom: 20px;
    right: 67px;
    width: 4rem;
    height: 4rem;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    z-index: 999;
    top: 29rem;
    left: 80%;
  }
  .scroll-up-btn.wa {
    top: calc(29rem + 72px + 8px); 
  }

  .row-img {
    width: 2rem;
    height: 2rem;
  }

  .menu-redes {
    margin-left: 3rem;
    margin-top: -8rem;
    display: flex;
  }

  .menu-sociales {
    width: 55px;
    height: 46px;
    margin-top: -53px;
  }

  /* Estilos CSS */

  .div-flex {
    display: flex;
  }

  .justify-end {
    justify-content: unset;
  }

  .sticky {
    position: static;
    top: 0;
    width: 100%;
  }

  .menu-visible {
    display: block !important;
  }

  .modal-content {
    margin-top: 66rem;
    margin-left: 10rem;
    display: block;
    width: 65rem;
  }

  .ml-10 {
    margin-left: 0rem;
  }

  .w-30 {
    width: 100%;
  }

  .form {
    display: block;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(255, 255, 255, 0.952);
    font-weight: 400;
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    color: #33475b;
  }

  /* Estilos para el contenido del modal en pantallas pequeñas */
  .form-content {
    height: auto;
    /* Altura automática para adaptarse al contenido */
    margin-top: 6rem;
    margin-left: 2rem;
    /* Margen alrededor del modal */
    width: 85%;
    font-size: 5rem;
    box-shadow: 0 4px 8px 0 rgba(53, 105, 128, 0.3),
      0 6px 20px 0 rgba(165, 200, 213, 0.41);
  }

  .font-s-2 {
    font-size: 2rem;
  }

  .texto-form {
    font-size: 1rem;
    text-align: left;
    margin: 1rem;
  }

  .form-size {
    font-size: 1rem;
  }

  .form-w {
    width: 100%;
  }

  /* Estilos para los campos de entrada en pantallas pequeñas */
  .input-form {
    width: 18rem;
    font-size: 1rem;
    height: 2rem;
  }

  /* Estilos para el botón de cierre en pantallas pequeñas */
  .close-form {
    font-size: 2rem;
    width: 6rem;
    height: 3rem;
    margin: 1rem;
  }

  .g-recaptcha {
    margin-left: 2rem;
  }

  .mr-3 {
    margin-right: -3rem;
    width: 22rem;
  }

  .text-form {
    text-align: justify;
    line-height: 2rem;
    font-size: 1rem;
    width: 20rem;
    margin: 1rem;
  }

  .check {
    width: 1rem;
    height: 1rem;
  }

  .btn-form {
    background-color: rgb(255, 115, 0);
    width: 7rem;
    height: 3rem;
    border-radius: 0.3rem;
    font-weight: 600;
    margin: 1rem;
    font-size: 1rem;
  }

  .text-area-form {
    width: 19rem;
    font-size: 1rem;
    height: 4rem;
    /* padding: 2rem; */
    margin-left: 0.5rem;
  }

  .error-message {
    font-size: 1rem;
  }

  .form-ml-1 {
    margin-left: 1rem;
  }

  .form-m-2 {
    margin: 2rem;
  }

  main {
    width: 100%;
  }

  .div-bienvenido {
    width: 100%;
    height: auto;
  }

  .texto-de-bienvenida {
    width: 100%;
    margin-top: 2rem;
    height: auto;
    margin-bottom: 0;
  }

  .w-42 {
    width: 100%;
    height: auto;
    margin-top: 1rem;
  }

  .w-42-h-4 {
    width: 100%;
    height: auto;
    margin-top: 1rem;
  }

  .w-0 {
    width: 0;
  }

  .coaches-section {
    margin-top: 0rem;
    width: 100%;
    margin-left: 0rem;
  }

  .div-coaches {
    width: 100%;
    height: auto;
    justify-content: center;
  }

  .galeria-section {
    margin-left: 0rem;
    width: 100%;
    justify-content: center;
  }

  .w-h-100 {
    width: 100%;
    height: auto;
  }

  .footer-section {
    width: 100%;
    height: auto;
    margin-top: 0rem;
    margin-left: 0rem;
  }

  .h-bienvenido {
    height: 64px;
    width: 100%;
  }

  .w-manada {
    display: block;
    width: 100%;
  }

  .mt-limites {
    margin-top: 0rem;
  }

  .instructores {
    font-size: 1.2rem;
    width: 100%;
    height: auto;
  }

  .m-15 {
    margin-left: 0rem;
    margin-bottom: 0rem;
    margin-right: 0rem;
    padding: 0;
    margin-top: 3rem;
  }

  .bienvenido-mt {
    margin-top: 0rem;
  }

  .img-manada {
    width: 100%;
    height: auto;
  }

  .div-inicio {
    position: absolute;
    width: 80%;
    height: auto;
    top: 37rem;
    left: 1rem;
  }

  .titulo-form {
    width: 100%;
    margin-top: 0rem;
  }

  .m-5 {
    margin: 0;
  }

  .introduccion {
    width: 90%;
    height: auto;
  }

  #myForm {
    width: 100%;
  }

  .terminos {
    width: 18rem;
  }

  .section-map {
    width: 100%;
    height: auto;
    position: relative;
    margin-left: 0rem;
  }

  .img-row {
    width: 90%;
    height: auto;
  }

  .ml-gym {
    margin-left: 1rem;
  }

  .img-desktop {
    display: none;
  }
}

.menu-oculto {
  display: none;
}

#scrollUpButton img{
  width: 47px!important;
  height: 47px!important;

}

@media (max-width: 500px) {
  .footer-section {
    position: relative;
  }
  .garra-footer {
    top: 150%;
  }
}

.paymentSection{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap:80px;
  margin-top:50px;
} 
.paymentBtns{
  padding:40px 60px; 
  border-radius: 60px;
  border:2px solid #FFD900; 
}

@media (max-width: 600px) {
  .paymentSection{
    gap:40px;

  }
  .paymentBtns{
    padding:23px 28px; 
  }
  button#payonline{
    padding:12px 25px; 
  }
}

ul.tab {
  list-style-type:none;
  margin: 0;
}
ul.tab li {
  float: left;
  padding: 0;
}
ul.tab li label {
background: transparent;  
padding: 6px 15px;
color: white;
border: none;
display: inline-block;
font-size: calc(13px + (34 - 13) * ((100vw - 430px) / (1920 - 430)));
font-weight: 700!important;
cursor:pointer;
}
ul.tab li input[type="radio"] {
  opacity: 0;
  width:1px;
  height:1px;
}
ul.tab li input[type="radio"]:checked ~ label {
  background: #FFD900;
  border-radius: 20px;
  color: black;
}

button#payonline{
  background: #FFD900;
  border-radius: 8px;
  color: black;
  width: auto;
  font-size: calc(16px + (34 - 16) * ((100vw - 430px) / (1920 - 430)));
  font-weight: 700!important;
  cursor: pointer;
  padding:12px 45px; 
}