@font-face{
	font-family: "Nunito";
    src: url(../fonts/Nunito-ExtraLight.woff2),
         url(../fonts/Nunito-ExtraLight.woff),
	     url(../fonts/Nunito-ExtraLight.ttf);
    font-weight: 200; font-display: swap; }
@font-face{
	font-family: "Nunito";
    src: url(../fonts/Nunito-Regular.woff2),
         url(../fonts/Nunito-Regular.woff),
	     url(../fonts/Nunito-Regular.ttf);
    font-weight: 400; font-display: swap; }
@font-face{
	font-family: "Nunito";
    src: url(../fonts/Nunito-Bold.woff2),
         url(../fonts/Nunito-Bold.woff),
	     url(../fonts/Nunito-Bold.ttf);
    font-weight: 700;  font-display: swap;}
*{
	margin: 0; padding: 0;}
body{
	font-family: 'Nunito', sans-serif; font-weight: 400; font-size: 18px; line-height: 1.8em;}
img a, a, a img{
	text-decoration: none;}
#imagen img, .fotos .una, .destacado .dcho img, .reforma .una, 
.galeria ul li img, .foto-reforma, .saunier .izdo img, .galeria-movil img, .fachada img{
	width: 100%; height: auto;}
#cabecera, #cabecera .container{
	background: #fff;}
.idioma a{
	width: 40px; display: block; padding: 2px 5px; background: #a7c8fe; float: right;
	font-size: 0.6em; font-weight: 800; text-align: center; color: #fff;}
.idioma a:hover{
	background: #1251ba}
#cabecera .todo{
	clear: both;}
.logo{
	color: #1251ba;  font-size: 36px; font-weight: 700; }
.neg{
	font-weight: bold;}
.noneg, .noneg strong{
	font-weight: normal;}
#menu ul li{
	list-style-type: none; text-align: center;}
#menu ul li a{
	color: #154088; padding: 20px 0 10px 0; display: block;}
#menu ul li a:hover{
	color: #84aff5;}
#menu ul .vi a{
	color: #1869f0;}
p{
	margin: 15px 0 0 0; }
h1{
	font-weight: 200; font-size: 35px; color: #02307b;}
.cuatro, .adaptacion, .instalador, .f-azul, .fotos{
	margin-top: 60px;}
.reformas{
	padding: 90px 0;}
.reforma{
	margin-top: 40px; background: #fff;}
.reforma h3{
	margin-top: 20px;}
section .todo{
	padding: 100px 0;}
.frase{
	color: #1251ba; font-size: 30px; margin: 0;}
#frase-sola{
	padding: 40px 0;}
.h2fondo{
	color: #fff; background: #1251ba; font-size: 20px; padding-left: 20px; }
.listado{
	margin: 20px 0 0 20px;}
.listado a{
	color: #000; padding: 3px 0; display: inline-block;}
.listado a:hover{
	font-size: 1.1em; color: #02307b; font-weight: 700;}
.dest{
	color: #1251ba; font-weight: 700;}
.adaptacion, .instalador{
	color: #fff; display: block; font-size: 0.8em; letter-spacing: 3px;}
.adaptacion{
	background: #1251ba;}
.instalador{
	background: #d50a2c;}
.destacado{
	color: #1251ba; background: #e8eaf5; border: 3px solid #efefef; line-height: 1.7em;}
.destacado h2{
	border-bottom: 1px solid #02307b; padding-bottom: 15px; font-size: 26px;}
.destacado .dcho img{
	display: block;}
.saunier .destacado{
	color: #333; background: #fff; border: 3px solid #d50a2c;}
.saunier .destacado h2{
	border-bottom: 1px solid #d50a2c; color: #d50a2c;}
.saunier .destacado .dcho img{
	height: 500px; width: auto; margin: 45px auto 20px auto;}
.saunier .neg{
	color: #d50a2c;}
.f-azul{
	background:#a7c8fe; padding: 30px; text-align: center;}
.f-azul p{
	margin: 0;}
.m-top{
	margin-top: 60px;}
.gv{
	background:#3673d8; padding: 25px 30px; color: #000;}
.gv img{
	margin-right: 10px;}
.logos, .instagi{
	text-align: center;}
.instagi{
	max-width: 420px; margin: 60px auto 0 auto;}
.instagi img{
	margin: 10px auto 0 auto; display: block;}
.instagi h3{
	font-size: 0.7em; line-height: 1.4em; width: 220px; margin: 10px auto 0 auto; color:#1251ba;}
.reforma{
	border: 1px solid #dedede; padding: 30px 30px 15px 30px;}
.reformas h3{
	color: #1251ba; margin-bottom: 50px;}
.galeria{
	margin-top: 50px;}
.galeria ul li{
	list-style-type: none;}
footer, footer .container{
	background: #052456; color: #85abe9;}
footer .todo{
	padding: 40px 0 5px 0; text-align: center; font-size: 16px;}
footer .logo{
	color: #fff; }
footer .boton a, .mapa .boton a{
	width: 120px; padding: 5px; display: block; color: #fff; background: #1251ba; margin: 15px auto; font-size: 0.8em;}
.mapa .boton a{margin-bottom: 50px; width: 200px; text-align: center;}
address{
	font-style: normal; display: inline;}	
.borra{
	clear: both;}
#aviso{ 
	font-size: 0.9em;}
#aviso a{
	color: #85abe9; display: inline-block; padding: 5px 0;}
#aviso a:hover{
	color: #fff;}
.datos{
	font-size: 1.1em; text-align: center;}
.datos a{
	color: #000; padding: 6px 0; display: inline-block;}
.datos a:hover{
	background: #fff; color: #1251ba; font-weight: 700;}
.datos p{
	margin: 0;}
iframe{
	border: none; width: 100%; display: block;}
.oferta{
	margin: 50px auto; width: 90%; height: auto; display: block;}
.fachada{
	margin: 50px auto 0 auto; width: 100%; max-width: 500px;}
@media only screen 
and (max-width : 480px){
.pantalla, .tablet, .guion, .galeria{
	display: none;}
.container {
	width: 100%; margin: 0 auto;}
.todo {
	margin: 0 20px;}
.idioma a {
    width: 50px; padding: 5px 5px; font-size: 13px;}
section .todo {
    padding: 60px 0;}
#cabecera .logo{
	text-align: center; margin: 50px 0 20px 0; font-size: 28px;}
#menu{
	width: 100%; font-size: 0.8em;}
#menu ul li a{ padding: 12px 0; font-size: 1.2em; margin-top: 5px;}
h1{
    font-size: 18px;}
h1 strong{
	font-size: 1.3em;}
h2{
	font-size: 22px;}
.cuatro img{
	width: 50%; height: auto; float: left;}
section .con-fondo .todo{
	padding: 0;}
.frase {
    font-size: 20px;}
#con-sello{
	width: 50%; float:left; margin-top: 10px;}
.sello{
	width: 45%; max-width: 150px; float: right;}
.con-fondo{
	background: #f5f8fd;}
.h2fondo{
    padding: 10px 20px;}
#servicios-index{
	background: url(../imagenes/f-servicios-index.jpg) no-repeat right top; 
	padding: 65% 0 0 0; background-size: 100% auto; margin-top: 60px;}
#servicios-font{
	background: url(../imagenes/f-servicios-font.jpg) no-repeat right top; 
	padding: 100% 0 0 0; background-size: 100% auto; margin-top: 60px; }
#servicios-font .dest, #servicios-index .dest{
	font-size: 0.8em;}
#servicios-cal{
	background: url(../imagenes/zarautz-radiadores.jpg) no-repeat right top; 
	padding: 100% 0 0 0; background-size: 100% auto; margin-top: 50px;}
.logos{
	margin: 0 auto 50px auto;}
.calderas .logos{
	margin: 60px auto 0 auto;}
.caldera{
	width: 70% !important; height: auto !important; }
.izdo{width: 50%; float: left;}
.dcho{width: 50%; float: right;}
.destacado .izdo, .destacado .dcho{
	float: none; width: 90%; padding: 5%;}
.adaptacion, .instalador{
	padding: 5px 5%;}
.toallero{
	width: 100%; height: auto; margin-top: 50px;}
.fotos img{ float: left; margin-top: 5%; height: auto;}
.fotos .d-gr, .fotos .d-gr-i{ width: 100%;}
.fotos .d-pe, .fotos .d-pe-d{ width: 100%;}
.fotos .d-cu, .fotos .d-cu-d{ width: 100%;}
.reformas {
    padding: 60px 0;}
.reformas .foto-reforma{
	position: relative; z-index: 5;}
.reformas h3{
	margin: 30px 0 20px 0; padding-bottom: 10px;border-bottom: 1px solid #BCDCFD;}
.galeria-movil{
	margin-top: 40px;}
.tel a{
	font-size: 1.3em; display: block;}
footer .logo{
	font-size: 30px; }}
@media only screen 
and (min-width : 481px)
and (max-width : 700px) {
.pantalla, .movil, .galeria-movil{
	display: none;}
.container {
	width: 100%; margin: 0 auto;}
.todo {
	margin: 0 40px;}
section .todo {
    padding: 70px 0;}
#cabecera .logo{
	text-align: center;  margin: 40px 0 20px 0;}
#menu{
	width: 100%; font-size: 0.8em; margin: 0 auto;}
#menu ul li{
	float: left; width: 33%;}
h1 {
    font-size: 24px;}
.cuatro img{
	width: 25%; height: auto; float: left;}
section .con-fondo .todo{
	padding: 0;}
.frase {
    font-size: 25px;}
#con-sello{
	width: 60%; float:left; margin-top: 30px;}
.sello{
	width: 30%; max-width: 150px; float: right; height: auto; margin-top: 10px;}
.con-fondo{
	background: #f5f8fd;}
.h2fondo{
    padding: 10px 20px;}
#servicios-index{
	background: url(../imagenes/f-servicios-index.jpg) no-repeat right top; 
	padding: 65% 0 0 0; background-size: 100% auto; margin-top: 60px;}
#servicios-font{
	background: url(../imagenes/f-servicios-font.jpg) no-repeat right top; 
	padding: 100% 0 0 0; background-size: 100% auto; margin-top: 60px; }
#servicios-cal{
	background: url(../imagenes/zarautz-radiadores.jpg) no-repeat right 30px; 
	padding: 100% 0 0 0; background-size: 100% auto; margin-top: 50px;}
.logos{
	margin: 0 auto 50px auto;}
.calderas .logos{
	margin: 60px auto 0 auto;}
.caldera{
	height: 350px !important; }
.izdo{width: 50%; float: left;}
.dcho{width: 50%; float: right;}
.destacado .izdo, .destacado .dcho{
	float: none; width: 90%; padding: 5%;}
.adaptacion, .instalador{
	padding: 5px 5%;}
.toallero{
	width: 100%; height: auto; margin-top: 50px;}
.fotos img{ float: left; margin-top: 2%; height: auto;}
.fotos .d-gr, .fotos .d-gr-i{ width: 68%;}
.fotos .d-pe, .fotos .d-pe-d{ width: 30%;}
.fotos .d-cu, .fotos .d-cu-d{ width: 49%;}
.fotos .d-gr, .fotos .d-pe-d, .fotos .d-cu{ margin-right: 2%;}
.reformas {
    padding: 70px 0;}
.reformas .foto-reforma{
	position: relative; z-index: 5;}
.reformas h3{
	background: #fff; padding: 10px 20px 10px 0; margin: 30px 0 20px 0; 
	padding-bottom: 10px;border-bottom: 1px solid #BCDCFD; }
.galeria ul li{
	width: 48%; float: left; margin: 0 2% 1% 0;}
footer .logo{
	font-size: 28px; }}
@media only screen 
and (min-width : 701px)
and (max-width : 950px) {
.pantalla, .movil, .salto, .galeria-movil{
	display: none;}
.container {
	width: 100%; margin: 0 auto;}
.todo {
	margin: 0 40px;}
section .todo {
    padding: 70px 0;}
#cabecera .logo{
	text-align: center;  margin: 40px 0 20px 0;}
#menu{
	width: 100%; font-size: 0.8em; margin: 0 auto;}
#menu ul li{
	float: left; width: 16%;}
#menu ul .mayor{
	width: 18%;}
.euskera #menu ul .menor{
	width: 14%;}
.euskera #menu ul .mayor{
	width: 19%;}
h1 {
    font-size: 28px;}
.cuatro img{
	width: 25%; height: auto; float: left;}
section .con-fondo .todo{
	padding: 0;}
.frase {
    font-size: 25px;}
#con-sello{
	width: 70%; float:left; margin-top: 45px;}
.sello{
	width: 150px; float: right;}
.h2fondo{
	width: 60%;}
.con-fondo{
	background: #f5f8fd;}
#servicios-index{
	background: url(../imagenes/f-servicios-index.jpg) no-repeat right 80px; padding: 10px 0 50px 0; background-size: 40% auto; margin-top: 60px;}
#servicios-font{
	background: url(../imagenes/f-servicios-font.jpg) no-repeat right 80px; padding: 10px 0; background-size: 40% auto; margin-top: 60px; }
#servicios-font .dest, #servicios-index .dest{
	padding-right: 55%;}
#servicios-cal{
	background: url(../imagenes/zarautz-radiadores.jpg) no-repeat right 30px; padding: 65px 0;
	margin-top: 60px;}
.listado{
	max-width: 60%;}
.logos{
	margin: 0 auto 60px auto;}
.calderas .logos{
	margin: 60px auto 0 auto;}
.caldera{
	height: 350px !important; }
.izdo{width: 50%; float: left;}
.dcho{width: 50%; float: right;}
.destacado .izdo{
	float: none; width: 90%; padding: 5% 5% 0 5%;}
.destacado .dcho{
	float: none; width: 90%; padding: 0 5% 5% 5%;}
.adaptacion, .instalador{
	padding: 5px 5%;}
.toallero{
	width: 100%; height: auto;}
.fotos img{ float: left; margin-top: 2%; height: auto;}
.fotos .d-gr, .fotos .d-gr-i{ width: 68%;}
.fotos .d-pe, .fotos .d-pe-d{ width: 30%;}
.fotos .d-cu, .fotos .d-cu-d{ width: 49%;}
.fotos .d-gr, .fotos .d-pe-d, .fotos .d-cu{ margin-right: 2%;}
.reformas .foto-reforma{
	position: relative; z-index: 5;}
.reformas h3{
	background: #fff; padding: 10px 20px 10px 0; position: relative; z-index: 6; 
	display: table; margin-top: -50px;}
.galeria ul li{
	width: 31%; float: left; margin: 0 2.2% 1% 0;}
footer .logo{
	font-size: 28px; }}
@media only screen 
and (min-width : 951px)
and (max-width : 1199px) {
.movil, .tablet, .salto, .galeria-movil{
	display: none;}
.container {
	width: 100%; margin: 0 auto;}
.todo {
	margin: 0 60px;}
#cabecera{
	position: fixed; width: 100%; top: 0; z-index: 10;}
#cabecera .logo{
	text-align: center;  margin: 20px auto;}
#menu{
	width: 780px; font-size: 0.9em; margin: 0 auto;}
#menu ul li{
	float: left; width: 16%;}
#menu ul .mayor{
	width: 18%;}
.euskera #menu ul .menor{
	width: 14%;}
.euskera #menu ul .mayor{
	width: 19%;}
.cuatro img{
	width: 25%; height: auto; float: left;}
section .con-fondo .todo{
	padding: 0;}
#con-sello{
	width: 80%; float:left; margin-top: 60px;}
.sello{
	width: 150px; float: right;}
.frase {
    font-size: 27px;}
.h2fondo{
	width: 60%;}
.con-fondo{
	background: #f5f8fd;}
#servicios-index{
	background: url(../imagenes/f-servicios-index.jpg) no-repeat top right; padding: 65px 0; background-size: 50% auto; margin-top: 60px;}
#servicios-font{
	background: url(../imagenes/f-servicios-font.jpg) no-repeat bottom right; padding: 65px 0; background-size: 50% auto; margin-top: 60px; }
#servicios-font .dest, #servicios-index .dest{
	padding-right: 50%;}
#servicios-cal{
	background: url(../imagenes/zarautz-radiadores.jpg) no-repeat right 30px; padding: 65px 0;
	margin-top: 60px;}
.logos{
	margin: 0 auto 60px auto;}
.calderas .logos{
	margin: 60px auto 0 auto;}
.izdo{width: 50%; float: left;}
.dcho{width: 50%; float: right;}
.destacado .izdo{ width: 40%; padding: 5%;}
.adaptacion, .instalador{
	width: 40%; padding: 5px 5%;}
.fotos img{ float: left; margin-top: 2%; height: auto;}
.fotos .d-gr, .fotos .d-gr-i{ width: 68%;}
.fotos .d-pe, .fotos .d-pe-d{ width: 30%;}
.fotos .d-cu, .fotos .d-cu-d{ width: 49%;}
.fotos .d-gr, .fotos .d-pe-d, .fotos .d-cu{ margin-right: 2%;}
.reformas .foto-reforma{
	position: relative; z-index: 5;}
.reformas h3{
	background: #fff; padding: 10px 20px 10px 0; position: relative; z-index: 6; 
	display: table; margin-top: -50px;}
.galeria ul li{
	width: 24%; float: left; margin: 0 1% 1% 0;}
footer .logo{
	font-size: 28px; }}
@media only screen 
and (min-width : 1200px){ 
.movil, .tablet, .salto, .guion, .galeria-movil{
	display: none;}
body{
	background: #efefef;}
.con-fondo{
	background: url(../imagenes/fondo.jpg);}
.container {
	width: 1200px; margin: 0 auto; background: #fff;}
.con-fondo .container{
	background: url(../imagenes/blanco.png);}
.todo {
	margin: 0 100px;}
#cabecera{
	position: fixed; width: 100%; top: 0; z-index: 10;}
#cabecera .logo{
	width: 300px; float: left; margin: 20px 0;}
#menu{
	width: 700px; float: right; font-size: 0.8em; margin-top: 5px;}
#menu ul li{
	float: left; width: 16%;}
#menu ul .mayor{
	width: 18%;}
.euskera #menu ul .menor{
	width: 14%;}
.euskera #menu ul .mayor{
	width: 19%;}
.euskera .frase{
	font-size: 28px;}
.cuatro img{
	width: 25%; height: auto; float: left;}
section .con-fondo .todo{
	padding: 0;}
#con-sello{
	width: 80%; float:left; margin-top: 60px;}
.sello{
	width: 150px; float: right;}
.h2fondo{
	width: 60%;}
#servicios-index{
	background: url(../imagenes/f-servicios-index.jpg) no-repeat top right; padding: 65px 0;
	margin-top: 60px;}
#servicios-font{
	background: url(../imagenes/f-servicios-font.jpg) no-repeat bottom right; padding: 65px 0;
	margin-top: 60px;}
#servicios-cal{
	background: url(../imagenes/zarautz-radiadores.jpg) no-repeat right 30px; padding: 65px 0;
	margin-top: 60px;}
.logos{
	margin: 0 auto 60px auto;}
.calderas .logos{
	margin: 60px auto 0 auto;}
.izdo{width: 50%; float: left;}
.dcho{width: 50%; float: right;}
.destacado .izdo{ width: 40%; padding: 5%;}
.adaptacion, .instalador{
	width: 40%; padding: 5px 5%;}
.fotos img{ float: left; margin-top: 2%; height: auto;}
.fotos .d-gr, .fotos .d-gr-i{ width: 68%;}
.fotos .d-pe, .fotos .d-pe-d{ width: 30%;}
.fotos .d-cu, .fotos .d-cu-d{ width: 49%;}
.fotos .d-gr, .fotos .d-pe-d, .fotos .d-cu{ margin-right: 2%;}
.reformas .foto-reforma{
	position: relative; z-index: 5;}
.reformas h3{
	background: #fff; padding: 10px 20px 10px 0; position: relative; z-index: 6; 
	display: table; margin-top: -50px;}
.galeria ul li{
	width: 24%; float: left; margin: 0 1% 0 0;}
.tel a{
	font-size: 1.5em; display: block;}
footer .logo{
	font-size: 28px; }}