@font-face{
	font-family: Open Sans;
    src: url(../fonts/OpenSans-Regular.woff2),
         url(../fonts/OpenSans-Regular.woff),
	     url(../fonts/OpenSans-VariableFont_wdth,wght.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-VariableFont_wdth,wght.ttf);
	font-weight: 700; font-display: swap;}
*{
	margin: 0; 	padding: 0; color: #231f24;}
body{
	font-family: 'Open Sans', sans-serif;	font-weight: 400; line-height: 1.9em; background: #f9f9f6;}
img a, a, a img, img{
	text-decoration: none; border: none; height: auto;}
p{
	margin: 0 0 10px 0;}
.neg{
	font-weight: 700;}
.noneg{
	font-weight: 400;}
.noneg strong{
	font-weight: 400;}
#redes{
	float: right; width: 55px; height: 45px; font-size: 9px;}
#redes2{
	font-size: 14px;}
#redes3{
	width: 120px; height: 45px; font-size: 9px;}
.insta{
	padding: 10px 5px 5px 5px; opacity: 0.3; display: block; width: 50px; height: 45px;
	background: url(../imagenes/instagram.jpg) no-repeat center center;	
	text-indent: -999em; float: left;}
.insta:hover{
	opacity: 0.6; text-indent: 0;
	padding: 0 5px 5px 5px; height: 70px;}
.insta2{
	padding: 70px 0 5px 0; opacity: 0.3; display: block; width: 50px; height: 10px;
	background: url(../imagenes/instagram2.jpg) no-repeat center center;	
	text-indent: -999em; float: left;}
.insta2:hover{
	opacity: 0.6; text-indent: 0; height: 10px;}
#logo{clear: both;}
address{
	font-style: normal;}	
.borra{
	clear: both;}
.frase{
	color: #999; font-size: 20px; line-height: 26px; padding: 20px 0 0 0; display: block;}
#masfotos{
	width: 300px;
	margin: 20px auto 30px auto;}
#superior{
	color: #231f24; background: #f9f9f6;}
.container {
	margin: 0 auto;}
.subtit{
	display: block; letter-spacing: 3.8px;}
#menu{
	font-size: 0.9em; text-align: center;}
#menu ul li{
	list-style-type: none;}
#menu ul li a{
	padding: 10px 0; display: block; color: #231f24;}
#menu ul li a:hover, #menu nav ul .v a, 
#menu nav ul .menv a, #menu nav ul .mayv a{
	color: #aaa;}
.titular{
	font-size: 35px; font-weight: 400; line-height: 40px; margin: 0 0 20px 0;}
h2{
	font-weight: 400; font-size: 26px; line-height: 30px; color: #999; margin: 0 0 10px 0;}
#imagen img{display: block;}
#galeria h2{
	font-size: 20px; margin: 0; color: #777; }
h3{ font-size: 16px; color: #960; font-weight: normal;}
#galeria h3{
	font-size: 26px; margin: 50px 0 0 0; padding: 20px 0 0 0;}
#galeria h4{
	font-size: 16px; font-weight: 400; color: #960; margin: 5px 0 15px 0;}
#resenas{ border: 1px solid #960; margin: 60px 0 0 0; background: #fff; }
#resenas h3{
	margin: 0 0 10px 0;}
#resenas a:hover{
	color: #999;}
#resenas ul{
	padding: 20px 0 0 0; font-size: 0.9em;}
#resenas ul li{
	padding: 10px 10px 20px 10px; list-style-type: none;}
#resenas ul li a{
	display: inline-block; padding: 5px 20px;}
#inres{
	margin: 40px 40px 0 40px;}
#resenas ul{
	margin: 20px 0 0 0;}
#resenas ul li img{width: 161px; height: auto;}
.dobled img, #fijamovil img, #fachada img{
	width: 100%; height: auto;}
#gris{
	background: #e5e4dc; padding: 40px 0;}
.certificados p{
	font-size: 14px; color: #960;}
#marca a{
	padding: 0 10px; color: #000;}
#marca a:hover{
	opacity: 0.4;}
#marca{
	text-align: right;
	font-size: 14px;}
#marca .dd{
	padding: 0 17px 5px 0; display: block;}
#margen{
	color: #666;}
#texto{
	margin: 40px 0 0 0;}
#horario{
	background: #eee; padding: 15px 20px; margin: 35px 0 0 0;}
.horario{
	color: #960;
	font-size: 20px;}
#email a{
	color: #231f24; display: block; padding: 5px 0 0 0;}

#faldon{
	font-size: 16px; line-height: 24px; padding: 60px 0; }	
#telefonos{
	font-size: 28px;}
#telefonos a{
	display: block; color: #231f24; padding-bottom: 10px; padding-top: 5px;}
#email{
	margin: 15px 0 0 0;}
.fftit{
	font-size: 14px; font-weight: 700;}
#aviso{
	font-size: 11px; color: #555; font-weight: 700; margin: 23px 0 0 0;}
#aviso a{
	color: #555; padding: 5px 10px 5px 0; display: inline-block;}
#aviso a:hover{
	color: #960;}
#galeria p{
	margin: 30px 0;}
.sup{font-size: 0.7em;}
iframe{
	border: none;}
#datos a:hover{
	color: #999;}
#pop{
	position:fixed; line-height: 1.2em; left:20px; right:20px; bottom:20px; border: 1px solid #aaa;
	color:#000; z-index: 99999; background: #fff url(../imagenes/blanco.png);}
#nota{
	 width:96%; text-align: center; position:absolute;  padding-left:2%; padding-right: 2%; top:10%;
	 font-size:13px; font-weight: 400; }
#inno{
	margin-bottom: 5px;}
.aceptar{
	font-size: 0.9em; display: inline-block; padding:4px 12px; margin-top: 3px;
	background:#ccc; text-decoration:none; color:#fff;  border: 1px solid #ccc;}
.configurar{
	font-size: 0.9em; display: inline-block; padding:4px 8px; margin-top: 3px;
	text-decoration: none; 	background: #fff; color:#444; border: 1px solid #6f7259;}
.margen{margin-top: 15px;}
#galeria h4 a{display: inline-block; padding: 3px 6px; color: #960;}
#galeria h4 a:hover{color: #222;}
#galeria h4 a img{width: 20px; opacity: 0.7; vertical-align: middle; margin-left: 8px;}
#galeria h4 a:hover img{opacity: 1;}
.image:hover img{filter: grayscale(100%);}
iframe{height: 400px; width: 100%; margin-top: 30px; filter: grayscale(90%);}
.what{display: inline-block; width: 30px; padding: 10px; vertical-align: middle; opacity: 0.6;}
.what:hover{opacity: 0.9;}
#faldon{background: #e5e4dc;}
.beige{background: #f9f9f6; padding: 80px 0;}
.boton a{ padding: 15px 25px; background: #fff;}
.boton a:hover{color: #999680;}
#servicios{padding-bottom: 100px;}
.m70{margin-top: 70px;}
#galeria{margin-top: 70px;}
#galeria .botones{margin-top: 30px;}
#galeria .botones div a{display: block;}
#galeria .botones .borra{float: none;}
#galeria .botones h2{margin: 5px 0 50px; color: #555; font-size: 16px;}
#galeria .botones a:hover img{filter: grayscale(100%);}
.reforma .beige{margin-top: 70px;}
.reforma .titular{color: #c86543;}
.reforma h4{font-size: 20px; font-weight: normal; margin-bottom: 50px; color: #c86543;}
.reforma p{margin-bottom: 25px;}
.mapa .boton{float: none; width: 240px; margin: 0 auto; text-align: center;}
.mapa .boton a{display:  block; font-size: 15px; border: 10px solid #fff; background: #e5e4dc; opacity: 0.9}
.mapa .boton a:hover{opacity: 1; color: #000;}
	
@media only screen 
and (max-width : 480px){
.container {
	width: 100%;}
.todo {
	margin: 0 20px;}
#cabecera{
	padding: 0 0 10px 0;}
#logo{
	width: 200px; margin: 0 auto 0 auto;}
#logo img{
	margin: 20px 0 0 0;}
#menu{
	width: 100%;}
#menu ul{
	margin: 32px 0 0 0;}
#menu ul li{
	width: 100%;}
#slider1{
	display: none;}
#fijamovil img{
	display: block;}
#grande{
	display: none;}
#marca{
	margin: 10px 0 0 0;}
#margen{
	padding: 0 0 30px 0;}
#info{
	margin: 50px 0 0 0;}
.ant, .izdo img, .doblei img{
	width: 100%; height: auto;}
#ca1{
	width: 50%; float: left;}
#ca2{
	width: 50%; float: right;}
.dcho{
	width: 100%;}
.doblei{
	width: 100%;}
.izdo{
	width: 100%;}
.dobled{
	width: 100%; margin: 20px 0 0 0;}
.fotoi{
	width: 100%;}
.fotod{
	width: 100%;}
.mas, .masm{
	margin: 30px 0 10px 0;}
#galeria{
	text-align: center;}
.m{
	display: none;}
.horizontal{
	width: 100%; height: auto;}
#redes2{
	margin: 70px 0 0 0;}
#datos{
	text-align: center; margin: 0 0 20px 0;}
#datos a{
	padding: 5px 0; display: inline-block;}
#horario{
	text-align: center;}
#fachada{
	margin: 30px 0;}
#faldon{
	padding: 30px 0;}
#faldon .izdo img{
	width: 150px; height: auto;}
#faldon .dobled{
	margin: 20px 0 0 0;}
#direccion{
	width: 100%; margin: 20px 0 0 0;}
#telefonos{
	width: 100%; margin: 20px 0 0 0; font-size: 30px; line-height: 37px;}
.certificados{
	margin: 30px 0 0 0; font-size: 0.8em;}
#pop{
	min-height: 140px;}
.horizontales img{
	width: 100%; height: auto;}
#galeria .botones div{width: 90%; margin: 0 auto 30px  auto; }
#galeria .botones img{width: 100%; }
}
@media only screen 
and (min-width : 481px)
and (max-width : 700px) {
.container {
	width: 100%;}
.todo {
	margin: 0 20px;}
#cabecera{
	padding: 0 0 10px 0;}
#logo{
	width: 200px;
	margin: 40px auto 0 auto;}
#logo img{
	margin: 10px 0 0 0;}
#menu{
	width: 100%;}
#menu ul{
	margin: 32px 0 0 0;}
#menu ul li{
	float: left;
	width: 25%; font-size: 0.9em;}
#imagen{
	background: #ddd;}
#fijamovil{
	display: none;}
#marca{
	margin: 0;}
#gris #marca img{
	width: 100px; height: auto; float: none;}
#texto img{
	width: 100%; height: auto;}
#margen{
	padding: 20px 0 0 0;}
#info{
	margin: 50px 0 0 0;}
.col{
	padding: 0 20px 0 0;}
.fotoi{
	width: 48%;
	float: left;}
.fotod{
	width: 48%;
	float: right;}
.doblei img{
	width: 100%; height: auto;}
.izdo img{
	width: 100%; height: auto;
	margin: 0 0 20px 0;}
.mas, .masm{
	margin: 20px 0 10px 0;}
.t{
	display: none;}
#grande img{
	width: 100%; height: auto; display: block;}
#gris img{
	width: 50%; height: auto; float: left;}
#redes2{
	margin: 60px 0 0 0;}
#galeria{
	text-align: center;}
#galeria .image{display: inline-block;}
#galeria .image{margin: 0 2% 2% 0; }
#galeria .image {	width: 46%; }
.image img{width: 100%; display: block;}
.m{
	display: none;}
#masfotos{
	display: none;}
#datos{
	text-align: center;}
#datos a{
	padding: 3px 0; display: inline-block;}
#horario{
	text-align: center;}
#fachada{
	margin: 20px 0 0 0;}
#faldon{
	padding: 40px 0;}
#faldon .izdo{
	width: 150px;}
#faldon .dobled{
	margin: 0;}
#telefonos{margin: 20px 0 0 0;}
.image{
	width: 225px; margin: 0 5px 0 0;}
.certificados{
	margin: 30px 0 0 0; }
#pop{
	min-height: 105px;}
	.dobled{margin-top: 40px; margin-bottom: 60px;}
#galeria .botones div{width: 86%; margin: 0 auto 30px  auto; max-width: 500px;}
#galeria .botones img{width: 100%; }
.mapa{ background: url("../imagenes/mapa-t.jpg") no-repeat left center; padding: 170px 0  50px 0; background-size: cover; margin-top: 60px;}
}
@media only screen 
and (min-width : 701px)
and (max-width : 999px) {
.container {
	width: 100%;}
.todo {
	margin: 0 35px;}
#cabecera{
	padding: 0 0 10px 0;}
#logo{
	width: 200px; margin: 0 auto;}
#menu{
	width: 100%;}
#menu ul{
	margin: 32px 0 0 0;}
#menu ul li{
	float: left;
	width: 22%;}
#menu ul .may, #menu ul .mayv{
	width: 34%;}
#fijamovil{
	display: none;}
#gris .doblei{
	width: 100%; float: none;}
#gris .dcho{
	width: 100%; float: none;}
#marca{
	margin: 0;}
#gris #marca img{
	width: 100px; height: auto; float: none;}
#texto img, .doblei img, #grande img{
	width: 100%; height: auto;}
#fijamovil{
	display: none;}
#margen{
	padding: 140px 0 0 0;}
.col{
	padding: 0 20px 0 0;}
.dcho{
	width: 55%;
	float: right;}
.doblei{
	width: 40%;
	float: left;}
.izdo{
	width: 40%;
	float: left;}
.dobled{
	width: 57%;
	float: right;}
.fotoi{
	width: 48%;
	float: left;}
.fotod{
	width: 48%;
	float: right;}
.izdo img{
	width: 100%; height: auto;}
.ocut2, .hor{
	display: none;}
#cien{
	width: 100%;}
#conjunto{
	margin: 30px 0 0 0;}
#conjunto .izdo{
	width: 33%;}
#resenas .izdo{
	width: 30%;}
#conjunto .dobled, #resenas .dobled{
	width: 62%;}
#resenas ul{
	padding: 0;}
.mas{
	margin: 15px 0 10px 0;}
#info{
	width: 100%;
	margin: 50px 0 0 0;}
#gris img{
	width: 40%; height: auto; float: left; margin: 0 0 0 20%;}
#masfotos{
	display: none;}
#datos{
	text-align: center; margin: 0 0 20px 0;}
#horario{
	text-align: center;}
#fachada{
	width: 550px; margin: 0 auto;}
#faldon{
	padding: 40px 0;}
#faldon .izdo{
	width: 20%;}
#faldon .dobled{
	width: 70%;}
#direccion{
	width: 45%; float: left;}
#telefonos{
	width: 53%; float: right; text-align: right;}
#galeria .image{display: inline-block;}
#galeria .verticales .image{
	width: 22%; height: auto; margin: 0 1% 2% 1%;}
	#galeria .horizontales .image{margin: 0 2% 2% 0; }
#galeria .horizontales .image {
	width: 46%; }
	#galeria .image img{width: 100%;}
.descripcion{
	font-size: 1.1em; line-height: 1.7em; }	
#resenas ul li{
	width: 31%; margin: 0 2% 5% 0; padding: 0; float: left;}
#redes2{
	margin: 55px 0 0 0; font-size: 14px;}
.certificados{
	margin: 50px 0 0 0; line-height: 2.2em;}
#aviso a {
    padding: 5px 0 10px 0;}
#pop{
	min-height: 100px;}
#galeria .botones div{float: left; width: 46%; margin: 0 4% 2% 0;}
#galeria .botones img{width: 100%; }
.mapa{ background: url("../imagenes/mapa.jpg") no-repeat left center; padding: 200px 0 110px 0; background-size: cover;
	margin-top: 60px; }
}
	
@media only screen 
and (min-width : 1000px){ 
.container {
	width: 1000px;}
.todo {
	margin: 0 30px;}
#cabecera{
	padding: 0 0 10px 0;}
#superior .todo{margin: 0;}
#logo{
	width: 200px; float: left; margin-left: 10px;}
#menu{
	width: 500px; float: right;}
#menu ul{
	margin: 32px 0 0 0;}
#menu ul li{
	float: left;
	width: 22%;}
#menu ul .may, #menu ul .mayv{
	width: 34%;}
#fijamovil{
	display: none;}
#marca{
	margin: 140px 0 0 0;}
#margen{
	padding: 140px 0 0 0;}
#imagen{width: 100%; }
	#imagen img{width: 100%; }
	#imagen ul{max-width: 100%;}
.col{
	padding: 0 20px 0 0;}
.dcho{
	width: 300px; float: right;}
.doblei{
	width: 600px; float: left;}
.izdo{
	width: 318px; float: left;}
.dobled{
	width: 600px; float: right;}
.fotoi{
	width: 48%; float: left;}
.fotod{
	width: 48%; float: right;}
.tep{
	margin: 40px 0 10px 0;}
#techo{
	margin: 50px 0;}
#beigeiz h2, #servicios h2{
	margin: 80px 0 15px 0;}
.mas{
	margin: 30px 0 10px 0;}
#resenas ul{
	padding: 0;}
#ajuste .mas{
	margin: 20px 0 10px 0;}
#info{
	width: 310px; float: left; margin: 80px 0 30px 0;}
#fachada{ margin: 80px 0 0 0;}
#masfotos{
	display: none;}
#fachada{
	width: 550px; float: right;}
#direccion{
	width: 45%; float: left;}
#telefonos{
	width: 45%; float: right;}
	#galeria img{width: 100%;}
#galeria .image{display: inline-block;}
#galeria .verticales .image{
	width: 22%; height: auto; margin: 0 1% 2% 1%;}
	#galeria .horizontales .image{margin: 0 2% 2% 0; }
#galeria .horizontales .image {
	width: 46%; }
.image img{width: 100%; display: block;}
.descripcion{
	font-size: 1.1em; line-height: 1.7em; }
#resenas ul li{
	width: 31%; margin: 0 2% 5% 0; padding: 0; float: left;}
#redes2{
	margin: 50px 0 0 0; width: 300px; float: left;}
.certificados{
	margin: 50px 0 0 0; width: 600px; float: right; line-height: 2.2em;}
#pop{
	min-height: 75px;}
#gris{padding: 70px 0;}
#galeria .botones div{float: left; width: 46%; margin: 0 4% 2% 0;}
.mapa{ background: url("../imagenes/mapa.jpg") no-repeat left center; padding: 250px 0 120px 0; background-size: 100% auto;}
}
@media only screen 
and (min-width : 1300px){ 
	body{font-size: 1.1em; line-height: 2em;}
.container {
	width: 1200px;}
.todo {
	margin: 0 50px;}
	.ant{width: 100%;}
.izdo{
	width: 35%;}
.image{
	margin: 0 20px 0 0; }
	.image img{margin-bottom: 15px; display: inline-block;}
.descripcion{
	font-size: 1em; line-height: 2em; }
	#grande img{width: 100%;}
	#fachada{width: 670px;}
	#info{width: 400px;}
	iframe{width: 100%;}
#resenas ul li{
	width: 29%; margin: 0 4% 5% 0; padding: 0; float: left;}
}