@charset "utf-8";



/* CSS Document */



@import url(normalize.min.css);







/*------RESETS-------*/

figure{

	line-height:0;
}


#container{

	max-width: none;
	margin: 0 auto;
	float: none;
	display: block;
	}



body{
	overflow-x: hidden;
	overflow-y: hidden;
	background-color: #FFF;
	font-family: Verdana;
	font-size: 10px;
	text-align: center;



	}


.center-block {

  display: block;
  margin-right: auto;
  margin-left: auto;

}




.cleaner{

	clear: both;


	}



ul, ol, li{

	margin: 0;
	padding: 0;
	list-style:none;
}




img{
	display: block;
	width: 100%;
	height: auto;
}




html{
	overflow-x: hidden;
	font-size: 10px;
}


.col-1{
	width: 100%; 
	height: 10px;
	margin-top:0;
	background-color: #BE0F2C;

}



#col-2{
	background-image:url(imgs/encabezado.jpg);



}


#encabezado {
	max-width:1170px;
	margin-left:auto;
	margin-right:auto;
	}


#banner{
	display: none;
	max-width:1170px;
	margin-left:auto;
	margin-right:auto;
}

/*===== VIDEO =====*/


.video{
	widht:100%;
	display: block;
  	margin-right: auto;
 	margin-left: auto;
	text-align:center;
	float:none;
	background-image:url(imgs/fondotxt.jpg);
}


#video{
	padding-top: 60%;
	position: relative;
	float:none;
}
#video iframe{
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	float:none;

}


/*boton arriba*/

#IrArriba {

position: fixed;
bottom: 30px; 
right: 30px; 

}



#IrArriba span {

width: 60px; 
height: 60px; 
display: block;

background: url(imgs/arriba.png) no-repeat center center;

}




/*---HEADER---*/



h1{



	font-family:Verdana;

	font-size:1.2em;

	line-height:1.8em;

	color:#fff;

	text-align:center;

	word-wrap: break-word;



}







p{



	font-family:Verdana;

	color:#000;

	font-size:1.5em;

	text-align:justify;

	margin-left:10px;



}


txtfooter{
	font-size: 1.5em;

	text-align: center;

	color: #FFF;
}




/*===== NAV =====*/


.toggle-button{
	display: block;
	width:20px;
	margin:auto;
	box-sizing: content-box;
	padding:1em 1.5em;
	background-color: #333;
	border-radius: 8px;

}



.toggle-button span{

	display: block;
	width: 100%;
	height: 20px;
	border-top: solid 2px #fff;
	border-bottom: solid 2px #fff;
	position: relative;
	text-indent: -9999px;


}



.toggle-button span::after{
	content:'';
	width: 100%;
	height: 2px;
	background-color: #fff;
	position: absolute;
	left:0; top:50%;
	margin-top: -1px;

}



#navegador{

	display: none;
	text-decoration:none;
	margin:center auto 0;

}



#navegador li a{

	font-size: 1.4em;

	display: block;

	background-color: #B9FF73;

	color: #111;

	text-align: center;

	padding-top: 1.2em;

	padding-right: 1.2em; 

	padding-left: 1.2em; 

	padding-bottom: 1.2em;

	text-decoration: none;

	border-bottom: solid 1px #333;

}



#navegador li:hover a{



	background-color:#CCC;

	list-style-type: none;

	list-style-image: none;



}



/*===== MAIN-BANNER =====*/


.titulo{

	font-family:'Verdana';
	font-size:1.4em;
	letter-spacing:1em;
	color:#004400;
	text-align:center;
	padding-top:1.5em;
	padding-bottom:1em;
	border-bottom:medium solid #004400;
	background-color:#B9FF73;
	font-weight:600;

}

/*===== COLUMNAS =====*/



#columnas{
	overflow:hidden;
	margin:0 auto 0 auto;
	background-image:url(imgs/fondotxt.jpg);


}



.contacto{

	widht: 80%;

	background-color: #030;

	margin-top: 20px;

	width: 80%;

	height: auto;

	display: block;

    margin-right: auto;

    margin-left: auto;


}



.izquierda{

	width: auto;

	font-size: 1.5em;

	color: #FFF;

	text-align: left;

	float: left;

	margin-left: 1em;

	padding-left: 1em;

	margin-top: 0;

	margin-right: 15px;

	margin-bottom: 0;

	padding-right: 15px;



}

	
footer{

	margin-top:5px;
	background-color: #4205BE;
	widht:100%;
	height:6.8317677%;

}


.pie { /*tarsis*/
	width:100%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.2em;
	color: #FFF;
	text-align:center;



}


/*===== MEDIA-QUERIES =====*/


@media screen and (min-width: 480px){



	.toggle-button{

		display: none;



	}



	#navegador {

	display: block;

	margin: 0 auto;

	float: none;

	width: 100%;



	}



	#navegador li{

	float: left;

	margin-top: 0;

	margin-right: 1.041666666666667%;

	margin-left: 1.041666666666667%;

	margin-bottom: 0;

	width: 31%;



	}



	#navegador li a{

	font-size: 1.4em;

	text-align: center;

	padding-right: 0;

	padding-left: 0;

	padding-bottom: 1.4em;

	border-bottom: none;

	margin-top: 7px;

	}



	



		#columnas{



	width: 100%;
	margin:0 auto 0 auto;







	}




	footer{
		margin-left: 1.041666666666667%;
		margin-right: 1.041666666666667%;
		text-align: center;
		width:100%;
	}


	.izquierda{



	width: auto;



	margin-top: 0;



	margin-right: 15px;



	margin-bottom: 0;



	margin-left: auto;



	padding-right: 15px;



	}



	



#banner{
	display: block;
	margin-bottom: 8px;
	margin-top: 8px;



	}



	h1{



	font-family:Verdana;

	font-size:1.6em;

	color:#fff;

	text-align:center;

	overflow:hidden;



}





}




@media screen and (min-width: 768px){



	.toggle-button{

		display: none;



	}



	#navegador{

	display: block;

	margin: 0 auto;

	float: none;

	width: 75%;

	padding-top: 11px;



	}



	#navegador li{

	width: 31%;

	margin-top: 0;

	margin-right: 1.041666666666667%;

	margin-left: 1.041666666666667%;

	margin-bottom: 0;

	float: left;

	}



	#navegador a{



		font-size: 1.6em;

		text-align: center;

		padding:1.4em 0;

		border-bottom: none;



	}



		#columnas{
	width: 100%;

	margin:0 auto 0 auto;

	}




	.izquierda{
	width:46%;

	margin:0 auto 0 auto;

	}

	



	h1{
	font-family:Verdana;

	font-size:1.6em;

	color:#fff;

	text-align:center;

}


}



@media screen and (min-width: 992px){

	#columnas{
	width: 100%;

	margin: 0;

	padding: 0px;
	}



	h1{
	font-family:Verdana;

	font-size:1.6em;

	color:#fff;

	text-align:center;

}



	#video{
		float: none;
		padding-top: 28%;
		width: 64.58333333333333%;
	}
}





