From 1b1cded96900517b4c41416a71412d23a622dd07 Mon Sep 17 00:00:00 2001
From: akansha-02 <akanshaa649@gmail.com>
Date: Fri, 18 Oct 2024 14:39:41 +0530
Subject: [PATCH 1/2] updated style in mobile view

---
 style.css | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/style.css b/style.css
index c8e99fc..085b4dc 100644
--- a/style.css
+++ b/style.css
@@ -577,6 +577,19 @@ li a:hover {
     margin-top: 0rem;
 
 
+}
+@media (max-width : 768px) {
+  .ride{
+    display: flex;
+    flex-direction: column;
+  }
+  section{
+    padding: 50px 20px ;
+  }
+
+  #review{
+    width: 100% !important;
+  }
 }
 .ride span{
   font-size: 40px;

From c02df45fd5d49fe6f2b5d55ac19045ccb59962e1 Mon Sep 17 00:00:00 2001
From: Akansha Gupta <akanshaa649@gmail.com>
Date: Sun, 20 Oct 2024 12:44:24 +0530
Subject: [PATCH 2/2] Update index.html

---
 index.html | 245 +++++++++++++++++++++++++++++++++--------------------
 1 file changed, 154 insertions(+), 91 deletions(-)

diff --git a/index.html b/index.html
index 26fb861..bf30784 100644
--- a/index.html
+++ b/index.html
@@ -140,98 +140,161 @@
             margin-bottom: 20px;
         }
 
-        .swiper-slide {
-            display: flex;
-            flex-direction: column;
-            align-items: center;
-            justify-content: center;
-            text-align: center;
-            padding: 20px;
-            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
-            background-color: #fff;
-            border-radius: 10px;
-            transition: transform 0.3s;
-        }
-
-        .swiper-slide img {
-            width: 100px;
-            height: 100px;
-            border-radius: 50%;
-            margin-bottom: 10px;
-        }
-
-        .swiper-slide h3 {
-            font-size: 1.5rem;
-            margin: 10px 0;
-        }
-
-        .swiper-slide p {
-            font-size: 1rem;
-            color: #777;
-            margin-bottom: 15px;
-        }
-
-        .stars i {
-            color: #fbc02d;
-        }
-
-        /* Hover effect */
-        .swiper-slide:hover {
-            transform: scale(1.05);
-        }
-
-        /* Responsive Styles */
-        @media screen and (max-width: 1200px) {
-            .swiper-slide {
-                max-width: 80%;
-            }
-        }
-
-        @media screen and (max-width: 768px) {
-            .heading {
-                font-size: 2rem;
-            }
-
-            .swiper-slide {
-                max-width: 90%;
-                padding: 15px;
-            }
-
-            .swiper-slide h3 {
-                font-size: 1.3rem;
-            }
+      /* Main Swiper Slide Styling */
+.swiper-slide {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    text-align: center;
+    padding: 20px;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+    background-color: #fff;
+    border-radius: 10px;
+    transition: transform 0.3s ease-in-out;
+}
+
+.swiper-slide img {
+    width: 100px;
+    height: 100px;
+    border-radius: 50%;
+    margin-bottom: 10px;
+}
+
+.swiper-slide h3 {
+    font-size: 1.5rem;
+    margin: 10px 0;
+}
+
+.swiper-slide p {
+    font-size: 1rem;
+    color: #777;
+    margin-bottom: 15px;
+}
+
+.stars i {
+    color: #fbc02d;
+}
+
+/* Hover effect */
+.swiper-slide:hover {
+    transform: scale(1.05);
+}
+
+/* Responsive Styles */
+/* Medium Devices (Up to 1200px) */
+@media screen and (max-width: 1200px) {
+    .swiper-slide {
+        max-width: 100%;
+        padding: 16px;
+    }
+}
+
+/* Small Devices (Up to 768px) */
+@media screen and (max-width: 768px) {
+    .heading {
+        font-size: 2rem;
+        text-align: center;
+    }
+
+    .swiper-slide {
+        max-width: 100%;
+        padding: 12px;
+    }
+
+    .swiper-slide img {
+        width: 80px;
+        height: 80px;
+    }
+
+    .swiper-slide h3 {
+        font-size: 1.2rem;
+        margin: 8px 0;
+    }
+
+    .swiper-slide p {
+        font-size: 0.9rem;
+        margin-bottom: 10px;
+    }
+}
+
+/* Extra Small Devices (Up to 576px) */
+@media screen and (max-width: 576px) {
+    .heading {
+        font-size: 1.5rem;
+        text-align: center;
+    }
+
+    .swiper-slide {
+        max-width: 100%;
+        padding: 10px;
+    }
+
+    .swiper-slide img {
+        width: 70px;
+        height: 70px;
+    }
+
+    .swiper-slide h3 {
+        font-size: 1rem;
+        margin: 8px 0;
+    }
+
+    .swiper-slide p {
+        font-size: 0.85rem;
+    }
+}
+
+/* Ultra Small Devices (Up to 400px) */
+@media screen and (max-width: 400px) {
+    .heading {
+        font-size: 1.2rem;
+        text-align: center;
+    }
+
+    .swiper-slide {
+        max-width: 100%;
+        padding: 8px;
+    }
+
+    .swiper-slide img {
+        width: 60px;
+        height: 60px;
+    }
+
+    .swiper-slide h3 {
+        font-size: 0.9rem;
+        margin: 5px 0;
+    }
+
+    .swiper-slide p {
+        font-size: 0.75rem;
+    }
+}
+
+/* Additional styling for swiper pagination */
+.swiper-pagination {
+    position: relative;
+    bottom: 10px;
+    display: flex;
+    justify-content: center;
+}
+
+/* Additional responsive pagination size adjustments */
+@media screen and (max-width: 768px) {
+    .swiper-pagination-bullet {
+        width: 10px;
+        height: 10px;
+    }
+}
+
+@media screen and (max-width: 400px) {
+    .swiper-pagination-bullet {
+        width: 8px;
+        height: 8px;
+    }
+}
 
-            .swiper-slide p {
-                font-size: 0.9rem;
-            }
-        }
-
-        @media screen and (max-width: 576px) {
-            .heading {
-                font-size: 1.8rem;
-            }
-
-            .swiper-slide {
-                max-width: 100%;
-                padding: 10px;
-            }
-
-            .swiper-slide h3 {
-                font-size: 1.2rem;
-            }
-
-            .swiper-slide p {
-                font-size: 0.8rem;
-            }
-        }
-
-        /* Additional styling for swiper pagination */
-        .swiper-pagination {
-            position: relative;
-            bottom: 10px;
-            display: flex;
-            justify-content: center;
-        }
 
         /* General Styles */
         .container_1 {