ul,li{margin:0;padding:0;list-style:none}
*{background-repeat:no-repeat;transition:all .5s}
form{width:100%;float:left}
.tab{float:left}
.tab button{display:block;background-color:inherit;color:black;padding-bottom:30%;width:100%;border:none;outline:none;text-align:left;cursor:pointer;transition:0.3s;font-size:17px}
.tab button img{transform:scale(.9)}
.tab button:hover>img{transform:scale(1)}
.tabcontent{float:left;padding:5% 3%;width:70%}
.topic{position:absolute;transform:rotate(-90deg);top:50%;left:-38%;background:#e0f3ff;width:400px;height:50px;text-align:center}
.topic::before{position:absolute;content:'';height:0px;border-right:25px solid transparent;border-top:25px solid transparent;border-left:25px solid #e0f3ff;border-bottom:25px solid #e0f3ff;z-index:0;right:-49px;top:0px}
.topic::after{position:absolute;content:'';height:0px;border-right:25px solid #e0f3ff;border-top:25px solid transparent;border-left:25px solid transparent;border-bottom:25px solid #e0f3ff;z-index:0;left:-49px;bottom:0px}
.reviews{background-image:url(../tankless-water-heater/reviews.jpg);min-height:60vh;background-size:auto 100%}
.centered{align-items:center}
.choose{background-image:url(../tankless-water-heater/choose-us.jpg);background-size:auto 100%}
.choose i{background-color:#007aff;padding:6%;font-size:1.4vw;border-radius:50%;margin-right:2%}
p{font-size:1.1vw}
.phone{font-size:1.3vw;font-weight:700;color:#f7bf23}
.plumbers{position:absolute;bottom:0;right:5%;max-width:30%}
#video{position:fixed;top:0;min-width:100%;min-height:100%;z-index:-1}
html{scroll-behavior:smooth}
body{font-family:'Roboto',sans-serif!important;font-size:16px;font-weight:400;color:#23272b}
@font-face{font-display:swap;font-family:'Roboto';font-style:normal;font-weight:400;src:url('../webfonts/roboto-v20-latin-regular.woff2') format('woff2')}
@font-face{font-display:swap;font-family:'Roboto';font-style:normal;font-weight:500;src:url('../webfonts/roboto-v20-latin-500.woff2') format('woff2')}
@font-face{font-display:swap;font-family:'Roboto';font-style:normal;font-weight:700;src:url('../webfonts/roboto-v20-latin-700.woff2') format('woff2')}
@font-face{font-display:swap;font-family:'Roboto';font-style:normal;font-weight:900;src:url('../webfonts/roboto-v30-latin-900.woff2') format('woff2')}
.logo{width:20%}
.info{color:#3a3a3f;text-decoration:none;font-size:1rem;font-weight:300;line-height:27px;padding:5px 0 5px 0;background-image:url("../tankless-water-heater/top-line.png");background-repeat:no-repeat;background-position:center}
.navbar-expand-lg>.container{padding-right:15px;padding-left:15px}
li.nav-item{font-size:1.09vw}
.navbar{padding:0;-webkit-transition:all .4s ease;-moz-transition:all .4s ease-in-out;transition:all .4s ease}
.bd-highlight a{color:#fff !important}
.bd-highlight{font-size:1vw;align-items:center;justify-content:space-between}
.phone a,li.nav-item a:hover,.active a{color:#f7bf23 !important}
header{width:100%;height:100vh;color:#353638;background-color:#051c3591;background-image:linear-gradient(130deg,#051c359e 50%,#51607187 100%);position:relative}
header .tophead{padding:10%}
header .title-main{font-size:2vw;font-weight:700;margin:2% 0 5% 0}
header .intro-text{font-size:1.1em;line-height:1.8em}
.bg-color-opacity{color:#fff}
.text-color{color:#f7bf23}
.text-color-2{color:#0070F5}
small{letter-spacing:2px;text-transform:uppercase}
.btn{border:2px solid #f7bf23;border-radius:10px;padding:2% 5%;margin-top:2%;font-weight:700}
.btn:hover{color:inherit}
.coupon{background-color:#fff;color:#0070F5;font-size:2vw;text-align:center;font-weight:700}
.bg-img{background-position:center center;background-size:cover;background-attachment:fixed}
.module{position:relative;padding:90px 0 90px 0;background-color:#fff}
.services .service-item{cursor:pointer;background:#e0f3ff;text-align:center;line-height:1.6;font-size:16px;position:relative;z-index:10;color:#323436;border-radius:10px;transition:all .4s linear;padding:5% 1%;border:1px solid #ccc}
.services .service-item h3{font-size:.9vw;margin-top:7%;color:#212529}
.blue{background-color:#e0f3ff}
.dblue{background-color:#0070F5;color:#fff}
.ddblue{background-color:#091d36;color:#fff}
.section-title{position:relative;font-size:2rem;padding-bottom:15px;font-weight:700}
.section-title2{position:relative;font-size:1.5vw;padding-bottom:15px;font-weight:700}
.marquee{width:100%;margin:0 auto;overflow:hidden;white-space:nowrap;box-sizing:border-box;animation:marquee 50s linear infinite;color:#fff}
.marquee:hover{animation-play-state:paused}
@keyframes marquee{0%{text-indent:27.5em}
100%{text-indent:-105em}
}
.form-control{padding:5% 2%;width:46%;float:left;font-size:1.2em;color:#292929;margin-bottom:20px;border-radius:5px;border:0;background:#fff;margin:3% 2%}
.form-control2{padding:5% 2%;width:96%;float:left;font-size:1.2em;color:#292929;margin-bottom:20px;border-radius:5px;border:0;background:#fff;margin:3% 2%}
.contact-us{border-radius:4px}
#contact{background-color:#041b34}
#contact .fab{font-size:1.8rem;margin:5px 5px 0 0}
#contact .fab:hover{color:#f7bf23}
.btn-submit{margin:3% 2%;float:right;width:35%;font-size:1.2vw;border-radius:3px;padding:2%;background-color:#f7bf23}
footer{background-color:#020f1e;color:#fff}
.contact-us li{float:left;margin:1%;padding:1%;background-color:#e0f3ff;border-radius:5px}
.flex-section{display:flex;flex-direction:column;justify-content:center}
.marquee{width:100%;margin:0 auto;overflow:hidden;white-space:nowrap;box-sizing:border-box;animation:marquee 50s linear infinite;color:#fff}
.marquee:hover{animation-play-state:paused}
@keyframes marquee{0%{text-indent:27.5em}
100%{text-indent:-105em}
}
a{color:inherit}
a:hover{color:inherit;text-decoration:none}
a:active{color:inherit;text-decoration:none}
@media(max-width:1199.98px){li.nav-item{margin:0;font-size:1.4vw;font-weight:500}
header{height:auto !important}
.phone{font-size:1.7vw}
.info{background-position:40% center}
p{font-size:1.7vw}
.services .service-item h3{font-size:1.2vw}
.topic{left:-45%}
}
@media(max-width:991.98px){.topic{left:-28%}
.section-title2{font-size:2.2vw}
header .title-main{font-size:3vw}
.info{font-size:.8rem;font-weight:300}
.navbar-toggler{opacity:1}
#navbarResponsive{background-color:#14263e;position:absolute;top:100%;left:-100%;right:-100%;z-index:2;padding:20% 10%;text-align:center}
li.nav-item{border-bottom:1px dashed #f7bf23}
.info{background-position:25% center}
.logo{width:30%}
.phone{font-size:2.5vw}
.services .service-item h3{font-size:2vw}
.coupon{font-size:2.7vw}
.res-color{background-color:#091d368c;padding:5%}
.reviews{background-size:auto 50%}
.btn-submit{font-size:2.2vw}
}
@media(max-width:767.98px){.topic{display:none}
.phone{font-size:3.5vw}
.info{background-position:30% center}
p{font-size:2vw}
li.nav-item{font-size:2.4vw}
header .title-main{font-size:4.5vw}
.info{font-size:1.1rem;font-weight:500}
.section-title{font-size:1.6rem;padding-bottom:10px;font-weight:700}
}
@media(max-width:575.98px){.btn-submit{font-size:3.2vw}
p{font-size:2.8vw}
header .title-main{font-size:5.8vw}
.section-title{font-size:1.3rem}
.navbar-brand{width:70%}
.plumbers{display:none}
.info{background-image:none}
.logo{width:40%}
.phone{font-size:4vw}
li.nav-item,.services .service-item h3{font-size:3vw}
.coupon{font-size:3.3vw}
}
@media(max-width:475.98px){body{font-size:15px;font-weight:400}
header .title-main{font-size:5.5vw}
header{background-attachment:scroll}
.bg-img{background-attachment:scroll}
}
@media(max-width:435.98px){.info{font-size:1.1rem;font-weight:500;line-height:24px}
}
@media(max-width:379.98px){.info{font-size:1rem;font-weight:500;line-height:20px}
header .title-main{font-size:5vw}
}
/*! * Font Awesome Free 5.15.1 by @fontawesome - https://fontawesome.com * License - https://fontawesome.com/license/free (Icons:CC BY 4.0,Fonts:SIL OFL 1.1,Code:MIT License) */@font-face{font-family:"Font Awesome 5 Brands";font-style:normal;font-weight:400;font-display:swap;src:url(../webfonts/fa-brands-400.eot);src:url(../webfonts/fa-brands-400.eot?#iefix) format("embedded-opentype"),url(../webfonts/fa-brands-400.woff2) format("woff2"),url(../webfonts/fa-brands-400.woff) format("woff"),url(../webfonts/fa-brands-400.ttf) format("truetype"),url(../webfonts/fa-brands-400.svg#fontawesome) format("svg")}
.fab{font-family:"Font Awesome 5 Brands"}
@font-face{font-family:"Font Awesome 5 Free";font-style:normal;font-weight:400;font-display:swap;src:url(../webfonts/fa-regular-400.eot);src:url(../webfonts/fa-regular-400.eot?#iefix) format("embedded-opentype"),url(../webfonts/fa-regular-400.woff2) format("woff2"),url(../webfonts/fa-regular-400.woff) format("woff"),url(../webfonts/fa-regular-400.ttf) format("truetype"),url(../webfonts/fa-regular-400.svg#fontawesome) format("svg")}
.fab{font-weight:400}
@font-face{font-family:"Font Awesome 5 Free";font-style:normal;font-weight:900;font-display:swap;src:url(../webfonts/fa-solid-900.eot);src:url(../webfonts/fa-solid-900.eot?#iefix) format("embedded-opentype"),url(../webfonts/fa-solid-900.woff2) format("woff2"),url(../webfonts/fa-solid-900.woff) format("woff"),url(../webfonts/fa-solid-900.ttf) format("truetype"),url(../webfonts/fa-solid-900.svg#fontawesome) format("svg")}
.fa{font-family:"Font Awesome 5 Free"}
.fa{font-weight:900}
.fa,.fab{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:inline-block;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}
.fa-blogger:before{content:"\f37c"}
.fa-clock:before{content:"\f017"}
.fa-envelope:before{content:"\f0e0"}
.fa-facebook-square:before{content:"\f082"}
.fa-twitter-square:before{content:"\f081"}
.fa-youtube:before{content:"\f167"}
.fa-phone-alt:before{content:"\f879"}
.fa-google-plus-square:before{content:"\f0d4"}
.fa-linkedin:before{content:"\f08c"}
.fa-globe:before{content:"\f0ac"}
.fa-location-dot:before{content:"\f3c5"}
.fa-house:before{content:"\f015"}
.fa-quote-left:before{content:"\f10d"}
.fa-quote-right:before{content:"\f10e"}
.fa-stopwatch:before{content:"\f2f2"}
.fa-face-smile:before{content:"\f118"}
.fa-money-bill:before{content:"\f0d6"}
.fa-star:before{content:"\f005"}
.fa-certificate:before{content:"\f0a3"}
.fa-shake{-webkit-animation-name:fa-shake;animation-name:fa-shake;-webkit-animation-duration:var(--fa-animation-duration,1s);animation-duration:var(--fa-animation-duration,1s);-webkit-animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-iteration-count:var(--fa-animation-iteration-count,infinite);-webkit-animation-timing-function:var(--fa-animation-timing,linear);animation-timing-function:var(--fa-animation-timing,linear)}
@-webkit-keyframes fa-shake{0%{-webkit-transform:rotate(-15deg);transform:rotate(-15deg)}
4%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}
8%,24%{-webkit-transform:rotate(-18deg);transform:rotate(-18deg)}
12%,28%{-webkit-transform:rotate(18deg);transform:rotate(18deg)}
16%{-webkit-transform:rotate(-22deg);transform:rotate(-22deg)}
20%{-webkit-transform:rotate(22deg);transform:rotate(22deg)}
32%{-webkit-transform:rotate(-12deg);transform:rotate(-12deg)}
36%{-webkit-transform:rotate(12deg);transform:rotate(12deg)}
40%,to{-webkit-transform:rotate(0deg);transform:rotate(0deg)}
}
@keyframes fa-shake{0%{-webkit-transform:rotate(-15deg);transform:rotate(-15deg)}
4%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}
8%,24%{-webkit-transform:rotate(-18deg);transform:rotate(-18deg)}
12%,28%{-webkit-transform:rotate(18deg);transform:rotate(18deg)}
16%{-webkit-transform:rotate(-22deg);transform:rotate(-22deg)}
20%{-webkit-transform:rotate(22deg);transform:rotate(22deg)}
32%{-webkit-transform:rotate(-12deg);transform:rotate(-12deg)}
36%{-webkit-transform:rotate(12deg);transform:rotate(12deg)}
40%,to{-webkit-transform:rotate(0deg);transform:rotate(0deg)}
}
.hvr-shadow-radial{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative}
.hvr-shadow-radial:before,.hvr-shadow-radial:after{pointer-events:none;position:absolute;content:'';left:10%;width:80%;box-sizing:border-box;background-repeat:no-repeat;height:10px;opacity:0;-webkit-transition-duration:0.3s;transition-duration:0.3s;-webkit-transition-property:opacity;transition-property:opacity}
.hvr-shadow-radial:before{bottom:100%;background:-webkit-radial-gradient(50% 150%,ellipse,rgba(0,0,0,0.6) 0%,rgba(0,0,0,0) 80%);background:radial-gradient(ellipse at 50% 150%,rgba(0,0,0,0.6) 0%,rgba(0,0,0,0) 80%)}
.hvr-shadow-radial:after{top:100%;background:-webkit-radial-gradient(50% -50%,ellipse,rgba(0,0,0,0.6) 0%,rgba(0,0,0,0) 80%);background:radial-gradient(ellipse at 50% -50%,rgba(0,0,0,0.6) 0%,rgba(0,0,0,0) 80%)}
.hvr-shadow-radial:hover:before,.hvr-shadow-radial:focus:before,.hvr-shadow-radial:active:before,.hvr-shadow-radial:hover:after,.hvr-shadow-radial:focus:after,.hvr-shadow-radial:active:after{opacity:1;cursor:pointer}
@-webkit-keyframes hvr-ripple-in{100%{top:0;right:0;bottom:0;left:0;opacity:1}
}
@keyframes hvr-ripple-in{100%{top:0;right:0;bottom:0;left:0;opacity:1}
}
.hvr-ripple-in{vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative}
.hvr-ripple-in:before{content:'';position:absolute;border:#e1e1e1 solid 4px;top:-12px;right:-12px;bottom:-12px;left:-12px;opacity:0;-webkit-animation-duration:1s;animation-duration:1s}
.hvr-ripple-in:hover:before,.hvr-ripple-in:focus:before,.hvr-ripple-in:active:before{-webkit-animation-name:hvr-ripple-in;animation-name:hvr-ripple-in}
.lightbox-target{position:fixed;top:0;left:0;width:100%;background:rgba(0,0,0,0.7);opacity:0;-webkit-transition:opacity .5s ease-in-out;-moz-transition:opacity .5s ease-in-out;-o-transition:opacity .5s ease-in-out;transition:opacity .5s ease-in-out;overflow:hidden;z-index:2}
.lightbox-target img{margin:auto;position:absolute;top:0;left:0;right:0;bottom:0;max-height:0;max-width:0;border:3px solid white;box-shadow:0 0 8px rgba(0,0,0,0.7);box-sizing:border-box;transition:.5s ease-in-out}
a.lightbox-close{width:100%;height:100%;position:absolute;transition:.5s ease-in-out;opacity:0}
.lightbox-target:target{opacity:1;top:0;bottom:0}
.lightbox-target:target img{max-height:100%;max-width:100%}