diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 657759d..9280207 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -44,8 +44,10 @@ const { page, title = page, description } = Astro.props
 		<title>Henry Hiles - {page}</title>
 	</head>
 	<body>
-		<Nav />
-		<slot />
-		<Top />
+		<main>
+			<Nav />
+			<slot />
+			<Top />
+		</main>
 	</body>
 </html>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 91710cc..930828a 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -11,9 +11,7 @@ import "../styles/Home.css"
 	title="Henry Hiles"
 	description="Full Stack Web Developer and Discord Bot Developer"
 >
-	<main>
-		<Jumbo />
-		<Portfolio />
-		<About />
-	</main>
+	<Jumbo />
+	<Portfolio />
+	<About />
 </Layout>
diff --git a/src/pages/projects/[route].astro b/src/pages/projects/[route].astro
index 93f6ba8..758373c 100644
--- a/src/pages/projects/[route].astro
+++ b/src/pages/projects/[route].astro
@@ -17,56 +17,51 @@ if (project == null) return
 ---
 
 <Layout page={project.name} description={project.description}>
-	<main>
-		<section id={styles.jumbo}>
-			<h1 class={styles.title}>{project.name}</h1>
+	<section id={styles.jumbo}>
+		<h1 class={styles.title}>{project.name}</h1>
+		<Divider />
+		<p class={styles.overview}>{project.overview}</p>
+	</section>
+	<section id={styles.details} class={styles.row}>
+		<article class={styles.longDescription}>
+			<h2>Description</h2>
 			<Divider />
-			<p class={styles.overview}>{project.overview}</p>
-		</section>
-		<section id={styles.details} class={styles.row}>
-			<article class={styles.longDescription}>
-				<h2>Description</h2>
-				<Divider />
-				<section>
-					<p>
-						{project.description}
-						{project.technologies}
-					</p>
-					<div class={styles.buttonRow}>
-						{
-							project.github && (
-								<ButtonLink href={project.github} newTab>
-									Source Code
-								</ButtonLink>
-							)
-						}
-						{
-							project.demoLink && (
-								<ButtonLink href={project.demoLink} newTab>
-									Go to demo
-								</ButtonLink>
-							)
-						}
-						{
-							project.customLink && (
-								<ButtonLink
-									href={project.customLink.link}
-									newTab
-								>
-									{project.customLink.name}
-								</ButtonLink>
-							)
-						}
-					</div>
-				</section>
-			</article>
-			<article class={styles.image}>
-				<img
-					src={`/images/${project.mainImage}`}
-					alt={`Image of ${project.name}`}
-					class={styles.screenshot}
-				/>
-			</article>
-		</section>
-	</main>
+			<section>
+				<p>
+					{project.description}
+					{project.technologies}
+				</p>
+				<div class={styles.buttonRow}>
+					{
+						project.github && (
+							<ButtonLink href={project.github} newTab>
+								Source Code
+							</ButtonLink>
+						)
+					}
+					{
+						project.demoLink && (
+							<ButtonLink href={project.demoLink} newTab>
+								Go to demo
+							</ButtonLink>
+						)
+					}
+					{
+						project.customLink && (
+							<ButtonLink href={project.customLink.link} newTab>
+								{project.customLink.name}
+							</ButtonLink>
+						)
+					}
+				</div>
+			</section>
+		</article>
+		<article class={styles.image}>
+			<img
+				src={`/images/${project.mainImage}`}
+				alt={`Image of ${project.name}`}
+				class={styles.screenshot}
+			/>
+		</article>
+	</section>
 </Layout>
diff --git a/src/styles/Home.css b/src/styles/Home.css
index 1d75517..ac0d25c 100644
--- a/src/styles/Home.css
+++ b/src/styles/Home.css
@@ -1,10 +1,10 @@
+main > section {
+	min-height: 80vh;
+}
+
 main > section > :is(h1, h2) {
 	font-size: 2.5rem;
 	margin: 0;
 	text-align: center;
 	text-transform: uppercase;
 }
-
-main > section {
-	min-height: 80vh;
-}
diff --git a/src/styles/Layout.css b/src/styles/Layout.css
index f321bc4..2a2f99a 100644
--- a/src/styles/Layout.css
+++ b/src/styles/Layout.css
@@ -34,23 +34,29 @@ img {
 
 main {
 	display: flex;
-	gap: 2rem;
+	gap: 3rem;
 	flex-direction: column;
 	align-items: center;
 	padding-bottom: 10em;
 }
 
 main > section {
-	scroll-margin-top: 9rem;
 	display: flex;
 	flex-direction: column;
 	border-radius: 1rem;
 	background: rgb(0 0 0 / 0.3);
 	padding: 2rem;
 	width: 90%;
+	scroll-margin: 1rem;
 	transition: scale 0.2s;
 }
 
 main > section:hover {
 	scale: 1.03;
 }
+
+@media (min-width: 500px) {
+	main > section {
+		scroll-margin: 6rem;
+	}
+}
diff --git a/src/styles/Nav.module.css b/src/styles/Nav.module.css
index 129fe4c..9dab91d 100644
--- a/src/styles/Nav.module.css
+++ b/src/styles/Nav.module.css
@@ -1,5 +1,6 @@
 .nav {
 	display: flex;
+	width: 100%;
 	align-items: center;
 	justify-content: space-between;
 	font-weight: bold;
diff --git a/src/styles/Project.module.css b/src/styles/Project.module.css
index 4319a6c..c0c007b 100644
--- a/src/styles/Project.module.css
+++ b/src/styles/Project.module.css
@@ -1,7 +1,3 @@
-main {
-	padding: 2em 0;
-}
-
 .overview {
 	width: 100%;
 	padding: 20px;
