Grids; Parallax

src/scss/components/_grid.scss

@@ -25,8 +25,8 @@
 			color: $secondary_grey;
 		}
 
-		&:nth-child(5)::after {
-			@include clear;
+		&:nth-child(5) {
+			@include clearfix;
 		}
 
 		&:hover{

src/scss/components/_images.scss

@@ -10,7 +10,7 @@
 		padding-bottom: 100%;
 		position: relative;
 		background-repeat: no-repeat;
-		background-color: #DDDDDD;
+		background-color: $light_grey;
 		background-position: 50% 50%;
 		background-size: cover;
 	}
@@ -21,9 +21,13 @@
 }
 
 .parallax {
-	height: 300px;
+	height: 50vh;
+	width: 100%;
 	overflow: hidden;
-	.thumbnail {
-		max-width: none;
+	background: $light_grey;
+
+	canvas {
+		width: 100%;
+		height: 100%;
 	}
 }

src/scss/components/_lists.scss

@@ -14,6 +14,7 @@
 	border-top: 1px solid #EEEEEE;
 	border-bottom: 1px solid #EEEEEE;
 	margin-bottom: -1px;
+	@include clearfix;
 
 	.col {
 		width: 10%;
@@ -21,10 +22,6 @@
 		float: left;
 	}
 
-	&::after {
-		@include clear;
-	}
-
 	&.selected {
 		background: #FFF39C !important;
 	}
@@ -79,3 +76,30 @@
 	}
 }
 
+.artist-list {
+	.artist {
+		display: block;
+		border: 0;
+		margin-bottom: 15px;
+		@include clearfix;
+
+		.thumbnail {
+			width: 50px;
+			margin-right: 20px;
+			float: left;
+			border: 3px solid transparent;
+		}
+
+		.name {
+			display: inline-block;
+			padding-top: 15px;
+		}
+
+		&:hover {
+			.thumbnail {
+				border-color: $turquoise;
+				opacity: 0.8;
+			}
+		}
+	}
+}

src/scss/components/_sidebar.scss

@@ -87,7 +87,7 @@ aside{
 				@include one_line_text;
 			}
 
-			.artist-list {
+			.artist-sentence {
 				opacity: 0.5;
 				display: block;
 				@include one_line_text;