*{
    margin: 0%;
    padding: 0%;
}

html,body{

    background-color: rgb(255, 82, 0);
    color: #fff;
}

.head{
     height: 100px;
     width: 100%;
     align-items: center;  
     font-size: large;  
     display: flex;
     font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;

    b{
       height: 60px;
       width: 200px;
       background-image: url(https://res.cloudinary.com/dutdah0l9/image/upload/v1720058694/Swiggy_logo_bml6he.png);
       background-size:cover ;
        margin-left: 120px;
        cursor: pointer;
      }
    
    c{
        margin-left: 400px;
        cursor: pointer; 
    }
    
    d{
       margin-left: 40px;
       cursor: pointer;
    }
    
    e{
      margin-left: 40px;
      border-radius: 10px;
        padding: 15px 10px;
        border-style: double;
        cursor: pointer;
    }
    e:hover{
      box-shadow: 0px 0px 10px rgb(255, 255, 255);
     }

    f{
        border-radius: 10px;
        margin-left: 30px;
        padding: 15px 29px;
        background-color: #000000;
        cursor: pointer;
    }
    f:hover{
      box-shadow: 0px 0px 10px black;
     }
}

.middle{
    height: 640px;
    width: 100%;
    display: flex;
}

.firstimg{
    height: 100%;
    width: 20%;
    background-color: transparent;
    background-image: url(https://media-assets.swiggy.com/swiggy/image/upload/fl_lossy,f_auto,q_auto/portal/testing/seo-home/Veggies_new.png);
    background-size: cover;
}
.beechwala{
     height: 100%;
     width: 60%;
}
  .g{
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        margin-top: 80px;
        font-size: 50px;
        text-align: center;
     }

     .e{
        display: flex;
        margin-top: 30px;
     }

     .c{
        height: 60px;
        width: 280px;
        background-color: #fff;
        border-radius: 10px;
        margin-left: 80px;
        color: rgba(0, 0, 0, 0.526);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 18px;
     }

     .ri-arrow-down-s-line{
        margin-left: 10px;
     }
     .d{
        background-color: #fff;
        color: rgba(0, 0, 0, 0.526);
        border-radius: 10px;
        margin-left: 40px;
        height: 60px;
        width: 420px;
        font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
        display: flex;
        align-items: center;
        padding: 0px 10px; 
        font-size: 20px;
     }

     .ri-search-line{
        margin-left: 70px;
     }
     .card{
        height: 280px;
        display: flex;
         overflow-x: auto; 
         white-space: nowrap;
        margin-top: 50px;
        cursor: pointer;
     }

.secoundimg{
    height: 100%;
    width: 20%;
    background-color: transparent;
    background-image: url(https://media-assets.swiggy.com/swiggy/image/upload/fl_lossy,f_auto,q_auto/portal/testing/seo-home/Sushi_replace.png);
    background-size: cover;
}

.secpage{
   height: 600px;
   width: 100%;
    display: flex; 
     display: flex; 
     align-items: center; 
    justify-content: center;
    background-color: #fff;
}

.up{
   height: 420px;    
   width: 1250px;
   overflow-x: auto; 
   white-space: nowrap;
}

.up::-webkit-scrollbar{
   display: none;
}

   .acd{
      height: 200px;
      display: flex;
      cursor: pointer;
   } 
  
   .ace{
      height: 200px;
      display: flex;
      cursor: pointer;
   }

   h2{
      height: 30px;
      font-size: 25px;
      color: rgb(0, 0, 0);
      font-family: Arial, Helvetica, sans-serif;
      display: flex;
      background-color: #fff;
      padding: 0px 150px;
   }

   .thirdpage{
      height: 350px;
      width: 100%;
      background-color: #ffffff;
      display: flex;
      justify-content: center; 
   }

   .groserypage{
      height: 280px; 
      margin-top: 30px;
       width: 1250px;
      cursor: pointer;
      overflow-x: auto; 
      white-space: nowrap;
      display: flex;
      color: rgb(16, 6, 6);     
   }


   .groserypage::-webkit-scrollbar{
      display: none;
   }
   
   .groserypage img{
      height: 200px;
      margin-left: 10px;
   }

.l{
   font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
   text-align: center;
   font-size: 15px;
   font-weight: 700;
   color: rgba(0, 0, 0, 0.864);
}

.phone{
   height: 200px;
   width: 100%;
}

.phone{
   height: 300px;
   width: 100%;
   background-image: url(https://media-assets.swiggy.com/swiggy/image/upload/fl_lossy,f_auto,q_auto/portal/m/seo/App_download_banner.png);
   background-size: cover;
}

.cc{
   height: 100px;
   width: 100%;
   font-size: 23px;
   color: #000000c9;
   background-color: #fff;
   font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
   font-weight: 900;
}

.tt{
   margin-left: 170px;
   padding-top: 70px;
}

.city{  
   height: 300px;
   background: #ffffff;
   width: 100%;
   display: flex;
   color: #000000c8;
   font-weight: 700;
}

.butone1{
   height: 100%;
   width: 30%;
   background-color: #fff;

   .oo{
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-left: 170px;
      align-items: center;
      margin-top: 30px;
      height: 45px;
      width: 260px;
      border-radius: 10px;
      box-shadow: 0px 0px 2px black;
   }

   .oo:hover{
      box-shadow: 0px 0px 10px;
   }
}

.butone2{
   height: 100%;
   width: 20%;

   .pp{
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-top: 30px;
      height: 45px;
      width: 260px;
      border-radius: 10px;
      box-shadow: 0px 0px 2px black;
   }
   .pp:hover{
      box-shadow: 0px 0px 10px;
   }
}

.butone3{
   height: 100%;
   width: 20%;

   .pp{
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-top: 30px;
      height: 45px;
      width: 260px;
      border-radius: 10px;
      box-shadow: 0px 0px 2px black;
   }

   .pp:hover{
      box-shadow: 0px 0px 10px;
   }
}

.butone4{
   height: 100%;
   width: 30%;

   .qq{
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
         margin-right: 170px;
         align-items: center;
         margin-top: 30px;
         height: 45px;
         width: 260px;
         border-radius: 10px;
         box-shadow: 0px 0px 2px black;
   }

   .qq:hover{
      box-shadow: 0px 0px 10px;
   }
}

.footer{
   background-color: #f0eeee;
   height: 450px;
   width: 100%;
   display: flex;
   color: rgba(0, 0, 0, 0.573);
   font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
   font-weight: 500;
}




.one{
   height: 100%;
   width: 35%;
}

.swi{
   margin-left: 184px;
   margin-top: 70px;
}

.limited{

      margin-top: 10px;
      text-align: center;
}

.two{
   height: 100%;
   width: 15%;
}

.firstline{
   cursor: pointer;
   height: 20px;
   width: 100%;
   margin-top: 20px;
   text-align: left;

   b{
      cursor: context-menu;
      color: black;
      font-size: 20px;
   }
}

.three{
   height: 100%;
   width: 15%;
}

.four{
   height: 100%;
   width: 15%;
}

.five{
   height: 100%;
   width: 30%;
}

.icon{
  cursor: pointer;
   margin-top: 15px;
   display: flex;
   gap: 20px;
}

hr{
   height: 1px;
   background-color: #000000d8;
}

.last{
   height: 150px;
   width: 100%;
   display: flex;
   align-items: center;
   background-color: #fff;
   font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}

.text{
   color: #000000ca;
   font-size: 22px;
   margin-left: 250px;
   font-weight: 900;
   text-shadow: 1px 1px 10px;
}

.ing{
   margin-left: 50px;
}