@charset "utf-8";
/* CSS Document */
body {
	margin: 0em auto;
	overflow-x:hidden;
    background-color:#fff;
	width:auto;
    padding: 0;
    margin: 0;

}




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



a {
    text-decoration: none;
    color: #000;
	font-family: "Roboto-Light";
}




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

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

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

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

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


input{
    width:38%;height:40px; border:none	; background-color:#e7e7e7; outline:none
    }
    
    textarea{
    width:38%;height:40px; border:none	; background-color:#e7e7e7; outline:none
    }


	
					
				
					
	

#capa2{
position:relative;
width:100%;
height:auto;
background-color:#e9eaea;
 
display: inline-table;
}
	
								
								
								
								
								.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: 0;
												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;
												}
								
												.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:30%; 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:#000; 
									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:auto; }
		.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) {
	
	}