@font-face{
	font-family: Quicksand;
    src: url(../fonts/Quicksand-Light.woff2),
         url(../fonts/Quicksand-Light.woff),
	     url(../fonts/Quicksand-Light.ttf);
    font-weight: 300; font-display: swap;} 
@font-face{
	font-family: Quicksand;
    src: url(../fonts/Quicksand-Medium.woff2),
         url(../fonts/Quicksand-Medium.woff),
	     url(../fonts/Quicksand-Medium.ttf);
    font-weight: 500; font-display: swap;}
*{	margin: 0; padding: 0;}
body{	font-family: 'Quicksand', sans-serif; line-height: 1.9em; font-size: 17px; font-weight: 500;}
img a, a, a img{	text-decoration: none;}
img{height: auto;}
#idioma{	text-align: center; width: 55px; float: right; font-size: 13px;}
#idioma a{	padding: 2px 0; display: block; color: #fff; background: #000;}
#idioma a:hover{	color: #ccc;}
.puntos{	color: #CCC; font-size: 12px;}
.neg{	font-weight: bold;}
.noneg, strong{	font-weight: 500;}
.foto{	width: 100%; height: auto;}
.container {	margin: 0 auto;}
#menu{	text-align: center; font-weight: 300;}
#menu ul li{	list-style-type: none; }
#menu ul li a{	color: #000; padding: 20px 0; display: block;}
#menu ul li a:hover{	color: #ccc; }
#slider img{	width: 100%; height: auto;}
.titular, .presentacion h1{	font-size: 30px; display: block; font-weight: 500; margin: 0 0 20px 0;}
h1, h2{	font-size: 27px; font-weight: 300; margin: 0 0 10px 0;}
p{	margin: 8px 0;}
.gris, .gris2, .gris3{	background: url(../imagenes/gris.png);}
.inf{	margin: 0 0 40px 0;}
.logodica, .logocancio{	margin: 20px 0 0 0;}
.bloqueboton{	z-index: 1; position: relative; }
.boton{	z-index: 2; position: absolute;}
.boton a{	display: block; padding: 10px 15px; font-size: 1.1em; text-align: center;
	color: #000; background: url(../imagenes/blanco.png); }
.boton a:hover{	background: #fff;}
#destacado{	font-weight: 300;}
.circulo{	border: 1px solid #000; width: 50px; height: 40px; display: inline-block;
	border-radius: 50px; font-size: 40px; text-align: center; padding: 10px 0 0 0;}
.tipo{	margin: 0 0 80px 0;}
.tipo h3, .comoh3{	font-size: 30px; font-weight: 500;}
.tipo h4{	border-top: 1px solid #ccc; margin: 5px 0 0 0; padding: 5px 0 0 0; 	color: #666; font-weight: 300; font-size: 19px;}
.gris2 h5, .gris3 h5{	font-size: 20px; font-weight: 300;	border-bottom: 1px solid #fff; padding: 0 0 5px 0;}
address{	font-style: normal; display: inline;}	
.borra{	clear: both;}
#faldon{	border-top: 1px solid #CCC; padding: 5px 0;}
#redes{	line-height: 15px;}
.sigue{	margin: 20px 0 0 0;  width: 75px; float: left;}
.face{	padding: 5px; display: inline-block; width: 45px; height: 45px;
	background: url(../imagenes/facebook1.jpg) no-repeat center center;	text-indent: -999em; float: left;}
.face:hover{	background: url(../imagenes/facebook2.jpg) no-repeat center center;}
.insta{	padding: 5px; display: inline-block; width: 45px; height: 45px;
	background: url(../imagenes/instagram1.jpg) no-repeat center center; text-indent: -999em; float: right;}
.insta:hover{	background: url(../imagenes/instagram2.jpg) no-repeat center center;}
#aviso{ 	font-size: 0.9em; margin: 15px 0 0 0;}
#aviso a{	color: #000; display: inline-block; padding: 5px 0;}
.reforma{	margin: 80px 0 60px 0;}
.linea{	border-bottom: 1px solid #ccc;}
.onli{	font-weight: 300; font-size: 1.2em; line-height: 1.6em;}
iframe{	border: none;}
.telefono{	color: #111; display: inline-block;}
.logocancio{margin-left: 10px; height: 35px; width: auto;}
.boton-mapa a{display: block; width: 200px; text-align: center; padding: 12px 0; font-size: 15px; margin: 60px 0; 
	color: #111; border: 1px solid #111;}
.boton-mapa a:hover{opacity: 0.4;}
.whatsapp a{width: 45px; display: block; top: 5px; left: 10px;}
.whatsapp a img{width: 100%; height: auto;}
 .reforma .col-lg-2 a img { width: 100%;   }
	
@media only screen 
and (max-width : 520px){
body{	background: url(../imagenes/fondo-m.jpg) no-repeat bottom left; text-align: center;}
.container {	width: 100%;}
.todo {	margin: 0 20px;}
	#idioma{position: absolute; top: 5px; right: 10px;}
#logo{	margin: 100px 0 30px 0; width: 100%; }
#logo img{	width: 100%; height: auto; max-width: 300px; margin: 0 auto;}
	#menu{padding-bottom: 40px;}
#menu ul li a{ padding: 15px 0; font-size: 22px;}
#slider1{	display: none;}
.presentacion{	margin: 40px 0;}
.titular, .presentacion h1{	font-size: 26px;}
h1, h2, .comoh3{	font-size: 24px;}
h4{ font-size: 16px;}
.logodica, .logocancio{	margin: 20px 0 60px 0;}
.logodica{width: 50%; height: auto; max-width: 200px;}
.logocancio{width: 50%; height: auto; max-width: 110px;}
.bloque{	margin: 0 0 60px 0; }
.fotobloque{	margin: 20px 0 0 0; width: 100%; height: auto;}
.boton{	top: 70%; left:50%; margin-left: -90px; width: 180px; }
.boton a{	width: 180px; margin: 0 auto; display: inline-table; }
#destacado{	font-size: 20px; margin: 80px 0 0 0;}
.dcho img{	width: 100%; height: auto;}
.tipo p{	margin: 20px 0 20px 0;}
#pie{	width: 100%; padding: 20px 0 0 0;}
#direccion{	text-align: right; clear: both; padding: 30px 0 0 0; }
address{	display: block; }
.guion{	display: none;}
#redes{	width: 185px; float: right; display: block;}
#aviso{ 	text-align: right;}
.galeria{	margin: 40px 0 0 0;}
.col-lg-2 a{	width: 180px; float: left; margin: 12px 12px 0 0;}
.reforma .col-lg-2{	width: 100%; }
.reforma .col-lg-2 a{	width: 230px; float: left; margin: 12px 10px 0 0; }
.gris2{	margin: 30px 0 0 0;}
.gris3{	margin: 15px 0;}
.gris3 img, .tipo .izdo img, .tipo .dcho img{	width: 100%; height: auto;}
.gris .izdo{	margin: 0;}
.gris2 .dcho, .gris3 .dcho, .gris .izdo{	padding: 20px;}
.onli{	margin: 30px 0 0 0; padding: 0 0 20px 0; font-size: 1.1em;	color: #666;}
#destacado{	border-bottom: 1px solid #000; padding: 0 20px 15px 20px;}
.circulo{	display: block; margin: 0 auto 10px auto;}
.galeria{	width: 232px; margin: 0 auto;}
.row{	display: none;}
#compl .galeria{	width: 180px; margin: 0 auto;}
iframe{	display: none;}
#mapafoto img{	width: 100%; height: auto; }
	.whatsapp a{position: absolute; }
	.tipo h4{font-size: 22px;}
	.tipo .dcho{margin-top: 35px;}
}

@media only screen 
and (min-width : 521px)
and (max-width : 750px) {
body{
	background: url(../imagenes/fondo-m.jpg) no-repeat bottom left;
	text-align: center;}
.container {
	width: 100%;}
.todo {
	margin: 0 30px;}
#logo{
	margin: 30px 0 5px 0; width: 100%; }
#logo img{
	width: 100%; height: auto; max-width: 300px; margin: 0 auto;}
#menu ul li{
	width: 33%; float: left;}
#menu ul li a{ padding: 10px 0;}
#fijamovil{
	display: none;}
.presentacion{
	margin: 40px 0;}
.presentacion p, .bloque p, .tipo p{
	width: 70%; margin: 10px auto 35px auto;}
.titular, .presentacion h1{
	font-size: 26px;}
h1, h2, .comoh3{
	font-size: 24px;}
h4{ font-size: 16px;}
.logodica, .logocancio{
	margin: 20px 0 60px 0;}
.logodica{width: 50%; height: auto; max-width: 200px;}
.logocancio{width: 50%; height: auto; max-width: 110px;}
.bloque{
	margin: 0 0 60px 0; }
.fotobloque{
	margin: 20px 0 0 0; width: 100%; height: auto;}
.boton{
	top: 80%; left:50%; margin-left: -90px; width: 180px; }
.boton a{
	width: 180px; margin: 0 auto; display: inline-table; }
#destacado{
	font-size: 20px; margin: 80px 0 0 0;}
.dcho img{
	width: 100%; height: auto;}
#pie{
	width: 100%; padding: 20px 0 0 0;}
#direccion{
	text-align: right; clear: both; padding: 30px 0 0 0; }
.guion{
	display: none;}
#redes{
	width: 185px; float: right; display: block;}
#aviso{ 
	text-align: right;}
.galeria{
	margin: 40px 0 0 0;}
.col-lg-2 a{
	width: 180px; float: left; margin: 12px 12px 0 0;}
.reforma .col-lg-2{
	width: 100%; }
.reforma .col-lg-2 a{
	width: 230px; float: left; margin: 12px 10px 0 0; }
.gris, .gris2, .gris3{ padding: 40px;}
.gris2{
	margin: 30px 0 0 0;}
.gris3{
	margin: 15px 0;}
.gris3 img{
	max-width: 350px; height: auto;}
.gris .tipo{ margin: 0;}
.tipo .izdo img, .tipo .dcho img{
	width: 100%; height: auto;}
#pre{
	width: 38%; float: left;}
#nex{
	width: 59%; float: right;}
.gris .izdo{
	margin: 0;}
.gris2 .dcho, .gris3 .dcho, .gris .izdo{
	padding: 20px;}
.onli{
	margin: 30px 0 0 0; padding: 0 0 20px 0; font-size: 1.1em;
	color: #666;}
#destacado{
	border-bottom: 1px solid #000; padding: 0 20px 15px 20px; margin: 40px 100px 20px 100px;}
.circulo{
	display: block; margin: 0 auto 10px auto;}
.galeria{
	width: 480px; margin: 0 auto;}
.galeria-fija{
	display: none;}
#compl .galeria{
	width: 390px; margin: 0 auto;}
#mapafoto{
	display: none; }
iframe{
	width: 100%; height: 300px;}
.whatsapp a{position: absolute; }
}

@media only screen 
and (min-width : 751px)
and (max-width : 999px) {
body{
	background: url(../imagenes/fondo.jpg) no-repeat bottom left;}
.container {
	width: 100%;}
.todo {
	margin: 0 40px;}
#logo{
	margin: 35px 0 5px 0; width: 400px; float: right;}
#menu{
	width: 100%; clear: both; text-align: right;}
#menu ul li{
	float: left; width: 14%; }
#menu ul .menor{
	float: left; width: 12%;}
#menu ul .medio{
	float: left; width: 20%;}
#menu ul .mayor{
	float: left; width: 28%;}
#menu .eusk li{
	float: left; width: 14%; }
#menu .eusk .menor{
	float: left; width: 8%;}
#menu .eusk .medio{
	float: left; width: 20%;}
#menu .eusk .mayor{
	float: left; width: 30%;}
#fijamovil{
	display: none;}
.presentacion{
	width: 80%; margin: 40px 0 80px 20%; text-align: right;}
.bloque{
	margin: 0 0 60px 0; text-align: justify;}
.fotobloque{
	margin: 20px 0 0 30%; width: 70%; height: auto;}
.boton{
	right: 25px; top: 75%; width: 230px; }
.boton a{
	width: 230px; margin: 0 auto; display: inline-table; }
#destacado{
	font-size: 28px; margin: 80px 0 0 0;}
.dcho{
	width: 60%; float: right;}
.izdo{
	width: 38%; float: left;}
.dcho img{width: 100%; height: auto;}
.tipo p{
	margin: 20px 0 0 0;}
#pie{
	width: 580px; float: right;}
#direccion{
	width: 360px; float: left; margin: 20px 0 0 0;}
#redes{
	width: 185px; float: right;}
#aviso{ 
	width: 300px; float: left;}
.galeria{
	margin: 30px 0 0 0;}
.galeria-fija{
	display: none;}
.col-lg-2 a{
	width: 180px; float: left; margin: 12px 12px 0 0;}
.reforma .col-lg-2{
	width: 100%; }
.reforma .col-lg-2 a{
	width: 230px; float: left; margin: 12px 10px 0 0; }
.gris2{
	margin: 30px 0 0 0;}
.gris3{
	margin: 15px 0;}
.gris img, .gris2 img, .gris3 img{
	width: 100%; height: auto;}
.gris .izdo p{
	margin: 30px;}
.gris h3{
	margin: 30px 0 0 30px;}
.gris .dcho img{
	margin: 100px 0 0 0;}
.gris2 .dcho p, .gris3 .dcho p{
	margin: 0 20px 0 20px;}
 .gris2 .dcho h5, .gris3 .dcho h5{
	margin: 20px 0 20px 20px;}
.gris .tipo h4{
	margin: 5px 0 0 30px;}
#pre img, #next img{
	width: 100%; height: auto;}
#destacado{
	text-align: right;}
.onli{
	margin: 60px 60px 0 20px !important; font-size: 1.1em;}
iframe{
	width: 100%; height: 400px;}
#faldon{
	padding: 20px 0 5px 0; margin: 130px 0 0 0;}
#mapafoto{
	display: none; }
		#faldon { padding: 15px 0 18px 0;}
.whatsapp a{position: absolute; }
}
@media only screen 
and (min-width : 1000px){
body{
	background: url(../imagenes/fondo.jpg) no-repeat bottom left;
	background-attachment:fixed;}
.container {
	width: 1000px;}
.todo {
	margin: 0 20px;}
#logo{
	margin: 35px 0 5px 0; width: 400px; float: right;}
#menu{
	width: 780px; margin: 0 0 0 180px; clear: both; text-align: right;}
#menu ul li{
	float: left; width: 14%; }
#menu ul .menor{
	float: left; width: 12%;}
#menu ul .medio{
	float: left; width: 20%;}
#menu ul .mayor{
	float: left; width: 27%;}
#menu .eusk li{
	float: left; width: 14%; }
#menu .eusk .menor{
	float: left; width: 8%;}
#menu .eusk .medio{
	float: left; width: 20%;}
#menu .eusk .mayor{
	float: left; width: 30%;}
#fijamovil{
	display: none;}
.presentacion{
	width: 58%; margin: 80px 0 80px 42%; text-align: right;}
.bloque{
	margin: 0 0 60px 0; text-align: justify;}
.fotobloque{
	margin: 20px 0 0 40%;}
.boton{
	right: 15px; top: 270px;}
#destacado{
	font-size: 28px; margin: 80px 0 0 0;}
.dcho{
	width: 580px; float: right;}
.izdo{
	width: 360px; float: left;}
.tipo p{
	margin: 80px 0 0 0;}
#eusk .tipo p{
	margin: 50px 0 0 0;}
#pie{
	width: 580px; float: right;}
#direccion{
	width: 360px; float: left; margin: 20px 0 0 0;}
#redes{
	width: 185px; float: right; margin-top: 7px;}
#aviso{ 
	width: 300px; float: left;}
.galeria{
	margin: 40px 0 0 0;}
.galeria-fija{
	display: none;}
.col-lg-2 a{
	width: 180px; float: left; margin: 12px 12px 0 0;}
.reforma .col-lg-2{
	width: 100%; }
.reforma .col-lg-2 a{
	width: 230px; float: left; margin: 2px 10px 0 0; }
.gris{
	height: 321px;}
.gris2{
	height: 352px; margin: 30px 0 0 0;}
.gris3{
	height: 537px; margin: 15px 0;}
.gris .izdo{
	margin: 30px; width: 300px;}
.gris2 .dcho, .gris3 .dcho{
	margin: 30px; width: 520px;}
.onli{
	margin: 80px 0 0 50%;}
	#mapafoto{
	display: none; }
#faldon { padding: 15px 0 18px 0;}
.whatsapp a{position: absolute; }
}
@media only screen 
	and (min-width : 1200px){
		.whatsapp a{position: fixed; z-index: 120;}
}
@media only screen 
	and (min-width : 1400px){
body{font-size: 1.2em; line-height: 1.9em;}
.container {
	width: 1200px;}
#menu {
    width: 820px; margin: 0 0 0 340px;}
.dcho{
	width: 660px; float: right;}
.izdo{
	width: 420px; float: left;}
.dcho img, .izdo img{width: 100%; height: auto; }
.gris3{height: 613px;}
.gris{height: 401px;}
.gris .izdo{
	margin: 60px 90px; width: 300px;}
.gris2{height: 389px;}
.gris2 .dcho, .gris3 .dcho{	margin: 90px; width: 550px;}
.gris2 h5, .gris3 h5 {font-size: 28px;}
.onli {
    font-size: 1.4em; line-height: 1.8em; margin: 60px 0 0 35%;}
		#nex, .electro {width: 725px;}
		.gris .tipo .izdo { width: 330px; margin: 60px 0 0 90px;}
		.gris .tipo .izdo p{margin-top: 50px;}
.titular, .presentacion h1 { font-size: 40px;}
		h2{font-size: 32px;}
		#pie{width: 650px;}
		#aviso{width: 340px;}
		#direccion{width: 400px;}
		.col-lg-2 a { width: 200px;  margin: 30px 30px 0 0;}
		.col-lg-2 a img{width: 100%; height: auto;}
		.reforma .col-lg-2 a {  width: 260px;  margin: 20px 30px 0px 0px;}
		.reforma .col-lg-2 a img {  width: 100%; height: auto; }
		.fotobloque{ margin: 20px 0 0 50%;}
		#redes{ padding-top: 10px; margin-top: 0; font-size: 16px;}
		iframe{width: 100%;}
		#aviso{font-size: 14px;}
}