diff --git a/source/author.html.haml b/source/author.html.haml
index 2ef1b7d..cf85529 100644
--- a/source/author.html.haml
+++ b/source/author.html.haml
@@ -7,7 +7,8 @@ cover_license: '[Cover Image](https://unsplash.com/photos/2ShvY8Lf6l0) by [Lukas
 
 %header.main-header.author-head{cover}
   %nav.main-nav.overlay.clearfix
-    %a.home-button.icon-angle-left{href: home_path} Home
+    %a.home-button.icon-angle-left{href: home_path}
+      %span.word Home
     - if blog_settings.navigation
       %a.menu-button.icon-menu{href: '#'}
         %span.word Menu
diff --git a/source/layouts/page.haml b/source/layouts/page.haml
index b731500..fc7b313 100644
--- a/source/layouts/page.haml
+++ b/source/layouts/page.haml
@@ -1,7 +1,8 @@
 = wrap_layout :layout do
   %header.main-header.post-head{cover}
     %nav.main-nav.clearfix{class: cover? ? 'overlay' : nil}
-      %a.home-button.icon-angle-left{href: home_path} Home
+      %a.home-button.icon-angle-left{href: home_path}
+        %span.word Home
       - if blog_settings.navigation
         %a.menu-button.icon-menu{href: '#'}
           %span.word Menu
diff --git a/source/layouts/post.haml b/source/layouts/post.haml
index 51106f3..3c426c9 100644
--- a/source/layouts/post.haml
+++ b/source/layouts/post.haml
@@ -1,7 +1,8 @@
 = wrap_layout :layout do
   %header.main-header.post-head{cover}
     %nav.main-nav.clearfix{class: cover? ? 'overlay' : nil}
-      %a.home-button.icon-angle-left{href: home_path} Home
+      %a.home-button.icon-angle-left{href: home_path}
+        %span.word Home
       - if blog_settings.navigation
         %a.menu-button.icon-menu{href: '#'}
           %span.word Menu
diff --git a/source/stylesheets/application.css.scss b/source/stylesheets/application.css.scss
index 1fa9f96..1e13eb8 100644
--- a/source/stylesheets/application.css.scss
+++ b/source/stylesheets/application.css.scss
@@ -6,6 +6,20 @@
 .home-button {
   @extend .menu-button;
   float: left;
+  transition: none;
+}
+
+/* When the navigation is closed */
+.nav-opened .home-button {
+  color: #fff;
+  border-color: rgba(255, 255, 255, 0.6);
+  background: transparent;
+}
+/* When the navigation is closed and there is no cover image */
+.nav-opened .no-cover .home-button {
+  color: #9EABB3;
+  border-color: #BFC8CD;
+  background: transparent;
 }
 
 .byline {
diff --git a/source/tag.html.haml b/source/tag.html.haml
index 09b786a..864e850 100644
--- a/source/tag.html.haml
+++ b/source/tag.html.haml
@@ -6,7 +6,8 @@ cover_license: '[Cover Image](https://unsplash.com/photos/2ShvY8Lf6l0) by [Lukas
 
 %header.main-header.tag-head{cover}
   %nav.main-nav.overlay.clearfix
-    %a.home-button.icon-angle-left{href: home_path} Home
+    %a.home-button.icon-angle-left{href: home_path}
+      %span.word Home
     - if blog_settings.navigation
       %a.menu-button.icon-menu{href: '#'}
         %span.word Menu