diff --git a/src/components/content/global/Footer.astro b/src/components/content/global/Footer.astro
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/content/global/Navbar.astro b/src/components/content/global/Navbar.astro
new file mode 100644
index 0000000..d06bca3
--- /dev/null
+++ b/src/components/content/global/Navbar.astro
@@ -0,0 +1,18 @@
+---
+const homeText = 'Ethan Reece'
+const links = [
+    { text: 'About Me', link: '/#about' },
+    { text: 'Projects', link: '/#projects' },
+    { text: 'Experience', link: '/#experience' },
+    { text: 'Hobbies', link: '/#hobbies' },
+    { text: 'Contact Me', link: '/#contact' },
+]
+---
+
+<div class="w-full bg-background-light px-screen-x py-screen-y">
+    <ul role="list" class="flex w-full space-x-screen-x whitespace-nowrap">
+        <a href="/">{homeText}</a>
+        <li class="w-full"></li>
+        {links.map((link) => <a href={link.link}>{link.text}</a>)}
+    </ul>
+</div>
diff --git a/src/components/content/index/About.astro b/src/components/content/index/About.astro
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/content/index/Contact.astro b/src/components/content/index/Contact.astro
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/content/index/Experience.astro b/src/components/content/index/Experience.astro
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/content/index/Hero.astro b/src/components/content/index/Hero.astro
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/content/index/Hobbies.astro b/src/components/content/index/Hobbies.astro
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/content/index/Projects.astro b/src/components/content/index/Projects.astro
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/content/index/Section.astro b/src/components/content/index/Section.astro
new file mode 100644
index 0000000..55f7f25
--- /dev/null
+++ b/src/components/content/index/Section.astro
@@ -0,0 +1,11 @@
+---
+export interface Props {
+    background: boolean
+}
+
+const { background } = Astro.props
+---
+
+<div class={background ? 'bg-background-dark' : ''}>
+    <slot />
+</div>
diff --git a/src/content/global/Navbar.astro b/src/content/global/Navbar.astro
deleted file mode 100644
index c1c7a71..0000000
--- a/src/content/global/Navbar.astro
+++ /dev/null
@@ -1,18 +0,0 @@
----
-const homeText = 'Ethan Reece'
-const links = [
-    { text: 'About Me', link: '#about' },
-    { text: 'Projects', link: '#projects' },
-    { text: 'Experience', link: '#experience' },
-    { text: 'Hobbies', link: '#hobbies' },
-    { text: 'Contact Me', link: '#contact' },
-]
----
-
-<div class="w-full bg-background-light px-screen-x py-screen-y">
-    <ul role="list" class="text flex w-full space-x-screen-x whitespace-nowrap">
-        <a href="/">{homeText}</a>
-        <li class="w-full"></li>
-        {links.map((link) => <a href={link.link}>{link.text}</a>)}
-    </ul>
-</div>
diff --git a/src/layouts/Basic.astro b/src/layouts/Base.astro
similarity index 89%
rename from src/layouts/Basic.astro
rename to src/layouts/Base.astro
index 665bb76..d878f8f 100644
--- a/src/layouts/Basic.astro
+++ b/src/layouts/Base.astro
@@ -2,7 +2,7 @@
 import Background from './properties/Background.astro'
 import Font from './properties/Font.astro'
 import Head from './properties/Head.astro'
-import Navbar from '../content/global/Navbar.astro'
+import Navbar from '../components/content/global/Navbar.astro'
 
 export interface Props {
     title: string
diff --git a/src/pages/index.astro b/src/pages/index.astro
index beadf13..8181ff4 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -1,38 +1,7 @@
 ---
-import Layout from '../layouts/Basic.astro'
-import Card from '../components/Card.astro'
+import Base from '../layouts/Base.astro'
 ---
 
-<Layout title="Ethan Reece" description="">
-    <main>
-        <h1>Welcome to <span>Astro</span></h1>
-        <p>
-            To get started, open the directory <code>src/pages</code> in your project.<br
-            />
-            <strong>Code Challenge:</strong> Tweak the "Welcome to Astro" message
-            above.
-        </p>
-        <ul role="list">
-            <Card
-                href="https://docs.astro.build/"
-                title="Documentation"
-                body="Learn how Astro works and explore the official API docs."
-            />
-            <Card
-                href="https://astro.build/integrations/"
-                title="Integrations"
-                body="Supercharge your project with new frameworks and libraries."
-            />
-            <Card
-                href="https://astro.build/themes/"
-                title="Themes"
-                body="Explore a galaxy of community-built starter themes."
-            />
-            <Card
-                href="https://astro.build/chat/"
-                title="Community"
-                body="Come say hi to our amazing Discord community. ❤️"
-            />
-        </ul>
-    </main>
-</Layout>
+<Base title="Ethan Reece" description="">
+    <p>hello world</p>
+</Base>