/*
Theme Name: Master Shield Roofing
Template: oceanwp
Author: Jesus Gonzalez
Version: 4.1.2.1756420664
Updated: 2025-08-28 22:37:44

*/

:root {
	--blanco:#fff;
	--negro:#000;
    --oscuro:#232323;
    --cafe:#65440f;
    --cafe-80:#a87c13;
    --amarillo:#efb81a;
    --amarillo-30:#fadb5b;
    --amarillo-10:#f8f097;
    --degradado: linear-gradient(164deg,rgba(101, 68, 15, 1) 0%, rgba(168, 124, 19, 1) 26%, rgba(239, 184, 20, 1) 54%, rgba(249, 219, 91, 1) 92%, rgba(249, 241, 151, 1) 100%);
}

.ancho-50 {max-width: 50%;margin: auto;position: relative;z-index: 1;}
.ancho-80 {max-width: 80%;margin: auto;position: relative;z-index: 1;}
.ancho-85 {max-width: 85%;margin: auto;position: relative;z-index: 1;}
.ancho-90 {max-width: 90%;margin: auto;position: relative;z-index: 1;}
.weight-600{font-weight: 600}
.c-blanco{color: var(--blanco) !important;}
.linea-abajo{position: relative;}
.linea-abajo::after{content: "";position: absolute;bottom: -10px;left: 0;height: 2px;width: 20%;background: var(--amarillo);border-radius: 15px;}
.textos span.leyenda-subtitulo{font-weight: 700 !important;margin-bottom: 10px;display: inline-block;}
.radius-10{border-radius: 10px;object-fit: center;box-shadow: rgba(0, 0, 0, 0.18) 0px 2px 4px;}

html,body{overflow-x: hidden;}
header{padding: 5px;position: fixed !important;width: 100% !important;top: 0;transition: .5s all ease;background:var(--blanco); !important;}
#site-logo #site-logo-inner a img{transition: .5s all ease;}
/*#site-header #site-logo #site-logo-inner a img, #site-header.center-header #site-navigation-wrap .middle-site-logo a img{max-height: 60px !important;height: 60px;}*/
header.headerEffecto{background:var(--blanco) !important;border-bottom: none !important;box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;}
.effect-seven.headerEffecto #site-navigation-wrap .dropdown-menu>li>a.menu-link>span{color: var(--negro) !important;}
header.headerEffecto.sticky{background: var(--blanco) !important;border-bottom: 1px solid #e5e5e580 !important;box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;}
#site-header #site-logo #site-logo-inner a img{max-height: 80px !important;height: 80px !important;transition: .5s all ease;}
#site-navigation-wrap .dropdown-menu >li >a{line-height: 80px !important}
header#site-header.headerEffecto.sticky #site-logo #site-logo-inner a img,header#site-header.sticky #site-logo #site-logo-inner a img{max-height: 70px !important;height: 70px;}
header#site-header.headerEffecto.sticky #site-logo #site-logo-inner,header#site-header.sticky #site-logo #site-logo-inner{height: 70px !important;}
header.headerEffecto.sticky #site-navigation-wrap .dropdown-menu>li>a,header.sticky #site-navigation-wrap .dropdown-menu>li>a{line-height: 70px !important}
.oceanwp-mobile-menu-icon a{color: var(--cafe);line-height: 50px !important;}
header.headerEffecto.animado.sticky .oceanwp-mobile-menu-icon a{color: var(--negro);line-height: 50px !important;}
.oceanwp-mobile-menu-icon a:hover,.sidr a:hover{color: var(--cafe);}

#site-navigation-wrap .dropdown-menu>li>a{color: var(--negro);font-size: 15px;transition: .5s all ease;font-weight: 600;text-transform: uppercase;}
#site-navigation-wrap .dropdown-menu>li>a:hover{color: var(--negro);}
.effect-three #site-navigation-wrap .dropdown-menu >li >a.menu-link >span:after{background-color: var(--negro) !important;}
.effect-three.animado #site-navigation-wrap .dropdown-menu >li >a.menu-link >span:after{background-color: var(--negro) !important;}


header.headerEffecto.sticky #site-navigation-wrap .dropdown-menu>li>a{color: var(--negro);}
header.headerEffecto #site-navigation-wrap .dropdown-menu>li.current-menu-item.current_page_item>a,header.headerEffecto #site-navigation-wrap .dropdown-menu>li>a:hover{color: var(--negro) !important;}
header.headerEffecto #site-navigation-wrap .dropdown-menu>li.current-menu-item.current_page_item>a>span:after{background-color: var(--negro) !important;background-color: var(--negro) !important;opacity: 1;height: 2px;transform: translateY(0);}


.bannerPagina {height: calc(100vh - 91px);position: relative;}
.imagenDestacada {position: relative;background-size: cover !important;background-repeat: no-repeat !important;background-position: center !important;background-attachment:fixed !important;height: 100%;overflow: hidden;display: flex;justify-content: center;align-items: center;}
.imagenDestacada::after {content: "";background: rgba(0, 0, 0, .6);height: 100%;position: absolute;top: 0;bottom: 0;left: 0;right: 0;}
.alineartituloDestacado {position: absolute;z-index: 2;color: #fff;top: 50%;left: 50%;transform: translateX(-50%) translateY(-50%);}
.alineartituloDestacado h1 {font-size: 8vh;font-weight: 800;color: #fff !important;}
body.bodyanimado .bannerPagina {height: calc(100vh - 76px);}




footer{background: var(--oscuro);color: var(--blanco);}
footer .logo-footer{height: 100px;object-fit: contain;}
.horariosFooter{}
.horariosFooter p{margin-bottom: 5px;font-weight: 700;font-size: 20px;line-height: 1.5;}
.horariosFooter ul{list-style-type: none;margin: 0;color: var(--blanco);}
.horariosFooter ul li{color: var(--blanco);font-size: 15px;margin-bottom: 1px;line-height: 1.5;}
span.iconoHora {display: block;margin-bottom: 5px;}
.horariosFooter ul li a{color: var(--blanco);position: relative;transition: .5s all ease;border-radius: 5px;z-index:2;padding: 2px 5px;width: auto;display: inline-block;line-height: 1.3;font-size: 16px}
.horariosFooter ul li a::before{content:"";position: absolute;left: 0;width: 0;background: var(--blanco);height: 100%;bottom: 0;border-radius: 5px;transition: .5s all ease;z-index: -1;}
.horariosFooter ul li a:hover::before{width: 100%;background: var(--blanco);height: 100%;bottom: 0;}
.horariosFooter ul li a:hover{color:var(--negro);}
.horariosFooter ul li i{font-size: 15px;margin-right: 10px;}
#rowLineaV{}
#rowLineaV .lineaVertical:last-child::after{content: none;}
.lineaVertical::after{content: "";position: absolute;right: 0;height: 100%;width: 2px;background: #ffffff5e;bottom: 0;}

.social-buttons {display: flex;justify-content: center;}
.social-buttons a {margin-right: 10px;font-size: 20px;height: 30px;width: 30px;transition: .5s all ease;display: flex;align-items: center;justify-content: center;border-radius: 5px;background: transparent;color: var(--blanco);}
.social-buttons a:hover{color: var(--cafe);background: var(--blanco);}
.social-buttons a:last-child {margin-right: 0;}
span.social-button__inner {font-size: 20px;}
a#scroll-top {background-color: var(--amarillo) !important;border: 2px solid var(--blanco);}


.fondo{background-size: cover !important;background-repeat: no-repeat !important;background-position: center !important;background-attachment: fixed !important;position: relative;}
.textura-paper{background-size: cover !important;background-repeat: no-repeat !important;background-position: center !important;background-attachment: fixed !important;position: relative;background: url(https://mastershieldroofing.com/wp-content/uploads/2025/09/textura-con-hojas.webp) !important;}
.textura-granulada{background-size: cover !important;background-repeat: no-repeat !important;background-position: center !important;background-attachment: fixed !important;position: relative;background: url(https://mastershieldroofing.com/wp-content/uploads/2025/09/textura-granulada.webp) !important;}
.fondo::after,.textura-paper::after,.textura-granulada::after{content: "";position: absolute;width: 100%;height: 100%;bottom: 0;left: 0;background: rgba(255, 255, 255, .4);}

.textos{position: relative;}
.textos p,.textos p span,.textos span,.textos ul,.textos ul li,.textos a{font-size: 1.8vh;font-family: "Montserrat", sans-serif;line-height: 1.5;font-weight: 500 !important;}
.textos b,.textos strong{font-weight:800 !important; }
.textos h2,.textos h2 span{font-size: 2.7vh;}
.textos h3,.textos h3 span{font-size: 2.5vh;}
.textos h4,.textos h4 span {font-size: 2vh}
main#main {margin-top: 91px;transition: .5s all ease;}
body.bodyanimado main#main{margin-top: 76px;}
section#hero{background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important;height: calc(100vh - 91px);display: flex;justify-content: center;align-items: center;position: relative;}
body.bodyanimado section#hero{height: calc(100vh - 76px);}
section#hero::after{content: "";position: absolute;left: 0;bottom: 0;top: 0;right: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, .5);}
section#hero .contenido-hero{position: relative;z-index: 1;color: var(--blanco);margin-top: 10%;}
section#hero h1,section#hero h2,section#hero h3{color: var(--blanco);text-align: center;font-family: "Montserrat", sans-serif;font-size: 5vh;}

section#hero h1{font-weight: 800;font-size: 8vh;}
section#hero h2{font-weight: 600;font-size: 6vh;margin-bottom: 0;}
section#hero h3{font-weight: 600;font-size: 6vh;margin-bottom: 0;}
.caja-imgs-home {position: relative;text-align: center;}
.caja-imgs-home img{box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;border-radius: 10px;}
.caja-imgs-home  .interpuesto{position:absolute;bottom: -15px;left: -20px;width: 350px;border-radius: 10px;}

.estilo-quote{position: relative;}
.estilo-quote i{position: absolute;font-size: 8vh;opacity: .3;z-index: -1;color: var(--cafe);}
.estilo-quote i.fa-quote-left{left: -5%;top: 0;transform: translateY(-80%);}
.estilo-quote i.fa-quote-right{right: -5%;bottom: 0px;transform: translateY(60%);}

a.btn-custom {position: relative;background: var(--cafe-80);padding: 5px 30px;border-radius: 20px;color: var(--blanco);transition: .5s all ease;}
a.btn-custom:hover{background: var(--cafe);}

.servicio{position: relative;background: var(--cafe-80);padding: 10px;/* overflow: hidden; */margin: auto;color: var(--blanco);display: flex;flex-direction: column;width: 80%;/* height: 100%; */border-radius: 10px;}
.servicio .textos{flex: 1;display: flex;flex-direction: column;}
.servicio .descripcion{flex: 1;}
.servicio .textos h3{margin-bottom: 10px;color: var(--blanco);}
.servicio img{position: absolute;height: 90%;object-fit: contain;opacity: 0.2;right: -10px;z-index: 1;}
.titulosh2 {font-size: 5vh;}

.servicios-swipper {position: relative;}
.servicios-swipper .swiper-wrapper {display: flex;align-items: stretch;border-radius: 10px;}
.servicios-swipper .swiper-slide {height: auto;display: flex;background: var(--cafe-80);border-radius: 10px;padding: 5px 0;box-shadow: rgba(0, 0, 0, 0.04) 0px 3px 5px;}
.swiper-button-prev:after, .swiper-button-next:after,.swiper-button-next:after, .swiper-button-prev:after{content: none !important;}
.swiper-button-next ,.swiper-button-prev {height: 20px !important;width: 20px !important;background: var(--blanco);border-radius: 50%;padding: 20px;align-items: center !important;justify-content: center !important;opacity: .5;transition: .4s all ease;transform: translateY(-50%);margin-top: 0 !important;}
.swiper-button-next:hover ,.swiper-button-prev:hover{opacity:1;}
.swiper-button-next i,.swiper-button-prev i {font-size: 24px;color: var(--oscuro);}



.valor {padding: 10px;border-radius: 10px;box-shadow: rgba(0, 0, 0, 0.04) 0px 3px 5px;background: var(--blanco);height: 100%;position: relative;}
.valor .textos h3{margin-bottom: 10px;}
.valor img{position: absolute;height: 70%;object-fit: contain;opacity: 0.05;right: 10px;z-index: 1;top: 50%;transform: translateY(-50%);}


#cliente .img-fluid {transition: transform 1.5s ease-out;transform-style: preserve-3d;}
#cliente .img-fluid.rotated {transform: rotate(360deg);}

.img-40 {height: 40vh;object-fit: contain;}
ul.listadoTabs li{margin-bottom:10px}

.estilo-servicios{position: relative;}
.estilo-servicios h2{font-size: 5vh;margin-bottom: 5px;line-height: 1.3;}
.estilo-servicios h3{font-size: 3vh;margin-bottom: 0;line-height: 1.3;}
.estilo-servicios h3 span{display: block;font-weight: 600 !important;font-size: 3vh;}


.caja-servicios-home img{height: 30vh;margin: 0 auto;display: block;}
.textos.text-right .linea-abajo::after{left: initial;right: 0;}

.dropdown-menu .sub-menu{border-top: 2px solid var(--cafe) !important;}

.medio-contacto{background: var(--blanco);position: relative;height: 100%;padding: 20px;box-shadow: rgba(0, 0, 0, 0.04) 0px 3px 5px;border-radius: 10px;text-align: center;}
.medio-contacto .icono-contacto{text-align: center;margin-bottom: 10px;}
.medio-contacto .icono-contacto img{height: 40px;}
.medio-contacto .textos{}
.medio-contacto .textos h3{}
.medio-contacto .descripcion.textos{}
.medio-contacto .descripcion.textos p{margin-bottom: 5px;}
.medio-contacto .descripcion.textos p a{}
.medio-contacto .descripcion.textos p a:hover{color:var(--amarillo)}

input[type=submit]{background-color: var(--cafe) !important;padding: 10px 20px !important;font-size: 16px;border-radius: 4px !important;}
input[type=submit]:hover{background-color: var(--negro) !important;}
.wpcf7-spinner{position: absolute;top: 7px;}
/* ----- Responsive ----- */
@media (min-width: 1921px) {

}

@media (max-width: 1540px){
#site-navigation-wrap .dropdown-menu>li>a{font-size: 14px;padding: 0 10px;}
}

@media (max-width: 1366px) {
#site-navigation-wrap .dropdown-menu>li>a{font-size: 14px;padding: 0 5px;}
}


@media (max-width: 1280px) {
   .ancho-80{width: 90%;}
}

@media (max-width: 1199px) {
 #site-header #site-logo #site-logo-inner a img, #site-header.center-header #site-navigation-wrap .middle-site-logo a img,header#site-header.headerEffecto.sticky #site-logo #site-logo-inner a img,header#site-header.sticky #site-logo #site-logo-inner a img,#site-logo #site-logo-inner{max-height: 50px !important;height: 50px !important;}
 main#main{margin-top: 60px;}
 section#hero{height: calc(100vh - 60px);}
 #site-navigation-wrap .dropdown-menu >li >a{line-height: 50px !important}

 .lineaVertical::after{left: 50%;transform: translateX(-50%);height: 2px;width: 95%;}
 #rowLineaV .lineaVertical:last-child::after{content: "";}
}


@media (max-width: 1024px) {
#site-navigation-wrap .dropdown-menu>li>a{font-size: 12px;padding: 0 3px;}
}

@media only screen and (width: 1024px) and (height: 1366px) and (orientation: portrait) {

}

@media only screen and (width: 1024px) and (height: 768px) and (orientation: landscape) {

}

@media (max-width: 991px) {
    #site-header #site-logo #site-logo-inner a img, #site-header.center-header #site-navigation-wrap .middle-site-logo a img,header#site-header.headerEffecto.sticky #site-logo #site-logo-inner a img,header#site-header.sticky #site-logo #site-logo-inner a img,#site-logo #site-logo-inner{max-height: 50px !important;height: 50px !important}
    main#main{margin-top: 70px;}
    section#hero{height: calc(100vh - 70px);}
    section#hero h1{font-size: 6vh;line-height: 1.2;}
    section#hero h2,section#hero h3{font-size: 4vh}
}

@media (max-width: 991px) and (orientation: landscape) {
    section#hero h1{font-size: 8vh;line-height: 1.2;}
    section#hero h2,section#hero h3{font-size: 6vh}


}


@media (max-width: 850px) {
    main#main{margin-top: 60px;}
    section#hero{height: calc(100vh - 60px);}

    .ancho-80 {max-width: 100%;}
    .ancho-85 {max-width: 100%;}
    .ancho-90 {max-width: 100%;}


    .estilo-quote i{font-size: 6vh;}
    .estilo-quote i.fa-quote-left{left: 0;transform: translateY(-80%);}
    .estilo-quote i.fa-quote-right{right: 0;transform: translateY(60%);}
    .caja-imgs-home .interpuesto{width: 200px;left: -5px}

    body.page-template-page-nosotros main#main,body.page-template-page-servicios main#main,body.page-template-page-contacto main#main {margin-top: 61px;}
    body.page-template-page-nosotros main#main .bannerPagina,body.page-template-page-servicios main#main .bannerPagina,body.page-template-page-contacto main#main .bannerPagina{height: calc(40vh - 61px);}
    .imagenDestacada{background-attachment: initial !important;}
    .alineartituloDestacado{width: 80%;}
    .alineartituloDestacado h1{font-size: 4vh;}
    .img-40 {height: 22vh;object-fit: contain;}

    .bannerPagina{height: calc(40vh - 91px);}
    body.bodyanimado .bannerPagina{height: calc(40vh - 91px);}
    /*.alineartituloDestacado h1{font-size: 4vh;}*/
}

@media (max-width: 850px) and (orientation: landscape) {
    body.page-template-page-nosotros main#main .bannerPagina, body.page-template-page-servicios main#main .bannerPagina,body.page-template-page-contacto main#main .bannerPagina{height: calc(100vh - 61px);}

    .alineartituloDestacado h1{font-size: 6vh;}
    .textos h3, .textos h3 span{font-size: 20px;}
    .textos p, .textos p span, .textos span, .textos ul, .textos ul li, .textos a{font-size: 14px;}

}

@media (max-width: 767px) {
    .lineaVertical::after{bottom: -10px;}
    #rowLineaV .lineaVertical:last-child::after{content: "";}
    .img-40 {height: 20vh;object-fit: contain;}

    .textos h3, .textos h3 span{font-size: 20px;}
    .textos p, .textos p span, .textos span, .textos ul, .textos ul li, .textos a{font-size: 14px;}

    .seccion-alternada .reorder-movil{order: 2;}
}


@media (max-width: 576px) {

}


@media (max-width: 400px) {

}