diff --git a/resources/templates/header.php b/resources/templates/header.php
index c91c0ff06..79110a45f 100644
--- a/resources/templates/header.php
+++ b/resources/templates/header.php
@@ -69,16 +69,20 @@
 <body>
 
    <header>
-     <img id="imgLogo" draggable=false
-     src="<?php echo getURL("assets", CONFIG["site"]["logo"]); ?>" alt="Unity Logo">
-     <button class="hamburger vertical-align">
-       <img
-         draggable="false"
-         src="<?php echo getURL("assets/menu.png") ?>"
-         alt="Menu Button"
-       >
-     </button>
-   </header>
+    <img
+      id="imgLogo"
+      draggable=false
+      src="<?php echo getURL("assets", CONFIG["site"]["logo"]); ?>"
+      alt="Unity Logo"
+    >
+    <button class="hamburger">
+      <img
+        draggable="false"
+        src="<?php echo getURL("assets/menu.png") ?>"
+        alt="Menu Button"
+      >
+    </button>
+  </header>
 
   <nav class="mainNav">
     <?php
diff --git a/webroot/css/global.css b/webroot/css/global.css
index 5dc3c736d..c3829079d 100644
--- a/webroot/css/global.css
+++ b/webroot/css/global.css
@@ -97,12 +97,6 @@ p {
   margin: 0;
 }
 
-.vertical-align {
-  position: absolute;
-  top: 50%;
-  transform: translateY(-50%);
-}
-
 button.plusBtn span {
   font-size: 24pt;
   font-family: monospace;
diff --git a/webroot/css/navbar.css b/webroot/css/navbar.css
index 60bbc683d..19e5366d1 100644
--- a/webroot/css/navbar.css
+++ b/webroot/css/navbar.css
@@ -1,5 +1,9 @@
 /* Navbar */
 
+:root {
+  --header-height: 50px;
+}
+
 hr.navHR {
   margin-left: 10px;
   margin-right: 10px;
@@ -7,13 +11,9 @@ hr.navHR {
 
 nav.mainNav {
   background: var(--accent);
-  position: fixed;
-  left: 0;
-  top: 45px;
   font-size: 11pt;
-  overflow: hidden;
   white-space: nowrap;
-  z-index: 100;
+  z-index: 9;
 }
 
 nav.mainNav a {
@@ -39,11 +39,7 @@ nav.mainNav a.active {
 
 header {
   background: var(--accent);
-  height: 50px;
-  width: 250px;
-  position: fixed;
-  top: 0;
-  left: 0;
+  height: var(--header-height);
   z-index: 10;
 }
 
@@ -73,38 +69,35 @@ header > a.unity-state:hover {
 header > button.hamburger {
   background: var(--accent);
   padding: 0;
-  right: 23px;
-  height: 60%;
+  float: right;
 }
 
 header > button.hamburger > img {
-  position: relative;
-  height: 100%;
+  height: calc(var(--header-height) * 0.6);
+  margin-top: calc(var(--header-height) * 0.2);
+  margin-right: calc(var(--header-height) * 0.2);
 }
 
 /* MOBILE VIEW */
 
 @media only screen and (max-width: 1000px) {
-  nav.mainNav {
-    right: 0;
-  }
-
   header {
     width: 100%;
   }
-
-  main {
-    /* Header element height + 2*element padding */
-    margin-top: 45px;
-  }
 }
 
 /* DESKTOP VIEW */
 
 @media only screen and (min-width: 1001px) {
+  :root {
+    --navbar-width: 250px;
+  }
+
   nav.mainNav {
-    bottom: 0;
-    width: 250px;
+    position: fixed;
+    width: var(--navbar-width);
+    padding-top: var(--header-height);
+    height: 100%;
   }
 
   header > button.hamburger {
@@ -112,10 +105,17 @@ header > button.hamburger > img {
   }
 
   main {
-    margin-left: 250px;
+    margin-left: var(--navbar-width);
   }
 
   footer {
-    margin-left: 250px;
+    margin-left: var(--navbar-width);
+  }
+
+  header {
+    width: var(--navbar-width);
+    position: fixed;
+    top: 0;
+    left: 0;
   }
 }
diff --git a/webroot/js/global-late.js b/webroot/js/global-late.js
index 69a574922..3e9aa6069 100644
--- a/webroot/js/global-late.js
+++ b/webroot/js/global-late.js
@@ -11,21 +11,7 @@
   }
 
   $("button.hamburger").on("click", function () {
-    var mainNav = $("nav.mainNav");
-    if (mainNav.is(":visible")) {
-      mainNav.fadeOut(100);
-    } else {
-      mainNav.fadeIn(100);
-    }
-  });
-
-  $(window).click(function (e) {
-    if (
-      !$(e.target).parent().hasClass("hamburger") &&
-      $("button.hamburger").is(":visible")
-    ) {
-      $("nav.mainNav").fadeOut(100);
-    }
+    $("nav.mainNav").toggle();
   });
 
   // Functions to set nav links as active. Sub links can activate parents by naming files with same prefix, for example: documentation.php and documentation_view.php activate the same link
