@media only screen and (min-width:360px) and (max-width:640px){
   

    nav {

        background: #402a23;
        padding: 20px;
        line-height: 50px;
    }

    .logo{
        scale: 0.8;
        text-align: center;
    }

    .items li a{
        scale: 0.8;
    }

    .icon{
        position: absolute;
        right:-280px;
        top: 15px;
    }

    nav>ul>.search-icon{
        scale: 0.8;
        position: absolute;
        left: 80px;
        padding: 0px;
    }
    .search-icon>.icon{
        display: flex;
    }

   .banner1>.text-on-banner1{
        display: none;
   }

   .banner1>img{
    padding:0px;
   }

   .section1 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    padding: 0px;
    gap: 100px;
   }
   .section2{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    padding:0px;
    gap: 100px;
   }
   .section3{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    padding:0px;
    gap: 100px;
   }

   .banner3{
    padding: 10px 0px;
   }
}