@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Mulish:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;1,200;1,300;1,400;1,500;1,600;1,700&amp;family=STIX+Two+Math&amp;display=swap');
@import url('https://fonts.googleapis.com/css2?family=Questrial&amp;display=swap');
/*
font-family: 'Mulish', sans-serif;
font-family: 'STIX Two Math', serif;
font-family: 'Questrial', sans-serif;
*/

:root{
    --thm-darkgrey:#1d1d1d;
    --thm-black:#000000;
    --thm-white:#ffffff;
    --thm-logo-bg:#01071b;    
    --thm-sitetext:'Mulish', sans-serif;
    --thm-headingtext:'Questrial', sans-serif;
    --thm-lightgrey: #d5d5d5;
    --thm-grey: #f9f9f9;
    --thm-yellow: #ddbd4f;

}


body{font-family: var(--thm-sitetext); margin:0px; padding:0px; font-size:18px; color:#000000;}
h1, h2, h3, h4, h5{ font-family: var(--thm-headingtext);}
p{ line-height:30px; font-size:18px;}
.pos-rel{ position: relative; }

/* background setup */
.background { background-repeat:no-repeat;  /* custom background-position */ background-position:50% 50%; /* ie8- graceful degradation */
    background-position:50% 50%\9 !important;}
/* fullscreen setup */
html, body {/* give this to all tags from html to .fullscreen */height:100%;}
.fullscreen, .content-a {width:100%; height:100%; overflow:hidden;}
.fullscreen.overflow, .fullscreen.overflow .content-a {height:auto; min-height:100%;}
.bgColorShade1 {background-color:rgba(0,0,0,0.7);}
.bgColorShade2 {background-color:rgba(0,0,0,0.7);}
.bgColorShade3 {background-color:rgba(0,0,0,0.7);}
/* content centering styles */
.content-a {display:table;}
.content-b {display:table-cell; position:relative; vertical-align:middle; text-align:center;}
/* visual styles */
section {background:#ec2b25;}
.not-fullscreen{height:50%;}
.services-fullscreen{height:90%;}

.pos-absolute{ position: absolute; z-index: 3; }
.carousel-control-next, .carousel-control-prev {z-index: 4; width: 8%;}



/* Menu */
.menu { width: 1180px; margin: auto; position: relative; z-index: 1; padding-top: 20px;}
.menu ul { list-style: none; margin: 10px 0 0 0; padding: 0; text-align: center;}
.menu ul li { list-style: none; float: left; font-size: 16px; display: inline-block; font-weight: 600;}
.menu ul li:nth-child(4){ float: right; }
.menu ul li:nth-child(5){ float: right; }
.menu ul li:nth-child(6){ float: right; }
.menu ul li a { text-decoration: none; color: var(--thm-white); display: block; padding: 10px 40px; border-bottom: 1px solid transparent;}
.menu ul li a:hover {color: var(--thm-yellow);}
.dropdown {position: relative; display: inline-block;}
.dropdown:hover .dropdown-content {  display: block !important;}
.dropdown-content { display: none; position: absolute; min-width:200px; box-shadow: 0px 8px 16px 0px rgb(0 0 0 / 20%); z-index: 999;
    top: 36px;}
.dropdown-content li { color: black; text-decoration: none; display: block; width: 100%; background-color:rgba(0,0,0,0.3);}  
.dropdown-content li a { color:var(--thm-black);}  
.menu ul li i{ font-size: 12px; padding-left: 10px; }
.logo-div{ width:200px; position: absolute; left: 40%; top: 10px;}
.logo-div img{ width: 100%;  }


/*=======================================MOBILE MENU==============================================*/
.mobile-menu-btn{background:#f36e29; padding:6px 12px; color:#fff; top: 12px;}
.sidenav {height: 100%; width: 0; position: fixed; z-index: 9999; top: 0; left: 0; background-color: #27329e; overflow-x: hidden;
    transition: 0.5s; padding-top: 50px; list-style-type: none;}
.sidenav a { padding: 10px 15px 10px 15px; text-decoration: none; font-size: 16px; color: #efefef; display: block;
    transition: 0.3s; border-bottom:1px solid #274d85; text-transform: capitalize;}
.sidenav ul{ margin: 0px; padding: 0px; }
.sidenav li a i{ float:right;}
.sidenav li ul{ margin:0px; padding:0px;}
.sidenav li ul li{ padding-left:0px;}
.sidenav a:hover, .offcanvas a:focus { color: #f36e29;}
.sidenav .closebtn { border:medium none; position: absolute; top: 0; right: 0px; font-size: 20px; margin-left: 50px;}
.droup-arrow { float:right; margin-right:20px;}
.menuIcn {color: #fff;  font-size: 24px; float: right; padding: 7px 13px; display: none; border: 1px solid #fff;  margin-left: 10px; margin-top: 3px; cursor: pointer;}

/* Banner Content */
.banner{ padding-top:200px; text-align: center; }
.welcome-text h1{font-size:50px; color:var(--thm-white); line-height: 48px;}
.welcome-text h1 span{ color:var(--thm-yellow); }
.welcome-text p{ font-size: 20px; color: var(--thm-white); letter-spacing: 1px; }
.custom-btn {height: 50px; color: #fff;  border-radius: 5px;  padding: 10px 25px; font-weight: 500;  background: transparent;  cursor: pointer;  transition: all 0.3s ease;  position: relative;  display: inline-block;   box-shadow:inset 2px 2px 2px 0px rgba(255,255,255,.5),   7px 7px 20px 0px rgba(0,0,0,.1), 4px 4px 5px 0px rgba(0,0,0,.1);  outline: none;}
/* 14 */
.btn-14 { background: rgb(221,189,79); border: none; z-index: 1; color: var(--thm-black);}
.btn-14:after {position: absolute; content: ""; width: 100%; height: 0; top: 0; left: 0;
  z-index: -1; border-radius: 5px; background-color: var(--thm-yellow);
  background-image: linear-gradient(315deg, #eaf818 0%, #f6fc9c 74%);
   box-shadow:inset 2px 2px 2px 0px rgba(255,255,255,.5);
   7px 7px 20px 0px rgba(0,0,0,.1),
   4px 4px 5px 0px rgba(0,0,0,.1);
  transition: all 0.3s ease;
}
.btn-14:hover { color: var(--thm-black);}
.btn-14:hover:after {top: auto; bottom: 0; height: 100%;}
.btn-14:active { top: 2px;}

/* home page welcome text */
.content-padd{ padding:80px 0px; background: url(images/home-welcome-bg.jpg); }
.experience{ width: 160px; position: absolute; top:68px; left: 56px; }
.exp-inn{ background: var(--thm-yellow); width: 100%; padding: 30px 15px 20px 15px; text-align: center; color: var(--thm-black);}
.exp-inn img{ width: 100px; }
.exp-inn h2{ font-size: 40px !important; font-weight: bold; line-height: 40px; }
.exp-inn p{ font-size: 20px; line-height: 20px; font-weight:600; }
.content-padd h2{ font-size: 26px; }
.content-padd h2 span{ font-size: 48px; display: block; }

/* Services Block */
.services-block-hme{ padding: 80px 0px 0px 0px; }
.services-block-hme h2{font-family: var(--thm-headingtext); font-size:50px; color:var(--thm-white); line-height: 48px;}
.property-carousel .owl-nav button.owl-prev {  width: 45px !important; height: 45px !important; background-color: #fff !important;
    color: #777; font-size: 20px !important;  border-radius: 100%;
    line-height: 40px; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
    position: absolute; top: 40%; left: -30px; }
.property-carousel .owl-nav button.owl-prev:hover {background-color: var(--thm-yellow) !important; }
.property-carousel .owl-nav button.owl-next {width: 45px !important; height: 45px !important;
background-color: #fff !important; font-size: 20px !important; border-radius: 100%;
line-height: 40px; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
position: absolute; top: 40%; right: -30px; color: #777; }
.property-carousel .owl-nav button.owl-next:hover { background-color: var(--thm-yellow) !important; }
.property-carousel h3{ text-align: center;  padding-top: 10px; font-size:20px; text-transform: none; color: var(--thm-white); }
.slide-image.border-clip {
    opacity: 1; -webkit-clip-path: polygon(0% 0%, calc(100% - 2rem) 0%, 100% 2rem, 100% 100%, 2rem 100%, 0% calc(100% - 2rem)); clip-path:
    polygon(0% 0%, calc(100% - 2rem) 0%, 100% 2rem, 100% 100%, 2rem 100%, 0% calc(100% - 2rem));
}
.property-carousel .item:hover h3{ color:var(--thm-yellow); }
.property-carousel a{ text-decoration: none; }


/* Projects */
/* Works Filters Starts Here */
.project-bg{ background: var(--thm-white); padding:80px 0px;  }
.project-bg h2{font-size:50px; color:var(--thm-black); line-height: 48px;}
.worksDiv{
  max-width: 1200px; min-width:320px;
  float: none;
  margin:auto;
}
#portfolio {  
    margin: 1rem 0;
    -webkit-column-count: 3; 
    -moz-column-count: 3;
    column-count: 3;
    -webkit-column-gap: 1rem;
    -moz-column-gap: 1rem;
    column-gap: 1rem;
    -webkit-column-width: 33.33333333333333%;
    -moz-column-width: 33.33333333333333%;
    column-width: 33.33333333333333%;
    
}
.tile { 
    /*-webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition: all 350ms ease;
    transition: all 350ms ease;*/
position:relative; padding-bottom: 10px;
}
.scale-anm {transform: scale(1); }


p{ float:none;}
.tile img { max-width: 100%;  width: 100%;  height: auto;  margin-bottom: 1rem; 
}
.btn {
    font-size:18px;  font-weight: 600;  text-decoration: none;  cursor: pointer;
    display: inline-block;  line-height: normal;  padding: .5rem 1rem;  vertical-align: middle;
    -webkit-appearance: none;  color: #555;  text-transform:none; border:0px; background:none;
}
.btn:hover {
  text-decoration: none;
  color:var(--thm-yellow);
}
.btn:focus { color:var(--thm-black); background:var(--thm-yellow);}
::-moz-focus-inner { border: 0; padding: 0;}

/* Testimonials */
.testi {background: var(--thm-white);}
.testimonial-box-grey{ background: var(--thm-grey); padding:15px 25px;  text-align: center;}
.testimonial-box-grey .quotes-text{ font-size: 40px; color: var(--thm-blue); }
.testimonial-box-grey p{ font-style: italic; text-align: center; }
.testimonial-box-grey .author-text{ font-size: 18px; font-weight: 700; padding-bottom: 10px; }
.testimonial-carousel .owl-nav button.owl-prev {  width: 45px !important; height: 45px !important; background-color: #fff !important;
    color: #777; font-size: 20px !important;  border-radius: 100%;
    line-height: 40px; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
    position: absolute; top: 40%; left: -70px; }
.testimonial-carousel .owl-nav button.owl-prev:hover {background-color: var(--thm-yellow) !important; }
.testimonial-carousel .owl-nav button.owl-next {width: 45px !important; height: 45px !important;
background-color: #fff !important; font-size: 20px !important; border-radius: 100%;
line-height: 40px; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
position: absolute; top: 40%; right: -70px; color: #777; }
.testimonial-carousel .owl-nav button.owl-next:hover { background-color: var(--thm-yellow) !important; }
.testimonial-carousel h2{ text-align: center; padding-top: 10px; font-size:20px; text-transform: none; }
.testi h2 {font-weight: 700; font-size: 36px; margin-bottom: 15px; color: var(--thm-black); }

/* Gallery */
.box{ position: relative; text-align: center;}
.box:before, .box:after{ content: ""; background: #333; transform: scale(0); position: absolute; top: 0;
    left: 0; right: 0; bottom: 0; transition: all 0.5s ease 0s;}
.box:after{background: #000; border: 1px solid #aaa; top: 10px; left: 10px; right: 10px;
    bottom: 10px; transition: all 0.5s ease 0.2s;}
.box:hover:before{ opacity: 0.5;transform: scale(1);}
.box:hover:after{ opacity: 0.35; transform: scale(1);}
.box img{ width: 100%; height: auto;}
.box .box-content{color: #fff; width: 85%; filter: blur(5px); opacity: 0;
    transform: translateX(-50%) translateY(-50%); position: absolute; top: 50%;
    left: 50%; z-index: 2; transition: all 0.4s ease 0.3s;}
.box:hover .box-content{ filter: blur(0); opacity: 1;}
.box .title{font-size: 25px; font-weight: 200; text-transform: capitalize; margin: 0 0 1px;}
.box .post{font-size: 15px; font-weight: 500; text-transform: uppercase; letter-spacing: 1px; display: block; margin: 0 0 10px;}
.box .icon{padding: 0; margin: 0; list-style: none;}
.box .icon li{ margin: 0 3px; display: inline-block;}
.box .icon li a{ color: #fff; font-size: 24px;}

/* Video Play */
.video-play{ width: 100em; display: table-cell; height: 340px; vertical-align: middle; text-align: center;
    color:var(--thm-white); font-weight: bold; font-size: 22px; cursor: pointer; }
.video-play a{ color:var(--thm-white); text-decoration: none; }
.video-play img{ width: 100px; transition: all 0.4s ease 0.3s;}
.video-play img:hover{-ms-transform: scale(1.2); /* IE 9 */
  -webkit-transform: scale(1.2); /* Safari 3-8 */
  transform: scale(1.2); 
   /*filter: grayscale(100%);*/}

/* Footer */
.footer-bg{ background: url(images/footer.png) center #1d1d1d; padding: 30px 0px; }
.fot-col-1{ width: 16%; float: left; }
.fot-col-2{ width: 26%; }
.footer-logo{ width:220px;}
.badge-logo{text-align: center;}
.badge-logo img{ width: 65px; }
.footer-bg h2{ font-size:22px; color: var(--thm-white); font-family: var(--thm-sitetext); font-weight: bold; }
.footer-bg ul{margin: 10px 0px 0px 0px; padding: 0px; list-style: none;}
.footer-bg ul li{ padding:4px 0px;  list-style: none;}
.footer-bg ul li a{color: #acacac; text-decoration: none; }
.footer-bg ul li a:hover{color: var(--thm-yellow);}
.padd-left{ padding-left: 40px; }
.location-footer{color: #acacac; padding-left:26px; position: relative; }
.address:before{ content: '\f3c5'; position: absolute; width: 20px; height: 20px; top: 0px; left:0px;
font-family: 'Font Awesome 5 Pro'; }
.contact:before{ content: '\f879'; position: absolute; width: 20px; height: 20px; top: 0px; left:0px;
font-family: 'Font Awesome 5 Pro'; }
.envelope:before{ content: '\f0e0'; position: absolute; width: 20px; height: 20px; top: 0px; left:0px;
font-family: 'Font Awesome 5 Pro'; }
.footer-icons{ margin: 15px 0px 0px 0px; }
.footer-icons i {
    width: 40px;
    height: 40px;
    background: var(--thm-yellow);
    color: var(--thm-darkgrey);
    font-size: 20px;
    text-align: center;
    line-height: 40px;
    border-radius: 50%;
    margin-right: 3px;
}
.footer-icons i:hover {
    background: var(--thm-white);
    color: var(--thm-black);
}


/* Copyrights */
.copyrights-div{ padding: 15px 0px; text-align: center; color: var(--thm-white); background: var(--thm-black); font-size: 16px; }
.copyrights-div a{ color: var(--thm-yellow); text-decoration: none; }
.scroll-up { background: url('images/top-scroll-up.png'); display: inline-block;  height: 62px;
    width: 62px; position: fixed;bottom: 10px; right: 16px; cursor: pointer;}

@media only screen and (max-width: 991px){
body{
    display: none;
}
html:before{
    content: "This Website View Currently Available on Desktops only";
    padding:20%;
    text-align: center;
    font-size: 30px;
    display: block; 
}
}
