fix responsive

templates/partials/solutions/what.html

@@ -1,6 +1,6 @@
 <div class="bg-transparent">
     <div class="mx-auto grid max-w-2xl grid-cols-1 items-center gap-x-16 gap-y-16 px-8 pt-12 mt-12 pb-24 lg:max-w-7xl lg:grid-cols-2 lg:px-8">
-      <div class="max-w-3xl px-16 pb-12">
+      <div class="max-w-3xl px-0 lg:px-16 pb-12">
         <h2 class="fade-in text-balance lg:text-4xl text-2xl leading-snug font-normal tracking-tight text-white sm:text-5xl">What You Can Do With It
         </h2>
         <p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">Today, ThreeFold is primarily focused on empowering developers to create innovative cloud solutions.</p>

templates/partials/why/impact.html

@@ -8,9 +8,9 @@
   
       <div class="mt-12 space-y-16">
         <div class="bg-transparent py-10">
-            <div class="mx-auto max-w-7xl px-6 lg:grid lg:items-center lg:grid-cols-12 lg:gap-x-8">
+            <div class="mx-auto max-w-7xl lg:grid lg:items-center lg:grid-cols-12 lg:gap-x-8">
               <!-- Text Section -->
-              <div class="lg:col-span-5 align-middle pr-4">
+              <div class="lg:col-span-5 align-middle pr-4 mb-4">
                 <h3 class="text-2xl font-medium text-white">OurWorld FreeZone</h3>
                 <p class="mt-2 text-base font-light text-gray-200 mx-auto pr-4">
                     ThreeFold is working with the Zanzibar Communication Corporation (ZICTIA), on behalf of the Zanzibar government, to create the world’s first 100% Digital Free Zone – accessible and affordable for all. <br><br>The announcement was made August 2023, and progress has been ongoing behind the scenes since then. 

templates/partials/why/reason.html

@@ -4,7 +4,7 @@
             <!-- Left Content -->
             <div class="lg:col-span-7">
                 <div class="mx-auto max-w-2xl lg:mx-0">
-                    <h1 class="fade-in text-balance text-4xl font-normal tracking-tight text-white sm:text-5xl">The Reason Behind It All</h1>
+                    <h1 class="fade-in text-balance text-3xl font-normal tracking-tight text-white lg:text-5xl">The Reason Behind It All</h1>
                     <p class="fade-in mt-6 text-lg font-light text-white">
                         The Internet started as a peer-to-peer network, but over time it has become fragile and overly centralized. This shift has led to serious issues: misinformation is rampant, privacy and security are compromised, and half the world remains poorly connected.
                         <br><br>

templates/partials/why/team.html

@@ -10,7 +10,7 @@
         <div class="mt-12 grid grid-cols-1 gap-x-4 lg:gap-y-10 lg:gap-x-8 lg:grid-cols-4 gap-y-0">
 
             <!-- Team Member -->
-            <div class="group relative fade-in">
+            <div class="group relative fade-in mb-8">
               <div class="h-56 w-full overflow-hidden rounded-md bg-gray-200 group-hover:opacity-75 lg:h-72 xl:h-80">
                 <img src="/images/kds.gif" alt="kristof_de_spiegeleer" class="size-full object-cover">
               </div>
@@ -23,7 +23,7 @@
             </div>
 
             <!-- Team Member -->
-              <div class="group relative fade-in">
+              <div class="group relative fade-in mb-8">
                 <div class="h-56 w-full overflow-hidden rounded-md bg-gray-200 group-hover:opacity-75 lg:h-72 xl:h-80">
                   <img src="/images/adnan.gif" alt="adnan_fatayerji" class="size-full object-cover">
                 </div>
@@ -36,7 +36,7 @@
               </div>
 
                 <!-- Team Member -->
-              <div class="group relative fade-in">
+              <div class="group relative fade-in mb-8">
                 <div class="h-56 w-full overflow-hidden rounded-md bg-gray-200 group-hover:opacity-75 lg:h-72 xl:h-80">
                   <img src="/images/jan.gif" alt="jan_de_landtsheer" class="size-full object-cover">
                 </div>
@@ -49,7 +49,7 @@
               </div>
                   
                     <!-- Team Member -->
-              <div class="group relative fade-in">
+              <div class="group relative fade-in mb-8">
                 <div class="h-56 w-full overflow-hidden rounded-md bg-gray-200 group-hover:opacity-75 lg:h-72 xl:h-80">
                   <img src="/images/flo.gif" alt="florian_fournier" class="size-full object-cover">
                 </div>