@import url(normalize.css);





@import 'https://fonts.googleapis.com/css?family=Muli:300,400,400i';

@import 'https://fonts.googleapis.com/css?family=Raleway:300,300i,400,400i,500,500i,600,600i,700';



@import url(http://fonts.googleapis.com/css?family=Roboto:400,500,700);



@import url(https://fonts.googleapis.com/css?family=Roboto+Condensed:400,700,400italic,700italic,300);





/*resets*/

*{

	box-sizing:border-box;

	border:none;

	text-decoration: none;

}

ul, ol{

	margin: 0;

	padding: 0;

	list-style: none;

}



figure{

	margin: 0;

	display:block;

}



.img-responsive {

	width:100%;

	height:auto;

	

	}





/*boton arriba*/

#IrArriba {

position: fixed;

bottom: 30px; /* Distancia desde abajo */

right: 30px; /* Distancia desde la derecha */

}



#IrArriba span {

width: 60px; /* Ancho del botón */

height: 60px; /* Alto del botón */

display: block;

background: url(imgs/arriba.png) no-repeat center center;

}



/*basicos*/

html{

	font-size: 10px;

	overflow-x:hidden;

}



body {font-family: "Roboto", sans-serif;

background:#333 ;

}



h1 { font-size:1.8em;

font-weight:400;

	

	}



h2 { 

	font-family:"Roboto", sans-serif;

	font-size:2.2em;

	font-weight:bold;

	color:;

	line-height:1.6em;

	}



h3 { 

	font-family:"Roboto", sans-serif;

	font-size:3.2em;

	font-weight:bold;

	color:#FFF;

	line-height:1.4em;

	}





#container{

	margin:auto;

	max-width: 1200px;

	border: hidden dotted 1px #000000;

	margin-left:auto;

	margin-right:auto;

	;

}

.topi{

	

	width:100%;

	margin-left:auto;

	margin-right:auto;

	background: url(imgs/fondotop.jpg) repeat-x #fff;

	border-bottom:#FE9937 medium solid;



	}

	

	

.central1 {

	width:100%;

	margin-left:auto;

	margin-right:auto;

	margin-top:0em;

	height:auto;

}




.telsup{

	width:100%;

	float:left;

	height:auto;

	text-align:center;
	font-family:"Roboto", sans-serif;
	font-size:2.6em;
	font-weight:bold;
	color:#000;
/*text-shadow: 0.1em 0.1em #333;*/
}

.telsup a {
	color:#000;
}


.datos{
	width: 100%;
	float: left;
	height: auto;
	text-align: center;
	background-color: #FE9937;
	font-family: "Roboto", serif;
	font-size: 2.2em;
	font-weight: bold;
	color: #000;
	line-height: 1.6em;
	padding: 0.5em;

	/*text-shadow: 0.1em 0.1em #FFF;*/


}

.datos a{
	color:#000;
}


.central2 {

	width:100%;

	margin-left:auto;

	margin-right:auto;

	height:auto;

	background-color:#AFB05E;

}



.txt{
	float:left;
	width:45%;
	margin:2%;
	text-align:left;
}

.txtc{
	float:left;
	width:60%;
	margin:2%;
	text-align:left;
}

.txtc2{
	float:left;
	width:30%;
	margin:2%;
	text-align:left;
}

/*.txt2{
	width:40%;
	margin:auto;
	margin:2%;
	float:right;
	padding:0em 0.5em 0.5em 0.5em;
	text-align:center;
}*/







.subtitulo2{

	background-color: #00BFFF;

	color: #000;

	border-radius: 3px;

	padding: 0.1em 0em 0.1em 0.5em;

	float: left;

	width: 100%;

	font-weight:bold;

	text-align:center;

}



hr{

	border:0;

	width:50%;

	height:2px;

	border-top:1px solid #FFC;

}







.titulos{
	background-color: #666666;
	margin: auto;
	widht: 100%;
	padding: 0.5em;
	text-align: center;
	color: #FFF;
	font-size: 1.8em;
	font-family: Roboto;
	font-weight: normal;
	letter-spacing: 0.5em;

}





.top{
	width: 30%;
	float: left;
	margin-left: 2%;
	text-align: left;
	padding-top: 1em;
	padding-bottom: 1em;

}







.servicio {

	margin-left:1%;

	float:right;

	letter-spacing:;

	text-align:right;

	margin-top:2em;

	padding-top:2em;

	padding-bottom:0.7em;

	width:50%;/*70*/

	

	}







.portabotones {

	

	

	}

.porta {

	max-width:1000px;

	margin-left:auto;

	margin-right:auto;

	

	}



#centro {

	width:100%;

	margin-left:auto;

	margin-right:auto;



	

	}



#interior {

	max-width:1000px;



margin-left:auto;

margin-right:auto;



	

	}



.cleaner{

	clear: both;

}

img-responsive{

	width: 100%;

	height:auto;

}



.toogle-button { display:none;

	

	}





.botonera{

	width:100%;/*70*/

	float:right;

}



.botonera ul{

	

	margin-top:0em;

	text-transform:none;

	text-decoration:none;

	text-align:center;

	margin-left:auto;

	margin-right:auto;

	margin-top:2.5em;

	

	

	}

.botonera li{

	float:left;

	text-transform:none;

	text-decoration:none;

	text-align:center;

	display:block;

	width:30%;/*20*/

	margin-right:1%;

	margin-left:1%;

	padding:0.2em;

	}

	





.botonera a{

	

	padding:0.3em;

  	display:block;

	font-size:1.4em;

	color:#FFF;

	background-color:#464646;

	border-radius:3px;
	}

.botonera a:hover {
	background-image:none;
	color:#000;
	font-weight:bold;
	background-color:#FE9937;
	}
	

.principal{


	font-size:2em;

    width:100%;

	margin-left:auto;

	margin-right:auto;

	padding:0.5em;
	color:#FFF;

	

	}



.principal2{

	font-family:Georgia, "Times New Roman", Times, serif;

	text-align:center;

	font-weight:bold;

	font-size:2em;

    width:100%;

	margin-left:auto;

	margin-right:auto;

	padding:0.5em;

	background-color:#DFDFD0;

	

	}



footer {

	width:100%;

	font-family: 'Muli', sans-serif;

	background: url(imgs/fondotop.jpg);

	line-height:1.6em;

	font-size:1.4em;

	color:#333;

	padding:1.5em 0em 1.5em  0 ;

	text-align:center;

	letter-spacing:0.1em;

	}



	



.pie {

	text-align:center;

	font-size:1.3em;

	width:100%;

	margin:auto;

	

	}

.pie a{

	text-decoration:none;

	text-transform:none;

	color:#fff;

	}






/*MEDIA*/



@media screen and (max-width: 1300px){

	.servicio {

	width: 50%;

		}

	

	

	}



@media screen and (max-width: 968px){

	

	.topi { width:100%;

text-align:center;

	

	}

	

	.top{



	width:100%;	

	float:none;

	margin-left:auto;

	margin-right:auto;

	text-align:center;

		

	

}

.top img {

	max-width:360px;



	

	}



.porta {

	float:none;

	width:100%;

	

	}



.botonera ul {

	margin-top:1em;

	

	}

.botonera li {

	margin-top:0em;

	width:19.6%;

	

	}

	

.servicio {

	width:100%;

	text-align:center;

	margin-left:auto;

	margin-right:auto;

	margin-top:-0.5em;

	margin-bottom:0;

	float:none;

	padding-top:0em;

	}

	

.botonera li{

	width:31%;

	margin-bottom:0.5em;

	padding:0.3em;

	}



h2 { 

	font-size:2.1em;

	line-height:1.4em;

	}



h3 { 

	font-size:3.2em;

	line-height:1.2em;

	}



	

.quienes {

	width:90%;

	

	}

	

}



@media screen and (max-width: 899px){	




.datos{

	width:100%;

	float:left;

	height:auto;

	text-align:center;





}	

.txt{
	width:100%;
}



.txt2{
	width:100%;
}
	
.txtc{
	float:left;
	width:100%;
	margin:2%;
	text-align:left;
}

.txtc2{
	float:left;
	width:100%;
	margin:2%;
	text-align:left;
}
}



@media screen and (max-width: 655px){	




	nav {

		display:none;

		

		}

	

	.portabotones {

	height:auto;

	

	}

		

.toogle-button { display:block;

	

	}



.toogle-button{

	display: block;

	width: 50px;

	margin:1.8em auto 1em auto;
	background-color: #333;

	border-radius: 10px;

	padding: 10px;

}

.toogle-button span{

	display: block;

	border-top: solid 2px #fff;

	border-bottom: solid 2px #fff;

	height: 16px;

	position: relative;

	text-indent: -9999px;

}

.toogle-button span:after{

	content: '';

	width: 100%;

	height: 2px;

	background-color: #fff;

	position: absolute;

	left: 0;

	top: 50%;

	margin-top: -1px;

}



.botonera ul{

	font-family: 'Roboto', sans-serif;

	margin-top:0;

	text-transform:none;

	text-decoration:none;

	width:100%;

	margin:0em;

	float:none;

	}

	

	

.botonera{
	width:100%;
	float:none;
}	

	

.botonera li{

	width:100%;

	margin:0em;

	border-bottom:#FFFFFF 1px solid;

}




.botonera a{

	width:100%;

	display:block;

	font-size:1.5em;

	color:#FFF;

	text-transform:none;

	text-decoration:none;

	padding-top:0.5em;

	padding-bottom:0.5em;

	padding-left:0em;

	background-color:#464646;

	text-align:center;

	margin:0em;
}



.botonera a:hover {
	background-color:#FE9937;
	color:#000;
	font-weight:700;
	}


}



@media screen and (max-width: 500px){

.topi { 
	width:100%;
	text-align:center;
	}

	

.top{
	width:100%;	

	float:none;

	margin-left:auto;

	margin-right:auto;

	text-align:center;
}



.porta {
	float:none;
	width:100%;
}





.text {
	width:90%;
	margin-left:5%;
	margin-right:5%;
	}



.text img {
	width:90%;
	margin-left:5%;
	margin-right:5%;
	}



.foto {
	width:90%;
	margin-left:5%;
	margin-right:5%;
	}



/*quienes*/



.quienes {
	text-align:left;
}



.principal{
	margin-top:0em;
	}



.fotodos {

	width:90%;

	margin-left:5%;

	margin-right:5%;

	text-align:center;

	}





.columna {

	width:90%;

	margin-left:5%;

	margin-right:5%;

}



.frase {
	font-size:1.4em;
	}
	

.titulo{

	font-size:3.6em;/*1.8*/

	text-align:center;

	color:#F8B038;

	padding-top:0.2em;

	margin-left:0em;
}



	}



@media screen and (max-width: 430px){


.contacto{
	width:99%;
}


}