*{
    font-family: 'Poppins', sans-serif;
}
:root{
    --bluer:39, 73, 151;
    --green:#80B559;
    --blue:#4560A3;
    --white:#fff;
    --black:0, 0, 0;
    --bigfont:50px;
    --title:50px;
    --smallfont:16px;
    --h3font:25px;
    --midfont:20px;
    --padt:80px;
    --padb:80px;
}
.bodyover{overflow: hidden;}
.centersection{ align-items: center;}
.sectionpad{ padding: 100px 0px;}
.sectionpadtop{ padding-top: 100px;}
.pad-30{ padding-top: 30px;}
/* button */
.knowmore a{ position: relative;  display: inline-block;  vertical-align: middle;  text-decoration: none;  background: transparent;  padding: 0;  font-size: inherit;  font-family: inherit;}
.knowmore a {  width: 12rem;  height: auto;}
.knowmore a .circle {  transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);  position: relative;  display: block;  margin: 0;  width: 3rem;  height: 3rem;  background: var(--green);  border-radius: 1.625rem;}
.knowmore a .circle .icon {  transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);  position: absolute;  top: 0;  bottom: 0;  margin: auto;  background: #fff;}
.knowmore a .circle .icon.arrow {  transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);  left: 0.625rem;  width: 1.125rem;  height: 0.125rem;  background: none;}
.knowmore a .circle .icon.arrow::before {  position: absolute;  content: "";  top: -0.25rem;  right: 0.0625rem;  width: 0.625rem;  height: 0.625rem;  border-top: 0.125rem solid #fff;  border-right: 0.125rem solid #fff;  transform: rotate(45deg);}
.knowmore a .button-text {  transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);  position: absolute;  top: 0;  left: 0;  right: 0;  bottom: 0;  padding: 0.75rem 0;  margin: 0 0 0 1.85rem;  color: #000;   line-height: 1.6;  text-align: center;  text-transform: uppercase;}
.knowmore a:hover .circle {  width: 100%;}
.knowmore a:hover .circle .icon.arrow {  background: #fff;  transform: translate(1rem, 0);}
.knowmore a:hover .button-text {  color: #fff;}
.textwhite .knowmore a .button-text{ color: #fff;}
.contactfooter i{ color: var(--green); font-size: var(--midfont);}
.contactfooter p{ color: var(--blue); font-size: var(--smallfont); margin: 0; font-weight: 600; padding: 5px 0px;}
.contactfooter p span{ color: var(--green);}
.contactfooter a{ color: var(--black); font-size: var(--smallfont);  text-decoration: none; transition: 0.5s;}
.contactfooter a:hover{ color: var(--blue);}
.contactfooter .gst{ color: var(--black); font-weight: 400;}
.copyright {  display: flex;  justify-content: space-between;     padding: 20px 0px;}
.copyright img {  width: 22px;}
.copyright p { margin: 0; font-size: var(--smallfont);}
/* button */

/* banner */
.bannercontent{ position: relative;}
.bannercontent img {  width: 100%; position: relative;}
.bannerabs{ position:absolute; top: 25%;  height: 100%; width: 100%;   }
.bannertext{ margin-left: 100px;  height: 100%; position: relative; z-index: 1;   display: flex;    flex-direction: column;    justify-content: center;}
.bannertext h1{ font-size: var(--bigfont); color: var(--white); position: relative; }
.bannertext h1::before {  content: "";  clip-path: polygon(0 40%, 100% 0%, 100% 70%, 0% 100%);  transition: 0.5s;  position: absolute;  width: 40px;  background-color: var(--green);  height: 55px;  top: -9px;  bottom: 0;  left: -10px;  z-index: -1;}
.bannertext p{font-size: var(--midfont); color: var(--white);}
.bannerslider .slick-next, .slick-prev{ bottom: 200px !important; top: auto !important; z-index: 3;}
.bannerslider .slick-prev {    left: 86% !important;}
.bannerslider .slick-next { right: 8% !important;}
.bannerslider .slick-next:before {    content: ''; }
.bannerslider .slick-prev:before { content: ''; }
.bannerslider .slick-next::after{content: '';  background-image: url(../images/arrowright.png); background-repeat: no-repeat; height: 50px;    width: 50px;    position: absolute;}
.bannerslider .slick-next:hover::after{ background-image: url(../images/arrowhoverright.png); background-repeat: no-repeat;}
.bannerslider .slick-prev::after{content: '';  background-image: url(../images/arrowleft.png); background-repeat: no-repeat; height: 50px;    width: 50px;    position: absolute;}
.bannerslider .slick-prev:hover::after{ background-image: url(../images/arrowhover.png); background-repeat: no-repeat;}
/* banner */

/* aboutus */
.titletext h2{ z-index: 1; font-size: var(--title); color: var(--blue); font-weight: 600; position: relative; display: inline-block; padding-bottom: 30px;}
.white h2{ color: var(--white);}
.center{ text-align: center; margin: 0 auto;}
.titletext h2 span{ color: var(--green);}
.titletext h2::before {  content: "";  clip-path: polygon(0 40%, 100% 0%, 100% 70%, 0% 100%);  transition: 0.5s;  position: absolute;  width: 45px;  background-color: var(--green);  height: 70px;  top: -9px;  bottom: 0;  left: -10px;  z-index: -1;}
.aboutimg img{ width: 100%; }
.abouttext{ margin-left: 30px;}
.abouttext p{ font-size: var(--smallfont); color: var(--black); margin-bottom: 30px;}
/* aboutus */

/* What We Offer */
.whatweoffer{ background-image: url(..//images/whatweofferbg.png); padding-top: 320px; padding-bottom: 100px; background-repeat: no-repeat; background-size: cover;     background-position: right }
.whatweoffertext h2{ font-size: var(--title); font-weight: 100; color: var(--blue); margin: 0; }
.whatweoffertext { font-size: var(--midfont) ;  color: var(--black); margin: 0; }
.whatweofferimg img {  width: 100%;}
.pad-50{ padding-top: 50px;}
.reverse{flex-direction: row-reverse;}
/* What We Offer */

/* product */
.grid-wrapper > div {
	display: flex;
	justify-content: center;
	align-items: flex-end;
}


.grid-wrapper {
	display: grid;
	grid-gap: 15px;
	grid-template-columns: repeat(auto-fit, minmax(347px, 1fr));
	grid-auto-flow: dense;
  grid-template-rows: 351px;
}
.grid-wrapper .wide {
	grid-column: span 2;
}
.grid-wrapper .tall {
	grid-row: span 2;
}
.grid-wrapper .big {
	grid-column: span 2;
	grid-row: span 2;
}

.productimg{overflow: hidden;  transition: 0.5s;}
.productimg img{ width: 100%; height: 100%;  object-fit: cover; transition: 0.5s;}
.productimg a{ text-decoration: none; color: var(--black); overflow: hidden; }
.productimg:hover { box-shadow: 5px 5px 0px rgba(0, 0, 0, 0.16);}
.productimg:hover img{ -webkit-filter: grayscale(100%);	filter: grayscale(100%);}
.productimg h3{ font-size: var(--h3font); color: var(--blue); max-width: 340px; font-weight: 600; margin: 0; padding: 10px 0px;}
.productimg p{ margin: 0; font-size: var(--smallfont); color: var(--black);}
/* product */

/* Industry Verticals Served */
.industry{ background-color: var(--blue); padding: 100px 0px; border-radius: 0px 0px 400px 0px; transition: 0.5s;}
.industryimg{ position: relative; overflow: hidden;}
.industryimg img{ width: 100%; transition: 0.5s; }
.industryimg:hover img{ transform: scale(1.2);}
.industrytext { position: absolute; bottom:0; width: 100%; height: 100%; display: flex;     align-items: flex-end; background: linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0) 100%);
}
.industrytext p{ font-size: var(--h3font); color: var(--white); font-weight: 600; margin: 0; padding-left: 20px; padding-bottom: 20px;}
.industrygap{ gap: 30px 0px;}
.blank img{ width: 100%;}
/* Industry Verticals Served */

/* footer */
.footerlogo img {  max-width: 100%;}
.footernav ul li {  display: inline;  margin: 0px 15px;}
.footernav ul li a{ text-decoration: none; color: var(--black); font-size: var(--smallfont);}
.footernav ul li a:hover{ color: var(--blue);}
.footernav ul{ text-align: center; margin: 0; padding: 0; list-style: none;}
.socialmedia a { font-size: var(--smallfont); text-decoration: none; transition: 0.5s; margin:0px 5px ; width: 50px;  height: 50px;  background: var(--green);  display: inline-flex;  justify-content: center;  align-items: center;  color: var(--white);  border-radius: 50px;}
.socialmedia a:hover{ background-color: var(--blue); color: var(--white);}
.socialmedia a i {  color: #fff;}
.boderbtm { border-bottom: 1px solid var(--blue); padding-bottom: 25px;}
/* footer */

/* innerbanner */
.innerabs {  position: absolute;  top: 35%;   width: 100%;}
.innerbannertext h1 {  font-size: var(--bigfont);  color: var(--white);  position: relative;  text-align: center;  display: inline-flex;  margin: 0 auto;}
.innerbannertext {   height: 100%;  position: relative;  z-index: 1;  display: flex;  flex-direction: column;  justify-content: center;}
.innerbannertext h1::before {  content: "";  clip-path: polygon(0 40%, 100% 0%, 100% 70%, 0% 100%);  transition: 0.5s;  position: absolute;  width: 40px;  background-color: var(--green);  height: 55px;  top: -9px;  bottom: 0;  left: -10px;  z-index: -1;}

/* contactpage */
.contactdetails{ display: flex;  align-items: flex-start;  gap: 20px;}
.gap{ gap: 30px 0px;}
.contacttitle h3{ font-size: var(--h3font); font-weight: 600; color: var(--blue); }
.contacttitle h3 span{ color: var(--green);}
.contacttitle > a{ font-size: 50px; font-weight: 300; text-decoration: none; color: var(--black);}
.contacttitle a:hover{ color: var(--blue);}
.boader{ border: 1px solid var(--blue); margin: 60px 0px;}
.socialflex {  display: flex;  align-items: center;  gap: 20px;}
.contactform{ background-color: #EBEBEB; margin-left: 100px; }
.contactform img{ width: 100%;}
.formfild {   width: 100%; border: none;  background-color: transparent;   border-bottom: 1px solid var(--blue);  font-size:var(--smallfont);  padding: 15px; }
.formfild:focus{outline: none; }
.contactform2{ padding: 60px 30px;}
.map iframe {  width: 100%;  height: 450px;}

.brochurebtn {
    padding: 15px 20px;
    background-color: var(--blue);
    color: var(--white);
    font-size: 14px;
    display: inline-block;
    border-radius: 30px;
    text-decoration: none;
    border: none;
    max-width:200px;
    width: 100%;
    text-align:center;
}
.brochurebtn:hover{ background-color:var(--green); color:var(--white); }

@media (max-width:1200px){ 
  .grid-wrapper{grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));}
  .grid-wrapper > div{ align-items: flex-start;}
  .bannertext{ margin-left: 50px;}
  .bannercontent > img{ height: 100vh; object-fit: cover;}
}
@media (max-width:991px){
  :root{
    --bigfont:40px;
    --title:40px;
    --smallfont:16px;
    --h3font:22px;
    --midfont:18px;
}
  .footernav ul{text-align: left; }
  .footernav ul li {    margin: 0px 10px; }
  .footernav ul li:first-child{ margin-left: 0;}
  .boderbtm{     gap: 20px 0px;}
  .aboutimg img {     height: 450px;    object-fit: cover;}
  .whatweoffer { background-image: none;     padding-top: 100px; background-color: #E4E4E4;}
  .aboutussection {    padding-bottom: 100px;}
  .contactform {    margin-left: 0px;    margin-top: 80px;}

}

@media (max-width:768px){
  :root{
    --bigfont:30px;
    --title:30px;
    --smallfont:16px;
    --h3font:20px;
    --midfont:15px;
}
  .bannerimg img {    display: none !important;}
  .bannertext {    margin-left: 0px;}

}   

@media (max-width:574px){
  .copyright{ gap: 10px;      flex-direction: column;  align-items: center;}
  .contactfooter {    text-align: center;}
  .footerlogo {    margin: 0 auto;    text-align: center;}
  .footernav ul li {    margin: 10px; display: list-item; text-align: center;}
  .footernav ul li:first-child {    margin-left: 10px;}
  .socialmedia {    text-align: center;}
  .aboutimg img {    height: 300px;}
  .abouttext {  background: #e9e9e9;    padding: 30px;    margin: 20px;    margin-top: -30px;}
  .titletext h2::before{ display: none;}
  .contactuspage .contactfooter {    text-align: left;}
  .aboutimg img {    height: 300px;}
  .bannertext {       padding: 30px;}
  .bannercontent > img {    height: 60vh; }
  .contacttitle > a {    font-size: 40px;}
  .industry{ border-radius: 0;}
  .blank {    display: none;}
}
@media (max-width:400px){
}