Adding ability to blur parallax; Overlay header; Discover Featured intro playlist

src/scss/components/_header.scss

@@ -4,6 +4,7 @@ main {
 		padding: 14px 20px;
 		background: #EEEEEE;
 		line-height: 24px;
+		box-sizing: border-box;
 
 		h1 {
 			font-size: 22px;
@@ -17,12 +18,6 @@ main {
 			height: 16px;
 		}
 
-		@include responsive( $bp_medium ){
-			.icon {
-				visibility: hidden;
-			}
-		}
-
 		.options {
 			position: absolute;
 			top: 0;
@@ -53,7 +48,27 @@ main {
 			}
 		}
 
+		&.overlay {
+			position: absolute;
+			top: 0;
+			left: 0;
+			width: 100%;
+			background: rgba(0,0,0,0.1);
+			color: $white;
+			z-index: 95;
+
+			.icon {
+				-webkit-filter: invert(1);
+				-moz-filter: invert(1);
+				filter: invert(1);
+			}
+		}
+
 		@include responsive( $bp_medium ){
+			.icon {
+				visibility: hidden;
+			}
+
 			.options {
 				right: 0;
 

src/scss/components/_images.scss

@@ -62,16 +62,26 @@
 	width: 100%;
 	overflow: hidden;
 	background: #111111;
+	position: relative;
 
 	canvas {
-		width: 100%;
-		height: 100%;
+		width: 110%;
+		height: 110%;
 		opacity: 0;
+		position: absolute;
+		top: -5%;
+		left: -5%;
 
 		&.loaded {
 			opacity: 0.4;
 		}
 	}
+
+	&.blur {
+		canvas {
+			filter: blur(15px);
+		}
+	}
 }
 
 .tiles {