/*********** Table of Contents ***********
    1.0: Generic Carousel
    2.0: Overlay
*****************************************/

/****************************************/
/******* 1.0: Gernic Carousel ***********/
/****************************************/
/*.apa-carousel-image-background {
    background-color: black;
    display: flex;
    align-items: center;
    justify-content: center;
}
    .apa-carousel-image-background img {
        opacity: 0.7;
        transition: ease all 1s;
    }

.carousel-opacity {
    background-color: #272525;
    height: 100%;
    width: 100%;
    position: absolute;
}
.carousel-Icon-container {
    height: 100%;
    width: 100%;
    position: absolute;
}

.carousel-Icon-button {
    background-color: transparent;
    outline: none;
    border: none;
}
    .carousel-Icon-button img {
        height:75px; 
        width:75px;
    }

.carousel-indicators li {
}
.carousel-indicators .dot {
    cursor: pointer;
    height: 10px;
    width: 10px;
    margin: 0 10px;
    border: 1px solid #fff;
    background-color: #B6B9BC;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
}

.carousel-indicators .active, .carousel-indicators .dot:hover {
    background-color: #717171;
}
.banner-header {
    top: 0;
    width: 100%;
    height: 100%;
    color: white;
    text-align: center;
    position: absolute;

}
.banner-header h1 {
    font-size: 10vw;
    color: var(--background-secondary-color);
    filter: drop-shadow(2px 4px 6px black);
}
.carousel-indicators li{
    opacity:1;
}
.apa-carousel-primary-container {
    height: auto;*/
    /*min-height: 630px;*/
    /*width: 100%;
    z-index:0;
}

.carousel-indicators {
    margin-right: 15%;
    z-index:2;
}

    .carousel-indicators li {
        background-color: #fff;
    }

    .carousel-indicators .active {
        background-color: var(--background-primary-accent-color);
    }

.carousel-control-prev,
.carousel-control-next {
    color: #2699FB;
    z-index: 0;
    outline: none;
    width: auto;
}*/

/****************************************/
/*********** 2.0: Ovverlay **************/
/****************************************/
/*.overlay-carousel, .overlay-solid-carousel {
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
}

    .overlay-carousel.Primary-Color {
        background-image: linear-gradient( 0deg, var(--background-primary-color), transparent);
        background-color: transparent !important;
    }
    .overlay-carousel.Secondary-Color {
        background-image: linear-gradient( 0deg, var(--background-secondary-color), transparent);
        background-color: transparent !important;
    }
    .overlay-carousel.Accent-Color {
        background-image: linear-gradient( 0deg, var(--background-primary-accent-color), transparent);
        background-color: transparent !important;
    }
    .overlay-carousel.White {
        background-image: linear-gradient( 0deg, white, transparent);
        background-color: transparent !important;
    }
    .overlay-carousel.Black {
        background-image: linear-gradient( 0deg,black, transparent);
        background-color: transparent !important;
    }
    .overlay-carousel.Danger {
        background-image: linear-gradient( 0deg,var(--background-primary-danger-color), transparent);
        background-color: transparent !important;
    }
    .overlay-carousel.Succsss {
        background-image: linear-gradient( 0deg,var(--background-primary-success-color), transparent);
        background-color: transparent !important;
    }
    .overlay-carousel.Warning {
        background-image: linear-gradient( 0deg,var(--background-primary-warning-color), transparent);
        background-color: transparent !important;
    }
    .overlay-carousel.Info {
        background-image: linear-gradient( 0deg,var(--background-primary-info-color), transparent);
        background-color: transparent !important;
    }

.carousel-inner {
    width: 100%;
}

    .carousel-inner .carousel-item .text-container {
        position: absolute;
        width:100%;
        color: white;
    }

        .carousel-inner .carousel-item .text-container h2 {
            font-size: var(--font-size-extra-large-title);
        }


@media screen and (max-width: 950px) {
    .carousel-inner .carousel-item .text-container {
        top:initial;
    }
    .apa-carousel-image-background img {
        opacity: 0.6;
        display: block;
        width: 100vw;
        height: 100vh;
        object-fit: cover;
    }
}

.overlay-solid-carousel.Accent-Color,
.overlay-solid-carousel.Black,
.overlay-solid-carousel.Black-25,
.overlay-solid-carousel.Black-50,
.overlay-solid-carousel.Black-75,
.overlay-solid-carousel.Danger,
.overlay-solid-carousel.Info,
.overlay-solid-carousel.Primary-Color,
.overlay-solid-carousel.Secondary-Color,
.overlay-solid-carousel.Success,
.overlay-solid-carousel.Warning,
.overlay-solid-carousel.White {
    opacity: 0.8;
}*/