@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: "Adolphus";
    src: url(../fonts/Adolphus.ttf) format("truetype")
}

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


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

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

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

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

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

h3 {
    font-family: "Adolphus";
}

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

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

#screenGuide{ top:0px; left:0px; font-size:1.5em; color:#F00; z-index:10000; position:fixed}
.S1{display:none}
.S2{display:none}
.S3{display:none}
.S4{display:none}
.S5{display:none}


#capa1{
	position:relative;
	width:100%;
	height:800px;
	background-color:#000;
}



#capa2{
	position:relative;
	width:auto;
	height:100px;
	background-color:#015281;
	-moz-background-size: 100%;
    -webkit-background-size: 100%;   
	-o-background-size: 100%;
	z-index:5
}

	.txt1Capa2{
	 position:absolute; width:100%; text-align:center; color:#FFF; font-size:2em; padding-top:5px;
	}
	
	

#capa3{
	position:relative;
	width:auto;
	height:450px;
	background-color:#000;
	-moz-background-size: 100%;
    -webkit-background-size: 100%;   
	-o-background-size: 100%;
	
}
	.columnaCapa3{
	float:left; width:25%; height:100%; background-color:#000;
	-moz-background-size: cover;
    -webkit-background-size: cover;   
	-o-background-size: cover;
	}
	
		.txtColumnaCapa3{
			width:100%; text-align:center; color:#FFF; font-size:2.3em; padding-top:80px
		}
		
		.txt2ColumnaCapa3{
			width:100%; text-align:center; color:#FFF; font-size:1.5em; padding-top:30px
		}


#capa4{
	position:relative;
	width:auto;
	height:1620px;
	background-color:#fff;
	-moz-background-size: 100%;
    -webkit-background-size: 100%;   
	-o-background-size: 100%;
}

	.cat{
		position:absolute; 
		bottom:10px;
		height:40%; 
		width:700px; 
		right:0px;
	}

	.linkVer{
		float:left;
		height:100%;
		width:24%;
		background-color:transparent;
		border:solid;
		border-width:2px ;
		border-color:#013b7d;
	}
	
		.txtLink{
		position:relative;
		text-align:center; top:-5px; color:#013b7d;
		font-size:1.2em
		}

	.fila1Capa4
	{
		position:relative;
		width:100%;
		height:120px;
	}
	
	
	.txt1Capa4{
	position:absolute; bottom:0px; left:50px; font-size:3em; color:#00243a
	}
	
	
	.txt2Capa4{
	position:absolute; top:70px; left:50px; font-size:1.2em; color:#303030
	}
	
	
	.fila2Capa4
	{
		position:relative;
		width:100%;
		height:420px;
	}
		.comodin{
			float:left;
			width:4%;
			height:100%;
		}
	
		.columna
		{
			float:left;
			width:28%;
		}

			.imgColumnaCapa4
			{
				position:relative;
				width:90%;
				height:auto
			}
			
			.txt1ColumnaCapa4{
				color:#013b7d
			}
			
			.txt2ColumnaCapa4{
				top:-100px;
				text-align:justify;
				
			}




#grupo1{
position:absolute; width:auto; height:100%;
}

#grupo2{
position:absolute; width:auto; height:100%; visibility:hidden 
}


#grupo3{
position:absolute; width:auto; height:100%; background-color:#FFF; visibility:hidden
}


#grupo4{
position:absolute; width:auto; height:100%;  visibility:hidden
}




#capa5{
	position:relative;
	width:auto;
	height:400px;
	background-color:#060;
}
	#map1{
	position:relative; height:550px;   background-color:#000; 
	}

#capa6{
	position:relative;
	width:auto;
	height:300px;
	background-color:#015281;
}
	#footer{
		position:relative;
		width:100%;
		height:100%;
		
	}


/*Celular portrait*/
@media screen and (min-width: 1px) and (max-width: 360px) {
	.S1{
		display:inline
	}

#capa1{	height:250px;}
	
#capa2{
	height:150px;
}
		
	
	#capa3{
	height:1800px;
	}
	
	.columnaCapa3{
		position:relative;
		width:100%;
		height:450px;
	}
	
	
#capa4{
	height:4800px;
}


.fila1Capa4
	{
		position:relative;
		width:100%;
		height:200px;
	}
	
	.txt1Capa4{
	position:absolute; top:-150px; left:20px; font-size:3em; color:#00243a
	}
	
	
	.txt2Capa4{
	position:absolute; top:10px; left:20px; font-size:1.2em; color:#303030
	}


	.cat{
		position:absolute; 
		bottom:40px;
		height:15%; 
		width:100%; 
		left:0px;
	}

	.linkVer{
		float:left;
		height:100%;
		width:23%;
		background-color:transparent;
		border:solid;
		border-width:2px ;
		border-color:#013b7d;
	}
	
		.txtLink{
		position:relative;
		text-align:center; top:-5px; color:#013b7d;
		font-size:0.68em
		}



	
	.fila2Capa4
	{
		position:relative;
		width:100%;
		height:1350px;
	}
		.comodin{
			display:none
		}
	
		.columna
		{
			width:100%;
			height:450px;
		}

			.imgColumnaCapa4
			{
				position:relative;
				width:100%;
				height:350px
			}
			
			.txt1ColumnaCapa4{
				color:#013b7d
			}
			
			.txt2ColumnaCapa4{
				top:-100px;
				text-align:justify;
				
			}

#capa6{
	position:relative;
	width:auto;
	height:700px;
	background-color:#015281;
}
	
}

/*Celular landscape*/
@media screen and (min-width: 361px) and (max-width: 640px) {
	.S2{
		display:inline
	}
#capa1{	height:350px;}	
	#capa2{
	height:150px;
}
		
	
	#capa3{
	height:1800px;
	}
	
	.columnaCapa3{
		position:relative;
		width:100%;
		height:450px;
	}
	
	
#capa4{
	height:3800px;
}


	.fila1Capa4
	{
		position:relative;
		width:100%;
		height:200px;
	}
	
	.txt1Capa4{
	position:absolute; top:-100px; left:20px; font-size:3em; color:#00243a
	}
	
	
	.txt2Capa4{
	position:absolute; top:10px; left:20px; font-size:1.2em; color:#303030
	}

	

	.cat{
		position:absolute; 
		bottom:40px;
		height:20%; 
		width:100%; 
		left:0px;
	}

	.linkVer{
		float:left;
		height:100%;
		width:23%;
		background-color:transparent;
		border:solid;
		border-width:2px ;
		border-color:#013b7d;
	}
	
		.txtLink{
		position:relative;
		text-align:center; top:-5px; color:#013b7d;
		font-size:1em
		}



	.fila2Capa4
	{
		position:relative;
		width:100%;
		height:1350px;
	}
		.comodin{
			display:none
		}
	
		.columna
		{
			width:100%;
			height:450px;
		}

			.imgColumnaCapa4
			{
				position:relative;
				width:auto;
				height:350px; padding-left:100px
			}
			
			.txt1ColumnaCapa4{
				color:#013b7d
			}
			
			.txt2ColumnaCapa4{
				top:-100px;
				text-align:justify;
				
			}

	

#capa6{
	position:relative;
	width:auto;
	height:700px;
	background-color:#015281;
}
	#footer{
		position:relative;
		width:100%;
		height:100%;
		
	}
	
	
}

/*tablet 7.1 portrait*/
@media screen and (min-width: 641px) and (max-width: 960px) {
	.S3{
		display:inline
	}
#capa1{	height:400px;}		
		#capa2{
	height:150px;
}
		
	
	#capa3{
	height:1800px;
	}
	
	.columnaCapa3{
		position:relative;
		width:100%;
		height:450px;
	}
	
	
#capa4{
	height:3800px;
}


.fila1Capa4
	{
		position:relative;
		width:100%;
		height:200px;
	}
	
	.txt1Capa4{
	position:absolute; top:-100px; left:20px; font-size:3em; color:#00243a
	}
	
	
	.txt2Capa4{
	position:absolute; top:10px; left:20px; font-size:1.2em; color:#303030
	}

	.cat{
		position:absolute; 
		bottom:40px;
		height:25%; 
		width:100%; 
		left:0px;
	}

	.linkVer{
		float:left;
		height:100%;
		width:23%;
		background-color:transparent;
		border:solid;
		border-width:2px ;
		border-color:#013b7d;
	}
	
		.txtLink{
		position:relative;
		text-align:center; top:-5px; color:#013b7d;
		font-size:1em
		}


	

	
	.fila2Capa4
	{
		position:relative;
		width:100%;
		height:1350px;
	}
		.comodin{
			display:none
		}
	
		.columna
		{
			width:100%;
			height:450px;
		}

			.imgColumnaCapa4
			{
				position:relative;
				width:auto;
				height:350px; padding-left:200px
			}
			
			.txt1ColumnaCapa4{
				color:#013b7d
			}
			
			.txt2ColumnaCapa4{
				top:-100px;
				text-align:justify;
				
			}

	

#capa6{
	position:relative;
	width:auto;
	height:800px;
	background-color:#015281;
}
	
	
}

/*tablet 7.1 landscape se puede utilizer las medidas iniciales*/
@media screen and (min-width: 961px) and (max-width: 962px) {
	
	.S4{
		display:inline
	}
	
	
	
	
		.txtColumnaCapa3{
			width:100%; text-align:center; color:#FFF; font-size:2em; padding-top:80px
		}
		
		.txt2ColumnaCapa3{
			width:100%; text-align:center; color:#FFF; font-size:1.5em; padding-top:30px
		}



.fila1Capa4
	{
		position:relative;
		width:100%;
		height:150px;
	}
	
	
	.txt1Capa4{
	position:absolute; top:-70px; left:50px; font-size:3em; color:#00243a
	}
	
	
	.txt2Capa4{
	position:absolute; top:10px; left:50px; font-size:1.2em; color:#303030
	}
	


	.cat{
		position:absolute; 
		bottom:-15px;
		height:40%; 
		width:700px; 
		right:0px;
	}

	.linkVer{
		float:left;
		height:100%;
		width:24%;
		background-color:transparent;
		border:solid;
		border-width:2px ;
		border-color:#013b7d;
	}
	
		.txtLink{
		position:relative;
		text-align:center; top:-5px; color:#013b7d;
		font-size:1.2em
		}


	
	.fila2Capa4
	{
		position:relative;
		width:100%;
		height:420px;
	}
		.comodin{
			float:left;
			width:4%;
			height:100%;
		}
	
		.columna
		{
			float:left;
			width:28%;
		}

			.imgColumnaCapa4
			{
				position:relative;
				width:100%;
				height:350px
			}
			
			.txt1ColumnaCapa4{
				color:#013b7d
			}
			
			.txt2ColumnaCapa4{
				top:-100px;
				text-align:justify;
				
			}




#capa5{
	position:relative;
	width:auto;
	height:400px;
	background-color:#060;
}
	#map1{
	position:relative; height:550px;   background-color:#000; 
	}

#capa6{
	position:relative;
	width:auto;
	height:300px;
	background-color:#015281;
}
	#footer{
		position:relative;
		width:100%;
		height:100%;
		
	}


	

}

/*pantallas grandes*/
@media screen and (min-width: 963px) and (max-width: 1210px) {
	.S5{
		display:inline
	}
	
		
	
		.txtColumnaCapa3{
			width:100%; text-align:center; color:#FFF; font-size:2em; padding-top:80px
		}
		
		.txt2ColumnaCapa3{
			width:100%; text-align:center; color:#FFF; font-size:1.5em; padding-top:30px
		}



.fila1Capa4
	{
		position:relative;
		width:100%;
		height:150px;
	}
	
	
	.txt1Capa4{
	position:absolute; top:-70px; left:50px; font-size:3em; color:#00243a
	}
	
	
	.txt2Capa4{
	position:absolute; top:10px; left:50px; font-size:1.2em; color:#303030
	}
	


	.cat{
		position:absolute; 
		bottom:-15px;
		height:40%; 
		width:700px; 
		right:0px;
	}

	.linkVer{
		float:left;
		height:100%;
		width:24%;
		background-color:transparent;
		border:solid;
		border-width:2px ;
		border-color:#013b7d;
	}
	
		.txtLink{
		position:relative;
		text-align:center; top:-5px; color:#013b7d;
		font-size:1.2em
		}


	
	.fila2Capa4
	{
		position:relative;
		width:100%;
		height:420px;
	}
		.comodin{
			float:left;
			width:4%;
			height:100%;
		}
	
		.columna
		{
			float:left;
			width:28%;
		}

			.imgColumnaCapa4
			{
				position:relative;
				width:100%;
				height:350px
			}
			
			.txt1ColumnaCapa4{
				color:#013b7d
			}
			
			.txt2ColumnaCapa4{
				top:-100px;
				text-align:justify;
				
			}




#capa5{
	position:relative;
	width:auto;
	height:400px;
	background-color:#060;
}
	#map1{
	position:relative; height:550px;   background-color:#000; 
	}

#capa6{
	position:relative;
	width:auto;
	height:300px;
	background-color:#015281;
}
	#footer{
		position:relative;
		width:100%;
		height:100%;
		
	}
	
}