@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700|Roboto:400,500,700');
/* ==========================================================================
   Global Styles
   ========================================================================== */
   .justified-container {
   color: white;
   font-family: 'Gotham Book', Arial, sans-serif;
   font-size: 17px;
   font-weight: lighter;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   }

   .justified-item {
   display: flex;
   width: 100%;
   justify-content: flex-start;
   text-align: justify;
   margin-bottom: 5px;
   }

   .justified-item strong {
   margin-right: 5px;
   }

   .justified-item span {
   display: inline-block;
   text-align: justify;
   }

   .wrapper {
    min-height: 100%;
    display: grid;
    grid-template-rows:auto 1fr auto;
  }


   .contenedorBack {
       height: 110vh; /* Altura de la ventana */
       width: 100%;
       display: flex;
       flex-direction: column;
       color: white;
       background-image: url('../img/ofertas2025/fondoAlumnos.jpg'); 
       background-size: cover; /* Cubrirá todo el contenedor */
       background-position: left center; /* Centra la imagen */
       background-repeat: no-repeat; /* No repite la imagen */
       box-sizing: border-box;
       padding: 0;
       margin-top: -20px; /*AJUSTAMOS EL MARGEN SUPERIOR DE LA IMAGEN CON EL NAV*/
   }
   .contenedorCh {
       height: 50vh; /* Altura de la ventana */
       width: 50%;
       display: flex;
       flex-direction: column;
       align-items: center;  /*Para centrar en toda la linea*/
       color: white;
       background-size: cover; /* Cubrirá todo el contenedor */
       background-repeat: no-repeat; /* No repite la imagen */
       box-sizing: border-box;
       margin: 20px ;
   }
   .imgCh {
       width: 40%; /* Ajusta el ancho al 100% del contenedor */
       height: auto; /* Mantiene la proporción de la imagen */
       display: none; /* Ocultar el botón por defecto */
   }
   .imgChH {
       width: 40%; /* Ajusta el ancho al 100% del contenedor */
       height: auto; /* Mantiene la proporción de la imagen */
       display: none; /* Ocultar el botón por defecto */
   }
   .form-container {
       position: relative;
       background-color: rgba(255, 255, 255, 0.5);
       border: 2px dashed rgba(255, 255, 255, 0.4);
       width: 80%; /* Cambiado para ocupar todo el ancho de la columna */
       height: 100%;
       padding: 20px;
       display: flex;
       margin: 20px;/*Margen superior de mi página.*/
       flex-direction: column;
       left: 30%; 
   }
   .form-title {
       color: #4d2579;
       text-align: center;
   }
   .form-content label {
       color: #4d2679;
       /* font-weight: lighter; */
       margin-left: 20px;
       font-size: 1.3em;
       font-family: "Calibri", sans-serif;
   }
   .custom-form-content {
       padding: 5px;
   }
   .custom-input {
       border-radius: 25px;
       background-color: transparent;
       border: 1px solid #4d2679;
       color: #333;
       padding: 10px;
       width: 100%;
       font-size: 1.3em;
   }
   .custom-input:focus {
       outline: none;
       box-shadow: 0 0 5px rgba(81, 203, 238, 1);
       border-color: rgba(81, 203, 238, 1);
   }
   .termsmovil {
       padding: 5px; /* Añadir un margen interno si es necesario */
       width: 100%; 
   }
   .aviso {
       display: flex;
       align-items: center;
       justify-content: center;
   }
   #termycondiciones a {
       text-decoration: underline;
   }
   .form-content label[for="terms"] {
       color: #4d2679;  /* Morado */
       font-size: 0.9em; /* Tamaño de fuente más pequeño */
       font-family: "Arial", Arial, sans-serif;
       width: 90%;
       text-align: justify; /* Justificar el texto */
       margin: 0 auto;
   }
   .form-content input[type="checkbox"] {
       float: left;
       transform: scale(2);
       display: inline-block;
       margin-left: 5px;
       margin-top: 7%;
   }
   .containerInfoMobile {
       display: none; /* Ocultar el contenedor móvil */
   }
   .spaceBlink {
       display: none; /* Ocultar el contenedor móvil */
   }
   .containerInfo {
       display: block;
       top: 120%;
       position: absolute;
       background-color: rgba(255, 255, 255, 0.2);       
       border: 2px dashed rgba(255, 255, 255, 0.4);
       width: 50%;
       height: auto;
       padding: 20px;
       display: flex;
       flex-direction: column;       
       left: 21%;
       box-sizing: border-box;
       font-size:  1.8vh;
       /* justify-content: center;
       align-items: center; */
   }
   .containerSocial{
        color:white;
        background: transparent;
        display: block; 
        height: 100%;
        font-size: 1.8vh;        
   }
   .containerSocialMovil{
       display: none; /*Oculta mi contenedor */
   }
   .btn-sent {
       background-color: #4d2579; /* Color de fondo inicial del botón */
       color: #ffffff; /* Color del texto del botón */
       border: 2px solid #4d2579; /* Borde del botón */
       padding: 10px 20px;
       font-size: 12px;
       cursor: pointer;
       transition: background-color 0.3s ease, color 0.3s ease; 
   }
   .btn-sent:hover {
       background-color: #633C8E; /* Color de fondo cuando el ratón está sobre el botón */
       color: #ffffff; /* Color del texto cuando el ratón está sobre el botón */
   }
   .containerAlumnos {
       display: none; /*Oculta mi contenedor */
   }
   

   @media (max-width: 1200px) {
    .navbar-header {
      float: none;
    }
  
    .navbar-left, .navbar-right {
      float: none !important;
    }
  
    .navbar-toggle {
      display: block;
    }
  
    .navbar-collapse {
      border-top: 1px solid transparent;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
  
    .navbar-fixed-top {
      top: 0;
      border-width: 0 0 1px;
    }
  
    .navbar-collapse.collapse {
      display: none !important;
    }
  
    .navbar-nav {
      float: none !important;
      margin-top: 7.5px;
    }
  
    .navbar-nav > li {
      float: none;
    }
  
    .navbar-nav > li > a {
      padding-top: 10px;
      padding-bottom: 10px;
    }
  
    .collapse.in {
      display: block !important;
    }
  }


  @media (max-width: 1670px) {
      .containerInfo {
        display: block;
        top: 120%;
        position: absolute;
        background-color: rgba(255, 255, 255, 0.2);       
        border: 2px dashed rgba(255, 255, 255, 0.4);
        width: 55%;
        height: auto;
        padding: 20px;
        display: flex;
        flex-direction: column;       
        left: 21%;
        box-sizing: border-box;
        font-size:  1.8vh;
    }
}

  @media (max-width: 1653px) {
      .containerInfo {
        display: block;
        top: 120%;
        position: absolute;
        background-color: rgba(255, 255, 255, 0.2);       
        border: 2px dashed rgba(255, 255, 255, 0.4);
        width: 58%;
        height: auto;
        padding: 20px;
        display: flex;
        flex-direction: column;       
        left: 21%;
        box-sizing: border-box;
        font-size:  1.8vh;
    }
}

@media (max-width: 1571px) {
    .containerInfo {
        display: block;
        top: 120%;
        position: absolute;
        background-color: rgba(255, 255, 255, 0.2);       
        border: 2px dashed rgba(255, 255, 255, 0.4);
        width: 60%;
        height: auto;
        padding: 20px;
        display: flex;
        flex-direction: column;       
        left: 21%;
        box-sizing: border-box;
        font-size:  1.8vh;
    }
}

@media (max-width: 1517px) {
    .containerInfo {
        display: block;
        top: 120%;
        position: absolute;
        background-color: rgba(255, 255, 255, 0.2);       
        border: 2px dashed rgba(255, 255, 255, 0.4);
        width: 62%;
        height: auto;
        padding: 20px;
        display: flex;
        flex-direction: column;       
        left: 21%;
        box-sizing: border-box;
        font-size:  1.8vh;
    }
}

@media (max-width: 1469px) {
    .containerInfo {
        display: block;
        top: 120%;
        position: absolute;
        background-color: rgba(255, 255, 255, 0.2);       
        border: 2px dashed rgba(255, 255, 255, 0.4);
        width: 64%;
        height: auto;
        padding: 20px;
        display: flex;
        flex-direction: column;       
        left: 21%;
        box-sizing: border-box;
        font-size:  1.8vh;
    }
}

@media (max-width: 1423px) {
    .containerInfo {
        display: block;
        top: 120%;
        position: absolute;
        background-color: rgba(255, 255, 255, 0.2);       
        border: 2px dashed rgba(255, 255, 255, 0.4);
        width: 66%;
        height: auto;
        padding: 20px;
        display: flex;
        flex-direction: column;       
        left: 21%;
        box-sizing: border-box;
        font-size:  1.8vh;
    }
}

@media (max-width: 1382px) {
    .containerInfo {
        display: block;
        top: 120%;
        position: absolute;
        background-color: rgba(255, 255, 255, 0.2);       
        border: 2px dashed rgba(255, 255, 255, 0.4);
        width: 72%;
        height: auto;
        padding: 20px;
        display: flex;
        flex-direction: column;       
        left: 21%;
        box-sizing: border-box;
        font-size:  1.8vh;
    }
}

@media (max-width: 1268px) {
    .containerInfo {
        display: block;
        top: 120%;
        position: absolute;
        background-color: rgba(255, 255, 255, 0.2);       
        border: 2px dashed rgba(255, 255, 255, 0.4);
        width: 74%;
        height: auto;
        padding: 20px;
        display: flex;
        flex-direction: column;       
        left: 21%;
        box-sizing: border-box;
        font-size:  1.8vh;
    }
}

@media (max-width: 1232px) {
    .containerInfo {
        display: block;
        top: 120%;
        position: absolute;
        background-color: rgba(255, 255, 255, 0.2);       
        border: 2px dashed rgba(255, 255, 255, 0.4);
        width: 76%;
        height: auto;
        padding: 20px;
        display: flex;
        flex-direction: column;       
        left: 21%;
        box-sizing: border-box;
        font-size:  1.8vh;
    }
}

@media (max-width: 1201px) {
    .containerInfo {
        display: block;
        top: 120%;
        position: absolute;
        background-color: rgba(255, 255, 255, 0.2);       
        border: 2px dashed rgba(255, 255, 255, 0.4);
        width: 78%;
        height: auto;
        padding: 20px;
        display: flex;
        flex-direction: column;       
        left: 21%;
        box-sizing: border-box;
        font-size:  1.8vh;
    }

    .navbar-brand img {
        text-align: center;
        position: absolute;
        width: 150px;
        height: 46px;
        margin-left: 15px; /* Espacio a la izquierda del logo */
    }
}

  @media (max-width: 1173px) {
    .contenedorBack {
        height: auto;
        background-image: url('../img/ofertas2025/fondoMovilV.png'); /* Cambia la imagen de fondo para dispositivos móviles */
        align-items: center;
    }

    .navbar-brand img {
        text-align: center;
        position: absolute;
        width: 150px;
        height: 46px;
        margin-left: 15px; /* Espacio a la izquierda del logo */
    }

    .form-container {
        display: block;
        background-color: rgba(255, 255, 255, 1);
        width: 90%;
        max-width: 600px; 
        padding: 30px;
        margin: 60px auto 20px auto;
        left: 0;
        top: 0;
        transform: none;
        background-position: right center;
    }

    .nested-div {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
      }

    .containerAlumnos {
        display: block;
        width: 100%;
        align-items: center;
    }

    .image-container {
        position: relative; 
        width: 100%; 
    }

    .overlay-content {
        display: flex;
        position: absolute;
        top: 18%; 
        left: 50%; 
        transform: translate(-50%, -50%); 
        color: white;
        padding: 20px;
        border-radius: 10px;
        font-family: Arial, sans-serif;
        text-align: center;
        z-index: 10; 
    }

    .containerInfoMobile {      
        display: block;  
        background-color: rgba(255, 255, 255, 0.25);
        border: 2px dashed rgba(255, 255, 255, 0.4);
        width: 100%;
        max-width: 600px;
        position: relative;
        text-align: left;
        padding: 10px;
    }

    .containerInfo{
        display: none; /*Ocultar en móvil*/
    }

    .redes{
        margin-bottom: -20px; 
    }

    .contenedorCh {
        display: flex;
        align-items: center;
        width: 100%;
        height: auto;
        margin: 0;
        padding: 0;
      }
    
    .contenedorCh1 {
        width: 100%;
    }

    .imgCh {
        display: block; /* Mostrar la imagen a partir de esta resolución */
        width: 50%; /* Ajusta el ancho de la imagen */
        height: auto; /* Mantiene la proporción de la imagen */
        margin-bottom: 45px;
        justify-content: center;
    }

    .imgChH {
        display: block; /* Mostrar la imagen a partir de esta resolución */
        width: 90%; /* Ajusta el ancho de la imagen */
        height: auto; /* Mantiene la proporción de la imagen */
        margin: 0 ;
    }
  }


   /*
   Desde 767px,  Se rompe entre 767px y 991px
   */
   @media (max-width: 991px) {
        .contenedorBack {
            height: auto;
            background-image: url('../img/ofertas2025/fondoMovilV.png'); /* Cambia la imagen de fondo para dispositivos móviles */
            align-items: center;
        }
        .containerSocial{
            display: none;
        }
        
        .containerSocialMovil{
            display: block;
        }

        .grid-container {
            display: grid;
            grid-template-columns: auto auto ;
            text-aling: justify;
        }
        .grid-container > div {
            text-align: left;
            margin-left: 10%;
            padding: 20px 0;
        }

        .containerAlumnos {
            display: block;
            width: 100%;
            align-items: center;
        }

        .image-container {
            position: relative; 
            width: 100%; 
        }

        .overlay-content {
            display: flex;
            position: absolute;
            top: 18%; 
            left: 50%; 
            transform: translate(-50%, -50%); 
            color: white;
            padding: 20px;
            border-radius: 10px;
            font-family: Arial, sans-serif;
            text-align: center;
            z-index: 10; 
        }

        .containerInfoMobile {      
            display: block;  
            background-color: rgba(255, 255, 255, 0.25);
            border: 2px dashed rgba(255, 255, 255, 0.4);
            width: 100%;
            max-width: 600px;
            position: relative;
            text-align: left;
            padding: 10px;
        }

        .containerInfo{
            display: none; /*Ocultar en móvil*/
        }

        .redes{
            margin-bottom: -20px; 
        }
   }

   /* Desde aquí empiezan los estilos para la resolución móvil. */
   @media (max-width: 767px) {
       .contenedorBack {
            height: auto;
           background-image: url('../img/ofertas2025/fondoMovilV.png'); /* Cambia la imagen de fondo para dispositivos móviles */
           align-items: center;
       }

       .containerAlumnos {
           display: block;
           width: 100%;
           align-items: center;
       }
       .contenedorCh {
           width: 100%; /* Ajusta el ancho al 100% del contenedor */
           height: auto;  /* Ajusta la altura automáticamente */
           justify-content: center;
           align-items: center; 
           background-position: center;
           margin: 0 auto; /* Quitar margen superior e inferior, centrar horizontalmente */
           left: 0; /* Resetear la posición left si es necesario */
           top: 0; /* Resetear la posición top si es necesario */
       }
       .imgCh {
           display: block; /* Mostrar la imagen a partir de esta resolución */
           width: 50%; /* Ajusta el ancho de la imagen */
           height: auto; /* Mantiene la proporción de la imagen */
           margin: 0 ;
       }
       .imgChH {
           display: block; /* Mostrar la imagen a partir de esta resolución */
           width: 90%; /* Ajusta el ancho de la imagen */
           height: auto; /* Mantiene la proporción de la imagen */
           margin: 0 ;
       }
       .form-content label {
           color: #4d2579;
       }
       .aviso {
           transform: scale(1);
           float: left;
       }
       .form-container {
           background-color: rgba(255, 255, 255, 1);
           width: 95%;
           max-width: 600px; 
           padding: 30px; /*Margenes laterales del texto y los input*/
           margin: 60px auto 20px auto; /* Quitar margen superior, centrar horizontalmente y mantener margen inferior */
           left: 0; /* Resetear la posición left si es necesario */
           top: 0; /* Resetear la posición top si es necesario */
       }
       .containerInfo{
           display: none; /*Ocultar en móvil*/
       }
       

       .image-container {
            position: relative; 
            width: 100%; 
        }

        .overlay-content {
            display: flex;
            position: absolute;
            top: 18%; 
            left: 50%; 
            transform: translate(-50%, -50%); 
            color: white;
            padding: 20px;
            border-radius: 10px;
            font-family: Arial, sans-serif;
            text-align: center;
            z-index: 10; 
        }

        .containerInfoMobile {      
            display: block;  
            background-color: rgba(255, 255, 255, 0.25);
            border: 2px dashed rgba(255, 255, 255, 0.4);
            width: 100%;
            max-width: 600px;
            /* margin: 20px auto 0 auto; */
            position: relative;
            text-align: left;
            padding: 10px;
            width: 380px;
        }

        .redes{
            margin-bottom: -20px;     
        }

       .spaceBlink {
           display: block;  /* Mostrar en móvil */
       }
       .containerSocial{
           display: none; /*Ocultar en móvil*/
       }

       .containerSocialMovil{
           display: block;
       }

       .grid-container {
           display: grid;
           grid-template-columns: auto auto ;
           text-aling: justify;
           }
           .grid-container > div {
           text-align: left;
           margin-left: 10%;
           padding: 20px 0;
           }
   }

   @media (max-width: 610px) {
        footer {
            padding: 5px 0;
        }

        .containerSocialMovil {
            display: block;
            margin: 0;
            height: -30px;
        }

        .grid-container > div {
            text-align: left;
            margin-left: 10%;
            padding: 0;
        }

        .grid-container > div > h6{
            margin: 0;
            padding: 0;
        }

        .redes > a > img {
            width: 4%;
        }

        .overlay-content {
            display: flex;
            position: absolute;
            top: 23%; 
            left: 50%; 
            transform: translate(-50%, -50%); 
            color: white;
            padding: 20px;
            border-radius: 10px;
            font-family: Arial, sans-serif;
            text-align: center;
            z-index: 10; 
            width: 420px;
        }

        .containerInfoMobile{
            display: block;  
            background-color: rgba(255, 255, 255, 0.25);
            border: 2px dashed rgba(255, 255, 255, 0.4);
            width: 100%;
            /* max-width: 800px; */
            position: relative;
            text-align: left;
            padding: 10px;
        }
    }

    @media (max-width: 560px) {

        .overlay-content {
            display: flex;
            position: absolute;
            top: 23%; 
            left: 50%; 
            transform: translate(-50%, -50%); 
            color: white;
            padding: 20px;
            border-radius: 10px;
            font-family: Arial, sans-serif;
            text-align: center;
            z-index: 10; 
        }

        .containerInfoMobile{
            display: block;  
            background-color: rgba(255, 255, 255, 0.25);
            border: 2px dashed rgba(255, 255, 255, 0.4);
            width: 100%;
            max-width: 800px;
            position: relative;
            text-align: left;
            padding: 10px;
        }
    }