* {margin: 0px ; padding: 0px}
@import url(https://fonts.googleapis.com/css?family=Lato:900);
body{font-family: 'Lato', sans-serif; }

section {width: 100%; padding-top: 120px;padding-bottom: 100px}
h3 {font-family: 'Lato', sans-serif; font-size: 60px; font-weight: 300;
	text-align: center; line-height: 80px; line-height: 60px}
h3 b {font-family: 'Lato', sans-serif; font-weight: 700;}
h4 {font-family: 'Lato', sans-serif; font-size: 20px; font-weight: 300;  
	text-align: center; line-height: 20px; }
h4 b {font-family: 'Lato', sans-serif; font-weight: 700;}  
h5 {font-family: 'Lato', sans-serif; font-size: 30px; font-weight: 300; 
	text-align: center; line-height: 80px; line-height: 60px}
h5 b {font-family: 'Lato', sans-serif; font-weight: 700;}  


body #productos {background-color: #151a1d; color: #fff}
	body #titulo {width: 650px; margin: 0 auto}
		body #boton {background-color: #3893ca; color: #fff; font-family: 'Lato', sans-serif; transition:0.2s;
		 height: 70px; font-weight: 700; text-align:center; line-height: 70px; width: 200px; margin: 0 auto;}
		body #boton:hover { background-color: #5db3e7; transition:0.2s;}

body #nosotros {color: #151a1d}
	body #nosotros #grilla {width: 1100px; margin: 0 auto;}
	body #nosotros #grilla article {width: 510px; height: 143px; float: left; margin-left: 70px; margin-top: 70px }
	body #nosotros #grilla article #texto {width: 340px; height: 143px; word-wrap: break-word;  text-transform: uppercase; text-align: justify; }
	body #nosotros #grilla article h5 {font-size: 21px; margin-top: -20px ;  }	
	body #nosotros #grilla article h4 {font-size: 15px ;width: 300px }
	body #nosotros #grilla article figure {width: 143px; height: 143px; background-color: #222;}
	body #nosotros #grilla a {color: #508fc9; font-weight:700}
	body #nosotros #boton {background-color: #151a1d; color: #fff; font-family: 'Lato', sans-serif; transition:0.2s;
		 height: 70px; font-weight: 700; text-align:center; line-height: 70px; width: 200px; margin: 0 auto; margin-top: 70px}
	body #nosotros #boton:hover { background-color: #2c3439; transition:0.2s;}

	body #nosotros #grilla2 {display: none}
	body #nosotros #grilla2 {width: 510px; margin: 0 auto;}
	body #nosotros #grilla2 article {width: 510px; height: 143px;  }
	body #nosotros #grilla2 article #texto {width: 340px; height: 143px; word-wrap: break-word;  text-transform: uppercase; float: left; }
	body #nosotros #grilla2 article h5 {font-size: 21px; margin-top: -20px ;  }	
	body #nosotros #grilla2 article h4 {font-size: 15px ;width: 300px;}
	body #nosotros #grilla2 article figure {width: 143px; height: 143px; background-color: #222; float: left;}


body #servicios {background: #000 url(../img/servicios.jpg); color: #FFF ; background-attachment:fixed;background-repeat: no-repeat;background-position: center center; background-size: cover;}
	body #servicios #grilla {width: 1100px; margin: 0 auto;}
	body #servicios #grilla article {width: 540px; height: 180px; background: rgba(80, 143, 201, 0.8); float: left; margin-left: 10px; margin-top: 10px }
	body #servicios #grilla article #texto {width: 340px; height: 180px; word-wrap: break-word; padding-left: 10px; padding-right: 10px; text-transform: uppercase; text-align: justify; }
	body #servicios #grilla article h5 {font-size: 21px }
	body #servicios #grilla article h4 {font-size: 15px ; }
	body #servicios #grilla article figure {width: 180px; height: 180px; background-color: #222}
	body #servicios #grilla2 {display: none}

body #especialistas {}
	#especialistas ul {width: 1100px; margin: 0 auto; margin-top: 120px}
	#especialistas li {width: 200px; height: 270px; float: left; margin-right: 100px; list-style: none}

body #contacto {background-image: url(../img/contacto.jpg); background-attachment:fixed;background-repeat: no-repeat;background-position: center center; background-size: cover;color: #FFF; text-align: center; font-weight: 100; font-size: 20px}
	body #contacto #telefonos { width: 295px; margin: 0 auto;}
		body #contacto #telefonos img {float: left; }
		body #contacto #telefonos b {float: right; font-weight: 700; font-size: 30px; margin-top: 5px }

body #mapa {padding-top: 0px;padding-bottom: 0px; width: 100%}

body #paginasAmigas {width: 1100px; margin: 0 auto}
	#paginasAmigas img {margin-left: 50px; margin-top: 20px; float: left}

a:link {
	text-decoration: none; color: #FFF;
}
a:visited {
	text-decoration: none; color: #FFF;
}
a:hover {
	text-decoration: none; color: #FFF;
}
a:active {
	text-decoration: none; color: #FFF;
}
	

#contactoContent {width: 800px; margin: 0 auto; }
#contacto-izquierda { width:100%; }
input, textarea {
	    width:100%;
	    height:60px;
	    border: solid 1px #DDD;
		font-size:14px;
	    color: #000;
		padding-left:20px;
		margin-top:20px;
		font-family: 'Lato', sans-serif; font-weight: 100; 
		
		
	}
	 
	textarea {
	    height:220px;
		padding:20px;
		font-size:14px;
		resize:none;
		
	}

	#submit { background-color: #26ac88; height:60px; width:180px; color:#FFF;  font-weight: 700; font: left;  margin-right: 800px;
		transition: 0.2s; padding-right:20px; font-family: 'Lato', sans-serif; font-weight: 700; border:0px;}
	#submit:hover {background-color: #5dceb0; transition:0.2s;}	

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

	body #servicios #grilla {width: 540px; margin: 0 auto;}

	body #nosotros #grilla {display: none}
	body #nosotros #grilla2 {display: block;}

	body #paginasAmigas {display: none}

	#especialistas ul {width: 860px; margin: 0 auto; margin-top: 120px}
	#especialistas img {width: 120px; margin: 0 auto; margin-left: 38px}
	#especialistas li {width: 200px; height: 270px; float: left; margin-right: 20px;}



}

@media screen and (max-width:900px) {
	#especialistas ul {width: 630px; margin: 0 auto; margin-top: 120px}
	#especialistas img {width: 120px; margin: 0 auto; }
	#especialistas li {width: 120px; height: 270px; float: left; margin-right: 50px;}

	#contactoContent {width: 80%; margin: 0 auto; }
	
}

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

	body #servicios #grilla {width: 90%; margin: 0 auto;}
	body #servicios #grilla article {width: 100%; height: 180px; background: rgba(80, 143, 201, 0.8); float: none; margin-left: 00px; margin-top: 10px }
	body #servicios #grilla article #texto {width: 340px; height: 180px; word-wrap: break-word; padding-left: 10px; padding-right: 10px; text-transform: uppercase; text-align: justify; }
	body #servicios #grilla article h5 {font-size: 21px; }
	body #servicios #grilla article h4 {font-size: 15px ; }
	body #servicios #grilla article figure {width: 180px; height: 180px; background-color: #222}


	#especialistas ul {width: 470px; margin: 0 auto; margin-top: 120px; text-align: center; margin-top: 120px}
	#especialistas img {width: 90px; margin: 0 auto; }
	#especialistas li {width: 80px; height: 270px; float: left; margin-right: 50px; text-align: center}
	#especialistas li h4 {font-size: 15px}
}
@media screen and (max-width:630px) {

	body #servicios #grilla2 {display:block;}
	body #servicios #grilla {display:none;}
	body #servicios #grilla2 {width: 90%;  margin: 0 auto;}
	body #servicios #grilla2 article {width: 100%; height: auto; padding-top: 20px; padding-bottom: 20px; background: rgba(80, 143, 201, 0.8); float: none; margin-left: 00px; margin-top: 10px }
	body #servicios #grilla2 article #texto {width: 95%; height: 180px; word-wrap: break-word; padding-left: 10px; padding-right: 10px; text-transform: uppercase; text-align: justify; }
	body #servicios #grilla2 article h5 {font-size: 21px; width: 100%; }
	body #servicios #grilla2 article h4 {font-size: 15px ;  width: 100%; }
	body #servicios #grilla2 article figure {display:none;width: 180px; height: 180px; background-color: #222}
}

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

	body #nosotros #grilla2 {width: 300px; margin: 0 auto;}
	body #nosotros #grilla2 article {width: 100%; height: auto; }
	body #nosotros #grilla2 article #texto { padding-bottom: 20px;width: 300px; margin-left: -20px; height: 143px; word-wrap: break-word;  text-transform: uppercase; float: left; }
	body #nosotros #grilla2 article h5 {font-size: 21px; margin-top: -20px ;  }	
	body #nosotros #grilla2 article h4 {font-size: 15px ;width: 300px;}
	body #nosotros #grilla2 article figure {padding-bottom:20px;width: 300px; height: 300px; background-color: #FFF; float: left;}
	body #nosotros #grilla2 article figure img {width: 100%; height: 100%}
}

@media screen and (max-width:500px) {
	#especialistas ul {width: 200px; margin: 0 auto; margin-top: 50px}
	#especialistas li {width: 200px; height: 270px; float: none; margin-right: 0px; list-style: none}
	#especialistas img {width: 180px; margin: 0 auto; }
	#especialistas li h4 {font-size: 20px}
}

@media screen and (max-width:700px) {
	body #titulo {width: 100%; margin: 0 auto}
	h3 {font-size: 40px}
}