.banner-splash {
    /* margin-bottom: 50px; */
    /* border: 1px solid red; */
    /* height: 100%; */
    /* width: 100%; */
    /* height: 20rem; */
    display: inline-block;
    /* overflow: none; */
    height: fit-content;
    min-height: 100% !important;
}


.banner {
    /* position: absolute; */
    top: 0;
    left: 0;
    right: 0;
    z-index: -1;
    /* width: 100vw; */
    /* height: 100vh; */
    object-fit: cover;
    width: 100%;
    /* max-height: 100%; */
    height: auto;
    display: block;
    /* background-size: 100% 100%; */
    /* border: 5px solid green; */
    /* margin-bottom: 5%; */
}

.splash {
    /* height: fit-content;
    width: fit-content; */
    /* border: 5px solid purple; */
    display: inline-block;
    width: 100%;
    height: auto;
    /* overflow: hidden; */
    /* position: relative; */
    /* z-index: -5; */
}

.banner-text {
    /* margin-top: 64vh; */
    display: flex;
    /* align-items: center; */
    justify-content: center;
    width: 75%;
    /* height: 0vh; */
    position: absolute; /* position the text absolutely within the splash div */
    top: 50%; /* position it in the middle vertically */
    left: 50%; /* position it in the middle horizontally */
    transform: translate(-50%, -50%); /* adjust the position to truly center the text */
}

.banner-text div {
    background-color: rgba(224, 226, 219,.5);
    padding: 4%;
    /* padding-top: 10%; */
    text-align: center;
}

.banner-text-content {
    grid-template-columns: auto;
    display: block;
    padding: auto;
}

.banner-text-content a {
    background-color: var(--main-color);
    display: inline-block;
    padding: 12px;
    text-decoration: none;
    color: var(--text-color);
    /* transition: all .2s; */
    border-radius: 20px;
    border: 1px solid black;
    /* font-weight: bolder; */
}
 
/* .banner-text-content a:hover {
    cursor: pointer;
    background-color: #768a87;
} */

mark {
    -webkit-animation: 1s highlight 1s 1 normal forwards;
    animation: 1s highlight 1s 1 normal forwards;
    background-color: none;
    background: linear-gradient(90deg, var(--highlight-color)/*#7efff5*/ 50%, rgba(255, 255, 255, 0) 50%);
    background-size: 200% 100%;
    background-position: 100% 0;
}

@-webkit-keyframes highlight {
    to {
        background-position: 0 0;
    }
}

@keyframes highlight {
    to {
        background-position: 0 0;
    }
}