.img-box{
  position:relative;
  width: 200px;
  height: 200px;
  margin: 20px;
}
.img-box img{
  width: 100%;
  height: 100%;
}
.img-box::before{
  position:absolute;
  width: 100%;
  height: 100%;
  content:'';
  top:-10px;
  left:-10px;
  border: 2px solid #000;
  z-index:-1;
  transition: all 0.2s;
}
.img-box:hover::before{
  top: 10px;
  left: 10px
}
.img-box::after{
  position:absolute;
  width: 100%;
  height: 100%;
  content:'';
  top:10px;
  left:10px;
  background:#000;
  z-index:-1;
  transition: all 0.2s;
}
.img-box:hover::after{
  top: -10px;
  left:-10px
}