body { font: 20px var(--fontText); margin: 0; padding: 0; color: var(--colorFontText); background-color: #eee;  }
body.start { background-color: var(--bodyBackground); }
:root {
    --cdBlue: #008ace;
    --blueLight: #ecf4fd;
    --linkRed: #c40075;
    --bodyBackground: #f0f0f0;
    --colorFontText: #415a65;
    --fontAwesome: FontAwesome-6-Pro, FontAwesome-6-Brands, FontAwesome-6-Duo, FontAwesome-6-Sharp;
    --fontText: D-Din-Regular, Arial, Helvetica, sans-serif;
    --fontTextBold: D-Din-Bold, Arial, Helvetica, sans-serif;
    --fontTextCondensed: D-Din-Condensed, Arial, Helvetica, sans-serif;
    --fontHeadline: D-Din-Regular, Arial, Helvetica, sans-serif;
    --fontNav: D-Din-Regular, Arial, Helvetica, sans-serif;
    --contentGap: clamp(40px,4vw,60px);
}

h1, h2, h3, h4, h5 { font-family: var(--fontHeadline); font-weight: normal; margin:0; hyphens: auto; }
h1 { font-size: 1.6em; margin-bottom: .8em; }
h4 { color: var(--colorFontText); font-size: 1.3em; text-transform: uppercase; text-align: center; }
h4 a { color: var(--colorFontText); }
strong {font-family: var(--fontTextBold);}

a { color: var(--cdBlue); outline: none; text-decoration: none; }
a:hover { color: var(--linkRed); transition: color 450ms; }
a::before { font-family: var(--fontAwesome); font-weight: 200; }
a.pdf::before { content: '\f1c1'; padding-right: .8em; }

.ce-gallery figure>a {position: relative; display: block; }
.media-icon { position: absolute; bottom: 9px; left: 9px}
.media-icon::before { font: 300 1.6em var(--fontAwesome);}
.media-icon.magnifier::before { content: '\f00e'; transform: perspective(500px) rotate(90deg); }
.media-icon.gallery::before { content: '\f302'; }

.d-none { display: none; }

/* Nach-oben-Button Seite */
a.page-top { position:fixed; right:0; bottom: 22px; color:#fff; padding:9px 12px; z-index:5; opacity: 0.7; background-color: #c20069; }
a.page-top:before { font-family: var(--fontAwesome); content: '\f077'; font-weight:900; }
a.page-top:hover { text-decoration: none; opacity: 1; color: #fff;}

table tr:first-child td { font-family: var(--fontTextBold);}

/* Grid */
.content {display: inline-block; max-width: 100%; background-color: #fff; margin-bottom: var(--contentGap); padding: 21px 30px;}
.container { padding: 0 15px; }
.content-items [class^=item-] { margin-bottom: var(--contentGap);}
aside { margin-bottom: var(--contentGap); }

body:not(.start) aside {  }

/* Header */
header {background-color: var(--blueLight); }
header .container {display: flex; justify-content: space-between; align-items: flex-end; }
header .logo {margin: 15px 0; z-index: 3; font-size: clamp(.54em,1.5vw,1em);}
header .logo a { display: flex; align-items: flex-end; }
header .logo img { width: 12em; height: auto; }
header .logo div { font-size: .5em; margin-top: 3px; text-align: center; margin-bottom: 14px; }

/* Zwischentitel, Kommentar */
.zw-titel { font-family: var(--fontHeadline); font-size: 24px }
.comment { font-size: 12px; margin-top: 6px; }

/* Anpassungen News-Archiv */
.teaser-archive { float: left; width: 100%; margin: 10px 0 20px 0; }
.teaser-archive .date { float: right; margin-left: 10px; font-size:18px; }
.teaser-archive h2 { font-size: 20px; margin-bottom: 15px; }
.teaser-archive h3 { font-size: 18px; margin-bottom: 10px; }
.teaser-archive .image { float: left; margin-bottom: 10px; margin-right: 10px; }
.teaser-archive .text { font-size: 18px; }
.teaser-archive .text p { margin-top: 0 }

.search-desktop { width: 100%; margin-top: 1.5rem }
.rwform .section { padding-right: 0px !important; padding-left: 0px !important; }

@media (min-width: 768px) {

    h1 { font-size: 2.1em; margin-bottom: .8em; }
    .start h1 {margin: .5em 0 .8em;}

    .search-desktop button.btn {
        cursor: pointer;
        padding: 0;
        display: flex;
        width: 67px;
        height: 67px;
        justify-content: center;
        align-items: center;
        content: "\f002";
        color: var(--colorFontText);
        font: 300 26px var(--fontAwesome);
    }
    .top-icons-ajax-content .search-desktop button.btn::after {
        content: "\f002";
        font: 300 26px var(--fontAwesome);
    }
}

@media (min-width: 992px) {
    /* Header */
    header {}
    header .logo img {}
    header .logo { margin: 0 0 -25px; }

    .content { width: 66.66666%; margin-right: 60px; padding: 42px var(--contentGap);}

    /* Grid */
    .content-items { display: flex; gap: var(--contentGap); }
    .content-items [class^=item-] { width: 33.3333%; max-width: 410px; }


    /* Grid */
    body:not(.start) main .container { display: flex;  }
}

@media (min-width: 1200px) {

}

@media (min-width: 1350px) {
    /* Grid */
    .container { width: 1350px; padding:0; }
    aside { width: 410px; }

}