body {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-style: normal;
    margin: 0px;
}

.zeyada-regular {
    font-family: "Zeyada", cursive;
    font-weight: 400;
}

.inter {
    font-family: "Inter", sans-serif;
}

a {
    text-decoration: none;
    color: #343A40;
}

.header {
    background-color: #FFF;
    opacity: 1;
}

.navbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 0px;
}

.logo {
    display: flex;
}

.croppico-container {
    max-width: 1230px;
    margin: 0 auto;
}

.croppico-container.xs-container {
    max-width: 1021px;
    padding: 70px 0px;
}

.croppico-container.md-container {
    max-width: 948px;
}

.reponsive {
    width: 100%;
}

.navbar ul li {
    list-style: none;
    display: inline-block;
    margin: 0 31px 0px 0;
}

.navbar ul li a {
    text-decoration: none;
    font-size: 16px;
    font-weight: 400;
    color: #343A40;
    font-family: "Poppins", sans-serif;
}

.hero-banner img {
    width: 100%;
    display: flex;
    align-items: start;
}

.homie-freshlygrid {
    display: grid;
    grid-gap: 116px;
    grid-template-columns: repeat(2, 1fr);
    align-items: center;
}

.background-image {
    background-image: url('../images/backgroundgreen.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.hydroponic-description {
    padding-top: 16px;
}

.homiefreshly-image {
    margin: 0px;
}

.cultivate-title {
    font-family: "Poppins";
}

.cultivate-title span, .homie-works-title span {
    color: #86BF50;
}

.fourth-section {
    padding-top: 112px;
}

.from-croppico-image img {
    display: flex;
    align-items: end;
}

.background-green {
    display: flex;
    align-items: end;
}

.mint-image {
    position: relative;
    display: inline-block;
}

.mint-image img {
    max-width: 100%; 
    vertical-align: middle;
}

@media only screen and (min-width: 1200px) {
    .hydroponic-title {
        font-family: Poppins;
        font-size: 44px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        padding-bottom: 24px;
    }

    .croppico-container.xs-container {
        padding: 130px 0px;
    }

    .hydroponic-content {
        color: #86BF50;
        font-family: Zeyada;
        font-size: 72px;
        font-style: normal;
        font-weight: 400;
        line-height: 64px;
        letter-spacing: 2.88px; 
        display: inline;
    }

    .hydroponic-desc {
        font-size: 18px;
        font-family: "Poppins", sans-serif;
        font-weight: 400;
        color: #343A40;
        width: 666px;
        line-height: 30px;
    }

    .cultivate-title {
        font-size: 44px;
        font-weight: 400;
        color: #212529;
    }

    .cultivate-title span{
        font-family: Zeyada;
        font-size: 72px;
        font-weight: 400;
        line-height: 64px;
        letter-spacing: 2.88px;
        padding: 12px 0 24px;
        display: block;
    }

    .cultivate-freshness {
        padding-top: 16px;
    }

    .cultivate-automate {
        border-left: 1px solid #86BF50;
        /* padding: 19px 0 0 0; */
    }

    .vertical-system-title {
        font-size: 18px;
        color: #212529;
        font-weight: 600;
        padding-bottom: 8px;
    }

    .vertical-system-desc {
        padding-bottom: 32px;
        font-size: 16px;
        color: #343A40;
        line-height: 28px;
    }

    .eleventh-section {
        margin-top: 100px;
    }

    .delight-recipes {
        display: flex;
        gap: 40px;
    }

    .from-croppico {
        display: flex;
        justify-content: end;
        background: #86BF50;
    }

    .blog {
        display: flex;
        gap: 40px;
        padding-bottom: 104px;
    }

    .lettuce-grow {
        color: #86BF50;
        font-family: "Zeyada", cursive;
        font-size: 96px;
        font-weight: 400;
        line-height: 68px;
    }

    .lettuce-content {
        font-size: 45px;
        font-weight: 400;
        width: 247px;
        padding-top: 28px;
    }

    .herbs-title {
        font-size: 24px;
        font-weight: 700;
        padding: 16px 8px;
        color: #212529;
    }

    .herbs-desc {
        color: #343A40;
        font-size: 14px;
        font-weight: 400;
    }

    .fifth-section {
        padding: 68px 0px;
    }

    .homie-works-title, .blogtree-title, .recipes-heading, .testimonials-title {
        font-size: 72px;
        font-weight: 400;
        text-align: center;
        font-family: "Zeyada", cursive;
        line-height: 64px;
    }

    .seventh-section {
        padding-top: 92px;
    }

    .homie-works- {
        text-align: center;
        padding-top: 26px;
    }

    .better-resource-title {
        font-size: 48px;
        color: #212529;
        font-weight: 400;
    }

    .better-resource-title span {
        font-size: 96px;
        color: #86BF50;
        font-family: "Zeyada", cursive;
        line-height: 64px;
    }

    .better-resource-content {
        font-size: 20px;
        color: #212529;
        line-height: 33px;
        padding-top: 26px;
        font-weight: 400;
        max-width: 882px;
    }

    .from-croppico-white {
        text-align: left;
        padding: 0;
        background: #fff;
    }

    .from-croppico-heading {
        font-size: 72px;
        font-family: "Zeyada", cursive;
        font-weight: 400;
        line-height: 64px;
        color: #212529;
    }

    .from-croppico-heading span {
        color: #86BF50;
    }

    .ninth-section {
        margin-top: 104px;
    }

    .from-croppico-content {
        padding: 16px 68px 50px 68px;
    }

    .from-croppico-heading {
        padding: 60px 68px 0px 68px;
        font-family: 'Poppins';
        font-size: 44px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
    }

    .from-croppico-heading span {
        font-family: Zeyada;
        font-size: 72px;
        font-style: normal;
        font-weight: 400;
        line-height: 64px;
        letter-spacing: 2.88px;
    }

    .recipes-heading {
        padding-bottom: 56px;
    }

    .freshness-everyday {
        display: flex;
        gap: 79px;
        padding-top: 80px;
    }

    .tabledelight-title {
        color: #212529;
        font-size: 18px;
        font-weight: 500;
        padding: 24px 0px 8px;
    }

    .tabledelight-content {
        font-size: 16px;
        line-height: 28px;
        font-weight: 400;
        color: #495057;
        width: 584px;
    }

    .blog-title {
        font-size: 18px;
        color: #212529;
        font-weight: 500;
        padding: 24px 0px 8px;
    }

    .blogtree-title {
        padding-bottom: 56px;
    }

    .testimonials-croppico {
        display: grid;
        gap: 40px;
        padding-top: 40px;
        grid-template-columns: repeat(3,1fr);
    }

    .croppico-garden-desc {
        font-size: 14px;
        font-weight: 400;
        color: #212529;
        padding-top: 40px;
        line-height: 24px;
        text-align: center;
        max-width: 280px;
        margin: 0 auto;
    }

    .croppico-garden-image {
        text-align: center;
    }

    .weather-proof-title {
        font-size: 20px;
        color: #212529;
        font-weight: 600;
        padding-bottom: 8px;
    }

    .lettuce-basil {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
    }

    .lettuce-batavia {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        gap: 14px;
    }

    .mint-basil {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 0;
        text-align: center;
        max-width: 1000px;
        margin: 0 auto;
    }

    .mint-batavia {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        text-align: center;
    }

    .weather-proof {
        grid-template-columns: repeat(3, 1fr);
        display: grid;
        text-align: center;
        gap: 124px;
        padding-top: 27px;
    }

    .ground-round {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        text-align: center;
        gap: 66px;
        padding: 40px 90px;
    }

    footer {
        background: rgba(249, 255, 234, 0.99);
        padding: 40px 0 56px;
        margin-top: 100px;
    }

    .footer-title span {
        font-size: 61px;
        line-height: 64px;
    }
}

.footer-title {
    font-size: 26px;
    color: #212529;
}

.footer-title span {
    color: #86BF50;
    font-family: 'Zeyada';
    font-style: normal;
    font-weight: 400;
}

.phone-contact-address {
    display: flex;
    gap: 24px;
}

.foot-title {
    color: #343A40;
    font-size: 14px;
    margin-bottom: 4px;
}

.footer-row a, .footer-row address {
    color: #212529;
    font-weight: 500;
    font-style: normal;
}

.phone-contact-address > div, .foot-address {
    padding-left: 32px;
    position: relative;
}

.phone-contact-address > div:before, .foot-address:before {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px;
    position: absolute;
    left: 0;
}

input::-webkit-input-placeholder {
    color: #6C757D;
    font-size: 14px;
    font-weight: 400;
    font-family: "Poppins", sans-serif;
}

input:-moz-placeholder {
    color: #6C757D;
    font-size: 14px;
    font-weight: 400;
    font-family: "Poppins", sans-serif;
}

input::-moz-placeholder {
    color: #757575;
    font-size: 20px;
    font-weight: 400;
    font-family: "Afacad", sans-serif;
}

input:-ms-input-placeholder {
    color: #6C757D;
    font-size: 14px;
    font-weight: 400;
    font-family: "Poppins", sans-serif;
}

input::placeholder {
    color: #6C757D;
    font-size: 14px;
    font-weight: 400;
    font-family: "Poppins", sans-serif;
}

.contact-form input::placeholder, .contact-form textarea::placeholder {
    color: #9EA7B8;
    font-size: 14px;
    font-weight: 400;
    font-family: "Poppins", sans-serif;
}

.required:after {
    content: "*";
    color: #F00;
}

.phone:before {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='ic:round-phone'%3E%3Cpath id='Vector' d='M19.23 15.2598L16.69 14.9698C16.3914 14.9347 16.0886 14.9678 15.8046 15.0665C15.5206 15.1652 15.2626 15.327 15.05 15.5398L13.21 17.3798C10.3712 15.936 8.06382 13.6286 6.62004 10.7898L8.47004 8.93977C8.90004 8.50977 9.11004 7.90977 9.04004 7.29977L8.75004 4.77977C8.69335 4.29194 8.45923 3.842 8.09228 3.51561C7.72532 3.18923 7.25115 3.00918 6.76004 3.00977H5.03004C3.90004 3.00977 2.96004 3.94977 3.03004 5.07977C3.56004 13.6198 10.39 20.4398 18.92 20.9698C20.05 21.0398 20.99 20.0998 20.99 18.9698V17.2398C21 16.2298 20.24 15.3798 19.23 15.2598Z' fill='%2386BF50'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.contact:before {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='mdi:email'%3E%3Cpath id='Vector' d='M20 8L12 13L4 8V6L12 11L20 6M20 4H4C2.89 4 2 4.89 2 6V18C2 18.5304 2.21071 19.0391 2.58579 19.4142C2.96086 19.7893 3.46957 20 4 20H20C20.5304 20 21.0391 19.7893 21.4142 19.4142C21.7893 19.0391 22 18.5304 22 18V6C22 5.46957 21.7893 4.96086 21.4142 4.58579C21.0391 4.21071 20.5304 4 20 4Z' fill='%2386BF50'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.foot-address:before {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='fa6-solid:location-dot'%3E%3Cpath id='Vector' d='M13.5492 22.5057C15.8203 19.7399 21 13.0366 21 9.27141C21 4.7049 17.1927 1 12.5 1C7.80729 1 4 4.7049 4 9.27141C4 13.0366 9.17969 19.7399 11.4508 22.5057C11.9953 23.1648 13.0047 23.1648 13.5492 22.5057ZM12.5 6.51427C13.2514 6.51427 13.9721 6.80475 14.5035 7.32182C15.0348 7.83888 15.3333 8.54017 15.3333 9.27141C15.3333 10.0026 15.0348 10.7039 14.5035 11.221C13.9721 11.7381 13.2514 12.0285 12.5 12.0285C11.7486 12.0285 11.0279 11.7381 10.4965 11.221C9.96518 10.7039 9.66667 10.0026 9.66667 9.27141C9.66667 8.54017 9.96518 7.83888 10.4965 7.32182C11.0279 6.80475 11.7486 6.51427 12.5 6.51427Z' fill='%2386BF50'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.sub-title {
    color: #212529;
    margin-bottom: 12px;
}

.footer-subscribe-form input {
    display: flex;
    width: 280px;
    padding: 0 16px;
    align-items: center;
    gap: 8px;
    border-radius: 16px;
    box-shadow: none;
    border: 1px solid #ADB5BD;
    background: transparent;
    height: 50px;
}

.footer-subscribe-form input:focus {
    outline: 0;
    box-shadow: none;
    background: transparent;
}

/* .footer-subscribe-form button {
    background: transparent;
    display: flex;
    width: 139px;
    height: 52px;
    padding: 18px 29px;
    justify-content: center;
    align-items: center;
    border-radius: 16px;
    border: 1px solid #86BF50;
    color: #86BF50;
    font-family: "Poppins", sans-serif;
    font-size: 16px;
    font-weight: 500;
} */
.footer-subscribe-form button:hover {
    background: #45a049;
}
.footer-subscribe-form button {
    color: white;
    cursor: pointer;
    padding: 12px 30px;
    font-size: 16px;
    border: 2px solid #39871D;
    background: linear-gradient(107deg, #86BF50 -0.73%, #51871D 106.91%);
    box-shadow: 0px 4px 8.4px 0px rgba(0, 0, 0, 0.10);
    backdrop-filter: blur(20px);
    border-radius: 16px;
    font-family: "Poppins", sans-serif;
    display: inline-flex;
    width: 140px;
    justify-content: center;
}
.footer-social {
    display: flex;
    gap: 20px;
    margin-top: 24px;
}

.footer-social a:after {
    width: 40px;
    height: 40px;
    content: "";
    display: inline-block;
}

.footer-social a {
    display: flex;
    align-items: start;
}

.footer-social a.insta:after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40' fill='none'%3E%3Cpath d='M5 18.3333C5 12.0483 5 8.905 6.95333 6.95333C8.905 5 12.0483 5 18.3333 5H21.6667C27.9517 5 31.095 5 33.0467 6.95333C35 8.905 35 12.0483 35 18.3333V21.6667C35 27.9517 35 31.095 33.0467 33.0467C31.095 35 27.9517 35 21.6667 35H18.3333C12.0483 35 8.905 35 6.95333 33.0467C5 31.095 5 27.9517 5 21.6667V18.3333Z' stroke='%2386BF50' stroke-width='2'/%3E%3Cpath d='M27.5 15C28.8807 15 30 13.8807 30 12.5C30 11.1193 28.8807 10 27.5 10C26.1193 10 25 11.1193 25 12.5C25 13.8807 26.1193 15 27.5 15Z' fill='%2386BF50'/%3E%3Cpath d='M20 25C22.7614 25 25 22.7614 25 20C25 17.2386 22.7614 15 20 15C17.2386 15 15 17.2386 15 20C15 22.7614 17.2386 25 20 25Z' stroke='%2386BF50' stroke-width='2'/%3E%3C/svg%3E");
}

.footer-social a.fb:after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40' fill='none'%3E%3Cpath d='M17.8245 14.8953V17.1903H16.1445V19.9953H17.8245V28.3337H21.2779V19.9953H23.5945C23.5945 19.9953 23.8129 18.6503 23.9179 17.1787H21.2912V15.262C21.2912 14.9737 21.6679 14.5887 22.0412 14.5887H23.9212V11.667H21.3629C17.7395 11.667 17.8245 14.4753 17.8245 14.8953Z' fill='%2386BF50' stroke='%23F9FFEA' stroke-width='1.25'/%3E%3Cpath d='M9.99967 6.66683C9.11562 6.66683 8.26777 7.01802 7.64265 7.64314C7.01753 8.26826 6.66634 9.11611 6.66634 10.0002V30.0002C6.66634 30.8842 7.01753 31.7321 7.64265 32.3572C8.26777 32.9823 9.11562 33.3335 9.99967 33.3335H29.9997C30.8837 33.3335 31.7316 32.9823 32.3567 32.3572C32.9818 31.7321 33.333 30.8842 33.333 30.0002V10.0002C33.333 9.11611 32.9818 8.26826 32.3567 7.64314C31.7316 7.01802 30.8837 6.66683 29.9997 6.66683H9.99967ZM9.99967 3.3335H29.9997C31.7678 3.3335 33.4635 4.03588 34.7137 5.28612C35.964 6.53636 36.6663 8.23205 36.6663 10.0002V30.0002C36.6663 31.7683 35.964 33.464 34.7137 34.7142C33.4635 35.9645 31.7678 36.6668 29.9997 36.6668H9.99967C8.23156 36.6668 6.53587 35.9645 5.28563 34.7142C4.03539 33.464 3.33301 31.7683 3.33301 30.0002V10.0002C3.33301 8.23205 4.03539 6.53636 5.28563 5.28612C6.53587 4.03588 8.23156 3.3335 9.99967 3.3335Z' fill='%2386BF50' stroke='%23F9FFEA' stroke-width='1.25'/%3E%3C/svg%3E");
}

.footer-bottom {
    padding-top: 40px;
    font-size: 14px;
    border-top: 1px solid #DEE2E6;
    display: flex;
    justify-content: space-between;
    margin-top: 40px;
}

.footer-bottom__copyright {
    color: #495057;
}

.footer-bottom__links {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 40px;
}

.footer-bottom__links a {
    color: #495057;
}

.position-relative {
    position: relative;
}

.absoluteleft {
    position: absolute;
    left: 0;
    bottom: 20px;
    right: 0;
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
    max-width: 1200px;
    text-align: left;
    margin: 0 auto;
    width: calc(100% - 40px);
}

.absoluteleft-inner {
    border-radius: 20px;
    border: 2px solid rgba(255, 255, 255, 0.30);
    background: linear-gradient(108deg, rgba(255, 255, 255, 0.05) -0.79%, rgba(255, 255, 255, 0.21) 103.15%);
    box-shadow: 0px 4px 8.4px 0px rgba(0, 0, 0, 0.25);
    backdrop-filter: blur(12px);
    padding: 32px 24px;
    box-sizing: border-box;
}

.hero-title {
    color: #FFF;
    /* font-family: "Zeyada", cursive; */
    font-size: 32px;
    /* font-weight: 400; */
    letter-spacing: 1.92px;
    line-height: 1;
}

.hero-title span {
    display: block;
    color: #FFF;
    font-family: "Zeyada", cursive;
    font-size: 88px;
    padding-top: 16px;
    /* font-weight: 400;
    letter-spacing: 1.92px;
    line-height: 1; */
}

.hero-desc {
    color: #FFF;
    font-size: 16px;
    letter-spacing: 0.2px;
    margin: 24px 0;
}

.alink-theme-btn {
    border-radius: 16px;
    border: 2px solid #39871D;
    background: linear-gradient(107deg, #86BF50 -0.73%, #51871D 106.91%);
    box-shadow: 0px 4px 8.4px 0px rgba(0, 0, 0, 0.10);
    backdrop-filter: blur(20px);
    color: #fff;
    padding: 18px 30px;
    display: inline-flex;
    line-height: 1;
    font-weight: 600;
}

.gettouch-image img {
    width: 100%;
    display: flex;
    align-items: start;
}

.contact-form {
    max-width: 565px;
    background: #F9F9F9;
    padding: 40px 40px 40px 0;
    margin-left: 56px;
}

.contact-form h2 {
    margin-bottom: 20px;
    font-family: 'Zeyada', cursive;
    font-size: 36px;
}

.contact-form input, .contact-form textarea {
    width: 100%;
    margin-bottom: 20px;
    border-radius: 2px;
    background-color: #FFF;
    border: 1px solid #E2E7F0;
    padding: 16px;
}

.contact-form input[type="submit"] {
    color: white;
    cursor: pointer;
    padding: 12px 30px;
    font-size: 16px;
    border: 2px solid #39871D;
    background: linear-gradient(107deg, #86BF50 -0.73%, #51871D 106.91%);
    box-shadow: 0px 4px 8.4px 0px rgba(0, 0, 0, 0.10);
    backdrop-filter: blur(20px);
    border-radius: 16px;
    font-family: "Poppins", sans-serif;
    display: inline-flex;
    width: 140px;
    justify-content: center;
}

.contact-form input[type="submit"]:hover {
    background: #45a049;
}

label {
    font-family: "Poppins", sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    display: block;
    margin-bottom: 4px;
}

.gettouch-title {
    font-size: 88px;
    font-family: "Zeyada", cursive;
    color: #FFF;
    padding: 40px 142px 0px;
    background-color: #86BF50;
}

.contact-gettouch {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin-top: 2px;
}

.contactus-title {
    font-size: 48px;
    font-family: "Zeyada", cursive;
    color: #212529;
}

.contact-us-section {
    background: #F9F9F9;
}

footer.contact-footer {
    margin-top: 0;
}

@media only screen and (max-width: 1200px) {
    .hidden-xs {
        display: none !important;
    }

    .logo {
        width: 108px;
        padding: 0;
    }

    .header {
        padding: 0 16px;
    }

    .homie-freshlygrid {
        display: revert;
    }

    .hydroponic-title {
        font-family: Poppins;
        font-size: 26px;
        font-style: normal;
        font-weight: 400;
        line-height: normal; 
        padding: 16px 38px 0px 20px;
        line-height: 1;
    }

    .footer-title span {
        font-size: 42px;
    }

    .hydroponic-content {
        color: #86BF50;
        font-family: Zeyada;
        font-size: 42px;
        font-style: normal;
        font-weight: 400;
        display: inline;
    }

    .hero-title span {
      font-size: 76px;
    }

    .hydroponic-desc {
        padding: 16px 20px;
        font-size: 14px;
        line-height: 24px;
        color: #343A40;
        font-weight: 400;
    }

    .freshness-image img {
        width: 100%;
        padding: 40px 0px;
    }

    .cultivate-title {
        font-family: Poppins;
        font-size: 26px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        padding: 0px 0px 40px;
    }

    .cultivate-title span {
        font-family: Zeyada;
        font-size: 42px;
        font-style: normal;
        font-weight: 400;
        line-height: 48px;
        letter-spacing: 1.68px;
        display: block;
        padding-top: 6px;
    }

    .lettuce-image.mobile-lettuce-content {
        grid-column-end: span 2;
        text-align: left;
    }

    .and-more-mint {
        grid-column-end: span 2;
        text-align: center;
    }

    .lettuce-image, .mint-image {
        text-align: center;
    }

    .vertical-system-title {
        font-size: 16px;
        font-weight: 600;
        padding-bottom: 8px;
    }

    .vertical-system {
        padding: 0px 0px 32px 28px;
        line-height: 24px;
    }

    .vertical-system-desc {
        color: #343A40;
        font-size: 14px;
    }

    .lettuce-image img {
        width: 141px;
    }

    .lettuce-basil {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        padding: 0px 22px;
    }

    .lettuce-content {
        font-size: 34px;
        font-weight: 400;
        padding: 24px;
    }

    .lettuce-grow {
        color: #86BF50;
        font-size: 82px;
        line-height: 64px;
        font-family: "Zeyada", cursive;
    }

    .lettuce-batavia {
        padding: 0px 22px;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }

    .herbs-leaf {
        text-align: center;
        padding: 22px 40px 40px;
    }

    .herbs-title {
        font-size: 24px;
        font-weight: 700;
        color: #212529;
        padding: 16px 0px 8px;
    }

    .herbs-desc {
        font-size: 14px;
        font-weight: 400;
        padding-bottom: 32px;
        color: #343A40;
    }

    .mint-basil {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        padding: 0px 22px;
        gap: 30px;
    }

    .mint-image img {
        width: 130px;
    }

    .mint-batavia {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        padding: 0px 22px;
        gap: 40px;
        padding-top: 22px;
    }

    .homie-works-title, .testimonials-title, .blogtree-title, .recipes-heading {
        font-size: 42px;
        line-height: 48px;
        font-family: "Zeyada", cursive;
        text-align: center;
        padding: 56px 0px 16px;
        font-weight: 400;
        color: #212529;
    }

    .homie-works img {
        width: 328px;
        text-align: center;
        padding: 16px;
    }

    .better-resource-title {
        font-size: 34px;
        font-weight: 400;
        color: #212529;
    }

    .better-resource-title span {
        font-size: 83px;
        font-family: "Zeyada", cursive;
        line-height: 64px;
        color: #86BF50;
    }

    .better-resource {
        padding: 0px 24px 0px 16px;
    }

    .better-resource-content {
        color: #212529;
        font-size: 16px;
        font-weight: 400;
        line-height: 28px;
        padding-bottom: 40px;
    }

    .weather-proof-title {
        font-size: 20px;
        font-weight: 600;
        padding-bottom: 4px;
        color: #212529;
    }

    .weather-proof, .ground-round {
        text-align: center;
    }

    .weather-proof-growth {
        padding-bottom: 40px;
    }

    .gettouch-image img {
        width: 100%;
    }

    .contact-form {
        max-width: 720px;
        margin: auto;
        background: #F9F9F9;
        padding: 40px;
        border-radius: 8px;
    }

    .contact-form h2 {
        margin-bottom: 20px;
        font-family: 'Zeyada', cursive;
        font-size: 36px;
    }

    .contact-form input, .contact-form textarea {
        width: calc(100% - 20px);
        margin-bottom: 20px;
        border-radius: 2px;
        background-color: #FFF;
        border: 1px solid #E2E7F0;
        padding: 16px;
    }

    .contact-form input[type="submit"] {
        width: 140px;
        color: white;
        cursor: pointer;
        padding: 15px;
        font-size: 16px;
        border: 2px solid #39871D;
        background: linear-gradient(107deg, #86BF50 -0.73%, #51871D 106.91%);
        box-shadow: 0px 4px 8.4px 0px rgba(0, 0, 0, 0.10);
        backdrop-filter: blur(20px);
        border-radius: 16px;
    }

    .contact-form input[type="submit"]:hover {
        background: #45a049;
    }

    label {
        font-family: "Poppins", sans-serif;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 24px;
    }

    .gettouch-title {
        font-size: 35px;
        font-family: "Zeyada", cursive;
        color: #FFF;
        padding: 16px 0;
        background-color: #86BF50;
        text-align: center;
        line-height: 1;
    }

    .contact-gettouch {
        display: grid;
        grid-template-columns: 1fr;
    }

    .contactus-title {
        font-size: 48px;
        font-family: "Zeyada", cursive;
        color: #212529;
        font-size: 16px;
        font-weight: 400;
        line-height: 28px;
        color: #343A40;
    }

    .croppico-garden-image img {
        width: 234px;
    }

    .testimonials-croppico {
        text-align: center;
    }

    .croppico-garden-desc {
        font-size: 14px;
        color: #212529;
        font-weight: 400;
        line-height: 24px;
        padding: 22px 36px;
    }

    .croppico-garden {
        padding-bottom: 26px;
    }

    .from-croppico-heading {
        font-size: 42px;
        font-weight: 400;
        line-height: 48px;
        font-family: "Zeyada", cursive;
        color: #212529;
    }

    .from-croppico-heading span {
        color: #86BF50;
    }

    .from-croppico-white {
        margin: 32px 0 0 32px;
        background: #fff;
        padding: 32px;
    }

    .background-green {
        background: #86BF50;
    }

    .from-croppico-content {
        color: #212529;
        /* padding-top: 16px; */
        font-weight: 400;
        line-height: 28px;
    }

    .from-croppico-image img {
        width: 100%;
    }

    .homiefreshly-image {
        text-align: center;
    }

    .homiefreshly-image img {
        width: 116px;
    }

    .blog-title, .tabledelight-title {
        font-size: 18px;
        font-weight: 500;
        padding: 24px 16px 8px;
        color: #212529;
    }

    .blog-desc, .tabledelight-content {
        color: #495057;
        padding: 0px 16px 24px;
        font-weight: 400;
        font-size: 16px;
        line-height: 28px;
    }

    .tabledelight-image img {
        width: 100%;
    }

    .freshness-everyday {
        padding: 0px 20px;
    }

    .blog-image img {
        width: 100%;
    }

    .vertical-system:before {
        content: "";
        display: inline-block;
        width: 24px;
        height: 24px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Ccircle cx='12' cy='12' r='11' fill='white' stroke='%2386BF50' stroke-width='2'/%3E%3Ccircle cx='12' cy='12' r='3' fill='%23212529'/%3E%3C/svg%3E");
        position: absolute;
        left: -11px;
    }

    .vertical-system {
        position: relative;
    }

    .cultivate-automate {
        border-left: 1px solid #86BF50;
        /* padding: 19px 0 0 0; */
    }

    footer {
        background: rgba(249, 255, 234, 0.99);
        padding: 40px 32px 56px;
        margin-top: 72px;
    }

    .footer-row {
        display: flex;
        flex-direction: column;
    }

    .phone-contact-address {
        flex-direction: column;
        padding-bottom: 40px;
    }

    .footer-title {
        margin-bottom: 40px;
    }

    .footer-bottom {
        flex-direction: column;
    }

    .footer-bottom__links {
        flex-direction: column;
        justify-content: start;
        align-items: start;
        gap: 16px;
    }

    .footer-bottom__copyright {
        padding-bottom: 24px;
    }

    .footer-subscribe-form button {
        margin-top: 12px;
    }
}

@media only screen and (min-width: 1200px) {
    .hidden-lg {
        display: none !important;
    }

    .eighth-section {
        padding: 94px;
    }

    .position-relative {
        position: relative;
    }

    .absoluteleft {
        top: 0;
        bottom: 0;
    }

    .absoluteleft-inner {
        width: 695px;
        padding: 40px;
    }

    .hero-title {
        font-size: 44px;
        letter-spacing: 3.52px;
    }
    .hero-title span {
        padding-top: 24px;
        font-family: "Zeyada", cursive;
    }

    .hero-desc {
        font-size: 20px;
        letter-spacing: 0.2px;
        margin: 16px 0;
    }

    a.alink-theme-btn {
        padding: 18px 30px;
    }

    .vertical-system {
        padding-left: 51px;
        position: relative;
    }

    .vertical-system:before {
        content: "";
        display: inline-block;
        width: 24px;
        height: 24px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Ccircle cx='12' cy='12' r='11' fill='white' stroke='%2386BF50' stroke-width='2'/%3E%3Ccircle cx='12' cy='12' r='3' fill='%23212529'/%3E%3C/svg%3E");
        left: -11px;
        position: absolute;
    }

    .cultivate-automate > .vertical-system:last-child .vertical-system-desc {
        padding: 0;
    }

    .mint-image {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .herbs-leaf {
        display: grid;
        gap: 144px;
        text-align: center;
        grid-template-columns: repeat(3, 1fr);
    }

    footer {
        padding: 47px 0 64px;
    }

    .footer-title {
        font-size: 32px;
    }

    .footer-subscribe-form {
        display: flex;
        gap: 8px;
    }

    .footer-row {
        padding: 30px 0 0;
        display: flex;
        justify-content: space-between;
    }
}
.inputgroup {
    position: relative;
    margin-bottom: 10px;
}

.inputgroup span.error {
    position: absolute;
    bottom: -2px;
    font-size: 12px;
}

.tooltip {
    visibility: hidden; 
    position: absolute; 
    background-color: #86BF50;
    border: 1px solid #86BF50; 
    color: #212529; 
    padding: 5px 20px; 
    border-radius: 15px; 
    left: 50%; 
    transform: translateX(-50%); 
    white-space: nowrap; 
    z-index: 1; 
}

.mint-image .tooltip{
    bottom: 0;
}
.tooltip::before {
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%) rotate(180deg);
    border-width: 8px;
    border-style: solid;
    border-color: #86BF50 transparent transparent transparent;
    top: -17px;
}

.eleventh-section, .twelfth-section{
    display: none;
}

.lettuce-image {
    position: relative;
    display: inline-block;
    text-align: center;
}
.lettuce-image:hover .tooltip{
    visibility: visible;
}

.lettuce-image .tooltip{
    bottom: -20%;
}

.mint-image:hover .tooltip {
    visibility: visible; 
}
.homie-works- {
    /* width: 100%; */
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.homie-works- iframe{
    /* width: 100%;
    height: 315px; */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
/*.footer-bottom__links{*/
/*    display: none;*/
/*}*/
.swiper-container.swiper-initialized.swiper-horizontal.swiper-backface-hidden {
    overflow: hidden;
}
@media only screen and (min-width: 1200px) {
    .homie-works- iframe{
        height: 720px;
    }   
}
.homie-works-title {
    color: #212529;
    font-family: Poppins;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.homie-works-title span {
    color: #86BF50;
    font-weight: 400;
    text-align: center;
    font-family: "Zeyada", cursive;
    line-height: 64px;
}
@media screen and (min-width: 1200px) {
    .homie-works-title {
        font-size: 44px;
    }
    .homie-works-title span {
        font-size: 72px;
    }   
}
@media screen and (max-width: 1200px) {
    .homie-works-title {
        font-size: 26px;
    }
    .homie-works-title span {
        font-size: 42px;
    }
    .absoluteleft-inner {
        width: 100%;
    }
    .hero-title {
        word-wrap: break-word;
    }
}
.contact_button {
    position: relative;
}
.loader {
    width: 17px;
    height: 17px;
    border: 4px solid #39871D;
    border-bottom-color: #fff;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
    position: absolute;
    top: 18px;
    left: 17px;
    display: none;
}

@keyframes rotation {
0% {
    transform: rotate(0deg);
}
100% {
    transform: rotate(360deg);
}
}