Zoomable thumbnails

src/scss/components/_images.scss

@@ -4,6 +4,7 @@
 	width: 100%;
 	max-width: 300px;
 	overflow: hidden;
+	position: relative;
 	
 	.image {
 		width: 100%;
@@ -15,6 +16,20 @@
 		background-size: cover;
 	}
 
+	.zoom {
+		@include animate();
+		display: none;
+		position: absolute;
+		bottom: 0;
+		right: 0;
+		z-index: 1;
+		padding: 10px;
+		background: rgba(0,0,0,0.2);
+		font-size: 12px;
+		cursor: pointer;
+		color: #FFFFFF;
+	}
+
 	&.small {
 		max-width: 50px;
 	}
@@ -22,6 +37,12 @@
 	&.circle {
 		border-radius: 50%;
 	}
+
+	&:hover {
+		.zoom {
+			display: block;
+		}
+	}
 }
 
 .parallax {

src/scss/components/_modal.scss

@@ -37,6 +37,13 @@
 			padding-bottom: 40px;
 		}
 
+		.image-zoom-modal {
+			img {
+				max-height: 100%;
+				max-width: 100%;
+			}
+		}
+
 		form {
 			.field {
 				padding-bottom: 20px;