diff --git a/src/routes/Header.svelte b/src/routes/Header.svelte
index 77ac3bd..21ba401 100644
--- a/src/routes/Header.svelte
+++ b/src/routes/Header.svelte
@@ -1,6 +1,13 @@
 <script>
 	import { page } from '$app/state';
 	import logo from '$lib/images/logo.png';
+	import { getSessionKey } from '$lib/session.js';
+	import { onMount } from 'svelte';
+
+	let sessionKey;
+	onMount(() => {
+      sessionKey = getSessionKey();
+    });
 </script>
 
 <header>
@@ -15,24 +22,27 @@
 			<path d="M0,0 L1,2 C1.5,3 1.5,3 2,3 L2,0 Z" />
 		</svg>
 		<ul>
-			{#if ['/login', '/signup', '/register'].includes(page.url.pathname)}
+			{#if sessionKey === null}
 				<li aria-current={page.url.pathname === '/login' ? 'page' : undefined}>
 					<a href="/login{page.url.search}">Login</a>
 				</li>
 				<li aria-current={page.url.pathname === '/signup' ? 'page' : undefined}>
 					<a href="/signup{page.url.search}">Signup</a>
 				</li>
+				<li aria-current={page.url.pathname === '/about' ? 'page' : undefined}>
+					<a href="/about">About</a>
+				</li>
 			{:else}
 				<li aria-current={page.url.pathname === '/' ? 'page' : undefined}>
 					<a href="/">Home</a>
 				</li>
+				<li aria-current={page.url.pathname === '/about' ? 'page' : undefined}>
+					<a href="/about">About</a>
+				</li>
 				<li aria-current={page.url.pathname === '/logout' ? 'page' : undefined}>
 					<a href="/logout">Logout</a>
 				</li>
 				{/if}
-				<li aria-current={page.url.pathname === '/about' ? 'page' : undefined}>
-					<a href="/about">About</a>
-				</li>
 		</ul>
 		<svg viewBox="0 0 2 3" aria-hidden="true">
 			<path d="M0,0 L0,3 C0.5,3 0.5,3 1,2 L2,0 Z" />