diff --git a/src/components/EnvironmentCards.vue b/src/components/EnvironmentCards.vue
index be8e879..6ca00f1 100644
--- a/src/components/EnvironmentCards.vue
+++ b/src/components/EnvironmentCards.vue
@@ -5,8 +5,14 @@
         <div class="border border-grey rounded overflow-hidden">
            <div class="bg-white">
             <div class="border-t-4 border-teal p-4">
-              <h2 class="text-grey-darkest mb-1">{{ environment.name }}</h2>
-              <div class="text-grey-darker mb-2">{{ environment.url }}</div>
+              <a href="#0" class="no-underline hover:underline focus:underline text-grey-darkest hover:text-blue-dark focus:text-blue-dark focus:outline-none">
+                <h2 class="mb-1">{{ environment.name }}</h2>
+              </a>
+
+              <div class="text-grey-darker mb-2">
+                <a href="#0" class="no-underline hover:underline focus:underline text-grey-darkest hover:text-blue-dark focus:text-blue-dark focus:outline-none">{{ environment.url }}</a>
+              </div>
+
               <div class="text-grey-darker">{{ environment.label }}</div>
             </div>
           </div>
diff --git a/src/components/Environments.vue b/src/components/Environments.vue
index 58070c7..c2efb84 100644
--- a/src/components/Environments.vue
+++ b/src/components/Environments.vue
@@ -39,10 +39,10 @@
           </ol>
         </div>
 
-        <div class="flex flex-1 items-center justify-between md:justify-start">
+        <button class="flex flex-1 items-center justify-between md:justify-start">
           <div class="text-2xl font-hairline mr-2">{{ project.name }}</div>
           <svg class="h-6 w-6 text-blue-dark fill-current" role="presentation"><use xlink:href="icons.symbol.svg#actions__down-arrow"></use></svg>
-        </div>
+        </button>
       </div>
 
       <div class="hidden md:block">