body{
    overflow-x: hidden;
    margin: 0px auto;
}
/*  --------------recipe-----------------------------------------*/

html {
  scroll-behavior: smooth;
}

/*font includes start*/
@font-face {
    font-family: mm1;
    src: url(../fonts/Poppins-Black.otf);
}
@font-face {
    font-family: mm2;
    src: url(../fonts/Poppins-BlackItalic.otf);
}
@font-face {
    font-family: mm3;
    src: url(../fonts/Poppins-Regular.otf);
}
@font-face {
    font-family: mm4;
    src: url(../fonts/Poppins-Medium.ttf);
}
@font-face {
    font-family: mm5;
    src: url(../fonts/Poppins-ExtraBold.otf);
}
@font-face {
    font-family: mm6;
    src: url(../fonts/Poppins-ExtraBoldItalic.otf);
}
@font-face {
    font-family: mm7;
    src: url(../fonts/Poppins-ExtraLight.otf);
}


/*font includes start*/
/* Header page starts*/
.mainhdr, .mobilehdr{
    width: 95%;
    margin: auto;
    padding: 1.5% 0 0 0; 
    position: relative;
    z-index: 99999999999;
}
.hdrsocilimgs{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0;
}
.socialdesgn{
    background-color: #000;
    padding: 0% 3%;
    border-radius: 45px;
    width: 30px;
    height: 30px;
    text-align: center;
    position: relative;
  display: block;
  z-index: 1;
  overflow: hidden;
}
.hdrsnd{
    width: 95%;
    margin: auto;
    transition: all 0.5s;
}
.mainhdr ul li a .socialdesgn svg{
    font-size: 1vw;
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);


}
.hvr-underline-from-left:before {
    background: #00fcff!important;
}
.socilimg{
    margin-right: 0.5%;
}
.mainhdr ul li{
    list-style: none;
}
.mainhdr ul li a .socialdesgn .icon{
  
  z-index: 3;
}
.mainhdr ul li a .socialdesgn:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 100%;
  background: #f00;
  transition: .5s;
  z-index: 2;
}

.mainhdr ul li a .socialdesgn:hover:before {
  top: 0;
}

.mainhdr ul li:nth-child(1) a .socialdesgn:before{
  background: #4f5bd5;
}

.mainhdr ul li:nth-child(2) a .socialdesgn:before{
  background: #3b5998;
}

.mainhdr ul li:nth-child(3) a .socialdesgn:before {
  background: #0077b5;
}

ul li:nth-child(4) a .socialdesgn:before {
  background: #075e54;
}
/*dropdown prod*/
.drop {
  position: relative;
}
.dropmenu a{
    color: #000;
    text-decoration: none;
}
.hdrcatdrpshop{
   padding: 2% 2%;
    margin: 0;
    overflow: hidden;
    z-index: 100;
    border-top: 0;
    display: none;
    position: absolute;
    text-align: left;
    left:50%;
    box-shadow: 4px 4px 4px 4px #00000040;
    opacity: 0;
    background-color: #fffcfccf;
    visibility: hidden;
    animation: growDown 300ms ease-in-out forwards;
    transform-origin: top center;
    transition: all .3s ease-in-out 0s;
}
#hdrcrrbtn2:hover .hdrcatdrpshop{
   padding: 2% 2%;
    margin: 0;
    overflow: hidden;
    z-index: 100;
    border-top: 0;
    display: block;
    position: absolute;
    text-align: left;
    left: 50%;
    box-shadow: 4px 4px 4px 4px #00000040;
    opacity: 1;
    background-color: #fffcfccf;
    visibility: visible;
    animation: growDown 300ms ease-in-out forwards;
    transform-origin: top center;
    transition: all .3s ease-in-out 0s;
}
.dropmenu{
    padding:3.5% 0;
}
.hdrcatdrpshop .drop1{
    list-style:none;
        color: #fff;
        padding:0;
}
/*dropdown prod*/
/* header 2nd*/
.hdrsnd{
    position: relative;
    padding: 1% 0 0 0;
    z-index: 9999;
}
.hdrlogo{
    width: 90%;
    margin-right: auto;
}
.hdrlogo img, .hdrlogo2 img{
    width:100%;
}
.hdrnavbar{
    padding: 1% 0 0 1%;
}
.hdrnavbar span{
    padding:0 3% 0 3%;
    animation:backInUp;
}
.hdrnavbar span a{
    font-family: mm3;
    font-size: 1.35vw;
    color: #000;
    font-weight: 700;
    text-decoration: none;
}
.mobilehdr, .mainhdr2{
    display: none;
}
/*mobile view header*/
/* Menu Button 7 */
#webapp_cover {
  position: absolute;
  top: 50%;
  right: 0;
  left: 2%;
  width: 39px;
  transform: translateY(-50%) scale(2);
}

#menu_button {
  width: 39px;
  overflow: hidden;
}

#menu_checkbox {
  display: none;
}

#menu_label {
  position: relative;
  display: block;
  height: 29px;
  cursor: pointer;
}

#menu_label:before,
#menu_label:after,
#menu_text_bar {
    position: absolute;
    left: 0;
    width: 55%;
    height: 1px;
    background-color: #db1313;
}

#menu_label:before,
#menu_label:after {
  content: "";
  transition: 0.4s cubic-bezier(0.68, -0.55, 0.27, 1.55) left;
}

#menu_label:before {
    top: 5px;
}

#menu_label:after {
    top: 10px;
}

#menu_text_bar {
  top: 15px;
}

#menu_text_bar:before {
    content: "MENU";
    position: absolute;
    left: 0;
    top: 40px;
    color: #000000;
    font-size: 1.1vw;
    font-weight: bold;
    font-family: mm3;
    text-align: center;
}

#menu_checkbox:checked + #menu_label:before {
  left: -39px;
}

#menu_checkbox:checked + #menu_label:after {
  left: 39px;
}

#menu_checkbox:checked + #menu_label #menu_text_bar:before {
  animation: moveUpThenDown 0.8s ease 0.2s forwards,
    shakeWhileMovingUp 0.8s ease 0.2s forwards,
    shakeWhileMovingDown 0.2s ease 0.8s forwards;
}

@keyframes moveUpThenDown {
  0% {
    top: 0;
  }
  50% {
    top: -27px;
  }
  100% {
    top: -14px;
  }
}

@keyframes shakeWhileMovingUp {
  0% {
    transform: rotateZ(0);
  }
  25% {
    transform: rotateZ(-10deg);
  }
  50% {
    transform: rotateZ(0deg);
  }
  75% {
    transform: rotateZ(10deg);
  }
  100% {
    transform: rotateZ(0);
  }
}

@keyframes shakeWhileMovingDown {
  0% {
    transform: rotateZ(0);
  }
  80% {
    transform: rotateZ(3deg);
  }
  90% {
    transform: rotateZ(-3deg);
  }
  100% {
    transform: rotateZ(0);
  }
}
.hvr-underline-from-center:before {
    background: #db1313 !important;
}
.hdrnavbar span a:hover{
    color: #db1313;
}
/*mobile view header*/
/* Header page starts*/

/* Index page start */
.hmmainhbanner1{
     margin-top: -1.5%;
}
.carousel-indicators [data-bs-target] {
    background-color: #000;
}
.hmsec2{
    background-image: url(../assets/img/bnn2.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    position: relative;
    padding: 7% 0 1% 0;
    background-attachment: fixed;
}
.hmsec2 h3{
    font-family: mm1;
    font-size: 3.5vw;
    color: #fff;
    text-align: center;
}
.hmbn2text {
    width: 70%;
    margin: auto;
    padding-top: 1.5%;
}
.hmbn2text p{
    font-family: mm3;
    font-size:calc(0.8vw + 0.8vh);
    color: #fff;
    text-align: justify;
    line-height: 1.2;
}
.hmbnnr2btn {
    text-align: center;
    margin-top: 2%;
}
.btn-2.hover-filled-slide-down::before {
  bottom: 0; left: 0; right: 0; 
  height: 100%; width: 100%;
}
.btn-2.hover-filled-slide-down:hover::before {
  height: 0%;
}
.btn-1 span {
  color: rgb(255,255,255);
  transition: 0.2s 0.1s;
}
.btn-1 span:hover {
  color: rgb(28, 31, 30);
  transition: 0.2s 0.1s;
}
.hmbnnr2btn a{
    text-decoration: none;
}
.hmbnnr2btn a span{
    font-family:mm3;
    font-size: calc(1.1vw + 1.1vh);
    padding: 0.1% 1% 0.1% 1%;
    text-align: center;
    color: #fff;
    background: #d2171e;
    border-radius: 15px;
}
.hmbnnr2leaflef{
    position: absolute;
    width: 6%;
    left: 5%;
    top: 44.5%;
    animation: UpDown 1s linear infinite;
}
.hmbnnr2leaflef img{
    width: 100%;
}
.hmbnnr2leafrgt{
    position: absolute;
    width: 5%;
    right: 5%;
    top: 51%;
   animation: UpDown 1s linear infinite;
}
.up-down{
  animation: up-down linear 4s;
  animation-iteration-count: infinite;
  transform-origin: 50% 50%;
  -webkit-animation: up-down linear 4s;
  -webkit-animation-iteration-count: infinite;
  -webkit-transform-origin: 50% 50%;
  -moz-animation: up-down linear 4s;
  -moz-animation-iteration-count: infinite;
  -moz-transform-origin: 50% 50%;
  -o-animation: up-down linear 4s;
  -o-animation-iteration-count: infinite;
  -o-transform-origin: 50% 50%;
  -ms-animation: up-down linear 4s;
  -ms-animation-iteration-count: infinite;
  -ms-transform-origin: 50% 50%;
}

@keyframes up-down{
  0% {
    transform:  translate(1px,20px)  ;
  }
  24% {
    transform:  translate(1px,30px)  ;
  }
  50% {
    transform:  translate(1px,12px)  ;
  }
  74% {
    transform:  translate(1px,22px)  ;
  }
  100% {
    transform:  translate(1px,22px)  ;
  }
}

@-moz-keyframes up-down{
  0% {
    -moz-transform:  translate(1px,20px)  ;
  }
  24% {
    -moz-transform:  translate(1px,30px)  ;
  }
  50% {
    -moz-transform:  translate(1px,12px)  ;
  }
  74% {
    -moz-transform:  translate(1px,22px)  ;
  }
  100% {
    -moz-transform:  translate(1px,22px)  ;
  }
}

@-webkit-keyframes up-down {
  0% {
    -webkit-transform:  translate(1px,20px)  ;
  }
  24% {
    -webkit-transform:  translate(1px,30px)  ;
  }
  50% {
    -webkit-transform:  translate(1px,12px)  ;
  }
  74% {
    -webkit-transform:  translate(1px,22px)  ;
  }
  100% {
    -webkit-transform:  translate(1px,22px)  ;
  }
}

@-o-keyframes up-down {
  0% {
    -o-transform:  translate(1px,20px)  ;
  }
  24% {
    -o-transform:  translate(1px,30px)  ;
  }
  50% {
    -o-transform:  translate(1px,12px)  ;
  }
  74% {
    -o-transform:  translate(1px,22px)  ;
  }
  100% {
    -o-transform:  translate(1px,22px)  ;
  }
}

.hmbnnr2leafrgt img{
    width: 100%;
}

.hmbnnr3 {
    padding: 3% 0 3% 0;
    position: relative;
}
.hmbnnr3 h3{
    font-family: mm1;
    font-size: 3.5vw;
    color: #424242;
    text-align: center;
}
.hmbnnr3cycle{
    width: 70%;
    margin: auto;
}
.hmbnnr3bscyl{
    background-image: url(../assets/img/Ellipse1.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 56%;
    margin: auto;
    position: relative;
    padding: 27% 0 29% 0;
}
.hmbnnr3imgcycl{
    width: 78%;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.hmbnnr3imgcycl img{
    width: 100%;
}
.hmbnnr3frstsect{
    padding: 2% 0 0% 0;
}
/*2nd prod*/
	.hmbnnr3bdr12{
    border: 2px solid #d2171e;
    position: absolute;
    top: 8%;
    width: 62%;
    right: -7%;
    transform: rotate(-43deg);
}
.hmbnnr3bdr42{
    border: 2px solid #d2171e;
    position: absolute;
    top: 13.9%;
    right: 23.2%;
    width: 12%;
}
	.hmbnnr3bdr32{
   border: 2px solid #d2171e;
    position: absolute;
    width: 23%;
    bottom: 15.5%;
    left: -10%;
}
.hmbnnr3bdr62{
    border: 2px solid #d2171e;
    position: absolute;
    width: 13%;
    left: 20.6%;
    bottom: 47%;
    transform: rotate(45deg);
}
.hmbnnr3bdr22{
    border: 2px solid #d2171e;
    position: absolute;
    bottom: 28%;
    right: -30%;
    width: 60%;
    transform: rotate(-37deg);
}
.hmbnnr3bdr52{
    border: 2px solid #d2171e;
    position: absolute;
    top: 44.69%;
    right: 16.5%;
    width: 11%;
}
/*2nd prod*/
/*3rd prod*/
.hmbnnr3bdr13{
    border: 2px solid #d2171e;
    position: absolute;
    top: -11%;
    width: 53%;
    right: -7%;
    transform: rotate(-45deg);
}
.hmbnnr3bdr43{
    border: 2px solid #d2171e;
    position: absolute;
    top: 13.9%;
    right: 23.2%;
    width: 12%;
}
.hmbnnr3bdr33{
    border: 2px solid #d2171e;
    position: absolute;
    width: 59%;
    top: 28%;
    left: -25%;
}
.hmbnnr3bdr23{
    border: 2px solid #d2171e;
    position: absolute;
    bottom: 56%;
    right: -55%;
    width: 58%;
    transform: rotate(-14deg);
}
/*3rd prod*/
/*4rd prod*/
.hmbnnr3bdr434p {
    border: 2px solid #d2171e;
    position: absolute;
    width: 37%;
    top: 41%;
    left: -25%;
}
.hmbnnr3bdr234p {
    border: 2px solid #d2171e;
    position: absolute;
    bottom: 49%;
    right: -55%;
    width: 81%;
    transform: rotate(-15deg);
}
.hmbnnr3bdr43p5 {
    border: 2px solid #d2171e;
    position: absolute;
    top: 25%;
    right: 20%;
    width: 19%;
    transform: rotate(-32deg);
}
/*4rd prod*/
/*5rd prod*/
.hmbnnr3bdr33crnk {
    border: 2px solid #d2171e;
    position: absolute;
    width: 29%;
    top: 41%;
    left: -25%;
}
.hmbnnr3bdr43crk {
    border: 2px solid #d2171e;
    position: absolute;
    top: 29%;
    right: 21%;
    width: 27%;
    transform: rotate(-26deg);
}
.hmbnnr3bdr23crnk, .hmbnnr3brd25textcrnk{
    display:none;
}
/*5rd prod*/
.hmbnnr3name{
    font-family: mm3;
    font-size: 1.8vw;
    color: #000;
    text-align: center;
    margin: 2% 0 0 0;

}

.hmbnnr3 .owl-prev span, .hmbnnr3 .owl-next span{
    display: none;

}
.hmbnnr3 .owl-prev{
    left:8%;
    top: 45%;
    position: absolute;
    background: url(../assets/img/left.png) !important;
    background-size: 100%!important;
    width: 5%!important;
    padding: 15% 0% !important;
    background-repeat: no-repeat!important;
    height: 8vw;


}
.hmbnnr3 .owl-next{
    right:8%;
    top: 45%;
    position: absolute;
    background: url(../assets/img/Right.png) !important;
    background-size: 100%!important;
    width: 5%!important;
    padding: 15% 0% !important;
    background-repeat: no-repeat!important;
    height: 8vw;
}

.hmbnnr5{
    padding: 3% 3% 3% 3%;
}
.hmbnnr5 h3{
    font-family: mm1;
    font-size: 3.5vw;
    color: #424242;
    text-align: center;
    margin-bottom: 3%;
}

        .slide img{
        	width: 150px;
        }
@-webkit-keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-250px * 7));
  }
}

@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-250px * 7));
  }
}

.hmbnnr5::before, .hmbnnr5::after {
  content: "";
  height: 100px;
  position: absolute;
  width: 200px;
  z-index: 2;
}
.hmbnnr5::after {
  right: 0;
  top: 0;
  transform: rotateZ(180deg);
}
.hmbnnr5::before {
  left: 0;
  top: 0;
}
.hmbnnr5 .slide-track {
  -webkit-animation: scroll 40s linear infinite;
          animation: scroll 40s linear infinite;
  display: flex;
}

.slide{
    width: 100%;
    margin: auto;
}
.hmbnnr5 .owl-nav{
    display: none;
}
/* Index page End */

/* About page Starts */
.aboutbannr{
    background-image: url(../assets/img/about/Layer2.jpg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 100%;
    position: relative;
    padding: 15% 0 9.5% 0; 
    margin-top: -1.5%; 
}
.aboutbannr h3{
    width: 67%;
    margin: auto;
    font-size: 5.5vw;
    color: #fff;
    text-shadow: 5px 4px #000;
}
.aboutbannrhm1{
    width: 75%;
    margin: 5% auto;
    position: relative;
}
.aboutbannrhm1 p{  
    font-family: mm7;
    font-size: calc(0.8vw + 0.85vh);
    color: #000;
    text-align: justify;
    font-weight: bold;
}
.aboutbnnhm1cyclimg{
    width: 22%;
    position: absolute;
    right: -27%;
    top: 26%;
    animation: rotate-animation 10s infinite linear;  
}
.aboutbnnhm1enginimg{  
    width: 11%;
    position: absolute;
    left: -16%;
    top: 39%; 
}
    @keyframes rotate-animation {
    0% {
        transform: rotate(0deg);
  }
  50% {
        transform: rotate(180deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
.aboutbnnhm1cyclimg img, .aboutbnnhm1enginimg img{
    width:100%;
}
.aboutbannrhm2{
    padding: 0 0 0 0;
}
.aboutbannrhm2innrsec{
    width:85%;
    margin: auto;
    position: relative;
}
.abouthmbnnr2{
    background-image: url(../assets/img/about/VectorSmartObject.png);
    background-repeat: no-repeat;
    background-size:cover;
    width: 100%;
    position: relative;
    padding: 15% 18% 26% 11%;
}
.abouthmbnnr2 h3{
    font-family: 'mm1';
    font-size: 3.5vw;
    color: #000;
    text-align: center;
}
.aboytbnn2mss{
    transform: rotate(-2.5deg);
    padding: 7% 0 0 0;
}
.abouthmbnn2mission p{  
    font-family: mm7;
    font-size: calc(0.85vw + 0.95vh);
    color: #000;
    text-align: justify;
    font-weight: bold;
    line-height: 1.1;
    
}
.aboytbnn2vis{
    transform: rotate(2.5deg);
    padding: 7% 0 0 0;
}
.abouthmbnn2vision p{
    font-family: mm7;
    font-size: calc(0.85vw + 0.95vh);
    color: #000;
    text-align: left;
    font-weight: bold;
}
.abouthmbnnr2img2 h3{
    font-family: 'mm1';
    font-size: 3.5vw;
    color: #000;
    text-align: center;
}
.abouthmbnnr2img2{
    background-image: url(../assets/img/about/VectorSmartObjectcopy.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    position: relative;   
    padding: 15% 17% 35% 15%;
    margin-top: 4%;  
}
.abouthmbnn2panaimg{
    width: 21%;
    position: absolute;
    left: 39%;
    top: 39%;
}
.abouthmbnn2panaimg img{
    width: 100%;
}
.aboutbnnhm3padelimg{
    width: 17%;
    position: absolute;
    right: -22%;
    top: -29%;
}

.aboutcychandle{
    width: 17%;
    position: absolute;
    left: -22%;
    top: -29%;

}
.aboutcychandle img, .aboutbnnhm3padelimg img{
    width:100%;
}
.abouthmbnnr3, .abouthmbnnr4, .aboutbannr5, .abouthmbnnr6{  
    width: 72%;
    margin: auto;
    padding: 0 0 3% 0;
    position: relative;
}
.abouthmbnnr3 h3, .abouthmbnnr4 h3, .aboutbannr5 h3, .abouthmbnnr6 h3{
    font-family: 'mm1';
    font-size: 3.5vw;
    color: #000;
    text-align: left;
    margin: 0;

}
.abouthmbnnr3vluelist ul li::marker, .abouthmbnn41 ul li::marker{
    color: #ffcf47;
    font-size: 1.8vw;
}
.abouthmbnnr3vluelist ul li{
    font-family: mm7;
    color: #000;
    font-size: 1.2vw;
    text-align: left;
    font-weight: bold;
    padding: 0% 0 1% 0;
}
.abouthmbnn41 ul li{
    font-family: mm7;
    color: #000;
    font-size: 1.2vw;
    text-align: left;
    font-weight: bold;
}
.abouthmbnnr3vluelist ul li span{
    color: #000;
    font-weight: bolder;
    font-size: 1.3vw;
    font-family: 'mm3';
}

.aboutbnnr5img{
    background-image: url(../assets/img/about/VectorSmartObject1.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    position: relative;   
    padding: 15% 107% 7.2955% 0;
    margin-top: 2%;
}
.aboutbnnr5img2{
    display: none;
}
.aboutbnnr5img2{
    position: relative;
}
.abouthmbnn5crl1{
    width: 120px;
    height: 120px;
    margin: auto;
    background: #ffd400;
    border-radius: 50%;
    position: relative;
}
.abouthmbnn5crl2{
    width: 120px;
    height: 120px;
    background:#08b100;
    border-radius: 50%;
    position: relative;
    margin: auto;
}
.abouthmbnn5crl3{
    width: 120px;
    height: 120px;
    background: #ff2a1f;
    border-radius: 50%;
    position: relative;
    margin: auto;
}
.abouthmbnn5crl4{
    width: 120px;
    height: 120px;
    background:#258bff;
    border-radius: 50%;
    position: relative;
    margin: auto;
}

.abouthmbnn5name1 p, .abouthmbnn5name2 p, .abouthmbnn5name3 p, .abouthmbnn5name4 p {
    font-family: mm7;
    color: #000;
    font-size:calc(0.85vw + 0.95vh);
    text-align: center;
    font-weight: bold;
    margin: 0;
} 
.abouthmbnn5name1{
    position: absolute;
    top: 50%;
    left: 3.5%;
    transform: translate(50%, -50%);
}
.abouthmbnn5name2{
    position: absolute;
    top: 50%;
    left: 30.5%;
    transform: translate(50%, -50%);
}
.abouthmbnn5name3{
    position: absolute;
    top: 45%;
    right: 38.5%; 
    transform: translate(50%, -50%);
}
.abouthmbnn5name4{
    position: absolute;
    top: 50%;
    right: 14.5%;
    transform: translate(50%, -50%);
}
/* About page End */
/* infrastructura page Starts */
.infrahmbnn1{  
    background-image: url(../assets/img/infrastructure/infrbnn1.jpg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 68%;
    position: relative;
    padding: 9% 0 15.6% 0;
    margin-top: -1.6%;
    z-index: 9;
}
.infrahmbnn1 h3{
    font-family: 'mm1';
    font-size: 3.5vw;
    color: #fff;
    text-align: end;
    margin-right: 10%;
}
.infrahmbnnr2{
    padding: 0 19% 0 44%;
    margin-top: -14%;
    position: relative;
}
.infrahmbnnr2text1{
    background-color: #ed1c24;
    padding: 2% 2% 2% 2%;
    position: absolute;
    z-index: 9;
    top: 6%;
    left: 46%;
    right: 13%;
    height: 90%;
}
.infrahmbnnr2text1 p{
    font-family: mm7;
    color: #fff;
    font-size: calc(0.65vw + 0.75vh);
    text-align: justify;
    font-weight: bold;
    line-height: 1.8;
}
.infrahmbnnr2bdr{
   background-image: url(../assets/img/infrastructure/Rectangle1.png);
   background-size: 100% 100%;
   width: 100%;
   position: relative;
   padding: 9% 0% 77% 0%;
   background-repeat: no-repeat;
   height: 100%;
}
.infrahmbnnr2hotimg{
    position: absolute;
    width: 12.5%;
    left: 23%;
    bottom: -15%;
    z-index: 9;
}
.infrahmbnnr2hotimg img{
    width: 100%;
}

.infrahmbnnr3{
   background-image: url(../assets/img/infrastructure/Layer5.jpg);
   background-size: 100%;
   width: 100%;
   position: relative;
   padding: 10% 0% 5% 0%;
   margin: 3% 0 0 0;
   background-position: center;
   background-attachment: fixed;
   background-repeat: no-repeat;
}

.infrahmbnnr4{
    padding: 0.5% 5% 8% 10%;
    position: relative;
    margin-bottom: 10%;
}
.infrahmbnn4rgt{
    background-image: url(../assets/img/infrastructure/Rectangle1copy2.png);
    background-size: 93% 100%;
    width: 89%;
    position: relative;
    padding: 11% 0% 70% 0%;
    background-repeat: no-repeat;
    margin-top: 35%;
    margin-left: auto;
    height: 62%;    
}
.infrahmbnn4lft{
    background-image: url(../assets/img/infrastructure/Rectangle1copy2.png);
    background-size: 88% 100%;
    width: 69%;
    position: relative;
    padding: 9% 0% 52% 0%;
    background-repeat: no-repeat;
    margin-left: auto;
    height: 60%; 
}
.infrahmbnnr4spareprt{
    width: 29%;
    position: absolute;
    top: 13%;
    left: 15%;
}
.infrahmbnnr4sparemkr{
    width: 49%;
    position: absolute;
    top: 2%;
    left: 41%;
}
.infrahmbnnr4sparemkr img, .infrahmbnnr4spareprt img, .infrahmbnnr42ndsparemkr img, .infrahmbnnr42ndspareprt img{
    width:100%;
}
.infrahmbnn4dttl{ 
    background-image: url(../assets/img/infrastructure/VectorSmartObject.png);
    background-size:cover;
    width: 85%;
    position: relative;
    padding: 3% 0% 3% 0%;
    background-repeat: no-repeat;
    margin: auto;
    margin-top: 1%;
}
.infrahmbnn4dttl p, .infrahmbnn4rgtdttl p, .infrahmbnn42nddttl p, .infrahmbnn42ndrgtdttl p{ 
    font-family: mm7;
    color: #000;
    font-size: calc(0.95vw + 0.95vh);
    text-align: center;
    font-weight: bold;
    line-height: 0.8;

}
.infrahmbnn4rgtdttl{
    background-image: url(../assets/img/infrastructure/VectorSmartObject3.png);
    background-size:cover;
    width: 83%;
    position: relative;
    padding: 2% 0% 2% 0%;
    background-repeat: no-repeat;
    margin: auto;
    margin-top: 5%;

}
.infrahmbnn42nd{
    background-image: url(../assets/img/infrastructure/Rectangle1copy2.png);
    background-size: 90% 100%;
    width: 89%;
    position: relative;
    padding: 0% 0% 0% 0%;
    background-repeat: no-repeat;
    margin-left: auto;
    margin-top: 16%;
    height: 100%;

}
.infrahmbnnr42ndsparemkr{
    width: 47%;
    position: absolute;
    bottom: 20%;
    left: 43%;
}
.infrahmbnn42ndlft{
    background-image: url(../assets/img/infrastructure/Rectangle1copy2.png);
    background-size: 86% 100%;
    width: 63%;
    position: relative;
    padding: 9% 0% 48% 0%;
    background-repeat: no-repeat;
    margin-left: auto;
    margin-top: -15%;
        height: 80%;

}
.infrahmbnnr42ndspareprt{
    width: 30%;
    position: absolute;
    left: 15%;
    bottom: -1%;
    z-index: 99;
}
.infrahmbnn42nddttl{
    background-image: url(../assets/img/infrastructure/VectorSmartObject3.png);
    background-size: cover;
    width: 83%;
    position: relative;
    padding: 2% 0% 2% 0%;
    background-repeat: no-repeat;
    margin: auto;
    margin-top: 3%;

}
.infrahmbnn42ndrgtdttl{
    background-image: url(../assets/img/infrastructure/VectorSmartObject3.png);
    background-size:cover;
    width: 75%;
    position: relative;
    padding: 2% 0% 2% 0%;
    background-repeat: no-repeat;
    margin: 10% 0% 0 20%;

}
/* infrastructura page End */
/* career page Starts */
.carrhmbnn1{
    background-image: url(../assets/img/Career/Layer21.jpg);
    background-size:cover;
    width: 100%;
    position: relative;
    padding: 12% 0% 11% 0%;
    background-repeat: no-repeat;
    margin-top: -2%;
}
.carrhmbnnr1hding{
    padding: 0 0 0 14%;
}
.carrhmbnnr1hding h3{
    font-family: mm1;
    font-size: 5.5vw;
    color: #fff;
    text-align: left;
}
.carrhmbnnr1hding p{
    font-family: mm7;
    color: #fff;
    font-size: calc(1vw + 1.1vh);
    text-align: left;
    font-weight: bold;
    margin-bottom: 0.5%;
}

.carrhmbnn2{
    padding: 8% 3% 0 10%;
    position: relative;
}
.carrhmnmmr2sticky1{
    background-image: url(../assets/img/Career/VectorSmartObject.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    position: relative;
    padding: 15% 18% 22% 12%;

}
.carrhmbnnr2stckinnr{
    transform: rotate(-2deg);
    text-align: center;
}
.carrhmbnnr2stckinnr12{
    transform: rotate(-2deg);
    text-align: center;
    padding: 8% 0% 7% 0%;

}
.carrhmbnnr2stckinnr h3, .carrhmbnnr2stckinnr12 h3 {
    font-family: 'mm1';
    font-size: 2.5vw;
    color: #000;
    text-align: center;   
    margin: 0;
}
.carrhmbnnr2stckinnr2{ 
    transform: rotate(-0.5deg);
}
.carrhmbnnr2stckinnr3{
    transform: rotate(-0.5deg);
}
.carrhmbnnr2stckinnr2 p, .carrhmbnnr2stckinnr3 p{
    font-family: mm3;
    font-size: calc(0.85vw + 0.95vh);
    color: #000;
    text-align: justify;
    line-height: 1.1;
}

.crrhmbnnr3{
    padding: 2% 0 3% 0;
}
.crrhmbnn3formnme{
    display: grid;
}
.crrhmbnnr3 h3{
    font-family:mm1;
    font-size: 2.5vw;
    color: #000;
    text-align: center; 
}
.crrhmbnnr3form{
    background-color:#f0f0f0;
    width: 95%;
    margin: auto;
    padding: 4% 12% 4% 12%;
    margin-top: 1%;
}
.crrhmbnn3formnme label{
    font-family: mm3;
    font-size: 0.9vw;
    color: #000;
    text-align: left;
    font-weight: bold;
    margin-bottom: 1%; 
}
.crrhmbnnr3gndr{
   margin-bottom: 0!important; 
}
.crrhmbnnr3frminr{
    padding: 4% 0 0 0;
}
.crrhmbnn3formnme input[type="radio"]{
    background: unset;
}
.crrhmbnn3formnme input, .crrhmbnn3formnme select{
    border: 1px solid #9e9ea0;
    border-radius: 45px;
    padding: 2% 5%;
    background: #fff;
}
/*.crrhmbnn3formnme textarea{*/
/*    border: 1px solid #9e9ea0;*/
/*    border-radius: 22px;*/
/*    padding: 4% 5%;*/
/*}*/
::placeholder,.crrhmbnn3formnme select {
    color: #9d9ea2;
    opacity: 1; 
    font-family: mm4;
    font-size: 0.9vw;
}
.select_box:after{
    border-bottom-style: solid;
    border-bottom-width: 3px;
    border-right-style: solid;
    border-right-width: 3px;
    content: "";
    display: inline-block;
    height: 12px;
    right: 5%;
    position: absolute;
    top: 60%;
    width: 12px;
    transform: rotate(45deg);
}
.select_box select{
   appearance: none;
}
.select_box{
  position: relative;
}
.crmform3rd{
    display: flex;
    align-items: center;

}
.crmhmbnnr3btn{
    text-align: center;
    padding: 10% 0 0 0;
}
.crmhmbnnr3btn input{
    font-family: mm3;
    font-size: calc(0.8vw + 0.8vh);
    padding: 0.8% 5% 0.8% 5%;
    text-align: center;
    color: #fff;
    background: #ec1d23;
    border: none;
    border-radius: 25px;
}
.aboutcychandle2{
    width: 12%;
    position: absolute;
    left: 0%;
    top: 12%;

}
.aboutcychandle3{
    width: 6%;
    position: absolute;
    right: 3%;
    bottom: -11%;
    transform: rotate(61deg);

}
.aboutcychandle2 img, .aboutcychandle3 img{
    width:100%;
}
/* career page End */


/*product page start*/
.producthmbnnr1{
    background-image: url(../assets/img/product/Layer21.jpg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 100%;
    position: relative;
    padding: 13% 0 7% 16%;
    margin-top: -1.7%;   
}
.producthmbnnr1 h3{
    font-family: mm1;
    font-size: 5.5vw;
    color: #fff;
    text-align: left;
    line-height: 0.9;
    text-shadow: 2px 3px #000000a6;
}
.producthdr h3{font-family: mm1;
    font-size: 3.5vw;
    color: #7c7979;
    text-align: center;}
.producthdr{
    padding: 5% 0;
}
.prodt{
    margin: 0.5%;
    width: 18%;
}
.prdctctgry {
    width: 90%;
    margin: auto;
    padding: 5% 0% 2% 0%;
}
.prdctctgrylist {
    display: flex;
    align-items: center;
    justify-content: center;
}
.prdctitem {
    font-family: mm3;
    font-size: calc(0.7vw + 0.8vh);
    color: #000;
    cursor: pointer;
    text-align: center;
    padding: 5% 0 5% 0;
    transition: all 0.4s;
}
.prodbrdr{
    position: relative;
    z-index: 1;
    border-right: 3px solid #000;
    padding: 0 5%;
    font-family:mm3;
    font-size: 1.2vw;
}
#c4 .prodbrdr{
    border-right:none;
}
.prdcts {
    width: 70%;
    margin: auto;
    padding: 0 0 5% 0;
}
.mainpgprod img {
    width: 100%;
    transition: all 1s;
}
.mainpgprod {
    margin: 0 0 5% 0;
}
.filter.active {
        margin: auto;
    border-bottom: 3px solid #000;
    width: 85%;
}
.box{
    font-family: 'Mandali', sans-serif;
    text-align: center;
    overflow: hidden;
    position: relative;
}
.box:before,
.box:after{
    content: "";
    background: rgba(71,74,86,0.51);
    width: 200%;
    height: 200%;
    opacity: .75;
    transform: skew(45deg) translateX(100%);
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 1;
    transition: all .6s ease;
}
.box:after{
    transform: skew(45deg) translateX(-100%);
    top: 0;
    left: 0;
    right: auto;
    bottom: auto;
    z-index: 0;
}
.box:hover:before,
.box:hover:after{
    transform: skew(45deg) translateX(0);
}
.box img{
    width: 100%;
    height: auto;
    transition: all 0.35s;
        border: 2px solid #c1c1c1;
}
.box:hover img{ opacity: 0.5; }
.box-content{
    color: #fff;
    width: 85%;
    opacity: 0;
    transform: translateX(-50%) translateY(-50%);
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    transition: all 0.6s ease;
}
.box:hover .box-content{ opacity: 1; }
.box .title{
    font-size: 22px;
    font-weight: 600;
    letter-spacing: 1px;
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
    margin: 0 0 3px;
}
.box .post{
    font-size: 14px;
    font-weight: 200;
    letter-spacing: 1px;
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
    margin: 0 0 10px;
    display: block;
}
.box .icon{
    padding: 0;
    margin: 0;
    list-style: none;
}
.btn-close-modalx {
    background-color: #1AAB8A;
    color: #fff;
    font-size: 16px;
    font-family: 'Ubuntu', sans-serif;
    border: none;
    outline: none;
    padding: 7px;
    letter-spacing: 2px;
    border-radius: 2px;
    transition: 0.3s;
    margin-top: 14px
}
.btn-close-modalx:hover {
    -webkit-transform: translateY(-3px);
    -ms-transform: translateY(-3px);
    transform: translateY(-3px);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2)
}
.txt-modalx {
    font-family: 'Ubuntu', sans-serif;
    padding: 0 15px 0 15px
}
.txt-destaque1 {
    font-weight: 800;
    color: #B22222;
    font-family: 'Ubuntu', sans-serif
}
.body-modalx {
    max-width: 700px;
    background-color: rgba(255, 255, 255, 0.95);
    padding: 15px 15px 15px 15px;
    border-radius: 2px;
    -webkit-box-shadow: 0px 0px 25px 6px rgba(0, 0, 0, 0.32);
    -moz-box-shadow: 0px 0px 25px 6px rgba(0, 0, 0, 0.32);
    box-shadow: 0px 0px 25px 6px rgba(0, 0, 0, 0.32)
}
.popup_visible #modalx-slideDown {
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown;
    -webkit-animation-duration: 0.4s;
    animation-duration: 0.4s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}
@-webkit-keyframes slideInDown {
    0% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
        visibility: visible
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}
@keyframes slideInDown {
    0% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
        visibility: visible
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}      
#modalx-slideDown {
    -webkit-animation-name: bounceOut;
    animation-name: bounceOut;
    -webkit-animation-duration: 0.4s;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.7s;
    animation-duration: 0.7s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}
@-webkit-keyframes bounceOut {
    20% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    50%,
    55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    100% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
}
/*product page End*/
/*contact us*/
.conmtactimg{
    width: 30%;
    margin: 2% auto;
}
.conmtactimg img{
width:100%;
}
/*contact us end*/
/* Footer Starts */
.footer{
    background-image: url(../assets/img/footer.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    position: relative;
    padding: 2% 3% 5% 7%;

}
.footerlogo{
    width: 15%;
    margin-right: auto;
    padding-bottom: 1%;
}
.footerlogo img{
    width: 100%;
}

.ftthm1text h3{
    font-family:mm3;
    font-size: 2.3vw;
    color: #fff;
    text-align: left;
    margin-bottom: 0%;
}
.ftthm1text p{
    font-family: mm7;
    font-size: calc(0.85vw + 0.9vh);
    color: #fff;
    text-align: left;
    line-height: 1.2;
}
.fttrhm1{
    padding: 0% 0 3% 0;
}

.fttrmgnbmnhf{
    padding: 3% 0 3% 0; 
}
.fttrhm2qicklik h4{
    font-family:mm3;
    font-size: 1.7vw;
    color: #fff;
    text-align: left;
    margin: 0 0 3% 0;
}
.fttmhm2innrdttl{
    display: flex;
    align-items: center;
    padding: 1.5% 0 1.5% 0;
}
.hdrcatdrpshop3{
   padding: 0.2% 1%;
    margin: 0;
    overflow: hidden;
    z-index: 100;
    border-top: 0;
    display: none;
    position: absolute;
    text-align: left;
    right:25%;
    box-shadow: 4px 4px 4px 4px #00000040;
    opacity: 0;
    background-color: #2f0507;
    visibility: hidden;
    animation: growDown 300ms ease-in-out forwards;
    transform-origin: top center;
    transition: all .3s ease-in-out 0s;
}
#hdrcrrbtn3:hover .hdrcatdrpshop3{
    padding: 0.2% 1%;
    margin: 0;
    overflow: hidden;
    z-index: 100;
    border-top: 0;
    display: block;
    position: absolute;
    text-align: left;
    right: 25%;
    box-shadow: 4px 4px 4px 4px #00000040;
    opacity: 1;
    background-color: #2f0507;
    visibility: visible;
    animation: growDown 300ms ease-in-out forwards;
    transform-origin: top center;
    transition: all .3s ease-in-out 0s;
}
@-moz-keyframes growDown {
  0% {
    transform: scaleY(0);
  }
  80% {
    transform: scaleY(1.1);
  }
  100% {
    transform: scaleY(1);
  }
}
@-webkit-keyframes growDown {
  0% {
    transform: scaleY(0);
  }
  80% {
    transform: scaleY(1.1);
  }
  100% {
    transform: scaleY(1);
  }
}
@-o-keyframes growDown {
  0% {
    transform: scaleY(0);
  }
  80% {
    transform: scaleY(1.1);
  }
  100% {
    transform: scaleY(1);
  }
}
@keyframes growDown {
  0% {
    transform: scaleY(0);
  }
  80% {
    transform: scaleY(1.1);
  }
  100% {
    transform: scaleY(1);
  }
}
.hdrcatdrpshop3 .drop1{
    list-style:none;
    color: #fff;
    padding:0;
}
.ftthm2cllimg{
    width: 35px;
}
.ftthm2cllimg2{
    width: 42px
}
.ftthm2cllimg3{
   width: 35px
}
.ftthm2cllimg img, .ftthm2cllimg2 img, .ftthm2cllimg3 img{
    width: 100%;
}
.fttmserv1{
    margin-bottom: 3%!important;

}
.fttmhm2cllno{
    list-style: none;
    padding-left: 3%;
    margin: 0;
}
.fttmhm2srvc{
    list-style: none; 
    padding: 4% 0 0 0;
}
.fttmhm2cllno li a,.fttmserv1 a, .fttmhm2srvc li,.fttmserv1 a{
    font-family: 'mm3';
    font-size: calc(0.8vw + 0.85vh);
    color: #fff;
    margin: 0;
    line-height: 1;
    text-decoration: none;
}
.fttrhmbnn3 h4{
    font-family:mm3;
    font-size:1.7vw;
    color: #fff;
    text-align: center;
    margin-bottom: 1%;
    
}
.fttrhmbnn3 p{
    font-family: mm3;
    font-size: calc(0.8vw + 0.85vh);
    color: #fff;
    text-align: center;
    margin: 0;
}
.fttrhm3form input[type="text"]{
    width: 100%;
    border-radius: 35px;
    padding: 4% 6%;
}
.fttrhm3form ::placeholder{
    color: #9d9ea2;
    opacity: 1; 
    font-family: mm4;
    font-size: 0.9vw;
}
.fttrhm3form {  
    text-align: center;
    padding: 3% 0 0 0;
}
.fttrhm3form input[type="submit"]{
    background: unset;
    border: 2px solid #fff;
    border-radius: 45px;
    color: #fff;
    padding: 2% 10% 2% 10%;
    font-size: 1.02vw;
    font-family: 'mm3';
}
.fttrhm2rgtlttrscolicn{
    margin-top: -2%;
}
.fttrlastsection{
    margin: 0 15% 0 3%;
}
.fttrlastsection hr{
    color: #434540;
    height: 3px;
    opacity: 1;
    width: 100%;
}
.fttrsocilimg{
    margin: 0 2% 0 0%;
    width: 42px;
}
.fttlst span{
    color: #00fcff;
    font-family: 'mm3';
    font-size: 0.8vw;
}
.ftthm1innrghygf2{display: none;}
.fttsocail{
    align-items: center;
}
.fttrsocialdesgn{
    width: 100%;
}
.fttrsocialdesgn img{
    width: 100%;
}
.fttrhdrsocilimgs{
    display: flex;
    align-items: center;
    justify-content: center;
}
.fttrarrwhatsap{
    width: 34%;
    margin-left: auto;
}
.topicon{
    width: 25%;
    padding-bottom: 5%;
}
.whatsapp{
    position: fixed;
    bottom: 40px;
    left: 1.5%;
    z-index: 9999;
    width: 50px;
}
.whatsapp img, .chotalogo img{
    width: 100%;
}
.chotalogo{
    position: fixed;
    bottom: 110px;
    left: 1.5%;
    z-index: 9999;
    width: 70px;
}
.topicon img, .whatsapp img{
    width: 100%;
}
/* Footer ends */

/**/
.policyhmbnnr1{
        text-align: center;
        width: 83%; 
        margin: auto;
}
.policyhmbnnr1 h3{
    margin:3% auto;
}
.policyhmbnnr1 h4,    .policyhmbnnr1 ul li, .policyhmbnnr1 ol li{
        text-align: left;
            font-size: 19px;
}
    .policyhmbnnr1 p{
    text-align: justify;
           font-size: 19px;
    }
   .policyhmbnnr1 ul {
    margin-left: 20px;
    list-style-type: disc;
    
}

.policyhmbnnr1 strong {
    color: #000;
}
/**/



/* Inner Footer Starts */




/* Inner Footer ends */




#preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 50000 ;
}
#loader-img {
    display: block;
    position: relative;
    top: 35%;
    width: 31%;
    height: 27%;
    margin: auto;
    z-index: 1001;  
    background-image: url(../assets/img/sshape-1.png);
    background-repeat: no-repeat;
    background-size: 50%;
    background-position: center;
    animation: bounce  2s  infinite;
    
    z-index: 1020;
}
@-webkit-keyframes spin {
    0%   {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes spin {
    0%   {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.loader-section {
    position: fixed;
    top: 0;
    width: 51%;
    height: 100%;  
    background: #fff;
    z-index: 1000;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0)
}

.loader-section.section-left {
    left: 0;
}

.loader-section.section-right {
    right: 0;
}

.panel_left {
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transition: all .7s .3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition: all .7s .3s cubic-bezier(0.645, 0.045, 0.355, 1.000)
}

.panel_right {
    -webkit-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: all .7s .3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition: all .7s .3s cubic-bezier(0.645, 0.045, 0.355, 1.000)
}

.loaded-circle {
    opacity: 0;
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out
}

.loaded-img {
    visibility: hidden;
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-transition: all .3s 1s ease-out;
    transition: all .3s 1s ease-out
}
