Css Same Height As Parent

So I have an image that needs a hover effect; HTML

relative to it:

Example Here

.data {
    width: 95%;
    margin: auto;
    position: relative;
}
.data.overlay {
    position: absolute;
    top: 0; right: 0;
    bottom: 0; left: 0;
}
.data:hover.overlay {
    background: rgba(0, 0, 0, .5);
}

Share