fix about response

templates/partials/about/about1.html

@@ -1,8 +1,11 @@
 <div class=" fade-in">
     <div class="relative isolate">
-        <div class="mx-auto max-w-7xl px-6 py-24 lg:flex lg:items-center lg:gap-x-20 lg:px-8">
+        <div class="mx-auto max-w-7xl px-6 lg:py-24 lg:flex lg:items-center lg:gap-x-20 lg:px-8">
-            <div class="mx-auto max-w-xl lg:mx-0 lg:flex-auto">
+            <div class="my-6 lg:my-16 sm:mt-24 lg:mt-0 lg:flex lg:justify-center lg:w-1/2 lg:order-2">
-                
+                <img class="w-full max-w-lg h-auto object-cover rounded-xl" src="/images/mycel5.jpg" 
+                    alt="Mobile App Screenshot">
+            </div>
+            <div class="mx-auto max-w-xl lg:mx-0 lg:flex-auto lg:order-1">
                 <h1 class="mt-2 text-4xl font-semibold tracking-tight text-black lg:text-6xl">
                     About Mycelium
                 </h1>
@@ -13,10 +16,7 @@
                     We aim to build a system that adapts to our growing digital needs while promoting sustainability and security.
                 </p>
             </div>
-            <div class="mt-16 sm:mt-24 lg:mt-0 lg:flex lg:justify-center lg:w-1/2">
+
-                <img class="w-full max-w-lg h-auto object-cover rounded-xl" src="/images/mycel5.jpg" 
-                    alt="Mobile App Screenshot">
-            </div>
         </div>
     </div>
 </div>

templates/partials/about/about3.html

@@ -1,7 +1,12 @@
 <div class=" fade-in">
     <div class="relative isolate">
-        <div class="mx-auto max-w-7xl px-6 py-12 lg:flex lg:items-center lg:gap-x-20 lg:px-8">
+        <div class="mx-auto max-w-7xl px-6 lg:py-12 lg:flex lg:items-center lg:gap-x-20 lg:px-8">
-            <div class="mx-auto max-w-xl lg:mx-0 lg:flex-auto">
+            <div class="mb-6 lg:flex lg:justify-center lg:w-1/2 lg:order-2">
+
+                <img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/efficient.jpeg" 
+                alt="Mobile App Screenshot">
+        </div>
+            <div class="mx-auto max-w-xl lg:mx-0 lg:flex-auto lg:order-1">
                 <p class="text-base/7 font-light text-black tracking-wide">BENEFITS</p>
                 <h2 class="text-balance lg:text-5xl text-4xl font-medium tracking-tight text-black">Highly Efficient</h2>
                 <h3 class="mt-6 font-light text-black lg:text-3xl text-xl">
@@ -11,12 +16,8 @@
                     Mycelium's routing algorithms prioritize minimizing latency in data transfer. This ensures that data takes the most direct and efficient route, reducing the time it takes to travel from the source node to the destination node.
                 </p>
             </div>
-            <div class="mt-16 sm:mt-24 lg:mt-0 lg:flex lg:justify-center lg:w-1/2">
+     
-                {# <img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/about1.jpg" 
+           
-                    alt="Mobile App Screenshot"> #}
-                    <img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/efficient.jpeg" 
-                    alt="Mobile App Screenshot">
-            </div>
         </div>
     </div>
 </div>

templates/partials/about/about4.html

@@ -1,7 +1,7 @@
 <div class=" fade-in bg-white">
     <div class="relative isolate">
-        <div class="mx-auto max-w-7xl px-6 py-24 lg:flex lg:items-center lg:gap-x-20 lg:px-8">
+        <div class="mx-auto max-w-7xl px-6 lg:py-24 py-12 lg:flex lg:items-center lg:gap-x-20 lg:px-8">
-            <div class="mt-16 sm:mt-24 lg:mt-0 lg:flex lg:justify-center lg:w-1/2">
+            <div class="my-6 lg:flex lg:justify-center lg:w-1/2">
                 {# <img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/about3.jpg" 
                     alt="Mobile App Screenshot"> #}
                     <img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/security.jpeg" 

templates/partials/about/about5.html

@@ -1,7 +1,11 @@
 <div class=" fade-in">
     <div class="relative isolate">
-        <div class="mx-auto max-w-7xl px-6 py-24 lg:flex lg:items-center lg:gap-x-20 lg:px-8">
+        <div class="mx-auto max-w-7xl px-6 lg:py-24 py-12 lg:flex lg:items-center lg:gap-x-20 lg:px-8">
-            <div class="mx-auto max-w-xl lg:mx-0 lg:flex-auto">
+            <div class="my-6 lg:flex lg:justify-center lg:w-1/2 lg:order-2">
+                <img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/scalability.jpeg" 
+                alt="Mobile App Screenshot">
+        </div>
+            <div class="mx-auto max-w-xl lg:mx-0 lg:flex-auto lg:order-1">
                 <p class="text-base/7 font-light text-black tracking-wide">BENEFITS</p>
                 <h2 class="text-balance lg:text-5xl text-4xl font-medium tracking-tight text-black">Enhances Scalability</h2>
                 <h3 class="mt-6 font-light text-black lg:text-3xl text-xl">
@@ -14,12 +18,6 @@
                     The system is designed to efficiently distribute network traffic. During periods of high demand or increased data transfer, Mycelium balances the load by routing data through multiple paths or nodes. This ensures the network can handle greater traffic and more users without becoming overloaded.
                 </p>
             </div>        
-            <div class="mt-16 sm:mt-24 lg:mt-0 lg:flex lg:justify-center lg:w-1/2">
-                {# <img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/about4.jpg" 
-                    alt="Mobile App Screenshot"> #}
-                    <img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/scalability.jpeg" 
-                    alt="Mobile App Screenshot">
-            </div>
         </div>
     </div>
 </div>