@import url(normalize.css);


@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);
@import 'https://fonts.googleapis.com/css?family=Muli:300,400,400i';


/*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;
}

body {font-family: 'Raleway', sans-serif;
background-color:#DA2826 ;
}

h1 { font-size:1.8em;
font-weight:400;
	
	}

h2 { font-size:1.5em;
font-weight:200;
color:;
line-height:1.3em;


	
	}

h3 { font-size:1.3em;
font-weight:200;
color:#F30;
	
	}


#container{
	margin:auto;
	max-width: 1200px;
	border: hidden dotted 1px #000000;
	margin-left:auto;
	margin-right:auto;
}


.encabezado{
	width:100%;
	margin-left:auto;
	margin-right:auto;
	background:#FFF;
	border-top:#DA2826 1em solid;
	}
	
/*.encabezado{
	width:100%;
	margin-left:auto;
	margin-right:auto;
	background:#FFF;
	position:fixed;
	border-top:#DA2826 1em solid;
	}*/
/*.colorin{
	height:120px;
	background-color:#FFF;
}*/

.central {
	width:100%;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	}
	
.central img {
	width:100%;
	z-index:1;
	margin-bottom:-0.3em;
	}

.top{
	width:24%;
	float:left;
	margin-left:2%;
text-align:left;
margin-top:0.8em;
	

}
.top img{
	max-width:360px;
	height:auto;
	
	}


.servicio {
	
	margin-left:1%;
	float:right;
	margin-top:0em;
	padding-top:0.5em;
	padding-bottom:0.7em;
	width:63%;
		
	}



.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%;
	margin:auto;
	text-align:center;
}

.botonera ul{
	
	margin-top:0em;
	text-transform:none;
	text-decoration:none;
	text-align:center;
	margin-left:auto;
	margin-right:auto;
	margin-top:4.2em;
	
	
	}
.botonera li{
	
	float:left;
	text-transform:none;
	text-decoration:none;
	text-align:center;
	display:block;
	margin-right:1%;
	margin-left:1%;
	padding:0.2em;
	width:20%;
	}
	
.botonera li:first-child {
	margin-left:5%;
	}

/*.botonera li:last-child  {

	}*/

.botonera a{
	padding:0.3em;
  display:block;
	font-size:1.6em;
	color:#222;
	padding:0.2em 1.5em 0.2em 1.5em;
	}

.botonera a:hover {
	color:#DA2826;
	border-top:solid #DA2826 medium;  
	}
	


.frase {
	text-align:center;
	font-size:1.4em;
	font-family: 'Muli', sans-serif;
	color:#fff;
	letter-spacing:0.1em;
	
	font-weight:500;
	
	
	}


.principal2{
   width:100%;
	margin-left:auto;
	margin-right:auto;
	background-color:#FFF;
	padding:2.5em;
	}



.estudio {
	width:60%;
	font-size:1.6em;
	color:#666;
	padding-left:1em;
	float:left;
	line-height:1.6em;
	
	}
	
.estudio2 {
	width:90%;
	font-size:1.6em;
	color:#000;
	padding-left:1em;
	float:left;
	line-height:1.6em;
	
	}
.productos {
	width:100%;
	font-size:1.2em;
	color:#666;
	padding-left:1em;
	float:left;
	line-height:1.6em;
	font-weight:bold;
	
	}
	
.contacto {
	width:100%;
	font-size:1.6em;
	color:#666;
	padding-left:1em;
	float:left;
	line-height:1.6em;
	
	}
.contacto2 {
	width:50%;
	font-size:1.8em;
	color:#666;
	padding-left:1em;
	float:left;
	line-height:1.6em;	
	}	
	
.contacto3 {
	width:50%;
	font-size:1.8em;
	color:#666;
	padding-left:0em;
	float:left;
	line-height:1.6em;	
	}	
hr{
	width:60%;
	border:0;
	height:2px;
	border-top:1px dashed;/*#FF9900;*/
}

.col2{
	width:40%;
	margin:auto;
	float:left;
	padding-left:0.5em;
	}
	
	
.tipogrande{
	color:#999;
	font-size:2em;
	padding-bottom:0.5em;
	padding-top:0.5em;
}

footer {
	width:100%;
	font-family: 'Muli', sans-serif;
	background:#ECF0F5;
	line-height:1.6em;
	font-size:1.4em;
	color:#999;
	padding:2.5em 0em 2.5em  0 ;
	text-align:center;
	letter-spacing:0.1em;
	border-top: solid medium #CCC;
	}


	
.pie {
	text-align:center;
	padding-right:1em;
	font-size:1.2em;
	width:100%;
	margin:0em auto 0 auto;
	
	}
.pie a{
	text-decoration:none;
	text-transform:none;
	color:#FFF;
	
	}


.quienes {
	max-width:1000px;
		font-size:1.7em;

	margin-left:auto;
	margin-right:auto;


	
	color:#fff;
	
	}


.titulo {
	text-align:center;
	font-family: 'Muli', sans-serif;
	color:#FFF;
	font-size:2em;
	letter-spacing:0.5em;
	padding:0.2em;
	
	
	
	}

.linea {
	border-bottom:dotted 1px #ccc;
	
	}


.form{

	width:90%;

	margin:auto;

}


.txtf{
	text-align:left;
}

input,textarea,select {

	margin-top:2%;

	border: 1px solid #999;

	color:#333;

	font-family : inherit;

  font-size: 100%;

  width:100%;

  	font-family: 'Open Sans', sans-serif;
	font-weight:normal;


	

	}

	

.verif{ display: none; }

	
.google-maps {
position: relative;
padding-bottom:40%; // This is the aspect ratio /*75*/
height: 0;
overflow: hidden;
}



.google-maps iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}	
	
	
	/**/
@media screen and (max-width: 1300px){
	.servicio {
		width:70%;
		
		}
	
	
	}

@media screen and (max-width: 968px){
	
.encabezado { 
	width:100%;	
	text-align:center;
	}
	
.top{
	width:100%;	
	float:none;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}

.top img {
	max-width:250px;

	
	}

.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:22%;/*18*/
	
	
	}

.botonera li:first-child {
	margin-left:0%;
	}

/*.colorin{
	height:180px;
	background-color:#FFF;
}*/
	
.servicio img {
		margin-bottom:-0em;
		}
	
.quienes {
	width:90%;
	}
	
	
.col2{
	width:40%;
	padding-top:6em;
	margin:auto;
	float:left;
	padding-left:0.5em;
	}
	
	
}

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

	
	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-left:0;
	
	
	}
.botonera li{
	width:100%;
	margin-right:auto;
	margin-left:auto;
	border-bottom:#FFFFFF 1px solid;
	margin-top:0;
	
	
	
	}

.botonera li:first-child {
	margin-left:0%;
	}

.botonera a{
	
	display:block;
	font-size:1.5em;
	color:#222;
	text-transform:none;
	text-decoration:none;
	padding-top:1em;
	padding-bottom:1em;
	padding-left:1em;
	border-bottom:thin solid #CCC;
	text-align:left;
	margin-right:0;
	
	}

.botonera a:hover {
	
	background-color:#DA2826;
	color:#fff;
	border-top:none;
	
	}

/*.colorin{
	height:180px;
	background-color:#FFF;
}*/



.estudio {
	width:90%;
	font-size:1.6em;
	color:#666;
	padding-left:1em;
	float:left;
	line-height:1.6em;
	margin-bottom:1em;
	
	
	
}
.col2{
	width:100%;
	margin:auto;
	float:left;
	padding-left:0em;
	}
	

.rubros{
	height: auto;
	width: 50%;

}

.contacto2 {
	width:100%;
	padding-left:0em;
	text-align:center;	
	}	
	
.contacto3 {
	width:100%;
	}	

}

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


	
.encabezado { 
	width:100%;
	text-align:center;
	/*position:absolute;*/
	
	}
	
.top{

	width:100%;	
	float:none;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}

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


.tel {
	display:block;
float:right;
width:50%;
margin-top:0.8em;

	
	}




.titulo {
	font-size:1.6em;
		letter-spacing:0.2em;
	padding:0.2em;
	
	text-align:center;
	
	}
	
.frase {
	
	font-size:1.4em;
	}
	



.rubros{
	height: auto;
	width: 95%;/*22*/
}

.col2{
	width:100%;
	padding-top:0.5em;
	padding-left:0em;
	}


hr{
	width:100%;
	border-top:1px dashed;
}


	}