diff --git a/public/rickroll.mp3 b/public/rickroll.mp3
deleted file mode 100644
index 77cc891..0000000
Binary files a/public/rickroll.mp3 and /dev/null differ
diff --git a/src/components/Header.astro b/src/components/Header.astro
index 80582e2..9ec8097 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -1,27 +1,31 @@
 ---
-const pathname = new URL(Astro.request.url).pathname;
-const pathSegments = pathname.slice(1).split('/').filter(segment => segment !== '');
-
-function buildHref(index) {
-    if (pathSegments.length === 0) return '/';
-    return ' /' + pathSegments.slice(0, index + 1).join('/');
-}
-
-const isLandingPage = pathSegments.length === 0;
+const { pathname } = Astro.url;
 ---
-
-<header class="flex justify-between items-center py-5">
-  <div>
-    <a class="text-l font-semibold" href="/">~</a>
-    {isLandingPage ? <span> / </span> : ''}
-    {pathSegments.map((segment, index) => (
-      <>
-        <span> / </span>
-        <a class="text-l font-semibold italic" href={buildHref(index)}>
-          {segment}
-        </a>
-      </>
-    ))}
+<header class="flex flex-col gap-6 py-5">
+  <div class="flex items-end gap-4">
+    <img class="profile" />
+    <h1 class="text-3xl font-extrabold">Sids' blog</h1>
   </div>
+  <nav class="flex flex-wrap gap-2">
+    <a class={`headerlink ${pathname === '/' ? 'headerlink-active' : ''}`} href="/">home</a>
+    <a class={`headerlink ${pathname === '/blog' ? 'headerlink-active' : ''}`} href="/blog">blog</a>
+    <a class={`headerlink ${pathname === '/logs' ? 'headerlink-active' : ''}`} href="/logs">logs</a>
+    <a class={`headerlink ${pathname === '/gallery' ? 'headerlink-active' : ''}`} href="/gallery">gallery</a>
+    <a class={`headerlink ${pathname === '/guestbook' ? 'headerlink-active' : ''}`} href="/guestbook">guestbook</a>
+    <a class={`headerlink ${pathname === '/slashes'  ? 'headerlink-active' : ''}`} href="/slashes">more</a>
+  </nav>
 </header>
 
+<style>
+  .profile {
+      width: 6vh;
+      height: 6vh;
+      background: url("/mii.webp");
+      background-size: cover;
+      border-radius: 5px;
+  }
+
+  .profile:hover {
+      background-image: url("/rick-roll-rick-ashley.gif");
+  }
+</style>
diff --git a/src/pages/index.astro b/src/pages/index.astro
deleted file mode 100644
index 959af1d..0000000
--- a/src/pages/index.astro
+++ /dev/null
@@ -1,67 +0,0 @@
----
-import SectionContainer from '../components/SectionContainer.astro';
-import HeaderLink from '../components/HeaderLink.astro';
----
-<SectionContainer>
-    <main class="flex flex-col flex-1 md:flex-row gap-6 md:mt-4">
-        <div class="profile md:order-last">
-            <audio id="rickroll" preload="auto">
-                <source src="/rickroll.mp3">
-            </audio>
-        </div>
-
-        <div class="flex flex-col text-left gap-4 w-full md:w-2/3">
-            <h1 class="text-3xl font-bold">Sid</h1>
-            <div class="flex flex-col blog">
-                <p>Software Engineer at Capgemini, following their Ignite program.</p>
-              <p>I like spending my free time bouldering/climbing, playing some games on my Wii, watching the newest One Piece episode or build cairns.</p>
-              <p>This website is just a fun side-project that I actively work on, and use as my creative outlet. It's also a way for me to actually own my data, allowing me to log data, post pictures and more!</p>
-              <p>Let me know you've been here by signing my <a href="/guestbook">guestbook</a>!</p>
-            </div>
-            <div>
-                <h1 class="text-xl font-semibold">pages</h1>
-                <ul class="flex flex-col index">
-                    <li><HeaderLink href="/about">❓ whoami</HeaderLink>~ sid, i am</li>
-                    <li><HeaderLink href="/blog">✍️ blog</HeaderLink>~ i write my thoughts sometimes</li>
-                    <li><HeaderLink href="/logs">🗂️ logs</HeaderLink>~ a record of what I've watched, read & climbed</li>
-                    <li><HeaderLink href="/gallery">📸 gallery</HeaderLink>~ moments and places of my life, in pictures</li>
-                    <li><HeaderLink href="/slashes">🦕 more</HeaderLink>~ additional slash pages</li>
-                </ul>
-            </div>
-        </div>
-    </main>
-</SectionContainer>
-
-<script>
-    document.addEventListener("DOMContentLoaded", function() {
-        const rickroll = document.getElementById("rickroll");
-        const profile = document.querySelector(".profile");
-
-        // Play audio when mouse enters
-        profile.addEventListener("mouseenter", function() {
-            rickroll.play();
-        });
-
-        // Pause and reset audio when mouse leaves
-        profile.addEventListener("mouseleave", function() {
-            rickroll.pause();
-            rickroll.currentTime = 0; 
-        });
-    });
-</script>
-
-<style>
-    .profile {
-        width: 14rem;
-        height: 14rem;
-        background: url("/mii.webp");
-        background-size: cover;
-        border-radius: 5px;
-        margin-left: auto;
-        margin-right: auto;
-    }
-
-    .profile:hover {
-        background-image: url("/rick-roll-rick-ashley.gif");
-    }
-</style>
diff --git a/src/pages/index.md b/src/pages/index.md
new file mode 100644
index 0000000..613442c
--- /dev/null
+++ b/src/pages/index.md
@@ -0,0 +1,25 @@
+---
+title: "whoami?"
+description: ""
+layout: "../layouts/Layout.astro"
+---
+
+Hallais! My name is **Sindre**, also known as ["Sid"](/avatar.webp). I'm a 20-something year old Software Engineer at Capgemini, following their internal Ignite program.
+
+Welcome to my  website! It's a fun side-project that I actively work on, and use as my creative outlet. It's also a way for me to actually own my data, allowing me to log data, post pictures and more!
+
+I like to do  a lot, but to sum it up I mostly like spending  my free time bouldering/climbing, play some games on my Wii, watch the newest One Piece episode or build cairns - check out my [collection](/gallery/cairns). Below is some other information about me!
+
+👒 One Piece is my favorite anime.
+
+🎵 Liquid DnB / Techno is my go-to music.
+
+📢 I'm an Open Source advocate and enjoy talking about it.
+
+📽️ Ready Player One or The Summit of the Gods are my favorite movies, tough choice to only have one.
+
+📚 I love the book Permanent Record, can't recommend it enough!
+
+## Want to contact me? 📫
+
+Want to say hi? You can find ways to reach me in [/contact](/contact) or let me know you've been here by signing my [guestbook](/guestbook)!
diff --git a/src/styles/global.css b/src/styles/global.css
index affee4b..5a826aa 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -32,6 +32,25 @@ hr {
 	margin: 10px 0;
 }
 
+/* HEADER */
+.headerlink {
+	border: 2px solid var(--dark-link);
+	display: flex;
+	align-items: center;
+	padding: 0.5vh 1.5vh;
+	border-radius: 10px;
+	font-size: medium;
+}
+
+.headerlink-active {
+	border: 2px solid var(--dark-link);
+	padding: 0.5vh 1vh;
+	border-radius: 10px;
+	font-weight: 600;
+	background-color: var(--dark-link);
+	color: var(--dark-bg);
+}
+
 /* FOOTER */
 .footerbg {
 	background-color: var(--dark-bg);