style.css

body{
    margin: 0;
    font-family: san-serif;
}
.section{
    background-color: #f2395a;
    color: #FFF;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    perspective: 1000px;
}
.heading{
    margin-left: 20%;

}
.phone,
.tablet,
.desktop{
    background-color: #FFF;
    box-shadow: 13px 13px 32px 0 rgba(242, 57, 90, .3);
    position: absolute;
    transition: 1s;
    transform: translateY(100%);

}
.section:hover .phone,
.section:hover .tablet,
.section:hover .desktop{
    transform: translateY(10px) rotateY(-15deg) rotateZ(20deg);
}
.phone{
    width: 200px;
    height: 280px;
    left: 5%;
    bottom: 0;
    background: #fff url(mobil.svg) center no-repeat;
    z-index: 3;
    transition-delay: 0.2s;
}
.tablet{
    width: 360px;
    height: 380px;
    bottom: 0;
    left: 10%;
    z-index: 1;
    transition-delay: 0.4s;
}
.desktop{
    width: 680px;
    height: 480px;
    background: #fff url(desktop.svg) center no-repeat;
    left: 15%;
    bottom: 0;
    transition-delay: 0.6s;
}