#image {
    display: flex;
    overflow: hidden;
    position: relative;
    height: 400px; /* Set the height of the container */
}

.images2 {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
}

@keyframes imageAnimation {
    0%, 20% {
        opacity: 0;
    }
    25%, 45% {
        opacity: 1;
    }
    50%, 100% {
        opacity: 0;
    }
}

.images2:nth-child(1) {
    animation: imageAnimation 12s infinite;
    animation-delay: 0s;
}

.images2:nth-child(2) {
    animation: imageAnimation 12s infinite;
    animation-delay: 3s;
}

.images2:nth-child(3) {
    animation: imageAnimation 12s infinite;
    animation-delay: 6s;
}

.images2:nth-child(4) {
    animation: imageAnimation 12s infinite;
    animation-delay: 9s;
}