@import url(/fileadmin/_templates/__multisite/ext/fluid_styled_content/Resources/Public/Css/fsc.css);

.ressort .ce-textpic {width: 100%; float: left; overflow: hidden; clear: none;}
.ressort .ce-textpic:nth-of-type(2) .ce-gallery { float: right; }
.ressort .ce-textpic:nth-of-type(3) .ce-gallery { float: left; }
.ressort .ce-textpic .ce-gallery {margin: 0; width: 50%}
.ressort .ce-textpic .ce-gallery .ce-column figure.image { margin-bottom:0 }
.ressort .ce-textpic .ce-bodytext {padding: 8px 6px 0 8px;}
.ressort .ce-textpic .ce-bodytext p {margin: 0; font-size: 11px;}
.ressort .ce-textpic h4 a { display: block; font-size: 15px; line-height: 12px;  color: #455e6e; margin-bottom: 5px;}
.ressort .ce-textpic h4 a:hover { color: #c20069;}
.ressort .ce-textpic h4 a:after {content: '\f054'; font: 500 20px var(--fontAwesome); color: #c20069; position: relative; top: 3px; padding-left: 8px}

/* Pfeile im Bild */
.ressort figure.image:after {content: ''; display: block; width: 0; height: 0; position: absolute; top: 24px; left: 0; border-style: solid; border-width: 20px 0 20px 19px; border-color: transparent transparent transparent white; }
.ressort .ce-textpic.ce-left .ce-gallery figure.image:after {border-width: 20px 19px 20px 0; border-color: transparent white transparent transparent; right: 0; left: unset; }
.ressort .ce-textpic:nth-of-type(2) .ce-gallery figure.image:after {border-width: 20px 0 20px 19px; border-color: transparent transparent transparent white; left: 0; right: unset; }
.ressort .ce-textpic:nth-of-type(3) .ce-gallery figure.image:after {border-width: 20px 19px 20px 0; border-color: transparent white transparent transparent; right: 0; left: unset; }

.ce-gallery figure.image * span.creator {top: 0; margin-top: -20px;}
.ce-gallery figcaption { font-size: 13px; margin-top:4px; }

.ce-bodytext a {margin-bottom: 4px}

/* Stadt- und Kreisverbaende */
#association .fsc-text {width: 100%; float: left;}

/* Downloads */
#downloads .ce-textpic .ce-bodytext p { margin: 0; }
#downloads .container>.col-xs-12>.col-xs-12.col-md-8>.ce-textpic.ce-left .ce-gallery {margin-right: 20px}

@media (min-width: 576px) {
    .ressort .ce-textpic .ce-bodytext {padding: 20px 20px 0 20px;}
    .ressort .ce-textpic h4 a { font-size: 20px; line-height: 16px; margin-bottom: 13px; }
    .ressort .ce-textpic h4 a:after {font-size: 28px; top: 4px; }
    .ressort .ce-textpic .ce-bodytext p { font-size: 15px;}
    .ressort .ce-textpic .ce-gallery .ce-column, .ressort .ce-textpic .ce-gallery .ce-column figure.image { width: 100%; }
}

@media (min-width: 768px) {
    /* Stadt- und Kreisverbaende */
    #association .fsc-text {width: 33.3333%;}
}

@media (min-width: 992px) {
    .ressort .ce-textpic {width: 50%;}
    .ressort .ce-textpic:nth-of-type(3) {clear: left; }
    .ressort .ce-textpic:nth-of-type(2) .ce-gallery { float: left; }
    .ressort .ce-textpic:nth-of-type(3) .ce-gallery { float: right; }
    .ressort .ce-textpic .ce-bodytext {padding: 10px 15px 0 15px;}
    .ressort .ce-textpic h4 a { font-size: 17px; margin-bottom: 6px; }
    .ressort .ce-textpic h4 a:after {font-size: 20px; top: 2px; }
    .ressort .ce-textpic .ce-bodytext p { font-size: 13px;}

    /* Pfeile im Bild */
    .ressort .ce-textpic:nth-of-type(2) .ce-gallery figure.image:after {border-width: 20px 19px 20px 0; border-color: transparent white transparent transparent; right: 0; left: unset; }
    .ressort .ce-textpic:nth-of-type(3) .ce-gallery figure.image:after {border-width: 20px 0 20px 19px; border-color: transparent transparent transparent white; left: 0; right: unset; }
}

@media (min-width: 1200px) {
    .ressort .ce-textpic .ce-bodytext {padding: 20px 20px 0 20px;}
    .ressort .ce-textpic h4 a { font-size: 23px; margin-bottom: 16px; }
    .ressort .ce-textpic h4 a:after {font-size: 33px; top: 4px; }
    .ressort .ce-textpic .ce-bodytext p { font-size: 15px;}
}