diff --git a/static/js/custom.js b/static/js/custom.js
index a77ddbd..8d65f12 100644
--- a/static/js/custom.js
+++ b/static/js/custom.js
@@ -3,11 +3,12 @@
 //-----------------------------------------------------------
 function show_search() {
     $('#nav-search').removeClass('hide');
+    $('#nav-content').addClass('hide');
 
 }
 function hide_search() {
     $('#nav-search').addClass('hide');
-
+    $('#nav-content').removeClass('hide');
 }
 
 //-----------------------------------------------------------
diff --git a/templates/template.html b/templates/template.html
index 71f2fb2..b371bf9 100644
--- a/templates/template.html
+++ b/templates/template.html
@@ -64,36 +64,38 @@
                </div>
              </form>
            </div>
-           <img class="hide-on-med-and-down" style="padding-left: 10px" src="static/img/headscale3-dots.png" height="64px"></img>
-           <a href="overview" class="brand-logo bold" style="padding-left: 10px">
-               Headscale
-               <div class="right">
-                  <span class="left-align thin hide-on-small-only" style="padding-left: 10px">
-                     {% block header %}{% endblock %}
-                  </span>
-               </div>
-            </a>
-           <a href="#!" data-target="mobile" class="sidenav-trigger"><i class="material-icons">menu</i></a>
-           <ul class="right hide-on-med-and-down">
-               {% block INPAGE_SEARCH %}{% endblock %}
-               <li role="menu-item" class="tooltipped {{ overview_active   }}" data-position="bottom" data-tooltip="Overview">
-                  <a href="overview"><i class="material-icons">map</i></a>
-               </li>
-               <li role="menu-item" class="tooltipped {{ machines_active    }}" data-position="bottom" data-tooltip="Machines">
-                  <a href="machines"><i class="material-icons">devices</i></a>
-               </li>
-               <li role="menu-item" class="tooltipped {{ users_active }}" data-position="bottom" data-tooltip="Users">
-                  <a href="users"><i class="material-icons">people</i></a>
-               </li>
-               <li role="menu-item" class="tooltipped {{ settings_active   }}" data-position="bottom" data-tooltip="Settings">
-                  <a href="settings"><i class="material-icons">settings</i></a>
-               </li>
-               {% block OIDC_NAV_DROPDOWN %}{% endblock %}
-            </ul>
+           <div id="nav-content">
+            <img class="hide-on-med-and-down" style="padding-left: 10px" src="static/img/headscale3-dots.png" height="64px"></img>
+            <a href="overview" class="brand-logo bold" style="padding-left: 10px">
+                Headscale
+                <div class="right">
+                   <span class="left-align thin hide-on-small-only" style="padding-left: 10px">
+                      {% block header %}{% endblock %}
+                   </span>
+                </div>
+             </a>
+            <a href="#!" data-target="mobile" class="sidenav-trigger"><i class="material-icons">menu</i></a>
+            <ul class="right hide-on-med-and-down">
+                {% block INPAGE_SEARCH %}{% endblock %}
+                <li role="menu-item" class="tooltipped {{ overview_active   }}" data-position="bottom" data-tooltip="Overview">
+                   <a href="overview"><i class="material-icons">map</i></a>
+                </li>
+                <li role="menu-item" class="tooltipped {{ machines_active    }}" data-position="bottom" data-tooltip="Machines">
+                   <a href="machines"><i class="material-icons">devices</i></a>
+                </li>
+                <li role="menu-item" class="tooltipped {{ users_active }}" data-position="bottom" data-tooltip="Users">
+                   <a href="users"><i class="material-icons">people</i></a>
+                </li>
+                <li role="menu-item" class="tooltipped {{ settings_active   }}" data-position="bottom" data-tooltip="Settings">
+                   <a href="settings"><i class="material-icons">settings</i></a>
+                </li>
+                {% block OIDC_NAV_DROPDOWN %}{% endblock %}
+             </ul>
+           </div>
          </div>
        </nav>
        <ul class="sidenav" id="mobile">
-         <li><a href="/"><i class="material-icons left">map</i>Overview</a></li>
+         <li><a href="overview"><i class="material-icons left">map</i>Overview</a></li>
          <li><a href="machines"><i class="material-icons left">devices</i>Machines</a></li>
          <li><a href="users"><i class="material-icons left">people</i>Users</a></li>
          <li><a href="settings"><i class="material-icons left">settings</i>Settings</a></li>