diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index b302ae1..d866609 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -27,3 +27,35 @@
 	>
 </nav>
 {@render children?.()}
+
+<style>
+	nav {
+		margin: var(--d3);
+
+		font-family: 'Fraunces', serif;
+		font-optical-sizing: auto;
+		font-weight: 400;
+		font-style: normal;
+		font-variation-settings:
+			'SOFT' 0,
+			'WONK' 0;
+		font-size: 1.728rem;
+	}
+
+	nav a {
+		margin: 1rem;
+		margin-left: 0rem;
+		padding-left: 0rem;
+		#border-bottom: solid var(--rp-moon-foam);
+		color: var(--rp-moon-foam);
+		&:visited {
+			color: var(--rp-moon-foam);
+		}
+	}
+
+	@media only screen and (max-width: 700px) {
+		nav {
+			margin: var(--d3) var(--d1);
+		}
+	}
+</style>
diff --git a/src/routes/style.css b/src/routes/style.css
index 4dff96f..ae3f053 100644
--- a/src/routes/style.css
+++ b/src/routes/style.css
@@ -78,33 +78,6 @@ h1,h2,h3,h4,p:first-child {
 }
 
 
-nav {
-    margin: var(--d3) 0 ;
-
-    padding: 0 var(--d3) 0;
-
-    font-family: "Fraunces", serif;
-    font-optical-sizing: auto;
-    font-weight: 400;
-    font-style: normal;
-    font-variation-settings:
-        "SOFT" 0,
-        "WONK" 0;
-    font-size:1.728rem;
-}
-
-nav a{
-    margin: 1rem;
-    margin-left: 0rem;
-    padding-left: 0rem;
-    border-bottom: solid var(--rp-moon-foam);
-    color: var(--rp-moon-foam);
-    #text-decoration: underline;
-    &:visited {
-        color: var(--rp-moon-foam);
-    }
-}
-
 main {
     width: 100%;
     #box-shadow: 0px 0px 1rem 0px hsl(from var(--rp-moon-base) h s calc(l * 0.85));