@charset "utf-8";

/* ==========================================================================
 *
 *  General Styles for All Media
 *
 *  Author:  Philipp Mueller <philipp.mueller@xeiro.ch>
 *  Company: xeiro ag, www.xeiro.ch
 *  Version: 27.08.2015
 *
 * ========================================================================== */


@media all {


    /* General elements / resets
    ------------------------------ */
    /* Set all values to 0 */
    * {
        margin: 0;
        padding: 0;
        border: 0;
    }

    /* default font */
    body {
        color: #333;
        background: #fff;
        font-size: 18px;
        font-weight: 400;
    }

    body,
    input,
    textarea,
    select {
        font-family: 'Open Sans', sans-serif;
    }

    /* forms */
    input[type=text],
    input[type=password],
    input[type=submit],
    textarea,
    select {
        font-size: 1em;
        border: 1px solid rgba(175, 202, 0, 1);
        padding: 0.25em 0.5em;
        background: rgba(175, 202, 0, 0.1);
    }

    input[type=text]:focus,
    input[type=password]:focus,
    textarea:focus,
    select:focus {
        background: rgba(175, 202, 0, 0.2);
        border-color: rgba(175, 202, 0, 1);
    }

    input[type=submit] {
        cursor: pointer;
        color: #000;
        background: rgba(175, 202, 0, 0.5);
        border-color: rgba(175, 202, 0, 1);
        font-weight: 700;
        padding: 2px 15px;
    }

    input[type=submit]:hover {
        background: rgba(175, 202, 0, 0.7);
        border-color: rgba(175, 202, 0, 1);
    }


    /* html5 */
    header, footer, aside, nav, article {
        display: block;
    }

    /* clearer */
    .clear {
        clear: both;
    }

    /* hidden elements */
    .hidden {
        display: none;
    }

    /* nowrap */
    .nowrap {
        white-space: nowrap;
    }

    /* table layout by divs */
    .div-table {
        display: table;
        width: 100%;
        table-layout: fixed;
    }

    .div-table-row {
        display: table-row;
    }

    .div-table-cell {
        display: table-cell;
        vertical-align: top;
    }

    /* General contents
    ------------------------------ */
    /* Links */
    a {
        color: #46511e;
        text-decoration: underline;
    }

    a:hover {
        color: #888835;
        text-decoration: underline;
    }


    /* Headers
    ------------------------------ */
    h1, h2, h3, h4, h5 {
        font-weight: 400;
        line-height: 1.45em;
        padding: 0.5em 0 0.25em;
        margin: 0;
    }

    h1 {
        font-size: 3.3em; /* 60px */
    }

    h2 {
        font-size: 2.7em; /* 50px */
    }

    h3 {
        font-size: 2.2em; /* 40px */
    }

    h4 {
        font-size: 1.6em; /* 30px */
    }

    h5 {
        font-size: 1.1em; /* 20px */
    }

    .csc-firstHeader {
        padding-top: 0;
    }

    /* Bodytext Formats
    ------------------------------ */
    /* bodytext */
    p {
        line-height: 1.65em;
        margin: 0 0 1em 0;
    }

    /* date */
    .csc-header-date {
        float: right;
        font-style: italic;
    }

    /* alignments */
    .align-left {
        text-align: left;
    }

    .align-center {
        text-align: center;
    }

    .align-right {
        text-align: right;
    }

    .align-justify {
        text-align: justify;
    }

    /* formats */
    strong,
    b {
        font-weight: 700;
    }

    em {
        font-style: italic;
    }

    em.strike {
        font-style: normal;
        text-decoration: line-through;
    }

    i.strike {
        font-style: normal;
        text-decoration: line-through;
    }

    u {
        text-decoration: underline;
    }

    /* sub- and superscript */
    sub, sup {
        position: relative;
        line-height: 0px;
        font-size: 0.9em;
    }

    sub {
        bottom: 0.5em;
        vertical-align: bottom;
    }

    sup {
        top: 0.5em;
        vertical-align: top;
    }

    /* indent */
    .indent {
        padding: 0 0 0 3em;
    }

    /* preformat */
    pre {
        border: 1px solid rgba(175, 202, 0, 1);
        background: rgba(175, 202, 0, 0.1);
        white-space: nowrap;
        line-height: 1.35em;
        font-size: 0.9em;
        padding: 20px;
        margin: 0 0 20px;
        overflow: auto;
    }

    /* quote */
    blockquote {
        background: rgba(209, 214, 101, 0.1);
        border-left: 10px solid #d1d665;
        margin: 0 0 20px;
        padding: 1.2em 20px 1em 15px;
        quotes: "\201C" "\201D" "\2018" "\2019";
    }

    blockquote:before {
        color: #d1d665;
        content: open-quote;
        font-size: 5em;
        line-height: 0.2em;
        margin-right: 0.1em;
        vertical-align: -0.35em;
    }

    blockquote p {
        display: inline;
    }

    /* videos */
    .video-js-box {
        border: 1px solid #ccc !important;
        max-width: 100%;
    }

    .video-js-box * {
        max-width: 100%;
    }

    .embed-responsive {
        position: relative;
        display: block;
        width: 100%;
        padding: 0;
        overflow: hidden;
    }

    .embed-responsive-16by9 {
        padding-bottom: 56.25%;
    }

    .embed-responsive .embed-responsive-item,
    .embed-responsive embed,
    .embed-responsive iframe,
    .embed-responsive object,
    .embed-responsive video {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border: 0;
    }

    /* images */
    img {
        max-width: 100%;
        height: auto;
    }

    /* iframes */
    iframe {
        max-width: 100%;
    }

    /* Lists
    ------------------------------ */
    ul {
        list-style: disc;
        margin: 0.357142857em 0 1.071428571em;
        padding: 0 0 0 1.285714286em;
    }

    ul ul,
    ul ol,
    ol ol,
    ol ul {
        margin: 0.357142857em 0 0;
    }

    ol {
        margin: 0.357142857em 0 0.5em;
        padding: 0 0 0 1.714285714em;
    }

    ul li,
    ol li {
        padding: 0 0 0.357142857em 0;
        margin: 0;
        line-height: 1.45em;
    }


    /* Filelinks
    ------------------------------ */
    /* General */
    .fileLinks {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .fileLinks li {
        display: block;
        padding: 0;
        margin: 0;
        line-height: 24px;
    }

    .fileLinks li.file a {
        display: block;
        text-decoration: none;
        color: #333;
        min-height: 48px;
    }

    .fileLinks li.file a span {
        display: inline-block;
    }

    .fileLinks li.file a span.fileIcon img {
        width: 36px;
        height: 36px;
    }

    /* Layout 0 - Default */
    .fileLinks-0 li.file {
        clear: both;
    }

    .fileLinks-0 li.file a {
        padding: 0.5em 0;
    }

    .fileLinks-0 li.file a:hover {
        opacity: 0.6;
        filter: alpha(opacity=60);
    }

    .fileLinks-0 li.file a span.fileIcon {
        position: absolute;
        padding: 0.25em 0 0 0;
    }

    .fileLinks-0 li.file a span.fileName {
        margin: 0 0 0 46px;
        padding: 0 0.5em 0 0;
    }

    .fileLinks-0 li.file a span.fileSize {
        font-size: 0.8em;
        font-style: italic;
        color: #666;
    }

    .fileLinks-0 li.file a span.fileSize:before {
        content: '(';
    }

    .fileLinks-0 li.file a span.fileSize:after {
        content: ')';
    }

    .fileLinks-0 li.file a span.fileDesc {
        display: block;
        margin: 0 0 0 46px;
        padding: 0;
    }

    /* Alterative Layout 1 */
    .fileLinks-1 {
        border-top: 1px solid rgba(175, 202, 0, 1);
    }

    .fileLinks-1 li.file {
        border-bottom: 1px solid rgba(175, 202, 0, 1);
    }

    .fileLinks-1 li.file a {
        padding: 0.6em 0.5em 0.5em 0.2em;
    }

    .fileLinks-1 li.file a span.fileIcon {
        position: absolute;
        padding: 0.25em 0 0 0;
    }

    .fileLinks-1 li.file a span.fileName {
        margin: 0 0 0 46px;
    }

    .fileLinks-1 li.file a span.fileSize {
        float: right;
        font-style: italic;
    }

    .fileLinks-1 li.file a span.fileDesc {
        display: block;
        margin: 0 0 0 46px;
        padding: 0;
    }

    .fileLinks-1 li.file a:hover {
        background: rgba(175, 202, 0, 0.1);
    }

    /* Alterative Layout 2 */
    .fileLinks-2 {
        border-top: 1px solid rgba(175, 202, 0, 1);
    }

    .fileLinks-2 li.file a {
        padding: 0.5em;
        border-bottom: 1px solid rgba(175, 202, 0, 1);
    }

    .fileLinks-2 li.file a span.fileIcon {
        position: absolute;
        padding: 0.25em 0 0 0;
    }

    .fileLinks-2 li.file a span.fileName {
        margin: 0 0 0 46px;
    }

    .fileLinks-2 li.file a span.fileSize {
        float: right;
        font-weight: 700;
        font-size: 0.8em;
        color: #777;
    }

    .fileLinks-2 li.file a span.fileDesc {
        display: block;
        padding: 0;
        margin: 0 0 0 46px;
    }

    .fileLinks-2 li.li-odd a {
        background: rgba(175, 202, 0, 0.1);
    }

    .fileLinks-2 li.file a:hover {
        background: rgba(175, 202, 0, 0.5);
    }

    /* Alterative Layout 3 */
    .fileLinks-3 li.file {
        position: relative;
        float: left;
        width: 31%;
        margin: 0 2% 2% 0;
        line-height: 1.35em;
        min-width: 250px;
    }

    .fileLinks-3 li.file a {
        display: block;
        -webkit-box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.1);
        box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.1);
        background: rgba(175, 202, 0, 0.1);
        border: 1px solid rgba(175, 202, 0, 1);
        padding: 1em 0.6em 0.5em 0.6em;
        min-height: 130px;
    }

    .fileLinks-3 li.file a:hover {
        background: rgba(175, 202, 0, 0.2);
    }

    .fileLinks-3 li.file a span.fileIcon {
        position: absolute;
        top: 10px;
        right: 10px;
    }

    .fileLinks-3 li.file a span.fileSize {
        position: absolute;
        top: 20px;
        right: 50px;
        font-style: italic;
        color: #666;
        text-align: right;
    }

    .fileLinks-3 li.file a span.fileName {
        display: block;
        margin: 0;
        padding: 0 0 0.5em;
    }

    .fileLinks-3 li.file a span.fileDesc {
        display: block;
        clear: both;
        border-top: 1px solid rgba(175, 202, 0, 1);
        padding: 0.5em 0 0 0;
    }

    /* Menus
    ------------------------------ */
    /* Content Tables (RTE)
    ------------------------------ */
    table {
        border-collapse: collapse;
    }

    table tr th,
    table tr td {
        text-align: left;
        padding: 0;
        margin: 0;
        line-height: 1.45em;
        vertical-align: top;
    }

    table tr th {
        font-weight: 700;
    }

    table tr td p {
        padding: 0;
        line-height: 1.45em;
        font-size: 1em;
    }

    /* Default Content Table */
    table.contenttable th,
    table.contenttable td {
        padding: 0.5em 1em 0.25em 0;
    }

    /* Content Table Layout 2 */
    table.contenttable-2 {
        background: transparent;
        margin: 0 -1.5em;
    }

    table.contenttable-2 th {
        padding: 1.5em;
        background: rgba(175, 202, 0, 0.5);
        border-bottom: 1px solid rgba(175, 202, 0, 1);
    }

    table.contenttable-2 td {
        padding: 1.5em;
        background: rgba(175, 202, 0, 0.3);
        border-bottom: 1px solid #fff;
    }

    /* Content Table Layout 3 */
    table.contenttable-3 {
        margin: 0 -1.0em 0 -1.5em;
        -webkit-box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.2);
        box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.2);
    }

    table.contenttable-3 th,
    table.contenttable-3 td {
        padding: 1em 1.5em;
        border: 1px solid #ddd;
    }

    /* Striped Table */
    table.stripedtable {
        margin: 0 -1.5em;
    }

    table.stripedtable th {
        background: rgba(175, 202, 0, 0.5);
        border-bottom: 1px solid rgba(175, 202, 0, 1);
    }

    table.stripedtable th,
    table.stripedtable td {
        padding: 1em 1.5em;
    }

    table.stripedtable tr.row-odd td {
        background: rgba(175, 202, 0, 0.3);
    }

    /* Content Divider
    ------------------------------ */
    .divider hr {
        border-top: 3px solid #d1d665;
        padding: 0 0 10px 0;
    }

    /* Abstaende aus dem Altbestand (Befund 16.09.2026).
       Bis 7.6 rendert css_styled_content aus tt_content.spaceBefore/spaceAfter die
       Klassen csc-space-before-<px> mit margin-top: <px> !important. Ab v8 heissen die
       Felder space_before_class/space_after_class, das Layout rendert daraus
       frame-space-before-<wert>. Die Werte sind die echten Pixel des Altbestands
       (siehe Configuration/TCA/Overrides/tt_content.php), damit die Abstaende
       denen der Produktion entsprechen statt auf small/medium geraten zu werden. */
    .frame-space-before-20 { margin-top: 20px !important; }
    .frame-space-before-30 { margin-top: 30px !important; }
    .frame-space-before-50 { margin-top: 50px !important; }
    .frame-space-before-60 { margin-top: 60px !important; }

    .frame-space-after-20 { margin-bottom: 20px !important; }
    .frame-space-after-30 { margin-bottom: 30px !important; }
    .frame-space-after-50 { margin-bottom: 50px !important; }
    .frame-space-after-60 { margin-bottom: 60px !important; }

    /* Content Frames
    ------------------------------ */
    /* general */
    .csc-frame-frame1 .csc-firstHeader,
    .frame-custom-20 .csc-firstHeader,
    .csc-frame-frame2 .csc-firstHeader,
    .frame-custom-21 .csc-firstHeader {
        padding-top: 0;
    }

    /* invisible */
    .csc-frame-invisible,
    .frame-custom-1 {
        display: none;
    }

    /* Ruler Before */
    .csc-frame-rulerBefore,
    .frame-ruler-before {
        border-top: 3px solid #d1d665;
        padding: 0;
        margin: 0;
    }

    /* Ruler After */
    .csc-frame-rulerAfter,
    .frame-ruler-after {
        border-bottom: 3px solid #d1d665;
        padding: 0 0 1em;
        margin: 0 0 0.5em;
    }

    /* Frame 1 */
    .csc-frame-frame1,
    .frame-custom-20 {
        position: relative;
        background: #c2c491;
        -webkit-box-shadow: 1px 1px 10px 0 rgba(0, 0, 0, 0.2);
        box-shadow: 1px 1px 10px 0 rgba(0, 0, 0, 0.2);
        padding: 1em;
        margin: 0 0 2em 0;
    }

    .csc-frame-frame1 h1,
    .frame-custom-20 h1,
    .csc-frame-frame1 h2,
    .frame-custom-20 h2,
    .csc-frame-frame1 h3,
    .frame-custom-20 h3,
    .csc-frame-frame1 h4,
    .frame-custom-20 h4,
    .csc-frame-frame1 h5,
    .frame-custom-20 h5 {
        padding-top: 0 !important;
    }

    .csc-frame-frame1 a,
    .frame-custom-20 a {
        color: #000;
        text-decoration: none;
    }

    .csc-frame-frame1 a:hover,
    .frame-custom-20 a:hover {
        text-decoration: underline;
    }

    /* Frame 2 */
    .csc-frame-frame2,
    .frame-custom-21 {
        position: relative;
        background: #d1d665;
        -webkit-box-shadow: 1px 1px 10px 0 rgba(0, 0, 0, 0.2);
        box-shadow: 1px 1px 10px 0 rgba(0, 0, 0, 0.2);
        padding: 1em;
        margin: 0 0 2em 0;
    }

    .csc-frame-frame2 h1,
    .frame-custom-21 h1,
    .csc-frame-frame2 h2,
    .frame-custom-21 h2,
    .csc-frame-frame2 h3,
    .frame-custom-21 h3,
    .csc-frame-frame2 h4,
    .frame-custom-21 h4,
    .csc-frame-frame2 h5,
    .frame-custom-21 h5 {
        padding-top: 0 !important;
    }

    .csc-frame-frame2 a,
    .frame-custom-21 a {
        color: #000;
        text-decoration: none;
    }

    .csc-frame-frame2 a:hover,
    .frame-custom-21 a:hover {
        text-decoration: underline;
    }


    /* Indent */
    .csc-frame-indent,
    .frame-indent {
        padding: 0 0 0 10%;
    }

    /* Indent 33/66 */
    .csc-frame-indent3366,
    .frame-indent-left {
        padding: 0 0 0 33%;
    }

    /* Frame 66/33 */
    .csc-frame-indent6633,
    .frame-indent-right {
        padding: 0 33% 0 0;
    }


    /* Submenu-Buttons
    ------------------------------ */
    /* Submenu
    ------------------------------ */
    .csc-menu-4 ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .csc-menu-4 ul li {
        float: left;
        width: 30%;
        padding: 0;
        margin: 0 5% 5% 0;
    }

    .csc-menu-4 ul li:nth-child(3n) {
        margin-right: 0;
    }

    .csc-menu-4 li a {
        display: block;
        min-height: 130px;
        padding: 1em;
        background: #888835;
        color: #000;
        text-decoration: none;
    }

    .csc-menu-4 li a span {
        display: block;
    }

    .csc-menu-4 li a .title {
        font-size: 1.6em;
        line-height: 1.35em;
        padding: 0 0 0.5em;
    }

    .csc-menu-4 li a .desc {
        line-height: 1.65em;
    }

    .csc-menu-4 li a:hover {
        background: #d1d665;
    }


    /* General Slider
    ------------------------------ */
    .csc-slider {
        cursor: default;
    }

    .csc-slider span {
        display: block;
    }

    .csc-slider a {
        display: block;
        text-decoration: none;
        color: #000;
    }

    .csc-slider a:hover {
        color: rgba(26, 123, 83, 1);
    }

    .slick-slider {
        margin-bottom: 40px !important;
    }

    .csc-slider .slick-dots {
        bottom: -40px;
    }

    /* Logo Slider */
    .csc-partnerlogos .img {
        background: #333;
        width: 60%;
        margin: 0 auto 0.5em;
        padding: 18% 10%;
        border-radius: 100%;
    }

    /* Statements Slider */
    .csc-statements .img,
    .csc-statements .img img {
        border-radius: 100%;
    }

    .csc-statements .img {
        width: 70%;
        margin: 0 auto 0.5em;
    }

    .csc-statements .title,
    .csc-statements .desc {
        text-align: center;
        padding: 0 10% 0.25em;
        line-height: 1.5em;
    }

    .csc-statements .title {
        font-size: 1.22222222222222em;
    }

    .csc-statements .title span {
        padding: 0.25em 0 0 0;
        font-size: 0.72727272727273em;
    }

    .csc-statements .desc {
        font-size: 0.88888888888889em;
        padding-bottom: 1em;
    }

    .csc-statements .desc:before {
        content: '«';
        padding-right: 1px;
    }

    .csc-statements .desc:after {
        content: '»';
        padding-left: 1px;
    }

    /* Content
    ------------------------------ */

    /* Bildspalten fuer fluid_styled_content (ab TYPO3 14).
       Bis 7.6 kam dieses Layout aus dem mitgelieferten CSS von css_styled_content;
       seit v12 liefert der Core dafuer kein Stylesheet mehr aus, und ohne diese Regeln
       stapeln sich die Spalten untereinander (Befund 16.09.2026 an den drei Kacheln der
       Startseite und an der 18-teiligen Galerie unter /medien/bilder).
       Die Regeln sind die Uebersetzung der Produktionsfassung:
       csc-textpic-imagewrap -> ce-gallery, -imagerow -> ce-row, -imagecolumn -> ce-column,
       -center-outer/-inner -> ce-outer/ce-inner, -lastcol/-imagerow-last -> :last-child.
       ACHTUNG: Die Selektoren haengen an .ce-gallery, NICHT an .ce-textpic - ein reines
       Bildelement (CType image) traegt .ce-image, und mit .ce-textpic griff hier nichts.
       Die Abstaende folgen styles.content.textmedia.columnSpacing/rowSpacing = 30. */
    /* Wie live div.csc-textpic { overflow: hidden }: der Elementrahmen schliesst die
       gefloatete Galerie ein. Ohne .ce-textpic/.ce-image ragte die links gefloatete
       Kachel-Galerie der Startseite aus ihrem Element; der Statement-Slider darunter
       (.slick-list, overflow: hidden) wich dem Float aus und Slick mass 0 px Breite -
       der Slider blieb leer (Befund 16.09.2026). */
    /* Nur wenn wirklich Bilder da sind: ohne Bild rendert 7.6 kein csc-textpic, und
       ein overflow: hidden verhinderte, dass der Absatzabstand mit dem Folgenden
       verschmilzt (+10 px auf Tablet/Handy, Befund 16.09.2026). */
    .ce-textpic:has(.ce-gallery),
    .ce-image {
        overflow: hidden;
    }

    /* overflow: hidden nur dort, wo 7.6 es setzt (Befund 16.09.2026, Tablet):
       auf echten Bildzeilen - die gibt es erst ab zwei Bildern, ein Einzelbild rendert
       7.6 ohne Zeile (singleNoCaption) - und auf dem Bildbereich zentrierter Galerien.
       Sonst verschmilzt der 30-px-Abstand unter einem Einzelbild live mit dem Rand des
       Bildbereichs, und ein pauschales overflow: hidden addierte beide (40 statt 30 px). */
    .ce-gallery:not([data-ce-images="1"]) div.ce-row,
    .ce-center .ce-gallery {
        overflow: hidden;
    }

    /* Spalten nebeneinander wie in 7.6 (float, Eigenbreite der Bilder, 30 px Abstand).
       Gilt fuer die normale Galerie (je Zeile) und fuer "Keine Zeilen" (eine Zeile mit
       Spalten-Bloecken, siehe Gallery.fluid.html). Eine column-count-Loesung ist wieder
       entfernt: sie erzwang gleich breite Spalten. */
    .ce-gallery div.ce-column {
        float: left;
        margin-right: 30px;
    }

    .ce-gallery div.ce-row div.ce-column:last-child {
        margin-right: 0;
    }

    /* Ein Einzelbild hat in 7.6 weder Zeile noch Spalte (singleNoCaption): die Figur
       liegt direkt im Bildbereich. Die Spalte darf deshalb nicht floaten - sonst faellt
       der Bildbereich ohne overflow auf Hoehe 0 zusammen und der Text rutscht neben das
       Bild (Befund 16.09.2026, Tablet /ueber-soja/proteinbedarf-der-schweiz). */
    .ce-gallery[data-ce-images="1"] div.ce-column {
        float: none;
        margin-right: 0;
    }

    .ce-gallery figure.image {
        margin: 0 0 30px 0;
    }

    /* Ein EINZELNES Bild behaelt seine 30 px ebenfalls: 7.6 rendert es ueber
       renderMethod singleNoCaption ganz ohne Zeilen-Wrapper, die -imagerow-last-Regel
       greift dort also nicht (Befund 16.09.2026, Weltkarte /ueber-soja/produktion-und-handel).
       Bei "Keine Zeilen" gibt es nur EINE Zeile - ein :last-child auf der Zeile
       wuerde also allen Bildern den Abstand nehmen. Die Produktion haelt es genauso:
       dort greift .csc-textpic-imagerow-last nicht, weil die Zeile -imagerow-none heisst,
       und jede figure behaelt ihre 30 px. */
    .ce-gallery:not([data-ce-images="1"]) div.ce-row:last-child:not(.ce-row-keine-zeilen) figure.image {
        margin-bottom: 0;
    }

    .ce-gallery img {
        border: none;
        display: block;
    }

    /* Zentrierte Galerien (ce-center): dieselbe Float-Technik wie in 7.6 */
    .ce-center .ce-outer {
        position: relative;
        float: right;
        right: 50%;
    }

    .ce-center .ce-inner {
        position: relative;
        float: right;
        right: -50%;
    }

    /* Bildausrichtung (imageorient), uebersetzt aus der Produktionsfassung.
       Befund 16.09.2026: "Bild neben dem Text" (19 Elemente) stand als kleines Bild
       UEBER dem Text. Die Produktion berechnete fuer "nicht umfliessen" je Seite einen
       Textrand in Bildbreite (margin-right: 570px = 540 + 30); overflow: hidden auf dem
       Textblock ergibt dieselbe Spalte, ohne die Breite zu kennen. */
    .ce-above.ce-right .ce-gallery,
    .ce-below.ce-right .ce-gallery,
    .ce-intext.ce-right .ce-gallery {
        float: right;
    }

    .ce-above.ce-left .ce-gallery,
    .ce-below.ce-left .ce-gallery,
    .ce-intext.ce-left .ce-gallery {
        float: left;
    }

    .ce-above.ce-right .ce-bodytext {
        clear: right;
    }

    .ce-above.ce-left .ce-bodytext {
        clear: left;
    }

    .ce-intext.ce-left .ce-gallery {
        margin-right: 30px;
    }

    .ce-intext.ce-right .ce-gallery {
        margin-left: 30px;
    }

    /* "Nicht umfliessen" genau wie live: fester Textrand in Bildbreite. css_styled_content
       setzte ihn je Seite auf die groesste Bildbreite + Abstand (540 + 30 = 570 px, maxWInText
       ist ueberall 540). Eine erste Fassung nutzte overflow: hidden - optisch gleich breit,
       aber es schloss den Absatzabstand ein, der live mit dem Folgenden verschmilzt.
       Nur mit Bild: ohne Bild hat 7.6 keine intext-Klasse und keinen Rand. */
    .ce-intext.ce-right.ce-nowrap:has(.ce-gallery) .ce-bodytext {
        margin-right: 570px;
    }

    .ce-intext.ce-left.ce-nowrap:has(.ce-gallery) .ce-bodytext {
        margin-left: 570px;
    }

    .ce-intext.ce-left ol,
    .ce-intext.ce-left ul {
        padding-left: 40px;
        overflow: auto;
    }

    .ce-border .ce-gallery img {
        border: 0 !important;
        border-radius: 100%;
    }

    .ce-gallery figcaption {
        font-size: 1em;
        color: #333;
        padding: 2px 0 0 0;
    }

    div.csc-textpic-border div.csc-textpic-imagewrap img {
        border: 0 !important;
        border-radius: 100%;
    }

    div.csc-textpic-border figcaption.csc-textpic-caption {
        text-align: center !important;
    }

    figcaption.csc-textpic-caption {
        font-size: 1em;
        color: #333;
        padding: 2px 0 0 0;
    }

    /* Additional Layout Elements
    ------------------------------ */
    address,
    address p {
        font-style: normal;
        line-height: 1.45em;
        margin: 0;
    }


    /* Content Layouts
    ------------------------------ */
    /* General */
    .layout .col-space {
        width: 5%;
    }

    /* Layout 1 - one column */
    /* no additional styles required */
    /* 2 cols */
    .layout-2 .col-1 {
        width: 47.5%;
    }

    .layout-2 .col-2 {
        width: 47.5%;
    }

    /* 3 cols */
    .layout-3 .col-1 {
        width: 30%;
    }

    .layout-3 .col-2 {
        width: 30%;
    }

    .layout-3 .col-3 {
        width: 30%;
    }

    /* 4 cols */
    .layout-4 .col-1 {
        width: 21.25%;
    }

    .layout-4 .col-2 {
        width: 21.25%;
    }

    .layout-4 .col-3 {
        width: 21.25%;
    }

    .layout-4 .col-4 {
        width: 21.25%;
    }

    /* 5 cols */
    .layout-5 .col-1 {
        width: 16%;
    }

    .layout-5 .col-2 {
        width: 16%;
    }

    .layout-5 .col-3 {
        width: 16%;
    }

    .layout-5 .col-4 {
        width: 16%;
    }

    .layout-5 .col-5 {
        width: 16%;
    }

    /* 2 cols 66/33 */
    .layout-6 .col-1 {
        width: 63.33333333333334%;
    }

    .layout-6 .col-2 {
        width: 31.66666666666667%;
    }

    /* 2 cols 33/66 */
    .layout-7 .col-1 {
        width: 31.66666666666667%;
    }

    .layout-7 .col-2 {
        width: 63.33333333333334%;
    }

    /* 1 col / 2 cols */
    .layout-8 .row-1 .col-1 {
        padding: 0 0 1em 0;
    }

    .layout-8 .row-2 .col-1 {
        width: 47.5%;
    }

    .layout-8 .row-2 .col-1 {
        width: 47.5%;
    }

    /* 1 col / 3 cols */
    .layout-9 .row-1 .col-1 {
        padding: 0 0 1em 0;
    }

    .layout-9 .row-2 .col-1 {
        width: 30%;
    }

    .layout-9 .row-2 .col-2 {
        width: 30%;
    }

    .layout-9 .row-2 .col-3 {
        width: 30%;
    }

    /* 2 cols / 1 col */
    .layout-10 .row-1 .col-1 {
        width: 47.5%;
    }

    .layout-10 .row-1 .col-1 {
        width: 47.5%;
    }

    .layout-10 .row-2 .col-1 {
        padding: 1em 0 0 0;
    }

    /* 3 cols / 1 col */
    .layout-11 .row-1 .col-1 {
        width: 30%;
    }

    .layout-11 .row-1 .col-2 {
        width: 30%;
    }

    .layout-11 .row-1 .col-3 {
        width: 30%;
    }

    .layout-11 .row-2 .col-1 {
        padding: 1em 0 0 0;
    }


    /* Plugin "tx_form"
    ------------------------------ */
    div.csc-mailform ol {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    div.csc-mailform ol li {
        margin: 0 0 1em;
        padding: 0;
    }

    div.csc-mailform ol li {
        overflow: hidden;
    }

    div.csc-mailform fieldset {
        margin: 0;
        padding: 0;
        position: relative;
    }

    div.csc-mailform legend {
        margin-left: 1em;
        color: #000;
        font-weight: 700;
    }

    div.csc-mailform fieldset ol {
        padding: 1em 1em 0 0;
    }

    div.csc-mailform fieldset li {
        display: inline-block;
        padding: 0 1em 0 0;
        margin-bottom: 0.5em;
        list-style: none;
    }

    div.csc-mailform fieldset.submit {
        border-style: none;
    }

    /* Captcha */
    div.csc-mailform .csc-form-element-recaptcha .g-recaptcha {
        margin: 0 0 1em 14em;
    }

    /* Normal label; Left aligned, in front of input */
    div.csc-mailform li label {
        float: left;
        width: 13em;
        margin-right: 1em;
        vertical-align: baseline;
    }

    div.csc-mailform li input + label,
    div.csc-mailform li textarea + label,
    div.csc-mailform li select + label {
        float: none;
        width: auto;
        margin-right: 0;
        margin-left: 1em;
    }

    div.csc-mailform li textarea + label {
        vertical-align: top;
    }

    label em,
    legend em {
        display: block;
        color: #666;
        font-size: 0.875em;
        font-style: italic;
        line-height: 1.45em;
    }

    legend em {
        position: absolute;
    }

    label strong,
    legend strong {
        display: block;
        color: #c00;
        font-size: 75%;
        font-weight: 700;
        font-style: italic;
        line-height: 1.45em;
    }

    legend strong {
        position: absolute;
        top: 1.4em;
    }

    /* Labels alignment right */
    .labels-alignment-right label,
    .labels-alignment-right .fieldset-subgroup legend,
    .labels-alignment-right.fieldset-subgroup legend {
        text-align: right;
    }

    /* Horizontal fieldset */
    fieldset.fieldset-horizontal {
        border-width: 0;
    }

    fieldset.fieldset-horizontal ol {
        padding: 0;
    }

    fieldset.fieldset-horizontal li {
        float: left;
        padding: 0;
        margin-right: 1em;
    }

    fieldset.fieldset-horizontal.label-below label {
        display: block;
        margin-left: 0;
        margin-top: 0.2em;
        font-size: 90%;
        color: #999;
        text-align: left;
    }

    fieldset.fieldset-horizontal label em {
        display: inline;
    }

    /* Subgroup fieldset */
    fieldset.fieldset-subgroup {
        margin-bottom: -2em;
        border-style: none;
    }

    fieldset.fieldset-subgroup legend {
        margin-left: 0;
        padding: 0;
        font-weight: 400;
        width: 13em;
    }

    fieldset.fieldset-subgroup ol {
        position: relative;
        top: -1.4em;
        margin: 0 0 0 14em;
        padding: 0;
    }

    fieldset.fieldset-subgroup li {
        padding: 0;
    }

    fieldset.fieldset-subgroup input + label {
        float: none;
        width: auto;
        display: inline;
        margin: 0 0 0 1em;
    }

    /* Labels as block; Labels displayed above or below the input fields */
    .labels-block label {
        display: block;
        float: none;
        margin: 0 0 0.5em;
        width: auto;
    }

    .labels-block input + label,
    .labels-block textarea + label {
        margin: 0.5em 0 0;
    }

    .labels-block fieldset.fieldset-subgroup,
    fieldset.labels-block.fieldset-subgroup {
        margin-bottom: 0;
    }

    .labels-block .fieldset-subgroup legend,
    .labels-block.fieldset-subgroup legend {
        width: auto;
    }

    .labels-block .fieldset-subgroup legend em,
    .labels-block.fieldset-subgroup legend em {
        position: relative;
    }

    .labels-block .fieldset-subgroup legend strong,
    .labels-block.fieldset-subgroup legend strong {
        position: relative;
        top: 0;
    }

    .labels-block .fieldset-subgroup ol,
    .labels-block.fieldset-subgroup ol {
        top: 0;
        margin: 0;
        padding: 0.5em 0 0;
    }


    /* Plugin "tx_felogin_pi1"
    ------------------------------ */
    .tx-felogin-pi1 div {
        line-height: 1.45em;
    }

    .tx-felogin-pi1 fieldset legend {
        padding: 1em 0 0.5em 0;
        font-weight: 700;
    }

    .tx-felogin-pi1 fieldset div {
        padding: 0 0 1em 0;
        clear: both;
    }

    .tx-felogin-pi1 fieldset div label {
        display: block;
        float: left;
        width: 120px;
    }


    /* Plugin "tx_indexedsearch"
    ------------------------------ */
    .tx-indexedsearch .tx-indexedsearch-searchbox fieldset {
        border: 0;
        padding: 0;
        margin: 0 0 30px 0;
    }

    .tx-indexedsearch .tx-indexedsearch-searchbox fieldset legend,
    .tx-indexedsearch .tx-indexedsearch-searchbox fieldset label {
        display: none;
    }

    .tx-indexedsearch .tx-indexedsearch-form {
        width: 100%;
        max-width: 600px;
        margin: 0 auto;
        display: flex;
        padding: 30px 0 15px;
    }

    .tx-indexedsearch .tx-indexedsearch-form input[type="text"] {
        width: 100%;
        border-right: 0;
    }

    /* Page Browser */
    .tx-indexedsearch .tx-indexedsearch-whatis,
    .tx-indexedsearch .tx-indexedsearch-browsebox {
        text-align: center;
        font-size: 0.8em;
    }

    .tx-indexedsearch .tx-indexedsearch-browsebox ul {
        list-style: none;
        padding: 0 0 30px 0;
        margin: 0;
        height: 1.5em;
        line-height: 1.5em;

    }

    .tx-indexedsearch .tx-indexedsearch-browsebox ul li {
        display: inline-block;
        margin: 0 5px;
        padding: 0;
    }

    .tx-indexedsearch .tx-indexedsearch-browsebox ul li a {
        text-decoration: none;
    }

    .tx-indexedsearch .tx-indexedsearch-browsebox ul li a:hover {
        font-weight: bold;
    }

    /* Results */
    .tx-indexedsearch .tx-indexedsearch-res .res {
        background: #fff;
        padding: 0 0 30px 0;
        border-bottom: 1px solid #ccc;
        margin: 0 auto 15px;
        font-size: 0.9rem;
        width: 100%;
        max-width: 800px;
    }

    .tx-indexedsearch .tx-indexedsearch-res .res h3 {
        font-size: 1.2rem;
        font-weight: bold;
    }

    .tx-indexedsearch .tx-indexedsearch-res .res a {
        text-decoration: none;
    }

    .tx-indexedsearch .tx-indexedsearch-res .tx-indexedsearch-info {
        padding: 0;
        font-weight: bold;
        font-style: italic;
        font-size: 0.8rem;
    }

    .tx-indexedsearch .tx-indexedsearch-res .tx-indexedsearch-info,
    .tx-indexedsearch .tx-indexedsearch-res .tx-indexedsearch-info a {
        color: #888;
    }

    .tx-indexedsearch .tx-indexedsearch-res dt {
        float: left;
        margin: 0 5px 0 0;
    }


}