
/* TABLE OF CONTENTS */
/* ------------------------------ reset */
/* ------------------------------ fonts */
/* ------------------------------ body */
/* ------------------------------ headings */
/* ------------------------------ home page */
/* ----------------- header */
/* ----------------- nav */
/* ----------------- banner */
/* ----------------- content */
/* ----------------- footer */
/* ------------------------------ inner pages */










/* ----------------------------------------------------------------------- reset */

@import "reset.css";



/* ----------------------------------------------------------------------- fonts */

@import url('https://fonts.googleapis.com/css2?family=Anton&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&display=swap');



/* ----------------------------------------------------------------------- body */

body {
    font:normal 16px "Montserrat", sans-serif;
    line-height:130%;
    font-weight:normal;
	color:#444;
}

.align-right{
	text-align:right !important;
}

.align-center{
	text-align:center !important;
}

.no-margin{
	margin:0 !important;
}






/* ----------------------------------------------------------------------- headings */

.banner-area h1{
	margin-bottom:40px;
}

.banner-area h1 small{
	font-size:32px;
	line-height:120%;
	font-weight:bold;
	text-transform:uppercase;
	color:#fff;
	display:block;
	margin-bottom:7px;
}

.banner-area h1 strong{
	font:normal 72px "Anton", sans-serif;
	line-height:120%;
	font-weight:normal;
	text-transform:uppercase;
	color:#ffc527;
	display:block;
	margin-bottom:10px;
}

.banner-area h1 span{
	font:normal 24px "Roboto Condensed", sans-serif;
	line-height:110%;
	font-weight:bold;
	text-transform:uppercase;
	color:#fff;
	background:#403f3f;
	display:inline-block;
	padding:13px 20px 11px 20px;
}

h2{
	font-size:35px;
	line-height:120%;
	font-weight:bold;
	text-transform:uppercase;
	color:#333;
	margin-bottom:70px;
}

h2 span{
	font-size:20px;
	line-height:120%;
	font-weight:500;
	text-transform:none;
	color:#666;
	display:block;
	margin-top:4px;
}

.project-area h2, .team-area h2{
	text-align:center;
}

.testi-area h2, .testi-area h2 span{
	color:#fff;
	text-align:center;
}

h3{
	font-size:20px;
	line-height:120%;
	font-weight:bold;
	text-transform:uppercase;
	color:#333;
	margin-bottom:8px;
}

h3 a{
	color:#333;
	transition:0.3s;
}

h3 a:hover{
	color:#ffc527;
}

.project-area article h3{
	margin-bottom:4px;
}

.carousel-inner article aside h3{
	text-transform:none;
	margin-bottom:2px;
}

footer h3{
	color:#ffc527;
	margin-bottom:18px;
}

h4{
	font-size:27px;
	line-height:120%;
	font-weight:bold;
	color:#333;
	margin-bottom:20px;
}






/* ----------------------------------------------------------------------- home page */

/* ----------------------------------------- header */

header{
	padding:26px 0 18px 0;
}

.call-email ul{
	padding:27px 0 0 0;
	text-align:center;
}

.call-email ul li{
	display:inline;
	font-weight:500;
	font-size:14px;
	line-height:130%;
	text-align:left;
	margin-right:10px;
}

.call-email ul li a{
	padding:14px 35px 12px 57px;
	display:inline-block;
	border:1px solid #e5e2e2;
	border-radius:4px;
	color:#999;
	transition:0.3s;
}

.call-email ul li a strong{
	font-weight:bold;
	font-size:15px;
	line-height:120%;
	color:#666;
	display:block;
	transition:0.3s;
}

.call-email ul li a:hover{
	color:#999;
	border:1px solid #ffc527;
	background-color:#fdfdfd;
}

.call-email ul li a:hover strong{
	color:#222;
}

.call a{
	background:#fafafa url(../images/call-header.png) no-repeat 12px center;
}

.email a{
	background:#fafafa url(../images/email-header.png) no-repeat 12px center;
}

.social ul{
	padding-top:43px;
	text-align:right;
}

.social ul li{
	display:inline;
	margin-left:4px;
}

.social ul li a{
	background:#fff;
	border:1px solid #e5e2e2;
	display:inline-block;
	padding:6px 7px;
	font-size:0;
	line-height:100%;
	border-radius:4px;
	transition:0.3s;
}

.social ul li a:hover{
	border:1px solid #ffc527;
}



/* ----------------------------------------- nav */

.nav-for-mobile{
	display:none;
}

.nav-area{
	border-top:2px solid #ffc527;
}

nav ul{
	padding-top:28px;
	padding-bottom:26px;
}

nav ul li{
	display:inline;
	margin-right:50px;
	font-weight:700;
	font-size:15px;
	line-height:120%;
	text-transform:uppercase;
}

nav ul li a{
	color:#000;
	transition:0.3s;
}

nav ul li a:hover, nav ul li.active a{
	color:#ffc527;
}

/*#mobile-nav{
	display:none;
}*/

.nav-area aside{
	text-align:right;
}

.nav-area aside a{
	background:#fafafa url(../images/whatsapp.png) no-repeat 15px center;
	border:1px solid #e5e2e2;
	display:inline-block;
	padding:12px 15px 10px 45px;
	margin-top:14px;
	font-weight:500;
	font-size:15px;
	line-height:130%;
	color:#999;
	border-radius:4px;
	transition:0.3s;
}

.nav-area aside a span{
	color:#666;
}

.nav-area aside a:hover{
	background-color:#fdfdfd;
	border:1px solid #ffc527;
}

.nav-area aside a:hover span{
	color:#000;
}




/* ----------------------------------------- banner */

.banner-area{
	background:url(../images/banner.jpg) no-repeat top center;
	height:678px;
}

.banner{
	background:url(../images/banner-figures.png) no-repeat right bottom;
	height:678px;
}

.banner-area .container-fluid{
	padding-top:100px;
}

.banner-area ul{
	margin-bottom:40px;
}

.banner-area ul li{
	font-size:19px;
	line-height:130%;
	font-weight:normal;
	color:#fff;
	text-transform:uppercase;
	background:url(../images/bullet-banner.png) no-repeat left center;
	padding:0 0 0 22px;
	margin-bottom:12px;
}

.btn-orange{
	font-size:18px;
	line-height:120%;
	font-weight:600;
	color:#222;
	background:#ffc527;
	display:inline-block;
	padding:20px 45px 18px 45px;
	text-transform:uppercase;
	transition:0.3s;
}

.btn-orange:hover{
	color:#fff;
	background:#222;
	transform:scale(1.1);
}


/* ----------------------------------------- content */

.services-outer{
	background:#fff;
}

.services-area{
	background:url(../images/plumber-section1.png) no-repeat right bottom;
	padding-top:85px;
	padding-bottom:90px;
}

.services-area article{
	margin-bottom:52px;
}

.services-area article:last-child{
	margin-bottom:0;
}

.services-area article a img{
	transition:0.3s;
}

.services-area article a:hover img{
	transform:scale(1.1);
}

.services-area aside p{
	font-size:17px;
	line-height:130%;
	font-weight:500;
	color:#777;
	margin-bottom:12px;
}
	
.more{
	background:url(../images/more-arrow.png) no-repeat center right;
	font-size:16px;
	line-height:120%;
	font-weight:600;
	color:#333;
	padding:0 17px 1px 0;
	transition:0.3s;
}

.more:hover{
	color:#ffc527;
}

.quote-area form{
	background:#fff;
	padding:30px 35px 35px 35px;
	margin-top:220px;
	overflow:hidden;
	box-shadow: rgba(99, 99, 99, 0.4) 0px 2px 8px 0px;
}

.quote-area form input[type=text]{
	outline:none;
	width:100%;
	border:1px solid #bbb;
	border-radius:4px;
	font-size:15px;
	line-height:120%;
	font-weight:normal;
	color:#999;
	padding:4px 10px;
	height:40px;
	margin-bottom:14px;
	transition:0.2s;
}

.quote-area form input[type=text]:hover, .quote-area form input[type=text]:focus {
	border:1px solid #ffc527;
}

.quote-area form textarea{
	outline:none;
	width:100%;
	border:1px solid #bbb;
	border-radius:4px;
	font-size:15px;
	line-height:120%;
	font-weight:normal;
	color:#999;
	padding:10px;
	height:110px;
	margin-bottom:14px;
	transition:0.2s;
}

.quote-area form textarea:hover, .quote-area form textarea:focus {
	border:1px solid #ffc527;
}

.quote-area form input[type=submit]{
	float:right;
	outline:none;
	background:#ddd;
	border:none;
	font-size:15px;
	line-height:120%;
	font-weight:600;
	text-transform:uppercase;
	color:#555;
	padding:14px 20px 13px 20px;
	transition:0.2s;
}

.quote-area form input[type=submit]:hover{
	background:#ffc527;
}

.project-area{
	background:#f6f6f6;
	border-top:1px solid #ebebeb;
	padding:85px 0 95px 0;
}

.project-area figure img{
	display:block;
}

.project-area article{
	background:#fff;
	border-left:1px solid #ddd;
	border-right:1px solid #ddd;
	border-bottom:8px solid #ffc527;
	padding:25px 30px 30px 30px;
}

.project-area article p{
	font-size:17px;
	line-height:120%;
	font-weight:normal;
	color:#666;
}

.testi-area{
	background:url(../images/testimonial-bg.jpg) no-repeat top center;
	padding:85px 0 68px 0;
}

.carousel{
	padding-bottom:50px;
}

.caro-content{
	background:#fff url(../images/testi-content-bg.jpg) repeat-y 0 0;
	width:890px;
	height:345px;
	margin:0 auto;
	padding:40px 0 50px 0;
}

.caro-inside{
	background:url(../images/comma.png) no-repeat 15px top;
	padding:0 90px 0 110px;
}

.caro-inside article{
	overflow:hidden;
	padding-bottom:15px;
}

.caro-inside article figure{
	float:left;
	margin-right:14px;
}

.caro-inside article aside{
	float:left;
	padding:10px 0 0 0;
}

.caro-inside p{
	font-size:16px;
	line-height:150%;
	font-weight:normal;
	color:#444;
}

.caro-inside article aside p{
	font-size:15px;
	font-weight:600;
	color:#333;
}

.carousel-control-prev, .carousel-control-next{
	margin-top:-50px;
}

.team-area{
	background:#f6f6f6;
	text-align:center;
	padding:85px 0 95px 0;
}

.team-area figure img{
	display:block;
}

.team-area article{
	background:#eee;
	border-bottom:8px solid #ffc527;
	padding:25px 30px 20px 30px;
}

.team-area article p{
	font-size:15px;
	line-height:120%;
	font-weight:500;
	color:#666;
	margin-bottom:2px;
}

.team-area article p strong{
	font-size:17px;
	line-height:120%;
	font-weight:bold;
	color:#333;
}

.btn-black{
	font-size:18px;
	line-height:120%;
	font-weight:600;
	color:#fff;
	background:#252525;
	display:inline-block;
	padding:20px 45px 18px 45px;
	margin-top:65px;
	text-transform:uppercase;
	transition:0.3s;
}

.btn-black:hover{
	color:#fff;
	background:#252525;
	transform:scale(1.1);
}


/* ----------------------------------------- footer */

.footer-top{
	border-top:6px solid #ffc527;
	background:#353535;
	padding:32px 0;
}

.footer-top ul{
	text-align:center;
}

.footer-top ul li{
	display:inline;
	font-size:17px;
	line-height:120%;
	font-weight:500;
	color:#ccc;
}

.footer-top ul li em{
	font-style:normal;
	margin:0 10px;
}

.footer-top ul li a{
	color:#ccc;
}

.footer-top ul li a:hover{
	color:#ffc527;
}

footer{
	background:#0f0f0f;
}

footer section{
	background:url(../images/plumber-footer.png) no-repeat right bottom;
	padding:90px 0 75px 0;
}

footer p{
	font-size:14px;
	line-height:140%;
	font-weight:normal;
	color:#ccc;
	margin:0 0 27px 0;
}

.footer-left-list li{
	font-size:14px;
	line-height:130%;
	font-weight:normal;
	color:#ccc;
	margin:0 0 6px 0;
}

.footer-left-list li a{
	color:#ccc;
	display:block;
	height:35px;
	padding:9px 0 0 52px;
}

.footer-left-list li a:hover{
	text-decoration:underline;
}

.footer-address a{
	background:url(../images/footer-home.png) no-repeat left center;
}

.footer-ph a{
	background:url(../images/footer-ph.png) no-repeat left center;
}

.footer-email a{
	background:url(../images/footer-email.png) no-repeat left center;
}

.footer-services li{
	font-size:15px;
	line-height:140%;
	font-weight:normal;
	color:#ccc;
	margin:0 0 13px 0;
}

.footer-services li a{
	color:#ccc;
	background:url(../images/footer-arrow.png) no-repeat left center;
	display:block;
	padding:0 0 0 20px;
}

.footer-services li a:hover{
	text-decoration:underline;
}

.footer-bottom{
	background:#fff;
	padding:25px 0;
}

.footer-bottom article p{
	font-size:14px;
	line-height:140%;
	font-weight:normal;
	color:#333;
	padding:6px 0 0 0;
}

.footer-bottom .social ul{
	padding:0;
}

.footer-bottom .social ul li a{
	background:#fff;
	border:1px solid #bdbdbd;
}

.footer-bottom .social ul li a:hover{
	border:1px solid #ffc527;
}



/* ----------------------------------------------------------------------- inner pages */

