diff --git a/app/assets/javascripts/darkswarm/directives/darker_background.js.coffee b/app/assets/javascripts/darkswarm/directives/darker_background.js.coffee
new file mode 100644
index 0000000000..977bd38885
--- /dev/null
+++ b/app/assets/javascripts/darkswarm/directives/darker_background.js.coffee
@@ -0,0 +1,4 @@
+Darkswarm.directive "darkerBackground", ->
+  restrict: "A"
+  link: (scope, elm, attr)->
+    elm.closest('.page-view').toggleClass("with-darker-background", true)
diff --git a/app/assets/stylesheets/darkswarm/shop_tabs.css.scss b/app/assets/stylesheets/darkswarm/shop_tabs.css.scss
index f9b8425800..5d36d05846 100644
--- a/app/assets/stylesheets/darkswarm/shop_tabs.css.scss
+++ b/app/assets/stylesheets/darkswarm/shop_tabs.css.scss
@@ -77,7 +77,6 @@
 
   .page-view {
     background: none;
-    background-color: $grey-080;
     border: none;
     padding-bottom: 5em;
 
@@ -119,4 +118,8 @@
       }
     }
   }
+
+  .page-view.with-darker-background {
+    background-color: $grey-080;
+  }
 }
diff --git a/app/views/shop/_closed_shop.html.haml b/app/views/shop/_closed_shop.html.haml
index c2a528892d..da7d2f30a4 100644
--- a/app/views/shop/_closed_shop.html.haml
+++ b/app/views/shop/_closed_shop.html.haml
@@ -1,6 +1,6 @@
 .row.closed_shop_header
   .small-12.columns
-    .content
+    .content{ "darker-background" => true }
       %h4
         .warning_sign
           .rectangle
diff --git a/app/views/shop/_messages.html.haml b/app/views/shop/_messages.html.haml
index 1aad78b011..d519c4833a 100644
--- a/app/views/shop/_messages.html.haml
+++ b/app/views/shop/_messages.html.haml
@@ -1,5 +1,5 @@
 - if require_customer?
-  .content
+  .content{ "darker-background" => true }
     .row.footer-pad
       .small-12.columns
         .shopfront_hidden_message