@charset "utf-8";
/* moved by compressor */
.venue-search-ajax-wrapper {
    position: relative;
    padding-bottom:0;
    margin-bottom:10px;
}

.venue-search-ajax-wrapper:after {
    display: none !important;
}

.venue-ajax-content {
    min-width: 100%;
    position: absolute;
    background: #fff;
    padding: 10px;
    z-index: 9;
    top: 100%;
    left:0;
    margin: 0 0 0 0;
    box-shadow: 3px 3px 10px rgba(0,0,0,0.5);
    display: none;
}

.venue-ajax-content.visible {
    display: block;
}

.venue-ajax-content .et-ml-ajax-keyword-item {
    cursor: pointer;
}

#sb-title-inner,#sb-info-inner,#sb-loading-inner,div.sb-message{font-family:"HelveticaNeue-Light","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:200;color:#fff;}
#sb-container{position:fixed;margin:0;padding:0;top:0;left:0;z-index:999;text-align:left;visibility:hidden;display:none;}
#sb-overlay{position:relative;height:100%;width:100%;}
#sb-wrapper{position:absolute;visibility:hidden;width:100px;}
#sb-wrapper-inner{position:relative;border:1px solid #303030;overflow:hidden;height:100px;}
#sb-body{position:relative;height:100%;}
#sb-body-inner{position:absolute;height:100%;width:100%;}
#sb-player.html{height:100%;overflow:auto;}
#sb-body img{border:none;}
#sb-loading{position:relative;height:100%;}
#sb-loading-inner{position:absolute;font-size:14px;line-height:24px;height:24px;top:50%;margin-top:-12px;width:100%;text-align:center;}
#sb-loading-inner span{background:url('../../../templates/public/js/shadowbox-3.0.3/loading.gif') no-repeat;padding-left:34px;display:inline-block;}
#sb-body,#sb-loading{background-color:#060606;}
#sb-title,#sb-info{position:relative;margin:0;padding:0;overflow:hidden;}
#sb-title,#sb-title-inner{height:26px;line-height:26px;}
#sb-title-inner{font-size:16px;}
#sb-info,#sb-info-inner{height:20px;line-height:20px;}
#sb-info-inner{font-size:12px;}
#sb-nav{float:right;height:16px;padding:2px 0;width:45%;}
#sb-nav a{display:block;float:right;height:16px;width:16px;margin-left:3px;cursor:pointer;background-repeat:no-repeat;}
#sb-nav-close{background-image:url('../../../templates/public/js/shadowbox-3.0.3/close.png');}
#sb-nav-next{background-image:url('../../../templates/public/js/shadowbox-3.0.3/next.png');}
#sb-nav-previous{background-image:url('../../../templates/public/js/shadowbox-3.0.3/previous.png');}
#sb-nav-play{background-image:url('../../../templates/public/js/shadowbox-3.0.3/play.png');}
#sb-nav-pause{background-image:url('../../../templates/public/js/shadowbox-3.0.3/pause.png');}
#sb-counter{float:left;width:45%;}
#sb-counter a{padding:0 4px 0 0;text-decoration:none;cursor:pointer;color:#fff;}
#sb-counter a.sb-counter-current{text-decoration:underline;}
div.sb-message{font-size:12px;padding:10px;text-align:center;}
div.sb-message a:link,div.sb-message a:visited{color:#fff;text-decoration:underline;}

.et-cookie, .et-cookie * {
    box-sizing: border-box;
}

.et-cookie {
    position: fixed;
    z-index: 999999;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none;
    overflow-y: auto;
    padding: 1em;
    background-color: rgba(0, 0, 0, 0.6);
}
.et-cookie__main {
    position: relative;
    max-width: 58em;
    margin: 0 auto;
    padding: 3em;
    background: white;
}
@media (max-width: 700px) {
    .et-cookie__main {
        padding: 1em;
    }
}

.et-cookie h2 {
    margin-top: 0;
    padding-top: 0;
}
.et-cookie__links a {
    margin-right: 1em;
}


/*************************************************
Checkboxen
*************************************************/
.et-cookie__checkboxes {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    justify-content: flex-end;
    margin: 1em 0;
    gap: 0.5em;
}
.et-cookie__checkbox-container {
    display: flex;
    flex: 1 0 auto;
    flex-wrap: wrap;
    max-width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
}
.et-cookie__checkbox-container legend {
    position: absolute;
    overflow: hidden;
    clip: rect(0 0 0 0);
    width: 1px;
    height: 1px;
    white-space: nowrap;
    clip-path: inset(50%);
}
.et-cookie__checkbox-item {
    position: relative;
    display: block;
    flex: 0 0 auto;
    width: auto;
    margin: 0 2.5em 0 0;
    padding: 0.5em 0;
    border: 0;
}
.et-cookie__checkbox-item input[type="checkbox"] {
    position: static;
    display: inline-block;
    float: none;
    margin: 0 1em 0 0;
    border: 1px solid;
}
.et-cookie__disabled .et-cookie__checkbox-label-text {
    opacity: 0.64;
}
.et-cookie__checkbox-item:not(.et-cookie__disabled) {
    cursor: pointer;
}
@media (max-width: 600px) {
    .et-cookie__checkbox-item {
        min-width: 60%;
    }
}

.et-cookie__popup-infos {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
}
.et-cookie__popup-infos p {
    display: none;
    margin-top: 0;
    padding: 0.5em;
    border: 1px solid;
}

/*************************************************
Detail-Texte
*************************************************/
.et-cookie__details-text {
    overflow: hidden;
    margin-top: 1em;
}
.et-cookie__details-text,
.et-cookie__details--hide .et-cookie__show_details * + span,
.et-cookie__details:not(.et-cookie__details--hide) .et-cookie__show_details span:first-child {
    display: none;
}


/*************************************************
Buttons
*************************************************/
.et-cookie button, .et-cookie-blocker button {
    font: inherit;
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    max-width: 100%;
    margin: 0;
    cursor: pointer;
    text-align: left;
}
button.et-cookie__no-btn {
    padding: 0.5em 0;
    color: inherit;
    border: 0;
    background: 0;
}

.et-cookie__show_details {
    outline: none;
}
button.et-cookie__big-btn {
    font-size: 1.3em;
}

.et-cookie__main-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    margin-top: 2em;
}
.et-cookie__main-actions button {
    margin: 0 0 0.5em 1em;
}

/*************************************************
Button-Icons
*************************************************/
.et-cookie__icon {
    position: relative;
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-left: 0.3em;
}
.et-cookie__icon svg {
    max-width: 100%;
    max-height: 100%;
}
.et-cookie__show_details .et-cookie__icon svg {
    transform: rotate(270deg);
}
.et-cookie__details--hide .et-cookie__icon svg {
    transform: rotate(90deg);
}

/*************************************************
Content-Blocker
*************************************************/
.et-cookie-has-blocker {
    pointer-events: none;
}
.et-cookie-blocker {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    overflow: auto;
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;
    box-sizing: border-box;
    padding: 1em;
    text-align: center;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.6);
}
*:not(.et-cookie-has-blocker) + .et-cookie-blocker {
    display: none;
}
.et-cookie-blocker button + button {
    margin-top: 0.5em;
}
.et-cookie-blocker > * {
    flex: 0 0 auto;
    max-width: 50em;
    transition: 0.3s;
}
.et-cookie-blocker > :first-child {
    margin-top: auto;
}
.et-cookie-blocker > :last-child {
    margin-bottom: auto;
}
.et-cookie-blocker.et-show-on-hover:not(:hover) > * {
    transform: translateY(1em);
    opacity: 0;
}



@font-face {
    font-family: 'modern_pictogramsnormal';
    src: url('../../../templates/public/fonts/modernpics-webfont.eot');
    src: url('../../../templates/public/fonts/modernpics-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../../templates/public/fonts/modernpics-webfont.woff') format('woff'),
         url('../../../templates/public/fonts/modernpics-webfont.ttf') format('truetype'),
         url('../../../templates/public/fonts/modernpics-webfont.svg#modern_pictogramsnormal') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* latin */
@font-face {
    font-family: 'Source Sans 3';
    font-style: normal;
    font-weight: 200 900;
    font-display: swap;
    src: url('../../../templates/public/fonts/source-sans-3-v15-latin-variable-normal.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin italic*/
@font-face {
    font-family: 'Source Sans 3';
    font-style: italic;
    font-weight: 200 900;
    font-display: swap;
    src: url('../../../templates/public/fonts/source-sans-3-v15-latin-variable-italic.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
    font-family: 'Source Sans 3';
    font-style: normal;
    font-weight: 200 900;
    font-display: swap;
    src: url('../../../templates/public/fonts/source-sans-3-v15-latinext-variable-normal.woff2') format('woff2');
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin-ext italic */
@font-face {
    font-family: 'Source Sans 3';
    font-style: italic;
    font-weight: 200 900;
    font-display: swap;
    src: url('../../../templates/public/fonts/source-sans-3-v15-latinext-variable-italic.woff2') format('woff2');
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* great-vibes-regular - latin (Trauer-Anzeigen mit .style-1) */
@font-face {
    font-family: 'Great Vibes';
    font-style: normal;
    font-weight: 400;
    src: local(''),
    url('../../../templates/public/fonts/great-vibes-v14-latin-regular.woff2') format('woff2'),
    url('../../../templates/public/fonts/great-vibes-v14-latin-regular.woff') format('woff');
    font-display: swap;
}



/* ----- Reset Style ----- */
* { border:0; margin:0; padding:0; background:transparent; vertical-align:baseline; font-size:100%; box-sizing:border-box; font-weight:inherit; font-style:inherit; }


/*
==================================================
Grundeinstellungen
==================================================
*/
/* .bg-* Container resetten die Farb-Zuordnungen,
damit sich die Farben bei Schachtelung von .bg-* Containern korrekt verhalten */
body, [class^="bg-"], [class*=" bg-"] {
    /* Farb-Zuordnung */
    --color-txt: var(--color-dark);
    --color-txt-rgb: 0,0,0;
    --color-equals-bg: var(--bgcolor-default);
    /* -adapt-: Farbe ist primär das was dransteht, passt sich aber je nach Hintergrund ggf. an */
    --color-adapt-main: var(--color-main);
    --color-adapt-main-dark: var(--color-main-on-white);
    /* -if-: Farbe ist primär das was dransteht, passt sich aber an, wenn die Bedingung erfüllt ist */
    --color-adapt-main--white-if-bg-main: var(--color-main);
    --color-adapt-main--contrast-if-bg-main: var(--color-main);
    --color-adapt-contrast--main-if-bg-main: var(--color-contrast);
    --color-adapt-contrast--dark-if-bg-main: var(--color-contrast);
    --color-adapt-black: #000;

    --color-link: var(--color-adapt-main-dark);
    --color-link-hover: var(--color-adapt-main-dark);
    --color-icon: currentcolor;
    --color-listmarker: var(--color-adapt-main);

    --color-btn: var(--color-txt);
    --bgcolor-btn: none;
    --color-btn-hover: var(--color-btn);
    --bgcolor-btn-hover: var(--color-main);
    --color-btn-inact: inherit;
    --bgcolor-btn-inact: var(--bgcolor-btn);
    --color-btn-act: var(--color-btn-hover);
    --bgcolor-btn-act: var(--bgcolor-btn-hover);



    --color-search: var(--color-adapt-contrast--dark-if-bg-main);
    --bgcolor-search: var(--color-adapt-main--white-if-bg-main);

    --color-underline: var(--color-adapt-main);
}
body, [class^="world-"], [class*=" world-"] {
    --color-world: var(--color-main);
    --color-world-on-white: var(--color-world);
    --color-world-big-on-white: var(--color-world);
    --color-world-rgb: var(--color-main-rgb);
    --color-txt-on-bg-world: var(--color-dark);
}
body {
    --color-main: rgb(var(--color-main-rgb));
    --color-main-light: #fab000;
    --color-main-on-white: #906400; /* mindestens 4.5:1 Kontrast */
    --color-main-big-on-white: #C28800; /* mindestens 3:1 Kontrast */
    --color-main-rgb: 250,176,0;

    --color-dark: #272727;
    --color-lightgrey: #eee;

    --color-contrast: var(--color-dark); /* Besserer Kontrast zur hellen oder dunklen Hauptfarbe */

    --color-rose: #DB6B7C; /* Feierlich - hell */
    --color-rose-on-white: #C25162;
    --color-rose-rgb: 219,107,124;
    --color-blue: #1A97D1; /* Gläubig - hell */
    --color-blue-on-white: #157DAC;
    --color-blue-rgb: 26,151,209;
    --color-lila: #761463; /* Hilfreich - dunkel */
    --color-lila-rgb: 118,20,99;
    --color-green: #5B7E16; /* Bildungsstark - dunkel */
    --color-green-rgb: 91,126,22;
    --color-red: #C20938; /* Jugend - dunkel */
    --color-red-rgb: 194,9,56;
    --color-darkblue: #202451; /* Öffentlich - dunkel */
    --color-darkblue-rgb: 32,36,81;
    --color-beige: #b2a288; /* Kulturell - hell */
    --color-beige-on-white: #827255;
    --color-beige-big-on-white: #A29271;
    --color-beige-rgb: 178,162,136;
    --color-black-rgb: 0,0,0; /* Trauer */

    --color-lightblue: #A6D7FD;

    --bgcolor-default: #fff;

    --color-history-act: var(--color-main);
    --color-history-inact: rgb(250, 233, 207);

    --opacity-overlay: 0.9;

    /* Schriftgrößen etc. */
    --fweight: 350;
    --fweight-header: 400;

    --fsize: 2rem;
    --fsize-h1: 5.5rem;;
    --fsize-h2: 4.5rem;
    --fsize-h3: 3rem;
    --fsize-h4: 2.6rem;
    --fsize-h5: 1em;
    --fsize-h6: 1em;

    --fsize-big-h4: 3.5rem;
    --fsize-btn: 0.8em;

    --txttransform-btn: none;

    /* Größen / Abstände */
    --gap-sm: calc(var(--gap-std) / 2);;
    --gap-sm-neg: calc(0px - var(--gap-sm));
    --gap-std: var(--fsize);
    --gap-std-neg: calc(0px - var(--gap-std));
    --gap-dbl: calc(var(--gap-std) * 2);
    --gap-dbl-neg: calc(0px - var(--gap-dbl));
    --gap-big: calc(var(--gap-std) * 3);
    --gap-big-neg: calc(0px - var(--gap-big));

    --height-icon: 1.2em;
    --maxh-topslider: 120vw;
    --vsize-header: 14.1rem;

    /* Sonstige */
    --shadow-input: 0 0.15em 0.33em rgba(3, 3, 3, 0.3);
    --border-btn-width: 1px;
    --bradius-btn: 0;
}
@media (max-width:1200px) {
    body {
        --maxh-topslider: 200vw;
    }
}
@media (max-width:800px) {
    body {
        --fweight: 400;
    }
}
@media (max-width: 550px) {
    body {
        --fsize-h1: 3.8rem;
        --fsize-h2: 3.4rem;
        --fsize-h3: 2.6rem;
        --fsize-h4: 2.3rem;
        --fsize-big-h4: 3rem;
    }
}
@media (max-width: 500px) {
    body {
        --vsize-header: 80px;
    }
}
@media (max-width: 400px) {
    body {
        --vsize-header: 76px;
    }
}
.color-dark {
    --color-contrast: #fff;
}

html { height:100%; min-width:320px; background:#fff; font-size:calc(5px + 0.27vw); scroll-behavior: smooth; overflow-x:hidden; scroll-padding:50px; interpolate-size: allow-keywords;}
body { scroll-behavior: smooth; position:relative; min-height:100%; color:var(--color-dark); text-align:left; font-size:var(--fsize); line-height:1.35; font-family: 'Source Sans 3', Arial, Helvetica, sans-serif; font-weight:var(--fweight); display:flex; flex-direction:column; scroll-padding:5rem;}

@media (max-width:1920px) {
	html { font-size:calc(6.3px + 0.2vw); }
}


/* ----- Standardelemente ----- */
h1, h2, h3, p, dl, ul, ol, blockquote, form, .h2, .h3, .h4 {margin-bottom:1.5rem;}
b, strong, dt, th, caption, .table > figcaption,
.menu-newsarchive,
.month-small a,
.news h4 span,
.news:not(.news-single-item) h3 span,
h5,
.anzeige.style-3 h3, .download-teaser  {font-weight:600;}
em, i, q, blockquote,
.results .url, .download-description {font-style:italic;}
i[class*="icon-"], i[class*="et-cookie_"] {
    font-style: normal;
}
.month-small th,
.anzeige h3 i, .layout-candle h3 i { font-weight: var(--fweight);}
h1, h2, h3, h4, .h2, .h3, .h4, .menu-0 .level-0 > * > * > a, .logo {font-weight: 400;}

sup, sub {font-size:0.8em; position:relative; bottom:0.4em; }
sub {bottom:auto; top:0.25em; }

ul {list-style:square outside;}
ol {list-style:decimal outside;}

li  { margin:0 0 0.33em 2.8em; }
ul > li  { margin: 0 0 0.33em 2.5em; padding-left:0.3em; }
ul > li::marker {color: var(--color-listmarker);}

.list-checks > li {
    list-style-type:"✓";
}

dd+dt {margin-top:0.67em;}

blockquote {font-size: 1.2em; text-align:center; padding:0 1em;}


.h2, .h3, .h4 {border:0;}

h1, .h1, h2.big {font-size: var(--fsize-h1);}
h2, h3, .h2, .h3, .col-headline p, .news-single h1 span {line-height: 1.2em;}
h2, .h2 {font-size: var(--fsize-h2);}
h3, .col-headline p, .h3, .news-single h1 span {font-size: var(--fsize-h3); display:block;}
h4, .h4 {font-size: var(--fsize-h4); margin-bottom:0.2em;}

h1, .col-headline h2 { line-height:1em; }
.col-headline a {text-decoration:none; color:inherit;}
.col-headline a p, .col-headline a h3 {text-decoration:underline;}
.col-headline * {margin-bottom:0;}
.col-headline .csc-subheader {color:var(--color-dark)}
.news-single h1 span {text-transform:none; color: var(--color-dark);}

p.big, .big p {font-size:1.2em; line-height:1.2em; margin-bottom:1.67em;}
.align-right {text-align:right;}
.align-center {text-align:center;}

p, h4 {min-height:1.5em;}
h2, h3 {min-height:1.2em;}
.col-headline h2 {min-height:1em;}

.p {
    font-size: 2rem;
    font-weight: var(--fweight);
}
span.p.p {
    display:inline;
}

a:has(svg) {
    display:inline-flex;
    gap: 0.3em;
}

/*Image/Media/Video*/
img, object, embed, video, iframe, audio {max-width:100%;}
.google-map img {max-width:none;}
img {height:auto;}
object, embed, video, audio, iframe {margin:0 auto 0.67em; display:block; clear:both;}
/* 56.25% entspricht 16:9 */
.keep-ratio {padding-top:56.25%; position:relative; }
.ratio-news-teaser {padding-top:72%;}
#kna-newsticker:first-child .ratio-news-teaser {padding-top:80.7%;}
.ratio-quadrat {padding-top:100%;}
.ratio-quadrat-over {padding-top:calc(100% + 1em);}
.ratio-9-16 {padding-top:177.8%;}
.keep-ratio > * {position:absolute; margin:0 auto; top:0; left:0; width:100%; height:100% !important;}
.wrap-media video, .wrap-video  video {margin:0 auto; width:100%; height:auto !important;}
.wrap-media audio, .wrap-audio  audio {margin:0 auto; width:100%;}

.constrain-width {position:relative; margin: 0 auto 1em;}
.constrain-320 {max-width:320px;}

.wrap-html-youtube {display: flex; clear:both; margin-bottom: 0.67em;}
.wrap-html-youtube > .wrap-inner {margin: 0 auto; position: relative;}
.wrap-html-youtube iframe {margin-bottom: 0;}

/*Skip-Menü*/
.visually-hidden:not(:focus):not(:active) { position: absolute; height: 1px; width: 1px; overflow: hidden; white-space: nowrap; margin: -1px; clip: rect(1px, 1px, 1px, 1px);}
.skip-link:focus {position:absolute; left:0; top:0; width:auto; z-index:2000; background:#fff; padding:0.2em 0.5em; box-shadow:0 0 0.4em rgba(255,255,255,0.5);}
/* Für Standard E-Mail-Adressen-Spamschutz
und bessere Umbrüche bei zu langen E-Mail-Adressen */
del.schutz {
    text-decoration: none;
    display: inline-block;
}


hr { border-top:2.67em solid var(--color-adapt-main); height:0; margin-bottom:2.67em; clear:both;}
.divider {width:100%; height:2.67em; clear:both;}
.divider hr {display:none;}
.divider.div-half-std-padding {height:1em;}

img.space {visibility:hidden; width:1px; height:1px; margin: 0.33em 1px; display:inline-block; }


/* ----- Tabellen ----- */
table { border-collapse:collapse; text-align:left; width:100%; margin-bottom:0.67em;}
td, th { padding: 0.2em 0.67em 0.2em 0; border:0;  width: auto !important; vertical-align: top; text-align: left; }
table p { margin: 0 0 0.5em; }
table p:last-child { margin: 0;}
figure.table {
    display: flex;
    flex-direction: column;
}
.table > figcaption {
    order: -1;
}
caption, .table > figcaption { padding:0 0 0.2em; color:#aaaaaa; font-size: 1.2em; line-height:1.2em;}
table.daten {margin-bottom:1.33em;}
.daten > tr > *:first-child + td, .daten > * > tr > *:first-child + td {text-align:right; vertical-align:bottom;}
.daten > tr > td, .daten > tr > th, .daten > * > tr > td, .daten > * > tr > th  {border-bottom: 1px solid var(--color-txt);  }

table.feste-spalten { table-layout:fixed;}

th.breite-75, td.breite-75 {width:5em !important;}
td.breite-100, th.breite-100 {width:6.67em !important;}
td.breite-150, th.breite-150 {width:10em !important;}
td.breite-200, th.breite-200 {width:13.33em !important;}

/* Ggf. zusätzlich für Umbrüche bei langen E-Mail-Adressen in Ansprechpartner-Tabellen
z.B. https://www.erzbistumberlin.de/wir-sind/ordinariat/generalvikar/
(zusammen mit del.schutz)
td:last-child a[data-mailto-token]:only-child {
    margin-right: -7em;
    overflow-wrap: break-word;
}
*/

/* ----- Formulare ----- */
input::-ms-clear {
    display: none;
}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
  display: none;
}
/* iOS-Style entfernen (mit gesetztem border-radius oben) */
textarea, input[type=submit], input[type=search], input:not([type=checkbox]):not([type=radio]):not([type=upload]) {
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0;
}
input[type=checkbox], select {
    border-radius: 0;
}

.powermail_mandatory_helper {display:none;}
input, select, textarea, .wrap-select:after, .wrap-select:after, .tx_powermail_pi1_fieldwrap_html_select:after {color:var(--color-dark); background-color:#fff; padding:0.27em 0.4em; float:left; font-family: inherit; width:66.6667%; height:2.67em;
     box-shadow: var(--shadow-input);
}
.col-3 label, .col-4 label, .col-6 label , .col-8 label,
.col-3 label + div, .col-4 label + div, .col-6 label + div, .col-8 label + div,
.col-3 label + input, .col-4 label + input, .col-6 label + input, .col-8 label + input,
.col-3 label + select, .col-4 label + select, .col-6 label + select, .col-8 label + select,
.col-3 .wrap-select:after, .col-4 .wrap-select:after, .col-6 .wrap-select:after,
.col-3 .tx_powermail_pi1_fieldwrap_html_select:after, .col-4 .tx_powermail_pi1_fieldwrap_html_select:after, .col-6 .tx_powermail_pi1_fieldwrap_html_select:after,
label + div > input, label + div > select, label + div > textarea {width:100%; margin-left:0;}

input {line-height:inherit;}
select { padding: 0.533em 0.4em 0.533em 0.2em; position:relative; z-index:10;}
.wrap-select:after, .tx_powermail_pi1_fieldwrap_html_select:after {position:absolute; right:0; bottom:0.67em; content:''; display:none;}
textarea { width:66.6667%; height: 10em; }
label { width:32.3333%; float: left; margin: 1px 1% -1px 0; border-bottom: 1px dotted #ccc; }
label[for] { cursor:pointer; }
/* Placeholder-Text heller */
::placeholder { opacity:0.7; color: currentColor;}

.input-text { } /*.input-text gilt für alle inputs mit Text-Eingabe, nicht nur solche mit type="text" (also auch type="password" etc.)*/
input[type="file"] {width:23.33em; padding:0.33em;}

form { clear: both; }
fieldset { float:left; clear: both; width:100%; margin-bottom:1.33em; }
form div {position:relative; float:left; width:100%;}
form fieldset > div, form > div {  clear: both;  padding-bottom:0.67em; }
form label + div {width:66.6667%;}

form p { width:100%; margin-top: 0.8em; float:left; }
form h2 + p, form h2 + div p, form p + div p { margin-top:0; }

/*radio und checkbox
- sollten einmal einen Gruppen-Wrap und nochmal je einen einzelnen Wrap haben (auch wenn nur ein Element!)
- Wenn aus anderen Gründen zusätzliche divs benötigt werden, auf Klassenselektoren umstellen */
input[type="checkbox"]~label, input[type="radio"]~label { width:auto; margin-left:38%; border:none;}
input[type="checkbox"], input[type="radio"] { position:absolute; left:33.3333%; top:0.2em; width:0.87em; height:0.87em; border:0; background:transparent; padding:0; box-shadow: none;}
input[type="radio"] {border-radius:50%;}
div + div > fieldset {margin-top:1.33em;}
fieldset > div:last-child > fieldset {margin-bottom:0;}
legend {margin-bottom:0.67em;}
form > h2 {display:none;}

.col > input[type="checkbox"], .col > input[type="radio"] {left:1em;}
.col > input[type="checkbox"]~label, .col > input[type="radio"]~label { margin-left:1.67em;}

input[type="search"] {
    background-color: var(--bgcolor-search);
    color: var(--color-search);
    box-shadow: none;
}

input[type="text"], input[type="email"], input[type="password"], textarea {background-image:url('../../../templates/public/layout/arrow-input-light.png'); background-position: 0.5em 1em; background-repeat:no-repeat; padding-left: 1.2em;}
input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, textarea:focus {background-image:url('../../../templates/public/layout/arrow-input.png');}

.form-small input[type="checkbox"], .form-small input[type="radio"] {left:0;}
.form-small input[type="checkbox"]~label, .form-small input[type="radio"]~label, .form-inline input[type="checkbox"] ~ label, .full-fields input[type="checkbox"] ~ label, .full-fields input[type="radio"] ~ label {margin-left:1.67em; width:auto;}

.form-inline input {width:95%; margin-right:5%;}
.form-inline div {width:25.8%;}
.form-inline input[type="submit"] { width:22.6%; margin:0; clear:none;}
.form-inline input[type="checkbox"] {width:0.87em; margin:0; left:0; }

.full-fields input:not([type=checkbox]):not([type=radio]):not([type=submit]), .full-fields select, .full-fields textarea {width:100%;}
.full-fields input[type="checkbox"], .full-fields input[type="radio"] {left:0;}
.full-fields [class*=col] > input[type="checkbox"], .full-fields [class*=col] > input[type="radio"] {left:1em;}
.full-fields input.btn, .full-fields input[type="submit"] {margin:2em 0 0;}

.powermail_field_error_container, .powermail_form > div:first-child, .powermail_check_outer {padding-bottom:0;}
.powermail-errors-list {margin-bottom:0; clear:both; color:red; list-style:none;}
.powermail-errors-list li {margin-left:33%; padding-left:0;}

.check-dataprivacy-message {display:none; color:red; margin-top:0;}
.invalid .check-dataprivacy-message {display:block;}

.powermail_fieldwrap_type_radio, .powermail_fieldwrap_type_check  {padding-bottom:1.33em;}
.powermail_fieldwrap_type_radio > div, .powermail_fieldwrap_type_check > div {margin-left:33.334%;}
.powermail_fieldwrap_type_radio > label, .powermail_fieldwrap_type_check > label {border:none; margin-bottom:0.5em; width:100%}
.radio, .checkbox {padding-bottom:0.27em;}
.radio label input, .checkbox label input {left:0;}
.radio label, .checkbox label {padding-left: 1.33em; border:none; position:relative; cursor:pointer; width:auto;}

@media screen and (max-width: 750px) {
.powermail_fieldwrap_type_radio > div, .powermail_fieldwrap_type_check > div {margin-left:0; width:100%;}
}

input[type=submit][disabled] {opacity:0.5; pointer-events:none;}

@media (max-width: 500px) {
    .powermail_fieldwrap_captcha .flex-center  {
        flex-wrap: wrap;
    }
    .powermail_fieldwrap_captcha img  {
        width: 100%;
    }
}

/* ----- Hauptbereiche ----- */
#header { z-index:100; position:relative; border-bottom:1px solid #ccc; flex: 0 0 auto; background:#fff; width:100%; font-weight: var(--fweight-header);}
#subheader {
    font-weight:  var(--fweight-header);
}
#footer { clear:both; position:relative; flex: 0 0 auto; background:#fff;}
#main {position:relative; flex: 1 0 auto;}
.wrap-main {background:#fff; position:relative;}

.row {
    width:100%;
    clear:both;
    margin:0 auto;
    background: no-repeat 50% top;
    background-size: cover;
}
.row:after, form:after, .layer-container:after, .slider-outer:after {content:''; line-height:0; clear:both; display:table;}
.row-12 {max-width:160rem;}
.row-over {
    margin: 2.67em 0;
    padding: 2.67em 0;
}

.col, .col-1, .col-2, .col-3, .col-4, .col-6, .col-8, .col-9, .col-12, .box {float:left; padding: 0  var(--gap-std); position:relative; list-style:none; margin:0; width:100%; min-height:1px; clear:none;}
.col-1 {width:8.3333%;}
.col-2 {width:16.6667%;}
.col-3 {width:25%;}
.col-4 {width:33.3333%;}
.col-6 {width:50%;}
.col-8 {width:66.6667%}
.col-9 {width:75%;}

.col-9:only-child .row {margin-left:-1em; margin-right:-1em; width:auto;}
body .col-container {padding-left:0; padding-right:0;}
.col-r {float:right;}

.children-half-h-padding > *, .half-h-padding.half-h-padding, .children-half-h-padding {padding-left:0.5em; padding-right:0.5em;}
.half-h-padding-l {padding-left:0.5em;}
.half-h-padding-r {padding-right:0.5em;}
.half-b-margin.half-b-margin.half-b-margin {margin-bottom:1em;}

@media (min-width:1201px) {
    .row-over {width:calc( 100vw - 0px ); margin: 2.67em 0; margin-left:calc(50% - 50vw); padding: 2.67em calc(50vw - 50%);}
    .row-over.children-half-h-padding, .row-over.half-h-padding {padding-left:calc(0.5em + 50vw - 50%); padding-right:calc(0.5em + 50vw - 50%);}
    .row-over.half-h-padding-l {padding-left:calc(0.5em + 50vw - 50%);}
    .row-over.half-h-padding-r {padding-right:calc(0.5em + 50vw - 50%);}
}
.col-3 .row-over, .col-4 .row-over, .col-6 .row-over, .col-8 .row-over, .col-9 .row-over {margin: 0; padding-left:0; padding-right:0; width:100%;}

/*Text soll nicht über ganze Breite laufen, sondern */
.row > .col.text-only, .row > .col.csc-textpic.csc-textpic-above, .col-8.col-center {width:66.6667%; margin:0 16.6667%;}

.col-headline {padding-top:2.67em; padding-bottom:2.67em; text-align:center;}
.col-center.col-8 .col-headline, .col-center.col-8 .col .col-headline  {width:150%; margin-left:-25%;}

.flex-grid > *[class*="box-"]:not([class*="col"]) {width:100%;}


.box {background:rgba(0,0,0,0.06); margin-bottom:1.33em; padding:1em 1.33em 0.67em; }
.box-shadow {background:#fff; box-shadow: 0 0 0.5em rgba(0, 0, 0, 0.35);}
.box-underline {background:0; border-bottom:1px solid; padding:0 0.67em; margin:0;}
.box-link {
    --color-link: var(--color-txt);
    --color-link-hover: var(--color-link);
}
a.box-link, .box-link a {text-decoration:none; float:left; width:calc(100% + 2em); padding:1em 1em 0.67em; margin:-1em -1em -0.67em;}
.overlay a {padding-bottom:1em; margin-bottom:-1em;}
.box-underline > a {margin:0 -10px; padding:0.33em 1.33em 0 0; transition: 0.3s;}
/* TODO .box-Farben/Background fixen */
.box-underline > a:hover {background:rgb(0,0,0,0.1); padding-left: 0.67em; padding-right:0.67em;}

.flex-grid .box-bordered:not(.not-flex), .flex-grid  .box-no-edges:not(.not-flex) {display:flex;}
.box-bordered > a, .box-bordered > .inner-wrap, .box-no-edges > * , .box-with-bg > *, .box-with-bg > a { width:100%; padding:0.5em; margin:0; display:flex; flex-direction:column;}
.box-bordered > a, .box-bordered > .inner-wrap {border:1px solid #999;}
.box-with-bg > *, .box-with-bg > a  {padding:0.5em 1em;}
.box-bordered .no-btn.no-btn {margin:1em 0 0;}
.box-bordered img, .box-bordered .main-media, .box-with-bg img {margin-top:-0.5em; margin-left:-0.5em; margin-right:-0.5em; width:calc(100% + 1em); max-width:none; object-fit:cover;}
.box-bordered a {transition:0.3s;}
.box-bordered > a:hover {
    background-color: var(--color-adapt-main--white-if-bg-main);
    color: var(--color-adapt-contrast--dark-if-bg-main);
    --color-adapt-main: var(--color-adapt-contrast--dark-if-bg-main);
    --color-btn-hover: var(--color-adapt-contrast--dark-if-bg-main);
}

.box-fullimg {overflow:hidden; display:flex;}
.box-fullimg a {padding:0; margin:0; position:relative; width:100%;}
.box-fullimg.box-fullimg img {width:100%; margin:0; display:block; min-height:100%; object-fit:cover;}
.overlay {position:absolute; padding:1em; bottom:-1px; left:0; right:0;}

.box-colums {
    background:0;
    margin-bottom:0;
    --color-link-hover: var(--color-main);
}
.box-colums > a {border-bottom:1px solid; margin-left:0; margin-right:0; padding-left:0; padding-right:0;}

.box-news-person .wrap-txt a {text-decoration: underline; text-decoration-color: rgba(57,57,57,0.5);}

/*
Hintergründe
==================================================
- oft mit .row-over
*/
[class^="bg-"], [class*=" bg-"] {
    color: var(--color-txt);
    background-color: var(--color-equals-bg);
}

.bg-yellow, .bg-world, .bg-colored {
    --color-adapt-main: var(--color-txt);
    --color-adapt-main-dark: var(--color-txt);
}
.bg-dark:not(.bg-colored), .bg-lila, .bg-green, .bg-darkblue, .bg-red {
    --color-txt: #fff;
    --color-txt-rgb: 255,255,255;
    --color-adapt-black: var(--color-txt);
}
[class^="bg-"], [class*=" bg-"] {
    --bgcolor-btn-hover: rgba(0, 0, 0, 0.1);
}

.bg-world {
    --color-equals-bg: var(--color-world);
    --color-txt: var(--color-txt-on-bg-world);
}

.bg-dark:not(.bg-colored) {
    --color-equals-bg: var(--color-dark);
    --color-adapt-main-dark: var(--color-main-light);
    --color-btn-hover: var(--color-link-hover);
}

.bg-light {
    --color-equals-bg: #fff;
    --bgcolor-btn-hover: var(--color-main);
}
.bg-lightgrey {
    --color-equals-bg: var(--color-lightgrey);
    --bgcolor-btn-hover: var(--color-main);
}

.bg-yellow {
    --color-equals-bg: var(--color-main);
    --color-adapt-main--white-if-bg-main: #fff;
    --color-adapt-main--contrast-if-bg-main: var(--color-contrast);
    --color-adapt-contrast--main-if-bg-main: var(--color-main);
    --color-adapt-contrast--dark-if-bg-main: var(--color-dark);
}
.bg-rose {
    --color-equals-bg: var(--color-rose);
}
.bg-blue {
    --color-equals-bg: var(--color-blue);
}
.bg-lila {
    --color-equals-bg: var(--color-lila);
}
.bg-green {
    --color-equals-bg: var(--color-green);
}
.bg-darkblue {
    --color-equals-bg: var(--color-darkblue);
}
.bg-beige {
    --color-equals-bg: var(--color-beige);
}
.bg-red {
    --color-equals-bg: var(--color-red);
}

.color-light.color-light {
    --color-txt: #fff;
    color: var(--color-txt);
}

.color-lightblue {
    color: var(--color-lightblue);
}

.flex-grid {display:flex; flex-flow:row wrap; justify-content:space-between;}
.flex-grid > * {flex: 0 1 auto;}
.flex-row { display:flex; flex-flow:row wrap !important; }
.flex-column {display:flex; flex-direction:column;}
.flex-grow, .grow-2ndlast > a > *:nth-last-child(2), .grow-all > * {flex-grow:1;}
.flex-center {display:flex; justify-content: center; align-items: center;}
.flex-center-v {display:flex; justify-content: center; }
.flex-direction-col {flex-flow:column nowrap;}
.flex-flexible { width: 1px; flex-grow: 1; }
.gap-std {gap: var(--gap-std);}
.gap-h-std {column-gap: var(--gap-std);}
.gap-v-std {row-gap: var(--gap-std);}

/* Genauer untersuchen: nur Chrome 54 Problem? */
fieldset.flex-grid {display:block;}
.half-height {height:50%;}
.keep-height {flex-grow:0; flex-shrink:0;}
.adapt-height {flex-grow:1; flex-shrink:1;}
.adapt-height  > iframe {height:50px; min-height:100%; margin:0;}


.row-over {margin-bottom:2.67em; margin-top:2.67em; float:left;}


#main { padding-bottom:2.67em;}
.row-over + .row-over, .col-headline + .row-over {margin-top:-2.67em;}
.row-over + .col-headline, .col-headline + .col-headline, .row-over .col-headline:first-child,
.col-headline + div > .col-headline:first-child,
.col-headline + div > div:not(.col-3):not(.col-4):not(.col-6):not(.col-8):first-child > .col-headline:first-child,
.col-headline + div > div:first-child > :first-child > .col-headline:first-child {padding-top:0;}
.col-headline + .row-over, #stage + #main > .row-over:first-child, #stage + #main > div > .row-over:first-child,
#stage + * #main > .row-over:first-child, #stage + * #main > div > .row-over:first-child {margin-top:0;}
.row-over > *:first-child, .row-over > .col-center > *:first-child {padding-top:0;}
.row-over > *:last-child {margin-bottom:0; padding-bottom:0;}
#main > .row-over:last-child {margin-bottom:-2.67em;}

.news-latest-item img, .news-latest-item .main-media, .img-main {display:block; margin-bottom:0.67em;}
.csc-textpic-imagewrap img, .csc-textpic-imagewrap a {display:block;}
.wrap-img {padding-bottom:2em; text-align:center;}
.wrap-img p, .slider-outer.dont-slide .wrap-img p  {margin: 0.33em 0 0;}
.slider-outer .wrap-img, #stage .wrap-img  {padding-bottom:0;}
.slider-outer .wrap-img p {margin:0.33em; }
.csc-textpic-above .wrap-img img, .slider-col-3 img {margin:0 auto;}
/*
==================================================
Vorbereitete Klassen
==================================================
*/


/*
==================================================
Icons (per http://fontello.com/)
==================================================
 zum Anpassen des fonts:
 - auf fontello die config.json im fonts/fontello-Ordner per Drag&Drop ins Browserfenster hochladen
 - Anpassungen vornehmen (lassen) und neu runterladen (nicht die Zeichenzuordungen ändern!)
 - zip, Schriften und config im fonts/fontello-Order ersetzen
 - ggf. noch hier bei den font-src-Pfaden den Zahlenstring erneuern, damit keine Cache-Datei verwendet wird
 - Neue .icon-x Definitionen unten ergänzen (aus css/etagen-iconfont-codes.css im fontello.zip)
*/
@font-face {
  font-family: 'etagen-iconfont';
  src: url('../../../templates/public/fonts/fontello/fontello.eot?9917445a');
  src: url('../../../templates/public/fonts/fontello/fontello.eot?9917445a#iefix') format('embedded-opentype'),
       url('../../../templates/public/fonts/fontello/fontello.woff2?9917445a') format('woff2'),
       url('../../../templates/public/fonts/fontello/fontello.woff?9917445a') format('woff'),
       url('../../../templates/public/fonts/fontello/fontello.ttf?9917445a') format('truetype'),
       url('../../../templates/public/fonts/fontello/fontello.svg?9917445a#fontello') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"]:before, [class*=" icon-"]:before, .font-icon {
  font-family: "etagen-iconfont";
  font-size:125%;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  speak: never;

  display: inline-block;
  text-align: center;
  width: 1em;
  line-height: 1em;
  margin: 0 .2em;
  vertical-align:middle;

  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-arrow_down:before { content: '\e800'; } /* '' */
.icon-arrow_left:before { content: '\e801'; } /* '' */
.icon-arrow_right:before { content: '\e802'; } /* '' */
.icon-arrow_up:before { content: '\e803'; } /* '' */
.icon-bibel:before { content: '\e804'; } /* '' */
.icon-email:before { content: '\e805'; } /* '' */
.icon-fb:before { content: '\e806'; } /* '' */
.icon-instagram:before { content: '\e807'; } /* '' */
.icon-menu:before { content: '\e808'; } /* '' */
.icon-phone:before { content: '\e809'; } /* '' */
.icon-pause:before { content: '\e80a'; } /* '' */
.icon-play:before { content: '\e80b'; } /* '' */
.icon-cancel:before { content: '\e80c'; } /* '' */
.icon-sound_1:before { content: '\e80d'; } /* '' */
.icon-sound:before { content: '\e80e'; } /* '' */
.icon-stellen:before { content: '\e80f'; } /* '' */
.icon-notice:before { content: '\e810'; } /* '' */
.icon-twitter:before { content: '\e811'; } /* '' */
.icon-calendar:before { content: '\e812'; } /* '' */
.icon-trauer:before { content: '\e813'; } /* '' */
.icon-suche:before { content: '\e814'; } /* '' */
.icon-location:before { content: '\e815'; } /* '' */
.icon-note-beamed:before { content: '\e816'; } /* '' */
.icon-itunes-icon_2:before { content: '\e81a'; } /* '' */
.icon-gplus:before { content: '\f0d5'; } /* '' */
.icon-youtube-play:before { content: '\f16a'; } /* '' */
.icon-fax:before { content: '\f1ac'; } /* '' */
.icon-spotify:before { content: '\f1bc'; } /* '' */


/*
====================================================================================================
SVG-Icons
====================================================================================================
SVG-Code wird direkt ins HTML geschrieben. Siehe templates/private/_ts_setup/00_svg_icons.typoscript
*/
.svg-icon {
    display: inline-block;
    width: var(--height-icon);
    height: var(--height-icon);
    vertical-align: text-bottom;
    color: var(--color-icon);
    flex-shrink: 0;
}

:is(p, h1, h2, h3, h4, h5, h6) > .svg-icon {
    width: auto;
}


/* ----- Buttons ----- */
/*
Allgemeine Klassen für Links, submits und spans, die wie Buttons aussehen sollen.
Einfach .btns an einen wrap vergeben, der mehrere Links enthält (z.B. pagebrowser),
oder .btn auf einen einzelnen Link, submit oder anderes Element.

.inact: Button ist inaktiv und kann nicht gedrückt werden (z.B. "Seite zurück" auf erster Seite im pagebrowser); alternativ einfach <span> statt <a>
.cur: Button ist momentan gedrückt (z.B. aktuelle Seite im pagebrowser)
*/
button:not(.act, .cur, .current, .inact, [disabled]) {
    cursor: pointer;
}
.btns { clear:both; }
.btns li {float:left; padding:0; margin:0; list-style:none;}
.btns a, .btn, .btns span, input[type="submit"], .btn.btn-pseudo, .f3-widget-paginator a, .f3-widget-paginator .current {cursor:pointer; float:left; text-align: center; border:var(--border-btn-width) solid; text-decoration:none;  padding:0.8em 1.5em;  margin:0 0.67em 0.67em 0; box-shadow: none; transition: 0.2s ease-out; text-transform:var(--txttransform-btn); font-weight:600; font-size: var(--fsize-btn); line-height:inherit; color:var(--color-btn); background-color:var(--bgcolor-btn); border-radius: var(--bradius-btn);}
.pagebrowser a, .pagebrowser span {margin-right:1px;}
body .btn-right {float:right; margin-left:0.67em; margin-right:0;}
input.btn, input[type="submit"], button[type="submit"] { width:33.3333%; padding: 0.2em 0; margin: 0.67em 0 0 33.3333%; clear: both; background:0;}
.form-small input.btn {width:auto; margin-left:0; padding:0.2em 1em;}

.btns a:hover, .btn:not([class *="bg-"]):hover, input[type="submit"]:hover, a:hover .btn, .f3-widget-paginator a:hover {
    background-color: var(--bgcolor-btn-hover);
    color: var(--color-btn-hover);
}
.btns a.inact, .btns .inact a, .btns span, .btns.inact a { cursor:default; color:var(--color-btn-inact); border-color:var(--color-adapt-main); }
.btns a.cur, .btns a.current, .btns span.cur, .btns .cur a, .btns .cur span, .btns a.act, .f3-widget-paginator .current { cursor:default; background-color:rgba(255,255,255,0.1); }

.btn[class^="bg-"], .btn[class*=" bg-"]{
    --bgcolor-btn: var(--color-equals-bg);
}

.btn.symbol, .search-bar .symbol {width:1.67em; margin:0; clear:none; height:1.67em; padding: 0 0.25em; font-size:1.6em; line-height:1.67em;}

.no-btn.no-btn.no-btn {border:0; padding:0; background: 0; float:none; }

input[type="submit"] {
    color: var(--color-txt);
}

.btn.btn-filled.btn-filled.btn-filled { border:0; position:relative; }
.btn-filled:after {content:''; top:0; bottom:0; left:0; right:0; position:absolute; pointer-events:none;}
.btn-filled:hover:after {background:rgba(255,255,255,0.1);}

/* TODO: Remove next line after switch to sf_event_mgt */
.box-txt-teaser .date:first-child {display:none;}
.box-txt-teaser h4 + h5 {margin: -0.5rem 0 1rem; font-weight: normal;}
.box-shadow .btn-pseudo {margin: 0 0 0.67em;}
.box-footer { margin-top: auto; margin-bottom:calc(-0.5em - 1px); display:flex; justify-content:flex-end; align-items:flex-end;}
.col-3 .box-footer, .col-4 .box-footer {flex-wrap:wrap;}
.box-footer .btn {margin:0 calc(-1rem - 1px) 0 1em; flex-shrink:0;}
.box-footer .details {flex-grow:1; padding-top: 0.5em; max-width:100%;}
.box-footer .details > * {margin-right:1em;  padding-bottom:  0.5em; padding-left:2em; display:inline-block; position:relative; }
.box-footer .details [class*=icon-] {position:absolute; left:0; top:0;}
.inner-std-padding .box-footer, .inner-std-padding .col-flex-aside { margin-bottom:calc(-1em - 1px);}
.inner-std-padding .box-footer .btn {margin:0 calc(-2rem - 1px) 0 1em;}
.inner-std-padding .col-flex-aside {margin-right:calc(-1em - 1px);}

.btn-arrow:after, .col-headline a h2:after {content:"_";}

.btn-to-top {text-decoration:none;}

.news-single-item p > .btn, .csc-textpic p > .btn {float:none; display:inline-block; margin-bottom:0;}
/*
==================================================
Menüs
==================================================
li.act = ist in Rootline (= aktueller Bereich)
li.cur = ist genau aktuelle Seite
*/
.menu, .menu ul, #footer .csc-menu {margin:0; float:left;}
.menu li, #footer .csc-menu li { float:left; margin:0; padding:0; list-style:none; }
.menu a, #footer .csc-menu a { display:block; text-decoration:none; }
.cur > a {cursor:default;}

.menu-selected li {padding:0.5em 0.87em;}

.menu-0 {float:right; height:100%; min-width:7.4rem;}
.menu-0 li {position:relative;}
.menu-0 a {padding:0.1rem 1.6rem;}
html:not(.responsive-on) .menu-0 li:hover > a, html:not(.responsive-on) .menu-0 li .act > a {
    color: var(--color-txt-on-bg-world);
}

.menu-0 li li {width:100%;}

/******************************************
Neues Menü
******************************************/
@media (min-width: 501px) {
    .js:not(.menu-ready) .menu-0  {position:absolute; visibility:hidden;}
}
@media (min-width: 1300px) {
    html:not(.menu-ready) :is(.site-erzbistum, .site-intranet) .menu-0 {position:initial; visibility:visible;}
}
@media (max-width: 500px) {
    html:not(.menu-ready) .menu-0 .menu-layer {position:absolute!important; visibility:hidden;}
    .search-header {float: left !important;}
}
.responsive-on .menu-0 * {transition: 0.5s;}
.responsive-on .menu-0 .btn {transition-property:background-color;}
.responsive-on .menu-0:after {content:''; position:fixed; top:0; left:0; width:100%; background:rgba(0,0,0,0.8);  opacity:0; transition:opacity 0.5s;}
.menu-0.is-open:after {display:block; opacity:1; z-index:10;}

.responsive-on .menu-0.menu-0:not(.is-open) .menu-layer {left:0; transform:scaleX(0);}
.responsive-on .menu-0 *:not(.is-open) > .menu-layer {transform:scaleX(0); }
.responsive-on .menu-0 *:not(.is-open):not([class*=changing--]) > .menu-layer a {display:none;}
.responsive-on .menu-0 ul { overflow-y:auto; overflow-x:hidden; padding-left:0.5em; height:100%; position:absolute; top:0; right:0; transition-property:width;}
.responsive-on .menu-0 ul { background:#fff;}
.menu-0 .menu-layer { left:0; z-index:100; top:0; overflow:hidden; transition-property:width, left, height, transform; transform-origin:0 0;}
.menu-0.is-open:after { height: 100vh;}
.responsive-on .menu-0 .menu-layer {top:5rem; bottom:0; position:fixed; width:33.4vw;}
.responsive-on .menu-0 a {padding:1.1rem 1.6rem;}
.menu-0 ul {width:33.4vw;}
.menu-0 .is-open > .menu-layer  {z-index:200;}
.responsive-on .menu-0 .act > a {font-weight:600; text-decoration:underline; text-shadow: 0 0 1em rgba(255,255,255,0.5); }

.menu-0 .level-1, .menu-0 .level-2 {left:33.4vw;}
.menu-0.lvl-2 .level-2, .responsive-on .lvl-1 > * > * li.is-open .level-2  {left:66.8vw;}

.menu-0 li {float:none; padding:0; border:0 solid rgba(255,255,255,0.2); border-bottom-width:1px; position:static; display:flex;}
.menu-0 li a {color:inherit; min-height:3rem; width:50%; flex-shrink:1; flex-grow:1;}
.menu-0 ul a:hover {background:rgba(255,255,255,0.2);}
.menu-0 ul a.is-active {background:rgba(255,255,255,0.1);}

.menu-0 li .btn {height:auto; background:transparent; margin:0; padding:0; width:3em; color:inherit; border:0;}
.menu-0 li .btn  i {margin:0; text-align:center;}
.menu-0 *:not(.is-open) > .btn i+i, .menu-0 .is-open > .btn i:first-child,
.menu-0:not(.is-open) .menu-toggle  .fa-times, .menu-0.is-open .menu-toggle  .fa-bars {display:none;}

.mainmenu-open .responsive-menu-btn {position:fixed; color:#fff; top:0; right:1rem; z-index:99999; height:4.4rem !important;}
.menu-0.is-open .icn-open, .menu-0:not(.is-open) .icn-close {display:none;}
.menu-0 .icn-open {font-size:1.2em;}

.responsive-on .level-0 > ul > .redirect-link:not(.is-open) > a:hover,
.responsive-on .level-1 .redirect-link > a:hover {background:none !important; color:inherit !important;}


/* Fix für Safari (Untermenü sonst unsichtbar) */
.menu-0.is-open.lvl-1 .level-0, .menu-0.is-open.lvl-2 .level-0, .menu-0.lvl-2 .is-open:not([class*=changing--]) >.level-1 {overflow:visible !important;}
@media (min-width: 701px) {
.responsive-on #header .menu-0 .level-0 .menu-layer {left:100%; width:100%; top:0;}
.responsive-on .menu-0 .menu-layer {transform:scaleX(1); overflow:visible;}
}

@media (max-width: 700px) {
.responsive-on .menu-0 .menu-layer.menu-layer, .menu-0 ul { width:100vw; }
.menu-0 ul { min-width:200px; width:100vw; }
.responsive-on .menu-0 .level-1.level-1 {left:100vw;}
.responsive-on .menu-0 .level-2.level-2, .menu-0.lvl-2 .level-2, .responsive-on .lvl-1 > * > * li.is-open .level-2 {left:100vw;}
.responsive-on .menu-0.lvl-1 .is-open > .level-1, .responsive-on .menu-0.lvl-2 .is-open > .level-2 {left:0;}
.responsive-on .menu-0.lvl-1  > .menu-layer, .menu-0.lvl-2  > .menu-layer, .responsive-on .menu-0.lvl-2 .is-open > .level-1 {width:0; left:0;}

.responsive-on .menu-0.menu-0.menu-0 .level-1 > ul > li {background:inherit;}
.lvl-1 .level-0 > * > .is-open, .lvl-2 .level-1 > * > .is-open {position:fixed; top:1px; left:0; width:50%; min-width:250px; transition:none;}
}



/******************************************
Neues Menü - Ende
******************************************/
html:not(.responsive-on):not(.fixed-header) .menu-0 .level-0 > ul > li > a  {line-height:6rem;}
html:not(.responsive-on) .menu-0 .level-0 > ul > li > a  {font-size:2.25rem; padding:0.7rem 1.3rem; transition-property:color;}
html:not(.responsive-on) .menu-0 .level-0 > ul > li {border:0; float:left; position:relative;}
html:not(.responsive-on) .menu-0 .level-0 {width:auto !important; position:relative; height:auto; float:right; overflow:visible;}
html:not(.responsive-on) .menu-0 ul {position:static; height:100%; width:100%; overflow-x:visible;}
html:not(.responsive-on) .menu-0 .level-0 > ul {width:auto; height:auto;}
html:not(.responsive-on) .menu-0 .btn, html:not(.responsive-on) .menu-0 .level-2 {display:none;}
html:not(.responsive-on) .menu-0 .level-1 {position:absolute; left:0; top:100%; height:0; max-height:0; overflow:auto; box-shadow: 0 0 10px rgba(0,0,0,0.2); opacity:0;}
html:not(.responsive-on) .menu-0 li:hover .level-1, html:not(.responsive-on) .menu-0 li.is-open .level-1 {height:auto; max-height:calc(100vh - 5rem); opacity:1;}
html:not(.responsive-on) .menu-0 .level-1 ul {background:#fff;  padding:1rem 0;}
html:not(.responsive-on) .menu-0 .level-1 a {white-space:nowrap; min-width:28rem; max-width:50rem; overflow:hidden; text-overflow:ellipsis;}
html:not(.responsive-on) .menu-0 li:nth-last-child(2) .level-1, html:not(.responsive-on) .menu-0 li:last-child .level-1 {left:auto; right:0;}

.mainmenu-open.responsive-on, .mainmenu-open.responsive-on body {overflow:hidden;}


.js.responsive-on .menu-0:not([class*=changing--]):not(.is-open) div * {visibility:hidden; transition:0s;}
.responsive-on .menu-1 {display:none;}

.rearrange-header .wrap-menu-search {margin-top:0; width:100%;}
.rearrange-header .menu-0 {float:left; margin-left:-1.5rem;}
.rearrange-header .search-header {position:absolute; right:0; bottom:100%;}

.breadcrumbs {
    --arrow-indent: .5em;
    --back-indent: var(--arrow-indent);
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 1.33em;
    padding-bottom: 1.2em;
    z-index: 20;
    position: relative;
    color: var(--color-world);
}
.breadcrumbs li {
    position: relative;
    margin-left: calc(1px - var(--arrow-indent));
    margin-bottom: 0.15em;
}
.breadcrumbs li:first-child {
    --back-indent: 0;
    margin: 0;
}
.breadcrumbs li:not(.cur) :is(a:hover, a:focus, a:active) {
    background-color: color-mix(in srgb, var(--color-main), #000 10%);
}
.breadcrumbs a {
    transition: .3s;
    line-height: 36px;
    padding-inline: 1em 1.2em;
    background-color: var(--color-main);
    clip-path: polygon(0 0, var(--back-indent) 50%, 0 100%, calc(100% - var(--arrow-indent)) 100%, 100% 50%, calc(100% - var(--arrow-indent)) 0%);
}
.breadcrumbs li:first-child a {
    padding-left: 0.67em;
}

.row .menu-1 { margin-top:0; margin-bottom:0; padding-top:0; padding-bottom:0; border-bottom:1px solid #ccc;}
.menu-1 a {
    color: var(--color-world-on-white);
    padding: 0.5em 0.67em;
}

.menu-selected ul {float:right; max-height:2.4em; overflow:hidden;}
.menu-selected { border-bottom:1px solid #f4f4f4; white-space:nowrap;}
.menu-selected a	{color:var(--color-darkblue);}
@media (max-width:750px) {
 .menu-selected {border:0; height:1.5rem;}
 .menu-selected * {display:none;}
}

#footer .csc-menu li  {width:100%; margin-bottom:0.4em;}

.menu li.img-link {padding:0 0 0 0.87em;}
.menu .img-link img {display:block;}
.menu-selected img {height: 2.4em;width:auto;}


.site-erzbistum #header {position:absolute; }
/*Sticky Header*/
.fixed-header #header {position:fixed; top:0; left:0; background:#fff;}
html.fixed-header .menu-selected {display:none;}
.fixed-header .menu-selected + .row > .col {min-height:0; padding-top:0;}
.fixed-header #header .logo { margin:0;}
.fixed-header #header .logo img {height:4.3rem; width:auto;}
.fixed-header #header .logo img + .logo-text {display:none;}
.fixed-header:not(.responsive-on) .menu-0 {position:relative; box-shadow:-0.27em -0.27em 0.5em #fff; background:#fff;}
.fixed-header .wrap-menu-search {margin-top:0; height:4.4rem;}
.fixed-header:not(.responsive-on) .menu-0 > div > ul > li > a {line-height:3rem;}

.fixed-header #header + *, .site-erzbistum #header + * { padding-top:var(--vsize-header);}

/*Slider*/
.slider-outer {position:relative; overflow:hidden;}
.slider-outer .slider-mask {overflow:hidden; width:100%; }
.layer-container {position:relative; height:auto;}
.layer {position:relative; float:left; width:100%;}
.layer-counter {display:none;}

.slider-controls {float:left; width:100%; --bgcolor-btn: rgba(0,0,0,0.2);--bgcolor-btn-hover: rgba(var(--color-main-rgb), 0.8);}
.slider-controls button {width:2.67em; height:4.67em; position:absolute; top:50%; left:0; margin-top:-2.34em; color:#fff; transition: 0.2s ease-out; transform:translateX(-150%); opacity:0; background-color: var(--bgcolor-btn);}
.slider-controls .btn-forward {transform:translateX(150%);}
.slider-controls .btn-play-pause {transform:translateY(150%);}
.is-slider:hover .slider-controls button, .is-slider .slider-controls button:focus {opacity:1; transform:none; }
.slider-controls .btn-forward {right:0; left:auto;}
.slider-controls .btn-play-pause {left:50%; width:4.67em; margin-left:-2.34em; border-radius:50%;}
.is-stopped .btn-pause, .is-slider:not(.is-stopped) .btn-play { display:none; }
.slider-controls button:hover {background-color: var(--bgcolor-btn-hover);}
.slider-controls .menu li {width:1em; max-width:2.2em; height:3px; background:var(--color-dark); margin:0.5em 0.2em; cursor:pointer; flex: 1 0 1em;}
.slider-controls .menu li:after {width:100%; height:calc(1em + 3px); margin-top:-0.5em; content:''; display:block; }
.slider-controls .menu {margin:0.5em auto; float:none; display:flex; justify-content:center;}
.slider-controls .menu li:hover {background: var(--color-main);}
.slider-controls .menu li.act {background: var(--color-main); cursor:default;}

.js .layer + .layer {display:none;}
.slider-mask .layer + .layer {display:block;}
#main .slider-outer {margin-bottom:2em;}
#main .slider-outer.is-slider:not(.slider-col-3) { box-shadow: 0 0 0.33em rgba(3, 3, 3, 0.3); }
.slider-controls button{font-size:0.7em;}
#stage .slider-controls button{font-size:1em;}

/*
==================================================
Großer Slider
==================================================
*/
#stage .img-main {
    width: 100%;
    margin: 0;
    height: 100%;
    max-height: calc(var(--maxh-topslider) + 50vw);
    object-fit: cover; }
.focus-left {object-position:0 50%;}
.focus-right {object-position:100% 50%;}
.focus-top {object-position:50% 0;}
.focus-bottom {object-position:50% 100%;}
.focus-left.focus-top {object-position:0 0;}
.focus-left.focus-bottom {object-position:0 100%;}
.focus-right.focus-top {object-position:100% 0;}
.focus-right.focus-bottom {object-position:100% 100%;}
#stage .parallax-wrap {position:fixed; bottom:0; top:4.3rem; width:calc(100% + 1px); transition:opacity 0.5s; left:0;}
#stage .is-slider .layer:not(.act) .parallax-wrap, .js .slider-outer:not(.is-slider) .layer + .layer .parallax-wrap {opacity:0; pointer-events:none;}

#page-1 #stage .layer-container {
    margin-left: 0 !important;
}
#page-1 #stage .is-animated {
    transition: 0.6s;
}
#page-1 #stage .layer {
    overflow: visible;
}

#stage .wrap-overlay {position:absolute; bottom:0; left:0; display:flex;}
.wrap-overlay .overlay {margin-bottom:0; position:static;}
@media screen and (min-width: 1450px) {
	#stage .wrap-overlay {margin-left:calc(50% - 80rem); }
}
#stage .overlay p {max-width:50em;}
#stage .layer {
    overflow: hidden;
    height: min(calc(100vh - var(--vsize-header)), var(--maxh-topslider));
}

#stage > .slider-outer .slider-controls ol, .slider-col-3 .slider-controls ol {display:none;}

#stage .layer a[href="javascript: return false"] {cursor:default;}
#stage .layer a[href="javascript: return false"] .btn {display:none;}

.box.flex-grid > a {width:auto; flex-grow:1;}
.box.flex-grid > a  > * {flex: 1 1 auto; }
.box.flex-grid .wrap-side {flex-grow:0; display:flex; }
.box.flex-grid .wrap-side > * {flex: 0 0 auto;}
.box.flex-grid .wrap-side .inner-top {flex-grow:1; }
.box.flex-grid .btn {white-space:nowrap; align-self:flex-end;}

@media screen and (min-width: 801px) {
	.box.flex-grid > a { display:flex;}
	#stage .wrap-overlay {padding:0 1em 3em;}
	.box.flex-grid .wrap-side {flex-direction:column; margin-left:2em;}
}
@media screen and (max-width: 800px) {
	#stage .overlay p {display:none;}
	.box.flex-grid .wrap-side .inner-top {flex-grow:1; order:9; text-align:right;}
}

/* Bild-Slider in Stage */
#stage .csc-image .slider-outer img {min-width:100%;}
#stage .csc-image {padding-left:0; padding-right:0;}
.csc-textpic-imagewrap.slider-outer .layer {overflow:hidden;}

@media screen and (max-width: 600px) {
	#stage .csc-image .slider-outer img {width:auto; min-height:10em; max-width:none;}
}


/*
==================================================
Header, Footer
==================================================
*/
.logo {max-width:26rem; float:left; margin-bottom:1rem; position:relative; }
.logo-anim {perspective:50rem;}
.logo img { max-height:10rem; object-fit: contain; object-position: left bottom;}
.logo img[src$=svg] {width:26rem;}
.logo-anim-item {position:absolute; will-change:transform, opacity; top:0; left:0; animation: none 10s infinite linear both;}
img + img + .logo-anim-item { opacity:0; animation-delay:-5s;}

html:not(.fixed-header) #page-1 .logo-anim img + img {animation-name:logo-switch;}

@keyframes logo-switch {
	0%, 22% {transform:rotateX(0deg); opacity:1;}
	24%, 40% {transform:translateY(-50%) rotateX(90deg); opacity:0;}
	41%, 74% {transform:translateY(50%) rotateX(-90deg); opacity:0;}
	76%, 100% {transform:rotateX(0deg); opacity:1;}
}
@keyframes logo-switch-simpler-on {
	0%, 22% {opacity:1;}
	24%, 74%  {opacity:0;}
	76%, 100% {opacity:1;}
}
@keyframes logo-switch-simpler-off {
	0%, 22% {opacity:0;}
    24%, 74%  {opacity:1;}
	76%, 100% {opacity:0;}
}
@supports (-ms-ime-align:auto) {
	/*Unter Edge funktioniert die normale Anim nicht.*/
		html:not(.fixed-header) #page-1 .logo-anim img + img {animation-name:logo-switch-simpler-on;}
		html:not(.fixed-header) #page-1 .logo-anim img + img + .logo-anim-item {animation-name:logo-switch-simpler-off; animation-delay:0s;}
}

.logo img {display:block;}
h1.logo, .logo h1 {font-size:inherit; text-transform:none; line-height:inherit; margin-bottom:1rem;}
.logo h1 {margin-bottom:0;}
.responsive-menu-hide {float:right;}
.wrap-menu-search button:not(.submenu-open) {display:block; width:7.4rem; height:100%; font-size:2rem; transition:0s;}
@media (min-width: 501px) {
    html:not(.responsive-on) button.responsive-menu-btn {display:none;}
}

.wrap-menu-search {height:7.4rem; position:relative; margin-top:2rem;}
.search-header {float:right; clear:none; width:7.4rem; height:100%; position:relative; font-size:2.25rem;}
.responsive-on .search-header {float:left;}
.search-header form {width:100%; transition:0.5s; opacity:0; position:absolute; bottom:0; right:0; margin:0; height:100%; z-index:9999;}
.search-header input[type="search"] { width:100%; padding: 0.08em 7.4rem 0.08em 2rem; height:100%;}
.search-header .btn  {height:100%; position:absolute; right:0; top:0; width:7.4rem; padding:0; margin:0; font-size:2.5rem; border:0;}
.search-header.is-open form {width:40rem; opacity:1;}

.search-dates input:first-child, .search-dates input[type="search"]{width: 13.33em; padding-top: 0.15em; padding-bottom: 0.15em; height: 2.4em; max-width:72%;}
.search-dates .btn {height: 2.4em;}


.btn-to-content {position:fixed; bottom:0; left:50%; transform:translateX(-50%); z-index:99; margin:0; text-transform:none; font-weight:normal; padding:0.2em 0.5em; border:0; transition:0.5s; font-size:0.8em;}
.btn-to-content.btn-to-content {
    --opacity: var(--opacity-overlay);
    background:rgba(var(--color-main-rgb),var(--opacity));
}
.btn-to-content:hover {
    --opacity: 1;
}
.btn-to-content .main-icon {margin:0; font-size:0.9em;}
.btn-to-content .main-icon:before {width:3em; }
.btn-to-content.reached {transform:translate(-50%, 120%);}
@media (max-width:500px) {
    .btn-to-content {display:none;}
}

.higher-anchor {position:absolute; top:-8rem; pointer-events:none;}

/* Footer: zentrierte statische Logos, wenn zu wenige für einen Slider vorhanden sind */
.footer-logos-static { display: flex; justify-content: center;}
.footer-logos-static > .wrap-img {flex: 0 1 auto;}

/* Footer: Logo-Slider */
#footer .csc-image img { width:auto; height:120px; object-fit:contain; transition: 0.2s ease-out;}
#footer .csc-image *:not(:hover) > img {
    filter: grayscale(100%);
    opacity:0.4;
}
#footer > .csc-image .wrap-img {width:250px; padding:0.33em 25px; position:relative;  text-align:center; float:left; margin:2.67em 0;}
#footer > .csc-image .wrap-img > a {display:block;}
#footer > .csc-image {position:relative; padding:0; min-height:0;}
#footer > .csc-image > .csc-textpic-imagewrap { overflow:hidden; position:relative; }
#footer > .csc-image > .csc-textpic-imagewrap:empty {display:none;}

#footer .slider-controls {top:2.67em;}
#footer .slider-controls a {opacity:0;}
#footer .csc-textpic-imagewrap:hover .slider-controls a {opacity:1;}
#footer .slider-controls .menu {display:none;}

#footer .row-over {margin-top:0; margin-bottom:0; }
#footer > .row > .row:not(.row-over) { padding-bottom:4rem; }
#footer > .footer-line + .row > .row:not(.row-over) { padding-top:4rem; }
.footer-line {height:8px;}


#footer .ce-menu li {list-style:none; margin-left:0; padding-left:0;}
.menu-social {
    margin-bottom:0;
    --height-icon: 3.8rem;
    --color-link: #fff;
    --color-link-hover: var(--color-main-light);
}
.menu-social svg {
    filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.5));
    margin: 0 0.2em;
}
.menu-social span:before {font-size:3.8rem; }
.menu-vertical span:before {text-shadow: 0 0 3px var(--color-dark);}
.menu-social a {padding:1em 0.125em;}
.menu-vertical li {clear:both;}
.menu-vertical {position:sticky; top:10rem; left:0; z-index:9;}
.set-outside-r {position:absolute; top:0; left:100%; margin-left:15px;}

#footer .menu-social {display:flex; width:100%; justify-content:space-between;}
#footer .menu-social {flex-wrap:wrap;}
@media (max-width:1250px) and (min-width:951px) {
	#footer .menu-social li { width:33%;}
}

@media (max-width:1800px) {
	/* Für Mobile-Browser */
	body {overflow-x:hidden;}
}
@media (max-width:1650px) {
    .set-outside-r {display:none;}
}

#footer .wrap-to-top {height:calc(9rem - 2.67em);}
#footer .btn-to-top {position:absolute; bottom:-2.67em; right:0; margin:0; background:var(--color-blue); color:#fff; padding:0;}
#footer .btn-to-top i:before {font-size:3rem; line-height:9rem; width:9rem; display:block; margin:0;}
@media (min-width:1460px) {
	#footer .btn-to-top { margin-right: calc(80rem - 50vw); }
}
@media (max-width:950px) and (min-width:551px) {
	#footer .col-3 {width:50%;}
    #footer .col-3 .col-3, #footer .col-4 .col-3 {width:25%;}
}
@media (max-width: 550px) {
	#footer #c5332 > .col-3:not(:first-child):not(:last-child) {width:auto;}
}


#footer .footer-last-row {
    padding-top:0;
    padding-bottom:0;
    margin-top:-1px;
}
#footer .footer-last-row .flex-grid {
    align-items:center;
}
.footer-last-row .logo {
    width:16rem;
}
#footer .footer-last-row .wrap-to-top {
    float:right; height:auto; margin-right:-2rem;
}
#footer .footer-last-row .btn-to-top {
    float:right; position:relative; bottom:0; background:#fff;
}
#footer .color-world {
    background: #fff;
    color:#FAB000;
}


/*
==================================================
Inhalte .col-content
==================================================
*/

/* felogin */
div.message {margin-bottom:0.67em;}

/* ke_search Ergebnis */
.col-headline + .row .search-content.col-headline {margin-top:-1.33em;}
.kesearch_num_results.col-headline {padding-top:0;}
.results .number {position:absolute; right:0; top:0; font-size:2em; width:20%; padding:0.67em 0 0; line-height:2.67em; text-align:center;}
.results .btn-pseudo {width:20%; margin-top:-1.33em; padding-left:0; padding-right:0;}
.results .inner-left {width:78%; min-height:3.33em;}
.results h3 {width:78%; }
.results .url {text-decoration:underline;}
.results .subheader {margin-top:-0.67em;}
form.col-headline fieldset {display:inline-block; width:auto; float:none;}
form.col-headline input {width:auto;}

.sorting {margin-bottom:1.33em;}
.sorting span {padding-left:0.2em; padding-right:0.67em;}
.sorting span + span:before {content:'/'; padding-right:0.67em;}
.sorting a {position:relative;}
.sorting a:after {content:''; border: solid; border-color: currentColor transparent; border-width:0.4em 0.27em 0; position:absolute; right:-0.73em; top:40%; }
.sorting a[href*='=asc']:after {border-width: 0 0.27em 0.4em;}


.downloads a img {margin-right: 0.33em; vertical-align:bottom;}
.downloads a img[width="50"] {background:#fff;}


/* Telefonliste im Intranet per tt_address*/
.table-telefonliste.daten.daten td {
    text-align: left;
    vertical-align: top;
}
@media (max-width: 800px) {
    .table-telefonliste tbody {
        display:flex;
        flex-wrap: wrap;
        column-gap: 3rem;
    }
    .table-telefonliste :is(tr,th,td) {
        display: block;
        padding: 0;
    }
    .table-telefonliste tr {
        border-bottom: 1px solid var(--color-dark);
        padding: 2rem 0;
        min-width: min(100%, 15em);
        flex: 1 0 0;
    }
    .table-telefonliste.daten :is(th,td) {
        border: 0;
    }
    .table-telefonliste .hidden {
        display: inline;
    }
    .table-telefonliste tr:first-child, .table-telefonliste td:empty {
        display:none;
    }
}
/*hover-Bilder für Telefonliste im Intranet*/
.hover-show-img {position:relative; cursor:default; color: var(--color-link); text-decoration: underline; text-decoration-color: var(--color-underline);}
.hover-show-img img {display:none; position:absolute; left:120%; top:0; max-width:50vw; transform:translateY(-40%); z-index:1;}
.hover-show-img:hover img {display:block;}
tr:nth-child(4) .hover-show-img img,
tr:nth-child(5) .hover-show-img img,
tr:nth-child(6) .hover-show-img img {transform:translateY(0);}
tr:last-child .hover-show-img img,
tr:nth-last-child(2) .hover-show-img img,
tr:nth-last-child(3) .hover-show-img img,
tr:nth-last-child(4) .hover-show-img img,
tr:nth-last-child(5) .hover-show-img img,
tr:nth-last-child(6) .hover-show-img img  {transform:translateY(-100%);}


/* KNA-Ticker (ehemals: DomRadio News-Widget) */
#kna-newsticker { margin-bottom:1em; }
#kna-outer-frame { border:1px solid #999; min-height:100%; height:auto !important;}
.kna-header a {display:block; padding:0.5em 0.5em 0.4em; border-bottom:1px solid #fab000}
.kna-header img {display:block;}
#kna-ticker-content {height:5em; overflow:hidden;margin:1.33em 0.67em 0; float:none; width:auto;}
#kna-newsticker strong {font-size:1em;}
@media screen and (min-width: 1100px) {
    #kna-newsticker > * { font-size:1.3em;}
}
@media screen and (max-width: 850px) {
	#kna-newsticker .ratio-news-teaser {padding:0 !important; }
	#kna-outer-frame {position:relative;}
}


/*Fasten-Impulse*/
.fastenimpuls + .page-navigation {margin-top:2em; padding-left:0;}
.fastenimpuls h3:first-child {margin-bottom:0;}
.fastenimpuls {margin-bottom:1.33em; overflow:hidden; /* damit floatende Buttons nicht in den nächsten Impuls ragen */}

.tx-cal-controller > p:first-child:last-child, .tx-cal-controller > div > .js-copy-content + p:last-child {display:none;}

#zeitraum-wahl select {width:100%;}


/*Todesanzeigen*/
.box-rip > div {border:0.33em solid black; padding:0.67em 1em;}
.box-rip :is(h2, h3, h4, h5, a) {color:var(--color-adapt-black);}


/*news*/
.news-menu-view .year {font-size:1.2em;}
.menu-newsarchive { float:none; margin-top:1rem;}
.menu-newsarchive li {width:100%; margin-bottom:0.15em; }
.menu-newsarchive a {width:100%; text-align:left; margin:0;}
.menu-newsarchive a b {float:right; padding:0.8em 0; margin:-0.8em -1.5em; min-width:3em; text-align:center;}

.date {margin-bottom:0.33em;}
.news h4 span, .news h3 span { display:block; color:var(--color-dark); font-size:2rem; padding-top:0.67em; margin-bottom:-0.67em;}
.news h4 span {display:none;}
.news-single-item h3 span {line-height: 1.2em; font-size: 3.2rem; padding:0; margin:0; font-weight:inherit;}
.news-job .sup-headline {margin-bottom: 0.5em;}
.news-job .sub-headline {margin-top: 0.5em;}
.bg-dark .news h3 span {color:#fff; }
.teaser-news h4 span:before {content:' / ';}

.showResultsWrap {margin-bottom:0.67em;}
.news-single-image {float:right; margin-left:2em; margin-bottom:2em;}
.author br {display:none;}
.news-single-item .meta {margin-bottom:1.33em;}
.meta span + span {margin-left:0.67em}
.meta span + span:before {content:'|'; margin-right:0.67em;}

.social-networks {padding:1.6em 0 1em;}
.social-networks a {margin-right:0.67em;}

.menu-categories .btn {width:100%;}
.menu-categories .btn.act {background-color: rgba(0,0,0,0.1); cursor:pointer;}

/* Kleine News-Teaser auf Startseite: Mobil nur ersten anzeigen */
@media (max-width: 550px) {
    #page-1 .teaser-sm-txtonly:not(:first-child) {
        display:none;
    }
}

/*in Woelki-Box auf Startseite*/
.news-latest-item.box-underline h4 span {display:none;}

.place-p-btn { justify-content: flex-end; }
.place-p-btn p { flex: 1 1 26em; }
.place-p-btn .btn {flex:0 0 auto; align-self:flex-end; margin-left:1em;}

.overlay.save-space { padding:0.5em 1em;}
.overlay.save-space p + h3 {margin-top:-0.3em; margin-bottom:1rem;}

/* Social Stream */
.social-stream .social-icon {
    color: #fff;
    text-shadow: 0 0 3px var(--color-dark);
    top: 1rem;
    right: 0.8rem;
    left: auto;
}
/* Search bar */
.search-bar {position:relative;}
.search-bar .symbol {color: var(--color-search); position:absolute; right:0; top:0; cursor:pointer;}
.search-bar .btn {position:relative; border:0;}
.search-bar span.symbol { pointer-events:none; cursor:default;}

/* Eventmanager */
.venue-search-form  input, .venue-search-form  select {width:100%;}
.venue-search-form  input[type=submit] {width:33%; float:right; margin-left:0;}

/* Unliebsame Kategorien ausblenden -> Besser per pid! (Ext anpassen) */
#page-223 .select-event-cat option {display:none;}
#page-223 .select-event-cat option[value="0"],
#opt-cat-118,
#opt-cat-92,
#opt-cat-93,
#opt-cat-80,
#opt-cat-75,
#opt-cat-78,
#opt-cat-79,
#opt-cat-74,
#opt-cat-76,
#opt-cat-73,
#opt-cat-77 {display:block !important;}

.documentcentersearchbox {padding-bottom:2em; font-size: 1.35em;}
#fetchsubcategories-form > div:first-child {padding:0;}

.event-poster .event-termin {
    font-size: 125%
}

dd {padding-bottom:0.5em;}
.col-4.event-poster {padding-top:0.67em;}
.col-4.event-poster dd a {word-wrap:break-word;}

.main-icon {margin-bottom:1em; font-size:1.3em;}
.main-icon.icon-big {font-size:4em; margin-bottom:0.6em;}

.txt-big div p {font-size:1.5em;}
.txt-big h3 {font-size: var(--fsize-h2);}
.txt-big h4 {font-size: var(--fsize-big-h4);}

.calendar-sheet a, .calendar-sheet .inner-wrap  {padding-top:1.5em; padding-bottom:1em; position:relative;}
.calendar-sheet a:hover h4 {text-decoration:underline;}
.calendar-sheet a:before, .calendar-sheet .inner-wrap:before {position:absolute; color:#fff; top:-1px; left:-1px; right:-1px; content:''; height:28px; background: radial-gradient(currentColor 4px, #999, transparent 6px) repeat-x 50% -12px; background-size:28px 28px;}
.calendar-sheet a > *:not(:last-child), .calendar-sheet .inner-wrap > *:not(:last-child) {margin-bottom:1em;}
@media (min-width: 551px) {
    .calendar-sheet a > *:not(:last-child), .calendar-sheet .inner-wrap > *:not(:last-child) {min-height:2.7em;}
}

.bg-lightgrey .calendar-sheet a:before, .bg-lightgrey .calendar-sheet .inner-wrap:before {color:rgb(238, 238, 238);}

/* Unterbrechung Teaser [11160] */
.flex-grid > .col.box-link > a:hover {
    background:linear-gradient(to right, rgba(var(--color-txt-rgb),0), rgba(var(--color-txt-rgb),0.15), rgba(var(--color-txt-rgb),0));
}

.col-event-list-img .box-fullimg {
   flex-direction: column;
}
@media (min-width:551px) and (max-width:850px) {
    .col-4.col-event-list-img {
        max-width: 50%;
    }
}

/* Neuer Events-Teaser */
.event-teaser-dateleft > * {
    align-items: flex-start;
}
.event-teaser-dateleft .wrap-date {
    width: 6rem;
    text-align: center;
    border-right: 3px solid;
}
.event-teaser-dateleft .wrap-txt {
   flex: 1 0 1px;
}


/* Dokumentencenter */
.col-flex-aside .btn {margin:0; }
@media screen and (min-width: 500px) {
	.flex-container-cols.flex-container-cols {display:flex; flex-direction:row;}
	.col-flex-content {width:100%; flex:0 1 100%;}
	.col-flex-content p:last-child {margin:0;}
	.col-flex-aside {flex-shrink:0; display:flex; align-items:flex-end;}
}
.f3-widget-paginator li { float: left; padding: 0; margin: 0; list-style: none;}
.f3-widget-paginator a, .f3-widget-paginator .current {margin-right:1px;}

.tx-documentcenter .subcategoryDiv form div {padding:0;}
.tx-documentcenter .tx-felogin-pi1 > .col {margin-top:1em;}
.tx-documentcenter * + .row > .col > .tx-felogin-pi1 > .col {margin-top:2.67em;}
.tx-documentcenter .venue-search-form h4 {font-size:1.33em;}
.tx-documentcenter .powermail_legend {font-size:1.6em;}
.tx-documentcenter .icn {display:inline-block; transform:rotate(-45deg);}


/*Bild Erzbischof in Spezialbereich auf Startseite*/
#page-1 .row-over.bg-dark .row >.col-4:first-child .wrap-img {margin-bottom:-2.67em; display:block; padding-bottom:0;}


/*tt_address / wt_directory*/
#map {height:26.67em;}
#map.map-vertical {height:55.33em;}
.wtdirectory-list {border-top:2px solid #fab000; margin-bottom:2em;}
.wtdirectory-list a {display:flex; flex-wrap:wrap; width: 100%;}
.list-hidden {display:none;}
.wrap-addresslist-headlines {font-weight: bold; margin-bottom: 1em; }

#wt_directory-catfilter select option[value="19"] {display:none;}

.tx-wtdirectory-pi1 .row-blank h1 { margin-bottom: .7em; }

/*History-Modul*/
.box-history {--filter-headline: grayscale(1); overflow:hidden; color: var(--color-history-inact);}
.box-history > .col { margin-bottom: 4em; padding-left:0 ;padding-right: 2.67em; cursor:pointer;}

.history-img {left: 0.87em; width:7.53em; position:absolute; top:0;}
.history-img .wrap-img {padding:0;}
.history-img img {border-radius:50%; border:4px solid; width:100%;}
.history-img .wrap-img p {text-align:center;}
.history-text {width:100%; max-width:70em; position:relative; padding-left: 13.33em;}
.history-text .csc-textpic-text { padding:1.33em; outline:1px solid transparent; color: inherit; border-left: 4px solid;}

.history-text h3 {color: var(--color-main-big-on-white); filter: var(--filter-headline);}
.history-text .csc-textpic-text > * + * {max-height:0; min-height:0; overflow:hidden; color: var(--color-txt);}
.box-history .btn {
    margin-top: 1.33em;
}

.box-history > .col:first-child:before {background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAJUlEQVQIW2NkQAP/gYARWQwkAOLDBeECjEAAkkEWAKtEFwAJAgAZEBP+oM1IkwAAAABJRU5ErkJggg==); width:5px; height:1000em; position:absolute; left:10em; content:''; top:-6.67em;}
.history-text:before {content:''; position:absolute; left:12em; top:2em; width:0; height:0; border: solid transparent; border-width: 0.33em 0.67em; border-right-color: inherit;}

.history-img { transition: 0.6s ease-in-out 0.2s; transition-property: width, left, top, margin; }
.history-text .csc-textpic-text { transition: transform 0.8s cubic-bezier(.59,1.45,.69,.98) 0.2s;}
.history-text .csc-textpic-text > * { transition: max-height 0.8s linear;}

.box-history > :is(.act, :hover) {
    --filter-headline: none;
    color: var(--color-history-act);
}
.act .history-img p {font-weight:600;}
.act .history-img {width:9.2em; left: 0;}
.act .history-text .csc-textpic-text {
  transform: rotateY(-5deg);}
*:not(.act) > .history-text .csc-textpic-text > * + * {margin-bottom:0;}
.act .history-text .csc-textpic-text > * + * {max-height:66.67em;}

/*
  Benutzerregistrierung
*/
.tx-etagenuserregister-pi1 {
  width: 66%;
  margin: 0 auto;
}

.tx-femanager .alert, .tx-femanager .alert * {color:red;}
.tx-femanager .alert h4 {display:inline;}
.tx-femanager .alert h4:after {content:' - '}
.tx-femanager .alert .close {display:none;}
.femanager_flashmessages > .typo3-message {background-image:none;}



/* Trauerportal*/
.decoration-cross {width:2em; height:4em; position:relative; margin:0.67em auto 1.33em;}
.decoration-cross:before, .decoration-cross:after {content:''; background:var(--color-dark); height:100%; width:0.26em; position:absolute; top:0; left:50%; margin-left:-0.15em;}
.decoration-cross:after {height:0.26em; width:100%; left:0; top:20%; margin-left:0;}
.style-3 .decoration-cross {position:absolute; height:80%; top:0.67em; left:0.33em; width:3.33em;}

.style-1 .decoration-cross:before, .style-1 .decoration-cross:after {background:#999;}
.style-3 .decoration-cross:before {width:0.4em; background:var(--color-lightgrey); margin-left:-0.2em;}
.style-3 .decoration-cross:after {height:0.4em; background:var(--color-lightgrey); top:2.27em;}

.box.anzeige {padding:1.33em 3em 1em; min-height:29.33em; position:relative; margin-bottom:2em;}
.anzeige.style-1 {text-align:center;}
.anzeige.style-2 {text-align:center;}
.anzeige.style-3 {padding-left:4em; padding-top:4.67em;}
.traueranzeigen.archive {
    display:flex;       flex-wrap: wrap;}
.traueranzeigen.archive:nth-child(n) .box {min-height:100%; margin:0;}
.traueranzeigen.archive:nth-child(n) > div {margin-bottom:2em;
    display:flex;      flex-shrink: 1;}

.anzeige h3, .layout-candle h3 {color:inherit; font-size:2em; line-height:1em; margin-bottom:0;}
.anzeige h3 i, .layout-candle h3 i {color:#999; font-size:2rem; display:block; font-style:normal; position:relative; top:-0.33em; margin-bottom:-0.67em;}
.dates-birth-death, .bereaved {margin-bottom:1.33em;}

.slider-outer .txt-free {--h: 30em; max-height: var(--h); overflow: auto; padding: 10px; margin:-10px; margin-bottom: 1em; mask-image: linear-gradient(to bottom, transparent, black .5em, black calc(var(--h) - .5em), transparent);}
.slider-outer .txt-free > :last-child {margin-bottom: 0;}
.slider-outer.candles .txt-free { --h: 20em; scrollbar-color: rgba(255,255,255,0.2) rgba(0,0,0,0.1);}
.candles .slider-controls button {z-index: 1;}

.txt-free p, .txt-info p {margin:0 auto 1em; max-width:40em;}

.anzeige.style-2 h3 {margin-bottom:0.167em;}
.style-1 h3 {font-family: 'Great Vibes', cursive;}

.bereaved, .layout-candle .date-creation {color:#999;}
.style-3 .bereaved, .layout-candle .bereaved {color:inherit; }

.tx-etagentrauerportal .slider-controls .menu {display:none;}
#main .tx-etagentrauerportal .slider-outer.is-slider { box-shadow: none;}
.traueranzeigen .slider-mask {background:#fff;}
.tx-etagentrauerportal .slider-controls > a {top:13em !important;}

.layout-candle img {position:absolute; left:-40px; top:0;}
.layout-candle {padding:0.67em 0 0.67em 2.33em; position:relative; min-height:14.33em;}
.layout-candle h3 {font-size:1.6em;}
.layout-candle .dates-birth-death {  margin-bottom: 1em;}
.layout-candle .bereaved {float:left; margin-bottom: 0;}
.layout-candle .date-creation {float:right;}
.candles.slider-2-2 > .col-6:nth-child(n+5) {display:none;}
.layout-candle p, .layout-candle div, .layout-candle h3 {z-index:1; position:relative;}

.create-candles .col, .create-candles .col-6 {padding-bottom:0.67em;}
.create-candles textarea {width:100%; padding-top:0.67em;}
.create-candles input[type="submit"] {float:right; min-width:33.3333%; width:auto;}

.candles .col-6:nth-child(2n+1), .traueranzeigen .col-6:nth-child(2n+1) {clear:both;}

.tx-etagentrauerportal + .csc-textpic p:first-child:last-child > a:first-child:last-child {float:right;}

.box-no-edges {background:0;}
.box-no-edges > * {position:relative; z-index:0; padding-top:2em; padding-bottom:1em; max-width: 100%;}
.box-no-edges > *:before {position:absolute; color:var(--color-equals-bg); top:0; left:0; right:0; bottom:0; content:''; background: radial-gradient(circle at 1.5em 0, transparent 1.5em, currentColor 1.55em) -1.5em 0; z-index:-1;}
.box-no-edges a > * {
    background-color: var(--color-equals-bg);
}
.box-no-edges .icn-death:first-child {/*display:none;*/}
.traueranzeigen h4 {margin-bottom:1em; min-height:4.05em;}
.box-no-edges .main-icon {font-size:2em;}



#page-1 .row.bg-dark .col-6 .wrap-img {padding-bottom:0.67em;}
#page-1 .row.bg-dark .col-6 .wrap-img img {margin:0;}

/* MP3 in Block mit vertikaler Zuordnung*/
.mp3-box .wrap-txt {flex-basis: 50%;}
.mp3-box a {color:inherit;}
.mp3-box .wrap-main-img {width:30%; margin: 0 1em 1em 0;}
.mp3-box img {width:60%;}
.vertical-block .mp3-box + .mp3-box {display:none;}


/* Teaser mit Unterlinks */
.half-top {height:30rem; overflow:hidden; position:relative; z-index:1;}
.half-top .img-main { max-width:none; width:100%; height:100%; position:absolute; top:0; left:0; object-fit: cover;}
.half-top .row-bottom  {position:absolute; bottom:0; width:100%;}
.half-top .box {margin-bottom:0;}
.half-top .box {min-height:8rem;}
.menu-feature {margin:0.67em 0 1.33em;}
.teaser-has-links .menu-feature li {
    padding: 0;
}
.teaser-has-links .menu-feature .box a {
    padding-bottom: 0.33em;
    font-size: 1.1em;
    line-height: 1.1;
    margin: 0;
    width: 100%;
    color: var(--color-adapt-main-dark);
}

/*
==================================================
Farben
==================================================
TODO: gibt es .world-feiern.act > a usw. noch irgendwo?
*/
h1 {
    color: var(--color-world-big-on-white);
}
[class*=world-].act > a  {
    color: var(--color-world-on-white);
}


a, .no-btn {
    color: var(--color-link);
    text-decoration-color: var(--color-underline);
}
a:hover, .btn:hover {
    color: var(--color-link-hover);
}

.maincolor {
    color: var(--color-adapt-main);
}

body .bg-world.event-poster a {color:#454545}

.menu-0 li:hover, .menu-0 li li.act,
.menu-1 .act, .menu-1 li:hover {
    background: var(--color-world);
}
p .hit {
    color: var(--color-adapt-contrast--main-if-bg-main);
    background: var(--color-adapt-main);
}
.search-bar .btn, .search-header .btn {
    --color-txt: var(--color-search);
    --color-btn-hover: var(--color-search);
    --bgcolor-btn-hover: color-mix(in srgb, var(--bgcolor-search), #000 10%);
    background: var(--bgcolor-search);
}

.bg-yellow input[type="search"] {box-shadow: var(--shadow-input);}

body:not([class*="world-"]), .world- {
    --color-world-on-white: var(--color-main-on-white);
    --color-world-big-on-white: var(--color-main-big-on-white);
}
/* Helle World-Farben */
.world-, .world-feiern, .world-glaube, .world-kultur {
}
/* Dunkle World-Farben */
.world-hilfe, .world-bildung, .world-jugend, .world-medien, .world-trauer {
    --color-txt-on-bg-world: #fff;
    --color-adapt-black: #fff;
}

.world-feiern {
    --color-world: var(--color-rose);
    --color-world-on-white: var(--color-rose-on-white);
    --color-world-rgb: var(--color-rose-rgb);
}
.world-glaube {
    --color-world: var(--color-blue);
    --color-world-on-white: var(--color-blue-on-white);
    --color-world-rgb: var(--color-blue-rgb);
}
.world-hilfe {
    --color-world: var(--color-lila);
    --color-world-rgb: var(--color-lila-rgb);
}
.world-bildung {
    --color-world: var(--color-green);
    --color-world-rgb: var(--color-green-rgb);
}
.world-jugend {
    --color-world: var(--color-red);
    --color-world-rgb: var(--color-red-rgb);
}
.world-medien {
    --color-world: var(--color-darkblue);
    --color-world-rgb: var(--color-darkblue-rgb);
}
.world-kultur {
    --color-world: var(--color-beige);
    --color-world-on-white: var(--color-beige-on-white);
    --color-world-big-on-white: var(--color-beige-big-on-white);
    --color-world-rgb: var(--color-beige-rgb);
}
.world-trauer {
    --color-world: var(--color-lila);
    --color-world-rgb: var(--color-black-rgb);
}

body .menu-1 .act a, body .menu-1 a:hover {
    color: var(--color-txt-on-bg-world);
}
.row-over h1 {color:#fff;}


.overlay a, a .overlay {
    transition:0.5s;
}
.bg-world.overlay {
    --opacity: var(--opacity-overlay);
    background:rgba(var(--color-world-rgb),var(--opacity));
}
.bg-world.overlay a:hover, a:hover .bg-world.overlay {
    background:rgba(var(--color-world-rgb),1);
}



.responsive-on .menu-0 .level-0 > ul > .is-open > a {
    background: color-mix(in srgb, var(--color-world), #000 10%);
    color: var(--color-txt-on-bg-world);
}
.responsive-on .menu-0 .level-1 ul,
.responsive-on .menu-0 .level-0 .is-open > .btn,
.responsive-on .menu-0 .level-0 > ul > li > *:hover,
.responsive-on .menu-0 .level-2,
.responsive-on .redirect-link > a:hover ~ .btn {
    background: var(--color-world);
    color: var(--color-txt-on-bg-world);
}

.responsive-on .menu-0 .level-2 ul, .responsive-on .menu-0 .level-1 .is-open > .btn, .responsive-on .menu-0 .level-1 .btn:hover, .responsive-on .menu-0 .level-1 .redirect-link > a:hover ~ .btn { background:rgba(255,255,255,0.2); }

/* Reset */
.responsive-on .menu-0.menu-0.menu-0 li {background:0;}
.responsive-on .menu-0 a {color:inherit;}


#page-150 #c1164 {margin:0; width:100%; overflow-x:scroll;}


/* Cleverreach */
.tx-tscleverreach-pi1 .form-inline input[type="submit"] {}
.tx-tscleverreach-pi1 .daten {clear:both; float:left; margin: 0 2.5%; width:95%;}
.col-headline.newsletter-headline > p {margin-top:0.33em; }
.divider.divider-nl {height:0.33em;}
.cells-linearize th {display:none;}
.cells-linearize td {display:block; padding:0;}
.cells-linearize a {font-size:1.2em;}
.cells-linearize tr {display:block; margin-bottom:1em;}


/* RB 11/2014 */
.map-box, #map {float:left; clear:both; width:100%; height:33.33em; position:relative; max-height: 85vh; z-index: 0;}
#page-1637 .map-box {height:55.55em;}
.leaflet-popup-content {
    --color-link: var(--color-dark);
    --color-link-hover: var(--color-main-on-white);
}
html .leaflet-popup-content {font-size:2rem; line-height: 1.35; font-weight: 300;}
html .leaflet-container {font-family:inherit;}
html .leaflet-popup-content p {margin: 0 0 1.5rem;}

.whitetext {color:#fff;}
h3.whitetext.registerbox + p + div a.btn {margin:0.67em 0 0 33.3333%; line-height: 2.2em; min-height: 2.3em; padding: 0.2em 1.9em;}
.login-header {display:none;}

.social-networks a {width: 2.33em; max-width: 2.33em; height:auto; display:block; float:left; margin-right: 1em;}
.social-networks a[title="E-mail"] {width: 3.33em; max-width: 3.33em; margin-top:-0.5em;}

/* Accordion / FAQ 04/2015 */
.tx-jpfaq-pi1 .jpfaqHideAll, .jpfaqCategory, .jpfaqAll {display:none;}
.tx-jpfaq-pi1 > ul {list-style:none; margin:0; width:100%; float:left; clear:both;}
details {margin-bottom:1rem;}

.accordion-label {float:none; text-align:left; margin:0; padding-right:3em; position:relative;}
.accordion-content {border: 1px solid #ccc; border-top:0; padding:0.67em 1.2em;}
.news-menu-view .accordion-content {border:0; padding:0;}

.accordion-label .toggle-icon {position:absolute; margin-right:1.5rem;}
.act .accordion-label .toggle-icon, .questionUnfolded .toggle-icon {transform: rotate(180deg);}

/* Accordion per details+summary */
summary {
    cursor: pointer;
    display: block; /* entfernt den ::marker auch in Safari */
}
summary::marker {
    content: '';
}
[open] > summary .toggle-icon {
    transform: rotate(180deg);
}
::details-content {
    transition: 0.3s allow-discrete;
    overflow: clip;
}
:not([open])::details-content {
    height: 0;
}

.bg-lightgrey .tx-jpfaq-pi1 ul li > h3 + div, .bg-lightgrey .accordion-content { border-color: #fff;}


/*
Bild-Collagen
==================================================
*/
.collage {
    --ar: 1;
    aspect-ratio: var(--ar);
    position: relative;
}
.collage > div {
    height: 100%
}
.collage .img-only {
    --w: 50%;
    position: absolute;
    width: var(--w);
    left: var(--x);
    top: var(--y);
}
.collage img {
    width: 100%;
}


/*1069*/
@media screen and (max-width: 1400px) {
.menu-0 > div > ul > li:last-child > ul, .menu-0 > div > ul > li:nth-last-child(2) > ul {left:auto; right:0;}
}

@media screen and (max-width: 1200px) {
.tx-etageneventregister-pi1 .row {padding:1em;}
}


@media screen and (max-width: 1024px) {
  .touch-support .google-map {width:95%;}
}


@media screen and (max-width: 850px) {
/* einzelne zentrierte 66%-Spalten auf volle Breite ausdehnen */
.row > .col.text-only, .row > .col.csc-textpic.csc-textpic-above, .col-8.col-center {width:100%; margin:0;}
.col-center.col-8 .col-headline,  .col-center.col-8 .col .col-headline {width:100%; margin-left:0;}

#page-100 #main .col-headline + .row .col-3 {width:100%; margin-bottom:2em;}
#page-100 #main .col-headline + .row .col-9 {width:100%; margin:0 auto; float:none;}
.box-footer .btn-pseudo {margin-top:1em;}
.cal-list .btn {margin-top:0;}

.tx-etagenuserregister-pi1 {
  width: 96%;
  margin: 0 auto;
}

.tx-etagenuserregister-pi1 label + * { clear: left; width: 100%;}

}

@media (max-width: 1150px) and (min-width: 851px) {
    /* .col-9 .col-4  für Erzbistums-Newsteaser */
    .col-3, .col-9 .col-4 {
    -webkit-hyphens:auto;
    -ms-hyphens:auto;
    hyphens:auto;}
}
/* speziell für MAV-Newsteaser */
@media (min-width: 851px) {
    .col-8 .col-3 :is(h1, h2, h3, h4) {
        -webkit-hyphens: auto;
        -ms-hyphens: auto;
        hyphens: auto;
    }
}

@media screen and (max-width: 850px) {
/* vorher 750px */

.col-1 {width:16.6667%;}
.col-2 {width:33.3333%;}
.col-3 {width:50%;}
.col-4, .col-6, .col-8, .col-9, .col-9 + .col-3 {width:100%;}
.col-1, .col-2, .col-3, .col-4, .col-6, .col-8, .col-9 {margin-bottom:1em;}

.col-6 .col-2, .col-4 .col-2, .col-3 .col-2 {width:16.6667%; margin-bottom:0;}
.col-6 .col-3, .col-4 .col-3, .col-3 .col-3 {width:25%; margin-bottom:0;}
.col-6 .col-4, .col-4 .col-4, .col-3 .col-4 {width:33.3333%; margin-bottom:0;}
.col-6 .col-6, .col-4 .col-6, .col-3 .col-6 {width:50%; margin-bottom:0;}

.wrap-img img {margin:0 auto;}

.half-top .col-6 {margin-bottom:0; min-height:0;}
.half-top .img-main {left:auto !important; right:0;}

#page-1 .row-over.bg-dark .row >.col-4:first-child .wrap-img {display:none;}

.tx-etageneventregister-pi1 input:not(.btn),
.tx-etageneventregister-pi1 label {clear:both; border:0; float:none; display:block; width:100%}
#main input[type="checkbox"], #main input[type="radio"] {width:0.87em; left:0; }
#main input[type="checkbox"] + label, #main input[type="radio"] + label {margin-left:5%;}
}

@media screen and (max-width: 600px) {
/* Timeline-Modul auf vertikal umklappen */
.box-history > .col {padding:0; margin: 4em 0 3.33em;}
.history-text {padding-left: 1em; padding-right:1em;}
.history-img {top:-4.67em; margin-left:0.15em;}
.act .history-img {margin-top:-1.2em;}

.box-history > .col:first-child:before {left:4.67em;}
.history-text .csc-textpic-text {padding:1.33em;  background:#fff;  border:0; border-top: 0.27em solid;}
.history-text:before {display:none;}

.history-text .csc-textpic-text {
  transform: rotateX(-10deg);
}

.history-img .wrap-img p {position:absolute; left:100%; text-align:left; top:50%; margin-top:-0.67em; min-width:100%;}

.act .history-text:before, .box-history > .col:hover .history-text:before  {border-color: transparent; border-bottom-color: rgb(250, 176, 0); }
.act .history-text .csc-textpic-text {
  transform: rotateX(3deg);
}
}

@media screen and (max-width: 550px) {
.col-1 {width:25%;}
.col-2 {width:50%;}
.col-6 .col-2, .col-4 .col-2, .col-3 .col-2 {width:25%;}
.col-6 .col-3, .col-4 .col-3, .col-3 .col-3 {width:50%; margin-bottom:0;}
#footer .col-3 .col-3 {width:25%;}
.col-3, .row .col-4, .row .col-6 {width:100%;}
.col-3 .col-4 {width:33.3333%;}
.col-3 .col-6 {width:50%;}


.tx-tscleverreach-pi1 select {width:100%;}
.form-inline div, .form-inline input[type="submit"], .form-inline input {width:100%; margin:0;}
.menu.menu-0.opened {clear:both; float:none;}

.col-headline h1 + p {font-size:1em;}
.site-erzbistum .breadcrumbs .menu {padding-left:0;}
}

@media screen and (max-width: 350px) {
.col-1 {width:50% !important;}
.col-6 .col-2, .col-4 .col-2, .col-3 .col-2 {width:50% !important;}
.col-2, .row *:not(.layer-container) > .col-3 {width:100% !important;}
.col-3 .col-4 {width:33.3333%;}
#footer .col-3 .col-3, #footer .col-4 .col-3 {width:25% !important;}
}


/* Trauerportal (Mobile) Slider Fix */
html.js .tx-etagentrauerportal > .col {overflow:hidden;}
html.js .tx-etagentrauerportal .candles .slider-mask {overflow:visible;}
html.js .tx-etagentrauerportal .candles .layer.visible {opacity: 1 !important; display:block;}

@media screen and (min-width: 767px) {
  html.js .tx-etagentrauerportal .candles .layer {opacity:0; position:relative; float:left; transition: opacity 0.6s ease-out;  }
  html.js .tx-etagentrauerportal .candles .layer.act {opacity:1;}
  html.js .tx-etagentrauerportal .candles .layer {opacity:1 !important;}
}

.tx-etagentrauerportal .success.kerze .titlefield {font-size: 1.6em; line-height:1.2em; color: #fff;}
.tx-etagentrauerportal .success.kerze a { font-size:2rem; line-height:2em; margin-top: 1em; margin-left: 0.75em;}



/* Reduzierte Seite für öffentlichen Monitor */
#page-1774 #subheader, #page-1774 .menu-selected, #page-1774  #header .col > * {display:none;}
#page-1774  #header , #page-1774  #header .col{height:0; padding:0; min-height:0;}
#page-1774  #header .logo {display:block; position:absolute; left:1em; margin-top:2em; }
#page-1774  #main > .col-headline:first-child {padding-top:1.6em;}

/*
==================================================
Einfache Utility-Klassen
==================================================
*/
body .std-padding {padding:1em;}
body .inner-std-padding.inner-std-padding > * {padding:1em;}
body .no-padding {padding:0;}
body .no-v-padding {padding-top:0; padding-bottom:0;}
body .no-h-padding {padding-left:0; padding-right:0;}
body .no-t-padding {padding-top:0;}
body .no-b-padding {padding-bottom:0;}
body .no-margin {margin:0;}
body .no-l-margin {margin-left:0;}
body .no-r-margin {margin-right:0;}
body .negate-grid-padding {margin-left:-1em; margin-right:-1em; padding:0;}
.row-over > * > .negate-rowover-padding:first-child {margin-top:-2.67em;}
.row-over > * > .negate-rowover-padding:last-child {margin-bottom:-2.67em;}
body .l {left:0; right:auto; float:left;}
.r.r {left:auto; right:0; float:right;}
img.links {float:left; margin: 0.33em 1em 0.67em 0; }
img.rechts {float:right; margin: 0.33em 0 0.67em 1em; }
body .hidden {display:none;}
body .center-txt {text-align:center;}
body .mt-1em {margin-top:1em;}
body .text-left {
    text-align: left;
}
body .text-right {
    text-align: right;
}
body .text-center {
    text-align: center;
}
body .text-justify {
    text-align: justify;
}
@media (min-width: 851px) {
    .min-h-20em {
        min-height: 19.8em;
    }
    .box-fullimg.min-h-20em {
        height: 19.8em;
    }
}

/*
Abstände
==================================================
*/
.p-0, .p-h-0, .p-l-0 {
    padding-left: 0 !important;
}
.p-0, .p-h-0, .p-r-0 {
    padding-right: 0 !important;
}
.p-0, .p-v-0, .p-t-0 {
    padding-top: 0 !important;
}
.p-0, .p-v-0, .p-b-0 {
    padding-bottom: 0 !important;
}

.p-sm, .p-h-sm, .p-l-sm {
    padding-left: var(--gap-sm) !important;
}
.p-sm, .p-h-sm, .p-r-sm {
    padding-right: var(--gap-sm) !important;
}
.p-sm, .p-v-sm, .p-t-sm {
    padding-top: var(--gap-sm) !important;
}
.p-sm, .p-v-sm, .p-b-sm {
    padding-bottom: var(--gap-sm) !important;
}

.p-std, .p-h-std, .p-l-std {
    padding-left: var(--gap-std) !important;
}
.p-std, .p-h-std, .p-r-std {
    padding-right: var(--gap-std) !important;
}
.p-std, .p-v-std, .p-t-std {
    padding-top: var(--gap-std) !important;
}
.p-std, .p-v-std, .p-b-std {
    padding-bottom: var(--gap-std) !important;
}

.p-dbl, .p-h-dbl, .p-l-dbl {
    padding-left: var(--gap-dbl) !important;
}
.p-dbl, .p-h-dbl, .p-r-dbl {
    padding-right: var(--gap-dbl) !important;
}
.p-dbl, .p-v-dbl, .p-t-dbl {
    padding-top: var(--gap-dbl) !important;
}
.p-dbl, .p-v-dbl, .p-b-dbl {
    padding-bottom: var(--gap-dbl) !important;
}

.p-big, .p-h-big, .p-l-big {
    padding-left: var(--gap-big) !important;
}
.p-big, .p-h-big, .p-r-big {
    padding-right: var(--gap-big) !important;
}
.p-big, .p-v-big, .p-t-big {
    padding-top: var(--gap-big) !important;
}
.p-big, .p-v-big, .p-b-big {
    padding-bottom: var(--gap-big) !important;
}

.m-0, .m-h-0, .m-l-0 {
    margin-left: 0 !important;
}
.m-0, .m-h-0, .m-r-0 {
    margin-right: 0 !important;
}
.m-0, .m-v-0, .m-t-0 {
    margin-top: 0 !important;
}
.m-0, .m-v-0, .m-b-0 {
    margin-bottom: 0 !important;
}

.m-sm, .m-h-sm, .m-l-sm {
    margin-left: var(--gap-sm) !important;
}
.m-sm, .m-h-sm, .m-r-sm {
    margin-right: var(--gap-sm) !important;
}
.m-sm, .m-v-sm, .m-t-sm {
    margin-top: var(--gap-sm) !important;
}
.m-sm, .m-v-sm, .m-b-sm {
    margin-bottom: var(--gap-sm) !important;
}

.m-std, .m-h-std, .m-l-std {
    margin-left: var(--gap-std) !important;
}
.m-std, .m-h-std, .m-r-std {
    margin-right: var(--gap-std) !important;
}
.m-std, .m-v-std, .m-t-std {
    margin-top: var(--gap-std) !important;
}
.m-std, .m-v-std, .m-b-std {
    margin-bottom: var(--gap-std) !important;
}

.m-dbl, .m-h-dbl, .m-l-dbl {
    margin-left: var(--gap-dbl) !important;
}
.m-dbl, .m-h-dbl, .m-r-dbl {
    margin-right: var(--gap-dbl) !important;
}
.m-dbl, .m-v-dbl, .m-t-dbl {
    margin-top: var(--gap-dbl) !important;
}
.m-dbl, .m-v-dbl, .m-b-dbl {
    margin-bottom: var(--gap-dbl) !important;
}

.m-big, .m-h-big, .m-l-big {
    margin-left: var(--gap-big) !important;
}
.m-big, .m-h-big, .m-r-big {
    margin-right: var(--gap-big) !important;
}
.m-big, .m-v-big, .m-t-big {
    margin-top: var(--gap-big) !important;
}
.m-big, .m-v-big, .m-b-big {
    margin-bottom: var(--gap-big) !important;
}

span.font-icon {font-family: "etagen-iconfont";}
.no-l-margin:before {margin-left:0;}

@media (max-width: 850px) {
	.sm--box-img-left a, .sm--box-img-left .inner-wrap {flex-direction:row; align-items:flex-start;}
	.sm--box-img-left > a img, .sm--box-img-left > a .main-media, .sm--box-img-left > .inner-wrap > .main-media, .sm--box-img-left > .inner-wrap > a, .sm--box-img-left > .inner-wrap > img {width:40%; height:100%; margin:-0.5em; margin-right:1em; flex-shrink:0; display:flex; max-width:23rem;}
	.sm--box-img-left > a .main-media {display:block;}
	.sm--box-img-left > .inner-wrap > a img {margin:0; width:100%;}
	.sm--box-img-left .btn.no-btn {text-align:right; margin-top:0.5em;}
	.sm--box-img-left img {flex:0 0 auto !important; height:calc(100% + 1em) !important; align-self: auto !important;}
    .sm--box-img-left .ratio-news-teaser {height:calc(100% + 1em); padding:0;}
    .sm--box-img-left .main-media .ratio-news-teaser { width:100%;}

	body .sm--textalign-left {text-align:left;}
}

@media (max-width: 550px) {
    .box-fullimg .overlay .wrap-txt p,
    .social-stream > .col-6:nth-of-type(2) ~ *,
    .calendar-sheet:nth-of-type(2) ~ * {display:none !important;}
}

.ce-menu-teaser-center .btn {
  float: none;
  display: inline-block;
}

.matomo-opt-out {
  padding: 0 calc(1em - 8px);
}


/* Fix für originale Cleverreach-Formulare */
.cr_ipe_item input {position:static;}
.cr_ipe_item input.cr_ipe_radio, input.cr_ipe_checkbox {margin-right:0.75em;}
div[rel=checkbox] > .itemname, div[rel=radio] > .itemname {margin-bottom:0.75em;}

.cr_form-component.cr_form-component {margin:0; padding: 0 20px;}
.cr_form-input {background-image: none !important;}
.cr_form-select.cr_form-select {color:var(--color-dark);}


/* Fix für eTracker-Datenschutz-Switch (https://www.erzbistumberlin.de/datenschutz/) */
.et-switch.et-switch {float:none; display:block; margin-top:15px; }

/* Darstellungs-Optimierung für Startseite (Newsblock) */
#c8068 .col-9 {display:flex;}
#c8068 .col-3 .ce-image {padding:0 0.5em;}
#c8068 .col-3 .ce-image .wrap-img {padding-bottom:1em;}

/* Intranet: Allgemeiner Teaser wird ausgeblendet, falls der davor liegende zugangsgeschützte EBOintern-Teaser angezeigt wird) */
* + #c54379 {display:none;}

/* Cookiebanner */
.et-cookie__checkbox-container {
    width: auto;
}
button.et-cookie__big-btn {
    font-size: 1em;
    font-weight: 600;
}
button.et-cookie__accept-current {
    font-weight: 600;
}
.et-cookie-blocker {
    font-size: 1.6rem;
    background-color: rgba(255, 255, 255, 0.9);
    border: 1px solid #999;
    color: var(--color-txt);
    --color-txt: var(--color-dark);
    --color-link: var(--color-main-on-white);
    --color-link-hover: var(--color-main-on-white);
    --color-btn: var(--color-txt);
    --color-btn-hover: var(--color-btn);
}
.et-cookie-blocker-inline {
    font-size: 1.6rem;
    display: none;
}
.et-cookies-was-allowed-necessary .et-cookie-blocker-inline:only-child {
    display: block;
}
.et-cookies-was-allowed-necessary .et-cookie-blocker-inline.et-cookie-blocker:only-child {
    display: flex;
}
.et-cookie-blocker .btn {
    font-weight: 600;
    font-size: 0.8em;
}
.bg-lightgrey iframe.cookiePermission.bg-dark {
    --color-equals-bg: #fff;
}




body {
    /* Schriftgrößen etc. */
    --txttransform-btn: uppercase;
}
h1, .col-headline h2,
h2.big,
.menu-0 > div > ul > li > a,
.breadcrumbs a,
.search-header ::placeholder, .search-dates ::placeholder,
.history-text h3,
.mp3-box h2,
.tx-tscleverreach-pi1 h3,
.ce-menu-teaser-center h4 {
    text-transform: uppercase;
}

.breadcrumbs {
    --color-link: var(--color-dark);
    --color-link-hover: var(--color-link);
    border-bottom: 4px solid;
}

/*
Hotspots
==================================================
*/
.wrap-popup {
    position: fixed;
    z-index: 999999;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none;
    overflow-y: auto;
    background-color: rgba(0, 0, 0, 0.6);
}
.popup {
    position: relative;
    width: 100%;
    max-width: 36em;
    margin: auto;
    top: auto;
    transform: none;
    max-width: 134rem;
    margin: auto;
    top: auto;
    transform: none;
}
.popup .wrap-img img {
    width: 100%;
}
.popup .csc-textpic:last-child .wrap-img {
    margin-bottom: 0;
}



.popup .btn-close.btn-close {
    position: absolute;
    top:0;
    right: 0;
    transform: translate(50%, -50%);
    border-radius: 50%;
    background: white;
    width: 4rem;
    height: 4rem;
    color: var(--color-dark);
}
.wrap-popup {
    z-index: 999;
}
.wrap-popup[style*=block] {
    display: flex !important;
}