@keyframes opaque {
    0% { opacity: 0 }
    25% { opacity: 1 }
    75% { opacity: 1 }
    100% { opacity: 0 }
}


.grid-banner {
    height: 600px;
    width: 100%;
    display: flex;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    flex-direction: column;
    justify-content: center;
    align-items: center;
 
}

.grid-ani {
    animation: opaque;
    animation-duration: 6s;
}

.grid-banner-con {
    text-align: center;
}

.grid-banner-title {
    font-size: 2.5em;
    font-weight: 600;
    color: #fff;
}

.grid-banner-text {
    font-size: 4em;
    font-weight: 700;
    color: #fff;
}