diff --git a/CSS/style.css b/CSS/style.css
index 956fbe1..6783bd2 100644
--- a/CSS/style.css
+++ b/CSS/style.css
@@ -19,10 +19,39 @@ body {
 }
 
 .top-bar h1 {
-    margin: 0;
+    margin: 0 30px 0 0;
     font-size: 1.5em;
 }
 
+.top-nav {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-right: auto;
+}
+
+.top-nav ul {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    display: flex;
+    flex-wrap: wrap;
+}
+
+.top-nav li {
+    margin-right: 15px;
+}
+
+.top-nav li a {
+    color: white;
+    text-decoration: none;
+    padding: 8px 12px;
+    border-radius: 4px;
+    background-color: transparent;
+    cursor: pointer;
+    font-size: 0.9em;
+}
+
 .user-info {
     display: flex;
     align-items: center;
diff --git a/Views/header.phtml b/Views/header.phtml
index 2987ec5..08c601f 100644
--- a/Views/header.phtml
+++ b/Views/header.phtml
@@ -11,6 +11,14 @@
     <body>
         <header class="top-bar">
             <h1>Notes App <?php if(isset($_SESSION['role']) && $_SESSION['role'] === 'admin') echo "<span style='font-size:0.7em; color:#ffdd57;'>(Admin Panel)</span>"; ?></h1>
+
+            <nav class="top-nav">
+                <ul>
+                    <li><a href="?controller=Welcome&do=showWelcome">Willkommen</a></li>
+                    <li><a href="?controller=Notes&do=showNotes">Notizen</a></li>
+                </ul>
+            </nav>
+
             <?php if (isset($_SESSION['user_id'])): ?>
                 <div class="user-info">
                     <span>Welcome, <?php echo htmlspecialchars($_SESSION['username'], ENT_QUOTES, 'UTF-8'); ?>!</span>
@@ -30,11 +38,5 @@
                 </div>
             <?php endif; ?>
         </header>
-        <nav>
-            <ul>
-                <li><a href="?controller=Welcome&do=showWelcome">Willkommen</a></li>
-                <li><a href="?controller=Notes&do=showNotes">Notizen</a></li>
-            </ul>
-        </nav>
         <div class="wrapper">
             <main>
\ No newline at end of file
