﻿/*@import url(effect.css);

/* Fonts */
@import url('https://use.fontawesome.com/releases/v5.15.4/css/all.css');
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');
/* Fonts */

html { margin: 0; padding:0; overflow-x:hidden;}
body{
font-family: 'Outfit', sans-serif; font-weight:normal; padding:0; color:#444; font-weight:300; padding-right:0!important; overflow-x:hidden; width:100vw;
font-size:17px;
line-height:1.5;
}

/*	--------------------------------------------------
Global Reset & Standards
-------------------------------------------------- */
:root{--orange:#ff893b; --dark:#222!important; --blue:#193264; --yellow:#ffec00; --gray:#212121; --shade:linear-gradient(90deg, var(--orange) 0%, var(--blue) 100%);}

img{border:0;}

*{ box-sizing:border-box;
}
*:hover{
}

a{color:#1f1917; 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(--blue);}

h1, h2, h3, h4, h5{margin:0 0 15px; padding:0; font-weight:700;}

a:focus, .active{outline: none !important; box-shadow: 0!important;}

@keyframes wiggle {
0%{transform:rotate(0deg);}
80%{transform:rotate(0deg);}
85%{transform:rotate(5deg);}
95%{transform:rotate(-5deg);}
100%{transform:rotate(0deg);}
}


.popUpBox{position:fixed; right:10px; bottom:10px; width:330px; background:#fff; padding:10px; border-radius:0 30px; text-align:center; z-index:99999; font-size:18px; oapcity:1; display:block; transition:.2s ease-in-out;
-webkit-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.4);
-moz-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.4);
box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.4);
}
.popUpBox h4{margin-bottom:10px; font-size:18px;}
.popUpBox div a{display:block; overflow:hidden; font-weight:700; font-size:30px; margin-top:5px; line-height:1; animation: wiggle 1.5s infinite; color:var(--red);}
.popUpBox div a i{font-size:26px;}
.popUpBox > a{position:absolute; left:-10px; top:-10px;background:var(--orange); color:#fff; text-align:center; width:40px; height:40px; line-height:36px; border-radius:50%; border:2px #fff solid;}
.popUpBox div a:hover{color:var(--orange);}
.popUpBox.show{opacity:0; display:none;}



/* Header */
.headerArea:before{position:absolute; left:0; right:0; top:-1px; height:3px; background:var(--blue); content:''; display:block;}
.headerArea{display:block; padding:10px 0; float:left; width:100%; margin-top:1px; position:relative; z-index:100; background:var(--blue);}
.headerArea .logo img{height:50px; transition:all .2s ease-in-out;}
.sticky {position: fixed!important; top: 0!important; margin-top:0!important; width: 100%; z-index:999; background:rgba(25,50,100,0.8); backdrop-filter: blur(10px);
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
}
.sticky .logo img{height:40px;}

.homeIcon{position:absolute; color:#fff; right:70px; top:5px; z-index:100; padding:6px 10px 5px; border:3px #fff solid; border-radius:5px; display:none;}
.homeIcon:hover{background:#fff; color:var(--blue);}


.getintouchBtn{display:block; overflow:hidden; padding:8px; text-transform:uppercase; font-weight:700; text-align:center; background:var(--orange); color:#fff; border-radius:25px; font-size:14px;}
.getintouchBtn:hover{background:var(--dark); color:#fff;}


.socialLinks{list-style-type:none; margin:0; padding:0; float:right;}
.socialLinks li{display:inline-block; margin:0 12px;}
.socialLinks li a{font-size:20px; color:var(--dark);}
.socialLinks li a:hover{color:var(--orange);}



.project-slider{position:relative; display:block; width:100%; overflow:hidden; background:#666;}
.project-slider #carouselExampleIndicators .carousel-inner{mix-blend-mode:overlay}
.project-slider img{width:100%;}
.project-slider .sliderContent{position:absolute; width:60%; left:50%; bottom:35%; transform:translate(-50%,0%); z-index:5; color:#fff; text-align:center;}
.project-slider .sliderContent h2{font-weight:600; font-size:36px; margin-bottom:15px; text-shadow: 0 0 8px #000000;}
.project-slider .sliderContent p{ font-size:24px; margin-bottom:50px; line-height:1.2;}


.waves {
  position: absolute;
  left: 0px;
  bottom: 0px;
  width: 100%;
  height: 15vh;
  z-index: 1;
  margin-bottom: -8px;
  min-height: 100px;
  max-height: 150px;
}
svg:not(:root) {
  overflow: hidden;
}
.parallax > use {
  -webkit-animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite;
  animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite;
    animation-duration: 25s;
    animation-delay: 0s;
}
.parallax > use:nth-child(1) {
  -webkit-animation-delay: -2s;
  animation-delay: -2s;
  -webkit-animation-duration: 7s;
  animation-duration: 7s;
}
.parallax > use:nth-child(2) {
  -webkit-animation-delay: -3s;
  animation-delay: -3s;
  -webkit-animation-duration: 10s;
  animation-duration: 10s;
}
.parallax > use:nth-child(3) {
  -webkit-animation-delay: -4s;
  animation-delay: -4s;
  -webkit-animation-duration: 13s;
  animation-duration: 13s;
}
.parallax > use:nth-child(4) {
  -webkit-animation-delay: -5s;
  animation-delay: -5s;
  -webkit-animation-duration: 20s;
  animation-duration: 20s;
}


@keyframes move-forever {
0% {
  -webkit-transform: translate3d(90px, 0, 0);
  transform: translate3d(90px, 0, 0);
}
}


.scroll-downs {
  position: absolute;
  top: auto;
  right: 0;
  bottom: 25vh;
  left: 0;
  margin: auto;
  width :28px;
  height: 25px;
}

.mousey {
  width: 3px;
  padding: 7px 12px;
  height: 28px;
  border: 2px solid rgba(240,235,200,0.7);
  border-radius: 25px;
  opacity: 0.75;
  box-sizing: content-box;
}
.scroller {
  width: 3px;
  height: 10px;
  border-radius: 25%;
  background-color: #f1edc9;
  animation-name: scroll;
  animation-duration: 2.2s;
  animation-timing-function: cubic-bezier(.15,.41,.69,.94);
  animation-iteration-count: infinite;
}
@keyframes scroll {
  0% { opacity: 0; }
  10% { transform: translateY(0); opacity: 1; }
  100% { transform: translateY(15px); opacity: 0;}
}



.service-sliders{padding:30px 0; display:block; position:relative; /*background:transparent url('../images/dotleft.png') no-repeat left bottom;*/}
.service-sliders .owl-theme .owl-nav{position:absolute; top:20%; width:100%;}
.service-sliders .owl-theme .owl-nav .owl-prev, .service-sliders .owl-theme .owl-nav .owl-next{ float:left; width:60px; height:60px;background:rgba(255,255,255,0.5); color:#222; line-height:60px; font-size:22px; border-radius:50%;}
.service-sliders .owl-theme .owl-nav .owl-next{ float:right;}
.service-sliders .owl-theme .owl-nav .owl-prev:hover, .service-sliders .owl-theme .owl-nav .owl-next:hover{background:#fff;}
.service-sliders .item a > div{display:block; padding:15px;}
.service-sliders .item a > div h3{font-size:18px;color:var(--orange); font-weight:700; margin-bottom:10px;}
.service-sliders .item a > div p{line-height:1.3;}
.service-sliders .item a img{ height:200px; object-fit:cover; transition:all .2s ease-in-out; transform: scale(1);}
.service-sliders .item a:hover img{transform: scale(0.95);}


.welcomeArea{display:block;overflow:hidden;padding:80px 0;position:relative;}
.welcomeArea > div{position:relative; z-index:5;}
.welcomeArea .row [class^="col"] > div{padding:60px;}
.welcomeArea h1{font-size:30px; color:var(--blue);}
.welcomeArea h1 span{color:var(--orange); font-size:42px; display:block; clear:both; line-height:1;}
.welcomeArea h2{font-size:22px; font-weight:400; line-height:1.2; text-align:center;}
.welcomeArea h2 strong{color:var(--blue); font-size:42px; display:block; font-weight:700; line-height:1; margin-bottom:5px;}
.welcomeArea h2 strong:first-letter{color:var(--orange);}

.certiTag{position:absolute; bottom:0px; right:0px; z-index:5;}



section {
  transition: opacity 0.3s ease, transform 0.5s ease; 
  position: relative;
}


.inactive {
  opacity: 0;
  transform: translateY(100px);
}

.active {
  opacity: 1;
  transform: translateY(0);
}

.welcomeArea:after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background:#fff url('../images/welcomeBg.jpg') no-repeat center bottom; background-size:100%; /* Semi-transparent background */
  transform: translateY(100%); /* Start off-screen */
  transition: transform 0.5s ease; /* Smooth transition for non-GSAP animations */
}

.welcomeArea.active:after {
  transform: translateY(0); /* Move to the right edge */
}

.delayed-content {
  opacity: 0; /* Initially hidden */
  transform: scale(0.8); /* Initially scaled down */
  transition: opacity 0.2s ease, transform 0.2s ease; /* Smooth transition for non-GSAP animations */
}

.welcomeArea.active .delayed-content {
  opacity: 1; /* Fully visible when active */
  transform: scale(1); /* Normal scale when active */
}


.missionVisionArea{background:var(--shade); color:#fff; padding:80px 0; border-radius:0 200px 0 0; position:relative; overflow:hidden; display:block;}
.missionVisionArea:before{position:absolute; content:''; display:block; left:0; right:0; top:0; bottom:0; opacity:0.5; background:transparent url('../images/itsolution.jpg') no-repeat center center fixed; transform: scaleX(-1); background-size:cover; mix-blend-mode:soft-light;}
.missionVisionArea [class^="col"] img{border-radius:50%; height:300px; transform:scale(3); opacity:0; transition: opacity 0.5s ease, transform 0.7s ease;}
.missionVisionArea > img:last-child{position:absolute;right:auto; left:0; top:auto; bottom:0; border-radius:0%; height:250px;}
.missionVisionArea [class^="col"] h3{font-size:20px;}
.missionVisionArea [class^="col"] > div{display:block; padding:0 30px; line-height:1.3;}
.missionVisionArea.active [class^="col"] img{transform:scale(1); opacity:1;}
.missionVisionArea ul{ margin:0 0 0 18px; padding:0;}
.missionVisionArea ul li{margin-bottom:5px;}

.text2Part{
column-count: 2; /* Number of columns */
column-gap: 30px; /* Gap between columns */
}


.productArea{display:block;background:#fff url('../images/productBg.jpg') no-repeat center top; background-size:100%; padding:80px 0 40px; text-align:center;}
.productArea h2{color:var(--blue); font-size:42px; margin-bottom:10px;}
.productArea h2 + p{font-size:24px; margin-bottom:40px;}
.productArea > div > div{background:#fff; padding:30px; border-radius:30px 30px 0 0;filter: drop-shadow(0 -2mm 1mm rgb(0,0,0,0.2));}
.productArea > div > div img{margin-bottom:10px; border-radius:8px;}
.productArea > div > div h3{font-size:20px; color:var(--orange); margin-bottom:5px;}
.productArea > div > div p{font-size:14px; margin-bottom:5px;}
.productArea > div > div p + span{font-size:14px; line-height:1.4; display:inline-block; padding:2px 10px; border-radius:5px; background:var(--blue); color:#fff;}
.productArea .owl-theme .owl-dots{z-index:80; position:relative; width: 150px;  margin: 0 auto;}
.productArea .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span{background:var(--blue);}
.productArea .owl-theme .owl-nav [class*="owl-"]{margin:0 80px; color:#fff; background:var(--orange); width:30px; height:30xp; text-align:center; line-height:30px; border-radius:50%;}
.productArea .owl-theme .owl-nav [class*="owl-"]:hover{background:var(--blue); color:#fff!important;}
.productArea .owl-theme .owl-nav{position:relative; top:24px; z-index:50;}


.certificationsArea{display:block; float:left; width:100%; background:#dbdcdb url('../images/certificateAreaBg.jpg') no-repeat left center; padding:80px 0; background-size:cover; position:relative; z-index:5;}
.certificationsArea > img{position:absolute; left:-15px; top:-60px;}
.certificationsArea h3{font-size:32px; margin-bottom:10px; color:var(--orange);}
.certificationsArea h3 + p{font-size:20px; color:#fff; margin-bottom:20px; line-height:1.3;}
.certificationsArea label{display:block; overflow:hidden; clear:both; color:#fff;}
.certificationsArea input, .certificationsArea textarea, .certificationsArea select{width:100%; height:40px; padding:0 10px; background:#fff; border-radius:0; margin-bottom:15px; border:1px #222 solid;}
.certificationsArea textarea{height:80px;}
.certificationsArea input[type="submit"]{background:var(--blue); color:#fff; border:none;}
.certificationsArea input[type="submit"]:hover{background:var(--orange);}


.ourPresence{display:block; overflow:hidden; clear:both; padding:80px 0; position:relative; color:#fff;}
.ourPresence:before{position:absolute; left:10%; top:50%; width:1000px; height:1000px; border-radius:50%; transform:translate(-50%,-50%); content:''; display:block; background:var(--shade);}
.ourPresence h4{font-size:30px;}
.ourPresence p{font-size:22px; margin-bottom:10px;}
.ourPresence a{display:block; overflow:hidden; font-size:40px; font-weight:700; color:#fff; border-top:2px #fff solid; padding:10px 0;}
.ourPresence img{transform:scale(3); opacity:0; transition: opacity 0.5s ease, transform 0.7s ease;}
.ourPresence.active img{transform:scale(1); opacity:1;}

.getinTouch{background:var(--orange); color:#fff; padding:40px 0 30px; font-size:22px; display:block; overflow:hidden; clear:both;}
.getinTouch h4{font-size:32px; font-weight:600; margin-bottom:10px;}
.getinTouch a{background:var(--blue); color:#fff; display:inline-block; padding:15px 40px; border-radius:10px; text-transform:uppercase; font-weight:700; font-size:17px;}
.getinTouch a:hover{background:#fff; color:var(--dark);}


.footer{display:block; clear:both; overflow:hidden; padding:40px 0; position:relative;}
.footer img{ height:80px; position:relative; margin-bottom:20px;}
.footer > div{position:relative; z-index:5;}
.footer h5{font-size:18px;}
.footer ul.links{list-style-type:none; margin:0; padding:0; font-size:18px; font-weight:500;}
.footer ul.links li{display:block;padding:7px 0;}
.footer ul.links li i{margin-right:10px; color:var(--orange);}
.footer ul.links li a{color:#444;}
.footer ul.links li a:hover{color:var(--orange);}

.getQuote{display:block; padding:14px; text-align:center; background:var(--orange); color:#fff; font-weight:700; margin-top:20px; outline:3px var(--yellow) solid; outline-offset:-5px;}
.getQuote:hover{background:var(--dark); color:#fff;}

.social-icons{margin:0; padding:0; list-style-type:none; position:relative;}
.social-icons li{display:inline-block; font-size:22px; margin:0 10px;}
.social-icons li a{color:#fff;}
.social-icons li a:hover{color:var(--orange);}

.footer .fa-chevron-up{font-size:18px; color:var(--orange);}

.footerDown{display:block; padding:5px 0; background:var(--dark); color:#fff;}
.footerDown p{margin-bottom:0; font-size:14px;}
.footerDown a:hover{color:var(--orange);}




#scroll-icon {
    position:fixed;
    right:10px;
    bottom:10px;
    cursor:pointer;
    width:30px;
    height:30px;
    background-color:var(--dark);
    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(--orange);
    opacity:1;
    filter:"alpha(opacity=100)";
    -ms-filter:"alpha(opacity=100)";
}



.fixed-bottom {width:50px; bottom:5px; left:10px;}
.fixed-bottom img{width:50px; border:2px #fff solid; border-radius:50%;}
.fixed-bottom a{display:block; margin-bottom:5px;}

.innerHeader{ padding:150px 0; background:no-repeat fixed center url('../images/itsolution.jpg'); background-color:var(--blue); background-blend-mode:overlay;}
.innerHeader h1{text-transform:uppercase;}
.innerHeader ul{list-style-type:none; margin:0; padding:0;}
.innerHeader ul li{display:inline-block; text-transform:uppercase; margin:0 5px;}
.innerHeader ul li a{color:var(--orange);}
.innerHeader ul li a:after{content:'/'; display:inline-block; margin-left:10px;}


.innerContentArea{display:block; overflow:hidden; padding:60px 0;}
.innerContentArea h2{color:var(--blue); padding-left:15px; border-left:5px var(--orange) solid;}

.missionBox [class^="col-"]{text-align:center; position:relative;}
.missionBox [class^="col-"]:before{content:''; display:block; left:15px; right:15px; top:0; bottom:0; position:absolute; border:1px #ddd solid; z-index:-1;
background: rgb(3,15,51);
background: linear-gradient(180deg, rgba(3,15,51,0) 80%, rgba(3,15,51,0.3) 100%); 
}
.missionBox [class^="col-"] > div{padding:15px 25px;}
.missionBox [class^="col-"] > img{width:140px; margin-top:15px;}

.teamBox{position:relative;}
.teamBox:before{content:''; display:block; left:15px; right:15px; top:0; bottom:0; position:absolute; z-index:-1;background:var(--blue);}
.teamBox [class^="col-"] > div{padding:25px; color:#fff;}


.serviceBox > div{ border:1px #ddd solid; border-left:2px var(--orange) solid; padding:20px 20px 20px 350px; min-height:240px; display:block; overflow:hidden; clear:both; margin-bottom:30px; position:relative;}
.serviceBox > div img{position:absolute; left:20px; top:20px; width:300px;}
.serviceBox > div h3{font-size:24px; color:var(--orange);}
ul.twoPart li{width:50%; float:left;}


.contactBox p{ margin-bottom:8px; font-size:17px;}
.contactBox h3{margin-top:20px; font-size:24px; color:var(--orange);}
.contactBox i{color:var(--orange); margin-right:5px;}


.formArea{ display:block; padding:30px; background:var(--blue); color:#fff; margin-top:30px;}
.formArea [class^=col-]{margin-bottom:15px;}
.formArea label{display:block; overflow:hidden; clear:both;}
.formArea textarea, .formArea input, .formArea select{background:#fff; border:none; padding:0 10px; min-height:40px; display:block; width:100%;
box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;}
.formArea input[type="submit"]{background:var(--orange); border:2px #fff solid; color:#fff; text-transform:uppercase; font-weight:700; min-height:60px;}
.formArea input[type="submit"]:hover{background:var(--dark); color:var(--orange);}



/*------------------------------------*\
    Media Queries
\*------------------------------------*/

@media (max-width: 1920px) and (min-width: 1601px) {
.threeImg{width:1000px; right: 10%;}
.threeImg img{height:600px;}
.project-slider.active .threeImg img:nth-child(3){height:640px;}

.ourPresence:before{left: 22%;}
}

@media (max-width: 1600px) and (min-width: 1367px) {
.threeImg{width:1000px; right: 5%;}
.threeImg img{height:550px;}
.project-slider.active .threeImg img:nth-child(3){height:600px;}

.ourPresence:before{left: 18%;}
}



@media (max-width: 991px){
.headerArea .logo img{ height:30px; margin-bottom:5px;}
.socialLinks{float:left;}
.socialLinks li{margin:0 8px;}
.socialLinks li a{font-size:16px; line-height:1;}
.homeIcon{display:block;}


.project-slider img{ max-height:350px; min-width:100%; width:auto;}
.project-slider .sliderContent h2{font-size:22px; margin-bottom:5px;}
.project-slider .sliderContent p{font-size:16px;  margin-bottom:0;}

ul.twoPart li{width:100%; float:left;}

}

@media (max-width: 767px){
.project-slider{height:auto;}
.project-slider > img{height:320px; object-fit:cover; object-position: right center;}
.sliderContent{max-width:90%; text-align:center; left:5%; top:25%;}
.project-slider .sliderContent h2{font-weight:400; font-size:24px; letter-spacing:2px; line-height:0.9;}
.project-slider .sliderContent h2 strong{display:inline-block; font-size:30px; position:relative;top:3px;}

.project-slider.active .threeImg{right:5%;}
.project-slider.active .threeImg img{left:0; height:210px;}
.project-slider.active .threeImg img:nth-child(3){height:230px;}


.welcomeArea{text-align:center; padding:50px 0;}
.welcomeArea .row [class^="col"] > div{padding:20px;}
.welcomeArea img{margin-top:20px;}

.missionVisionArea{padding:40px 0 10px; border-radius:0 180px 0 0;}
.missionVisionArea [class^="col"]{margin-bottom:30px;}
.missionVisionArea > img:first-child{position:static; height:300px; margin-bottom:30px;}
.missionVisionArea [class^="col"]:first-child > div{border:0; border-bottom:1px #fff solid; margin-bottom:20px;}

.productArea{background-size: 300%; padding: 40px 0 80px;}
.productArea h2 + p{font-size:18px;}
.productArea .owl-theme .owl-nav{top: 65px;}
.productArea .owl-theme .owl-nav [class*="owl-"]{margin:0 5px;}
.productArea .owl-theme .owl-dots{width:100%;}


.certificationsArea{padding:80px 0 10px;}
.certificationsArea > img{left:-50%;}
.certificationsArea [class^="col"]{margin-bottom:20px;}
.certificationsArea h3 + p{font-size:18px;}


.ourPresence{text-align:center; padding:50px 0;}
.ourPresence:before{position:absolute; left:50%; top:50%; width:1000px; height:1000px; border-radius:50%; transform:translate(-50%,-105%); content:''; display:block; background:var(--shade);}
.ourPresence img{margin-top:100px;}

.getinTouch{text-align:center; font-size:18px;}

.footer, .footerDown{text-align:center;}
.footer ul.links{margin-bottom:0;}
.footerDown ul{margin-top:20px;}

.enquiryArea h2{font-size:32px; }
.enquiryArea h2 + p{font-size:18px;}
.enquiryArea h3{font-size:30px;}
.enquiryArea [class^="col"] > div{padding:25px;}

.fixed-bottom {width:95px;}
.fixed-bottom img{width:40px;}
.fixed-bottom a{display:inline-block; margin:0px 2px 5px 0;}


.text2Part{
column-count:1; /* Number of columns */
column-gap: 0px; /* Gap between columns */
}


.serviceBox > div{padding:20px;}
.serviceBox > div img{position:static; padding-bottom:20px; max-width:100%;}


}

@media (max-width: 500px){
.header-area > a.logo img{height:80px;}
}

@media (max-width: 360px){
}


@media screen and (max-width: 1920px) and (min-width: 1240px){
}
