.destination-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    justify-items: center;
}

.destination {
    text-align: center;
}

.destination img {
    width: 150px;
    height: auto;
    object-fit: cover;
    border-radius: 10px;
    cursor: pointer;
  }

.destination p {
    margin-top: 10px; /* Adjust the margin below the image text */
    margin-bottom: 20px; /* Add margin below the image text */
}

  .cities {
  margin-left: 20px; /* Add some space between each city */
}

.cities img {
  width: 300px; /* Set the width of the city image */
  height: 220px; /* Maintain aspect ratio */
}

.cities p {
  text-align: center; /* Center-align the city name */
  margin-top: 5px; /* Add a little space between the image and the city name */
}


@media only screen and (max-width: 767px) {
    
    .destination-grid {
        grid-template-columns: repeat(4, 1fr); /* Change to a single column layout for mobile */
        gap: 30px;
        overflow-x: auto;
    }
    
    .destination {
        margin-left: 20px;
    }

    .destination img {
        border-radius: 0; /* Remove border radius for mobile */
        width: 70px;
        height: auto;
        object-fit: cover;
    }
    
}