@font-face{
	font-family: Open Sans;
    src: url(../fonts/OpenSans-Light.woff2),
         url(../fonts/OpenSans-Light.woff),
	     url(../fonts/OpenSans-Light.ttf);
    font-weight: 300; font-display: swap;}
@font-face{
	font-family: Open Sans;
    src: url(../fonts/OpenSans-Regular.woff2),
         url(../fonts/OpenSans-Regular.woff),
	     url(../fonts/OpenSans-Regular.ttf);
    font-weight: 400; font-display: swap;}
@font-face{
	font-family: Open Sans;
	src: url(../fonts/OpenSans-Bold.woff2),
         url(../fonts/OpenSans-Bold.woff),
	     url(../fonts/OpenSans-Bold.ttf);
	font-weight: 700; font-display: swap;}
@font-face{
	font-family: Junge;
	src: url(../fonts/Junge-Regular.woff2),
         url(../fonts/Junge-Regular.woff),
	     url(../fonts/Junge-Regular.ttf);
	font-weight: 700; font-display: swap;}
*{	margin: 0; padding: 0;}
body{	font-family: 'Open Sans', sans-serif; font-weight: 400; font-size: 1.2em; line-height: 2em; text-align: center; color: #233d26;}
img a, a, a img{	text-decoration: none;}
#imagen img, .proy img{
	width: 100%; }
img{height: auto;}
.neg{	font-weight: bold;}
.noneg, .noneg strong{	font-weight: normal;}
#logo {width: 270px;}
#logo img{display: block; margin: 0 auto;}
#logo h3{ font-size: 16px; font-weight: normal; margin-top: 0; letter-spacing: 1px;}
#menu ul li{	list-style-type: none; text-align: center;}
#menu ul li a{	color: #000; padding: 30px 0; display: block; font-size: 18px;}
#menu ul li a:hover{color: #9ec600;}
h1, .titular{font-size: 38px; font-weight: 400; line-height: 40px; margin-top: 100px;}
h1 .subt{font-size: 16px; text-transform: uppercase; display: block; margin-bottom: 40px;}
h2{	margin-top: 60px; }
h3{ font-weight: 300; margin-top: 30px; font-size: 22px;}
.deco h3.titular-2{font-size: 32px;}
.proy{ border: 2px solid #e7e3d9; margin-bottom: 80px; padding-bottom: 20px;}
#proyectos h2{padding-top: 100px;}
.proy h2, .deco h2, .duo h2{font-family: 'Junge', serif; font-size: 46px; line-height: 50px; margin-bottom: 30px; font-weight: normal;}
.proy h2{ color: #6ba703;}
.deco h2{margin-bottom: 0;}
p{ margin: 20px 0 0 0;}
.frase{margin: 80px 0; font-size: 26px; color: #5c8200; font-weight: 400;}
.beige{background: #e7e3d9; }
.deco .texto{	padding: 60px;}
.deco ul{margin-left: 25px; font-size: 1.3em; line-height: 2em; font-weight: 300; margin-top: 30px;}
.deco ul .neg{font-weight: 400;}
.deco h3{font-size: 16px; margin-top: 0; font-weight: 400; opacity: 0.8;}
.deco p a{color: #233d26;}
.duo{padding-bottom: 80px;}
.duo h2{ font-size: 36px; color: #6ba703;}
.beige h2{color: #233d26; margin-top: 100px;}
.boton a{display: block; padding: 14px 5px; margin: 40px auto; background: #e7e3d9; color: #335737; font-size: 0.9em; width: 300px;}
.boton a:hover{background: #9ec600;}
.servicios{padding: 100px 0;}
.mtop{margin-top: 100px;}
.egger{margin-top: 60px;}
.trabajos{display: block;}
.trabajo img{width: 100%; display: block;}
.trabajo a:hover img, .thumbnail:hover img{ filter: grayscale(100%); opacity: 0.8;}
.trabajo a{display: block; }
.trabajo{display: block;}
.trabajo h3{text-align: center; color: #fff; display: block; width: 100%; font-weight: 400;
	font-size: 20px; padding: 20px 0; background: #000; opacity: 0.8; margin-top: 0;}
.trabajo a:hover h3{opacity: 0.9;}
.trabajos .frase{ margin-bottom: 10px; display: block;}
.trabajos .texto{width: 100%; max-width: 900px; margin: 40px auto;}
.par a{display: block;}
.tel a, .what a{color: #5c8200; display: block; font-size: 35px;}
footer{	margin-top: 160px;}
address{	font-style: normal; display: inline; font-size: 0.9em;}
.borra{	clear: both;}
#aviso{ 	font-size: 0.7em; background: #c4da6d;}
#aviso a{	color: #233d26; display: inline-block; padding: 5px 0;}
.tag{margin-top: 80px;}
.dcho img{display: block; margin-bottom: 20px;}
.mapa{ background: url("../imagenes/mapa.jpg") no-repeat left top; background-size: cover; padding: 200px 0; text-align: center;}
.mapa a{width: 200px; margin: 0 auto; font-size: 15px;}

@media only screen 
and (max-width : 690px){
.pantalla, .tablet{	display: none;}
.container {	width: 100%; margin: 0 auto;}
.todo {	margin: 0 20px;}
#logo{	width: 250px; margin: 50px auto 20px auto;}
#logo img{width: 100%; }
#logo h3 {    font-size: 15px; letter-spacing: 0;}
#menu{	width: 100%; margin: 0 auto 5px auto;}
#menu ul li a {    padding: 15px 0 10px 0; font-size: 17px;}
#imagen{margin: 0;}
h1{    margin-top: 60px; font-size: 35px;}
h3 {    margin-top: 30px; font-size: 18px;}
.titular {    font-size: 28px; color: #5c8200; }
.dcho img{width: 100%;}
.boton a{width: 240px; font-size: 0.8em; padding: 10px 4px;}
.proy{margin-bottom: 50px;}
.proy p, .proy h3{ margin: 20px 20px 0 20px;}
.proy h2, .deco h2, .duo h2 {
    font-size: 28px; line-height: 30px; margin-bottom: 0; margin-top: 30px;}
	.proy h2{ margin-top: 25px;}
.beige h2{margin-top: 80px;}
.duo .boton a{ text-align: center; margin: 20px auto;}
.deco{padding: 20px; }
.deco .texto{padding: 30px 0;}
.deco .texto h2{margin-top: 10px;}
.deco .dcho, .servicios .dcho, .servicios .izdo{width: 100%; max-width: 600px; margin: 20px auto;}
.deco .izdo ul{ text-align: left; display: inline-block; font-size: 1.1em; line-height: 1.7em;}
.par{margin-top: 0.3%;}
.m-sup{margin-top: 2%;}
.foto-b{ margin-right: 2%;}
.trabajo{width: 100%; max-width: 500px; margin: 0 auto 50px auto;}
footer{margin-top: 40px;}
	footer .logo img{width: 200px; }
	footer h4{ font-size: 17px;	}
.dosref{padding: 5px 50px 50px 50px;}
.sumi{padding: 60px 50px 100px 50px;}
	#proyectos{margin-bottom: 140px;}
	.servicios{padding: 50px 0;}
	.what{margin-left: 50px; margin-bottom: 80px;}
	.mapa{background: none; padding: 40px;}
}

@media only screen 
and (min-width : 691px)
and (max-width : 1100px) {
.pantalla, .movil{	display: none;}
.container {	width: 100%; margin: 0 auto;}
.todo {	margin: 0 35px;}
#logo{	width: 300px; margin: 80px auto 20px auto;}
#menu{	width: 100%; max-width: 800px; margin: 0 auto 5px auto;}
#menu ul li{	float: left; width: 15%;}
#menu ul .uno{		width: 10%;	}
#menu ul .dos{		width: 16%;	}
#menu ul .tres{		width: 28%;	}
#menu ul .seis{		width: 16%;	}
#menu ul li a {    padding: 30px 0 10px 0; font-size: 16px;}
#imagen{margin: 0;}
h1{    margin-top: 60px; font-size: 35px;}
h3 {    margin-top: 30px; font-size: 18px;}
.titular {    font-size: 28px; color: #5c8200; }
.dcho img{width: 100%;}
.proy h2, .deco h2, .duo h2 {
    font-size: 35px; line-height: 40px; margin-bottom: 0; margin-top: 40px;}
	.proy h2{ margin-top: 25px;}
.beige h2{margin-top: 80px;}
.duo .boton a{ text-align: center; margin: 20px auto;}
.deco{padding: 2%; }
.deco .texto{padding: 30px 0;}
.deco .texto h2{margin-top: 10px;}
.deco .dcho, .servicios .dcho, .servicios .izdo{width: 100%; max-width: 600px; margin: 20px auto;}
.deco .izdo ul{ text-align: left; display: inline-block; font-size: 1.2em; line-height: 1.8em;}
.par{margin-top: 0.3%;}
.m-sup{margin-top: 2%;}
.foto-b{ margin-right: 2%;}
.trabajo{width: 100%; max-width: 500px; margin: 2% auto 40px auto;}
footer{margin-top: 40px;}
.dosref{padding: 5px 50px 50px 50px;}
.sumi{padding: 60px 50px 100px 50px;}
	#proyectos{margin-bottom: 140px;}
	.what{margin-left: 50px; margin-bottom: 80px;}
}

@media only screen 
and (min-width : 1101px)
and (max-width : 1399px) {
.movil, .tablet{
	display: none;}
.container {	width: 100%; margin: 0 auto;}
.todo {	margin: 0 40px;}
#cabecera .container{ width: 100%;}
#logo{	width: 300px; margin: 40px auto 20px auto;}
#menu{	width: 800px; margin: 5px auto;}
#menu ul li{	float: left; width: 15%;}
#menu ul .uno{		width: 11%;	}
#menu ul .dos{		width: 16%;	}
#menu ul .tres{		width: 26%;	}
#menu ul .seis{		width: 17%;	}
#menu ul li a {    padding: 30px 0 10px 0; }
#imagen{margin: 0 60px;}
h1, .titular {    margin-top: 70px;}
.izdo{width: 50%; float: left;}
.dcho{ width: 50%; float: right;}
.dcho img{width: 100%; display: block; margin-bottom: 20px;}
.proy h2, .deco h2, .duo h2 {
    font-size: 35px; line-height: 40px; margin-bottom: 0; margin-top: 20px;}
	.beige h2{margin-top: 80px;}
.duo .dcho, .duo .izdo{width: 45%;}
.duo .dcho{margin-left: 5%;}
.duo .izdo{margin-right: 5%;}
.duo .boton a{ text-align: center; margin-left: 0;}
.deco{padding: 20px 20px 0 0; }
.deco .izdo .container{ width: 100%; text-align: left; }
.deco .izdo .todo{ margin-left: 30px;}
.deco .texto { padding-right: 30px;}
.m-sup{margin-top: 2%;}
.foto-b{ margin-right: 2%;}
.servicios .izdo{text-align: left;}
.trabajo{float: left; width: 46%; margin: 2%;}
	.sumi{padding: 60px 50px 100px 50px;}
	footer{margin-top: 40px;}
	#proyectos{margin-bottom: 140px;}
	.deco .titular-2{margin-top: 0; padding-top: 0;}
}
	
@media only screen 
and (min-width : 1400px){ 
.movil, .tablet{
	display: none;}
.container {
	width: 1400px; margin: 0 auto;}
#cabecera .container{ width: 100%;}
.todo {	margin: 0 50px;}
#logo{	width: 300px; float: left; margin: 20px 0;}
#menu{	width: 800px; float: right; margin-top: 35px;}
#menu ul li{	float: left; width: 15%;}
#menu ul .uno{		width: 11%;	}
#menu ul .dos{		width: 16%;	}
#menu ul .tres{		width: 26%;	}
#menu ul .seis{		width: 17%;	}
#imagen{margin: 0 60px;}
.izdo{width: 50%; float: left;}
.dcho{ width: 50%; float: right;}
.dcho img{width: 100%;}
.duo .dcho, .duo .izdo{width: 45%;}
.duo .dcho{margin-left: 5%;}
.duo .izdo{margin-right: 5%;}
.duo .boton a{ text-align: center; margin-left: 0;}
.deco{padding: 1% 1% 1% 0; }
.deco .izdo .container{ width: 100%; text-align: left; }
.deco .izdo .todo{ margin-left: 150px;}
	.deco .dcho{max-width: 950px;}
.deco h2{width: 380px;}
.par{margin-top: 0.6%;}
.par img{width: 49%; float: left;}
.m-sup{margin-top: 2%;}
.foto-b{ margin-right: 2%;}
.servicios .izdo{text-align: left;}
.trabajo{float: left; width: 29.3%; margin: 2%;}
.proy {padding-bottom: 80px;}
.deco .titular-2{margin-top: 0; padding-top: 0;}
}
@media only screen 
and (min-width : 1400px)
and (max-width : 1549px) {
.proy h2, .deco h2, .duo h2 {
    font-size: 38px; line-height: 40px; width: 100%; margin-top: 50px;}
	.ventajas h2{margin-top: 0;}
.deco{padding-top: 70px;}
.deco .texto {
    padding-right: 0px;}

}
@media only screen 
and (min-width : 1550px)
and (max-width : 1700px) {
.deco{padding: 50px 0;}	
.beige h2 {margin-top: 30px;}
	}