/* Allgemeine Container-Styling */


/* Hintergrundbild ohne Parallax-Effekt */
.custom-background-image {
    background-size: cover;
    background-position: center;
    height: 500px; /* Standardhöhe */
    position: relative;
}

.custom-background-image.tall {
    height: 645px; /* Höhe für Tall */
}

/* Parallax-Effekt */
.parallax {
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    z-index: 0;
}

/* Overlay-Styling für den Farbüberzug */
.custom-container-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    opacity: 0.8;
}

.custom-container-overlay.blue {
    background-color: rgba(0, 56, 109, 1); /* Blau */
}

.custom-container-overlay.orange {
    background-color: rgba(245, 102, 16, 1); /* Orange */
}

.custom-container-overlay.green {
    background-color: #0BBE87;
}

/* Inhalt des Containers */
.custom-container-content {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: center; 
    align-items: flex-start; 
    height: 100%; 
    flex-direction: column;
}

/* Header-Text Styling */
.custom-container-header {
    margin: 0;
    font-size: 2rem;
    color: white;
    text-align: center; /* Standardmäßig zentriert */
    width: 100%;
}

/* Textstile für den Header */
.custom-container-header.normal {
    color: white;
}

.custom-container-header.transparent {
    color: transparent;
    -webkit-text-stroke: 1px white;
}

/* Schriftgröße */
.custom-container-header.small {
    font-size: 3.5rem;
    font-weight: 800;
}

/* Textausrichtung: Links, Mitte, Rechts */
.custom-container-header.left {
    text-align: left;
}

.custom-container-header.center {
    text-align: center;
}

.custom-container-header.right {
    text-align: right;
}

/* Vertikale Ausrichtung des Textes */
.custom-container-header.top {
    align-self: flex-start !important; /* Text nach oben ausrichten */
}

.custom-container-header.middle {
    margin: auto 0; /* Text in der Mitte */
    align-self: center;
}

.custom-container-header.bottom {
    margin-top: auto;
    align-self: flex-end !important; /* Text nach unten ausrichten */
}

/* Styling für Videos als Hintergrund */
.custom-background-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

/* Zusatz für das Header-Bild */
.header-image {
    height: 44px;
    display: flex;
    background-repeat: no-repeat;
    min-width: 170px;
}