.ce-layout-box-outer {
    color: var(--ce-color-fg, rgb(51, 51, 51));
    background-color: var(--ce-color-bg, rgb(255, 255, 255));
    box-shadow: var(--ce-layout-box-shadow, none);
}

.ce-layout-box-inner {
    padding: var(--ce-layout-box-padding, 0.625rem);
    padding-bottom: calc(var(--ce-layout-box-padding, 0.625rem) * 1.5);
    padding-top: calc(var(--ce-layout-box-padding, 0.625rem) * 1.5);
}

.ce-layout-box-inner > :is(
.ce-above-header,
.ce-above,
.ce-below) > .ce-gallery {
    margin-left: calc(-1 * var(--ce-layout-box-padding, 0.625rem));
    margin-right: calc(-1 * var(--ce-layout-box-padding, 0.625rem));
}

.ce-layout-box-inner > .ce-above-header {
    margin-top: calc(-1 * var(--ce-layout-box-padding, 0.625rem));
}

.ce-layout-quote-outer {
    background-image: url(../../Images/background_quote.png);
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: 100% auto;
    margin-top: .625rem;
    padding-right: 6vw;
    padding-bottom: calc(12vw + 2.5rem);
    padding-top: calc(var(--ce-spacer) + 2rem);
    position: relative;
}

.ce-layout-quote-outer::before {
    content: "";
    background-image: url(../../Images/icon_quote.png);
    background-repeat: no-repeat;
    height: 48px;
    width: 60px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    text-align: center;
    display: block;
}

@media (min-width: 30rem) {

    .ce-layout-quote-outer {
        max-width: 40rem;
        margin-left: auto;
        margin-right: auto;
        background-size: auto auto;
        padding-top: 0;
        padding-right: 3.5rem;
        padding-left: 5.5rem;
        padding-bottom: 6rem;
    }

    .ce-layout-quote-outer::before {
        right: auto;
    }

}

@media (min-width: 87.5rem) {

    .ce-layout-quote-outer {
        background-size: auto auto;
        padding-top: 0;
        padding-right: 5rem;
        padding-left: 6.25rem;
        padding-bottom: 7.5rem;
    }

    .ce-layout-quote-outer::before {
        right: auto;
    }

}


/* Spezial Rahmen für Service */

.ce-layout-serviceframe {
    --inner-padding: 1.25rem;
}

.ce-layout-serviceframe .col-inner {
    position: relative;
    padding: .625rem;
    padding: 2.5rem var(--inner-padding);
    border-radius: .3125rem;
    box-shadow: 0 0 1.25rem rgba(0,0,0,.125);
    padding-bottom: 0;
    margin-bottom: 2.5rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.ce-layout-serviceframe .ce-element {
    flex-grow: 1;
}

.ce-layout-serviceframe .ce-element:last-child {
    flex-grow: 0;
    margin-bottom: 1.25rem;
    display: block;
    padding: 1.25rem var(--inner-padding);
    margin: 0 calc(var(--inner-padding) * -1);
    background-color: rgba(0,0,0,.025);
}

.ce-layout-serviceframe .ce-header {
    padding: var(--inner-padding);
    margin: -2.5rem calc(var(--inner-padding) * -1);
    margin-bottom: 0;
}
.ce-layout-serviceframe .ce-header {
    background-size: cover;
}
.ce-layout-serviceframe .row > :nth-child(1) .ce-header {
    background-image: url("../../Images/paket-bronze.jpg");
}
.ce-layout-serviceframe .row > :nth-child(2) .ce-header {
    background-image: url("../../Images/paket-silber.jpg");
}
.ce-layout-serviceframe .row > :nth-child(3) .ce-header {
    background-image: url("../../Images/paket-gold.jpg");
}
.ce-layout-serviceframe .ce-header > * {
    color: rgb(255,255,255);
    text-shadow: 0 0 1.25rem rgba(0,0,0,.25);
    font-size: clamp(1.25rem, 1rem + 1.25vw, 2.5rem);
}

.ce-layout-serviceframe p strong {
    display: block;
    padding: 1.25rem var(--inner-padding);
    margin: 0 calc(var(--inner-padding) * -1);
    background-color: rgba(0,0,0,.025);
}
.ce-layout-serviceframe .ce-element:last-child p strong {
    background-color: transparent;
    padding: 0;
    margin: 0;
}

@media (min-width: 30rem) {

    .ce-layout-serviceframe {
        --inner-padding: 2.5rem;
    }

}

@media (min-width: 62rem) {

    .ce-layout-serviceframe {
        --inner-padding: 1.875rem;
    }

    .ce-layout-serviceframe .row > * {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .ce-layout-serviceframe .row > * {
        display: flex;
        flex-direction: column;
    }

}

@media (min-width: 90rem) {

    .ce-layout-serviceframe {
        --inner-padding: 2.5rem;
    }

}

/* Special Layout for iframe on home page */

@media all {

    .content > .ce-element.ce-layout-iframe-homepage .ce-grid-fullwidth-bg {
        background-color: transparent;
        padding-top: 0;
        padding-bottom: var(--ce-spacer-inner);
        padding-top: var(--ce-spacer-inner);
        margin-top: calc(var(--ce-spacer, 1rem) * -1);
    }

    .content > .ce-element.ce-layout-iframe-homepage .ce-grid-fullwidth-bg .ce-type-html {
        margin: 0 -15px;
    }

    .content > .ce-element.ce-layout-iframe-homepage .ce-grid-fullwidth-bg::before {  
        content: "";
        position: absolute;
        height: calc(var(--ce-spacer-inner) * 15);
        bottom: 0;
        left: 0;
        right: 0;
        background-color: var(--dw-background-dark);
        /* oder */
        top: calc(var(--ce-spacer-inner) * 12);
        bottom: auto;

    }

}

@media (min-width: 1460px) {

    .content > .ce-element.ce-layout-iframe-homepage .ce-grid-fullwidth-bg .ce-type-html {
        margin: 0 -45px;
    }

}