﻿@import url(effect.css);

/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Forum&family=Inter:wght@400;600&display=swap');
/* Fonts */

html { margin: 0; padding:0; overflow-x:hidden;}
body{
font-family: 'Inter', sans-serif; font-weight:normal; padding:0; color:#222; font-weight:400; padding-right:0!important;
font-size:15px;
line-height:1.4;
}

/*	--------------------------------------------------
Global Reset & Standards
-------------------------------------------------- */

img{border:0;}

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

a{color:var(--brown); 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(--orange);}

h1, h2, h3, h4, h5{margin:0 0 15px; padding:0; font-weight:normal; font-family:'Forum';}

:root{--brown:#490000;--orange:#f37021; --dark:#111;}

@keyframes wiggle {
0%{transform:rotate(0deg);}
80%{transform:rotate(0deg);}
85%{transform:rotate(5deg);}
95%{transform:rotate(-5deg);}
100%{transform:rotate(0deg);}
}


.container{width:1170px; max-width:95%;}


/* Header */
.header-area{position:absolute; left:0; right:0; top:0; z-index:100; padding:15px;}

#myHeader{margin:0; position:relative; z-index:100; float:left; width:calc(100% - 120px); clear:both; z-index:9999; margin-top:1px; border-bottom:2px var(--orange) solid; border-top:2px var(--orange) solid;}
.logo img{height:90px; transition:all .2s ease-in-out; padding:10px 0;}
#myHeader.sticky{background:var(--brown); position:fixed; left:0; right:0; top:0; margin-top:0; padding:10px; width:100%;}
#myHeader.sticky .logo img{height:80px;}

.callBox{ position:relative; padding-left:50px; color:#fff;}
.callBox i{position:absolute; left:0; font-size:42px; color:var(--orange);}
.callBox a{display:block; font-size:18px; font-weight:700; margin-bottom:0; line-height:1.1; color:#fff;}

.topBox{padding-bottom:10px; color:#fff; width:calc(100% - 100px);}
.topBox i{color:var(--orange);}
.topBox ul{ margin:0; padding:0; list-style-type:none;}
.topBox ul li{display:inline-block;}
.topBox ul li a{font-size:18px; padding:0 5px; color:var(--orange);}


.project-slider{position:relative; display:block; width:100%; overflow:hidden; min-height:100vh; background:#666;}
.project-slider:after{position:absolute; right:0; top:0; bottom:0; content:''; display:block; width:100px; background:#fff; transition:all .2s ease-in-out;}
.project-slider:before{position:absolute; right:45px; top:30%; bottom:25%; content:''; display:block; width:1px; background:var(--brown); z-index:5;}

.project-slider video{mix-blend-mode:overlay}
.project-slider .sliderContent{position:absolute; width:60%; left:50%; bottom:10%; transform:translate(-50%,0%); z-index:5; color:#fff; text-align:center;}
.project-slider .sliderContent h2{font-weight:600; font-size:42px; margin-bottom:15px; text-shadow: 0 0 8px #000000;}
.project-slider .sliderContent p{ font-size:18px; margin-bottom:50px;}
.project-slider .sliderContent ul{list-style-type:none; margin:0; padding:0;}
.project-slider .sliderContent ul li{display:inline-block; width:30%;}
.project-slider .sliderContent ul li a{color:#fff;}
.project-slider .sliderContent ul li img{background:var(--brown); border-radius:50%; padding:15px; width:150px; border:2px #fff solid; margin-bottom:10px;}
.project-slider .sliderContent ul li h3{font-size:15px; font-weight:600;}
.project-slider .sliderContent ul li:hover img{background:var(--dark);}
.project-slider > a{display:block;overflow:hidden; color:var(--brown); position:absolute; right:-8px; bottom:60px; z-index:100; rotate: -90deg; font-family:'Forum'; font-size:24px;}
.project-slider > a:hover{color:var(--orange);}



/* ============================================================
  DEMO 4 - FULL SCREEN BACKGROUND VIDEO
============================================================ */
#cmn-video-demo4__video2 {
  position:absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  max-width: 105%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  /*-webkit-filter: grayscale(100%); filter: grayscale(100%);*/
}


.welcomeArea{display:block; overflow:hidden; padding:60px 0; text-align:center; color:#222; margin:0 15px; position:relative;}
.welcomeArea h2{ font-size:36px; font-weight:500;}
.welcomeArea h2 span{color:var(--dark); display:inline-block; overflow:hidden; background:var(--orange); font-size:16px; padding:5px 10px;}
.welcomeArea h2 strong, .welcomeArea [class^="col-"]:last-child h3 strong{font-weight:600; color:var(--brown);}
.welcomeArea p{text-align:center; margin:0 auto 25px; font-size:16px; line-height:1.4;}
.welcomeArea a{display:inline-block; padding:10px 10px; width:160px; border:3px var(--orange) solid; background:var(--orange); color:#fff;}
.welcomeArea a:hover{background:var(--brown);}
.welcomeArea .form-control{ font-size:12px; padding:10px; border-radius:0; margin-bottom:25px;}
.welcomeArea .btn{background:var(--dark); color:#fff; display:block; width:100%; border-radius:0; font-weight:600;}
.welcomeArea [class^="col-"] > div{display:block; width:360px; margin:0 auto 50px; border:2px var(--orange) solid; padding:40px;}
.welcomeArea [class^="col-"] > div h2{display:block; margin:0;font-size:30px;}
.welcomeArea [class^="col-"] > div img{width:100%; margin:20px 0;}


.quickContactArea{text-align:center; margin-bottom:50px;}
.quickContactArea .row [class^="col-"]{margin-bottom:30px;}
.quickContactArea [class^="col-"] a{ display:block; overflow:hidden; padding:12px; border:3px var(--brown) solid; text-align:center; border-radius:10px; font-size:20px; font-weight:600;}
.quickContactArea [class^="col-"] a i{margin-right:10px;}
.quickContactArea [class^="col-"] a:hover{background:var(--orange); color:#fff;}
.quickContactArea h4{font-size:42px; font-weight:700; color:var(--dark); animation: wiggle 1.5s infinite; display:inline-block;}


.flip{transform: scaleX(-1);}
.serviceArea{text-align:center; display:block; overflow:hidden; padding:80px 0 50px; position:relative; background:#999 url('../images/servicesBg.jpg') no-repeat fixed; background-size:cover; background-blend-mode:multiply;}
.serviceArea h2{ font-weight:700; text-transform:uppercase; margin-bottom:15px; color:#fff;}
.serviceArea h2 img{max-width:120px;}

.serviceArea ul{margin:0; padding:0; list-style-type:none;}
.serviceArea ul li{display:block; text-align:center;}
.serviceArea ul li a{display:inline-block; width:60px; height:60px; text-align:center;color:#222; background:#fff; line-height:60px; font-size:22px; margin-bottom:15px; border-radius:50%;}
.serviceArea ul li a:hover{background:var(--orange); color:#fff;}
.serviceArea > div > .row > [class^="col-"]{ position:relative; z-index:1; margin-bottom:30px; color:#fff;}
.serviceArea > div > .row > [class^="col-"]:before{background:rgba(0,0,0,0.5); backdrop-filter: saturate(180%) blur(10px); border:1px rgba(255,255,255,0.2) solid; position:absolute; left:15px; right:15px; top:0; bottom:0;content:''; display:block; z-index:-1;}

.serviceArea > div > a{font-size:22px; text-decoration:underline; font-weight:700; color:#fff; animation: wiggle 1.5s infinite; display:inline-block;}
.serviceArea > div > a:hover{color:var(--orange);}

.serviceArea > div > .row > [class^="col-"] > div{padding:40px 40px 10px; display:block;}
.serviceArea .row .row a{position:relative; display:block; overflow:hidden; border:2px #fff solid;}
.serviceArea .row .row img{width:100%;}
.serviceArea .row .row a h3{text-transform:uppercase;font-size:17px; line-height:30px; color:#fff; position:absolute;left:0; bottom:0; top:auto; right:0; margin:0; padding:5px; background:rgba(0,0,0,0.8); display:block; transition:0.5s ease-in-out;}
.serviceArea .row .row a:hover h3{top:0; line-height:150px; font-weight:600;}
.serviceArea .row .row [class^="col-"]{margin-bottom:30px;}


.videoArea{display:block; padding:60px 0 90px; text-align:center; background:transparent url('../images/testimonials.jpg') no-repeat center center; background-size:cover;}
.videoArea h3{margin-bottom:20px; line-height:1.5; font-weight:700; font-size:36px;}
.videoArea .container{width:750px; max-width:95%;}

.videoArea .carousel-inner{width:800px; max-width:100%; margin:0 auto; padding:30px 20px; position:relative; display:inline-block;}
.videoArea .carousel-inner:before{content:''; display:block; left:0; right:0; top:0; bottom:0; border:2px var(--brown) solid; position:absolute;}
.videoArea .carousel-item{position:relative; z-index:8; padding:10px 0 0;}
.videoArea .carousel-item:before{background:#fff; top:0; bottom:0px; left:-43px; right:-43px; width:calc(100% + 86px); position:absolute; z-index:-1; display:block;content:'';}
.videoArea .carousel-item h5{color:var(--orange);}
.videoArea .carousel-indicators{bottom:-50px;}
.videoArea .carousel-indicators li{background:var(--brown); width:12px; height:12px; border:0; border-radius:50%;}


.card{border:none; border-radius:0; text-align:left; background:none;}
.card-header{ border-radius:0; border:none; background:none; margin:0; padding:0;}
.card-header > a{ position:relative; display:block; background:var(--dark); color:#fff; padding:14px 20px;}
.card-header > a.collapsed{ background:transparent!important; color:#222;}
.card-header > a:after {
	position:absolute; right:20px; top:10px;
    font-family: 'Font Awesome 5 Free';
    content:'\f107';
    font-weight:600;
    width:15px; height:30px;
    transform: rotate(180deg); 
}
.card-header > a.collapsed:after {transform: rotate(0deg); color:var(--brown)}
.card-header h5{font-size:17px;}
.card-body{padding:15px 20px; background:var(--orange); color:var(--dark);}
.card-body a, .card-header h5 span{color:var(--brown);}

.videoArea > div > a{display:inline-block; padding:12px 30px; background:var(--brown);color:#fff;font-size:20px;}



.map-container{
  overflow:hidden;
  padding-bottom:38.25%;
  position:relative;
  height:0;
  border:1px #ddd solid;
}
.map-container iframe{
  left:0;
  top:0;
  height:100%;
  width:100%;
  position:absolute;
}

.formBox{position:relative; display:block; text-align:left; padding:20px 40px;}
.formBox:before{background:var(--brown); display:block; content:''; position:absolute; left:0; right:0; top:0; bottom:-150px; z-index:-1;}
.formBox h4{color:#fff;}
.formBox input, .formBox textarea, .formBox select{width:100%; margin-bottom:15px; padding:15px; border:none; background:#fff;}
.formBox input[type="submit"]{background:var(--dark); border:2px var(--dark) solid; color:#fff; text-transform:uppercase;font-weight:700; font-size:17px;}
.formBox input[type="submit"]:hover{ background:#fff; color:var(--dark);}


.footerArea{background:var(--dark) no-repeat fixed url('../images/footerbg.jpg'); background-size:cover; background-blend-mode:soft-light; display:block; color:#fff; position:relative;}
.footerArea:before{position:absolute; right:0; top:0;bottom:0; left:50%; background:#111;content:'';display:block;}
.footerArea strong{/*display:block;*/ overflow:hidden;/* text-transform:uppercase;*/ color:var(--orange); font-size:14px;letter-spacing:1px; margin-bottom:10px;}
.footerArea p, .footerArea a{display:block; overflow:hidden; font-size:15px; margin:0 0 10px!important; color:#fff; line-height:1.8;}
.footerArea a.btnStyle{padding:10px 25px; display:inline-block; clear:both; background:var(--orange); font-weight:600; text-transform:uppercase; text-align:center;}
.footerArea [class^="col-"] > div{display:block; overflow:hidden; padding:50px;}
.footerArea .address p{display:block; overflow:hidden; font-size:15px; margin:0 0 10px!important; color:#fff; line-height:1.8;}
.footerArea .address a{display:inline; overflow:hidden; font-size:15px; margin:0 0 10px!important; color:#fff; line-height:1.8;}
.footerArea .address strong{margin:0 0 10px!important;}
.footerArea h3{margin:0!important; color:var(--orange);}

ul.social-links{margin:0; padding:0; list-style-type:none; display:block; overflow:hidden; clear:both;}
ul.social-links li{display:inline-block; margin-right:5px;}
ul.social-links li a{text-align:center; color:#fff; display:block; border:1px #fff solid; width:40px; height:40px; text-align:center; border-radius:50%;}
ul.social-links li a i{font-size:18px; line-height:40px;}
ul.social-links li a:hover{background:var(--dark); color:#fff;}

.footerBottom{background:var(--brown); padding:15px; display:block; font-size:13px; position:relative; color:#fff;}
.footerBottom ul{ float:right; margin:0; padding:0; list-style-type:none;}
.footerBottom ul li{ display:inline-block;}
.footerBottom ul li a{ display:block; padding:0 8px; color:#fff; border-left:1px var(--brown) solid; line-height:1;}
.footerBottom ul li:first-child a{border:none;}
.footerBottom ul li a:hover{color:var(--orange);}

.downloadMenu{position: absolute; right: 15px; padding: 6px 15px; background: var(--orange); color: #fff; font-weight: 600;}
.downloadMenu:hover{background:var(--brown); color:#fff;}


#scroll-icon {
    position:fixed;
    right:10px;
    bottom:10px;
    cursor:pointer;
    width:30px;
    height:30px;
    background-color:var(--orange);
    text-indent:-9999px;
    display:none;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
    z-index:99999;
}
#scroll-icon span {
    position:absolute;
    top:50%;
    left:50%;
    margin-left:-8px;
    margin-top:-12px;
    height:0;
    width:0;
    border:7px solid transparent;
    border-bottom-color:#ffffff
}
#scroll-icon:hover {
    background-color:var(--brown);
    opacity:1;
    filter:"alpha(opacity=100)";
    -ms-filter:"alpha(opacity=100)";
}



.innerBanner{display: block; overflow: hidden; clear: both; padding: 200px 0 50px; background: var(--dark); color: #fff; text-align: center; background-size:cover; background-blend-mode: soft-light;}
.innerBanner:after{position:absolute; right:0; top:0; bottom:0; content:''; display:block; width:100px; background:#fff; transition:all .2s ease-in-out;}

.innerArea{padding: 60px 0; float: left; width: 100%; clear: both; position: relative; background: #fff;z-index: 1;}



.sideBar{
  position: sticky!important;
  position: -webkit-sticky!important;
  background: #fff;
  top: 100px;
  display: block;
  box-shadow: 0 0 3px rgba(0,0,0,0.5);
  padding: 10px 15px 5px;
  margin-bottom: 30px;
  z-index: 10;
  overflow-x: auto;
  white-space: nowrap;
}
.sideBar > ul{display: block; margin: 0; padding: 0; list-style-type: none; text-align: center;}
.sideBar > ul li{display:inline-block; padding:0; margin: 0 12px; text-transform: uppercase; font-size: 14px;}
.sideBar > ul li a{display: block; overflow: hidden; padding: 8px 0; color: #444; border-bottom: 2px transparent dotted;}
.sideBar > ul li a i{margin-right: 3px; display: none;}
.sideBar > ul li a:hover, .sideBar > ul li a:focus, .sideBar > ul li a:active{border-bottom-color: var(--orange);font-weight: 600;}

.menuListingArea h2{font-size: 28px; display: block;margin-bottom: 20px; border-bottom: 1px #ddd solid; padding: 0 0 8px;}
.menuListingArea h2 + .row{margin-bottom: 40px;}
.menuListingArea h3{font-size: 18px; margin-bottom: 5px; font-weight: 600;color: var(--orange);}
.menuListingArea p{margin-bottom: 8px; font-size: 11px;}
.menuListingArea .col-sm-6 > div{display: block; padding: 8px; margin-bottom: 15px; border: 1px #eee solid;}
.menuListingArea .col-sm-6 > div:hover{border-color:var(--orange);}


.testimonialsBox{display: block; overflow: hidden; background:#fff url("../images/quote.png") no-repeat left 12px top 20px; padding: 20px 15px 10px 55px; border: 1px #ddd solid; border-left: 1px var(--brown) solid; margin-bottom: 30px;}
.testimonialsBox h5{font-weight: 600; color: var(--orange);}


.contactArea{ margin:0 auto 20px; width:800px; max-width:100%; font-size:17px;}
.contactArea h3{ font-size:20px; margin-bottom:5px; text-transform:uppercase; color:var(--dark);}
.contactArea a{ margin-bottom:10px; /*display:block;*/ color:#222; font-size:24px;}
.contactArea a:hover{color:var(--orange);}
.contactArea .col-12{border-bottom: 2px var(--orange) solid; margin-bottom: 20px;}
.contactArea img{width:70px;}
.contactArea .col-sm-6 a{display: inline-block; padding: 5px;}
.contactArea p{line-height:1.3;}

.contactformArea{display: block; overflow: hidden; padding: 60px 0; clear: both; width: 100%;
background: rgb(255,255,255);
background: linear-gradient(0deg, rgba(255,255,255,1) 0%, #ddd 100%); 
}
.contactformArea > div{width:800px; margin: 0 auto; max-width: 100%;}
.contactformArea h2{margin-bottom: 25px; text-align: center;}

form .form-control{ border-radius:0; padding:7px 12px; border:1px var(--brown) solid; margin-bottom:15px;}
.form-control::placeholder {color: var(--orange);}
.form-control:focus::placeholder {color: transparent;}
div.wpforms-container-full .wpforms-form textarea.wpforms-field-large{height:130px!important;}
div.wpforms-container-full .wpforms-form button[type="submit"]{margin:0; float:right; border: none!important; width: 100%; background: var(--orange)!important; color: #fff!important;}
div.wpforms-container-full .wpforms-form button[type="submit"]:hover{background: var(--brown)!important; color: var(--orange)!important;}

.contactArea form span + br{ display:none!important}

.projectGallery a{display: block; overflow: hidden; padding: 10px; border: 1px #ddd solid;}



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

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


@media (max-width: 991px){
.topBox{display:none;}
.logo{display:block; overflow:hidden; text-align:center;}
.logo img{height:100px; margin-bottom:10px; max-width:100%; transition:.5s ease-in-out;}
.header-area{margin:0; padding:10px; border-bottom:2px var(--orange) solid;}
#myHeader{border:none;}
#myHeader.sticky{position:absolute; border-bottom:2px var(--orange) solid;}

#myHeader, .topBox{width:100%;}
.project-slider:after, .project-slider:before, .project-slider > a:hover, .innerBanner:after{display:none;}



#main-nav{ background:var(--brown);}

.footerArea:before{top:50%; left:0%; }
.footerArea [class^="col-"] > div{display:block; overflow:hidden; padding:50px 30px;}

.bannerContent{display:none;}

.serviceArea h2{margin-top:20px;}
.serviceArea ul li{display:inline-block; margin:10px 5px;}

}

@media (max-width: 767px){
	
.sideBar {top:0;}

.project-slider video{max-width:300%!important; height:100%;}
.project-slider .sliderContent{width:90%;}
.project-slider .sliderContent h2{font-size:25px;}
.project-slider .sliderContent ul{display:none;}
.project-slider > a{display:none;}

.welcomeArea{padding:30px 0;}
.welcomeArea [class^="col-"] > div{width:100%;}
.welcomeArea .col-md-6{margin-bottom:30px;}
.welcomeArea [class^="col-"]:last-child, .welcomeArea [class^="col-"]:last-child p{text-align:left;}
.welcomeArea .form-control{margin-bottom:15px;}


.serviceArea h2 img{ display:none;}
.serviceArea [class^="col-"] > div h4{font-size:22px;}
.serviceArea .row{margin-bottom:20px;}
.serviceArea .row:last-child{margin-bottom:0;}

.parallax-area{padding:0;}
.parallax-area:before{left:0; right:0%; top:0; bottom:50%;}
.parallax-area [class^="col-"] > div{padding:0; text-align:center; padding:40px 0;}
.parallax-area:after{height:50px; width:3px; background: linear-gradient(180deg, rgba(255,255,255,1) 50%, rgba(0,0,0,1) 50%);}

.bookOnline24X7 p{font-size:16px;}
.bookOnline24X7 p br{display:none;}
.bookOnline24X7 h4{font-size:24px;}



.priceEstimatorForm > div > span{padding-top:10px; display:block;}

.headerCall > ul{display:none;}
.headerCall .mobileCallArea{display:block; margin-bottom:0px; border-top:2px var(--brown) solid; width:100%; text-align:left;}
.headerCall .mobileCallArea li{ width:auto; margin-right:15px;}

.videoArea h3{font-size:24px;}
.videoArea [class^="col-"]{padding:0!important;}
.formBox:before{background:var(--dark);}
.formBox input[type="submit"]{background:var(--brown);}

.footerArea [class^="col-"]{text-align:center;}

.footerBottom{text-align:center;}
.footerBottom ul{ text-align:center; display:block; float:none; padding-top:10px;}
.contactformArea{ padding: 30px 15px;}
.contactArea a {font-size:18px!important;}

}

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

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


