diff --git a/media/css/seahub.css b/media/css/seahub.css
index 541ec613a4..9b40ca7984 100644
--- a/media/css/seahub.css
+++ b/media/css/seahub.css
@@ -683,6 +683,7 @@ textarea:-moz-placeholder {/* for FF */
         overflow-x:hidden;
         overflow-y:auto;
         border-right:1px solid #eee;
+        box-shadow:0 0 4px #ccc;
     }
 }
 .side-tabnav {
@@ -743,6 +744,15 @@ textarea:-moz-placeholder {/* for FF */
     line-height:1;
     color:#999;
 }
+.side-nav-toggle {
+    background:#fff;
+    font-size:1rem;
+    padding:6px 8px;
+    color:#666;
+}
+.side-nav-toggle:hover {
+    background:#ddd;
+}
 #group-nav .sharp {
     display:inline-block;
     width:42px;
diff --git a/seahub/templates/base_for_backbone.html b/seahub/templates/base_for_backbone.html
index 9e5865fa5d..dc450cdc13 100644
--- a/seahub/templates/base_for_backbone.html
+++ b/seahub/templates/base_for_backbone.html
@@ -51,7 +51,7 @@
                     {% endif %}
                 </a>
 
-                <button class="sf2-icon-list-view hidden-md-up" title="Side Nav Menu" id="js-toggle-side-nav" aria-label="{% trans "Side Nav Menu" %}"></button>
+                <button class="sf2-icon-list-view side-nav-toggle hidden-md-up" title="Side Nav Menu" id="js-toggle-side-nav" aria-label="{% trans "Side Nav Menu" %}"></button>
 
                 <div class="fright">
                 {% if has_file_search %}