@media screen and (max-width: 500px) {
  /* #navMenu {
    display: none; */
  /* } */

  .arrow{
    display: none;
  }
  .hamburger {
    display: block;
    height: 50px;
    width: 50px;
    /* background: red; */
  }

  .hero {
    flex-direction: column;
    gap: 30px;
  }
  .service-grid {
    /* flex-direction: column;
     */
     flex-wrap: wrap;
  }
  .arrow {
    /* border: none; */
    rotate: calc(90deg);
  }
  .stats-card {
    /* padding: 20px; */
  grid-template-columns:  1fr;

  }
  .app{
    flex-direction: column;
  }
  .appbottomsection {
    flex-direction: column;
  }

  .stores{
    flex-direction: column;
  }

  .testimonial-grid {
      grid-template-columns:1fr;
  }
  .footer-container {
 flex-direction: column-reverse;
  }
  .footer-right {
    width: 100vw;
    /* background: red; */
    gap: 20px;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    /* padding-left: 55%; */
  }
  .active {
    background: red;
    display: block;
  }
  /* .how-section {
    margin-top: 1000px;
  } */


  .ride-card{
width:92%;
margin-top:20px;
padding:20px;
}

.services{
    margin-top: 90px;
}

.features-card{
    margin-left: 20px;
    background-color: transparent;
}

.features-card{
    margin-left: 30px;
}
.features-card li::before{
    margin-left: 30px;
}

.book-btn{
    position: relative;
    bottom: 20px;
   
}

.ride-card{
    height: 300px ;
}

.center{
    margin-top: 20px;
}


#navMenu{
position:fixed;
top:70px;
right:-100%;
width:250px;
height:100vh;
background:#fff;
flex-direction:column;
padding:30px;
transition:0.3s;
box-shadow:-5px 0 15px rgba(0,0,0,0.1);
}

#navMenu.active{
right:0;
}

.nav-m{
display:flex;
flex-direction:column;
gap:20px;
margin-bottom:20px;
}

.hamburger{
display:block;
font-size:24px;
cursor:pointer;
} 

.why-section{
    grid-template-columns:1fr ,1fr;

}
.social-icons{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between  ;
}

}