diff --git a/public/ux.svg b/public/images/home/ux.svg
similarity index 100%
rename from public/ux.svg
rename to public/images/home/ux.svg
diff --git a/src/app/(home)/layout.tsx b/src/app/(home)/layout.tsx
index 66b9a3a..a55b18a 100644
--- a/src/app/(home)/layout.tsx
+++ b/src/app/(home)/layout.tsx
@@ -1,6 +1,7 @@
 import Footer from '@/src/components/HomeLayoutComponents/FooterComponent'
 import Header from '@/src/components/HomeLayoutComponents/HeaderComponent'
 import React, { ReactNode } from 'react'
+import './style.css'
 
 
 
@@ -8,10 +9,12 @@ import React, { ReactNode } from 'react'
 const PublicLayout = ({ children }: { children: ReactNode }) => {
   return (
     <>
-     <Header />
-      {children}
+      <Header />
+      <div className="content">
+        {children}
+      </div>
       <Footer />
-      
+
     </>
   )
 }
diff --git a/src/app/(home)/page.tsx b/src/app/(home)/page.tsx
index ec11240..b1d365b 100644
--- a/src/app/(home)/page.tsx
+++ b/src/app/(home)/page.tsx
@@ -1,4 +1,4 @@
-import './home.css'
+import './style.css'
 import { Button } from "@/src/components/ui/button";
 import { Avatar, AvatarFallback, AvatarImage } from "@/src/components/ui/avatar";
 import { Carousel, CarouselContent, CarouselItem } from "@/src/components/ui/carousel";
@@ -14,7 +14,7 @@ export default function Home() {
       <div className="hero">
         <Container>
           <div className='flex items-center justify-center h-screen w-full '>
-            <div className="content ">
+            <div className="hero-content ">
               <h1 className="Main-Heading">Find and Book a Mentor for your 1:1 help today!</h1>
               <p>We have our 200 Mentor available, qualified in over 300 subjects</p>
               <Button size={'lg'} variant={'outline'} width={'fit'} >Find a Mentor</Button>
diff --git a/src/app/(home)/home.css b/src/app/(home)/style.css
similarity index 93%
rename from src/app/(home)/home.css
rename to src/app/(home)/style.css
index 4ff1d0c..ba20e85 100644
--- a/src/app/(home)/home.css
+++ b/src/app/(home)/style.css
@@ -1,7 +1,10 @@
+.content{
+    @apply w-full 
+}
 .hero{
     @apply  w-full   h-screen  bg-home-secondary
 }
-.content{
+.hero-content{
     @apply w-full text-center md:text-left md:w-5/12 flex flex-col gap-8
 }
 .Main-Heading{
diff --git a/src/components/HomeLayoutComponents/FooterComponent.tsx b/src/components/HomeLayoutComponents/FooterComponent.tsx
index 4d2b8c4..717e9a3 100644
--- a/src/components/HomeLayoutComponents/FooterComponent.tsx
+++ b/src/components/HomeLayoutComponents/FooterComponent.tsx
@@ -3,7 +3,7 @@ import './footer.css'
 import Link from 'next/link'
 import { Facebook, Instagram, Linkedin, Twitter } from 'lucide-react'
 import { Separator } from '@/src/components/ui/separator'
-import Navbaritems from '../NavBar/NAvbarItems'
+import Navbaritems from '../NavBar/NavbarItem'
 
 
 function Footer() {
diff --git a/src/components/NavBar/NavbarComponent.tsx b/src/components/NavBar/NavbarComponent.tsx
index 8b73e20..ec2230a 100644
--- a/src/components/NavBar/NavbarComponent.tsx
+++ b/src/components/NavBar/NavbarComponent.tsx
@@ -4,7 +4,7 @@ import './navbar.css'
 import { Sheet, SheetContent, SheetTrigger } from '../ui/sheet'
 import { Button } from '../ui/button'
 import { HamIcon, Menu } from 'lucide-react'
-import Navbaritems from './NAvbarItems'
+import Navbaritems from './NavbarItem'
 
 function Navbar() {
 
diff --git a/src/components/NavBar/NavbarItems.tsx b/src/components/NavBar/NavbarItem.tsx
similarity index 100%
rename from src/components/NavBar/NavbarItems.tsx
rename to src/components/NavBar/NavbarItem.tsx