diff --git a/js/apps/system/_admin/aardvark/APP/frontend/js/templates/dashboardView.ejs b/js/apps/system/_admin/aardvark/APP/frontend/js/templates/dashboardView.ejs
index affd76d63b..1f04164913 100644
--- a/js/apps/system/_admin/aardvark/APP/frontend/js/templates/dashboardView.ejs
+++ b/js/apps/system/_admin/aardvark/APP/frontend/js/templates/dashboardView.ejs
@@ -13,7 +13,7 @@
   } %>
 
   <% var largeChart = function(name, title, arrows) { %>
-    <div class="dashboard-large-chart pure-u-1-1 pure-u-sm-2-3">
+    <div class="dashboard-large-chart pure-u-1-1 pure-u-sm-1-1 pure-u-md-2-3">
       <% enlargeButton(name, true); %>
       <div class="dashboard-large-chart-inner dashboard-chart" id="<%= name %>Container">
         <div class="dashboard-legend">
@@ -41,7 +41,7 @@
   <% } %>
 
   <% var smallChart = function(name, title, arrows) { %>
-    <div class="dashboard-small-chart pure-u-1-1 pure-u-sm-1-3">
+    <div class="dashboard-small-chart pure-u-1-1 pure-u-sm-1-1 pure-u-md-1-3">
       <% enlargeButton(name, arrows); %>
       <div class="dashboard-small-chart-inner dashboard-chart" id="<%= name %>Container">
         <div id="<%= name %>" class="dashboard-interior-chart">
@@ -53,7 +53,7 @@
   <% } %>
 
   <% var tendency = function(title, name, arrows) { %>
-    <div class="dashboard-tendency-container pure-u-1-1 pure-u-sm-1-3">
+    <div class="dashboard-tendency-container pure-u-1-1 pure-u-sm-1-1 pure-u-md-1-3">
       <div class="dashboard-tendency-chart">
         <% enlargeButton(name, arrows); %>
         <div class="dashboard-tendency">
@@ -114,7 +114,7 @@
   <div class="dashboard-row pure-u" style="width: 100%;">
     <% tendency("Number of threads", "numberOfThreads", false); %>
 
-    <div class="dashboard-bar-chart-container pure-u-1-1 pure-u-sm-1-3">
+    <div class="dashboard-bar-chart-container pure-u-1-1 pure-u-sm-1-1 pure-u-md-1-3">
       <div class="dashboard-bar-chart">
         <div class="dashboard-bar-chart-title">
           <div class="percentage"></div>
diff --git a/js/apps/system/_admin/aardvark/APP/frontend/scss/_body.scss b/js/apps/system/_admin/aardvark/APP/frontend/scss/_body.scss
index 9f0783d47b..a21e2939e5 100644
--- a/js/apps/system/_admin/aardvark/APP/frontend/scss/_body.scss
+++ b/js/apps/system/_admin/aardvark/APP/frontend/scss/_body.scss
@@ -17,7 +17,6 @@ body {
 
   .bodyWrapper {
     //background-image: linear-gradient(to bottom, #e9eae1 0%, #fafbfc 100%);
-    background: $c-bluegrey-bg;
     height: 100%;
     margin: 0 auto -42px;
     min-height: 100%;
diff --git a/js/apps/system/_admin/aardvark/APP/frontend/scss/_resizing.scss b/js/apps/system/_admin/aardvark/APP/frontend/scss/_resizing.scss
index 3b1ea5f95f..1064eeb8e6 100644
--- a/js/apps/system/_admin/aardvark/APP/frontend/scss/_resizing.scss
+++ b/js/apps/system/_admin/aardvark/APP/frontend/scss/_resizing.scss
@@ -11,6 +11,7 @@
 
 @media (max-width: 738px) {
 
+  // NAVIGATION
   #collectionsDropdown ul {
     width: auto !important;
   }
@@ -38,9 +39,6 @@
   }
 
   .navmenu {
-    padding-left: 20px;
-    padding-top: 0;
-    position: absolute;
   }
 }
 
@@ -567,6 +565,7 @@ div.contentWrapper {
 }
 
 div.centralRow {
+  background: $c-bluegrey-bg;
   float: left;
   height: 100%;
   left: $navbar-size;
diff --git a/js/apps/system/_admin/aardvark/APP/frontend/scss/_screenSizes.scss b/js/apps/system/_admin/aardvark/APP/frontend/scss/_screenSizes.scss
index b47d7cded8..eb29c1e178 100644
--- a/js/apps/system/_admin/aardvark/APP/frontend/scss/_screenSizes.scss
+++ b/js/apps/system/_admin/aardvark/APP/frontend/scss/_screenSizes.scss
@@ -1,8 +1,79 @@
-@media (max-width: 738px) {
-  .arango-collection-ul {
-    display: none;
+@media (max-width: 568px) {
+
+  // SINGLE NODE DASHBOARD
+  .dashboard-large-chart,
+  .dashboard-medium-chart-outer:first-child {
+    padding-right: 0 !important;
   }
 
+  .dashboard-bar-chart-container {
+    margin-bottom: 65px !important;
+    padding-left: 0 !important;
+    padding-right: 0 !important;
+  }
+
+  .dashboard-medium-chart {
+    margin-bottom: 10px;
+  }
+
+  // CONTENT DROPDOWNS
+  div.dropdownInner ul label {
+    font-size: 13px;
+  }
+
+  // NAVIGATION LEFT
+  .navbar,
+  .navmenu,
+  .primary,
+  .navlist,
+  .navlist li,
+  .primary li {
+    width: 40px !important;
+  }
+
+  .arango-collection-ul {
+    .tab {
+      font-size: 12pt;
+      height: 30px;
+      overflow: hidden;
+
+      .fa {
+        padding-left: 6px;
+        padding-right: 20px;
+      }
+    }
+  }
+
+  div.centralRow {
+    left: 40px;
+  }
+
+}
+
+@media (min-width: 569px) and (max-width: 738px) {
+
+  // SINGLE NODE DASHBOARD
+  .dashboard-large-chart,
+  .dashboard-medium-chart-outer:first-child {
+    padding-right: 0 !important;
+  }
+
+  .dashboard-bar-chart-container {
+    margin-bottom: 65px !important;
+    padding-left: 0 !important;
+    padding-right: 0 !important;
+  }
+
+  .dashboard-medium-chart {
+    margin-bottom: 10px;
+  }
+
+  #repl-numbers, #repl-progress, #repl-ticks {
+    width: 100% !important;
+  }
+
+  //NAVIGATION 
+
   .collection-dropdown {
 
     ul {
@@ -16,16 +87,8 @@
 }
 
 @media (min-width: 739px) and (max-width: 1041px) {
-  .arango-collection-ul {
-
-  }
 }
 
 
 @media (min-width: 1042px) and (max-width: 1284px) {
-  .arango-collection-ul {
-
-    a {
-    }
-  }
 }