diff --git a/resources/public/css/yyy-static.css b/resources/public/css/yyy-static.css
index 4b59f3b..752c752 100644
--- a/resources/public/css/yyy-static.css
+++ b/resources/public/css/yyy-static.css
@@ -471,6 +471,14 @@ th {
     text-align: right;
   }
 
+  .hidden {
+    display: none;
+  }
+
+  .shown {
+    display: block;
+  }
+
   /* content of the current in the Wiki - editable, provided by users. Within main-container */
   #content {
     border: thin solid silver;
@@ -504,18 +512,12 @@ th {
     font-weight: bold;
   }
 
-  #nav:hover #nav-menu, #nav:hover #phone-side-bar {
-    display: block;
-    list-style-type: none;
-    width: 100%;
-  }
-
   #nav-icon {
     padding: 0;
   }
 
-  #nav-menu, #phone-side-bar {
-    display: none;
+  #nav-menu {
+    list-style-type: none;
   }
 
   #nav menu li {
diff --git a/src/cljs/youyesyet/core.cljs b/src/cljs/youyesyet/core.cljs
index ffb21f3..e123de0 100644
--- a/src/cljs/youyesyet/core.cljs
+++ b/src/cljs/youyesyet/core.cljs
@@ -28,7 +28,7 @@
      [:img {:id "nav-icon"
             :src "img/threelines.png"
             :on-click #(swap! collapsed? not)}]
-     [:menu.nav (merge {:id "nav-menu"} (when @collapsed? {:class "fred"}))
+     [:menu.nav {:id "nav-menu" :class (if @collapsed? "hidden" "shown")}
       (nav-link "#/" "Home" :home collapsed?)
       (nav-link "#/library" "Library" :library collapsed?)
       (nav-link "#/register" "Register" :register collapsed?)