@charset "utf-8";
/* CSS Document */

#meinCarousel { padding: 0px; background:#CCCCCC; }

/* Fade dauert 2 Sekunden
.carousel-item {
  transition: opacity 2s ease; 
} */

/* Slide dauert 2 Sekunden */
.carousel-item {
  transition: transform 1.5s ease; 
}

 /*.sliderImage {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
}*/
.caroussel-img { max-height:305px; object-fit: cover; object-position: top; }

.carousel-caption h1, .carousel-caption h2, .carousel-caption h3 {
    font-weight: bold;
    font-size: 1.3rem;
    /*text-shadow: 0 0 10px #000;*/
    text-transform: uppercase;
    /*letter-spacing: 1px;*/
    color:rgba(195, 19, 21, 1.0);
}

.carousel-indicators { margin-bottom: 0.25rem; }

.carousel-control-next-icon, .carousel-control-prev-icon {
    background-color: #000000bf;
}

/* Spech Bubble Slider  */
.slider-speech-bubble {
    position: relative;
    background: #FFFFFF;
    padding: 20px;
    width: 100%;
    color: #029c9e;
    text-align: left;
}

/* Spech Bubble  Pfeil */
.slider-speech-bubble::after {
    content: "";
    position: absolute;
    bottom: -30px;   /* Abstand nach unten */
    left: 125px;    /*   horizontale Position */
    /*  left: 50%;      zentieren 
    transform: translateX(-50%);*/
    width: 0;
    height: 0;
    border-left: 0px solid transparent;
    border-right: 30px solid transparent;
    border-top: 30px solid #FFF; /* gleiche Farbe wie Box */
}

/* #################### max-width: 1198.98px ########################### */
@media (max-width: 1198.98px) {
    
    .carousel-item { height: 250px; }
    
}

/* #################### max-width: 767.98px ########################### */
@media (max-width: 767.98px) {
    
    
    .carousel-item { height: auto; top: 0.5rem; }
    
    .carousel-caption h1, .carousel-caption h2, .carousel-caption h3 {
        padding: 15px 0px 10px;
        font-size: 1.2rem;
    }
    
    .btn-slider { margin-bottom: 15px; }
    
}

/* #################### max-width: 575.99px ########################### */
@media (max-width: 575.99px) {  
    
    .slider-speech-bubble { padding: 10px; }
    
    .carousel-caption {
        bottom: 0rem;
        right: 5%;
        left: 5%;
        padding-top: 0.25rem;
        padding-bottom: 0.5rem;
    }
    
    .carousel-caption h1, .carousel-caption h2, .carousel-caption h3 {
        padding: 0px 0px 5px;
        font-size: 1.0rem;
        letter-spacing: 0px;
    }
    
}