header {
  background: #fff;
  height: 150px;
  position: relative;
  width: 100%;
  font-family: "Montserrat";
}

#logo {
  float: left;
  padding: 6px relative;
  width: auto;
  height: 60px;

  a {
    display: block;
    text-decoration: none;
    text-align: center;
    color: #fff;
    font-weight: bold;
    line-height: 44px;
  }
}

.imagen-principal {
    position: relative;
    display: inline-block;
    text-align: center;
}

/* Fondo blanco, letra negra
.centrado{
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: "Montserrat";
    text-align: center;
    font-size: 45px;
    background-color: rgba(255, 255, 255, 0.5);;
}*/

/* Fondo negro, letra blanca*/
.centrado{
    width: clamp(75%,50%,100%);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: "Montserrat";
    text-align: center;
    /*font-size: 45px;*/
    font-size: clamp(22px,4vw,50px);
    background-color: rgba(0, 0, 0, 0.4);
    color: #fff;
}

/* Fondo blanco, letra negra*/
.centradoGaleria{
    width: clamp(75%,50%,100%);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: "Montserrat";
    text-align: center;
    font-size: clamp(22px,4vw,50px);
    background-color: rgba(255, 255, 255, 0.6);
    color: #000000;
}

.imagen-responsive {
  max-width: 100%; /* La imagen nunca será más ancha que su contenedor */
  height: auto; /* La altura se ajustará automáticamente para mantener la proporción */
}

#menu {
  position: absolute;
  top: 60px;
  width: 100%;
  ul {
    max-height: 0;
    overflow: hidden;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 14px;
  }

  li {
    display: block;
    text-align: right;
    font-size: 22px;

    a {
      display: block;
      color: #000000;
      text-decoration: none;
      line-height: 60px;
      padding: 0 26px;

      &:active,
    }
  }

  .open-menu {
    /*box-shadow: 0 1px 2px rgba(0,0,0,.5);*/
    max-height: 400px;
    transition: max-height .4s ease;
  }
}

#nav-mobile {
  background: transparent;
  border: 0;
  cursor: pointer;
  float: right;
  width: 60px;
  height: 60px;
  position: absolute;
  right: 0;
  top: -60px;
  opacity: 0.6;

  &.nav-open {
    opacity: 1;
  }

  span {
    display: block;
    width: 60%;
    margin: 4px auto;
    height: 4px;
    background: #000000
  }
}

@media only screen and (min-width: 768px) {
  #nav-mobile{ display: none; }

  #menu {
    width: auto;
    float: right;
    top: 0;
    position: relative;

    .open-menu {
      box-shadow: none;
    }

    ul {
      max-height: inherit;
    }

    li {
      float: left;
      border: 0;
      background: transparent;

      a {
        display: block;
        color: #000000;
        padding: 40px 26px;

        &:hover {
          background: #fff;
        }
      }
    }
  }
}

/* Content */
main {
  display: flex;
  min-height: 400px;
  color: #fff;
  margin: 15px;
  align-items: center;
  background-image: linear-gradient(to right, #f78ca0 0%, #f9748f 19%, #fd868c 60%, #fe9a8b 100%);
}

/*
main h1 {
  width: 100%;
  text-align: center;

}*/

.contenedor-tabla {
  width: 75%; /* Ancho del contenedor */
  margin: 0 auto; /* Esto centrará horizontalmente el contenedor */

}

.tabla-slides {
  border-collapse: collapse;
  width: 100%;
  font-family: "Montserrat";
  font-size: clamp(22px,4vw,50px);
}

.tabla-acercaDe {
  border-collapse: collapse;
  width: 90%;
  font-family: "Montserrat";
  font-size: 25px;
}

.tabla-acercaDe td {
  width: 150px; /* Ancho de las celdas */
 /* height: 1000px; /* Alto de las celdas */
  text-align: justify;
  /*display: flex;
  justify-content: center;
  align-items: center;*/
}

.textoacercade {
  width: 90%;
  font-size: clamp(2vh,1.5vw,25px);
  text-align: justify;
  align-items: center;
  display: flex;
}

    @media screen and (max-width: 1200px) {
      .textoacercade {
        display: block; /* Cambiar a bloque en pantallas pequeñas */
      }
    }

.tabla-slides td {
  width: 1000px; /* Ancho de las celdas */
  height: 1000px; /* Alto de las celdas */
  text-align: center;
  font-size: clamp(22px,4vw,50px);
  /*display: flex;
  justify-content: center;
  align-items: center;*/
}

.eventos-responsive {
  max-width: 100%; /* La imagen nunca será más ancha que su contenedor */
  height: auto; /* La altura se ajustará automáticamente para mantener la proporción */
  object-fit: cover; /* Para ajustar la imagen manteniendo su relación de aspecto */
}

/*
.v-line{
 border-left: thick solid #572600;
 height:86%;
 left: 50%;
 position: absolute;
 margin-top: 100px;
}*/


/*Inicio CSS del slides Eventos*/


.div_slide {
  font-size: clamp(22px,4vw,50px);
  text-align: justify;
  justify-content: center;
  align-items: center;
  display: flex;
  margin-top: 3%;
  gap: 10%;
}

.slider{
  width: clamp(2vw,100%,750px);
  height: clamp(2vh,100%,750px);
  border-radius: 15px;
  overflow: hidden;
}

.slides{
  width: clamp(500%,500%,750px);
  height: 750px;
  display: flex;
}

.slides input{
  display: none;
}

.slide{
  width: clamp(20%,20%,750px);
  transition: 2s;
}

.slides img{
  width: clamp(350px,100%,750px);
  height: 750px;
}

.nav-manual{
  position: absolute;
  width: clamp(2vw,100%,750px);
  margin-top: -40px;
  display: flex;
  justify-content: center;
}

.manual-btn{
  border: 2px solid #e5e5e5;
  padding: 5px;
  border-radius: 10px;
  cursor: pointer;
  transition: 1s;
}

.manual-btn:not(last-child){
  margin-right: 40px;
}

.manual-btn:hover{
  background-color: #e5e5e5;
}

#radio1:checked ~ .first {
  margin-left: 0;
}
#radio2:checked ~ .first {
  margin-left: -20%;
}
#radio3:checked ~ .first {
  margin-left: -40%;
}
#radio4:checked ~ .first {
  margin-left: -60%;
}
#radio5:checked ~ .first {
  margin-left: -80%;
}

.nav-auto{
  position: absolute;
  display: flex;
  width: clamp(2vw,100%,750px);
  justify-content: center;
  margin-top: 710px;
}

.nav-auto div{
  border: 2px solid #e5e5e5;
  padding: 5px;
  border-radius: 10px;
  transition: 1s;
}

.nav-auto div:not(last-child) {
  margin-right: 40px;
}

#radio1:checked ~ .nav-auto .auto-btn1{
  background-color: #e5e5e5;
}
#radio2:checked ~ .nav-auto .auto-btn2{
  background-color: #e5e5e5;
}
#radio3:checked ~ .nav-auto .auto-btn3{
  background-color: #e5e5e5;
}
#radio4:checked ~ .nav-auto .auto-btn4{
  background-color: #e5e5e5;
}
#radio5:checked ~ .nav-auto .auto-btn5{
  background-color: #e5e5e5;
}

@media screen and (max-width: 1200px) {
  .div_slide {
    display: block;
    text-align: center; /* Centra el texto horizontalmente cuando display es block */
  }

  .slides {
    height: 500px;
  }

  .slides img{
    height: 450px;
  }
  .nav-auto{
    margin-top: 460px;
  }
}

/*Fin CSS del slides Eventos*/

/*Inicio CSS tabla patrocinios*/
.tabla-patrocinios {
  margin: 20;
  border-collapse: collapse;
  font-family: "Montserrat";
  font-size: clamp(22px,4vw,50px);
  margin-top: 3%;
}

.tabla-patrocinios td {
  width: 1000px; /* Ancho de las celdas */
  text-align: center;
}

/*
.tabla-patrocinios img {
  width: 250px;
  height: 100%;
}
*/
/*Fin CSS tabla patrocinios*/

/*Inicio CSS tabla patrocinios
.tabla-patrocinios {
  border-collapse: collapse;
  font-family: "Montserrat";
  font-size: clamp(22px,4vw,50px);
  margin-top: 3%;
}

.tabla-patrocinios td {
  width: 1000px;
  text-align: center;
}

.tabla-patrocinios img {
  width: 250px;
  height: 100%;
}
Fin CSS tabla patrocinios*/

/*Inicio Footer*/

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&display=swap');
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Montserrat",
}
/*:::::Pie de Pagina*/
.pie-pagina{
    width: 100%;
    background-color: #000000;
    text-align: center;
}
.pie-pagina .grupo-1{
    width: 100%;
    max-width: 1200px;
    margin: auto;
    display:grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap:50px;
    padding: 45px 0px;
}
.pie-pagina .grupo-1 .box figure{
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.pie-pagina .grupo-1 .box figure img{
    width: 250px;
}
.pie-pagina .grupo-1 .box h2{
    color: #fff;
    margin-bottom: 25px;
    font-size: 20px;
}
.pie-pagina .grupo-1 .box p{
    color: #efefef;
    margin-bottom: 10px;
}
.pie-pagina .grupo-1 .red-social a{
    display: inline-block;
    text-decoration: none;
    width: 90px;
    height: 90px;
    line-height: 45px;
    color: #fff;
    margin-right: 10px;
    background-color: #000000;
    text-align: center;
    transition: all 300ms ease;
    font-size: 50px;
}

/*Color mouse hover*/
.pie-pagina .grupo-1 .red-social #FB:hover {
    color: blue; /* Cambiar el color para Facebook */
}

.pie-pagina .grupo-1 .red-social #IG:hover {
    color: purple; /* Cambiar el color para Instagram */
}

.pie-pagina .grupo-1 .red-social #SP:hover {
    color: green; /* Cambiar el color para Spotify */
}

.pie-pagina .grupo-1 .red-social #YT:hover {
    color: red; /* Cambiar el color para YouTube */
}

.pie-pagina .grupo-2{
    background-color: #000000;
    padding: 15px 10px;
    text-align: center;
    color: #fff;
}
.pie-pagina .grupo-2 small{
    font-size: 15px;
}
@media screen and (max-width:800px){
    .pie-pagina .grupo-1{
        width: 90%;
        grid-template-columns: repeat(1, 1fr);
        grid-gap:30px;
        padding: 35px 0px;
    }
}

/*Fin Footer*/

.textoBasesConcurso{
  width: 100%;
  height: 100%;
  font-size: clamp(20px,3vw,50px);
  font-family: "Montserrat";
  text-align: center;
  padding: 50px 0px;
}

.video_bases{
  position: relative;
  overflow: hidden;
  padding-bottom: 28%;
  height: 0;
}



.video_bases iframe {
  position: absolute;
  top:0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 1200px) {
  .video_bases {
    padding-bottom: 56.25%;
  }
}


/*Galeria*/

.contenedor_galeria {
  display: grid;
  align-items: center;
  justify-content: center;
  margin-top: 30px;
  margin-bottom: 30px;
}

.contenedor_galeria .img-contenedor {
  width: clamp(300px,100%,750px);
  height: 100%;
  margin-bottom: 20px;
}

.contenedor_galeria .img-contenedor .main_img {
  width: 100%;
  height: 100%;
  border-radius: 5px;
  box-shadow: 0 5px 5px rgba(1,23,46,0.6);
  object-fit: cover;
}

.contenedor_galeria .thumbnail_contenedor {
  margin-top: 20px;
  height: 80px;
  display: flex;
  justify-content:space-between;
}

.contenedor_galeria .thumbnail_contenedor .thumbnail{
  width: 80px;
  height: 80px;
  border-radius: 5px;
  cursor: pointer;
  object-fit: cover;
  opacity: .7;
  transition: .3s;
}

.contenedor_galeria .thumbnail_contenedor .thumbnail:hover{
  opacity: 1;
}

.active{
  opacity: 1 !important;
  box-shadow: 0 5px 5px rgba(1, 23, 46, 0.6);
}

@media screen and (max-width: 1200px) {
  .contenedor_galeria .thumbnail_contenedor {
    display: inline-table;
  }
}

/*Fin Galeria*/