mp-image overlays

/* Make sure our absolute positioned overlay doesn't cover more than we want it to... */
.overlay-one { position: relative; }
.overlay-one:after {
 position: absolute;
 content: '';
 background: url('newimagepath/overlay.png');
 background-size: cover; /* Make overlay fit the window of our original image */
 top: 0;
 right: 0;
 bottom: 0;
 left: 0;
 opacity: 0; /* Make's the overlay invisible until we hover */
 transition: .5s ease all; /* How long the transition takes */
}
.overlay-one:hover:after {
 opacity: 1; /* Make Image Appear */
}