@keyframes slider {
    0% { left: 0; }
    20% { left: 0; }
    25% { left: -100%; }
    45% { left: -100%; }
    50% { left: -200%; }
    70% { left: -200%; }
    75% { left: -300%; }
    95% { left: -300%; }
    100% { left: -400%; }
}

#slider {
    position: relative;
    overflow: hidden;
    height: 90vh;
    width: 100%;
}

#slider figure {
    position: absolute;
    width: 500%;
    height: 100%;
    margin: 0;
    left: 0;
    display: flex;
    animation: 20s slider infinite;
}

#slider figure div {
    width: 20%;
}

#slider figure img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ensures the image covers the div */
}

.banner-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    max-width: 768px;
    z-index: 2;
    color: white;
    text-align: center;
}

.font-1, .font-2 {
    margin: 0;
}

/* Responsive styling */
@media (max-width: 768px) {
    .font-1 {
        font-size: 1.5rem;
    }
    .font-2 {
        font-size: 2rem;
    }
    .banner-text p {
        font-size: 1rem;
    }
}

.logo-container img {
    height: 4rem;
    width: auto;
  }