body{
    font-family: 'Satoshi-Medium';
}
html{scroll-padding-top: 70px;}
a,a:hover{transition: all 0.3s ease-in;}
img {max-width: 100%;}

.header-btn .btn-get-in-touch{background-color: transparent;border: 1px solid #3F3A3A;color: #3F3A3A;font-size: 20px;font-weight: 500;line-height: normal;}
.header-btn .btn-get-in-touch:hover{color: #FFFFFF;background-color:#3F3A3A;}
.navbar .navbar-nav .nav-link{padding: 1.875rem 1.75rem;font-size: 20px;font-weight: 500;line-height: 27px;}
.navbar .navbar-nav .nav-link:hover{text-decoration: underline;}
.navbar-toggler {box-shadow: none !important;}

section{  scroll-padding-top: 50px;}
.hero-banner{
    background:url(../img/banner-bg.png) no-repeat center center / cover;position: relative;height: 940px;margin-top: 103px;
}
.hero-banner::before{content: '';background: linear-gradient(270deg, rgba(0, 0, 0, 0.00) 0%, #000 74.5%);position: absolute;height: 100%;width: 100%;}
.banner-content{max-width: 696px;position: relative;margin-top: 198px;}
.banner-content h1{color: #FFFFFF;font-family:'Landasans-Medium';font-size: 96px;font-weight: 500;line-height: 110%;margin-bottom: 24px;}
.banner-content p{color: #FFFFFF;font-size: 20px;  font-weight: 500;line-height: normal;margin-bottom: 48px;}
.free-next-day-delivery{
    background:url(../img/free-next.png) no-repeat center center / cover;bottom: 0;max-height: 221px;height: 100%;max-width: 450px;width: 100%;position: absolute;overflow: hidden;
}
.free-next-day-delivery img{position:absolute;top:50%;left:0;transform:translate(0%,-50%) scale(1.0);transition: all 0.3s ease-in;}
.free-next-day-delivery:hover img{transform:translate(0%,-50%) scale(1.05);transition: all 0.3s ease-in;}
.free-next-day-delivery h4{color: #FFFFFF;font-family:'Landasans-Medium';font-size: 50px;font-weight: 500;line-height: normal;text-transform: uppercase;max-width: 178px;position: absolute;right: 34px;top: 20px;}
.free-next-day-delivery span{color: #3F3A3A;}



section.our-product{padding:128px 0;}
section.our-product{background:#F5F5F5 url(../img/our-product-bg.png);}
.sub-title{margin-bottom:55px;}
.box-gap{column-gap:42px;row-gap:40px;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));}
.our-product h2{font-family:'Landasans-Medium';font-size:48px;font-weight:500;line-height:57.6px;text-align:center;margin-bottom:8px;color:#3F3A3A;}
.our-product p{font-size:20px;font-weight:500;line-height:27px;text-align:center;color:#3F3A3A;}
.product-box{background:url(../img/our-product-shape.png)  no-repeat center center / contain;padding:24px 36px;margin-bottom:21px;border-radius:30px;transition: all 0.3s ease-in;}
.main-product-box h3{font-family:'Landasans-Medium';color:#000000;text-align:center;font-size:24px;font-weight:500;line-height:normal;margin-bottom:0;}
.main-product-box:hover .product-box{background: url(../img/our-product-shape-on-hover.png) no-repeat center center / contain;transition: all 0.3s ease-in;}
.main-product-box .product-box img{transform: scale(1);transition: all 0.3s ease-in;}
.main-product-box:hover .product-box img{transform: scale(1.2);transition: all 0.3s ease-in;}


.who-we-are,.serving-the {background: unset !important;}
.who-we-are .container{display: grid;row-gap: 128px;}
.who-we-are .sub-title{max-width: 549px;margin-bottom: 0;}
.who-we-are .sub-title h2{margin-bottom: 16px;}
.who-we-are .sub-title p{margin-bottom: 48px;}
.shape-with-image{display: flex;align-items: flex-start;justify-content: flex-end;}
.shape-with-image::before{content:'';background-image: url(../img/black-shape.png);background-repeat: no-repeat;background-position: center;background-size: contain;width: 147px;height: 90px;position: absolute;z-index: 9;top: 40px;left: 60%;transform: translate(-50%, 0%);}
.shape-with-image::after{content:'';background-image: url(../img/green-shape.png);background-repeat: no-repeat;background-position: center;background-size: contain;width: 147px;height: 90px;position: absolute;bottom: 34px;left: 44%;transform: translate(-50%, 0%);}
.shape-with-image .single-image:nth-child(2){margin-top: 80px;margin-left: -40px;}
.ml-auto{margin-left: auto !important;}
.single-image {display: flex; max-width: 53%; width: 100%;}
.single-image img{border-radius: 30px;}

.btn-get-in-touch{
    display: inline-block;padding: 12px 32px;background-color: #2EC694;border: 1px solid #2EC694;border-radius: 8px;color: #FFFFFF;text-align: center;
    text-decoration: none;vertical-align: middle;cursor: pointer;-webkit-user-select: none;-moz-user-select: none;user-select: none;transition: all 0.3s ease-in;
}
.btn-get-in-touch:hover{box-shadow: 2px 2px 30px 0px #0000001A;}


.what-we-offer-grid{display:flex;row-gap:30px;column-gap:30px;}
.what-we-offer-grid > *{flex:1;display:flex;flex-direction:column;height:100%;}
.icon-box{padding:12px 14px;background:url(../img/what-we-shape.png) no-repeat center center / contain;position:absolute;top:0;left:50%;transform:translate(-50%,-50%);}
.what-we-shadow-box{box-shadow:2px 2px 20px 0px #00000014;padding:50px 15px 40px;background-color:#FFFFFF;text-align:center;border-radius:12px;margin:-30px 16px 0 16px;position:relative;height:100%;}
.what-we-shadow-box h3{font-family:'Landasans-Medium';font-size:24px;font-weight:500;line-height:28.8px;margin-bottom:8px;color:#000000;}
.what-we-shadow-box p{font-size:20px;font-weight:500;line-height:27px;margin-bottom:0;}
.our-product-btn{margin-top:64px;}
.what-we-offer .row + .row{flex-direction:unset!important;}
.what-we-offer .sub-title, .serving-the .sub-title p{margin-bottom:64px;}


.serving-the .sub-title h2{margin-bottom: 12px;}
.logo-box{background: #2EC694;border: 8px solid #FFFFFF;border-radius: 20px;padding: 60px;max-width: 393px;margin: 0 auto;position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);}


#contactUsPage{scroll-margin-top: 50px;}
.get-in-touch{border-radius:12px;background:#FFF;box-shadow:2px 2px 30px 0px rgba(0,0,0,0.08);padding:80px 120px;margin-bottom:-168px;max-width:1360px;}
.get-in-touch .get-text{max-width:463px;display:flex;flex-direction:column;align-items:start;flex:1;justify-content:center;border-right:1px solid #D9D9D9;margin-right:110px;}
.get-in-touch .form-field{max-width:549px;flex:1;}
.get-in-touch h2{font-family:'Landasans-Medium';color:#3F3A3A;font-size:96px;font-weight:500;line-height:100%;}
.get-in-touch h3{font-family:'Landasans-Medium';color:#3F3A3A;font-size:48px;font-weight:500;line-height:100%;}
.form-field  .get-in-touch-btn{margin-top:40px;}
.get-in-touch .form-control{border-radius:8px;background:#F5F5F5!important;height:52px;padding:14px 16px;border:0;box-shadow:none !important;}
.get-in-touch textarea{height:120px}


footer{
    background:url(../img/footer-bg.png) no-repeat center center / cover;color: #FFFFFF;
    padding: 296px 0 0;
}
.footer-grid{display: flex;justify-content: space-between;row-gap: 30px;column-gap: 48px;margin-bottom: 48px;}
.footer-logo{width: 228px;}
.footer-logo img{margin-bottom: 24px;}
.footer-logo p{font-size: 20px;font-weight: 500;line-height: 27px;}
footer h5{font-size: 20px;font-weight: 500;line-height: 27px;text-transform: uppercase;margin-bottom: 32px;}
footer ul{list-style-type: none;}
footer ul li{font-size: 16px;font-weight: 500;line-height: 21.6px;}
footer ul li:not(:last-child){margin-bottom: 16px;}
footer a{color: #FFFFFF;text-decoration: none;}
footer a:hover{color: #2EC694;}
footer .call-email{display: grid;row-gap: 18px;column-gap: 18px;}
footer .call-email > div{column-gap: 12px;}
.footer-address{display: flex;flex-direction: column;width: 160px;float: right;}
.footer-address a{max-width: 160px;}
.copy-right{padding: 24px 0;border-top: 1px solid #666666;text-align: center;}



@media only screen and (min-width: 1200px) {
    .container{max-width: 1384px;}
}

@media only screen and (max-width: 1199.98px) {
    .hero-banner{height: 740px;}
    .banner-content h1{font-size: 70px}
    .banner-content {max-width: 600px; margin-top: 100px;}
    .banner-content p{font-size: 17px;margin-bottom: 30px;}    

    .box-gap{column-gap: 40px;row-gap: 40px;}
    .shape-with-image::before,.shape-with-image::after{max-width: 100px;}
    .our-product h2{font-size: 40px;}
    .our-product p {font-size: 16px;}
    .what-we-offer .sub-title, .serving-the .sub-title p{margin-bottom: 30px;}
    .our-product-btn{margin-top: 30px;}
    .get-in-touch{padding: 80px;}
    .get-in-touch .get-text{margin-right: 60px;}
}

@media only screen and (max-width: 991.98px) {
    .navbar .navbar-nav .nav-link{padding: 1.875rem 1rem;font-size: 18px;}
    .header-btn .btn-get-in-touch{padding: 12px 20px;font-size: 16px;}
    section.our-product {padding: 60px 0;}
    section.our-product .row{row-gap: 30px;}
    section.our-product .row + .row{flex-direction: column-reverse;}
    .who-we-are .sub-title{margin-left: unset !important;max-width: 100%;}
    .who-we-are .sub-title p{margin-bottom: 22px;}
    .shape-with-image::before{top: 30px;left: 56%;}
    .who-we-are .container{row-gap:60px;}
    .what-we-offer-grid{display: grid;grid-template-columns: 1fr;}
    .what-we-offer-grid > *{height: 100%;max-width: 433px;margin: 0 auto;}
    .logo-box{padding: 30px;max-width: 200px;}
    .footer-grid{display: grid;grid-template-columns: repeat(auto-fit,minmax(44%,1fr));}
    .footer-address{float: left;}
    footer h5{margin-bottom: 18px;font-size: 16px;}
    footer a,.footer-address a,.copy-right{font-size: 14px;}
    footer ul li:not(:last-child){margin-bottom: 12px;}
}

@media only screen and (max-width: 767.98px) {
    .hero-banner{height: 600px;margin-top: 74px;}
    .banner-content h1{font-size: 50px}
    .banner-content {max-width: 400px;margin-top: 70px;}
    .banner-content p{font-size: 14px;}
    .navbar .navbar-nav .nav-link {padding: 0.5rem 0rem;text-align: center;}
    .header-btn{text-align: center;margin: 10px 0;}
    .our-product h2{font-size: 34px;;line-height: normal;margin-bottom: 8px !important;}
    .our-product p {font-size: 14px;line-height: normal;}
    .box-gap{grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));column-gap: 20px;row-gap: 30px;}
    .main-product-box h3{font-size: 20px;}
    .who-we-are .sub-title p{margin-bottom: 20px;}
    .btn-get-in-touch {padding: 8px 26px;font-size: 14px;}
    .shape-with-image::before{max-width: 80px;top: 40px;left: 64%;}
    .shape-with-image::after{max-width: 80px;bottom: 40px;left: 45%;}
    .get-in-touch h3{font-size: 30px;}
    .get-in-touch h2{font-size: 60px;}
    .get-in-touch{padding: 30px;}
    .get-in-touch .get-text{border: 0;max-width: 100%;margin-bottom: 30px;}
    footer{padding: 250px 0 0;}
    .footer-grid{margin-bottom: 20px;}
}

@media only screen and (max-width: 575.98px) {
    .hero-banner{height: 550px;}
    .free-next-day-delivery{background: url(../img/free-next.png) no-repeat bottom center / contain;bottom: 0;left: 0;max-height: 148px;max-width: 300px;}
    .free-next-day-delivery h4{font-size: 30px;max-width: 110px;}
    .free-next-day-delivery img{top: 49%;max-width: 150px;}
    .box-gap{
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));column-gap: 20px;row-gap: 20px;
    }
    .logo-box{padding: 20px;max-width: 150px;}
    .footer-grid{display: grid;grid-template-columns: repeat(auto-fit,minmax(100%,1fr));}    
    .footer-logo{margin: 0 auto;}
    .footer-logo img{margin: 0 auto 24px;display: block;}
    footer h5,footer ul li{text-align: center;}
    footer .call-email > div{justify-content: center;}
    .footer-address{margin: 0 auto;float: unset;width: 100%;}
    .footer-address a {max-width: 100%;text-align: center;}
}
