diff --git a/ui/src/dashboards/components/VEO.scss b/ui/src/dashboards/components/VEO.scss
index 888caa2f70..4b3280a205 100644
--- a/ui/src/dashboards/components/VEO.scss
+++ b/ui/src/dashboards/components/VEO.scss
@@ -6,8 +6,8 @@
 @import 'src/style/modules';
 
 .veo {
-  width: calc(100% - 60px);
-  height: calc(100% - 30px);
+  width: calc(100% - #{$ix-marg-e});
+  height: calc(100% - #{$ix-marg-d});
   margin: 0 auto;
   display: flex;
   flex-direction: column;
@@ -16,7 +16,7 @@
 }
 
 .veo .time-machine {
-  padding: 8px 32px;
+  padding: $page-gutter;
   padding-top: 0;
-  height: calc(100% - 80px);
+  height: calc(100% - #{$page-header-size});
 }
diff --git a/ui/src/dataExplorer/components/DataExplorer.scss b/ui/src/dataExplorer/components/DataExplorer.scss
index 41c6c20ee2..98e737c55c 100644
--- a/ui/src/dataExplorer/components/DataExplorer.scss
+++ b/ui/src/dataExplorer/components/DataExplorer.scss
@@ -8,5 +8,5 @@
 .data-explorer {
   width: 100%;
   height: 100%;
-  padding-bottom: $ix-marg-d;
+  padding-bottom: $page-gutter;
 }
diff --git a/ui/src/pageLayout/components/Page.scss b/ui/src/pageLayout/components/Page.scss
index 5ed2e97c8f..619265be5c 100644
--- a/ui/src/pageLayout/components/Page.scss
+++ b/ui/src/pageLayout/components/Page.scss
@@ -85,8 +85,8 @@
 
 .container-fluid {
   margin: 0 auto;
+  padding: $page-gutter;
   padding-top: 0;
-  padding: 0 $page-gutter;
   max-width: $page-max-width;
 
   &.full-width {
diff --git a/ui/src/shared/components/TimeMachine.tsx b/ui/src/shared/components/TimeMachine.tsx
index 008ca76183..25b312a7fe 100644
--- a/ui/src/shared/components/TimeMachine.tsx
+++ b/ui/src/shared/components/TimeMachine.tsx
@@ -11,7 +11,7 @@ import TimeMachineVis from 'src/shared/components/TimeMachineVis'
 import TimeSeries from 'src/shared/components/TimeSeries'
 
 // Constants
-const INITIAL_RESIZER_HANDLE = 0.4
+const INITIAL_RESIZER_HANDLE = 0.6
 
 // Utils
 import {getActiveTimeMachine} from 'src/shared/selectors/timeMachines'
diff --git a/ui/src/style/_grid.scss b/ui/src/style/_grid.scss
index d5142f17ec..e7e18339d7 100644
--- a/ui/src/style/_grid.scss
+++ b/ui/src/style/_grid.scss
@@ -4,10 +4,10 @@
    This more or less copies what Bootstrap uses
 */
 
-$grid--gutter: 14px;
+$grid--gutter: 8px;
 $grid--form-gutter: 6px;
 
-$grid--breakpoint-sm: 768px;
+$grid--breakpoint-sm: 750px;
 $grid--breakpoint-md: 992px;
 $grid--breakpoint-lg: 1200px;
 
diff --git a/ui/src/style/_variables.scss b/ui/src/style/_variables.scss
index 1471e0de5f..338630fa74 100644
--- a/ui/src/style/_variables.scss
+++ b/ui/src/style/_variables.scss
@@ -5,14 +5,14 @@
 
 /* Page Layout */
 
-$nav-size: 54px;
+$nav-size: 50px;
 $nav-breakpoint: 800px;
-$page-header-size: 80px;
+$page-header-size: 66px;
 $page-max-width: 1300px;
-$page-gutter: 32px;
+$page-gutter: 16px;
 $page-title-size: 21px;
 $page-title-weight: 400;
-$sidebar--width: 54px; //delete this later
+$sidebar--width: 50px; //delete this later
 
 /* Z Variables */