@font-face {
    font-family: 'Figtree';
    src: url(../fonts/Figtree-Light.woff2),
        url(../fonts/Figtree-Light.woff),
        url(../fonts/Figtree-VariableFont_wght.ttf);
    font-weight: 300;
    font-style: normal;
    font-display: swap;}
@font-face {
    font-family: 'Figtree';
    src: url(../fonts/Figtree-Regular.woff2),
        url(../fonts/Figtree-Regular.woff),
        url(../fonts/Figtree-VariableFont_wght.ttf);
    font-weight: normal;
    font-style: normal;
    font-display: swap;}
@font-face {
    font-family: 'Figtree';
    src: url(../fonts/Figtree-Bold.woff2),
        url(../fonts/Figtree-Bold.woff),
        url(../fonts/Figtree-VariableFont_wght.ttf);
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
*{	margin: 0; padding: 0;}
body{   font-family: "Figtree", sans-serif; font-size: 19px; line-height: 2em; color: #41446d;}
img a, a, a img{ text-decoration: none;}
img{display: block;}
#cabecera .whatsapp{position: absolute; width: 45px; top: 10px; right: 10px; }
#cabecera .whatsapp a:hover img{transform: rotate(-360deg); transition-duration: 2s;}
#imagen img{ width: 100%; }
img{height: auto;}
.m-doble{margin: 140px 0;}
.m-top{margin: 140px 0 0 0;}
.m-bottom, .como{margin: 0 0 140px 0;}
.neg{ font-weight: bold;}
.noneg, strong .noneg, .noneg strong{	font-weight: normal;}
.may{text-transform: uppercase;}
#logo{text-transform: uppercase; text-align: center; font-size: 15px;  color: #777; background: #fff;}
#logo img{width: 200px; margin: 0 auto 2px auto; display: block;}
#menu ul li{ list-style-type: none; text-align: center;}
#menu ul li a{	color: #41446d; padding: 20px 0; display: block;}
#menu ul li a:hover{ color: #00a19a;}
#imagen .uno{background: #f6f6f6;}
#imagen .dos{background: #406b84;}
#imagen .tres{background: #9c6b41;}
#imagen .cuatro{background: #7b736a;}
h1 .tit{text-transform: uppercase; font-weight: 700;}
h1 .subt{display: block; font-size: 18px; font-weight: normal;}
p{	margin: 14px 0;}
.listado{font-size: 1.2em; line-height: 2em; margin: 20px 0 0 20px;}
.como ul{font-size: 1.1em; line-height: 2em; margin: 20px 0 0 20px;}
.trio{text-align: center;}
.trio h2{font-weight: normal; font-size: 16px;}
.trio h2 .para{text-transform: uppercase;}
.trio h2 .ubi{ font-weight: 200; display: block; font-size: 30px;}
.trio .izdo h2{color: #00a19a;}
.trio .cent h2{color: #f39208;}
.trio .dcho h2{color: #652682;}
.trio .izdo, .trio .dcho, .trio .cent{ padding-bottom: 30px;
		background: url( "../imagenes/colors.svg") no-repeat center bottom; background-size:100px auto;}
.frase{font-size: 32px; line-height: 45px; font-weight: 400; margin: 40px 0 20px 0;}
footer{	margin-top: 100px; text-align: center;}
footer h5{font-size: 18px; color: #00a19a;}
.boton a{display: block; color: #00a19a; text-align: center; padding: 20px; font-size: 16px; width: 120px; border: 1px solid #00a19a; 
	margin: 30px auto; border-radius: 5px; font-weight: 700;
  	background: none;  cursor: pointer;  transition: .8s;  position: relative;  overflow: hidden;}
.boton a:hover{background: #00a19a;color: #fff;}
.boton a:before{  content:'';  position:absolute;  left:0;  width:100%;  height:0%;  background: #00a19a;  z-index: -1;  transition:.8s;}
.boton a:before{ top:0; border-radius: 0 0 50% 50%;}
.boton a:hover:before{height: 180%;}
.presentacion{margin-bottom: 140px;}
.presentacion a{color: #444; font-weight: bold;}
.presentacion a:hover{opacity: 0.7;}
.presentacion .whatsapp a{width: 100px; margin: 100px auto; display: block;}
.fondo-botes .boton a{width: 200px; margin: 30px 0; }
.fondo-botes p, .fondo-karcher h3{font-size: 35px; color: #00a19a; line-height: 45px; font-weight: 400;}
.fondo ul, .fondo-grafitis p{margin: 20px 0 0 20px; font-size: 22px; }
.fondo-karcher ul li{margin-top: 5px;}
.s-karcher{text-align: center;}
.s-karcher h4, .s-pintor h4{font-size: 22px; }
.s-karcher h5, .s-pintor h5{font-size: 18px; text-transform: uppercase; font-weight: 400;}
.s-pintor h5{display: inline; margin: 0 10px;}
.s-pintor{width: 100%; max-width: 750px !important; margin: 100px auto;}
.s-pintor, .contacto {text-align: center;}
.fondo-servicios h3{font-size: 35px; text-transform: uppercase; }
.fondo-servicios h4{margin-top: 40px; font-size: 30px; font-weight: 300; color: #00a19a;}
.como{background: #00a19a; color: #222; padding: 100px 0;}
.como h3{color: #fff; font-size: 30px;}
address{ font-style: normal; display: inline;}	
.borra{	clear: both;}
#aviso{ font-size: 0.7em; border-top: 1px solid #ccc; text-align: center;}
#aviso a{ color: #444; display: inline-block; padding: 5px 0;}
.frances img{width: 50px; border: 1px solid #ccc; margin: 0 auto;}
@media only screen 
	and (max-width : 400px){
	.rslides h3{ width: 300px; font-size: 20px; line-height: 30px; margin-top: 15%; margin-left: calc(50% - 150px); font-weight: 400;}
}
@media only screen 
and (max-width : 500px){
	body{text-align: center;}
	.pantalla, .tablet, #imagen .rslides .pantalla img, #imagen .rslides .tablet img{	display: none !important;}
	.container { width: 100%; margin: 0 auto;}
	.todo {	margin: 0 20px;}
	#logo{margin: 100px auto 60px auto;}
	.rslides h3{ width: 340px; font-size: 24px; line-height: 35px; margin-top: 13%; margin-left: calc(50% - 170px); font-weight: 300;}
	#menu {margin-bottom: 60px;}
	h1{margin-top: 100px; font-size: 24px;}
	.presentacion .dcho img{width: 100%; margin: 60px auto; }
	.trio{width: 90%; margin: 60px auto;}
	.trio .cent, .trio .dcho{margin-top: 60px;}
	.trio h2 .ubi { font-weight: 400;}
	.trio h2 .para {font-size: 20px;}
	.fondo-botes{background: #f1f3ef url("../imagenes/fondo-botes.jpg") no-repeat right top; background-size: 100% auto;
		padding: 80% 10% 80px 10%; margin: 60px 0; }
	.fondo-botes p, .fondo-karcher h3 { font-size: 24px; line-height: 40px;}
	.fondo-botes .boton a{margin: 30px auto;}
	.fondo-servicios{background: #f1f3ef; padding: 60px 0;}
	.fondo-servicios h3{font-size: 24px;}
	.fondo-servicios h4 { margin-top: 60px; font-size: 26px;}
	.fondo-karcher img, .fondo-grafitis img{width: 100%; margin-bottom: 60px;}
	.fondo-grafitis{margin: 60px 0 100px 0;}
	.fondo-grafitis p{font-size: 18px;}
	.tipos strong{display: block;}
	.tipos .barra{display: none;}
	.listado{font-size: 19px; margin-left: 0; list-style-type: none; padding-top: 50px; margin-top: 60px;
		background: url("../imagenes/servicio-pintura-ok.svg") no-repeat center top; background-size: 40px auto;}
	.fondo-servicios ul{ margin: 0 0 0 0;}
	.fondo-servicios ul li, .fondo-karcher ul li{ background: url("../imagenes/servicio-pintura-ok.svg") no-repeat center 15px; 
		background-size: 25px auto; padding-top: 40px; list-style-type: none; font-size: 19px;}
	.fondo-servicios ul li li, .fondo-servicios .sincheck li{ background: none; padding-top: 0;}
	.como ul, .fondo-karcher ul, .fondo-grafitis p{margin-left: 0;}
	.como ul li{ background: url("../imagenes/servicio-pintura-ok2.svg") no-repeat center 15px; background-size: 25px auto;
	padding-top: 40px; list-style-type: none; font-size: 19px; margin-left: 0;}
	.frase { font-size: 26px; line-height: 36px;}
	.trio p{font-size: 19px;}
	.s-pintor h5{display: block;}
	footer h5{width: 90%; margin: 30px auto;}
	#aviso{padding-top: 10px;}
	#aviso .guion{display: none;}
	#aviso .block{display: block;}
}

@media only screen 
and (min-width : 501px)
and (max-width : 750px) {
	body{text-align: center;}
	.pantalla, .movil, #imagen .rslides .movil img, #imagen .rslides .pantalla img{ display: none !important;}
	.container { width: 100%; margin: 0 auto;}
	.todo {	margin: 0 30px;}
	#logo{font-size: 14px;}
	.rslides h3{ width: 300px; font-size: 26px; line-height: 36px; margin-top: 15%; margin-left: calc(50% - 150px); font-weight: 200;}
	h1{margin-top: 80px; font-size: 28px;}
	.presentacion .dcho img{width: 100%; max-width: 400px; margin: 80px auto; }
	.trio{width: 90%; max-width: 400px; margin: 80px auto;}
	.trio .cent, .trio .dcho{margin-top: 80px;}
	.trio h2 .ubi { font-weight: 400;}
	.trio h2 .para {font-size: 20px;}
	.fondo-botes{background: #f1f3ef url("../imagenes/fondo-botes.jpg") no-repeat right top; background-size: 100% auto;
		padding: 80% 10% 80px 10%; margin: 80px 0; }
	.fondo-botes p, .fondo-karcher h3 { font-size: 26px; line-height: 40px;}
	.fondo-botes .boton a{margin: 30px auto;}
	.fondo-servicios{background: #f1f3ef; padding: 80px 0;}
	.fondo-karcher img, .fondo-grafitis img{width: 100%; margin-bottom: 60px;}
	.fondo-grafitis{margin: 80px 0;}
	.fondo-grafitis p{font-size: 20px;}
	.tipos strong{display: block;}
	.tipos .barra{display: none;}
	.listado{font-size: 20px; margin-left: 0; list-style-type: none; padding-top: 50px; margin-top: 60px; margin-left: 0;
		background: url("../imagenes/servicio-pintura-ok.svg") no-repeat center top; background-size: 40px auto;}
	.fondo-servicios ul li, .fondo-karcher ul li{ background: url("../imagenes/servicio-pintura-ok.svg") no-repeat center 15px; 
		background-size: 25px auto; padding-top: 40px; list-style-type: none; font-size: 20px; margin-left: 0;}
	.fondo-servicios ul li li, .fondo-servicios .sincheck li{ background: none; padding-top: 0; margin-left: 0;}
	.como ul li{ background: url("../imagenes/servicio-pintura-ok2.svg") no-repeat center 15px; background-size: 25px auto;
	padding-top: 40px; list-style-type: none; font-size: 20px; margin-left: 0;}
	.frase { font-size: 30px; line-height: 40px; margin-top: 80px;}
	footer h5{width: 90%; margin: 30px auto;}
	#aviso{padding-top: 10px;}
	#aviso .guion{display: none;}
	#aviso .block{display: block;}
}

@media only screen 
and (min-width : 751px)
and (max-width : 999px) {
	body{text-align: center;}
	.movil, .pantalla, #imagen .rslides .movil img, #imagen .rslides .pantalla img{ display: none !important;}
	.container { width: 100%; margin: 0 auto;}
	.todo {	margin: 0 40px;}
	#logo{	width: 300px; margin: 0 auto; font-size: 14px;}
	#logo img{width: 200px; margin: 0 auto;}
	#menu{	width: 90%; margin: 0 auto; font-size: 17px;}
	#menu ul li{ float: left;}
	#menu ul .pres{width: 25%;}
	#menu ul .pint{width: 30%;}
	#menu ul .kart{width: 25%;}
	#menu ul .cont{width: 20%;}
	.rslides h3{ width: 600px; font-size: 36px; line-height: 47px; margin-top: 15%; margin-left: calc(50% - 300px); font-weight: 200;}
	h1{margin-top: 100px;}
	.presentacion .dcho img{width: 500px; margin: 60px auto; }
	.trio{width: 400px; margin: 100px auto;}
	.trio .cent, .trio .dcho{margin-top: 100px;}
	.trio h2 .ubi { font-weight: 400; margin-bottom: 20px; font-size: 33px;}
	.trio h2 .para {font-size: 20px;}
	.fondo-botes{background: #f1f3ef url("../imagenes/fondo-botes.jpg") no-repeat right top; background-size: 100% auto;
		padding: 80% 10% 80px 10%; margin: 100px 0; }
	.fondo-botes p, .fondo-karcher h3 { font-size: 28px; line-height: 40px;}
	.fondo-botes .boton a{margin: 30px auto;}
	.fondo-servicios{background: #f1f3ef; padding: 100px 0;}
	.fondo-servicios ul li, .fondo-karcher ul li{ background: url("../imagenes/servicio-pintura-ok.svg") no-repeat center 15px; 
		background-size: 25px auto; padding-top: 40px; list-style-type: none; font-size: 20px;}
	.fondo-servicios ul li li, .fondo-servicios .sincheck li{ background: none; padding-top: 0;}
	.como ul li{ background: url("../imagenes/servicio-pintura-ok2.svg") no-repeat center 15px; background-size: 25px auto;
	padding-top: 40px; list-style-type: none; font-size: 20px;}
	.fondo-karcher img, .fondo-grafitis img{width: 100%; margin-bottom: 60px;}
	.fondo-grafitis{margin: 100px 0;}
	.listado{margin-left: 0; list-style-type: none; padding-top: 50px; margin-top: 60px;
		background: url("../imagenes/servicio-pintura-ok.svg") no-repeat center top; background-size: 40px auto;}

}
@media only screen 
	and (min-width : 1000px){ 
	#cabecera{position: relative; z-index: 2;}
	#logo{	width: 26%; float: left; padding: 30px 2% 30px 2%; border-radius: 0 0 70px 0; font-size: 14px;}
	#logo img{width: 70%; margin: 0 auto;}
	#imagen{position: relative; z-index: 1; top: -150px;}
	.movil, .tablet, 
	.rslides .tablet img, 
	.rslides .movil img, 
	#imagen .movil img, #imagen .tablet img, 
	#imagen .tablet, #imagen .movil{ display: none;}
	.rslides h3{ font-size: 27px; line-height: 40px; margin-top: 20%; margin-left: 50%; width: 45%; font-weight: 200;}
	.container { width: 90%; max-width: 1400px; margin: 0 auto;}
	.todo {	margin: 0 50px;}
	#menu{	width: 70%; float: right; font-size: 17px;}
	#menu ul{width: 90%; margin: 20px 10% 0 auto;}
	#menu ul li{ float: left;}
	#menu ul .pres{width: 25%;}
	#menu ul .pint{width: 31%;}
	#menu ul .kart{width: 25%;}
	#menu ul .cont{width: 19%;}
	.trio .izdo, .trio .dcho, .trio .cent{width: 29.33%; float: left; margin: 0 2%; }
	.duo .izdo, .fondo .izdo{width: 50%; float: left;}
	.duo .dcho, .fondo .dcho{width: 50%; float: right;}
	.fondo-karcher .izdo{margin-top: 70px;}
	.presentacion .dcho img{width: 100%; margin: 0 auto;}
	.presentacion .izdo p{margin-right: 60px;}
	.fondo{background: #f1f3ef;}
	.fondo-botes{background: #f1f3ef url("../imagenes/fondo-botes.jpg") no-repeat right center; background-size: 50% auto;
		padding: 140px 0; margin: 140px 0;}
	.fondo-botes p{margin-right: 60%;}
	.fondo-karcher{ margin: 140px 0 0 0;}
	.fondo-grafitis{margin: 0 0 140px 0;}
	.fondo-grafitis .izdo img{position: relative; margin-left: -150px;}
	.fondo-grafitis h3, .fondo-grafitis p{margin-left: 100px;}
	.fondo-grafitis h3{ font-size: 26px;}
	.fondo-servicios{padding: 100px 0; margin-top: 140px;}
	.fondo-servicios h3{font-size: 30px;}
	.trio1 p{height: 200px;}
}
@media only screen 
and (min-width : 1100px){ 
	.trio1 p{height: 200px;}
	}
@media only screen 
and (min-width : 1200px){ 
	#logo { width: 25%; padding: 30px 4% 50px 1%; border-radius: 0 0 40% 0; font-size: 16px;}
	#menu{	width: 70%; float: right; font-size: 18px;}
	#menu ul{width: 90%; margin: 5px 10% 0 auto;}
	.rslides h3{ font-size: 30px; line-height: 45px; }
	#imagen{top: -200px;}
	.presentacion .dcho img{width: 500px; }
	.trio1 p{height: 160px;}
	.fondo-karcher .izdo h3, .fondo-grafitis .dcho h3{margin-top: 30px;}
	}
@media only screen 
and (min-width : 1400px){ 
	#menu{	width: 60%; float: right; font-size: 18px;}
	#menu ul{width: 90%; margin: 40px 10% 0 auto;}
	.fondo-botes{padding: 170px 0; }
	.rslides h3{ font-size: 36px; line-height: 45px; }
	.trio h2 { font-weight: normal; font-size: 18px;}
	.trio h2 .ubi { font-size: 34px;}
	.trio1 p{height: 140px;}
	.fondo-karcher .izdo h3, .fondo-grafitis .dcho h3{margin-top: 40px;}
	}
@media only screen 
and (min-width : 1440px){ 
	.trio1 p{height: 120px;	}
	.fondo-grafitis .dcho{margin-top: 80px;}
	}
@media only screen 
and (min-width : 1600px){ 
	#logo{width: 450px; font-size: 17px;}
	#menu{	width: 60%; float: right; font-size: 18px;}
	#menu ul{width: 800px; margin: 80px auto 0 auto;}
	.rslides h3{ font-size: 40px; line-height: 50px; }
	.trio h2 { font-weight: normal; font-size: 20px;}
	.trio h2 .ubi { font-size: 37px;}
	.fondo-grafitis .dcho h3{margin-top: 80px;}
	}
@media only screen 
and (min-width : 1000px)
and (max-width : 1530px) {  
	.container{width: 100%;}
	.tipos strong{display: block;}
	.tipos .barra{display: none;}
	.listado { font-size: 1em; line-height: 2em;} 
	.fondo ul, .fondo-grafitis p {  font-size: 18px; line-height: 32px;}
	.fondo-karcher ul li {    margin-top: 0;}
	.fondo-botes p, .fondo-karcher h3 {    font-size: 30px; line-height: 40px;}
	.fondo-karcher .dcho img, .fondo-grafitis .izdo img{position: relative; width: 100%; margin: 50px auto;}
	.fondo-grafitis p, .fondo-grafitis h3{margin-left: 50px;}
	.fondo-grafitis .dcho{margin-top: 50px;}
}
@media only screen 
and (min-width : 621px)
and (max-width : 750px) {
	.rslides h3{ width: 500px; font-size: 29px; line-height: 36px; margin-top: 15%; margin-left: calc(50% - 250px); font-weight: 200;}
	}
@media only screen 
and (min-width : 1000px)
and (max-width : 1100px) {
	.trio h2 .ubi { font-size: 28px;}
	}
@media only screen 
and (min-width : 1100px)
and (max-width : 1270px) {
	.trio2 p{height: 70px;	}
	}
@media only screen 
and (min-width : 1000px)
and (max-width : 1125px) {
	.trio3 p{height: 150px;	}
	.fondo-grafitis p { margin-top: 0; margin-bottom: 10px; }
	}