*{
	padding:0;
	margin:0;
}
body,html{
	background:url(img/fondo.jpg);
	background-attachment:fixed;
	
	height:100%;
	
}
hr{
	border: transparent 10px #1b4166;
	
	border-radius:80px;
	}

	
				/* Inicio de menú*/

.nav{	
	 margin-top:30px;
	 float:left;
	 left:50%;
	 list-style-type:none;
	 margin:0 auto;
	 padding:0;
	 position:relative;
	 font-size:15px;
	 font-family:roboto;
	 
	 
	}
.nav li
	{
		float:left;
		position:relative;
		right:50%;
	}

	.nav li a{
		color:#000;
		text-decoration: none;
		padding:8px;
		text-align:center;
		display:block;
		border-radius:3px;
		float:left;
		position:relative;
	}
	.nav li a:hover{
		background-color:#1b4166;
		color:#fff;
		border-radius:3px;
		
	}
	
	
	
				/* Fin del menú*/
				

	
#contenedor,#contenedor1,header{
	background:#fff;
	display:table;
	width:90%;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	border-radius:10px;
	
}
#contenedor1{
	
	height:115%;
	
	
}

header{
	width:100%;
	background:#fff;
	height:120px;
	border-radius:10px;
	float:left;
	
}
#logo,#menu,#contacto{
	margin-top:5px;
	background:#fff;
	width:30%;
	height:130px;
	float:left;
	border-radius:10px;
	
}
#sociales{
	
	width:100%;
	height:1px;
	float:left;

	
}
#sociales img {
	
	margin-left:100%;
	width:3%;
}
#sociales img:hover{
	
	transform: translateX(3px);
}
#contacto{
	margin-top:0px;

	background:#fff;
	width:20%;
	float:left;
}

#menu{
	background:#fff;
	width:50%;
	height:43px;
	margin-top:70px;
	float:left;
	
}

#banner,#banner1{
	background:#fff	;
	width:100%;
	height:auto;
	float:left;
	border-radius:10px;
}
#banner1 img{
	
	height:auto;
	float:left;
}
#banner1{
	height:126px;
}
#contenido,main{
	background:#fff; 	
	width:100%;
	height:auto;
	float:left;
	border-radius:10px;
}
main{
	width:90%;
	height:1060px;
	margin-left:5%;
	margin-right:5%;
	display:table;
	
}
div#mapa{
	padding:20px;
	width:50%;
	height:350px;
	float:left;
	font-family:roboto;
}

div#mapa img{
	 vertical-align: middle;
	 
}
div#redes{
	width:18%;
	height:390px;
	float:left;
	margin-top:3%;
	font-family:roboto;
}
div#redes img{
	vertical-align:middle;
}

			/*Inicio estilo formulario*/
			
form{
	
	width:24%;
	height:350px;
	padding:20px;
	float:left;
	border-radius:5px;
	box-shadow: 2px 2px 10px #999;
	margin-top:1%;
	font-family:roboto;
	
}
textarea{
	resize:vertical;
	max-height:0px;
	min-height:100px;
	float:left;

}
input,textarea{ 

	margin-bottom:5px;
	width:100%;
	height:auto;
	padding:10px;
	box-sizing:border-box;
	border:1px solid #ccc;
	border-radius:5px;
	float:left;
}
input:focus, textarea:focus{
	background:#faffbd;
	border:1px solid #1b4166;
	border-radius:2px;
	
}
input[type="submit"]{
	width:20%;
	margin-bottom:0px;
	background:#1b4166;
	color:#fff;
	margin-left:40%;
}
input[type="submit"]:hover{
	background:#23598d;
	cursor:pointer;
}


				/*Fin estilo formulario*/
				
				
				
				/* Inicio imgs servicios*/
		
.aires,.electricas,.incendios,.radios,.tel,.camaras,.plantas,.bombas,.hidro{
	background:#fff;
	width:20%;
	height:450px;
	margin-top:5%;
	text-align:justify;
	font-family:roboto;
	font-size:13px;
	 list-style-type:none;
	 box-shadow: 2px 2px 10px #999;
	 border-radius:10px;
	 float:left;
}
.aires img,.electricas img,.incendios img,.radios img ,.tel img,.camaras img,.plantas img,.bombas img,.hidro img{
	width:100%;
	
}

.aires li a,.electricas li a,.incendios li a,.radios li a,.tel li a,.camaras li a,.plantas li a,.bombas li a,.hidro li a{
	margin:5%;
	padding:2%;
	background:#1b4166;
	color:#fff;
	text-decoration: none;
	border-radius:10px;
}
.aires li a:hover,.electricas li a:hover,.incendios li a:hover,.radios li a:hover,.tel li a:hover,.camaras li a:hover,.plantas li a:hover,.bombas li a:hover,.hidro li a:hover{
	background:#396c9d;
}
.aires p,.electricas p,.incendios p,.radios p,.tel p,.camaras p,.plantas p,.bombas p,.hidro p{
	margin:5%;
	
}
.aires,.tel,.hidro{
	margin-left:6%;
	
}
.electricas,.incendios,.radios,.camaras,.plantas,.bombas{
	margin-left:2%;
}

.aires:hover,.electricas:hover,.incendios:hover,.radios:hover,.tel:hover,.camaras:hover,.plantas:hover,.bombas:hover,.hidro:hover{
	background:#dadada;
}


			/* Fin de imgs servicios*/
			
			
			
			/*Inicio ventanas servicios*/
			

.imgaires,.imgelectricas,.imgcircuito,.imgplantas,.imgbombas,.imghidro,.imgtel,.imgradio{
	background:#ccc;
	width:93%;
	height:auto;
	margin-left:3%;
	margin-top:3%;
	
	}
.imgaires img,.imgelectricas img,.imgcircuito img,.imgplantas img,.imgbombas img,.imghidro img,.imgtel img,.imgradio img{
	width:25%;
	margin:20px;
	border-radius:2px;
	margin-top:3%;
	float:left;
	}
.infoaire,.infoelectricas,.infocircuito,.infoplantas,.infobombas,.infohidro,.infotel,.inforadio{
	background:#eef2f1;
	width:60%;
	height:auto;
	margin-top:3%;
	font-family:roboto;
	box-shadow: 2px 2px 10px #999;
	border-radius:10px;
	float:left;
}
.infohidro img,.infobombas img,.infoplantas img,.infocircuito img,.infotel img,.infotel img,.infoelectricas img{
	margin-left:79%;
}
.infohidro img:hover,.infobombas img:hover,.infoplantas img:hover,.infocircuito img:hover,.infotel img:hover,.infotel img:hover,.infoelectricas img:hover{
	transform: translateX(-1.2px);
	margin-left:79%;
}
.inforadio img,.infoaire img{
	transform: translateX(-1.2px);
	margin-left:77%;
}
.infoaire h3,.infoelectricas h3,.infocircuito h3,.infoplantas h3,.infobombas h3,.infohidro h3,.infotel h3,.inforadio h3{
	background:#fff;
	color: #000;
	box-shadow: 0px 1px 3px rgba(159, 141, 140, 0.5);
	text-align: center;
}
.infoaire p,.infoelectricas p,.infocircuito p,.infoplantas p,.infobombas p,.infohidro p,.infotel p,.inforadio p{
	color: #000;
	margin:15px;
	text-align:justify;
}
.infoelectricas p2{
	text-align:center;
}
			
				/*Fin ventanas servicios*/
				
				
 article#historia{
		background:linear-gradient(#fff,#9c9c9c);
		width:60%;
		height:auto;
		padding:30px;
		font-family:roboto;
		text-align : justify;
		border-radius:5px;
		border: transparent;
		float:left;
		
	}
	article#historia img{
		
		height:auto;
		float:left;
	}
	div#servicioslol{
		margin-top:4%;
		background:#fff;
		width:30%;
		height:400px;
		float:left;
		font-family:roboto;
	}
	div#servicioslol img{
		margin-left:10%;
		height:auto;
		float:left;
		border-radius:30px;
	}
	

@media screen and (max-width:800px) {  
	#contenedor{
		height:auto;
	}
	#contenedor1{
		height:auto;
	}	
	main{
	width:100%;
	height:1300px;
	margin-left:0%;
	margin-right:0%;
	
	
}
	#logo{
		width:100%;
		height:5px;
	}
		#logo img{
			width:150px;
		height:auto;
		
		}
		#sociales{
			
			width:100%;
			height:1;
		}
		#sociales img{
			width:8%;
		}
	#menu{
		width:100%;
		}
	#contacto{
		width:0%;
		height:0px;
		
	}
	#contacto img{
		width:0px;
		height:0px;
		
	}
	.nav {
		width:auto;
		font-size:10px;
	}
	
	#banner1{
		width:100%;
		height:auto;
	}
	#banner1 img{
		width:100%;
		height:auto;
	}
	article#historia{
	
	height:auto;
	font-size:10px;
	padding:3px;
	}
	div#servicioslol{
		width:37%;
		font-size:10px;
	}
	div#servicioslol img{
		width:90px;
		height:auto;
	}	
		input-placeholder{
	
		/* inicio mod formulario*/
	}
	form{
	width:60%;
	height:270px;
	margin:20px;
	padding:20px;
	margin-left:0px;
	margin-left:10%;
	margin-right:10%;
	font-size:10px;
}
	input,textarea{ 

	margin-bottom:5px;
	width:100%;
	height:auto;
	padding:0px;
	box-sizing:border-box;
	border:1px solid #ccc;
	border-radius:5px;
	float:left;
}
input[type="submit"]{
	width:30%;
	height:15px;
	margin-bottom:0px;
	background:#1b4166;
	color:#fff;
	margin-left:40%;
	font-size:9px;
}
input[type="submit"]:hover{
	background:#23598d;
	cursor:pointer;
}
div#mapa{
	padding:20px;
	width:50%;
	height:270px;
	float:left;
	font-family:roboto;
	font-size:8px;
}	
div#mapa h2{
	font-size:10px;
}
div#redes{
	width:18%;
	height:260px;
	float:left;
	margin-top:3%;
	font-family:roboto;
}


		/*  fin mod formulario*/
		
		/* Inicio Servicios*/
		
		

.aires,.electricas,.incendios,.radios,.tel,.camaras,.plantas,.bombas,.hidro{
	background:#fff;
	width:80%;
	height:auto;
	margin-top:5%;
	margin-left:auto;
	margin-right:auto;
	text-align:justify;
	font-family:roboto;
	font-size:10px;
	 list-style-type:none;
	 box-shadow: 2px 2px 10px #999;
	 border-radius:10px;
	 float:left;
}
.aires img,.electricas img,.incendios img,.radios img ,.tel img,.camaras img,.plantas img,.bombas img,.hidro img{
	width:40%;
	margin-left:30%;
	
}


.aires li a,.electricas li a,.incendios li a,.radios li a,.tel li a,.camaras li a,.plantas li a,.bombas li a,.hidro li a{
	
	background:#1b4166;
	color:#fff;
	text-decoration: none;
	border-radius:10px;
}
.aires li a:hover,.electricas li a:hover,.incendios li a:hover,.radios li a:hover,.tel li a:hover,.camaras li a:hover,.plantas li a:hover,.bombas li a:hover,.hidro li a:hover{
	background:#396c9d;
}
.aires p,.electricas p,.incendios p,.radios p,.tel p,.camaras p,.plantas p,.bombas p,.hidro p{
	margin:2%;
	
}
.aires h3,.electricas h3,.incendios h3,.radios h3,.tel h3,.camaras h3,.plantas h3,.bombas h3,.hidro h3{
	margin:2%;
	
}
.aires,.tel,.hidro{
	margin-left:8%;
	
}
.electricas,.incendios,.radios,.camaras,.plantas,.bombas{
	margin-left:8%;
}
.aires,.electricas,.incendios,.radios,.tel,.camaras,.plantas,.bombas{
	background:#fff;
}
.aires:hover,.electricas:hover,.incendios:hover,.radios:hover,.tel:hover,.camaras:hover,.plantas:hover,.bombas:hover{
	background:#fff;
}
						
						
						/*Fin servicios*/
						
						/*Inicio ventanas servicios*/
						
							
.imgaires img,.imgelectricas img,.imgcircuito img,.imgplantas img,.imgbombas img,.imghidro img,.imgtel img,.imgradio img{
	width:50%;
	height:auto;
	margin:0;
	border-radius:2px;
	margin-top:0%;
	margin-left:25%;
	float:left;
	}
.infoaire,.infoelectricas,.infocircuito,.infoplantas,.infobombas,.infohidro,.infotel,.inforadio{
	background:#dadada;
	width:100%;
	height:auto;
	margin-top:3%;
	font-family:roboto;
	box-shadow: 2px 2px 10px #999;
	border-radius:10px;
	float:left;
}
.infohidro img,.infobombas img,.infoplantas img,.infocircuito img,.infotel img,.infotel img,.infoelectricas img{
	width:20%;
	height:auto;
	margin-left:80%;
}
.infohidro img:hover,.infobombas img:hover,.infoplantas img:hover,.infocircuito img:hover,.infotel img:hover,.infotel img:hover,.infoelectricas img:hover{
	
	transform: translateX(000px);
	margin-left:79%;
}
.inforadio img,.infoaire img{
	width:20%;
	margin-left:80%;
}

						
.infoaire h3,.infoelectricas h3,.infocircuito h3,.infoplantas h3,.infobombas h3,.infohidro h3,.infotel h3,.inforadio h3{
	font-size:10px;
background:#fff;
color: #000;
box-shadow: 0px 1px 3px rgba(159, 141, 140, 0.5);
text-align: center;
}
.infoaire p,.infoelectricas p,.infocircuito p,.infoplantas p,.infobombas p,.infohidro p,.infotel p,.inforadio p{
	font-size:9px;
	color: #000;
	margin:15px;
	text-align:justify;
}
						
						
						
						
						
						/*Fin ventanas servicios*/
	footer{
	color:#fff;
	font-size:10px;
	}
	
}
		
		
		

	 
	
	
	 
footer{
	
	color:#000;
	width:100%;
	height:60px;
	float:left;
	font-family:roboto;
}

