Nicer zoom icon, again

src/scss/components/_images.scss

@@ -17,16 +17,22 @@
 	}
 
 	.zoom {
+		@include animate();
 		display: none;
 		position: absolute;
-		bottom: 0;
-		right: 0;
+		bottom: 5px;
+		right: 5px;
 		z-index: 1;
-		padding: 10px;
-		background: rgba(0,0,0,0.2);
-		font-size: 12px;
+		padding: 6px;
+		border-radius: 100%;
+		background: rgba(0,0,0,0.4);
+		font-size: 10px;
 		cursor: pointer;
 		color: #FFFFFF;
+
+		&:hover {
+			background: #000000;
+		}
 	}
 
 	&.small {

src/scss/components/_modal.scss

@@ -37,14 +37,6 @@
 			padding-bottom: 40px;
 		}
 
-		.image-zoom-modal {
-			text-align: center;
-			img {
-				max-height: 100%;
-				max-width: 100%;
-			}
-		}
-
 		form {
 			.field {
 				padding-bottom: 20px;
@@ -118,6 +110,20 @@
 		}
 	}
 
+
+	&.image_zoom {
+		.content {
+			text-align: center;
+			padding: 5vh 5%;
+			width: 90%;
+
+			img {
+				max-height: 90vh;
+				max-width: 100%;
+			}
+		}
+	}
+
 	@include responsive( $bp_medium ){
 
 		.content {