﻿@import url(effect.css);

@import url('https://fonts.googleapis.com/css2?family=Ms+Madi&family=Readex+Pro:wght@300;400;600;700&display=swap');
/* Fonts */

html { margin: 0; padding:0; overflow-x:hidden; width:100vw;}
body{
font-family: 'Readex Pro', sans-serif; font-weight:normal; padding:0; color:var(--dark); font-weight:normal; padding-right:0!important;
font-size:15px;
line-height:1.5;
 overflow-x:hidden;
}
/*	--------------------------------------------------
Global Reset & Standards
-------------------------------------------------- */

:root{--blue:#4ac5dc; --yellow:#e9df09; --dark:#374757; --gradient: linear-gradient(45deg, #068dc8 0%, #78bb43 50%, #068dc8 100%);}

img{border:0;}

*{ box-sizing:border-box;
}
*:hover{
}

a{color:var(--blue); text-decoration:none;
-webkit-transition:all .2s ease-in-out;
-moz-transition:all .2s ease-in-out;
-ms-transition:all .2s ease-in-out;
-o-transition:all .2s ease-in-out;
transition:all .2s ease-in-out;
}
a:hover{text-decoration:none; color:var(--yellow);}

h1, h2, h3, h4, h5{margin:0 0 15px; padding:0; font-weight:700;}


::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #666;
  opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #666;
}

::-ms-input-placeholder { /* Microsoft Edge */
  color: #666;
}


.fullArea{width:1280px; max-width:92%; margin:0 auto;}


/* Header */

.headerArea{display:block; position:relative; overflow:hidden; clear:both;background:var(--dark) /*url('../images/headerbg.jpg') no-repeat center bottom*/; background-size:100%; padding:10px 0; font-size:16px;}
.logo{display:block;}
.logo img{height:47px; max-width:100%;}
.headerArea span{ font-size:22px; color:#fff;}
.headerArea span a{color:var(--yellow);}

.dual-button-wrapper{position: relative; display: inline-block;}
.dual-button-wrapper a{
  display:block; width:100%;
  font-size: 16px;
  font-weight: 600;
  color:#fff;
  background-color: var(--blue);
  box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
  text-align: center;
  padding:10px 20px; margin:8px 0;
}
.dual-button-wrapper a i{font-size: 18px; margin-right:5px;}
.dual-button-wrapper a:hover{background: var(--yellow); color:var(--dark);}

.navArea{float:left; width:100%; clear:both; position:relative;background:var(--blue); margin-bottom:30px;}
.navArea.sticky{position:fixed; z-index:9999; top:0; left:0; right:0;}


.project-slider{position:relative; display:block; overflow:hidden; clear:both;}
.project-slider img{width:100%;}
.project-slider .carousel-indicators{bottom:auto; top:20px; right:30px; left:auto; margin-right:0; margin-left:0;}
.project-slider .carousel-indicators li{background:rgba(255,255,255,1); border:2px #fff solid; height:12px; width:12px; border-radius:50%; cursor:pointer; transition:all .2s ease-in-out;}
.project-slider .carousel-indicators li.active{background:var(--yellow); width:40px; border-radius:20px;}
.project-slider [class^="col-"]:last-child:before{ position:absolute; left:15px; right:15px; top:0; bottom:0;display:block;content:'';background:var(--yellow); z-index:-1;}
.project-slider div.formArea{padding:20px;}
/*.project-slider [class^="col-"] form .form-control{border:none; padding:10px; border-radius:0; background:#fff; display:block; overflow:hidden; height:auto;}
.project-slider [class^="col-"] form [class^="col-"]{padding:7px;}*/
.project-slider div.formArea .wpforms-submit{background:var(--blue)!important; color:#fff!important; width:100%; display:block!important; padding:13px!important; text-transform:uppercase!important; border-radius:0;}
.project-slider div.formArea .wpforms-submit:hover{background:var(--dark)!important;}
.project-slider div.formArea h3{margin-bottom:0px; padding:7px;}
.project-slider div.formArea span{margin-bottom:10px; padding:0 7px; display:block; overflow:hidden; font-family:'Ms Madi'; font-size:42px; line-height:1;}
.project-slider [class^="col-"]:first-child{position:relative;}
.project-slider [class^="col-"]:first-child h2{position:absolute; margin-bottom:0; bottom:0; left:15px; right:15px; z-index:5; display:block;text-align:center; background:var(--dark); color:#fff; font-weight:normal; font-style:italic; font-size:22px; padding:5px;}

div.wpforms-container-full .wpforms-form .wpforms-field {padding: 5px 0!important;}


.servicetype{display:block; padding:30px 0; text-align:center;}
.servicetype h2{border:2px var(--dark) solid; padding:10px 25px; display:inline-block; font-size:18px; border-radius:5px; margin-bottom:0;}
.servicetype img{margin-bottom:20px;}
.servicetype [class^="col-"]:hover h2{ background:var(--dark);color:#fff;}

.serviceArea{display:block; overflow:hidden; padding:0 0 60px;}
.serviceArea h3{display:block; overflow:hidden; padding:0 0 30px; margin-bottom:0; font-weight:700; font-size:28px;}
.serviceArea div.item h4{font-size:16px; letter-spacing:0; margin-bottom:5px;}
.serviceArea div.item > div{border:none; border-top:none; padding:20px 0 0; display: block; position: relative;}
.serviceArea div.item > div a{display: inline-block; padding: 8px 12px; font-size: 13px; width:100%; background: var(--blue); color: #fff;}
.serviceArea div.item > div a i{margin-right:5px;}
.serviceArea div.item:hover > div a{background: var(--yellow); color:var(--dark);}
.serviceArea div.item > div p{width:100%; margin:0 auto 10px; font-size:14px; min-height: 45px;}
.serviceArea div.item > div span{ display:block; clear:both;color:var(--blue);font-size:22px; font-weight:700; margin-bottom:15px;}

.owl-carousel .owl-nav button.owl-prev,.owl-carousel .owl-nav button.owl-next{ margin:0 30px; top:-80px; position:absolute; opacity:.7; z-index: 10;}
.owl-carousel .owl-nav button img{width:45px; height:45px;}
.owl-carousel .owl-nav button.owl-prev{left:auto; right: 20px;}
.owl-carousel .owl-nav button.owl-next{right:-30px;}
.owl-carousel .owl-nav button.owl-prev:hover,.owl-carousel .owl-nav button.owl-next:hover{background:none;opacity:1;}


.aboutArea{display:block; padding:60px 0; clear:both; background:var(--dark); text-align:center; color:#fff; background-size:cover; /*background-blend-mode:soft-light;*/ position:relative; z-index:10; overflow:hidden;}
.aboutArea h2{font-size:28px; font-weight:600; margin-bottom:35px; text-transform:uppercase;}

.aboutArea [class^="col-"] > div{border:2px #fff solid; border-radius:5px; padding:20px 10px;}
.aboutArea [class^="col-"] > div p{font-size:14px; margin-bottom:0; font-weight:300;}
.aboutArea h3{font-size:17px; margin-bottom:10px;}
.aboutArea a{display:inline-block; color:#fff; background: var(--dark); padding: 5px 18px; margin-top: 10px;}
.aboutArea a i{font-size:32px;}
.aboutArea a:hover{background:var(--orange);}
.aboutArea img{width:140px;}
.aboutArea [class^="col-"] > div:hover{background:var(--blue);}



.testimonialsArea{display:block; clear:both; overflow:hidden; padding:60px 0 30px; text-align:center;}
.testimonialsArea h2{font-size:36px; color:var(--blue); margin-bottom:30px;}
.testimonialsArea span, .testimonialsListing span{width:170px; height:34px; display:block; margin:0 auto 15px; background:transparent url('../images/stars.png') no-repeat left top;}
.testimonialsArea span.star-4, .testimonialsListing span.star-4{background-position:left top -34px;}
.testimonialsArea span.star-3, .testimonialsListing span.star-3{background-position:left top -68px;}
.testimonialsArea span.star-2, .testimonialsListing span.star-2{background-position:left top -102px;}
.testimonialsArea span.star-1, .testimonialsListing span.star-1{background-position:left top -136px;}
.testimonialsArea h4{font-size:15px; margin-bottom:4px;}


.quickCallArea{text-align:center; padding:60px 0; background:#000 url('../images/aboutbg.jpg') no-repeat center center fixed; background-size:cover; color:#fff; font-size:26px;}
.quickCallArea h3{font-size:42px; font-weight:700; text-transform:uppercase; margin-bottom:10px;}
.quickCallArea h4{margin-bottom:30px; color:var(--yellow); border-bottom:2px var(--yellow) solid; display:inline-block; padding:0 0 8px;}
.quickCallArea a{color:#fff;}
.quickCallArea a:hover{color:var(--yellow);}
.quickCallArea span{display:block; overflow:hidden; clear:both; margin-bottom:0px;}
.quickCallArea span i{color:var(--yellow); font-size:22px; margin:0 5px 0 30px;}
.quickCallArea > div > a{display:inline-block; clear:both; font-size:20px; text-transform:uppercase; font-weight:700;}
.quickCallArea ul{margin-bottom:0;}
.quickCallArea ul a{border:2px #fff solid; text-align:center; width:80px; height:80px; display:block; line-height:75px; border-radius:10px;}
.quickCallArea ul a:hover{background:#fff; color:var(--yellow);}


.footer{background:var(--dark) repeat url('../images/footerBg.jpg') fixed center center; background-blend-mode:soft-light; display:block; padding:40px 0 30px; color:#fff; font-size:14px;}
.footer a{color:#fff;}
.footer a:hover{color:var(--blue);}
.footer h4{font-size:20px; font-weight:600;}
.footer .service-link{display:block; overflow:hidden; padding:10px 0; margin:15px 0 10px; text-align:center; list-style-type:none; border:1px var(--blue) solid; border-left:0; border-right:0;}
.footer .service-link li{display:inline-block; margin:7px 12px;}
.footer-end a{margin:0 5px;}
.footer .row ul{display:block; list-style-type:none; margin:0; padding:0;}
.footer .row ul li{display:inline-block; font-size:19px; text-align:center;}
.footer .row ul li a{display:block; overflow:hidden; border-radius:50%; background:#fff; width:35px; height:35px; line-height:36px; text-align:center; color:#222;}
.footer .row ul li a:hover{ background:var(--blue); color:#fff;}

.get-a-quote{background:#fff; padding:20px; color:#5c5c5c; top:-70px; margin-bottom:-40px; position:relative;}
.get-a-quote h5{margin:0; padding:0; line-height:1.3; font-size:18px; font-weight:700;}
.get-a-quote a{padding:12px 25px; font-size:14px; font-weight:700; background:var(--blue); border:none;}
.get-a-quote a:hover{background:#000; color:#fff;}


#scroll-icon {
    position:fixed;
    right:10px;
    bottom:60px;
    cursor:pointer;
    width:35px;
    height:35px;
    text-indent:-9999px;
    display:none;
    z-index:99999;
}
#scroll-icon span {
	position:absolute; left:0; top:0;
    height:35px;
    width:35px;
    background:transparent url('../images/arrowup.png') no-repeat center center;
}
#scroll-icon:hover {
    opacity:1;
    filter:"alpha(opacity=100)";
    -ms-filter:"alpha(opacity=100)";
}
#scroll-icon:hover span{ background-image:url('../images/arrowupsolid.png');}


.footerFloatBtn{position:fixed; bottom:0; left:0; right:0; z-index:999; border-top:1px #666 solid; display:none; z-index:999;}
.footerFloatBtn a{width:50%; float:left; padding:5px 8px; background:var(--blue); color:#fff; text-align:center; font-weight:600; text-transform:uppercase;}
.footerFloatBtn a:last-child{background:var(--blue);}
.footerFloatBtn a:hover{background:var(--dark);}


/* --- Inner Page --- */
.navArea + .servicetype{background:var(--yellow);}
.navArea + .servicetype a h2{display:block; color:var(--dark);}

.innerpage{display:block;padding:60px 0 30px; overflow:hidden;clear:both;}
.innerpage h2{font-size:18px; color:var(--dark); margin:15px 0; padding:10px; background:var(--yellow);}
.innerpage h2 i{margin-right:10px;}
.innerpage h3{font-size: 24px; color: var(--blue); padding-top: 10px;}
.innerpage h4{font-size: 20px;}

.menuListing > [class^="col-"]{margin-bottom:30px;}
.menuListing > [class^="col-"] h4{font-size: 18px;}
.menuListing > [class^="col-"] > div img{width:100%;}
.menuListing > [class^="col-"] > div > div{border:none; border-top:none; padding:20px 0 0; display: block; position: relative;}
.menuListing > [class^="col-"] > div > div a{display: inline-block; padding: 8px 12px; font-size: 13px; width:100%; background: var(--blue); color: #fff;}
.menuListing > [class^="col-"] > div > div a i{margin-right:5px;}
.menuListing > [class^="col-"] > div:hover > div a{background: var(--yellow); color:var(--dark);}
.menuListing > [class^="col-"] > div > div p{width:100%; margin:0 auto 0; font-size:14px; min-height: 20px;}
.menuListing > [class^="col-"] > div > div big{ display:block; clear:both;color:var(--blue);font-size:22px; font-weight:700; margin-bottom:15px;}


.quickCallArea .wpforms-submit, .checkout-button, .wp-element-button{background:var(--blue)!important; color:#fff!important; width:100%!important; display:block!important; padding:13px; text-transform:uppercase!important; border-radius:0!important; border: none!important; font-size: 17px!important; text-align: center;}
.quickCallArea .wpforms-submit:hover, .checkout-button:hover, .wp-element-button:hover{background:var(--dark)!important;}
.quickCallArea .wpforms-field-large{margin-bottom: 10px!important;}

.coupon{display: none!important;}


.checkout-button, button#place_order{background:var(--blue)!important; color: #fff!important; border:none!important; width: 100%; padding: 15px!important; text-align: center;}
.woocommerce-cart-form .product-thumbnail img{ width: 80px!important;}
.woocommerce-cart-form .product-name a{font-weight: 600!important; color: #222!important;}

#customer_details .col-1, #customer_details .col-2{width: 100%!important; max-width: 100%!important; margin-bottom:15px!important; padding: 0!important;}
.woocommerce form .form-row label{ width:100%; display:block;}
.woocommerce-input-wrapper{ display:block!important; overflow:hidden!important; clear:both!important; width:100%!important;}
.woocommerce-input-wrapper input, .woocommerce-input-wrapper select, .woocommerce-input-wrapper textarea{ padding:10px!important; display:block!important; width:100%!important;}
.woocommerce-privacy-policy-link{color:#000; text-decoration:underline;}

.cart_totals #ppcp-messages, .cart_totals #ppc-button-ppcp-gateway, .woocommerce-checkout .paypal-button-row.paypal-button-color-black{display:none!important;}
.paypal-button-row.paypal-button-number-1.paypal-button-layout-vertical .paypal-button-shape-rect.paypal-button-number-multiple.paypal-button-env-production.paypal-button-color-black{display:none!important;}

.woocommerce-billing-fields{color: #000!important;}
.woocommerce-billing-fields label{text-align: left!important; color: #000!important;}
.woocommerce-billing-fields:before{display: none!important;}
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea{border: 1px #ccc solid!important;}

.select2-container .select2-selection--single{ margin-bottom:0!important;}

.testimonialsListing [class^="col-"]{ margin-bottom: 30px;}
.testimonialsListing [class^="col-"] > div{background:#fff; padding:20px; border-radius:20px; display:block; color:#444; border:1px var(--blue) solid;}
.testimonialsListing [class^="col-"] > div:hover{background: var(--dark);color: #fff;}
.testimonialsListing i{font-size:25px; float:right; display:block; color:var(--blue); position:relative; top:0px; margin-bottom:-10px; right:-10px;}
.testimonialsListing p{display:block; clear:both; overflow:hidden; line-height:1.6; font-size: 14px;}
.testimonialsListing span{float: left;}
.testimonialsListing h6{font-weight: 700;}


.icon-box{position:relative; padding-left:40px; color:#0a3041;}
.icon-box h4{display:block; position:relative; margin-bottom:20px; font-size:22px; margin-top:30px; color:#0a3041;}
.icon-box h4 i{position:absolute; left:-35px; top:4px; color: var(--blue);}
.icon-box h4:first-child{margin-top:0;}
.icon-box p{margin-bottom:5px; text-align:left;}
.icon-box ul{display:block; margin-left:0!important;}
.icon-box ul li{margin:0 8px; display:inline-block; font-size:20px;}
.icon-box a{color:#0a3041;}
.icon-box a:hover{color:#25d06f;}

.mapArea{display: block; overflow: hidden; border: 1px #ddd solid; padding: 8px;}


/*------------------------------------*\
    Media Queries
\*------------------------------------*/

@media (max-width: 1280px){
}

@media (max-width: 991px){
.headerArea{ text-align:left; padding:60px 0 0; width:100%; position:relative;}
.headerArea span{font-size:16px;}
.logo{padding:0 0 12px;}
.logo img{width:80%; height:auto;}
.headerArea [class^="col-"]:nth-child(2){display:none;}


.dual-button-wrapper{position:fixed; top:0; left:0;width:100%; padding:5px; text-align:left; background:var(--dark); z-index:999;}
.dual-button-wrapper a{width:44%; margin:0 3%; font-size: 14px; padding:10px; float:left;}
.dual-button-wrapper span{ width: 25px; height: 25px;font-size: 12px; line-height: 25px; left:165px;}

.heighlighArea .row:nth-child(even) [class^="col-"]:nth-child(odd), .heighlighArea .row:nth-child(even) [class^="col-"]:nth-child(even){ position:static;}
.heighlighArea .row [class^="col-"]:first-child(){margin-bottom:25px;}
.heighlighArea h3{font-size:24px;}

.project-slider .sliderContainer{position:static; transform:translate(0%,0%); clear:both; width:100%; font-size:15px; text-align:center; outline:none; border:none; background:var(--dark); padding: 15px 0;}
.project-slider .sliderContainer h2{font-size: 20px;}
.project-slider .sliderContainer p{font-size: 15px; margin-bottom: 0;}

.project-slider [class^="col-"]:last-child::before {left: 15px; right: 15px;}
.project-slider [class^="col-"] form {padding: 15px;}
}

@media (max-width: 767px){

.project-slider .formArea{position:static;  transform: translate(0%,0%); width: 100%;}
.project-slider [class^="carousel-control-"]{font-size:20px;top: 40%; height: 40px; width: 40px;}
.project-slider [class^="carousel-control-"]:last-child{right:20px; left: auto;}

.servicetype{padding:0 0 30px;}
.servicetype [class^="col-"]{margin-bottom:30px;}

.aboutArea{padding-bottom:30px;}
.aboutArea [class^="col-"]{margin-bottom:30px;}

.quickCallArea{padding:60px 0;font-size:20px;}
.quickCallArea h3{font-size:24px;}
	
.serviceArea h3, .aboutArea h2{font-size:24px; text-align:center;}

.formArea label.half{width:100%; display:block; margin-right:0;}


.heighlighArea:after{position:static; left:0; height:300px; margin-top:50px;}

.navArea.sticky{height:0; position:static;}

.footer [class^="col-"]{text-align:center; margin-bottom:10px;}
.footer h4{text-align:center;}
.footer .w-50{width:auto!important}
.footer .service-link li{display:block; clear:both; overflow:hidden;}
.footer .text-sm-right{font-size:11px; margin-top:15px;}
}

@media (max-width: 500px){
.quickCallArea span > a{clear:both; display:block;}

.menuListing > [class^="col-"] h4{font-size: 14px;}
.menuListing > [class^="col-"] > div > div p{min-height:auto;}

}

@media (max-width: 360px){
}


@media screen and (max-width: 1920px) and (min-width: 1240px){
}

@media screen and (-webkit-min-device-pixel-ratio:0)
and (min-resolution:.001dpcm) {
.collectionArea .fullArea:before{display:none; opacity:0;}
}
