diff --git a/package.json b/package.json
index 4740c17..bb9357f 100644
--- a/package.json
+++ b/package.json
@@ -9,6 +9,7 @@
   },
   "dependencies": {
     "tailwindcss": "^0.7.3",
+    "tailwindcss-spaced-items": "^0.1.0",
     "vue": "^2.5.17",
     "vue-router": "^3.0.2"
   },
diff --git a/src/components/Environment/ActionCards.vue b/src/components/Environment/ActionCards.vue
index a1988a7..99b94e6 100644
--- a/src/components/Environment/ActionCards.vue
+++ b/src/components/Environment/ActionCards.vue
@@ -10,7 +10,7 @@
       <div class="w-full md:w-1/3 md:block px-4 mb-4" :class="[ active == 'code' ? 'block' : 'hidden' ]">
         <div class="border border-grey rounded shadow bg-white overflow-hidden">
           <div class="border-t-4 border-teal">
-            <div class="border-b border-grey-dark">
+            <div class="border-b border-grey">
               <div class="px-3 py-4">
                 <div class="flex flex-row-reverse">
                   <div class="flex-1">
@@ -27,14 +27,14 @@
 
             <div>
               <ul class="list-reset flex -ml-px">
-                <li class="w-1/2 flex-1 text-center border-l border-grey-dark">
+                <li class="w-1/2 flex-1 text-center border-l border-grey">
                   <button type="button" class="w-full py-3 text-blue-dark text-xs font-bold no-underline hover:underline focus:underline hover:bg-grey-lighter focus:bg-grey-lighter focus:outline-none block">
                     <svg class="h-6 w-6 fill-current mb-2" role="presentation"><use xlink:href="/img/icons.symbol.svg#objects__fork"></use></svg>
                     <span class="block">Deploy</span>
                   </button>
                 </li>
 
-                <li class="w-1/2 flex-1 text-center border-l border-grey-dark">
+                <li class="w-1/2 flex-1 text-center border-l border-grey">
                   <button type="button" class="w-full py-3 text-blue-dark text-xs font-bold no-underline hover:underline focus:underline hover:bg-grey-lighter focus:bg-grey-lighter focus:outline-none block">
                     <svg class="h-6 w-6 fill-current mb-2" role="presentation"><use xlink:href="/img/icons.symbol.svg#actions__switch"></use></svg>
                     <span class="block">Switch</span>
@@ -49,7 +49,7 @@
       <div class="w-full md:w-1/3 md:block px-4 mb-4" :class="[ active == 'databases' ? 'block' : 'hidden' ]">
         <div class="border border-grey rounded shadow bg-white overflow-hidden">
           <div class="border-t-4 border-teal">
-            <div class="border-b border-grey-dark">
+            <div class="border-b border-grey">
               <div class="px-3 py-4">
                 <div class="flex flex-row-reverse">
                   <div class="flex-1">
@@ -66,21 +66,21 @@
 
             <div>
               <ul class="list-reset flex -ml-px">
-                <li class="w-1/2 flex-1 text-center border-l border-grey-dark">
+                <li class="w-1/2 flex-1 text-center border-l border-grey">
                   <button type="button" class="w-full py-3 text-blue-dark text-xs font-bold no-underline hover:underline focus:underline hover:bg-grey-lighter focus:bg-grey-lighter focus:outline-none block">
                     <svg class="h-6 w-6 fill-current mb-2" role="presentation"><use xlink:href="/img/icons.symbol.svg#actions__copy"></use></svg>
                     <span class="block">Copy</span>
                   </button>
                 </li>
 
-                <li class="w-1/2 flex-1 text-center border-l border-grey-dark">
+                <li class="w-1/2 flex-1 text-center border-l border-grey">
                   <button type="button" class="w-full py-3 text-blue-dark text-xs font-bold no-underline hover:underline focus:underline hover:bg-grey-lighter focus:bg-grey-lighter focus:outline-none block">
                     <svg class="h-6 w-6 fill-current mb-2" role="presentation"><use xlink:href="/img/icons.symbol.svg#actions__backup"></use></svg>
                     <span class="block">Back up</span>
                   </button>
                 </li>
 
-                <li class="w-1/2 flex-1 text-center border-l border-grey-dark">
+                <li class="w-1/2 flex-1 text-center border-l border-grey">
                   <button
                     type="button"
                     class="w-full py-3 text-xs font-bold no-underline hover:underline focus:underline hover:bg-grey-lighter focus:bg-grey-lighter focus:outline-none block"
@@ -103,7 +103,7 @@
       <div class="w-full md:w-1/3 md:block px-4 mb-4" :class="[ active == 'files' ? 'block' : 'hidden' ]">
         <div class="border border-grey rounded shadow bg-white overflow-hidden">
           <div class="border-t-4 border-teal">
-            <div class="border-b border-grey-dark">
+            <div class="border-b border-grey">
               <div class="px-3 py-4">
                 <div class="flex flex-row-reverse">
                   <div class="flex-1">
@@ -120,7 +120,7 @@
 
             <div>
               <ul class="list-reset flex -ml-px">
-                <li class="w-1/2 flex-1 text-center border-l border-grey-dark">
+                <li class="w-1/2 flex-1 text-center border-l border-grey">
                   <button type="button" class="w-full py-3 text-blue-dark text-xs font-bold no-underline hover:underline focus:underline hover:bg-grey-lighter focus:bg-grey-lighter focus:outline-none block">
                     <svg class="h-6 w-6 fill-current mb-2" role="presentation"><use xlink:href="/img/icons.symbol.svg#actions__copy"></use></svg>
                     <span class="block">Copy</span>
diff --git a/src/views/Environment.vue b/src/views/Environment.vue
index f8cbc88..64ffc86 100644
--- a/src/views/Environment.vue
+++ b/src/views/Environment.vue
@@ -54,75 +54,77 @@
               </a>
             </div>
 
-            <div class="mb-6">
-              <action-cards :environment="environment" :is-production="isProduction"></action-cards>
-            </div>
+            <div class="spaced-y-10">
+              <div>
+                <action-cards :environment="environment" :is-production="isProduction"></action-cards>
+              </div>
 
-            <div class="mb-6 rounded border border-grey shadow overflow-hidden">
-              <div class="bg-grey-light p-4"><h2 class="text-lg">Site Health</h2></div>
-              <div class="bg-white p-4">
-                <div class="mb-6">
-                  <p class="text-lg font-hairline text-grey-darkest">Uptime monitoring</p>
-                </div>
+              <div class="shadow-md overflow-hidden">
+                <div class="bg-white border-b-2 border-grey-light p-3"><h2 class="text-lg">Site Health</h2></div>
+                <div class="bg-white p-4">
+                  <div class="mb-6">
+                    <p class="text-lg font-hairline text-grey-darkest">Uptime monitoring</p>
+                  </div>
 
-                <div class="text-center leading-normal mb-5">
-                  <p class="text-grey-darker">
-                    Acquia uses a specially tuned uptime monitoring solution to keep track<br class="hidden md:inline">
-                    of whether your Drupal site is really up and running.
-                  </p>
-                </div>
+                  <div class="text-center leading-normal mb-5">
+                    <p class="text-grey-darker">
+                      Acquia uses a specially tuned uptime monitoring solution to keep track<br class="hidden md:inline">
+                      of whether your Drupal site is really up and running.
+                    </p>
+                  </div>
 
-                <div class="flex justify-center">
-                  <button type="button" class="text-sm font-thin bg-blue-dark hover:bg-blue-darker antialiased text-white px-4 py-3 no-underline rounded mx-1">Enable Uptime</button>
-                  <button type="button" class="text-sm font-thin bg-grey-dark hover:bg-grey-darker antialiased text-white px-4 py-3 no-underline rounded mx-1">Learn more</button>
+                  <div class="flex justify-center">
+                    <button type="button" class="text-sm font-thin bg-blue-dark hover:bg-blue-darker antialiased text-white px-4 py-3 no-underline rounded mx-1">Enable Uptime</button>
+                    <button type="button" class="text-sm font-thin bg-grey-dark hover:bg-grey-darker antialiased text-white px-4 py-3 no-underline rounded mx-1">Learn more</button>
+                  </div>
                 </div>
               </div>
-            </div>
 
-            <div class="rounded border border-grey shadow overflow-hidden">
-              <div class="bg-grey-light p-4"><h2 class="text-lg">Information</h2></div>
-              <div class="bg-white px-4 py-6">
-                <div class="mb-6 relative">
-                  <div class="text-xs mb-1">Git URL</div>
-                  <div class="border border-grey-dark rounded p-3">{{ gitUrl }}</div>
-                  <div class="absolute pin-t pin-r">
-                    <button type="button" class="flex items-center text-xs text-blue-dark hover:underline focus:underline">
-                      <svg class="h-3 w-3 fill-current mr-1" role="presentation"><use xlink:href="/img/icons.symbol.svg#actions__copy"></use></svg>
-                      Copy <span class="visuallyhidden">Git URL to your clipboard</span>
-                    </button>
-                  </div>
-                </div>
-
-                <div class="mb-6 relative">
-                  <div class="text-xs mb-1">SSH URL</div>
-                  <div class="border border-grey-dark rounded p-3">{{ sshUrl }}</div>
-                  <div class="absolute pin-t pin-r">
-                    <button type="button" class="flex items-center text-xs text-blue-dark hover:underline focus:underline">
-                      <svg class="h-3 w-3 fill-current mr-1" role="presentation"><use xlink:href="/img/icons.symbol.svg#actions__copy"></use></svg>
-                      Copy <span class="visuallyhidden">SSH URL to your clipboard</span>
-                    </button>
-                  </div>
-                </div>
-
-                <div class="flex flex-wrap -mx-4 -mb-4 lg:-mb-6">
-                  <div class="w-full lg:w-1/2 px-4 mb-4 lg:mb-6">
-                    <div class="mb-1 text-xs text-grey-darker">IP Address</div>
-                    <div>1.2.3.4</div>
+              <div class="shadow-md overflow-hidden">
+                <div class="bg-white border-b-2 border-grey-light p-3"><h2 class="text-lg">Information</h2></div>
+                <div class="bg-white px-4 py-6">
+                  <div class="mb-6 relative">
+                    <div class="text-xs mb-1">Git URL</div>
+                    <div class="border border-grey-dark rounded p-3">{{ gitUrl }}</div>
+                    <div class="absolute pin-t pin-r">
+                      <button type="button" class="flex items-center text-xs text-blue-dark hover:underline focus:underline">
+                        <svg class="h-3 w-3 fill-current mr-1" role="presentation"><use xlink:href="/img/icons.symbol.svg#actions__copy"></use></svg>
+                        Copy <span class="visuallyhidden">Git URL to your clipboard</span>
+                      </button>
+                    </div>
                   </div>
 
-                  <div class="w-full lg:w-1/2 px-4 mb-4 lg:mb-6">
-                    <div class="mb-1 text-xs text-grey-darker">Region</div>
-                    <div>eu-west-1</div>
+                  <div class="mb-6 relative">
+                    <div class="text-xs mb-1">SSH URL</div>
+                    <div class="border border-grey-dark rounded p-3">{{ sshUrl }}</div>
+                    <div class="absolute pin-t pin-r">
+                      <button type="button" class="flex items-center text-xs text-blue-dark hover:underline focus:underline">
+                        <svg class="h-3 w-3 fill-current mr-1" role="presentation"><use xlink:href="/img/icons.symbol.svg#actions__copy"></use></svg>
+                        Copy <span class="visuallyhidden">SSH URL to your clipboard</span>
+                      </button>
+                    </div>
                   </div>
 
-                  <div class="w-full lg:w-1/2 px-4 mb-4 lg:mb-6">
-                    <div class="mb-1 text-xs text-grey-darker">PHP version</div>
-                    <div>7.1</div>
-                  </div>
+                  <div class="flex flex-wrap -mx-4 -mb-4 lg:-mb-6">
+                    <div class="w-full lg:w-1/2 px-4 mb-4 lg:mb-6">
+                      <div class="mb-1 text-xs text-grey-darker">IP Address</div>
+                      <div>1.2.3.4</div>
+                    </div>
 
-                  <div class="w-full lg:w-1/2 px-4 mb-4 lg:mb-6">
-                    <div class="mb-1 text-xs text-grey-darker">Live development mode</div>
-                    <div>Off</div>
+                    <div class="w-full lg:w-1/2 px-4 mb-4 lg:mb-6">
+                      <div class="mb-1 text-xs text-grey-darker">Region</div>
+                      <div>eu-west-1</div>
+                    </div>
+
+                    <div class="w-full lg:w-1/2 px-4 mb-4 lg:mb-6">
+                      <div class="mb-1 text-xs text-grey-darker">PHP version</div>
+                      <div>7.1</div>
+                    </div>
+
+                    <div class="w-full lg:w-1/2 px-4 mb-4 lg:mb-6">
+                      <div class="mb-1 text-xs text-grey-darker">Live development mode</div>
+                      <div>Off</div>
+                    </div>
                   </div>
                 </div>
               </div>
diff --git a/tailwind.js b/tailwind.js
index 6410155..5e15f6a 100644
--- a/tailwind.js
+++ b/tailwind.js
@@ -70,8 +70,13 @@ module.exports = {
     ...defaultConfig.width,
     '56': '14rem',
   },
+  shadows: {
+    ...defaultConfig.shadows,
+    'md': '0 0 10px 0 rgba(0,0,0,0.1)'
+  },
   plugins: [
     require('tailwindcss/plugins/container')(),
+    require('tailwindcss-spaced-items')(),
     require('tailwindcss-visuallyhidden')(),
   ],
 }
diff --git a/yarn.lock b/yarn.lock
index 04eaeef..c297f1d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7243,6 +7243,11 @@ table@^5.0.2:
     slice-ansi "2.0.0"
     string-width "^2.1.1"
 
+tailwindcss-spaced-items@^0.1.0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/tailwindcss-spaced-items/-/tailwindcss-spaced-items-0.1.0.tgz#e7f381e5c780a034bcdbc38a6a2cfb31f828a020"
+  integrity sha512-YiT1h89fp13r6I+EBM8wS1RWfsTwzHSi4BAnHoTXXQK1GQ53DUCPeFNmiksYSdx2aQLMdp/DTPvErqBVfTALiQ==
+
 tailwindcss-visuallyhidden@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/tailwindcss-visuallyhidden/-/tailwindcss-visuallyhidden-1.0.1.tgz#ed67ecf6ee48ea0313b5c3c27498467f350be206"