.montserrat-<uniquifier> {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
html { scroll-behavior: smooth; } 
body {  font-family: "Montserrat", sans-serif; font-weight: 400;background: #ffffff; font-size: 17px; margin: 0; color: #212529; } 
* { box-sizing: border-box; }
p { font-size: 14px; margin: 0; padding: 0; }
a{text-decoration: none }
img{width: 100%; height: auto}
h1, h2, h3, h4{ padding: 0; margin: 0;}
/* For Webkit Browsers (Chrome, Safari) */ ::-webkit-scrollbar { display: none; } /* For Firefox */ html { scrollbar-width: none; } /* For IE & Edge */ body { -ms-overflow-style: none; }
  .btn { background: rgba(254, 207, 27, 1); border: none; padding: 15px 30px 13px 30px; border-radius: 50px; cursor: pointer; font-weight: 600; font-size: 16px; line-height: 16px; transition: background 0.3s ease; display: inline-block} 
 .btn:hover { background: #e1b90d; } 

.mainwapper { margin: 0; padding: 0;overflow-x: hidden } 
.container { width: 95%; max-width: 1360px;  margin:0 auto; } 
.header { background: tranparent; padding: 10px 0px; height: auto; width: 100%; position: relative; left: 0; top:0; margin: auto ; transition: background-color 0.4s ease-in-out, top 0.4s ease-in-out;} 
.header.active{ background:#fff; position: fixed; left: 0; top:0; height: auto; width: 100%;  transition: background-color 0.4s ease-in-out, top 0.4s ease-in-out; z-index: 2; padding: 10px 0px;}
.header .container{display: flex; justify-content: space-between; align-items: center; height: 100%; }
.header .logo { width: 200px; height: auto; display: inline-block}
.header.active .logo{ width: 160px; }


.header .menu{display: flex;flex-flow: row;align-items: center;}
.header .menu .linkItem{height: 100%;display: flex;align-items: flex-start;position: relative;color: #000000;margin:0 40px 0 0;justify-content: start;height: auto; padding-bottom: 0px; border-bottom: 1px solid transparent; font-size: 16px; }
.header .menu .linkItem:hover{color: #fecf1b; border-bottom: 1px solid #fff; transition: color 0.3s ease-in-out, border-bottom-color 0.3s ease-in-out;}
.header .menu .linkItem.active{height: 100%;display: flex;align-items: flex-start;position: relative;color: #fecf1b;margin:0 40px 0 0;justify-content: start;height: auto; padding-bottom: 0px; border-bottom: 1px solid #fff;  }

.header .menu .linkItem.btn{height: 100%;display: inline-block;align-items: start;position: relative;color:  #000;padding:15px 20px;background-color: #F7A707;height: auto;width: auto;justify-content: left; border-bottom: 0;; }

.header .menu .linkItem.call { position: relative;  padding-left: 30px; cursor: pointer;  transition: color 0.3s ease-in-out, border-bottom-color 0.3s ease-in-out;}
.header .menu .linkItem.call i { width: 21px; height: 21px; background: url("../images/icon-call.png") no-repeat; background-position: left top; position: absolute; left: 0; top: 0px; bottom:0; margin: auto; transition: background-position 0.3s ease-in-out; background-size: 100% auto; } 
.header .menu .linkItem.call:hover { color: #fecf1b;  } 
.header .menu .linkItem.call:hover i { background-position: left -21px; }

.header .menu .linkItem.email { position: relative;  padding-left: 30px; cursor: pointer;  transition: color 0.3s ease-in-out, border-bottom-color 0.3s ease-in-out;}
.header .menu .linkItem.email i { width: 21px; height: 21px; background: url("../images/icon-mail.png") no-repeat; background-position: left top; position: absolute; left: 0; top: 0px; bottom:0; margin: auto; transition: background-position 0.3s ease-in-out; background-size: 100% auto; } 
.header .menu .linkItem.email:hover { color: #fecf1b;  } 
.header .menu .linkItem.email:hover i { background-position: left -21px; }

.Banner-Section{position: relative; }
.Banner-Section .img{height: 100vh}
.Banner-Section .shedow{  width: 100%; height: 100%; position: absolute; left: 0; top:0; margin: auto ; background: rgba(0,0,0,0.9);
background: -moz-linear-gradient(left, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,0,0,0.9)), color-stop(100%, rgba(0,0,0,0)));
background: -webkit-linear-gradient(left, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 100%);
background: -o-linear-gradient(left, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 100%);
background: -ms-linear-gradient(left, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 100%);
background: linear-gradient(to right, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=1 );}

.bannertext{  width: 100%; height: calc(100% - 180px); position: absolute; left: 0; top:0; margin: auto ;}


.bannertext .container{ height: 100%; display: flex ; flex-flow: row; align-items: center;}
.bannertext .text1{ font-weight: 700; font-size: 60px; line-height: 1.3em; color: #fff; margin: 0; padding: 0;}
.bannertext .text1 span{ font-weight: 400; font-size: 30px; line-height: 0.3em; color: #fff; margin: 0; padding: 0;}

.Formbox{width: 100%; max-width: 1360px;  max-height: 89px; position: fixed; left: 0; bottom:20px; right: 0; margin: auto; z-index: 999;  display: flex;flex-flow: row;align-items: center; justify-content: space-between; }
.Formbox .form { width: 100%; max-width: 1260px;    max-height: 89px; padding: 20px; background-color: rgba(255, 255, 255, 1);  border-radius: 14px; -webkit-box-shadow: 0px 10px 10px 0px rgba(212,212,212,1);
-moz-box-shadow: 0px 7px 6px 0px rgba(0, 0, 0, 0.6);
box-shadow: 0px 7px 6px 0px rgba(0, 0, 0, 0.6);}
.form-container  .heading{font-size: 21px; color: #000; font-weight: 700; line-height: 23px; width: 300px;}
.form-container  .heading span{font-size: 16px; color: #000; font-weight: 500; text-transform: uppercase}
.form-container { display: flex ; align-items: center; flex-flow: row; justify-content: space-around;} 
.form-container  .input-field { position: relative; margin: 0 20px; } 
.form-container  .input-field input { width: 201px; padding: 10px; border: 1px solid rgba(0, 0, 0, 1); border-radius: 5px; outline: none; transition: all 0.3s ease-in-out; font-size: 14px; font-weight: 500; padding-bottom: 15px; } 
.form-container  .input-field input.email { width: 244px;}
.form-container  .input-field label { position: absolute; left: 12px; top: 12px; font-size: 16px; color: #888; transition: all 0.3s ease-in-out; pointer-events: none; background: white; padding: 0 5px; }
.form-container  .input-field input:focus + label, .form-container  .input-field input:not(:placeholder-shown) + label { top: -8px; left: 10px; font-size: 12px; color: rgba(155, 155, 155, 1); } 
.form-container  .input-field input:focus { border-color: rgba(254, 207, 27, 1); box-shadow: 0px 0px 5px rgba(254, 207, 27, 1); } .input-field input.invalid { border-color: red; box-shadow: 0px 0px 5px red; } 
.form-container  .error-message { font-size: 11px; color: red; position: absolute; left: 12px; top: 45px; display: none; }
.form-container  .btn { background: rgba(254, 207, 27, 1); border: none; padding: 15px 18px 13px 18px; border-radius: 50px; cursor: pointer; font-weight: 600; font-size: 16px; line-height: 16px; transition: background 0.3s ease; } 
.form-container  .btn:hover { background: #e1b90d; } 
.thank-you { display: none; text-align: center; font-size: 20px; font-weight: bold; color: #2ecc71; }

.Formbox .whatappicon{width: 91px; }
.gap{ padding: 30px 0;}
.bg{background-color: rgba(245, 245, 245, 1)}
.Second-section{text-align: center;  }
.Second-section .heading{font-size: 31px; color: #000; font-weight: 700; line-height: 23px;  text-transform: uppercase; padding: 20px 0}

.Second-section .t1{font-size: 18px; color: #000; font-weight: 400; line-height:22px; margin-top: 20px;}

.Imagecontainer { display: grid; grid-template-columns: repeat(auto-fit, minmax(48%, 1fr)); width: 100%; gap: 40px;margin: 50px auto; padding: 20px; } 
.image-box { position: relative; overflow: hidden;  } 
.image-box img { width: 100%; height: auto; display: block; transition: transform 0.3s ease, box-shadow 0.3s ease; } 
.image-box:hover img { transform: scale(1.05); box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.3); } 

.image-box .shedow{background: rgba(210,255,82,0);
background: -moz-linear-gradient(top, rgba(210,255,82,0) 0%, rgba(0,0,0,0.9) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(210,255,82,0)), color-stop(100%, rgba(0,0,0,0.9)));
background: -webkit-linear-gradient(top, rgba(210,255,82,0) 0%, rgba(0,0,0,0.9) 100%);
background: -o-linear-gradient(top, rgba(210,255,82,0) 0%, rgba(0,0,0,0.9) 100%);
background: -ms-linear-gradient(top, rgba(210,255,82,0) 0%, rgba(0,0,0,0.9) 100%);
background: linear-gradient(to bottom, rgba(210,255,82,0) 0%, rgba(0,0,0,0.9) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2ff52', endColorstr='#000000', GradientType=0 ); width: 100%; height: 100%; position: absolute; left: 0; bottom: 0; z-index: 1; transition: opacity 0.5s ease-in-out;  opacity: 1;}

.image-box:hover .shedow {
 opacity: 0;  transition: opacity 0.5s ease-in-out; 
}

.caption { position: absolute; bottom:25px; left: 30px;  color: #fff;  font-size: 24px; font-weight: 600; text-transform: uppercase; z-index: 2}

.counter-section { display: flex; justify-content: space-around; gap: 50px; margin: 80px 0;  }
.counter { font-size: 72px; font-weight: 500; color: black; text-align: left; position: relative }

.counter-section .text{text-align: left; font-weight: 300; font-size: 32px; color: rgba(137, 137, 137, 1); }
.counter-section .text div{position: relative; display: inline-flex}

.plush-icon{width: 37px; height: 37px; position: absolute; right: -43px; top: 0;}

.clients-section { width: 100%; max-width:1162px; margin: 30px auto 0 auto; padding: 0px; text-align: center; }
.clients-section a { display: inline-block; margin: 10px; border: 0px solid transparent; transition: border 0.3s ease-in-out; } 
.clients-section a:hover { border: 0px solid #fecf1b;  }
.clients-section img { height: 80px; width: auto; }

.thired-section{text-align: center;  }
.thired-section .heading{font-size: 31px; color: #000; font-weight: 700; line-height: 23px;  text-transform: uppercase; padding: 20px 0}
.footertext{font-size: 14px; font-weight: 400; text-align: center; padding: 30px 0;}
@media (max-width: 1420px) { 
.Banner-Section .img{height: auto}
}

@media (max-width: 1320px) { 
	.form-container .input-field{    margin: 0 10px;}
	.form-container .input-field input{    width: 164px;}
	.form-container .input-field input.email{    width: 200px;}
	
}
@media (max-width: 1140px) { 
	.form-container .input-field{    margin: 0 0px;}
	.form-container .input-field input{    width: 144px;}
	.form-container .input-field input.email{    width: 190px;}
}
@media (max-width: 1095px) { 
	.form-container .input-field{    margin: 0 0px;}
	.form-container .input-field input{    width: 144px;}
	.form-container .input-field input.email{    width: 190px;}
	.form-container .heading{font-size: 23px; color: #000; font-weight: 700; line-height: 23px; width: 212px;}
	.form-container .heading span{    font-size: 12px;}
	.form-container .btn{font-size: 14px;}
	
}


@media (max-width: 992px) { 
	.container { grid-template-columns: 1fr; width: 100% }
.counter-section { flex-direction: column; align-items: flex-start;     margin: 60px 35px; }
	.clients-section { display: flex; flex-direction: row; align-items: center; overflow-y: auto; max-height: 300px;  padding: 0 10px}
	.clients-section a { display: inline-block; margin: 0 8px;}
	.Imagecontainer{margin: 50px auto 20px auto; padding: 0;}
	.header .menu { display: flex; flex-flow: column; align-items: flex-end;}
	.header .menu .linkItem.call{ margin:0 0 10px 0;}
	.header .menu .linkItem.email{ margin: 0;}
	
	.Formbox{ width: 90%; min-height: 355px; position: absolute}
	.Formbox .form{min-height:355px; height: 100%;}
	.form-container{flex-flow: column}
	.Formbox .whatappicon{position: fixed; right: 10px; bottom: 10px; z-index: 999}
		.form-container .input-field{  width: 100%;   margin: 0 10px;}
	.form-container .input-field input{    width: 100%; margin-bottom: 25px;}
	.form-container .input-field input.email{    width: 100%;}
		.form-container .heading { font-size: 20px; color: #000; font-weight: 700; line-height: 23px; width: 100%;  text-align: center; margin-bottom: 20px;}
	.form-container .heading span { font-size: 16px; color: #000; font-weight: 500; text-transform: uppercase; }
	.form-container .btn{font-size: 14px; padding: 15px 20px 13px 20px;}
	.Second-section .t1{padding: 0 15px;}
	.header .container{padding: 0 10px;}
.bannertext{left: 35px;}
	.Second-section .t1 br{display: none}
	
	
} 
@media (max-width: 768px) { 
  .bannertext{top:11%; height: auto} 
		
}
@media (max-width: 680px) { 
  
  .bannertext{top:11%; height: auto} 
	.bannertext .text1{    font-size: 32px;}
	.bannertext .text1 span{ font-weight: 600; font-size: 13px; line-height: 20px !important;}

	.header .menu .linkItem{font-size: 11px;}
	.header .menu .linkItem.call, 	.header .menu .linkItem.email {    padding-left: 18px;}
	.header .menu .linkItem.call i{width: 12px; height: 12px; }
	.header .menu .linkItem.call:hover i, .header .menu .linkItem.email:hover i { background-position: left -12px; }
	.header .menu .linkItem.email i{width: 12px; height: 12px;}
	.Banner-Section .img{    height: 643px;}
	.Imagecontainer{        margin: 25px auto 20px auto;}
	.Formbox .whatappicon{width: 63px;}

}


@media (max-width: 480px) {
.form-container .btn{ width: 100%}
	.Second-section .heading{font-size: 30px; line-height: normal}
	.Second-section .t1{line-height: 150%; font-size: 14px;}
	.btn{font-size: 12px;}
	.footertext{font-size: 12px; font-weight: 400;}
	.thired-section .heading{font-size: 24px; padding-top: 0;}
	
}