diff --git a/app/assets/stylesheets/components/button.scss b/app/assets/stylesheets/components/button.scss
index e937749..d09a24c 100644
--- a/app/assets/stylesheets/components/button.scss
+++ b/app/assets/stylesheets/components/button.scss
@@ -8,6 +8,23 @@
   @content
 }
 
+@mixin button--outline {
+  @include button {
+    background-color: transparent;
+    border: 1px solid $white;
+    color: $white;
+    padding: 10px;
+    text-decoration: none;
+
+    display: inline-block;
+
+    &:hover {
+      background-color: $button__bg-color;
+      color: $white;
+    }
+  }
+}
+
 .button, .button.button-primary, button.button-primary, input.button-primary[type="submit"], input.button-primary[type="reset"], input.button-primary[type="button"] {
   @include button;
 
diff --git a/app/assets/stylesheets/components/footer.scss b/app/assets/stylesheets/components/footer.scss
index af81fbf..c17f9e3 100644
--- a/app/assets/stylesheets/components/footer.scss
+++ b/app/assets/stylesheets/components/footer.scss
@@ -32,6 +32,11 @@
     }
   }
 
+  @include e(button) {
+    @include button--outline;
+    font-weight: 300;
+  }
+
   @include e(item) {
     margin-bottom: 2.5rem;
     font-size: 1.25rem;
diff --git a/app/views/layouts/_footer.html.erb b/app/views/layouts/_footer.html.erb
index e2b5500..22450b7 100644
--- a/app/views/layouts/_footer.html.erb
+++ b/app/views/layouts/_footer.html.erb
@@ -1,6 +1,13 @@
 <footer class="footer">
   <div class="footer__inner row">
-    <div class="two columns"><img class="footer__logo" src="<%= image_path("grasp_logo_footer.png") %>" alt=""></div>
+    <div class="two columns">
+      <img class="footer__logo" src="<%= image_path("grasp_logo_footer.png") %>" alt="">
+      <div class="footer__item">
+        <a class="footer__button" href="http://grasp.wcmc.happyfox.com/kb/" target="_blank">
+          Support Centre
+        </a>
+      </div>
+    </div>
     <div class="two columns">
       <div class="footer__item">
         <h5 class="footer__header">