diff --git a/css/navbar.css b/css/navbar.css
index 90e9d52..aa348c2 100644
--- a/css/navbar.css
+++ b/css/navbar.css
@@ -1,3 +1,6 @@
+/*
+CSS für den Block Navbar mit seinen Elementen nach BEM
+ */
 .nav {
     display: flex;
     justify-content: space-between;
@@ -50,13 +53,6 @@
     text-decoration: none;
 }
 
-.nav__link:not(:last-child)::after,
-.nav__dropdown:not(:last-child)::after {
-    content: '|';
-    margin: 0 0.75rem;
-    color: #ccc;
-}
-
 /* CSS von https://responsivenavigation.net/examples/simple-toggle/ */
 /*
 .nav { width:100%; background-color: #fff; border-bottom: 1px solid #ccc; }
diff --git a/includes/navbar.php b/includes/navbar.php
index f00448f..147acdc 100644
--- a/includes/navbar.php
+++ b/includes/navbar.php
@@ -2,72 +2,94 @@
 Globales Menü, wird via PHP später in alle Seiten eingebunden
 -->
 <nav class="nav">
-    <div style="float:left; text-align: center;">
-        <a href="index.php">
-	        <img src="images/logo.png" alt="" style="height: 44px;">
+    <div class="nav__left">
+        <a href="index.php" class="nav_logo">
+	        <img src="images/logo.png" alt="Logo" style="height: 44px;">
 	    </a>
-    |
-    <div style="padding:5px;text-align:center;display:inline-block;">
-      <b>Sprachen</b>
-      <div style="display:none;">
-        <a href="content/deutsch.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Deutsch</b></a>
-        <a href="content/englisch.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Englisch</b></a>
-        <a href="content/franzoesisch.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Französisch</b></a>
-        <a href="content/latein.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Latein</b></a>
-        <a href="content/literatur.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Literatur</b></a>
-      </div>
     </div>
-    |
-    <div style="padding:5px;text-align:center;display:inline-block;">
-      <b>MINT</b>
-      <div style="display:none;">
-        <a href="content/mathematik.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Mathematik</b></a>
-        <a href="content/biologie.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Biologie</b></a>
-        <a href="content/chemie.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Chemie</b></a>
-        <a href="content/physik.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Physik</b></a>
-        <a href="content/informatik.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Informatik</b></a>
-        <a href="content/astronomie.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Astronomie</b></a>
-        <a href="content/technik.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Technik</b></a>
-      </div>
-    </div>
-    |
-    <div style="padding:5px;text-align:center;display:inline-block;">
-      <b>Gesellschaft & Werte</b>
-      <div style="display:none;">
-        <a href="content/geschichte.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Geschichte</b></a>
-        <a href="content/erdkunde.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Erdkunde</b></a>
-        <a href="content/sozialkunde.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Sozialkunde</b></a>
-        <a href="content/wirtschaftskunde.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Wirtschaftskunde</b></a>
-        <a href="content/religion.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Religion</b></a>
-        <a href="content/ethik.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Ethikunterricht</b></a>
-        <a href="content/philosophie.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Philosophie</b></a>
-        <a href="content/psychologie.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Psychologie</b></a>
-        <a href="content/kunst.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Kunst</b></a>
-        <a href="content/musik.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Musik</b></a>
-        <a href="content/theater.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Theater</b></a>
-      </div>
-    </div>
-    |
-    <div style="padding:5px;text-align:center;display:inline-block;">
-      <b>Technik & Praxis</b>
-      <div style="display:none;">
-        <a href="content/technik.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Technik</b></a>
-        <a href="content/werken.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Werken</b></a>
-        <a href="content/hauswirtschaft.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Hauswirtschaft</b></a>
-        <a href="content/sport.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Sport</b></a>
-      </div>
-    </div>
-    |
-	<a href = "content/profile.php" style = "padding: 5px; text-align: center; text-decoration: none; display: inline-block;"><b>Dein Profil</b></a>
-	|
-	</div>
-    <div style="float:right; text-align: center;">
-	<?php
-	include_once 'search.php';
-	?>
-	|
-	<a href = "auth/login.php" style = "background-color: #f44336; color: white; padding: 4px 20px; text-align: center; text-decoration: none; display: inline-block;"> Anmelden </a>
 
-	<a href = "auth/register.php" style = "background-color: #f44336; color: white; padding: 4px 20px; text-align: center; text-decoration: none; display: inline-block;"> Registrieren </a>
+    <div class="nav__center">
+        <div class="nav__item nav__dropdown">
+            <button class="nav__dropdown-toggle">Sprachen</button>
+            <div class="nav__dropdown-menu">
+                <a href="content/deutsch.php">Deutsch</a>
+                |
+                <a href="content/englisch.php">Englisch</a>
+                |
+                <a href="content/franzoesisch.php">Französisch</a>
+                |
+                <a href="content/latein.php">Latein</a>
+                |
+                <a href="content/literatur.php">Literatur</a>
+            </div>
+        </div>
+        <div class="nav__item nav__dropdown">
+            <button class="nav__dropdown-toggle">MINT</button>
+            <div class="nav__dropdown-menu">
+                <a href="content/mathematik.php">Mathematik</a>
+                |
+                <a href="content/biologie.php">Biologie</a>
+                |
+                <a href="content/chemie.php">Chemie</a>
+                |
+                <a href="content/physik.php">Physik</a>
+                |
+                <a href="content/informatik.php">Informatik</a>
+                |
+                <a href="content/astronomie.php">Astronomie</a></div>
+            </div>
+        </div>
+        <div class="nav__item nav__dropdown">
+            <button class="nav__dropdown-toggle">Gesellschaft & Werte</button>
+            <div class="nav__dropdown-menu">
+                <a href="content/geschichte.php">Geschichte</a>
+                |
+                <a href="content/erdkunde.php">Erdkunde</a>
+                |
+                <a href="content/sozialkunde.php">Sozialkunde</a>
+                |
+                <a href="content/wirtschaftskunde.php">Wirtschaftskunde</a>
+                |
+                <a href="content/religion.php">Religion</a>
+                |
+                <a href="content/ethik.php">Ethikunterricht</a>
+                |
+                <a href="content/philosophie.php">Philosophie</a>
+                |
+                <a href="content/psychologie.php">Psychologie</a>
+                |
+                <a href="content/kunst.php">Kunst</a>
+                |
+                <a href="content/musik.php">Musik</a>
+                |
+                <a href="content/theater.php">Theater</a>
+            </div>
+        </div>
+        <div class="nav__item nav__dropdown">
+            <button class="nav__dropdown-toggle">Technik & Praxis</button>
+            <div class="nav__dropdown-menu">
+                <a href="content/technik.php">Technik</a>
+                |
+                <a href="content/werken.php">Werken</a>
+                |
+                <a href="content/hauswirtschaft.php">Hauswirtschaft</a>
+                |
+                <a href="content/sport.php">Sport</a>
+            </div>
+        </div>
+    </div>
+
+    <div class="nav__right">
+            <a href = "content/profile.php" style = "padding: 5px; text-align: center; text-decoration: none; display: inline-block;"><b>Dein Profil</b></a>
+            |
+            <div class="nav__search">
+            <?php
+            include_once 'search.php';
+            ?>
+            </div>
+            |
+	        <a href = "auth/login.php" style = "background-color: #f44336; color: white; padding: 4px 20px; text-align: center; text-decoration: none; display: inline-block;"> Anmelden </a>
+            |
+	        <a href = "auth/register.php" style = "background-color: #f44336; color: white; padding: 4px 20px; text-align: center; text-decoration: none; display: inline-block;"> Registrieren </a>
     </div>
 </nav>
\ No newline at end of file