diff --git a/src/components/LandingHero.tsx b/src/components/LandingHero.tsx
index 68abc06..20c7690 100644
--- a/src/components/LandingHero.tsx
+++ b/src/components/LandingHero.tsx
@@ -5,7 +5,7 @@ import { ArrowRight } from "lucide-react";
 export default function LandingHero() {
   return (
     <section className="flex items-center bg-background py-12 md:py-24 lg:pt-32 ">
-      <div className="container mx-auto flex flex-col items-center md:px-36 ">
+      <div className="container mx-auto flex flex-col items-center md:px-48 ">
         <div>
           <div className="md:px-2">
             <Button
@@ -18,25 +18,27 @@ export default function LandingHero() {
               <ArrowRight size={"1rem"} />
             </Button>
           </div>
-          <div className="flex flex-wrap justify-between">
-            <div className="text-5xl tracking-wide md:w-1/2 md:px-2 md:text-6xl md:leading-tight">
-              Web3 payments for the 
-              <span className="font-bold">  Internet.. 🌐</span>
+          <div className="flex flex-wrap justify-between md:flex-nowrap">
+            <div className="text-5xl tracking-wide md:w-1/2 md:px-2 md:text-[3.5rem] md:leading-tight">
+              Web3 payments for the
+              <span className="font-bold"> Internet.. 🌐</span>
             </div>
-            <div className="mt-3 flex flex-col justify-between gap-6 px-6 py-4 md:w-1/2 ">
-              <p className="text-base text-muted-foreground">
+            <div className="mt-3 flex flex-col gap-8 md:w-1/2  md:pl-16 ">
+              <p className="text-muted-foreground">
                 {"Appwrite's"} open-source platform lets you add Auth, DBs,
                 Functions and Storage to your product and build any application
                 at any scale, own your data, and use your preferred coding
                 languages and tools.
               </p>
               <div className="flex gap-6">
-                <Button size={"sm"} variant={"primary"}
-                className="text-slate-800 font-medium">
+                <Button size={"sm"} variant={"primary"} className="font-medium">
                   Get Started
                 </Button>
-                <Button variant={"outline"} size={"sm"}
-                className="border-0 text-white">
+                <Button
+                  variant={"outline"}
+                  size={"sm"}
+                  className="border-0 text-white"
+                >
                   Join the waitlist
                 </Button>
               </div>
diff --git a/src/components/WhatsFlitchPay.tsx b/src/components/WhatsFlitchPay.tsx
index f7e8c91..2a0e9ee 100644
--- a/src/components/WhatsFlitchPay.tsx
+++ b/src/components/WhatsFlitchPay.tsx
@@ -16,7 +16,7 @@ export function WhatsFlitchPay() {
         <HeadComponent />
         <div className="mt-14 flex flex-wrap gap-4 md:flex-nowrap md:px-14 md:text-lg">
           <div className="flex flex-col justify-between gap-8 rounded-md bg-secondary md:w-1/2 ">
-            <div className="flex flex-col justify-between gap-6  px-6 pt-6 md:px-14 md:pt-14">
+            <div className="flex flex-col justify-between gap-6  px-6 pt-6 md:pt-14">
               <div>
                 Sophisticated Checkouts
                 <span className="text-muted-foreground">
@@ -38,7 +38,7 @@ export function WhatsFlitchPay() {
             </div>
           </div>
           <div className="flex flex-col gap-12 rounded-md bg-secondary md:w-1/2 md:gap-16 ">
-            <div className="flex flex-col justify-between gap-8  px-6 pt-6 md:px-14 md:pt-14">
+            <div className="flex flex-col justify-between gap-8  px-6 pt-6 md:pt-14">
               <div>
                 On Make products & Sell
                 <span className="text-muted-foreground">