Parallax setup

src/scss/app.scss

@@ -7,9 +7,12 @@
 @import 'global/reset';
 @import 'global/forms';
 
+@import 'components/images';
 @import 'components/icon';
 @import 'components/sidebar';
 @import 'components/lists';
 @import 'components/grid';
 @import 'components/header';
 
+@import 'views/artist';
+

src/scss/components/_images.scss

@@ -0,0 +1,29 @@
+
+
+.thumbnail {
+	width: 100%;
+	max-width: 300px;
+	overflow: hidden;
+	
+	.image {
+		width: 100%;
+		padding-bottom: 100%;
+		position: relative;
+		background-repeat: no-repeat;
+		background-color: #DDDDDD;
+		background-position: 50% 50%;
+		background-size: cover;
+	}
+
+	&.circle {
+		border-radius: 50%;
+	}
+}
+
+.parallax {
+	height: 300px;
+	overflow: hidden;
+	.thumbnail {
+		max-width: none;
+	}
+}

src/scss/components/_sidebar.scss

@@ -13,9 +13,19 @@ aside{
 	.thumbnail {
 		position: absolute;
 		top: 0;
-		height: 100%;
+		right: 0;
+		bottom: 0;
+		left: 0;
+		height: auto;
+		width: auto;
+		max-width: none;
 		z-index: -1;
-		opacity: 0.1;
+		opacity: 0.2;
+
+		.image {
+			padding-bottom: 0;
+			height: 100%;
+		}
 	}
 
 	nav {

src/scss/global/_core.scss

@@ -34,8 +34,11 @@ main {
 	h3 {
 		font-size: 14px;
 		margin-bottom: 14px;
-		padding-bottom: 4px;
-		border-bottom: 1px solid #000000;
 		text-transform: uppercase;
+
+		&.underline {
+			padding-bottom: 4px;
+			border-bottom: 1px solid #000000;			
+		}
 	}
 }

src/scss/views/_artist.scss

@@ -0,0 +1,10 @@
+
+.tracks {
+	width: 65%;
+	float: left;
+}
+
+.related-artist-list {
+	width: 30%;
+	float: right;
+}