diff --git a/src/Umbraco.Web.UI.Client/src/less/application/grid.less b/src/Umbraco.Web.UI.Client/src/less/application/grid.less
index 02f56e4046..e909d0376d 100644
--- a/src/Umbraco.Web.UI.Client/src/less/application/grid.less
+++ b/src/Umbraco.Web.UI.Client/src/less/application/grid.less
@@ -118,6 +118,12 @@ body {
     }
 }
 
+@media (max-width: 500px) {
+    #search-form .form-search {
+        width: ~"calc(100% - 80px)"
+    }
+}
+
 #navigation {
   left: 80px;
   top: 0;
@@ -217,19 +223,17 @@ body {
     padding-left:20px
 }
 
-
-
 @media (max-width: 767px) {
 
     // make leftcolumn smaller on tablets
     #leftcolumn {
-      width: 60px;
+        width: 61px;
     }
     #applications ul.sections {
-        width: 60px;
+        width: 61px;
     }
     ul.sections.sections-tray {
-        width: 60px;
+        width: 61px;
     }
     #applications-tray {
         left: 60px;
@@ -241,35 +245,24 @@ body {
         left: 30px;
     }
     #umbracoMainPageBody .umb-modal-left.fade.in {
-      margin-left: 60px;
+        margin-left: 61px;
     }
 }
 
-
-
 @media (max-width: 500px) {
 
     // make leftcolumn smaller on mobiles
     #leftcolumn {
-      width: 40px;
+        width: 41px;
     }
     #applications ul.sections {
-        width: 40px;
-    }
-    ul.sections li [class^="icon-"]:before {
-        font-size: 25px!important;
-    }
-    #applications ul.sections li.avatar a img  {
-        width: 25px;
-    }
-    ul.sections a span {
-        display:none !important;
+        width: 41px;
     }
     #applications ul.sections-tray {
-        width: 40px;
+        width: 41px;
     }
     ul.sections.sections-tray {
-        width: 40px;
+        width: 41px;
     }
     #applications-tray {
         left: 40px;
@@ -281,7 +274,7 @@ body {
         left: 20px;
     }
     #umbracoMainPageBody .umb-modal-left.fade.in {
-        margin-left: 40px;
+        margin-left: 41px;
         width: 85%!important;
     }
 }
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/overlays.less b/src/Umbraco.Web.UI.Client/src/less/components/overlays.less
index 0af0555b89..bcdd1ba572 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/overlays.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/overlays.less
@@ -133,7 +133,7 @@
     bottom: 0;
     border: none;
     box-shadow: 0 0 20px rgba(0,0,0,0.19), 0 0 6px rgba(0,0,0,0.23);
-    margin-left: 80px;
+    margin-left: 81px;
 }
 
 .umb-overlay.umb-overlay-left .umb-overlay-header {
@@ -148,7 +148,14 @@
 
 @media (max-width: 767px) {
     .umb-overlay.umb-overlay-left {
-        margin-left: 60px;
+        margin-left: 61px;
+    }
+}
+
+@media (max-width: 500px) {
+    .umb-overlay.umb-overlay-left {
+        margin-left: 41px;
+        width: auto;
     }
 }
 
diff --git a/src/Umbraco.Web.UI.Client/src/less/sections.less b/src/Umbraco.Web.UI.Client/src/less/sections.less
index c89be83a10..26abf4404f 100644
--- a/src/Umbraco.Web.UI.Client/src/less/sections.less
+++ b/src/Umbraco.Web.UI.Client/src/less/sections.less
@@ -18,8 +18,8 @@ ul.sections li {
 	transition: all .3s linear;
 }
 
-ul.sections li [class^="icon-"]:before, 
-ul.sections li [class*=" icon-"]:before,
+ul.sections li [class^="icon-"], 
+ul.sections li [class*=" icon-"],
 ul.sections li img.icon-section {
 	font-size: 30px;
     line-height: 20px; /* set line-height to ensure all icons use same line-height */
@@ -31,8 +31,8 @@ ul.sections li img.icon-section {
 	transition: all .3s linear;
 }
 
-ul.sections:hover li [class^="icon-"]:before, 
-ul.sections:hover li [class*=" icon-"]:before,
+ul.sections:hover li [class^="icon-"], 
+ul.sections:hover li [class*=" icon-"],
 ul.sections:hover li img.icon-section {
 	opacity: 1
 }
@@ -111,32 +111,43 @@ ul.sections li.help {
 	bottom: 0;
 	left: 0;
 	display: block;
-	width: 100%;
+	width: ~"calc(100% - 5px)"; //subtract 4px orange border + 1px border-right for sections
 }
 
 ul.sections li.help a {
 	border-bottom: none;
 }
 
+@media (max-width: 500px) {
+    ul.sections li [class^="icon-"],
+    ul.sections li [class*=" icon-"] {
+        font-size: 25px;
+    }
+    ul.sections li:not(.avatar) a {
+        padding-top: 12px;
+        padding-bottom: 6px;
+
+        .icon, .icon-section {
+            display: inline-block;
+            padding-left: 2px;
+        }
+    }
+    ul.sections a span {
+        display:none;
+    }
+}
+
 // Section slide-out tray for additional apps
 // -------------------------
-li.expand a, li.expand{border: none !Important;}
+li.expand a, li.expand{border: none !important;}
 
 li.expand {
+    > a > i.icon {
+        transition: all .3s linear;
+    }
 
     &.open > a > i.icon {
-        -webkit-transition: all 1s !important;
-        -o-transition: all 1s !important;
-        -moz-transition: all 1s !important;
-        transition: all 1s !important;
-        
-        &:before {
-            -ms-transform: rotate(180deg) !important; /* IE 9 */
-            -webkit-transform: rotate(180deg) !important; /* Chrome, Safari, Opera */
-            -o-transform: rotate(180deg) !important;
-            -moz-transform: rotate(180deg) !important;
-            transform: rotate(180deg) !important;
-        }
+        transform: rotate(180deg);
     }
 }