*{
    margin: 0;
}

.img-gallery{
    display: flex;
    gap: 1rem;
    margin: 2vw;
}


.gallery-item1{
    flex: 33%;
    padding: 1rem;
    animation-name: translate;
    animation-duration: 2.5s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}

.gallery-item1,.gallery-item2,.gallery-item3, img{
    object-fit: cover;
    width: 100%;
    height: 30vw;
}
@keyframes translate{
    0% {transform: none;}

    25% {transform: translateY(-25px);}

    50% {transform: translateY(0);}

    100% {transform: none;}
}


.gallery-item2{
    flex: 33%;
    padding: 1rem;
    animation-name: translate;
    animation-duration: 2.5s;
    animation-delay: 0.5s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite

}


.gallery-item3{
    flex: 33%;
    padding: 1rem;
    animation: 2.5s infinite 1s ease-in-out translate;
}