Added palette colors for tabs

src/assets/stylesheets/application.palette.scss

@@ -135,6 +135,20 @@ button[data-md-color-accent] {
         border-left: 0.4rem solid $color;
       }
     }
+
+    // [screen +]: Set background color for tabs
+    @include break-from-device(screen) {
+
+      // Tabs with outline
+      .md-tabs {
+        background: mix($color, $md-color-black, 75%);
+
+        // Fade-out tabs background upon scrolling
+        &[data-md-state="hidden"] {
+          background: $color;
+        }
+      }
+    }
   }
 }
 

src/assets/stylesheets/layout/_header.scss

@@ -26,7 +26,7 @@
 
 // Application header (stays always on top)
 .md-header {
-  @include z-depth(3);
+  @include z-depth(2);
 
   position: fixed;
   top: 0;
@@ -40,7 +40,7 @@
 
   // Always show shadow, in case JavaScript is not available
   .no-js & {
-    @include z-depth(3);
+    @include z-depth(2);
   }
 
   // [screen +]: Show shadow depending on scroll offset
@@ -49,7 +49,7 @@
 
     // Show and animate shadow
     &[data-md-state="shadow"] {
-      @include z-depth(3);
+      @include z-depth(2);
     }
   }
 

src/assets/stylesheets/layout/_tabs.scss

@@ -79,11 +79,12 @@
     }
   }
 
-  // Hide tabs upon scrolling - disable transition to minimizes repaints whilte
-  // scrolling down, while scrolling up seems to be okay
+  // Fade-out tabs background upon scrolling
   &[data-md-state="hidden"] {
     background: $md-color-primary;
 
+    // Hide tabs upon scrolling - disable transition to minimizes repaints whilte
+    // scrolling down, while scrolling up seems to be okay
     .md-tabs__link {
       transform: translateY(50%);
       transition: