
@media (max-width:765px) {

    * section{
        width: 100%;
        padding: 4rem 1.2rem;
        padding-bottom: 2rem;
    }
    * h2{
        font-size: 32px;
        font-weight: 400;
    }
    .address-banner{
        flex-direction: column;
        row-gap: 1rem;
    }
    .address{
        flex-direction: column;
        row-gap: 1rem;
    }
    .contactInfo{
        flex-direction: row;
        align-items: center;
        column-gap: 1rem;
    }

    /* Hero-section */
    .hero-section{
        height: 80vh;
    }
    .hero-div{
        padding: 1rem;
    }
    .content-div{
        width: 100%;
    }
    .content-div h1{
        font-size: 2.6rem; line-height: 3.1rem; font-weight: 700;
    }

    .aboutUsImage{
        margin-top: 2rem;
    }
    .ctaImage{
        margin-top: 2rem;
    }
    .cta{
        background-color: transparent;
    }
    /* Service_section */
    .service-card{
        flex-direction: column;
        row-gap: 1rem;
    }
    .cateringService{
        width: 100%;
        height: 500px;
    }
    .overlayContent h3{
        text-align: center;
    }
    .vegetable{
        flex-direction: column;
    }
    .service-content{
        padding: 1.5rem;
    }

    /* Grocery_list */
    .listheader{
        flex-direction: column; align-items: start; row-gap: 1rem;
    }
    .listtab{
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }
    .grocery-item-list{
        padding: 1rem;
    }
    .itemList{
        overflow: scroll;
    }
    .category{
        flex-wrap: nowrap;
        overflow: scroll;
    }

    /* wWhy Us */
    .why-us-content{
        flex-direction: column;
        row-gap: 1rem;
    }
    .product-list{
        flex-direction: column;
    }
    .productContent{
        width: 100%;
        row-gap: 1rem;
        padding: 1.5rem;
    }

    .productShopList{
        padding: 1rem;
    }
    .aboutUs{
        flex-direction: column;
        row-gap: 3rem;
    }
    .aboutUs-content{
        padding: 1rem;
    }
    .faq-div{
        padding: 1.5rem;
        row-gap: 2rem;
    }
    .calltoaction{
        flex-direction: column;
    }
    .stockList{
        flex-wrap: wrap;
    }

    /* Call to action */
    .cta{
        background-color: var(--primaryColor);
        flex-direction: column; row-gap: 2.5rem;
    }

    .footerDiv{
        flex-direction: column;
        row-gap: 1.5;
        align-items: center;
    }
    .media-social{
        padding-bottom: 1rem;
    }
    .secondInfo{
        flex-direction: column;
        row-gap: 1.5rem;
        align-items: center;
    }
    .scroll1 img{
        width: 400px;
        height: 400px;
    }
    .social-media{
        width: 400px;
        height: 400px;
    }

  
}