.image-gallery{
    width: 500px;
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 30%;
    overflow: hidden;
    border: 10px solid #09e9f1fa;
    border-radius: 8px;
    box-shadow: -1px 5px 15px black;
}

.image-gallery2{
    width: 500px;
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 75%;
    overflow: hidden;
    border: 10px solid #09e9f1fa;
    border-radius: 8px;
    box-shadow: -1px 5px 15px black;
}


.wrapper{
    width: 100%;
    display: flex;
    animation: slide 20s infinite;
}

.galleryimg{
    width: 100%;
    object-fit: contain;
}

@keyframes slide{
    0%{
        transform: translateX(0);
    }
    10%{
        transform: translateX(0);
    }
    20%{
        transform: translateX(-100%);
    }
    30%{
        transform: translateX(-100%);
    }
    40%{
        transform: translateX(-200%);
    }
    52%{
        transform: translateX(-200%);
    }
    68%{
        transform: translateX(-300%);
    }
    79%{
        transform: translateX(-300%);
    }
    87%{
        transform: translateX(-400%);
    }
    97%{
        transform: translateX(-500%);
    }
}