hover css với ảnh

****HTML
<div class="item-pic">
<a href="#"><img src="" ></a>
</div>

****CSS
.item-pic a {
    backface-visibility: hidden;
    box-shadow: 0 0 1px transparent;
    transition-duration: 0.3s;
    transition-property: transform;
    display: inline-block;
    position: relative;
}
.item-pic a:hover::before {
    opacity: 1;
    transform: translateY(5px);
}
.item-pic a:hover {
    transform: translateY(-5px);
}
.item-pic a::before{
    background: rgba(0, 0, 0, 0) radial-gradient(ellipse at center center , rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%) repeat scroll 0 0;
    content: "";
    height: 10px;
    left: 5%;
    opacity: 0;
    position: absolute;
    top: 100%;
    width: 90%;
    z-index: 1;
}