body {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    width: auto;
    height: 100vh;
}

.images {
    position: relative;
}

.images img {
    position: absolute;
    transform: skew(30deg, -20deg);
    transition: .5s;
}   

.images img:nth-child(1){
    opacity: 1;
    z-index: 5;
}

.images img:nth-child(2){
    opacity: 0.8;
    z-index: 4;
}

.images img:nth-child(3){
    opacity: 0.6;
    z-index: 3;
}

.images img:nth-child(4){
    opacity: 0.4;
    z-index: 2;
}

.images:hover img:nth-child(1){
    transform: translateY(-75%) skew(30deg, -20deg);
}

.images:hover img:nth-child(2){
    transform: translateY(-50%) skew(30deg, -20deg);
}

.images:hover img:nth-child(3){
    transform: translateY(-25%) skew(30deg, -20deg);
}