body {
    margin: 0 auto;
    background-color: #fff;
    padding: 0;
    margin: 0;
    overflow-x: hidden;
}



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



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



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

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

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

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


        .fila1Body {
            display: flex;
            align-items: center; /* Centrar verticalmente los elementos dentro del contenedor */
            height: 300px;
            background-color: #ff6600;
            background-image: url(../imagenes/fondoEncab.png); background-size: cover; background-repeat: no-repeat;
          }



          .col1Body {
            flex: 1;
            /*flex: 2 1 200px;*/
            padding: 0px;/*es espaciado general para los elementos dentro de la columna*/
            margin: 0px;/*es margen general para la columna de acuerdo al borde del contenedor*/
            text-align: center; color: #fff; 
            
          }




 
#capa2{
    position:relative;
    width:100%;
    height:auto;
    background-color:#e9eaea;
  
    }
                                
                                 
                                
                                    .fila{position:relative; width:100%; height:auto; }
                                        .txt{position:relative; width:100%; text-align:center; font-size:2.7em; font-family:Dulcelin; display:inline-block}
                                        .linea3{position:relative; background-color:#000; border-color:#000; width:200px; height:1px; display:block; margin-left:auto;
                                        margin-right:auto}
                                    
                                    
                                        .subCapa1Body{
                                            position:relative;
                                            width:100%;
                                            height:auto;
                                        }
                                                .txt1CapaBody{
                                                    position:relative; display: inline-block; width:100%; text-align:center; font-size:3em; color:#3E3E3E; padding-top:50px;			
                                                }
                                                
                                                
                                    
                                    
                                            .linea{
                                                position: relative;
                                                width: 30%;
                                                top: -20px;
                                                height: 2px;
                                                background-color: #3E3E3E;
                                                margin-left: auto;
                                                margin-right: auto;
                                            }
                                    
                                    
                                    
                                    .subCapa2Body{
                                        position:relative;
                                        width:100%;
                                        height:auto
                                    }
                                    
                                                /*********************INICIAO SCROLLAO********************/
                                                    #global {
                                                        position: relative;
                                                        margin-left: auto;
                                                        margin-right: auto;
                                                        
                                                        height: auto;
                                                        width:1300px;
                                                        overflow-y: scroll;
                                                        overflow-x: hidden;
                                                        top:30px;
                                                        
                                                    }
                                                    
                                                    #global::-webkit-scrollbar-track
                                                    {
                                                        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
                                                        border-radius: 2px;
                                                        background-color: #F5F5F5;
                                                    }
                                                    
                                                    #global::-webkit-scrollbar
                                                    {
                                                        width: 8px;
                                                        background-color:#000;
                                                    }
                                                    
                                                    #global::-webkit-scrollbar-thumb
                                                    {
                                                        border-radius: 2px;
                                                        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
                                                        background-color:#000;
                                                    }
                                                    /************************FIN SCROLL****************************/
                                                    
                                                    
                                                /****************************INICIO MASCARA MODAL******************/		
                                                /* The Modal (background) */
                                                    .modalmask {
                                                    position: fixed;
                                                    font-family: Arial, sans-serif;
                                                    top: -80px;
                                                    right: 0;
                                                    bottom: 0;
                                                    left: 0;
                                                    background: rgba(0,0,0,0.9);
                                                    z-index: 99999;
                                                    opacity:0;
                                                    -moz-opacity: 0;
                                                     filter: alpha(opacity=0);
                                                    -webkit-transition: opacity 400ms ease-in;
                                                    -moz-transition: opacity 400ms ease-in;
                                                    transition: opacity 400ms ease-in;
                                                    pointer-events: none;
                                                    }
                                    
                                                    .modalmask:target {
                                                        opacity:1;
                                                        -moz-opacity: 0.1;
                                                        filter: alpha(opacity=1);
                                                        pointer-events: auto;
                                                    }
                                                    
                                                    
                                                    
                                                    .rotate {
                                                    margin: 6% auto;
                                                    }
                                                    
                                                    
                                                    .modalmask:target .rotate{		
                                                    transform: rotate(360deg) scale(1,1);
                                                        -webkit-transform: rotate(360deg) scale(1,1);
                                                      -moz-transform: rotate(360deg) scale(1,1);
                                                    }
                                                    
                                    
                                                    
                                                    
                                                    .close {
                                                    background:#F00;
                                                    color: #FFFFFF;
                                                    line-height: 25px;
                                                    position: absolute;
                                                    right: -10px;
                                                    text-align: center;
                                                    top: -20px;
                                                    left:1150px;
                                                    width: 24px;
                                                    text-decoration: none;
                                                    font-weight: bold;
                                                    border-radius:3px;
                                                    z-index:1000;
                                                    border:1px solid #FFF; z-index: 100000;
                                                    }
                                    
                                                    .close:hover { 
                                                        background: #000; 
                                                        color:#F00;
                                                    }
                                                /*Ejemplo de aplicaicon de estilo a un elemento lllamado four hr.style-four*/
                                                .imgFoto{position:relative; width:90%; height:auto;  top:5px; }
                                                #fotoModal{width:40%; height:auto;}
                                                /*************FIN MASCARA MODAL*******/
                                    
                                                
                                    
                                    
                                    
                                    
                                    .celda{
                                        float:left; width:25%; height:300px; 
                                    }
                                    
                                    .marco{
                                        position:relative; width:93%; height:95%; top:15px; -moz-background-size: cover;
                                            -webkit-background-size: cover; 	
                                        -o-background-size: cover; 
                                        background-color:#194b76; 
                                        border-radius: 5px ;
                                           
                                    }
                                    
                                        .imgCeldaGaleria{
                                        position:relative; width:100%; height:96%; top:5px;  -moz-background-size: cover;
                                        -webkit-background-size: cover;
                                        -o-background-size: cover;}
                                    
                                    
                                                
                                                
                                /*************FIN MASCARA MODAL*******/
                                
                                		
	
/*Celular portrait*/
@media screen and (min-width: 1px) and (max-width: 360px){

	
	.celda{
		position: relative;
		width: 95%;
		height: 300px;
		left: 5%;
	}
	
	
		#global { width:95%; height:1000px; }
		.close {left:120px; top: 100px;}	
		.imgFoto{width:100%; height:auto;  top:150px;}
		#fotoModal{width:90%; height:auto;}
	
	
	}
	
	/*Celular landscape*/
	@media screen and (min-width: 361px) and (max-width: 640px) {
			
	
	.celda{
		position: relative;
		width: 95%;
		height: 300px;
		left: 5%;
	}
	
	
		#global { width:95%; height:1000px; }
		.close {left:120px; top: 100px;}	
		.imgFoto{width:100%; height:auto;  top:150px;}
		#fotoModal{width:90%; height:auto;}
	
	
	
	}
	
	/*tablet 7.1 portrait*/
	@media screen and (min-width: 641px) and (max-width: 960px) {
		
			
	.celda{
		position: relative;
		width: 95%;
		height: 300px;
		left: 5%;
	}
	
	
		#global { width:95%; height:1000px; }
		.close {left:120px; top: 100px;}	
		.imgFoto{width:100%; height:auto;  top:150px;}
		#fotoModal{width:90%; height:auto;}
	
	
	
	}
	
	/*tablet 7.1 landscape se puede utilizer las medidas iniciales*/
	@media screen and (min-width: 961px) and (max-width: 1210px) {
	
	}