Merge pull request #1684 from Archi-shaw/archi

fix: Improve the UI of the mentioned sections to improve user readability

Author: apu52

counter.css

@@ -13,8 +13,8 @@
 
   }
   .countitem {
-    width: 28vmin;
-    height: 28vmin;
+    width: 36vmin;
+    height: 32vmin;
     display: flex;
     flex-direction: column;
     justify-content: space-around;
@@ -53,21 +53,21 @@
       width: 85vw;
     }
     .countitem{
-      height: 26vmin;
-      width: 26vmin;
-      font-size: 12px;
+      height: 40vmin;
+      width: 40vmin;
+      font-size: 8px;
     }
   }
   @media screen and (max-width: 768px) {
     .wrapper {
       width: 90vw;
       flex-wrap: wrap;
-      gap: 30px;
+      gap: 20px;
     }
     .countitem {
-      width: calc(50% - 40px);
-      height: 30vmin;
-      font-size: 14px;
+      width: calc(80% - 40px);
+      height: 36vmin;
+      font-size: 7px;
     }
   }
   @media screen and (max-width: 480px) {
@@ -78,6 +78,6 @@
     .countitem {
       width: 100%;
       height: 25vmin;
-      font-size: 8px;
+      font-size: 6px;
     }
   }

index.html

@@ -1159,10 +1159,10 @@ <h2 class="section__title">Best trip packages</h2>
           <div class="section__container gallary__container" id="originalDiv">
             <div class="gallary__content">
               <div>
-                <h2 class="section__title" data-aos="zoom-in" style="text-align: center;">
+                <h2 class="section__title" data-aos="zoom-in" style="text-align: center; ">
                   Our trip gallery that will inspire you
                 </h2>
-                <p class="section__subtitle" data-aos="zoom-in">
+                <p class="section__subtitle" data-aos="zoom-in" style="margin: 20px;">
                   Visual Stories of Adventure to Spark Your Imagination.<br>
                   Get inspired for your next journey.
                 </p>