diff --git a/webapp/static/css/main_nav.css b/webapp/static/css/main_nav.css
index 1b0168a..4bdc2df 100644
--- a/webapp/static/css/main_nav.css
+++ b/webapp/static/css/main_nav.css
@@ -1,3 +1,3 @@
-/*.main_navigation .navbar-border .navbar-nav .nav-item {
-    display: block;
-}*/
+nav {
+    margin-bottom: 2vh;
+}
diff --git a/webapp/templates/navigation.html b/webapp/templates/navigation.html
index 42359fe..168a91f 100644
--- a/webapp/templates/navigation.html
+++ b/webapp/templates/navigation.html
@@ -1,34 +1,40 @@
 {% load i18n %}
 <link rel="stylesheet" href="/static/css/main_nav.css">
 <nav class="navbar navbar-toggleable-md navbar-light bg-faded">
-    <ul class="navbar-nav mx-auto">
-        <li class="nav-item text-center">
-            <a class="nav-link" href="/guild">{% trans "Guild" %}</a>
-        </li>
-        <li class="nav-item text-center">
-            <a class="nav-link" href="/freshmen">{% trans "Freshmen" %}</a>
-        </li>
-        <li class="nav-item text-center">
-            <a class="nav-link" href="/event_calendar">{% trans "Event calendar" %}</a>
-        </li>
-        <li class="nav-item text-center">
-            <a class="nav-link" href="/international">{% trans "International" %}</a>
-        </li>
-        <li class="nav-item text-center">
-            <a class="nav-link" href="/sosso">{% trans "Sössö" %}</a>
-        </li>
-        <li class="nav-item text-center">
-            <a class="nav-item nav-link" href="/contact">{% trans "Contact" %}</a>
-        </li>
-        <li class="nav-item dropdown">
-            <a class="nav-link dropdown-toggle" id="corpDropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                {% trans "Corporate" %}
-            </a>
-            <div class="dropdown-menu" aria-labelledby="corpDropdown">
-                <a class="dropdown-item" href="/jobs">{% trans "Jobs" %}</a>
-                <a class="dropdown-item" href="/">Yritysdadaa</a>
-                <a class="dropdown-item" href="/">Something else here</a>
-            </div>
-        </li>
-    </ul>
+    <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
+        <span class="navbar-toggler-icon"></span>
+    </button>
+    <!-- <p class="navbar-brand">Kökkö</p> -->
+    <div class="collapse navbar-collapse" id="navbarNavDropdown">
+        <ul class="navbar-nav">
+            <li class="nav-item text-center">
+                <a class="nav-link" href="/guild">{% trans "Guild" %}</a>
+            </li>
+            <li class="nav-item text-center">
+                <a class="nav-link" href="/freshmen">{% trans "Freshmen" %}</a>
+            </li>
+            <li class="nav-item text-center">
+                <a class="nav-link" href="/event_calendar">{% trans "Event calendar" %}</a>
+            </li>
+            <li class="nav-item text-center">
+                <a class="nav-link" href="/international">{% trans "International" %}</a>
+            </li>
+            <li class="nav-item text-center">
+                <a class="nav-link" href="/sosso">{% trans "Sössö" %}</a>
+            </li>
+            <li class="nav-item text-center">
+                <a class="nav-item nav-link" href="/contact">{% trans "Contact" %}</a>
+            </li>
+            <li class="nav-item dropdown text-center">
+                <a class="nav-link dropdown-toggle" id="corpDropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                    {% trans "Corporate" %}
+                </a>
+                <div class="dropdown-menu text-center" aria-labelledby="corpDropdown">
+                    <a class="dropdown-item" href="/jobs">{% trans "Jobs" %}</a>
+                    <a class="dropdown-item" href="/">Yritysdadaa</a>
+                    <a class="dropdown-item" href="/">Something else here</a>
+                </div>
+            </li>
+        </ul>
+    </div>
 </nav>