diff --git a/public/svgs/TrustAuthXLogo.tsx b/public/svgs/TrustAuthXLogo.tsx
index f739e36..d4c8a05 100644
--- a/public/svgs/TrustAuthXLogo.tsx
+++ b/public/svgs/TrustAuthXLogo.tsx
@@ -7,6 +7,7 @@ export const TrustAuthXLogo = () => {
       height="50"
       viewBox="0 0 47 47"
       fill="none"
+      className="p-1 md:p-0"
       xmlns="http://www.w3.org/2000/svg"
     >
       <g id="Group 852">
diff --git a/src/components/AiInCLI.tsx b/src/components/AiInCLI.tsx
index 835fff7..d56cb83 100644
--- a/src/components/AiInCLI.tsx
+++ b/src/components/AiInCLI.tsx
@@ -7,7 +7,7 @@ function AiInCli() {
 
   return (
     <div
-      className="p-2 md:py-14"
+      className="p-4 md:py-14"
       style={{
         background: isMobile
           ? "black"
diff --git a/src/components/LandingHero.tsx b/src/components/LandingHero.tsx
index 06b501c..45d3661 100644
--- a/src/components/LandingHero.tsx
+++ b/src/components/LandingHero.tsx
@@ -10,11 +10,11 @@ export default function LandingHero() {
     <>
       <InteractivePrism
         bgColor="black"
-        height={isMobile ? "80vh" : "60rem"}
+        height={isMobile ? "50vh" : "60rem"}
         isMobile={!!isMobile}
       />
       {/*CTA*/}
-      <h1 className="left-10 top-52 z-10 w-fit p-0 text-left text-4xl text-white mix-blend-exclusion md:absolute md:left-20 md:top-64 md:text-7xl">
+      <h1 className="left-10 top-28 z-10 w-fit p-0 text-left text-4xl text-white mix-blend-exclusion md:absolute md:left-20 md:top-64 md:text-7xl">
         TrustAuthX Light <br />
         for Business, <br />
         Delight for Devs.
diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
index dfbefc0..a4d6aaf 100644
--- a/src/components/Navbar.tsx
+++ b/src/components/Navbar.tsx
@@ -45,7 +45,7 @@ function Navbar() {
 
   return (
     <>
-      <div className="fixed z-[1000] flex w-full justify-between border-b-[0.5px] border-[#696C70] bg-[#00000068] px-6 py-2 text-white mix-blend-luminosity backdrop-blur-[75px] md:py-6">
+      <div className="fixed z-[1000] flex w-full justify-between border-b-[0.5px] border-[#696C70] bg-[#00000068] px-6 text-white mix-blend-luminosity backdrop-blur-[75px] md:py-3">
         {/*Internal Links*/}
         <div className="flex items-center gap-7">
           <TrustAuthXLogo />
@@ -73,7 +73,7 @@ function Navbar() {
 
           <DropdownMenu.Portal>
             <DropdownMenu.Content
-              className="DropdownMenuContent z-[1000] flex h-screen w-screen flex-col items-center gap-4 bg-black p-4 font-medium text-white md:hidden"
+              className="DropdownMenuContent z-[1000] -mt-2 flex h-screen w-screen flex-col items-center gap-4 bg-black p-4 font-medium text-white md:hidden"
               sideOffset={5}
             >
               {internalLinks.map((link) => (
diff --git a/src/components/Showcase.tsx b/src/components/Showcase.tsx
index a5eea14..f57c704 100644
--- a/src/components/Showcase.tsx
+++ b/src/components/Showcase.tsx
@@ -10,23 +10,26 @@ import {
   ShowcaseSocialConnectionCard,
 } from "./showcase/Components";
 import CodeTabs from "./showcase/CodeTabs";
+import { useMediaQuery } from "@mantine/hooks";
 
 function Showcase() {
+  const isMobile = useMediaQuery("(max-width: 768px)");
+
   return (
     <div className="flex flex-col  items-center justify-center p-6 sm:p-12">
       <div className="space-between flex max-w-[1110px] flex-col items-center gap-12 lg:flex-row xl:gap-48">
-        <div className="flex flex-col gap-6 ">
-          <p className="text-5xl sm:text-[80px] ">
+        <div className="flex flex-col gap-6">
+          <p className="text-3xl md:text-5xl ">
             Powerful.Simple. And Sooo... Easy to Setup
           </p>
 
-          <p className="text-[26px] text-[#777]">
+          <p className="text-xl text-[#777] md:text-[26px]">
             We made building Auth for sites easy, fast and Scalable while
             delivering best-in-class Security & performance
           </p>
         </div>
 
-        <p className="block rotate-90 text-[128px] leading-none lg:hidden">
+        <p className="block rotate-90 text-7xl leading-none md:text-[128px] lg:hidden">
           ;)
         </p>
 
@@ -211,100 +214,104 @@ function Showcase() {
                   </span>
                 </div>
 
-                <CodeTabs
-                  pyFileName="TrustAuthx.py"
-                  pyCode={
-                    <div className="text-base font-normal text-white">
-                      <p>
-                        <span className="mr-[10px]  text-[#6E7681]">1</span>
-                        <span className="text-[#FF7B72]">from </span>
-                        <span className="text-white  ">
-                          trustauthx.authlite{" "}
-                        </span>
-                        <span className="text-[#FF7B72]  ">import </span>
-                        <span className="text-white  ">AuthLiteClient</span>
-                      </p>
-
-                      <span className="mr-[10px] text-base font-normal text-[#6E7681]">
-                        2
-                      </span>
-
-                      <p>
-                        <span className="mr-[10px] text-base font-normal text-[#6E7681]">
-                          3
-                        </span>
-                        <span className="text-sky-300 ">client</span>
-                        <span className="text-white "> = </span>
-                        <span className="text-[#FF7B72] ">AuthLiteClient</span>
-                        <span className="text-white ">(</span>
-                      </p>
+                {!isMobile ? (
+                  <CodeTabs
+                    pyFileName="TrustAuthx.py"
+                    pyCode={
+                      <div className="text-base font-normal text-white">
+                        <p>
+                          <span className="mr-[10px]  text-[#6E7681]">1</span>
+                          <span className="text-[#FF7B72]">from </span>
+                          <span className="text-white  ">
+                            trustauthx.authlite{" "}
+                          </span>
+                          <span className="text-[#FF7B72]  ">import </span>
+                          <span className="text-white  ">AuthLiteClient</span>
+                        </p>
 
-                      <div className="flex items-center">
                         <span className="mr-[10px] text-base font-normal text-[#6E7681]">
-                          4
+                          2
                         </span>
 
-                        <div className="ml-10">
-                          <span className="text-sky-300 ">api_key</span>
+                        <p>
+                          <span className="mr-[10px] text-base font-normal text-[#6E7681]">
+                            3
+                          </span>
+                          <span className="text-sky-300 ">client</span>
                           <span className="text-white "> = </span>
                           <span className="text-[#FF7B72] ">
-                            {"f28ffe7f2e..."}
+                            AuthLiteClient
                           </span>
-                          <span className="text-white ">,</span>
-                        </div>
-                      </div>
+                          <span className="text-white ">(</span>
+                        </p>
 
-                      <div className="flex items-center">
-                        <span className="mr-[10px] text-base font-normal text-[#6E7681]">
-                          5
-                        </span>
-
-                        <div className="ml-10">
-                          <span className="text-sky-300 ">secret_key</span>
-                          <span className="text-white "> = </span>
-                          <span className="text-[#FF7B72] ">
-                            {"f28ffe7f2e..."}
+                        <div className="flex items-center">
+                          <span className="mr-[10px] text-base font-normal text-[#6E7681]">
+                            4
                           </span>
-                          <span className="text-white ">,</span>
+
+                          <div className="ml-10">
+                            <span className="text-sky-300 ">api_key</span>
+                            <span className="text-white "> = </span>
+                            <span className="text-[#FF7B72] ">
+                              {"f28ffe7f2e..."}
+                            </span>
+                            <span className="text-white ">,</span>
+                          </div>
                         </div>
-                      </div>
 
-                      <div className="flex items-center">
-                        <span className="mr-[10px] text-base font-normal text-[#6E7681]">
-                          6
-                        </span>
+                        <div className="flex items-center">
+                          <span className="mr-[10px] text-base font-normal text-[#6E7681]">
+                            5
+                          </span>
 
-                        <div className="ml-10">
-                          <span className="text-sky-300 ">org_id</span>
-                          <span className="text-white "> = </span>
-                          <span className="text-[#FF7B72] ">
-                            {"f28ffe7f2e..."}
+                          <div className="ml-10">
+                            <span className="text-sky-300 ">secret_key</span>
+                            <span className="text-white "> = </span>
+                            <span className="text-[#FF7B72] ">
+                              {"f28ffe7f2e..."}
+                            </span>
+                            <span className="text-white ">,</span>
+                          </div>
+                        </div>
+
+                        <div className="flex items-center">
+                          <span className="mr-[10px] text-base font-normal text-[#6E7681]">
+                            6
                           </span>
-                          <span className="text-white ">,</span>
+
+                          <div className="ml-10">
+                            <span className="text-sky-300 ">org_id</span>
+                            <span className="text-white "> = </span>
+                            <span className="text-[#FF7B72] ">
+                              {"f28ffe7f2e..."}
+                            </span>
+                            <span className="text-white ">,</span>
+                          </div>
                         </div>
-                      </div>
 
-                      <div className="flex items-center">
-                        <span className="mr-[10px] text-base font-normal text-[#6E7681]">
-                          7
-                        </span>
+                        <div className="flex items-center">
+                          <span className="mr-[10px] text-base font-normal text-[#6E7681]">
+                            7
+                          </span>
 
-                        <div className="ml-44">)</div>
-                      </div>
+                          <div className="ml-44">)</div>
+                        </div>
 
-                      <p className="">
-                        <span className="mr-[10px] text-base font-normal text-[#6E7681]">
-                          8
-                        </span>
-                        <span className="text-white  ">def </span>
-                        <span className="text-[#FF7B72]  ">get_auth_</span>
-                        <span className="text-white  ">():</span>
-                      </p>
-                    </div>
-                  }
-                  jsFileName="Auth.js"
-                  goFileName="TrustAuthx.go"
-                />
+                        <p className="">
+                          <span className="mr-[10px] text-base font-normal text-[#6E7681]">
+                            8
+                          </span>
+                          <span className="text-white  ">def </span>
+                          <span className="text-[#FF7B72]  ">get_auth_</span>
+                          <span className="text-white  ">():</span>
+                        </p>
+                      </div>
+                    }
+                    jsFileName="Auth.js"
+                    goFileName="TrustAuthx.go"
+                  />
+                ) : null}
               </div>
             </div>
 
diff --git a/src/components/showcase/CodeTabs.tsx b/src/components/showcase/CodeTabs.tsx
index 8321dbc..bdc399e 100644
--- a/src/components/showcase/CodeTabs.tsx
+++ b/src/components/showcase/CodeTabs.tsx
@@ -20,18 +20,11 @@ const CodeTabs = ({
   const getCode = () => {
     switch (activeTab) {
       case "javascript":
-        return <div>js</div>;
+        return "";
       case "python":
         return pyCode || "";
       case "go":
-        return (
-          <div>
-            func TrustAuthX(){" "}
-            {
-              // Go code
-            }
-          </div>
-        );
+        return "";
     }
   };
 
@@ -40,7 +33,7 @@ const CodeTabs = ({
       <div className="flex space-x-2 rounded-t-xl border-b border-b-[#30363D] bg-[#161B23] md:px-2 md:pr-24 md:pt-2">
         {pyFileName ? (
           <button
-            className={`flex items-center  gap-7 rounded  px-4 py-2   pr-10 text-[14px] ${
+            className={`flex items-center gap-7 rounded px-4 py-2 pr-10 text-[14px] ${
               activeTab === "python"
                 ? "border border-[#30363D] border-b-black  bg-[#0D1117] text-white"
                 : "border border-transparent bg-transparent text-[#7D8590] "
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index c26c13e..cb9a7ed 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -8,15 +8,18 @@ import LandingHero from "../components/LandingHero";
 import React from "react";
 import AiInCLI from "../components/AiInCLI";
 import Navbar from "../components/Navbar";
+import { useMediaQuery } from "@mantine/hooks";
 
 export default function LandingPage() {
+  const isMobile = useMediaQuery("(max-width: 768px)");
+
   return (
     <>
       <Navbar />
       <LandingHero />
       <AiInCLI />
       <GradientPlatform />
-      <Timeline />
+      {!isMobile ? <Timeline /> : null}
       <Authlite />
       <Showcase />
       {/* <Customize /> */}