diff --git a/src/components/Sidebar.vue b/src/components/Sidebar.vue
index f7238e7..826b307 100644
--- a/src/components/Sidebar.vue
+++ b/src/components/Sidebar.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="w-auto lg:w-64 bg-grey-light text-grey-darker antialiased fixed pin-l h-full overflow-y-scroll">
+  <div class="w-auto lg:w-56 text-sm bg-grey-light text-grey-darker antialiased fixed pin-l h-full overflow-y-scroll">
     <div>
       <ul class="list-reset">
         <li v-for="link in links" :key="link.title">
diff --git a/src/views/Applications.vue b/src/views/Applications.vue
index 9f3f755..bef7160 100644
--- a/src/views/Applications.vue
+++ b/src/views/Applications.vue
@@ -18,7 +18,7 @@
 
     <div class="mt-48">
       <div class="-mt-10 md:-mt-4 flex flex-row-reverse h-full">
-        <div class="flex-1 p-4 lg:p-12 ml-16 lg:ml-64 overflow-x-hidden">
+        <div class="flex-1 p-4 lg:p-12 ml-16 lg:ml-56 overflow-x-hidden">
           <div class="mb-6">
             <div class="lg:flex lg:items-baseline mb-12">
               <div class="mr-16 mb-4 lg:mb-0">
diff --git a/src/views/Environment.vue b/src/views/Environment.vue
index 8f5f00a..f8cbc88 100644
--- a/src/views/Environment.vue
+++ b/src/views/Environment.vue
@@ -39,7 +39,7 @@
 
     <div class="mt-48">
       <div class="-mt-4 md:-mt-2 flex flex-row-reverse h-full">
-        <div class="flex-1 p-4 lg:p-12 ml-16 lg:ml-64 overflow-x-hidden">
+        <div class="flex-1 p-4 lg:p-12 ml-16 lg:ml-56 overflow-x-hidden">
           <div>
             <div>
               <h1 class="font-hairline mb-2">Overview</h1>
diff --git a/src/views/Environments.vue b/src/views/Environments.vue
index c7fe24d..4802ed5 100644
--- a/src/views/Environments.vue
+++ b/src/views/Environments.vue
@@ -34,7 +34,7 @@
 
     <div class="mt-48">
       <div class="-mt-4 md:-mt-2 flex flex-row-reverse h-full">
-        <div class="flex-1 p-4 lg:p-12 ml-16 lg:ml-64 overflow-x-hidden">
+        <div class="flex-1 p-4 lg:p-12 ml-16 lg:ml-56 overflow-x-hidden">
           <div class="mb-6">
             <div class="lg:flex lg:items-baseline mb-2">
               <div class="mr-16 mb-4 lg:mb-0">
diff --git a/tailwind.js b/tailwind.js
index 9284d2b..6410155 100644
--- a/tailwind.js
+++ b/tailwind.js
@@ -63,8 +63,13 @@ module.exports = {
   margin: {
     ...defaultConfig.margin,
     '48': '10rem',
+    '56': '14rem',
     '64': '16rem',
   },
+  width: {
+    ...defaultConfig.width,
+    '56': '14rem',
+  },
   plugins: [
     require('tailwindcss/plugins/container')(),
     require('tailwindcss-visuallyhidden')(),