diff --git a/project-app/.eslintrc.json b/project-app/.eslintrc.json
index 0ad09f5..1d4e9ab 100644
--- a/project-app/.eslintrc.json
+++ b/project-app/.eslintrc.json
@@ -1,3 +1,6 @@
 {
   "extends": ["next/babel","next/core-web-vitals"]
+
 }
+
+
diff --git a/project-app/components/Landing/Landing.jsx b/project-app/components/Landing/Landing.jsx
index 184a10f..f78fa36 100644
--- a/project-app/components/Landing/Landing.jsx
+++ b/project-app/components/Landing/Landing.jsx
@@ -3,17 +3,20 @@ import NavButton from './NavButton/NavButton.jsx'
 const LandingBanner = () => {
 
   return ( 
-    <div className='bg-hero-background bg-contain bg-no-repeat .flex flex-col '>
+    <div id="home" className='bg-hero-background min-h-screen hero-image bg-right-bottom bg-cover flex mt-[4rem]'>
 
-      <div className='grid h-screen place-items-center'>
-      <h1 className = 'text-3xl'>Project Clean-Up</h1>
-      </div>
-
-      <div className='md:w-80 md:space-x-5 p-3 inset-9 md:-mt-96'>
-        <NavButton buttonText="Button One"/> 
-        <NavButton buttonText="Button Two"/>
+    <div class="relative container mx-auto p-4 flex items-center justify-center z-10 h-48 w-2/4 mt-[10rem]" >
+      <div > 
+        <div class="flex flex-col justify-center items-center lg:items-start text-center">
+          <h1 class="text-6xl font-semibold text-gray-900 leading-none align-center">Project Clean-Up</h1>
+          <div class="flex flex-row items-center justify-between space-x-8 md:ml-24">
+            <NavButton buttonText="Button One"/> 
+            <NavButton buttonText="Button Two"/>
+          </div>
+        </div>
       </div>
     </div> 
+  </div> 
     );
 
 }
diff --git a/project-app/components/Navbar/Navbar.jsx b/project-app/components/Navbar/Navbar.jsx
index 3e89b91..dc42bd5 100644
--- a/project-app/components/Navbar/Navbar.jsx
+++ b/project-app/components/Navbar/Navbar.jsx
@@ -54,7 +54,7 @@ const Navbar = () => {
   );
 
   return (
-    <div className="fixed">
+    <div className="fixed z-20">
       <div className=" flex justify-between w-[100vw] bg-[#004F54] text-[white] ml-[0px] px-[2em] py-[2em]">
         <div>Logo</div>
         <Link href="#home">
diff --git a/project-app/styles/globals.css b/project-app/styles/globals.css
index f9750d4..7e8f660 100644
--- a/project-app/styles/globals.css
+++ b/project-app/styles/globals.css
@@ -18,4 +18,8 @@ body{
 img {
   border: none;
 }
+.hero-background{
+  width: 100%;
+  height:auto
+}
 
diff --git a/project-app/tailwind.config.js b/project-app/tailwind.config.js
index 19cfc68..f4cb967 100644
--- a/project-app/tailwind.config.js
+++ b/project-app/tailwind.config.js
@@ -8,6 +8,7 @@ module.exports = {
     extend: {
       backgroundImage: {
         'hero-background': "url('/hero-background.png')",
+       
       }
     },
   },