*{ box-sizing: border-box;   font-family: sans-serif;}

    :root {
        --azul-rey: #114cbb;
        --naranja: #ffbb00;
        --gris-claro: #F4F7F9;
        --blanco: #FFFFFF;  }

 body{margin: 0; text-align: center;  font-family: 'Montserrat', sans-serif;
 background-color: #f8fafc;
            color: #334155; }

 /*HEADER ENCABEZADO*/
#Encabezado{
   position: -webkit-sticky; 
   position: sticky;
   top: 0;
   background-color: rgb(253, 252, 252);
   z-index: 1000; 
   width: 100%;  }

 #contenedorHeader{align-items: center; display: flex;  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3); }

#logotipo{
    display: flex;
    float: left;
    width:25%;
    height: auto; 
    justify-content:right; }
    #logotipo img{width: 80%;  height: auto;  margin: 2%; }

/*MENU*/    
     #menu {
     width: 75%; 
    display: flex;
    flex-direction: column; 
    padding-bottom: 0px; 
    text-align: center;  
    align-items: center;}

    #btnMenu{
      display: none;
      background: none;
      border: none;
      cursor: pointer;  }
    
nav ul {
    top: 0;
    align-items: center;
    text-align: center;
    display: flex;
    list-style: none; /* Quita viñetas */  
    padding: 0;
    display: flex; /* Alinea los elementos en línea (Horizontal) */ }

nav ul li a {
    padding: 10% 15px;
    text-decoration: none; /* Quita subrayado */
     color:#114cbb;
    font-family:'Poppins'sans-serif;
    font-size: 110%; 
    transition:.3s }    
nav :hover {color: #FF5C00;}

.submenu { width: 15%;
  display: none; margin-top: 4%;
  position: absolute; /* Posiciona respecto al padre */
  background-color: #e2dede;}
.submenu li{padding: 4%;}
/* Mostrar submenú al pasar el ratón */
.menuoferta:hover .submenu { display: block;}


 /*Presentcion*/
#contenedorVideo{display: flex; width: 100%; height: 92vh;  justify-content: center;  margin:0% }
    #contenedorVideo video{
    bottom: 0;
    right: 0;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    object-fit: cover;
    object-position: top;  }

#SectionHistoria{padding-top: 5.5%;
   max-width: 100%;
            margin: 50px auto;
            padding: 40px 20px;
            background: white;
            border-radius: 30px;
            box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.3);  }
#TituloHistoria{
    margin-bottom: 0%;
    display: flex;
    width:90%;
    margin-left: 5%;
    margin-right: 5%;
    height: 2vh;
    justify-content: center;
     align-items: center; margin-bottom: 50px;}
    #TituloHistoria h2{  letter-spacing: 1px;
        font-size: 250%;
        font-family:  "Poppins", sans-serif;
        font-weight: 600;
        color: #114cbb; }

#HistoriaContenedor{  display: grid;
            grid-template-columns: 1fr 1fr; /* Dos columnas iguales */
            gap: 40px;
             width:90%;
            margin-left: 5%;
            margin-right: 5%;
            align-items: start; }

   #foto{ 
   display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 15px; }
        #foto img{  width: 100%;
            height: 200px;
            object-fit: cover; /* Recorta la imagen para que encaje sin deformarse */
            border-radius: 12px;
            transition: transform 0.3s ease;
            border: 3px solid #f1f5f9;}
             #foto img:first-child {
            grid-column: span 2;
            height: 280px;
        }

        #foto img:hover { transform: scale(1.03);     border-color: #4169E1;   }
   
#historia{
    margin: 5%;
    margin-left: 0%;
    margin-bottom: 0%;
    justify-content: center; 
    align-items: center; 
    margin-top: 0%;
    align-items: center;
    }
    #historia p{
      color: #3c4a5f;
       font-family:'monserrat' sans-serif;
       align-items: center;
        text-align: justify; 
        font-size:  1.05rem; }


#SectionMision {
background: -webkit-linear-gradient(90deg,#014985,#027ddf); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(90deg,#014985,#027ddf); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

#Mision, #Vision{
 max-width: 100%;
 height: auto;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1fr 2.5fr;
           margin: 4%;
            align-items: center;
            z-index: 2;
            position: relative; }

     #textoMision p{   
         font-size: 1rem;
         text-align: justify;
            margin-bottom: 2px;
            color: #fff;
            background: rgba(255, 255, 255, 0.1);
            padding: 15px;
            border-radius: 25px;
            border: 1px solid rgba(255, 255, 255, 0.2);
            box-shadow: 0 15px 35px rgba(0,0,0,0.1);}
        #imagenMision,  #imagenVision{  text-align: center; }
        #imagenMision h2{ font-family: "Poppins", sans-serif; font-weight: 600; color:#ffffff; font-size: 300%; margin: 1%;}

   
 #imagenMision img, #imagenVision img { width: 60%; border-radius: 50%; }


 #SectionVision{ background-color: #f97316;
            background-image: 
                radial-gradient(at 0% 100%, #fb923c 0px, transparent 55%),
                radial-gradient(at 100% 0%, #ea580c 0px, transparent 55%),
                radial-gradient(at 50% 50%, #f97316 0px, transparent 80%);}                       
     
         #imagenVision h2{font-size: 300%;  font-family:  "Poppins", sans-serif;    font-weight: 600; color: #ffffff; margin: 1%;}
         #textoVision p {
            text-align: justify;
            font-size: 1rem;
            margin-bottom: 2px;
            color: #fff;
            background: rgba(255, 255, 255, 0.1);
            padding: 15px;
            border-radius: 25px;
            border: 1px solid rgba(255, 255, 255, 0.2);
            box-shadow: 0 15px 35px rgba(0,0,0,0.1); }
       
#Valores{padding-top: 5%;
         padding-bottom: 10%;
       
            margin: 50px auto;
            padding-bottom: 40px;
            background: white;
            border-radius: 20px;
            box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.3);}
#tituloValores {
    display: flex;
    width:90%;
    margin-left: 5%;
    margin-right: 5%;
    height: 1vh;
    justify-content: center;
     align-items: center; margin-bottom: 40px; }    
        
   #tituloValores h2{ color: #114cbb;  text-align:center;  font-size: 300%;  font-family:  "Poppins", sans-serif;
        font-weight: 600;}

#ContenedorValor{
width: 100%;
height: auto;
margin:auto;
padding-bottom: 20px; }

    .text{width: 80%; color: #3c4a5f;  margin-left: 10%; margin-right: 10%;
          font-family: sans-serif; font-size: 105%; text-align: justify;}
#ContenedorValores{
   display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px; }
    
    .valor{
    background-color: #d2e4fc; 
    font-size: 110%;
    color: #0d47a1;
    width: 190px;
    padding: 20px;
    border-radius: 15px;
    text-align: center;
    transition: transform 0.3s, box-shadow 0.3s; }

    .valor p { font-weight: bold; }
    .valor img{ width: 100px;  margin-bottom: 10px;  }

   .valor:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.2); }
 #SectionOfertaEducativa{padding-top: 1px;
         padding-bottom: 10%;
       
      
            padding-bottom: 40px;
            background: white;
            border-radius: 20px;
            box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.3);}
#TituloOferta{
   margin-bottom: 0%;
    margin-top: 5%;
    display: flex;
    width:90%;
    margin-left: 5%;
    margin-right: 5%;
    height: 10vh;
    justify-content: center;
     align-items: center; }
    #TituloOferta h2{color: #114cbb;  font-size: 300%; font-family:  "Poppins", sans-serif;
        font-weight: 600; }

        #tituloNivelBasico{
          letter-spacing: 1px;
           font-size: 200%;
           margin-bottom: 2%;
           margin-top: 3%;
           margin-left: 10%;
           display: flex;
           width: 80%;
           height: 8vh;
           justify-content:center;
           align-items:center;
           color: #0e47c2;  }
               #tituloNivelBasico::before,
               #tituloNivelBasico::after {
                 content: '';
                 flex: 1;
                 border-bottom: 3px solid #f88f05;  /* Color de la línea */}
               #tituloNivelBasico:not(:empty)::before {
                  margin-right: .50em; /* Espacio entre línea izquierda y texto */ }
                 #tituloNivelBasico:not(:empty)::after {
                   margin-left: .50em; /* Espacio entre texto y línea derecha */ }
        
           #contenedorNivelBasico{
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 15px; }

            .NbasicoLic{
             background: linear-gradient(0deg, #062680 0%, #3b82f6 100%); 
            font-size: 1rem;
             color: #f8b12e;
             width: 20%;
             padding: 1px;
             border-radius: 20px;
             text-align: center;
            transition: transform 0.3s, box-shadow 0.3s; }

            .NbasicoLic h2 {  margin: 0%; text-transform: uppercase; font-size: 1.2rem; letter-spacing: 1px; }
            .NbasicoLic img{ width: 100%;  margin-bottom: 10px; 
                             border-top-left-radius:20px;
                             border-top-right-radius: 20px; }

             .NbasicoLic p{color: #fffefe; }
             .NbasicoLic:hover {
               transform: translateY(-5px);
               box-shadow: 0 10px 20px rgba(0,0,0,0.2); }
            
        
        #tituloLicenciatura{
            letter-spacing: 1px;
           font-size: 200%;
           margin-bottom: 2%;
           margin-top: 3%;
           display: flex;
           width:80%;
           margin-left: 10%;
            height: 8vh;
           justify-content:center;
           align-items:center;
           color: #0e47c2;}
        #tituloLicenciatura::before,
        #tituloLicenciatura::after {
            content: '';
            flex: 1;
            border-bottom: 3px solid #f88f05;  /* Color de la línea */}
        #tituloLicenciatura:not(:empty)::before {
            margin-right: .50em; /* Espacio entre línea izquierda y texto */ }
        #tituloLicenciatura:not(:empty)::after {
            margin-left: .50em; /* Espacio entre texto y línea derecha */ }


            h3{margin-left: 1%;  font-family:  "Poppins", sans-serif;   font-weight: 600;}

            .contenedorLIC{
            font-family: sans-serif;
             display: flex;
             width: 100%;
             height: 100%;
             flex-wrap: wrap;
             justify-content: center;
             gap: 15px;}
           
              .btnPlan{ width: 50%;
                  bottom: 0;
                  left: 0;
                  padding: 0.625rem 0;
                  background-color: #e5ecff; /* Verde esmeralda */
                  color: blue;
                  font-weight: 600;
                  border-radius: 0.5rem; /* Esquinas redondeadas */
                   margin-bottom: 20px;
                  cursor: pointer;
                  transition: background-color 0.3s ease; }
              .btnPlan:hover{background-color: #ffffff;}

             #contenedorPorqué { max-width:90%;  margin:auto; display:grid; margin-bottom: 0%; grid-template-columns:1fr 1fr; border-radius: 20px;  background: linear-gradient(135deg, #f97316 0%, #fb923c 50%, #f59e0b 100%);}
              .Porqué{ margin-bottom: 5%; padding:5%; padding-bottom: 0%;  }  .Porqué h2{color:#062680; } 
              .Porqué p{font-family: 'Poppins' sans-serif;text-align: justify;  color: #ffffff;  background: rgba(255, 255, 255, 0.1);
                        padding: 15px;
                        border-radius: 25px;
                         border: 1px solid rgba(255, 255, 255, 0.2);
                         box-shadow: 0 15px 35px rgba(0,0,0,0.1);}
            

        #tituloMaestria{
           font-size: 200%;
           margin-bottom: 2%;
           margin-top: 3%;
           display: flex;
           width:90%;
           margin-left: 5%;
            height: 8vh;
           justify-content:left;
           align-items:center;
           color: #0e47c2; }
           #tituloMaestria::before,
               #tituloMaestria::after {
                 content: '';
                 flex: 1;
                 border-bottom: 3px solid #f88f05;  /* Color de la línea */}
               #tituloMaestria:not(:empty)::before {
                  margin-right: .50em; /* Espacio entre línea izquierda y texto */ }
                 #tituloMaestria:not(:empty)::after {
                   margin-left: .50em; /* Espacio entre texto y línea derecha */ }
          
        
        #tituloDoctorado{
            font-size: 200%;
           margin-bottom: 2%;
           margin-top: 3%;
           display: flex;
           width:82%;
           margin-left: 9%;
            height: 8vh;
           justify-content:left;
           align-items:center;
           color: #0e47c2;  }
            #tituloDoctorado::before,
               #tituloDoctorado::after {
                 content: '';
                 flex: 1;
                 border-bottom: 3px solid #f78c01;  /* Color de la línea */}
               #tituloDoctorado:not(:empty)::before {
                  margin-right: .50em; /* Espacio entre línea izquierda y texto */ }
                 #tituloDoctorado:not(:empty)::after {
                   margin-left: .50em; /* Espacio entre texto y línea derecha */ }
          
  #Nuestrasinstalaciones{ 
    margin-top: 3%;
     justify-content: center;
    margin-bottom: 60px;
    background: #fff;
    padding: 20px;
    border-radius: 30px;
    box-shadow: 0 15px 35px rgba(0,0,0,0.1);}
#TituloInstalaciones{
margin-bottom: 0%;
    margin-top: 3%;
    display: flex;
    width:90%;
    margin-left: 5%;
    margin-right: 5%;
    height: 10vh;
    justify-content: center;
     align-items: center; }
     #TituloInstalaciones h2{
        color: #114cbb;
        font-size: 300%;
        font-family:  "Poppins", sans-serif;
        font-weight: 600; }

     
      
    
 #contenedorFotos {width: 90%; margin-left: 5%; text-align: center;
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
            gap: 20px;
            padding: 20px;
        }

        #contenedorFotos img {
            width: 100%;
            height: 250px;
            object-fit: cover;
            border-radius: 15px;
            border: 4px solid white;
            box-shadow: 0 5px 15px rgba(0,0,0,0.08);
            transition: all 0.4s ease;
        }



/*
 #fotosInstalaciones {   
        width: 50%;
        height: auto;
        margin-left: 25%;
        margin-right: 25%;
        margin-top: 1%;
        margin-bottom: 1%;
        overflow: hidden; /* Oculta las imágenes fuera del contenedor *}

     #contenedorFotos {
        align-items: center;
        justify-content: center;
      display: flex; 
      width: 700%; 
      animation: slide 42s infinite; /* Animación automática }

      #contenedorFotos img {
      width: 14.28%; 
      height: auto;
      margin: 0%;}

  @keyframes slide {
  0%, 12% { margin-left: 0; }
  14%, 26% { margin-left: -100%; }
  28%, 40% { margin-left: -200%; }
  42%, 54% { margin-left: -300%; }
  56%, 68% { margin-left: -400%; }
  70%, 82% { margin-left: -500%; }
  84%, 100% { margin-left: -600%; }
}*/


/*F O O T E R*/
footer{background-color:#114cbb; }
#contacto{
width:100%;
margin:auto;
display:grid;
grid-template-columns:1fr 1fr;
gap:0px;
margin: 0%;
background-color: #114cbb;
color: #ffffff; }

#formulario{
justify-content: center;
margin: 5%;
width: 80%;
height: 90vh;
margin-top: 3%;
margin-bottom:10%;
margin-left: 10%;
margin-right: 10%;
font-family: sans-serif;
color: #052692;
background:white;
padding:30px;
border-radius:10px;
box-shadow:0 5px 15px rgba(0,0,0,0.1)}

input,  textarea{
width:100%;
padding:8px;
margin-top:5px;
margin-bottom:1px;
border:3px solid #ccc;
border-radius:5px; }

button{
background:#0056b3;
color:white;
width: 40%;
border:none;
padding:12px;
border-radius:5px;
cursor:pointer; }

button:hover{ background-color: #052692;}


#Informacion{
padding-top: 2%;
display: block;
font-family:'poppins' sans-serif;
margin: 3%; color: #ffffff;}
    
#info{display: flex; margin-bottom: 4%; height: 80px;}
#info div{width: 33%; color: #ffffff;}
#info div p{color: #ffffff;}

#redes a{
font-size: 30px;
margin:3%;
text-decoration:none;
color:#fffbfb;
transition:0.3s;}

#mapa{margin-top:5%; margin: 3%;}
iframe{
width:100%;
border:none;
border-radius:5px;
height:90vh;
}

    
/*M O D O   R E S P O N S I V E*/

@media (max-width: 782px){
    
header{
flex-direction: column;
align-items: center;

    }
 #contenedorHeader{
    position: -webkit-sticky; 
    position:sticky;
    top: 0;
    z-index: 1000;

    display: flex;
    width: 100%;
}

 #logotipo{
    width:96%;
    height: auto; 
   margin-left:3% ;
     }
    #logotipo img{
        width: 100%;
       justify-content:left ; }


/*MENU*/
  #btnMenu{
      display: block;
      margin-left: 40%; 
      color: #180377;
      font-size: 200%;
      cursor: pointer; }
    
    #menu {
    display: none;
    position: absolute;
    top: 80%;
    right: 0%;
    width: 30%;
    background: white;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3);
    transition:max-height .4s ease;}
    

  nav ul {
    width: 100%;
    flex-direction: column; }
      #menu li{
      padding:5px 0;
      border-bottom:2px solid rgba(255,255,255,0.2); }
    

   nav ul li a:hover {color: #FF5C00;}
   #menu.activo{display: block;}
  .submenu { width: 80%;
  display: none; margin-top: 100%;margin-right: 50%;
  position: absolute; /* Posiciona respecto al padre */
  background-color: #dddbdb;}
.submenu li{padding: 5%; text-align: center;}
/* Mostrar submenú al pasar el ratón */
.menuoferta:hover .submenu { display: block;}


 /*Presentcion*/
 #contenedorVideo{
    display: flex;
    width: 100%;
   height: 35vh;
    justify-content: center;
    margin:0% }
    #contenedorVideo video{
    bottom: 0;
    right: 0;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    object-fit: cover;
    object-position: top; }

   
#SectionHistoria{
                padding: 20px;}
#TituloHistoria{
   margin-bottom: 0%;
    margin-top: 2%;
    display: flex;
    width:90%;
    margin-left: 5%;
    margin-right: 5%;
    height: 10vh;
    justify-content: center;
     align-items: center;}
    #TituloHistoria h2{font-size: 200%;  color: #114cbb; }

     #HistoriaContenedor{
       grid-template-columns:1fr; 
       gap:0%;}
        #historia { margin: 0%; margin-top: 0%;  }
        #historia p{ font-size: 1rem;}



.img-grid img,  #imagenMision img, #imagenVision img {
            width: 20%;
            height:auto;
            margin: 0%;
            border-radius: 99%;
            box-shadow: 0 10px 25px rgba(0, 35, 102, 0.15);  }  


   #Mision, #Vision{ grid-template-columns:1fr; margin-bottom: 3%;}
   #Mision h2{font-size: 2rem;}
   #Vision h2{font-size: 2rem;}
    #textoMision{margin-bottom: 4%;}
    #textoVision{margin-bottom: 4%;}

#tituloValores {
    margin-bottom: 0%;
   
    padding: 20px;
    display: flex;
    width:90%;
    margin-left: 5%;
    margin-right: 5%;
    height: vh;
     align-items: center;  }        

   #tituloValores h2{ color: #114cbb;  text-align:center;  font-size: 200%; font-family: sans-serif;}

   #ContenedorValor{ grid-template-columns:1fr;}
   
   #ContenedorValores{width: 100%;  justify-content: center;}


     .valor{
    background-color: #d2e4fc; 
    font-size: 100%;
    color: #114cbb;
    width: 30%;
    padding: 2%;
    border-radius: 15px;
    text-align: center;
    transition: transform 0.3s, box-shadow 0.3s; }

    .valor p { font-weight: bold; font-size: 85%; text-align: center;}
    .valor img{ width: 70%;  margin-bottom: 10px;  }


#TituloOferta{
    margin-bottom: 0%;
    margin-top: 1%;
    padding-top: 40px;
    display: flex;
    width:90%;
    margin-left: 5%;
     margin-right: 5%;
    height: 6vh;
    justify-content: center;
     align-items: center;}

    #TituloOferta h2{ color: #114cbb;  font-size: 200%;  font-family: sans-serif; }

        #tituloNivelBasico{
           font-size: 140%;
           margin-bottom: 2%;
           margin-top: 5%;
           display: flex;
           margin-left: 5%;
           width: 90%;
           justify-content:center;
           align-items:center;
           color: #0e47c2; }
        
    
           #contenedorNivelBasico{
           grid-template-columns:1fr;  }

            .NbasicoLic{
             background: linear-gradient(0deg, #062680 0%, #3b82f6 100%); 
            font-size: 115%;
             color: #f8b12e;
             width: 90%;
             padding: 1px;
             border-radius: 20px;
             text-align: center;
            
             justify-content: center;
            transition: transform 0.3s, box-shadow 0.3s; }

            .NbasicoLic h2 {  margin: 0%; }
            .NbasicoLic img{ width: 100%;  margin-bottom: 10px; 
                             border-top-left-radius:20px;
                             border-top-right-radius: 20px; }

             .NbasicoLic p{color: #fffefe; }
             .NbasicoLic:hover {
               transform: translateY(-5px);
               box-shadow: 0 10px 20px rgba(0,0,0,0.2); }
            
        
        #tituloLicenciatura{
            font-size: 140%;
           margin-bottom: 2%;
           margin-top: 5%;
           display: flex;
           margin-left:5%;
            width: 90%;
           justify-content:left;
           align-items:center;
           color: #0e47c2;  }
            #contenedorLIC{
            font-family: sans-serif;
             display: flex;
             height: 100%;
             flex-wrap: wrap;
             justify-content: center;
             gap: 15px;}
              .btnPlan{ width: 50%;
                  bottom: 0;
                  left: 0;
                  padding: 0.625rem 0;
                  background-color: #e5ecff; /* Verde esmeralda */
                  color: blue;
                  font-weight: 600;
                  border-radius: 0.5rem; /* Esquinas redondeadas */
                   margin-bottom: 20px;
                  cursor: pointer;
                  transition: background-color 0.3s ease; }
              .btnPlan:hover{background-color: #ffffff;}
                
              #contenedorPorqué { grid-template-columns:1fr; margin-left: 5%; margin-right: 5%; }
                .Porqué{ margin: 0%; bottom: 0%;} .Porqué h2{font-size: 1.4rem; }
                .Porqué p{font-size: 0.9rem;}


        #tituloMaestria{
          font-size: 140%;
           margin-bottom: 2%;
           margin-top: 5%;
           display: flex;
           margin-left: 5%;
           height:6vh;
           justify-content:left;
           align-items:center;
           color: #0e47c2;  }
        
        #tituloDoctorado{
           font-size: 140%;
           margin-bottom: 2%;
           margin-top: 5%;
           display: flex;
           margin-left: 5%;
           height:6vh;
           justify-content:left;
           align-items:center;
           color: #0e47c2; 
        }

#TituloInstalaciones{
   margin-bottom: 0%;
    margin-top: 5%;
    display: flex;
    width:90%;
    margin-left: 5%;
    margin-right: 5%;
    justify-content: center;
     align-items: center; }
     #TituloInstalaciones h2{ color: #114cbb; font-size: 200%; font-family: sans-serif; }
 #contenedorFotos {
                display: flex; /* Cambiamos grid por flex para el scroll lineal */
                overflow-x: auto;
                scroll-snap-type: x mandatory; /* Hace que las fotos "encajen" al deslizar */
                gap: 15px;
                padding: 20px 10px 30px; /* Espacio extra abajo para la barra */
                -webkit-overflow-scrolling: touch;
            }

            #contenedorFotos img {
                flex: 0 0 85%; /* Cada foto ocupa el 85% del ancho de la pantalla */
                scroll-snap-align: center;
                height: 350px; /* Un poco más altas en móvil */}

            /* Estilo de la barra de scroll para que no se vea fea */
            #contenedorFotos::-webkit-scrollbar {   height: 6px;}

            #contenedorFotos::-webkit-scrollbar-thumb { background: #062161;  border-radius: 10px; }
            #contenedorFotos::-webkit-scrollbar-track {
                background: #cbd5e1;    border-radius: 10px; }

/*F O O T E R*/
#contacto{
grid-template-columns:1fr;
}
#formulario{
    margin-top: 0%;}

#Informacion{
padding-top: 2%;
display: block;
font-family: sans-serif;
margin: 3%; color: #ffffff;}
    
#info{display: block; margin-bottom: 4%; height: auto; }
#info div{width: 100%; text-align: center;}
}