/**
 * Allgemeine CMS-Formatierung (aus Startseiten-CMS extrahiert).
 * Gilt für alle CMS-Seiten, nicht nur die Startseite.
 */

.row-kate-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 0 4px;
}

.column-kate-container {
    -ms-flex: 16%;
    flex: 16%;
    max-width: 17%;
    padding: 0 1.21%;
    padding-bottom: 2%;
}

.columnspan1-kate-container {
    -ms-flex: 56%;
    flex: 56%;
    max-width: 56%;
    padding: 0 1.21%;
    padding-bottom: 2%;
}

.columnspan2-kate-container {
    -ms-flex: 36.5%;
    flex: 36.5%;
    max-width: 36.5%;
    padding: 0 1.21%;
    padding-bottom: 2%;
}

.column-kate-container img {
    vertical-align: middle;
    width: 100%;
}

.main-kacheln-container {
    box-sizing: border-box;
}

@media screen and (max-width: 1000px) {
    .columnspan1-kate-container {
        -ms-flex: 100%;
        flex: 100%;
        max-width: 100%;
    }

    .columnspan2-kate-container {
        -ms-flex: 47.5%;
        flex: 47.5%;
        max-width: 47.6%;
    }

    .column-kate-container {
        -ms-flex: 30.9%;
        flex: 30.9%;
        max-width: 30.9%;
    }

    .main-kacheln-container {
        width: 102.5% !important;
    }
}

@media screen and (max-width: 600px) {
    .columnspan1-kate-container,
    .columnspan2-kate-container {
        -ms-flex: 100%;
        flex: 100%;
        max-width: 100%;
    }

    .column-kate-container {
        max-width: 100%;
    }
}

.grid-container-kontakt {
    display: grid;
    grid-template-columns: 28% 21% 2% 28% 21%;
    grid-template-rows: 60px 60px 70px 250px;
}

@media screen and (max-width: 1150px) {
    .grid-container-kontakt {
        grid-template-columns: 65% 35%;
        grid-template-rows: 60px 60px 70px 250px 20px 60px 300px;
    }
}

@media screen and (max-width: 600px) {
    .grid-container-kontakt {
        grid-template-columns: 100%;
        grid-template-rows: 60px 350px 60px 270px 60px 320px 240px;
    }
}

.item-kontakt2 picture {
    display: flex;
    height: 100%;
}

.item-kontakt2 img {
    height: 100%;
}

/* CMS Slider (Steiner_SliderHome) – Höhe via Widget-Parameter (inline max-height) */
.steiner-cms-slider {
    width: 100%;
    position: relative;
    overflow: hidden;
    --swiper-navigation-size: 32px;
}

.steiner-cms-slider .swiper-wrapper,
.steiner-cms-slider .swiper-slide {
    height: 100%;
    max-height: inherit;
}

.steiner-cms-slider .swiper-slide {
    overflow: hidden;
}

.steiner-cms-slider .swiper-slide img {
    width: 100%;
    height: 100%;
    max-height: inherit;
    display: block;
    object-fit: cover;
}

.steiner-cms-slider .swiper-slide a {
    display: block;
    line-height: 0;
}

.steiner-cms-slider .swiper-pagination {
    position: absolute;
    bottom: 10px;
    left: 0;
    width: 100%;
    z-index: 10;
}

/* Navigation: bxSlider-Sprite (controls.png) */
.steiner-cms-slider .swiper-button-prev,
.steiner-cms-slider .swiper-button-next {
    width: 32px;
    height: 32px;
    top: 50%;
    transform: translateY(-50%);
    margin-top: 0;
    outline: 0;
    z-index: 9999;
    color: transparent;
    background: url('/media/images/controls.png') no-repeat;
}

.steiner-cms-slider .swiper-button-prev {
    left: 10px;
    right: auto;
    background-position: 0 -32px;
}

.steiner-cms-slider .swiper-button-prev:hover,
.steiner-cms-slider .swiper-button-prev:focus {
    background-position: 0 0;
}

.steiner-cms-slider .swiper-button-next {
    right: 10px;
    left: auto;
    background-position: -43px -32px;
}

.steiner-cms-slider .swiper-button-next:hover,
.steiner-cms-slider .swiper-button-next:focus {
    background-position: -43px 0;
}

.steiner-cms-slider .swiper-button-prev.swiper-button-disabled,
.steiner-cms-slider .swiper-button-next.swiper-button-disabled {
    display: none;
}

.steiner-cms-slider .swiper-button-prev svg,
.steiner-cms-slider .swiper-button-next svg {
    display: none;
}

.steiner-cms-slider .swiper-pagination-bullet-active {
    background: #e30613;
}
