diff --git a/app/components/travis-status.coffee b/app/components/travis-status.coffee
new file mode 100644
index 00000000..3ae86598
--- /dev/null
+++ b/app/components/travis-status.coffee
@@ -0,0 +1,22 @@
+`import Ember from 'ember'`
+`import Ajax from 'travis/utils/ajax'`
+`import config from 'travis/config/environment'`
+
+TravisStatusComponent = Ember.Component.extend
+  status: null
+
+  statusPageStatusUrl: (->
+    config.statusPageStatusUrl
+  ).property()
+
+  didInsertElement: ->
+    if url = @get('statusPageStatusUrl')
+      self = this
+      @getStatus(url).then (response) ->
+        if response.status and response.status.indicator
+          self.set('status', response.status.indicator)
+
+  getStatus: (url) ->
+    $.ajax(url)
+
+`export default TravisStatusComponent`
diff --git a/app/styles/app/landing.sass b/app/styles/app/landing.sass
index 51ecca7c..70520f63 100644
--- a/app/styles/app/landing.sass
+++ b/app/styles/app/landing.sass
@@ -13,7 +13,7 @@
   background-color: #eff0ec
 
 #landing
-  margin: 0 auto
+  margin: 0 auto 170px auto
   max-width: 1200px
   font-weight: 300
 
diff --git a/app/styles/app/layout.sass b/app/styles/app/layout.sass
index 5d455793..f1b6a6a8 100644
--- a/app/styles/app/layout.sass
+++ b/app/styles/app/layout.sass
@@ -52,6 +52,9 @@
     margin-bottom: -99999px
     padding-bottom: 100034px
 
+  #left
+    z-index: -1
+
 @media #{$large-up}
 
   #left, #right, .wrapper-main
diff --git a/app/styles/app/layouts/footer.sass b/app/styles/app/layouts/footer.sass
index 59d02b94..2cf55092 100644
--- a/app/styles/app/layouts/footer.sass
+++ b/app/styles/app/layouts/footer.sass
@@ -62,7 +62,6 @@ footer a:active
   text-decoration : underline
 
 .status-circle
-  background   : $pass-color
   display      : inline-block
   height       : 11px
   width        : 11px
@@ -72,3 +71,15 @@ footer a:active
   -webkit-border-radius : 100px
   -moz-border-radius    : 100px
   vertical-align: middle
+
+.status-circle.none
+  background: #2fcc66
+
+.status-circle.degraded
+  background: #f1c40f
+
+.status-circle.minor
+  background: #e67e22
+
+.status-circle.major
+  background: #e74c3c
diff --git a/app/templates/components/travis-status.hbs b/app/templates/components/travis-status.hbs
new file mode 100644
index 00000000..a599939b
--- /dev/null
+++ b/app/templates/components/travis-status.hbs
@@ -0,0 +1,8 @@
+{{#if statusPageStatusUrl}}
+  <h3>Travis CI Status</h3>
+  <ul>
+    <li><div {{bind-attr class=":status-circle status"}}>Status:</div>
+        <a href="http://www.traviscistatus.com/">Travis CI Status</a>
+    </li>
+  </ul>
+{{/if}}
diff --git a/app/templates/footer.hbs b/app/templates/footer.hbs
index c664390b..6814dd92 100644
--- a/app/templates/footer.hbs
+++ b/app/templates/footer.hbs
@@ -31,11 +31,6 @@
   </div>
 {{/if}}
   <div class="small-6 medium-2 large-2 columns">
-    <h3>Travis CI Status</h3>
-    <ul>
-      <li><div class="status-circle">Status:</div>
-          <a href="http://www.traviscistatus.com/">Travis CI Status</a>
-      </li>
-    </ul>
+    {{travis-status}}
   </div>
 </div>
diff --git a/app/templates/layouts/home.hbs b/app/templates/layouts/home.hbs
index 032c1f8a..d26758de 100644
--- a/app/templates/layouts/home.hbs
+++ b/app/templates/layouts/home.hbs
@@ -15,5 +15,8 @@
   <aside id="left" {{bind-attr class="auth.signedIn::hidden"}}>
     {{outlet "left"}}
   </aside>
-
 </div>
+
+<footer>
+  {{render "footer"}}
+</footer>
diff --git a/app/templates/layouts/landing-page.hbs b/app/templates/layouts/landing-page.hbs
index 346af6ee..4a57bd79 100644
--- a/app/templates/layouts/landing-page.hbs
+++ b/app/templates/layouts/landing-page.hbs
@@ -5,3 +5,7 @@
 {{render "flash"}}
 
 {{yield}}
+
+<footer>
+  {{render "footer"}}
+</footer>
diff --git a/config/environment.js b/config/environment.js
index bf78ba39..79a2ae34 100644
--- a/config/environment.js
+++ b/config/environment.js
@@ -29,7 +29,8 @@ module.exports = function(environment) {
     pro: false,
     enterprise: false,
     endpoints: {},
-    intervals: { updateTimes: 1000 }
+    intervals: { updateTimes: 1000 },
+    statusPageStatusUrl: 'https://pnpcptp8xh9k.statuspage.io/api/v2/status.json'
   };
 
   if (typeof process !== 'undefined') {
diff --git a/tests/unit/components/travis-status-test.coffee b/tests/unit/components/travis-status-test.coffee
new file mode 100644
index 00000000..16f678f2
--- /dev/null
+++ b/tests/unit/components/travis-status-test.coffee
@@ -0,0 +1,19 @@
+`import { test, moduleForComponent } from 'ember-qunit'`
+
+server = null
+moduleForComponent 'travis-status', 'TravisStatusComponent', {}
+
+test 'adds incident class to .status-circle', ->
+  expect 3
+  # creates the component instance
+  component = @subject()
+  component.getStatus = ->
+    new Ember.RSVP.Promise (resolve, reject) ->
+      resolve({ status: { indicator: 'major' } })
+
+  ok !component.get('status'), 'status is initially not set'
+
+  @append()
+
+  equal component.get('status'), 'major', 'status is updated from the API'
+  ok component.$('.status-circle').hasClass('major'), 'status class is set on .status-circle'