* {
    padding: 0px;
    margin: 0px;
    box-sizing: border-box;
    list-style: none;
    text-decoration: none;
    transition: .3s;
}

@font-face {
    font-family: bold-font;
    src: url(../font/gilroy/Gilroy-Bold.ttf);
}

@font-face {
    font-family: black-font;
    src: url(../font/gilroy/Gilroy-Black.ttf);
}

@font-face {
    font-family: medium-font;
    src: url(../font/gilroy/Gilroy-Medium.ttf);
}

@font-face {
    font-family: regular-font;
    src: url(../font/gilroy/Gilroy-Regular.ttf);
}

@font-face {
    font-family: extraBold-font;
    src: url(../font/gilroy/Gilroy-ExtraBold.ttf);
}

@font-face {
    font-family: heavy-font;
    src: url(../font/gilroy/Gilroy-Heavy.ttf);
}

@font-face {
    font-family: light-font;
    src: url(../font/gilroy/Gilroy-Light.ttf);
}

@font-face {
    font-family: semiBold-font;
    src: url(../font/gilroy/Gilroy-SemiBold.ttf);
}

@font-face {
    font-family: thin-font;
    src: url(../font/gilroy/Gilroy-Thin.ttf);
}

@font-face {
    font-family: ultraLighter-font;
    src: url(../font/gilroy/Gilroy-UltraLight.ttf);
}

:root {
    --secondary-color: #2C5E42;
    --primary-color: ;

    --boldFont: bold-font;
    --blackFont: black-font;
    --mediumFont: medium-font;
    --regularFont: regular-font;
    --extraBoldFont: extraBold-font;
    --heavyFont: heavy-font;
    --lightFont: light-font;
    --semiBoldFont: semiBold-font;
    --thinFont: thin-font;
    --ultaLightFont: ultraLighter-font;
    --white-color: white;
    --black-color: black;
}

body {
    background-color: var(--white-color);
}

.container {
    max-width: 1440px;
    width: 100%;
    margin: auto;
    margin-bottom: 50px;
}

.row {
    max-width: 1374px !important;
    margin: auto;
    padding: 0px 10px;
}
.d-flex {
    display: flex;
}

.align-center {
    align-items: center;
}

.justify-center {
    justify-content: center;
}

.justify-between {
    justify-content: space-between;
}

.col-1 {
    flex: 1;
}

.col-1-5 {
    flex: 1.5;
}

.col-2 {
    flex: 2;
}

.col-3 {
    flex: 3;
}

.col-4 {
    flex: 4;
}

.col-5 {
    flex: 5;
}

.center {
    text-align: center;
}

.img-fluid {
    max-width: 100%;
    height: auto;
}
.mainHeading{
    max-width: 1374px;
    margin: auto;
    margin-bottom: 50px;
    gap: 50px;
    flex-wrap: wrap;
    padding: 0px 10px;
}
.mainHeading .col-1{
    flex-basis: 250px;
    flex-grow: 1;
}
.mainHeading i{
    color: var(--secondary-color);
    font-size: 20px;
    margin-top: 4px;
}
.mainHeading h1{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 30px;
color: var(--black-color);
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;

}
.mainHeading .col-1{
    gap: 10px;
}
.mainHeading p{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 16px;
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;
color: #05180B;
}
.mainHeading .bgColor{
    background-color: transparent;
    height: 1px;
}



/* main home Page Code Starts Here */
.heaader-hero{
    margin-bottom: 50px;
}
.heaader-hero .main-container{
    background: url(../images/homeHeroNew.svg) no-repeat center center/cover;
    height: 592px;
    border-radius: 25px;
    max-width: 1374px;
    width: 
    100%;
    margin: auto;  
    padding: 30px 20px; 
    position: relative;
}
.service .heaader-hero .main-container{
    background: url(../images/serviceHeroNew.svg) no-repeat center center/cover;
    
}
.aboutus .heaader-hero .main-container{
    background: url(../images/aboutHero.svg) no-repeat center center/cover;
    
}
.aboutus.contactUs .heaader-hero .main-container{
    background: url(../images/contactHeroNew.svg) no-repeat center center/cover;
    
}
.aboutus.getApp .heaader-hero .main-container{
    background: url(../images/getAppNew.svg) no-repeat center center/cover;
    
}
.aboutus.contactUs{
    background-color: #F2F2F2;
}
.aboutus.getApp{
    background-color: #EDE6D5;
}
header ul{
    gap: 20px;
}
header ul li a{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 18px;
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;
color: var(--white-color);
}
header ul li a:hover,header ul li a.active{
    text-decoration: underline !important;
}

header ul li a.btnApp{
    width: 134px;
height: 28px;
border-radius: 25px;
background: #DBCFB2;
display: flex;
align-items: center;
justify-content: center;

font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 17px;
line-height: 100%;
letter-spacing: 0%;
text-align: center;
vertical-align: middle;
color: var(--secondary-color);
text-decoration: none !important;
}
/* The side navigation menu */
.sidenav {
  height: 100%; /* 100% Full-height */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed; /* Stay in place */
  z-index: 1; /* Stay on top */
  top: 0; /* Stay at the top */
  left: 0;
  background-color: #111; /* Black*/
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 60px; /* Place content 60px from the top */
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}

/* The navigation menu links */
.sidenav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 22px;
  color: #818181;
  display: block;
  transition: 0.3s;
  text-align: center;
    font-family: var(--mediumFont);

}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover {
  color: #f1f1f1;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
#main {
  transition: margin-left .5s;
  padding: 20px;
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}

.heroSection .underline{
    width: 129.00387627119736px;
    border-top: 6px solid #2C5E42;
    margin-bottom: 20px;

}

.heroSection{
    height: 100%;
    display: flex;
    align-items: center;
}
.heroSection .row{
    flex-wrap: wrap;
}

.heroSection h1{
    max-width: 455px;
    width: 100%;
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 40px;
color: var(--white-color);
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;

}

.heroSection h1 span{
    color: #51AA78;
}
.heroSection p{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 20px;
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;
color: var(--white-color);
}
.heroSection .fixWid{
    max-width: 403px;
}

/* code for aboutSection of home page  */
.aboutSection .mainHeading .btn a{
    display: flex;
    align-items: center;
    justify-content: center;
width: 156px;
height: 38.235294342041016px;
border-radius: 19.12px;

background-color: #DBCFB2;
border-radius: 25px;
margin-top: 30px;

font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 17.59px;
line-height: 100%;
letter-spacing: 0%;
text-align: center;
vertical-align: middle;
color: var(--secondary-color);
}
.aboutSection .row{
    background: linear-gradient(91.08deg, #2C5E42 0%, #5CC48A 100%);
    padding: 3px;
    min-height: 142px;
    border-radius: 10px;

    max-width: 1018px !important;
    margin: auto ;

}
.aboutSection .row .borderSection{
    backdrop-filter: blur(14.5px);
    background-color: white;
    width: 100%;
    padding: 0px 20px 20px 20px;
    border-radius: 10px;
    /* overflow: hidden; */
    align-items: end;
    flex-wrap: wrap;

}
.aboutSection .row .borderSection .topPro{
    min-height: 51.54817199707031px;
    gap: 20px;
    margin-bottom: 20px;
}
.aboutSection .row .borderSection .topPro .box p{
    font-family: var(--mediumFont);
font-weight: 500;
font-style: Medium;
font-size: 16.57px;
line-height: 14.36px;
letter-spacing: 0%;
text-align: center;
vertical-align: middle;
color: var(--secondary-color);
}
.aboutSection .row .borderSection .topPro .subBox p{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: Regular;
font-size: 12.62px;
line-height: 14.36px;
letter-spacing: 0%;
text-align: center;
vertical-align: middle;

}
.aboutSection .row .borderSection .topPro .subBox{
    height: 100%;
    background: #DBCFB230;
width: 127.43742370605469px;
height: 51.54817199707031px;
border-left: 0.15px solid #000000;
display: flex;
align-items: center;
justify-content: center;

}

.aboutSection .row .box .iconsDown{
    gap: 7px;
}
.aboutSection .row .box p{
    color: #18291FB2;
    font-family: var(--mediumFont);
font-weight: 700;
font-style: Bold;
font-size: 11.84px;
line-height: 14.36px;
letter-spacing: 0%;
margin-bottom: 6px;
vertical-align: middle;
}
.aboutSection .row .box p.gray{
    color: #0000004A;
}
.aboutSection .row .box select{
    border: none !important;
    font-family: var(--mediumFont);
    color: var(--black-color);
font-weight: 700;
font-style: Bold;
font-size: 16.78px;
line-height: 14.36px;
letter-spacing: 0%;
outline: none !important;
vertical-align: middle;
cursor: pointer;

}
.aboutSection .row .box img{
    width: 100%;
    margin-top: 5px;
}
.aboutSection .row .box .btn a{
    width: 179px;
height: 50px;
border-radius: 41px;
background: linear-gradient(93.29deg, #2C5E42 37.24%, #548064 86.88%);


font-family: var(--boldFont);
font-weight: 400;
font-style: ☞;
font-size: 19px;
line-height: 100%;
letter-spacing: 0%;
text-align: center;
vertical-align: middle;
color: #EDE6D5;
display: flex;
align-items: center;
justify-content: center;
}


/* code for services section of home page */
.services{
    margin-bottom: 100px;
    background: #EDE6D580;
padding: 50px 0px;
}
.services .container{
    margin-bottom: 0px !important;
}
.services .row{
    /* background-color: var(--secondary-color); */
    padding: 50px 10px 0px 10px;
}
.services .row .colGrid{
    max-width: 1011px;
    margin: auto;
    flex-wrap: wrap;
    gap: 40px;
    margin-bottom: 80px;
}
.services .row .colGrid .box{
    position: relative;
    overflow: hidden;
    flex-basis: 300px;
    flex-grow: 1;
    box-shadow: 3.72px 5.57px 7.43px 0px #00000040;


    width: 306.0959777832031px;
height: 313.27740478515625px;
border-radius: 18.58px;

}
.services .row .colGrid .box:hover img{
    transform: scale(1.1);
}
.services .row .colGrid .box img{
    width: 100%;
    height: 100%;
border-radius: 18.58px;
object-fit: cover;
}
.services .row .colGrid .box .bgPara{
    width: 254.5894317626953px;
    position: absolute;
    left: 0px;
    bottom: 0px;
height: 69.46284484863281px;
border-top-right-radius: 18.58px;
border-bottom-left-radius: 18.58px;
background-color: #FFFFFFE5;
padding: 0px 10px;
display: flex;
align-items: center;
}
.services .row .colGrid .box .bgPara p{
    font-family: var(--heavyFont);
    color: var(--secondary-color);
font-weight: 400;
font-style: ☞;
font-size: 18.58px;
line-height: 100%;
letter-spacing: 0%;

}
.services .btn a{
    display: flex;
    align-items: center;
    justify-content: center;
width: 204.99998474121094px;
height: 50px;
border-radius: 19.12px;

background-color: var(--secondary-color);
border-radius: 25px;
margin: auto;
margin-top: 30px;

font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 17.59px;
line-height: 100%;
letter-spacing: 0%;
text-align: center;
vertical-align: middle;
color: #EDE6D5;
}
/* Code for How Work Section of Home Page  */
.howWorks{
    margin-top: 100px;
    background: #EDE6D580;
border: 1px solid #2C5E42;
padding-top: 50px;
margin-bottom: 50px;
}
.howWorks .mainHeading p{
    font-family: var(--boldFont);
}
.howWorks .underSideLine{
    width: 1px;
height: 105px;
background: #D9D9D9;

}
.howWorks .colColor{
    /* padding: 10px 5px; */
    padding: 0px 0px 0px 20px;
    background: #FFFEED;
border: 1px solid #EDE6D5;
gap: 20px;
min-height: 356px;
border-radius: 25px;
justify-content: space-between;
flex-wrap: wrap;
margin-bottom: 20px;
}
.howWorks .colColor .box h3{
    font-family: var(--blackFont);
font-weight: 400;
font-style: ☞;
font-size: 27px;
color: var(--blackFont);
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;

}
.howWorks .colColor .box h3 span.colorGreen{
    font-size: 96px;
    color: var(--secondary-color);
}
.howWorks .colColor .box h3 span.dot{
    font-size: 96px;
    color: var(--black-color);
    margin-right: 8px;
}
.howWorks .colColor .box p{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 27px;
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;
color: black;
max-width: 598px;
width: 100%;
margin-top: 30px;
}
.howWorks .colColor .box img{
    max-width: 569px;
    width: 100%;
border-radius: 25px;
background: #2C5E4233;
border: 3px solid #DBCFB233;
transform: scale(1.05);
}
.howWorks .colColor .box{
    flex-basis: 420px;
flex-grow: 1;
width: 100%;
}

.howWorks .btn a{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 244px;
height: 50px;
background-color: var(--secondary-color);
border-radius: 25px;
margin: auto;
margin-top: 30px;

font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 23px;
line-height: 100%;
letter-spacing: 0%;
text-align: center;
vertical-align: middle;
color: #EDE6D5;
}



/* code for home link section  */
.homeLink .row{
    gap: 20px;
    flex-wrap: wrap;
    justify-content: center;
}
.homeLink .row .box{
    max-width: 499.08367919921875px;
    width: 100%;
height: 243.08120727539062px;
flex-basis: 450px;
flex-grow: 1;
border-radius: 16.15px;
background: #EDE6D5;
border: 0.81px solid #00000080;
padding: 35px 35px 0px 35px;
}
.homeLink .row .box img{
    margin-bottom: 20px;
}
.homeLink .row .box h2{
    font-family: var(--blackFont);
font-weight: 400;
font-style: ☞;
font-size: 21.8px;
color: var(--black-color);
margin-bottom: 10px;
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;

}

.homeLink .row .box p{
    max-width: 390.59234619140625px;
    width: 100%;
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 21.8px;
color: var(--black-color);
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;

}
/* code for appStoreServices section  */
.appStoreServices .container{
    margin-bottom: 0px !important;
}
.appStoreServices .row {
    
    max-width: 1374px;
    background-color: #EDE6D5;
    position: relative;
height: 363px;
border-radius: 10px;
display: flex;

align-items: center;
justify-content: center;
overflow: hidden;
}
.appStoreServices .row .col-12{
    gap: 20px;
    flex-wrap: wrap;
}
.appStoreServices .row .appCommonStore{
    position: absolute;
    right: 0px;
    top: 0px;
    bottom: 0px;
    height: 100%;
    z-index: 1;
}
.appStoreServices .row .store{
    width: 254.21096801757812px;
height: 77.60176849365234px;
position: relative;
z-index: 2 !important;
}

/* code for footer  */
footer .container-footer {
    background-color: var(--secondary-color);

    border-radius: 25px 25px 0px 0px;
    max-width: 1440px;
    margin: auto;
}

footer .rowTopFooter {
    padding: 30px 10px;
    gap: 29px;
    flex-wrap: wrap;
}

footer .rowTopFooter .line {
    width: 1px;
    height: 24px;
    background-color: #EDE6D5;
}

footer .rowTopFooter li a {
    font-family: var(--mediumFont);
    font-style: Regular;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0%;
    vertical-align: middle;
    color: #EDE6D5;
}

footer .rowTopFooter li a.active {
    font-family: var(--boldFont);
}

footer .underline {
    border-top: 1px solid #EDE6D5;
    padding-bottom: 50px;
}

footer .rowMain {
    max-width: 1374px;
    margin: auto;
    margin-bottom: 50px;
    gap: 30px;
    flex-wrap: wrap;
    padding: 0px 10px;
}

footer .rowMain .col-2{
    flex-basis: 300px;
    flex-grow: 1;
}

footer .rowMain .col-1-5 {
    flex-grow: 5;
    flex-basis: 150px !important;
}

footer .rowMain .col-2 .logo {
    margin-bottom: 30px;
}

footer .rowMain .col-2 .logo img:hover,
footer .rowMain .appImageSection img:hover {
    transform: scale(.95);
}

footer .rowMain .col-2 p {
    font-family: var(--regularFont);
    font-style: Regular;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0%;
    vertical-align: middle;
    color: var(--white-color);
    max-width: 365px;
    width: 100%;
    margin-bottom: 30px;
}

footer .rowMain .col-2 .infoBoxLocation a {
    font-family: var(--regularFont);
    font-style: Regular;
    font-size: 14px;
    color: var(--white-color);
    line-height: 24px;
    letter-spacing: 0%;
    display: block;
}

footer .rowMain h2 {
    font-family: var(--boldFont);
    font-weight: 400;
    font-style: ☞;
    font-size: 20px;
    color: #EDE6D5;
    line-height: 24px;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;

    margin-top: 14px;

}

footer .rowMain .appImageSection img {
    max-width: 135.8800048828125px;
    height: 46.439998626708984px;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;

}

footer .rowMain .appImageSection img:nth-child(1) {
    margin-bottom: 30px;
    margin-top: 40px;
}

footer ul {
    margin-top: 30px;
}

footer ul li a {
    display: block;
    margin-bottom: 24px;
    font-family: var(--mediumFont);
    font-weight: 400;
    font-style: ☞;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #EDE6D5;
}

footer ul li a:hover {
    color: var(--white-color);
}

footer .icons {
    max-width: 120px;
    margin: auto;
    margin-top: 20px;
}

footer .icons a {
    margin-bottom: 20px;
    gap: 12px;
}

footer .icons a i {
    font-size: 18px;
    color: #EDE6D5;
}

footer .icons a p {
    font-family: var(--mediumFont);
    font-weight: 400;
    font-style: ☞;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;
    color: var(--white-color);
}




/* CODE FOR SERVICES PAGE */
.aboutSection .container{
    max-width: 100%;
    /* background: #EDE6D580; */
}
.aboutSection .rowGridCol{
    padding: 50px 0px;
    background: #EDE6D580;
}
.aboutSection .rowGridCol .newBg{
    max-width: 1016px;
    margin: auto;

}
.aboutSection .rowGridCol .colSection{
    /* max-width: 1004px; */
    width: 100%;
height: 265.8705749511719px;
border-radius: 40px;
overflow: hidden;
position: relative;
gap: 30px;
margin-bottom: 30px;
}

.aboutSection .rowGridCol .colSection::after{
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    border: 2px solid #2C5E42;
    height: 100%;
    width: 99.6%;
    height: 260px;
    border-radius: 40px;
    z-index: -1;
}
.aboutSection .rowGridCol .colSection .box{
    max-width: 243px;
    width: 100%;
    height: 100%;
}
.aboutSection .rowGridCol .colSection img{
    height: 100%;
    width: 100%;
    box-shadow: 4px 6px 8px 0px #00000040;
border-radius: 20px;
}
.aboutSection .rowGridCol .colSection h1{
    font-family: var(--boldFont);
font-weight: 400;
font-style: ☞;
font-size: 24px;
line-height: 100%;
letter-spacing: 0%;
color: #05180B;
margin-bottom: 34px;

}
.aboutSection .rowGridCol .colSection .textBox{
    padding: 16px 20px 16px 0px;
    width: 100%;
    max-width: 100%;
}

.aboutSection .rowGridCol .colSection .textBox p{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 20px;
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;
color: #05180B;
margin-bottom: 26px;
}

.aboutSection .rowGridCol .colSection.reverseBox{
    flex-direction: row-reverse;
}


.aboutSection .rowGridCol .colSection.reverseBox .textBox{
    padding: 20px 0px 20px 24px;

}
.aboutSection .rowGridCol .rightCol{
    display: flex;
    justify-content: end;
}


.aboutSection .rowGridCol .btn a{
    width: 244px;
height: 50px;
border-radius: 25px;
display: flex;
align-items: center;
justify-content: center;
background: #2C5E42;


font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 23px;
line-height: 100%;
letter-spacing: 0%;
text-align: center;
vertical-align: middle;
color: #EDE6D5;
margin: auto;
margin-top: 80px;
}

/* CODE FOR ABOUT US PAGE  */

.aboutus header .btnApp{
    width: 157px;
height: 50px;
border-radius: 25px;
background-color: #2C5E42;
font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 20px;
line-height: 100%;
letter-spacing: 0%;
text-align: center;
vertical-align: middle;
color: #EDE6D5;
}


/* code for contactUs page  */
.contactUs .formSection{
    max-width: 768px;
    margin: auto;
}

.contactUs .formSection form{
    max-width: 700px;
    margin: auto;
}
.contactUs .formSection h1{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 40px;
color: #0A0B09;
line-height: 120%;
letter-spacing: 1%;
text-align: center;
margin-bottom: 20px;

}
.contactUs .formSection p{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 20px;
color: var(--black-color);
line-height: 120%;
letter-spacing: -2%;
text-align: center;
vertical-align: middle;
margin-bottom: 50px;
}
.contactUs .formSection form input,
.contactUs .formSection form textarea{
    display: block;
    width: 100%;
    margin-bottom: 20px;
    max-width: 700px;
    width: 100%;
height: 56px;
border-radius: 10px;
padding: 0px 20px;
background: #D9D9D90A;
outline: none;
border: 0.5px solid #000000;


font-family: var(--boldFont);
font-weight: 500;
font-style: Medium;
color: var(--secondary-color);

}
.contactUs .formSection form textarea{
    padding: 20px 20px 20px 20px;

height: 214px;
margin-bottom: 50px;
}
.contactUs .formSection form textarea::placeholder,
.contactUs .formSection form input::placeholder{
    color: #9B9B9B;
font-family: var(--mediumFont);
}
.contactUs .formSection form .btn input{
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 700;
    width: 100%;
max-height: 55px;
border-radius: 10px;
background-color: var(--secondary-color);

cursor: pointer;
font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 18px;
text-align: center;
vertical-align: middle;
color: var(--white-color);
}

.faq .gridFlexBox{
    max-width: 1374px;
    width: 100%;
    margin: auto;
min-height: 381px;
border-radius: 20px;
border: 1px solid #00000033;
padding: 10px;
flex-wrap: wrap;
gap: 9px;
justify-content: center;
align-items: center;
}

.faq .gridFlexBox .box{
    max-width: 438px;
    width: 100%;
    flex-basis: 390px;
    flex-grow: 1;
margin-bottom: 20px;
}
.faq .gridFlexBox .box h1{
    font-family: var(--semiBoldFont);
    color: var(--secondary-color);
font-weight: 400;
font-style: ☞;
font-size: 25px;
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;
margin-bottom: 16px;
}
.faq .gridFlexBox .box p{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 20px;
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;
max-width: 438px;
width: 100%;
color: #05180B;
}
.faq .gridFlexBox .box:hover h1{
color: #EDE6D5;
}
.faq .container{
    background-color: white;
    margin-bottom: 0px;
    padding-bottom: 50px;
    padding-top: 50px;
}



/* code for get app */
.appGet{
    position: relative;
    top: -100px;
}
.appGet .row{
    gap: 40px;
    align-items: end;
}
.appGet .row p{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 20px;
color: #05180B;
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;

}
.appGet .row .col-1-5{
    gap: 15px;
}
.appGet .row .col-1-5 i{
    font-size: 20px;
    color: var(--secondary-color);
    margin-top: 6px;
}
.appGet .row .box h1{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 30px;
color: var(--secondary-color);
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;
margin-bottom: 40px;
}
.appGet .row .box p{
    margin-bottom: 34px;
}

.iconGet{
    margin-bottom: 50px;
}
.iconGet img{
    width: 227.05703735351562px;
height: 77.60176849365234px;
margin-bottom: 30px;

}
.iconGet .row{
    gap: 100px;
    flex-wrap: wrap;
}
.iconGet .row .box h6{
    text-align: center;
    font-family: var(--boldFont);
font-weight: 400;
font-style: ☞;
font-size: 20px;
color: #05180B;
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;

}

.iconGet img:hover{
    transform: scale(.95);
}

.whoWe .row{
    gap: 0px;
    max-width: 1274px;
    width: 100%;
    margin: auto;
gap: 20px;
flex-wrap: wrap;
}

.whoWe .row .col-1{
    gap: 14px;
    flex-basis: 427px;
    flex-grow: 1;
}
.whoWe .row .col-1-5{
    flex-basis: 427px;
    flex-grow: 2.5;
}
.whoWe .row .col-1 i{
    font-size: 20px;
    color: var(--secondary-color);
    margin-top: 5px;
}
.whoWe .row .col-1 .box h1{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 30px;
color: #2C5E42;
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;
margin-bottom: 20px;
}
.whoWe .row .col-1 .box p{
    max-width: 410px;
    width: 100%;
    margin-bottom: 30px;
    font-family: var(--mediumFont);
    color: #05180B;
font-weight: 400;
font-style: ☞;
font-size: 20px;
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;

}

/* .whoWe .row .col-1-5 .box{
    gap: 20px !important;
} */

.whoWe .row .col-1-5{
    max-width: 779px;
    width: 100%;

}
.whoWe .row .col-1-5 .box{
    gap: 20px;
}
.whoWe .row .col-1-5 .box .sub-box{
    flex: 1;
}
.whoWe .row .col-1-5 .box .sub-box img{
    width: 100%;
    height: 156px;
  object-fit: cover;
  object-position: 50% 27%;
}
.whoWe .row .col-1-5 .box .sub-box:nth-child(1) img{
border-top-left-radius: 20px;
}
.whoWe .row .col-1-5 .box .sub-box:nth-child(2) img{
    border-top-right-radius: 20px;
}
.whoWe .row .col-1-5 .box.imageLarge img{
    max-width: 779px;
    width: 100%;
height: 225px;
border-bottom-right-radius: 20px;
border-bottom-left-radius: 20px;

  object-fit: cover;
  object-position: 50% 27%;

}
.drivers .col-1{
    flex-direction: row-reverse;
}
.drivers .col-1 h1{
    text-align: right;
}
.drivers .col-1-5{
    gap: 20px;
}
.drivers .col-1-5 img{
    max-width: 382px;
    width: 100%;
min-height: 453px;
object-fit: cover;

}
.drivers .col-1-5 .box:nth-child(1) img{
border-bottom-left-radius: 20px;
/* border-bottom-left-radius: 20px; */

}
.drivers .col-1-5 .box:nth-child(2) img{
border-top-right-radius: 20px;

}


.greenSection .container{
    background-color: var(--secondary-color);
    min-height: 524px;
    padding: 50px 10px;
}


.greenSection .container .topheading{
    gap: 20px;
}
.greenSection .container .topheading i{
    font-size: 24px;
    color: var(--white-color);
}
.greenSection .container .topheading h1{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 30px;
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;
color: #EDE6D5;
}
.greenSection .container .row{
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}
.greenSection .container .row p{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 20px;
line-height: 100%;
letter-spacing: 0%;
color: #EDE6D5;
margin-top: 80px;
margin-bottom: 100px;
}
.greenSection .container .row .colFlex{
    gap: 50px;
    flex-wrap: wrap;
}
.greenSection .container .row .colFlex h2{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 18px;
line-height: 100%;
letter-spacing: 0%;
text-align: center;
vertical-align: middle;
color: var(--white-color);
}

.greenSection .container .row .colFlex img{
    height: 64px;
    margin-bottom: 20px;
}

.greenSection .container .row .colFlex img.ticket{
    margin-top: 10px;
    width: 48.01569366455078px;
height: 48.01569366455078px;
margin-bottom: 26px;
}
.location .row{
    flex-wrap: wrap;
}
.location .row .col-1,
.location .row .col-1-5{
    flex-basis: 400px;
    /* flex-grow: 1; */
}
.location .row .col-1{
    gap: 20px;
}
.location .row .col-1 .box i{
    font-size: 22px;
    color: var(--secondary-color);
    margin-top: 6px;
}
.location .row .col-1 .box h2{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 30px;
leading-trim: NONE;
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;
color: #2C5E42;
margin-bottom: 30px;
}

.location .row .col-1 .box p{
    font-family: var(--mediumFont);
font-weight: 400;
font-style: ☞;
font-size: 20px;
color: var(--secondary-color);
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;
margin-bottom: 30px;

}
.location .row .col-1 .box a{
    font-family: var(--boldFont);
font-weight: 400;
font-style: ☞;
font-size: 20.94px;
color: var(--black-color);
margin-bottom: 50px;
line-height: 100%;
letter-spacing: 0%;
display: block;
}













































/* 838 */


@media screen and (min-width: 891.99px) {
    .pc{
        display: none !important;
    }
}
@media screen and (max-width: 622.99px){
    .aboutSection .row .box .btn a{
        margin-top: 30px;
    }
}
@media screen and (max-width: 570.99px){
.borderSection .noGap{
    gap: 20px !important;
}
}
@media screen and (max-width: 530.99px){
    .aboutSection .rowGridCol .colSection{
        flex-direction: column;
        height: 100%;
        gap: 0px;
        border: 2px solid #2C5E42;
    }
    .aboutSection .rowGridCol .colSection::after{
        height: 100%;
        border: none !important;
    }
    .aboutSection .rowGridCol .colSection .box{
        max-width: 100%;
        width: 100%;
        object-fit: cover;
    }
    .aboutSection .rowGridCol .colSection img{
        box-shadow: none !important;
        width: 100%;

    }
    .aboutSection .rowGridCol .colSection.reverseBox {
        flex-direction: column;
    }
    .aboutSection .rowGridCol .colSection .box.textBox{
        padding: 20px !important;
    }
}

@media screen and (min-width: 622.99px){

.aboutus .heaader-hero .main-container img.heroSagment{
    display: none !important;
}    
}
@media screen and (max-width: 622.98px){

.aboutus .heaader-hero .main-container img.heroSagment{
    position: absolute;
    right: 20px;
    bottom: 20px;
    width: 50%;
    opacity: .5;
}
.mainHeading{
    gap: 20px !important;
}
.heaader-hero .main-container{
    border-radius: 0px !important;
}
}
@media screen and (max-width: 891.98px) {
    .mobile{
        display: none !important;
    }
    .howWorks .colColor {
        padding: 50px 10px 20px 10px;

}
   .howWorks .colColor .box {
    flex-basis: auto;
   }
   .howWorks .colColor .box p{
    max-width: 100%;
   }
   .howWorks .colColor .box img{
    max-width: 100%;
    background-color: transparent;
   }
   .howWorks .row .colColor:nth-child(2){
    flex-direction: column-reverse;
   }
   .whoWe .row .col-1 .box p{
    max-width: 100%;
   }
   .whoWe .row .col-1-5,.whoWe .row .col-1-5 .box.imageLarge img{max-width: 100%;}
.whoWe .row .col-1{
    flex-direction: row;
}
.whoWe .row .col-1 h1{
    text-align: left;
}
.whoWe .row .col-1 p{
    margin-top: 20px !important;
}
}

@media screen and (max-width: 391.98px) {
    .heaader-hero .main-container{
        padding: 20px 0px 20px 0px;
    }
}
@media screen and (max-width: 560.98px){
    .heroSection h1{
        margin-bottom: 20px;
    }
    .whoWe .row .col-1-5,.whoWe .row .col-1-5 .box{
        flex-direction: column;
    }
    .whoWe .row .col-1-5 img{
max-width: 100%;
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    min-height: 293px;
    border-radius: 20px;
    }
    .whoWe.drivers .row{
        flex-direction: column-reverse;
    }
}
@media screen and (max-width: 1336.98px){
    .appGet{
       top: 0px !important;
    }
}
@media screen and (max-width: 1124.98px){
    .appGet .row{
        margin-top: 50px;
       top: 0px !important;
       gap: 0px !important;
    }
}
@media screen and (max-width: 996.98px){
    .appGet .row{
        flex-direction: column-reverse;
    }
}

html{
    scroll-behavior: smooth;
}

.btn a:hover{
    transform: scale(.95) !important;
}