/********** Template CSS **********/

/*** Header ***/
.carousel-caption {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    background: rgba(0, 0, 0, .1);
    z-index: 1;
}

.carousel-control-prev,
.carousel-control-next {
    width: 15%;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
    width: 3rem;
    height: 3rem;
    border-radius: 3rem;
    background-color: var(--primary);
    border: 10px solid var(--primary);
}

@media (max-width: 768px) {
    #header-carousel .carousel-item {
        position: relative;
        min-height: 450px;
    }
    
    #header-carousel .carousel-item img {
        position: absolute;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}
/*** animate ***/
.delay-1s{animation-delay: 1s;}
.delay-2s{animation-delay: 2s;}
.delay-3s{animation-delay: 3s;}
.delay-4s{animation-delay: 4s;}

/*** strong password ***/
.js-hidden {display: none;}
.btn-outline-secondary {color: #28a745; border-color: #28a745;}
.btn-outline-secondary:hover {background: #28a745;}
.btn-outline-primary.dark{border-color: #000; margin: 3px; padding: 3px; cursor: pointer; background-color: #fff;}
.btn-outline-primary.dark:hover {color: #fff; background-color: #000; border-color: #000;}
.btn-outline-primary.dark:not(:disabled):not(.disabled).active {color: #fff; background-color: #000; border-color: #000;}
.btn-outline-primary.dark.focus {box-shadow: 0 0 0 .2rem #ffee02;}