@charset "utf-8";
body {
    margin: 0 auto;
    background-color: #fff;
    padding: 0;
    margin: 0;
    overflow-x: hidden;
}

@font-face {
    font-family: "east";
    src: url(../fonts/east.otf) format("opentype")
}


@font-face {
    font-family: "merri";
    src: url(../fonts/merri.otf) format("opentype")
}


@font-face {
    font-family: "snf";
    src: url(../fonts/snf.ttf) format("truetype")
}


@font-face {
    font-family: "Dulcelin";
    src: url(../fonts/Dulcelin.otf) format("opentype")
}


@font-face {
    font-family: "carson";
    src: url(../fonts/carson.otf) format("opentype")
}

@font-face {
    font-family: "Roboto-Light";
    src: url(../fonts/Roboto-Light.ttf) format("truetype")
}


@font-face {
    font-family: "dacila";
    src: url(../fonts/dacila.otf) format("opentype")
}

/*
@font-face {
    font-family: "jennifer";
    src: url(../fonts/jennifer.ttf) format("truetype")
}
*/

@font-face {
    font-family: "heti";
    src: url(../fonts/heti.otf) format("opentype")
}

h1 {
    font-family: "Roboto-Light";
}

h2 {
    font-family: "aceSans";
}

p {
    font-family: "Roboto-Light";
}


a {
    font-family: "merri";
}


#capa0Body{
	position:relative;
	width:100%;
	height:auto;
	background-color:#2b2b2b; background-image: url(../imagenes/sedes.png); background-repeat: no-repeat; background-size: cover;
}

    .fila1Capa0{position: relative; width: 100%; height: 150px;}
    .fila2Capa0{position: relative; width: 80%; height: auto;}
    .txt1Capa0{color: #fff; position:relative; left: 30px;}
    .txt2Capa0{color: #FFF; position:relative; left: 30px; font-size: 2em; }





#capa2Body{ position: relative; width: 100%; height: auto; background-color: #fff;}


.filaCapa2{position: relative; width: 100%; height: 50px;}
.fila2Capa2{position: relative; width: 100%; height: auto; display: inline-table; background-color: #ededed;}
    
    .col1Capa2{float: left; width: 35%; height: auto;}
    
    
    .imgCapa2{position: relative; display: block; margin-left: auto; margin-right: auto; width: 100%; height: auto; }

     .col2Capa2{float: left;width: 30%; height: auto;}
    
        .iconSedes{position: relative; width: 30px; height: auto; padding-right: 15px;}
        .txt1Capa2Body{position: relative;  text-align: center; color: #000; font-size: 3em; width: 100%; display: inline-block; 
            margin-left: auto; margin-right: auto; font-family:"east"; }
        .txt2Capa2{ position: relative; width: 100%; top: -50px; text-align: center; color: #000; font-size: 1.5em; display: inline-block; margin-left: auto; margin-right: auto;}

        .col3Capa2{
            float: left;
            width: 35%;
        }
        .mapSede {
            max-width: 400px;
            width: 100%;
            height: auto;
            }
        
         .containerSedes {
            display: flex;
            justify-content: center;
            align-items: center; /* <--- NUEVO */
            gap: 10px;
            flex-wrap: wrap;
            padding: 0px;
            box-sizing: border-box;
            width: 100%;
            margin: 0 auto;
            }
                
         .column {
            flex: 1;
            box-sizing: border-box;
            padding: 20px;
            text-align: center;

            justify-content: center;  /* <--- NUEVO (centrado vertical dentro de la columna) */
            }
    
          .column h1{
            color: #000; font-size: 2em;
          }
         

          .column .img2{
            width: 100%;
          }

          .column .mapSede{
            width: 100%;
          }
      
          /* Media query para apilar las columnas cuando el ancho de la pantalla es menor a 600px */
          @media (max-width: 600px) {
            .column {
              flex: 100%;
            }
          }





#capa3Body{position: relative; width: 100%; height: auto; display: inline-table;
    background-image: url(../imagenes/fondo2Acerca.png); background-repeat: no-repeat; background-attachment: fixed; background-size: cover;

}
.col2Capa3{float: left; width: 100%; height: 500px; }
.txt1Capa3{font-size: 4em; padding-top: 120px; text-align: center;font-family:"east"; color: #fff; }

.imgCapa3Footer{position: relative; width: 100%; height: auto;}




#capa4Body{
    position: relative;
    width: 100%;
    height:auto;
    background-color: #302f2f;
    background-image: url(../imagenes/fondo1Acerca.png);
    background-size: 100%;
    background-repeat: no-repeat;
}

    .fila1Capa4{position: relative; width: 100%; height: 150px; }

    .fila2Capa4{position: relative; width: 80%; height: 300px; display: block; margin-left: auto; margin-right: auto;}
        .col1Capa4{float: left; width: 32%; height: auto; background:rgba(0,0,0,0.6)}

        .col2Capa4{float: left; width: 2%; height: 100%; }



        .txt1Capa4{position: relative; text-align: center; width: 100%; color: #fff;}
        .iconCapa4{position: relative; width: 100px; height: auto;}
        .txt2Capa4{position: relative; text-align: justify; width: 90%; display: block; margin-left: auto; margin-right: auto; color: #fff;}



@media screen and (min-width: 1px) and (max-width: 360px) {

 #capa0Body{height:250px;}
 .fila1Capa0{position: relative; width: 100%; height: 20px;}
 .txt1Capa0{text-align: left; padding-left: 10px; padding-right: 0px;}
    .txt2Capa0{text-align: left; padding-left: 10px; padding-right: 0%; width: 90%; }



 .prev, .next {font-size: 15px;}
    .txt1Slider1{display: block; top:40px;left:0px;font-size:1.5em;width:350px;}
    .imgSlide{width:100%; height:100%; background-size:cover; background-repeat: no-repeat;}
    .btn1{width:100px;height:50px; font-size:0.6em;}
    .btn2{width:100px;height:50px;font-size:0.6em;}
    
    
    .lineaBody{ width:70%; }
            
	         
                .fila1Capa1Body{height: 130px;}
                     .txt0Capa1Body{font-size: 2em;}
                .fila2Capa1Body{position: relative;  height: 1600px; width: 95%; display: block;margin-left: auto;
                    margin-right: auto;}
                    
                    .col1Capa1Body{position:relative;width:100%;height:400px;}
                        .fila4Capa1Body{ position: relative; width: 100%; height: 100%; }
                            .txt1Capa1Body{top: -300px; font-size: 2.1em;}
                            .txt2Capa1Body{position: relative; width: 90%; bottom: 250px; }

                            

                            .col2Capa1Body{position:relative; width:100%; height:100px; }
                            .col1Capa2{position: relative; width: 100%; height: auto;}
                            .imgCapa2{position: relative; display: block; margin-left: auto; margin-right: auto; width: 100%; height: auto; }
                             .col2Capa2{position: relative; width: 100%; height: auto;}
                                .iconSedes{position: relative; width: 30px; height: auto; padding-right: 15px;}
                                .txt1Capa2Body{position: relative;  color: #000; font-size: 2em; width: 100%; display: inline-block; 
                                    margin-left: auto; margin-right: auto; font-family:"east"; }
                                .txt2Capa2{ position: relative; width: 100%; top: -50px;  color: #000; font-size: 1.3em; 
                                   }
                                .col3Capa2{position: relative; width: 100%; height: auto;}
                               
                            




#capa3Body{position: relative; width: 100%; height: auto;}
.col2Capa3{position:relative; width: 100%; height: auto;}
.txt1Capa3{font-size: 1.7em; padding-top: 30px; padding-left: 0px;}
#btn11{width:150px; }


#capa4Body{ background-size: cover;}
    .fila1Capa4{position: relative; width: 100%; height: 100px; }
   .fila2Capa4{ width: 90%; height: 1100px; }
        .col1Capa4{ position: relative; width: 100%; height: auto;}
        .col2Capa4{position: relative; width: 100%; height: 50px;}

        .txt1Capa4{font-size: 1.2em};
        .iconCapa4{width: 50px;}
        .txt2Capa4{font-size: 1em}



}
    
    
@media screen and (min-width: 361px) and (max-width: 640px) {
    #capa0Body{height:250px;}
    .fila1Capa0{position: relative; width: 100%; height: 20px;}
    .txt1Capa0{text-align: left; padding-left: 10px;}
    .txt2Capa0{color: #FFF; text-align: right; padding-right: 150px; }

    .prev, .next {font-size: 15px;}
    .txt1Slider1{display: block; top:40px;left:0px;font-size:1.5em;width:350px;}
    .imgSlide{width:100%; height:100%; background-size:cover; background-repeat: no-repeat;}
    .btn1{width:100px;height:50px; font-size:0.6em;}
    .btn2{width:100px;height:50px;font-size:0.6em;}
	
    .lineaBody{ width:70%; }
	 .fila1Capa1Body{height: 130px;}
     .txt0Capa1Body{font-size: 2em;}
                .fila2Capa1Body{position: relative;  height: 2000px; width: 95%; display: block;margin-left: auto;
                    margin-right: auto;}
                    .col1Capa1Body{position:relative;width:100%;height:500px;}
                        .fila4Capa1Body{ position: relative; width: 100%; height: 100%; }
                            .txt1Capa1Body{top: -300px; font-size: 2.1em;}
                            .txt2Capa1Body{position: relative; width: 90%; bottom: 250px; }
                            .col2Capa1Body{position:relative; width:100%; height:100px}
							
                          
                  

                             .col2Capa1Body{position:relative; width:100%; height:100px; }
                            .col1Capa2{position: relative; width: 100%; height: auto;}
                            .imgCapa2{position: relative; display: block; margin-left: auto; margin-right: auto; width: 100%; height: auto; }
                             .col2Capa2{position: relative; width: 100%; height: auto;}
                                .iconSedes{position: relative; width: 30px; height: auto; padding-right: 15px;}
                                .txt1Capa2Body{position: relative;  color: #000; font-size: 2em; width: 100%; display: inline-block; 
                                    margin-left: auto; margin-right: auto; font-family:"east"; }
                                .txt2Capa2{ position: relative; width: 100%; top: -50px;  color: #000; font-size: 1.3em; 
                                    }
                                .col3Capa2{position: relative; width: 100%; height: auto;}
                              

                            #capa3Body{position: relative; width: 100%; height: auto;}
                            .col2Capa3{position:relative; width: 100%; height: auto;}
                            .txt1Capa3{font-size: 1.7em; padding-top: 30px; padding-left: 0px;}
                            #btn11{width:150px; }



#capa4Body{ background-size: cover;}
    .fila1Capa4{position: relative; width: 100%; height: 100px; }
   .fila2Capa4{ width: 90%; height: 900px; }
        .col1Capa4{ position: relative; width: 100%; height: auto;}
        .col2Capa4{position: relative; width: 100%; height: 50px;}

        .txt1Capa4{font-size: 1.2em}
        .iconCapa4{width: 50px;}
        .txt2Capa4{font-size: 1em}
}
    
    
@media screen and (min-width: 641px) and (max-width: 960px) {
    #capa0Body{height:350px;}
 .fila1Capa0{position: relative; width: 100%; height: 20px;}
 .txt1Capa0{text-align: left; padding-left: 10px;}
    .txt2Capa0{text-align: left; padding-left: 10px; width: 100%;}
    .prev, .next {font-size: 15px;}
    .txt1Slider1{display: block; top:40px;left:0px;font-size:1.5em;width:350px;}
    .imgSlide{width:100%; height:100%; background-size:cover; background-repeat: no-repeat;}
    .btn1{width:100px;height:50px; font-size:0.6em;}
    .btn2{width:100px;height:50px;font-size:0.6em;} 
	
	.lineaBody{ width:70%; }
	.fila1Capa1Body{height: 300px;}
                     .txt0Capa1Body{font-size: 3em;}
                .fila2Capa1Body{position: relative;  height: 2000px; width: 95%; display: block;margin-left: auto;
                    margin-right: auto;}
                    .col1Capa1Body{position:relative;width:100%;height:500px;}
                        .fila4Capa1Body{ position: relative; width: 100%; height: 100%; }
                            .txt1Capa1Body{top: -300px; font-size: 2.1em;}
                            .txt2Capa1Body{position: relative; width: 90%; bottom: 250px; }
                            .col2Capa1Body{position:relative; width:100%; height:100px}
							
					#btn1{width:200px}

                    
                
                    .col1Capa2{position: relative; width: 100%; height: auto;}
                    .imgCapa2{position: relative; display: block; margin-left: auto; margin-right: auto; width: 100%; height: auto; }
                    .col2Capa2{position: relative; width: 100%; height: auto;}
                    .iconSedes{position: relative; width: 30px; height: auto; padding-right: 15px;}
                    .txt1Capa2Body{position: relative;   color: #000; font-size: 2em; width: 100%; display: inline-block; 
                        margin-left: auto; margin-right: auto; font-family:"east"; }
                    .txt2Capa2{ position: relative; width: 100%; top: -50px;  color: #000; font-size: 1.3em; 
                        }
            
                    .col3Capa2{position: relative; width: 100%; height: auto;}
                

             
                    

                    #capa3Body{position: relative; width: 100%; height: auto;}
                    .col2Capa3{position:relative; width: 100%; height: auto;}
                    .txt1Capa3{font-size: 1.7em; padding-top: 30px; padding-left: 0px;}
                    #btn11{width:150px; }


#capa4Body{ background-size: cover;}
    .fila1Capa4{position: relative; width: 100%; height: 100px; }
   .fila2Capa4{ width: 90%; height: 1100px; }
        .col1Capa4{ position: relative; width: 100%; height: auto;}
        .col2Capa4{position: relative; width: 100%; height: 50px;}

}