body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul,.content-gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li,.content-gallery>ul li{float:left}.ce_gallery>ul li.col_first,.content-gallery>ul li.col_first{clear:left}.float_left,.media--left>figure{float:left}.float_right,.media--right>figure{float:right}.block{overflow:hidden}.media{display:flow-root}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both}
@media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.audio_container audio{max-width:100%}.video_container video{max-width:100%;height:auto}.aspect,.responsive{position:relative;height:0}.aspect iframe,.responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%}.aspect--16\:9,.responsive.ratio-169{padding-bottom:56.25%}.aspect--16\:10,.responsive.ratio-1610{padding-bottom:62.5%}.aspect--21\:9,.responsive.ratio-219{padding-bottom:42.8571%}.aspect--4\:3,.responsive.ratio-43{padding-bottom:75%}.aspect--3\:2,.responsive.ratio-32{padding-bottom:66.6666%}
#colorbox,#cboxOverlay,#cboxWrapper{position:absolute;top:0;left:0;z-index:9999;overflow:hidden;-webkit-transform:translate3d(0,0,0)}#cboxWrapper{max-width:none}#cboxOverlay{position:fixed;width:100%;height:100%}#cboxMiddleLeft,#cboxBottomLeft{clear:left}#cboxContent{position:relative}#cboxLoadedContent{overflow:auto;-webkit-overflow-scrolling:touch}#cboxTitle{margin:0}#cboxLoadingOverlay,#cboxLoadingGraphic{position:absolute;top:0;left:0;width:100%;height:100%}#cboxPrevious,#cboxNext,#cboxClose,#cboxSlideshow{cursor:pointer}.cboxPhoto{float:left;margin:auto;border:0;display:block;max-width:none;-ms-interpolation-mode:bicubic}.cboxIframe{width:100%;height:100%;display:block;border:0;padding:0;margin:0}#colorbox,#cboxContent,#cboxLoadedContent{box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box}#cboxOverlay{background:#000;opacity:.9;filter:alpha(opacity = 90)}#colorbox{outline:0}#cboxContent{margin-top:20px;background:#000}.cboxIframe{background:#fff}#cboxError{padding:50px;border:1px solid #ccc}#cboxLoadedContent{border:5px solid #000;background:#fff}#cboxTitle{position:absolute;top:-20px;left:0;color:#ccc}#cboxCurrent{position:absolute;top:-20px;right:0;color:#ccc}#cboxLoadingGraphic{background:url(../../assets/colorbox/images/loading.gif) no-repeat center center}#cboxPrevious,#cboxNext,#cboxSlideshow,#cboxClose{border:0;padding:0;margin:0;overflow:visible;width:auto;background:0 0}#cboxPrevious:active,#cboxNext:active,#cboxSlideshow:active,#cboxClose:active{outline:0}#cboxSlideshow{position:absolute;top:-20px;right:90px;color:#fff}#cboxPrevious{position:absolute;top:50%;left:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top left;width:28px;height:65px;text-indent:-9999px}#cboxPrevious:hover{background-position:bottom left}#cboxNext{position:absolute;top:50%;right:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top right;width:28px;height:65px;text-indent:-9999px}#cboxNext:hover{background-position:bottom right}#cboxClose{position:absolute;top:5px;right:5px;display:block;background:url(../../assets/colorbox/images/controls.png) no-repeat top center;width:38px;height:19px;text-indent:-9999px}#cboxClose:hover{background-position:bottom center}
:root {
  /* https://www.fluid-type-scale.com/  14/300/1.125 /18/1200/1.125 */
--fs-xxs: clamp(0.61rem, 0.31vw + 0.56rem, 0.79rem);
--fs-xs: clamp(0.69rem, 0.35vw + 0.63rem, 0.89rem);
--fs-s: clamp(0.78rem, 0.4vw + 0.7rem, 1rem);
--fs-base: clamp(0.88rem, 0.44vw + 0.79rem, 1.13rem);
--fs-m: clamp(0.98rem, 0.5vw + 0.89rem, 1.27rem);
--fs-l: clamp(1.11rem, 0.56vw + 1rem, 1.42rem);
--fs-xl: clamp(1.25rem, 0.63vw + 1.13rem, 1.6rem);
--fs-xxl: clamp(1.4rem, 0.71vw + 1.27rem, 1.8rem);
--ffs-xxs: 0.75rem;
--ffs-xs: 0.8rem;
--ffs-s: 0.9rem;
--ffs-base: 1rem;
--ffs-m: 1.1rem;
--ffs-l: 1.2rem;
--ffs-xl: 1.3rem;
--ffs-xxl: 1.4rem;

--art-space: clamp(1.25rem, 4.29vw + 0.45rem, 3.13rem);
--color-txt: #474747;
--color-red: #d70825;
--color-dred: #9f071d;
}

html {
  scroll-behavior: smooth;
}

body {
  font-size: var(--fs-base );
  line-height: 1.5;
  font-family: Roboto,Ubuntu,sans-serif;
  color: var(--color-txt);
  min-width: 320px;
}


h1 {
  font-family: Roboto, Ubuntu, sans-serif;
  font-size: var(--fs-xxl);
  margin: 2rem 0 2rem 0;
  color: var(--color-txt);
  text-align: center;
  font-weight: 700;
}

h2 {
  font-family: Roboto, Ubuntu, sans-serif;
  font-size: var(--fs-l);
  margin: 1rem 0 0.5rem 0;
  hyphens: auto;
  color: var(--color-txt);
  font-weight: 600;
}

h3 {
  font-family: Roboto, Ubuntu, sans-serif;
  font-size: var(--fs-base);
  margin: 1.3rem 0 0.4rem 0;
  font-weight: 300;
  color: var(--color-txt);
  hyphens: auto;
}

h4 {
  font-size: var(--fs-base);
  color: #000;
  font-weight: 700;
  margin: 0 0 0.5rem 0;
}

p {
  font-size: var(--fs-base);
  margin: 0 0 0.75rem 0;
}

a,
a:hover,
a:visited {
  color: var(--color-dred);
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
   -khtml-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
   border-bottom: 2px solid transparent; 
}
a:hover,
a:focus {
  outline: none;
  border-bottom: 3px solid var(--color-red);
  color: var(--color-red);
}
figure {
  line-height: 0;
  overflow: hidden;
  border-radius: 8px;
}
figure a,
figure a:hover,
figure a:focus {
  border-bottom: 2px solid transparent; 
}
figcaption {
  font-size: var(--fs-xs);
  font-style: italic;
  line-height: 1.5;
}
.float_left, .media--left > figure {
	margin: 0 1vw 1vw 0;
}
.float_right, .media--right > figure {
	margin: 0 0 1vw 1vw;
}
@media only screen and (max-width: 767px) {
  .float_right, .media--right > figure,
  .float_left, .media--left > figure {
    float: none;
    margin: 0 auto 1rem auto;
    text-align: center;
    max-width: unset;
  }
}
img {
  width: 100%;
  height: auto;
}
table {
  border: 0;
  border-collapse: collapse;
}
tr, td {
  border: none;
  vertical-align: top;
}
td {
  padding: 2px 10px 2px 0;
}
ul {
  margin: 0;
  padding: 0 0 0 1.5rem;
}
li {
  margin: 0;
  padding: 0 0 0.4rem 0;
}
.art-space-bottom {
  margin-bottom: var(--art-space);
}
.no-art-space-bottom {
  margin-bottom: 5px !important;
}
.back {
  margin-bottom: var(--art-space);
}
.centertext {
  text-align: center;
}
.hide-empty .empty {
  display: none;
}
.content-hyperlink {
  margin-bottom: 1rem;
}
.arrowbefore::before {
  content: "\2192\00a0";
  color: var(--color-dred);
}
.back::after,
.arrowafter::after {
  content: "\00a0\2192";
  color: var(--color-dred);
}
li.download-element {
  padding: 0;
  list-style-type: none;
}
ul.download-element {
  padding: 0;
}
.content-youtube {
  max-width: 400px;
  margin: 0 auto var(--art-space) auto;
}
.content-youtube figure {
  overflow: visible;
  border-radius: 0;
}
.content-youtube.leftalign {
  margin: 0 1.5rem var(--art-space) 1.5rem;
}

.content-youtube .aspect iframe,
.content-youtube .responsive iframe {
  box-sizing: border-box;
}


/*wrapper*/
#main > div.inside {
  box-sizing: border-box;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
  margin-bottom: 0;
  max-width: 1200px;
  min-height: calc(100vh - 430px);
  padding: 10px 10px 10px 10px;
}


/* show_as_badges */
.show_as_badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  align-items: flex-start;
  gap: 30px;
} 
.show_as_badges > h2 {
  text-align: center;
  border-top: 1px solid #c0c0c0;
  padding-top: 10px;
  width: 100%;
}
.show_as_badges > div {
  position: relative;
  flex: 0 0 320px;
  max-width: 320px;
  margin-bottom: var(--art-space);
  overflow: visible;
  border: 1px solid #ccc;
  background-color: #fafafa;
  box-shadow: #ddd 0px 4px 20px 0px;
  border-radius: 8px;
  padding: 0 0 20px 0;
}
.show_as_badges .info {
  display: none;
  margin: 10px
}
.show_as_badges .layout_latest h2,
.show_as_badges .layout_short h2,
.show_as_badges .layout_teaser h2 {
  margin: 6px 10px 6px 10px;
  display: inline-block;
  font-weight: normal;
  color: var(--color-red);
  font-size: var(--ffs-l);
}
.show_as_badges .layout_latest .ce_text,
.show_as_badges .layout_teaser .ce_text > :not(figure) {
  margin: 0 10px 0 10px;
  hyphens: auto;
  font-size: var(--ffs-base);
}
.show_as_badges .layout_teaser .time {
  margin: 0 10px 0 10px;
  hyphens: auto;
  font-size: var(--ffs-base);
  color: #000;
}
.show_as_badges .layout_teaser .small p {
  font-size: var(--ffs-s);
}
.show_as_badges figcaption {
  display: none;
}
.show_as_badges figure {
  margin: 0 0 0.5rem 0;
  float: none;
  overflow: hidden;
  border-radius: 8px 8px 0 0 !important;
} 
.show_as_badges img {
  transition: 800ms cubic-bezier(0.4, 0, 0.2, 1);
  transform: translate3d(0,0,0);
}
.show_as_badges img:hover {
  scale: 1.05;
}
.show_as_badges .layout_latest .more,
.show_as_badges .layout_short .more,
.show_as_badges .layout_teaser .moretext {
  margin: 1rem 10px 0 10px;
  hyphens: auto;
  color: var(--color-red);
  font-size: var(--ffs-base);
}
.show_as_badges .location {
  font-size: var(--ffs-base);
  margin: 10px;
  hyphens: auto;
}
.show_as_badges .empty {
  padding: 1rem;
  text-align: center;
  font-style: italic;
}


/* show_as_stack */
.show_as_stack {
  display: flex;
  flex-direction: column;
}
.show_as_stack .layout_latest {
  margin: 0 0 var(--art-space) 0;
}
.show_as_stack .layout_latest .info {
  display: none;
}
.show_as_stack .layout_latest h2 {
  margin: 0 0 0.2rem 0;
  font-size: var(--fs-m);
  ffffont-weight: 300;
}
.show_as_stack .layout_latest h2 a {
  ccccolor: var(--color-txt);
  border-bottom: 2px solid transparent;
}
.show_as_stack .ce_text p {
  margin-bottom: 0;
}
.show_as_stack figure {
  max-width: 50%;
}
.show_as_stack img {
  transition: 800ms cubic-bezier(0.4, 0, 0.2, 1);
  transform: translate3d(0,0,0);
}
.show_as_stack img:hover {
  scale: 1.05;
}
.show_as_stack .more {
  margin-bottom: var(--art-space);
}
.show_as_stack figure.float_left ~ p.more {
  margin-left: calc(50% + 1rem);
}
.show_as_stack figure.float_right ~ h2,
.show_as_stack figure.float_right ~ div.ce_text,
.show_as_stack figure.float_right ~ p.more {
  text-align: right;
}
@media only screen and (max-width: 767px) {
  .show_as_stack figure {
    max-width: unset;
  }
  .show_as_stack figure.float_right ~ h2,
  .show_as_stack figure.float_right ~ div.ce_text,
  .show_as_stack figure.float_right ~ p.more {
    text-align: left;
  }
  .show_as_stack figure.float_left ~ p.more {
    margin-left: 0;
  }
}


/* show_as_details */
.show_as_details figure {
  margin: 2rem auto;
  float: none;
  max-width: 800px;
}
.show_as_details h1 {
  text-align: center;
  margin: 2rem 0 0 0;
}
.show_as_details .layout_full > .info,
.show_as_details .layout_full > h2 {
  display: inline-block;
  color: var(--color-txt);
  font-size: var(--fs-s);
  font-weight: normal;
  margin: 0.4rem 0 0.8rem 0;
}
.show_as_details time::after {
  content: " | ";
}
.show_as_details .back::after {
  content: " →";
  color: var(--color-red);
}


/* presenter */
.presenter.mod_article {
  margin: 0;
}
.presenter img {
  transition: 800ms cubic-bezier(0.4, 0, 0.2, 1);
  transform: translate3d(0,0,0);
}
.presenter a:hover img,
.presenter a:focus img,
.presenter .nodetails img:hover {
  scale: 1.05;
}
.presenter a:hover {
  border-bottom: 2px solid transparent;;
}
.presenter a .pseudolink {
  border-bottom: 2px solid transparent;
}
.presenter a:hover .pseudolink {
  border-bottom: 2px solid var(--color-red);
}
.presenter .moretext {
  text-align: right;
  margin: 8px;
}

/* mod article */
.mod_article {
  margin: 0 0 var(--art-space) 0;
}
.mod_article .content-text,
.mod_article .content-downloads {
  margin: 0 0 var(--art-space) 0;
}
.mod_article.nospace {
  margin: 0;
}
/* intro */
.mod_article .page-intro {
    text-align: center;
    max-width: 700px;
    margin: 2rem auto var(--art-space) auto;
}
.page-intro p {
  font-size: var(--fs-m);
}
.page-intro ul {
  padding: 0;
}


/*article-grid*/
.article-std {
  text-align: center;
}
.article-std ~ .article-std {
  margin-top: var(--art-space);
}
.article-std.media--right figure,
.article-std.media--left figure {
   margin: 0 auto 1rem auto;
   float: none;
   text-align: center;
   width:100%;
   max-width: 500px;
}
.article-std h2 {
  text-align: center;
  margin-top: 0;
}
@media only screen and (min-width: 768px) {
  .article-std.media {
    display: grid;
    grid-template-columns: repeat(12, minmax(0,1fr));
    grid-gap: 1.875rem;
  }
  .article-std.media--right h2 {
  	grid-area: 1 / 2 / span 1 / span 7;
  	text-align: right;
  	margin: 0;
  	align-self: flex-end;
  }
  .article-std.media--right .rte {
  	grid-area: 2 / 2 / span 1 / span 7;
  	text-align: right;
  }
  .article-std.media--right figure {
    grid-area: 1 / 9 / span 3 / span 4;
  	align-self: center  ;
  	margin:0;
  }
  .article-std.media--left h2 {
  	grid-area: 1 / 5 / span 1 / span 7;
  	text-align: left;
  	margin: 0;
  	align-self: flex-end;
  }
  .article-std.media--left .rte {
  	grid-area: 2 / 5 / span 1 / span 7;
  	text-align: left;
  }
  .article-std.media--left figure {
    grid-area: 1 / 1 / span 3 / span 4;
  	align-self: center  ;
  	margin: 0;
  }
}

/* gallery_list */
.gallery_list > div {
  flex: 0 0 240px;
  display: flex;
  flex-wrap: wrap;
}

.gallery_list > div figure {
  flex: 0 0 100%;
}

.gallery_list.show_as_badges .info,
.gallery_list.show_as_badges .moretext {
  font-size: var(--ffs-s);
  flex: 1 0 auto;
  display: block;
  margin: 0;
  padding: 0 10px;
  box-sizing: border-box;
}
.gallery_list.show_as_badges .moretext {
  flex: 0 1 auto;
}
.gallery_list.show_as_badges h2 {
  margin:0;
  padding: 10px 10px 0 10px;
  box-sizing: border-box;
  font-size: var(--fs-s);
  flex: 0 0 100%;
  white-space: wrap;
}


/* gallery_entry */
.gallery_entry h1 {
  margin-bottom: 1rem;
}
.gallery_entry .ce_text {
  text-align: center;
  margin-bottom: 1rem;
}
.gallery_entry .content-gallery > ul {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: space-around;
  align-items: flex-start;  
}
.gallery_entry .content-gallery > ul li {
  float: none;
}
.gallery_entry .back {
  margin-top: var(--art-space);
  text-align: center;
}


/* Events */
.event .headline {
  text-align: center;
}
.event .headline h1 {
  color: var(--color-red);
  margin: 3rem 0 0rem 0;
}
.event .eventteaser_text{
  text-align: center;
  color: #555;
}
.event .headline h2 {
  margin: 1rem 0 0 0;
}
.event > figure {
  float: none;
}
.event .details {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
}
.event .details > div {
  flex: 1 0 300px;
  max-width: 450px;
  min-width: 300px;
  padding-left: 0.5rem;
  margin: 0;
}
.event .details > div.g2,
.event .details .g2,
.event .details .mod_banner {
  flex: 2 1 600px;
  max-width: 1200px;
  min-width: 300px;
  padding-left: 0.5rem;  
}
.event .details > div.g3,
.event .details .g3 {
  flex: 3 1 900px;
  max-width: 1200px;
  min-width: 300px;
  border-left: 2px solid var(--color-dred);
  padding-left: 0.5rem;
}
.event .content-text,
.event .content-text p,
.event .content-gallery {
  font-size: var(--fs-s);
  margin-bottom: 0.4rem;
}
.mod_eventreader .content-text h3,
.mod_eventreader h3 {
  margin: 0;
  font-weight: 300;
  color: var(--color-red);
}
.mod_eventreader .content-text .rte {
  hyphens: auto;
}


/* mod_newslist */
.prs_liste .layout_latest {
  margin: var(--art-space) 0 0 0;
}
.prs_liste figure {
  float: left;
  margin: 0 20px 10px 0;
  max-width: 45%;
  overflow: hidden;
  border-radius: 8px 8px 8px 8px !important;
}
.prs_liste a {
  color: var(--color-txt);
}
.prs_liste h2 {
  color: var(--color-red);
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .prs_liste p:not(.moretext) {
    display: none;
  }
  .prs_liste h2 {
    color: var(--color-txt);
  }
}
.prs_liste a .moretext {
  color: var(--color-red);
  display: inline-block;
  margin-bottom: var(--art-space);
}
.prs_liste a .pseudolink {
  border-bottom: 2px solid transparent;
}
.prs_liste a:hover .pseudolink {
  border-bottom: 2px solid var(--color-red);
}
.prs_liste figure {

}
.prs_liste img {
  transition: 400ms cubic-bezier(0.4, 0, 0.2, 1);
  transform: translate3d(0,0,0);
}
.prs_liste a:hover img,
.prs_liste a:focus img,
.prs_liste .nodetails img:hover {
  scale: 1.05;
}


/* mod_newsreader */
.mod_newsreader figure {
  text-align: center;
}
.mod_newsreader h2 {
  color: var(--color-red);
}
.mod_newsreader .content-gallery > ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  gap: 20px;
}
.mod_newsreader .content-gallery > ul li {
  padding: 0;
  margin: 0;
  float:none;
}


/* grid_nnn */
.flex_300 {
  display: flex;
  flex-wrap: wrap;
  gap: 25px;
  justify-content: space-around;
  margin: 0 0 var(--art-space) 0;
}
.flex_300 > div {
  flex: 1 0 300px;
  max-width: 450px;
}
.flex_200 {
  display: flex;
  flex-wrap: wrap;
  gap: 25px;
  justify-content: space-around;
  margin: 0 0 var(--art-space) 0;
}
.flex_200 > div {
  flex: 1 0 160px;
  max-width: 300px;
}



.grid_two {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    grid-gap: 1.875rem;
}
.grid_two figure {
    text-align: center;
}
.grid_two h2 {
  align-self: start;
  justify-self: right;
}
@media only screen and (max-width: 767px) {
  .grid_two h2 {
    justify-self: center;
  }
}


.content-downloads.as_columns ul {
  display: flex;
  flex-wrap: wrap;
}
.content-downloads.as_columns li {
  flex: 0 1 50%;
  min-width: 300px;
}

/* Pagination */
.pagination {
  text-align: center;
}
.pagination ul {
  display: flex;
  margin: 0;
  padding: 0;
  justify-content: center;
  gap: 6px;
  font-size: var(--fs-s);;
}
.pagination li strong {
  border: 2px solid var(--color-red);
}
.pagination li a,
.pagination li a:hover {
  color: var(--color-red);
}
@media only screen and (max-width: 767px) {
  .pagination .first {
    display: none;
  }
  .pagination .last {
    display: none;
  }
}


/* Footer */
#footer {
  background-color: #474747;
  padding: var(--art-space) 10px 10px 10px;
  font-size: var(--fs-xs);
}

#footer .inside {
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
  margin-bottom: 0;
  max-width: 1200px;
  padding: 10px;
  box-sizing: border-box;
}
#footer .flex_200 {
  justify-content: space-between;
}
#footer .flex_200 > div {
  flex: 0 0 160px;
}

#footer p {
  font-size: var(--fs-xs);
  margin: 0 0 0.2rem 0;
  color: #ccc;
}

#footer .lastline {
  font-size: var(--fs-xxs);
  margin-top: 60px;
  text-align: center;
  color: #ccc;
}

#footer h2 {
    font-size: var(--fs-s);
    margin: 0 0 0.8rem 0;
    color: #ccc;
    font-weight: bold;
}

#footer a,
#footer a:hover,
#footer a:visited {
  color: #ccc;
  text-decoration: none;
  font-weight: normal;
  border-bottom: 2px solid transparent;
}

#footer a:hover,
#footer a:focus{
  color: #fff;
  border-bottom: 2px solid #fff;
}
:root {
  --logo-height: 100px;
  --logo-height-s: 70px;
}

.fixed-position  {
  position: fixed;
  left: 0;
  right: 0;
}

#main {
  margin-top: calc( var(--logo-height) );
  float: none;
}


/* header */
#header {
  position: fixed; 
  top: 0;
  left: 0;
  right: 0;
  padding: 10px;
  background-color: rgba(252,252,252,0.95);
  z-index: 10;
  font-size: clamp(1.1rem, 1.17vw + 0.44rem, 1.2rem);
  font-family: Roboto, Ubuntu, sans-serif;
  height: var(--logo-height);
  box-sizing: border-box;
  transition: height 0.4s;
  transform: translate3d(0,0,0);
  overflow: visible;
  border-bottom: 1px solid #d0d0d0;
}

#header.js_small {
  box-shadow: 0 3px 3px #aaa;
  height: var(--logo-height-s);
}

#header .inside {
  display: flex;
  justify-content: space-between;
  flex-wrap: nowrap;
  max-width: 1200px;
  margin: 0 auto;
  height: 100%;
}

#header .logo_btn {
  height: 100%;
  flex: 1 1 0;
  min-width: 20px;
}
#header .logo_btn img{
  height: 100%;
  object-fit: contain;
  width: auto;
}
.logo_btn a,
.logo_btn a:hover,
.logo_btn a:focus {
  border: none !important;
}

/* NAV */
nav > ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  height: 100%;
  gap: clamp(.8rem, 11.8519vw + -4.8889rem, 2rem);
}
nav li {
  text-align: center;
  padding: 0;
  margin: 0;
}
nav li a,
nav li strong {
  margin: 0;
  padding: 3px 8px;
  color: #000;
  font-weight: 500;
  color: var(--color-dred);
  display: block;
}
nav li a:hover,
nav li a:visited {
  color: var(--color-red);
  border-bottom: 3px solid var(--color-red);
}
nav .active a,
nav .trail a,
nav li strong{
  color: var(--color-red);
  border-bottom: 3px solid var(--color-red);
}

nav li.nav_framed a,
nav li.nav_framed strong {
  border: 2px solid  #9f071d;
  border-radius: 5px;
  background-color: #9f071d;
  color: #fff;
}
nav li.nav_framed a:hover,
nav li.nav_framed.active strong {
  border-color: var(--color-red);
  background-color: var(--color-red);
}
nav .nav_avatar figure {
  border-radius: 22px;
  border: 1px solid #c0c0c0;
} 
a:hover.nav_avatar,
a:focus.nav_avatar,
strong.nav_avatar {
  border-bottom: 2px solid transparent;
}
a:hover.nav_avatar figure,
strong.nav_avatar figure {
  box-shadow: 0 0 1px 2px var(--color-red);
}



/* NAV Desktop */
.nav_toggler {
  display: none;
  align-items: center;
}

/* NAV Mobile */
@media only screen and (max-width: 767px) {
  .nav_toggler {
    display: flex;
  }
  .nav_main {
    order:3;
    width: 100%;
    flex: none;
    height: 0;
    display: none;
    font-size: var(--fs-l);
  }
  .nav_main.menu--open {
    height: calc(100vh - var(--logo-height) + 10px);
    display: block;
    background-color: #fff;
    margin-left: -10px;
    margin-right: -10px;
    width: calc(100% + 20px);
  }
  .nav_main > ul {
    flex-direction: column;
    justify-content: flex-start;
    width: 100%;
    padding-top: 3rem;
  }
  .nav_main li {
    text-align: center;
    height: 5rem;
  }
  nav .nav_avatar {
    order: -1;
  }
  #header.menu--open .inside {
    flex-wrap: wrap;
  }
}

/* Definition Mobilemenu Button */
.nav_toggler_btn {
  border: none;
  background: none;
  padding: 10px;
  font-size: 1.25rem;
  cursor: pointer;
  border: none;
  white-space: nowrap;
}

.nav_toggler_btn.menu--open {
  color: #d70825;
}

.toggler_icon {
  display: inline-block;
  height: 1.25rem;
  width: 1.25rem;
}

.toggler_icon_inner,
.toggler_icon .toggler_icon_inner::before,
.toggler_icon .toggler_icon_inner::after {
  background-color: currentcolor;
  width: 100%;
  height: 2px;
  position: relative;
  left:0;
  top: 50%;
  display:block;
}

.toggler_icon .toggler_icon_inner::before {
  content: '';
  top: -8px;
}

.toggler_icon .toggler_icon_inner::after {
  content: '';
  top: +6px;
}

.menu--open .toggler_icon .toggler_icon_inner::before {
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
  top: 0;
}

.menu--open .toggler_icon .toggler_icon_inner {
  -webkit-transform: rotate(+45deg);
  transform: rotate(+45deg);
  top: +10px;
}

.menu--open .toggler_icon_inner::after {
  opacity: 0;
}


/* NAV Main Subnavigation */
.nav_sub {
  margin-bottom: 10px;
  padding-top: 10px;
}
.nav_sub > ul {
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  font-size: clamp(0.8rem, 0.65rem + 0.48vw, 0.95rem);
  font-family: "Lucida Grande","Lucida Sans Unicode",Verdana,sans-serif;
}

/*QuickNav */
.mod_quicknav {
  height: 50px;
}
.ce_form{
	padding: 0 20px 0 20px;
}
.formbody {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 30px;
	margin: 0 auto var(--art-space) auto;
	max-width: 900px;
	border: 1px solid #ccc;
	border-radius: 8px;
	box-shadow: #bbb 0px 4px 10px 0px;
	padding: 0 30px 30px 30px;
	box-sizing: border-box;
}
.formbody .widget {
	flex: 1 1 360px;
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: stretch;
}
.formbody .widget.fullwidth,
.formbody .widget-submit,
.formbody .widget-checkbox {
	flex: 0 0 100%;
	margin-top: 20px;
}
.formbody .widget-submit button{
	align-self: center;
}
.formbody input,
.formbody textarea {
	border: 1px solid #6e0514;
	border-radius: 5px;
	padding: 13px 8px;
	box-sizing: border-box;

}
.formbody textarea {
	resize: vertical;
}
.formbody input:focus,
.formbody textarea:focus,
.formbody select:focus{
	outline: none;
	box-shadow: 0 0 3px 2px #aaa;
}
.formbody select {
	padding: 11px 8px;
}
.formbody .error {
	color: red;
}
.formbody p.error {
	font-size: var(--fs-s);
}
.formbody button {
	font-size: var(--fs-base);
	background-color: #9f071d;
	color: #fff;
	border-radius: 5px;
	border: 1px solid #9f071d;
	padding: 5px 15px;
	cursor: pointer;
	line-height: 1.8rem;
	font-family: "Lucida Grande","Lucida Sans Unicode",Verdana,sans-serif;
}
.formbody button:hover {
	background-color: var(--color-red);
	border: 1px solid var(--color-red);
}
.formbody fieldset {
	border: none;
	text-align: center;
}
.formbody fieldset.radio_container {
	text-align: left;
	display: flex;
    flex-direction: column;
    position: relative;
	padding: 0.5em 0;
	margin-top: 1.5em;
	border: 1px solid #6e0514;
	border-radius: 5px;
}
.formbody fieldset.radio_container legend {
	position: absolute;
	top: -1.3em;
	left: -0.2em;
	padding: 0;
	line-height: 1;
}
.formbody fieldset.radio_container span {
	margin: 0 0 0 10px;
	font-size: var(--fs-s);
}
.formbody.content-hyperlink {
	margin-bottom: 0;
	padding: 0 0 0.5rem 0;
}
.mod_lostPasswordNotificationCenter {
	text-align: center;
}
.tl_confirm {
	background-color: #d1ffb3;
	padding: 13px 8px;
	text-align: center;
}
.tl_error {
	background-color: #ffb3b3;
	padding: 13px 8px;
	text-align: center;
}
.login_info {
	margin: 0 auto;
	text-align: center;
}

/* overrides for one_col */
.one_col .formbody {
	max-width: 400px;
}

/* form for comments */
.ce_comments .widget-textarea {
	flex: 0 0 100%;
	overflow: auto;
	resize: vertical;
}
.ce_comments h3 {
	font-size: var(--fs-m);
	font-weight: 700;
}
.ce_comments h3 ~ h3 {
	max-width: 900px;
	margin: 2rem auto 0 auto;
}
.comment_default {
	border-top: 1px solid #aaa;
	padding-top: 6px;
	padding-bottom: 6px;
	background-color: #fafafa;
}
.comment_default .info {
	font-size: var(--fs-s);
	color: #aaa;
}
.comment {
	margin-left: 20px;
}
.ce_comments .formbody div:nth-of-type(1),
.ce_comments .formbody div:nth-of-type(2),
.ce_comments .formbody div:nth-of-type(3) {
	display: none;
}
/* Extension Counter */
.counter_block {
  display: flex;
  flex-wrap: wrap;
  gap: 50px;
  justify-content: center;
  margin: 0 0 var(--art-space) 0;
}

.ce_count_up {
  flex: 0 0 80px;
  text-align: center;
  color: var(--color-red);
  font-size: var(--fs-m);
  font-weight: 700;
  height: 113px;
  line-height: 113px;
  background-size: contain ;
  background-repeat: no-repeat;
  background-position: center top;
}

.cnt_founded {
  background-image: url("../../files/mcg-themes/images/cnt_founded.png");
}
.cnt_singers {
  background-image: url("../../files/mcg-themes/images/cnt_singers.png");
}
.cnt_members {
  background-image: url("../../files/mcg-themes/images/cnt_members.png");
}
.cnt_youngest {
  background-image: url("../../files/mcg-themes/images/cnt_youngest.png");
}
.cnt_oldest {
  background-image: url("../../files/mcg-themes/images/cnt_oldest.png");
}

/* Extension Banner */
.mod_banner {
  margin-bottom: var(--art-space);
  text-align: left;
}
.mod_banner figure {
  display: inline-block;
  margin: 0 2rem 0 0;
  border-radius: 0;
  line-height: 1.5;
}
.banner_image {
  max-width: 150px;
  height: 60px;
  margin-bottom: 1rem;
}
.banner_image img {
  width: auto;
  height: 100%;
  object-fit: contain;
}
.mod_banner figcaption {
  display: none;
}
.mod_banner .banner_text {
  font-size: var(--fs-s);;
}


/*filterizr Liedersammlung */
.filtr-controls-custom {
  display: flex;
  flex-direction: column;
  max-width: 400px;
  margin: 0 auto;
}
.filtr-controls-custom .widget {
  display: flex;
  flex-direction: column;
  margin-bottom: 6px;
}
.filtr-controls-custom .widget-category {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  gap: 20px;
  margin-bottom: 50px;
}
.filtr-controls-custom input {
	border: 1px solid #6e0514;
	border-radius: 5px;
	padding: 13px 8px;
	box-sizing: border-box;
}
.filtr-controls-custom input:focus {
  outline: none;
}
.filtr-controls-custom a {
  color: #000;
}
.filtr-controls-custom a.active {
  border-bottom: 2px solid var(--color-red);
  color: var(--color-red);
}
.filtr-controls-custom a:hover {
  border-bottom: 2px solid var(--color-red);
  color: var(--color-red);
}
.filter-container {
  padding: 0 !important;
}
.filtr-item {
  list-style-type: none;
  width: 50%;
  display: flex;
  padding: 0;
  align-items: center;
  line-height: 1;
  gap: 10px;
}
@media only screen and (max-width: 767px) {
  .filtr-item {
    width: calc(100% - 20px);
  }
}

.filtr-item a {
    color: var(--color-txt);
    margin: 0 5px 0 0;
    padding: 0;
    font-size: 1rem;
}
.filtr-item a:hover {
    color: var(--color-red);
}

/*audio buttons*/
.kat_button {
  padding-top: 0;
  border-bottom: 2px solid transparent;
  cursor: pointer;
}
.kat_button:hover {
  filter: brightness(0) saturate(100%) invert(23%) sepia(82%) saturate(5771%) hue-rotate(343deg) brightness(81%) contrast(111%);
  border-bottom: 2px solid transparent;
}
.kat_button.active {
  filter: brightness(0) saturate(100%) invert(23%) sepia(82%) saturate(5771%) hue-rotate(343deg) brightness(81%) contrast(111%);
  border-bottom: 2px solid transparent;
}
.kat_button img {
  content:  url(/files/mcg-themes/images/btn_play.svg);
}
.kat_button.active img {
  content:  url(/files/mcg-themes/images/btn_pause.svg);
}

/* add ons audio_download */
.audio_download {
  display: flex;
  gap: 10px;
  margin-bottom: 0.5rem;
  line-height: 1;
  align-items: center;
}
.audio_download a {
  color: var(--color-txt);
}
.audio_download a:hover {
  color: var(--color-red);
}
/* Member Extensio Bundle (Profilbild) */
.mod_avatar {
  text-align: center;
  margin: 0 auto 30px auto;
}
.mod_avatar figure {
  overflow: hidden;
  display: inline-block;
  border-radius: 70px;
  border: 1px solid #ddd;
}

/* Member Liste */
.mod_memberList {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  gap: 30px;
}
.member_list_default {
  display: flex;
  flex-direction: row;
  box-sizing: border-box;
  border: 1px solid #ccc;
  box-shadow: #ddd 0 4px 20px 0;
  border-radius: 5px;
}
.member_list_default ul {
  padding: 5px 10px 5px 10px;
  width: 220px;
}

.member_list_default figure {
  border-radius:  0;
  width: 120px;
  height: 160px;
}
.member_list_default img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.member_list_default li {
  list-style-type: none;
  font-size: var(--fs-xs);
  padding: 0;
  white-space: nowrap;
  overflow: hidden;
}
.member_list_default li span {
  display: none;
}
.member_list_default .firstname,
.member_list_default .lastname,
.member_list_default .postal,
.member_list_default .city {
  display: table-cell;
  padding-right: 5px;
}
.member_list_default .firstname,
.member_list_default .lastname {
  font-weight: 700;
}

/* timeline */
.ba_timeline {
  padding: 0 1rem 0 1rem;
}
.ba_timeline .timeline-box {
  border-left: 3px solid var(--color-red);
  box-sizing: border-box;
  padding: 0 0 0 3rem;
}
.ba_timeline .content-text {
  transition: margin-left 1s ease-in-out, opacity 1s ease-in;
  width: 100%; 
  margin: 0;
}
.ba_timeline h2 {
  background-image: url("/files/mcg-themes/images/timeline_dot_l.png");
  background-repeat: no-repeat;
  background-position: left center;
  padding: 0 0 0 calc(3rem + 7px);
  margin: 0 0 0 calc(-3rem - 7px);
  color: var(--color-red);
}
.ba_timeline .rte {
  padding: 0 0 4rem 0;
}
.ba_timeline p {
  hyphens: auto;
  margin: 0 0 0.25rem 0;
}
.ba_timeline figure  {
  max-width: 35%;
  margin: 0 0 0.5rem 1rem;
  float: right;
}
.ba_timeline figure img {
  border-radius: 8px;
  width:auto;
  height: auto;
}
.ba_timeline.type_person figure {
  margin: 0 1rem 0.5rem 0;
  float: left;
}
.ba_timeline.type_person figure {
  margin: 0 1rem 0.5rem 0;
  float: left;
}
.ba_timeline figcaption {
  font-size: var(--fs-xxs);
}
.ba_timeline.type_person h3 {
  margin: 0 0 0 0;
  font-weight: 700;
  color: var(--color-txt);
}
.ba_timeline.type_person h4 {
  margin: 0 0 0 0;
  font-weight: normal;
  color: var(--color-txt);
  font-style: italic;
}
.ba_timeline.type_person .rte {
  margin: 1rem 0 0 0;
  transition: opacity 2s ease-in-out;
  transform: translate3d(0,0,0);
}
.is_outband .content-text {
  margin-left: 100%;
  opacity: 0;
}

@media only screen and (min-width: 768px) {
  .center_wide .timeline-box {
    margin-left: 50%;
    width: 50%;
  }
  .center_wide:nth-child(2n) .timeline-box  {
    width: calc(50% + 3px);
    padding: 0 3rem 0 0;
    margin-left: 0;
    text-align: right;
    border-right: 3px solid var(--color-red);
    border-left:none;
  }
  .center_wide:nth-child(2n) h2 {
    background-image: url("/files/mcg-themes/images/timeline_dot_r.png");
    background-position: right center;
    margin: 0 calc(-3rem - 7px) 0 0;
    padding: 0 calc(3rem + 7px) 0 0;
  }
  .center_wide:nth-child(2n) figure {
    float: left;
    margin: 0 1rem 0.5rem 0;
    text-align: left;
  }
  .center_wide.is_outband:nth-child(2n) .content-text  {
    margin-left: -100%;
  }
}


/* roboto-100 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  src: url('../../files/mcg-themes/fonts/roboto-v32-latin-100.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-100italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 100;
  src: url('../../files/mcg-themes/fonts/roboto-v32-latin-100italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('../../files/mcg-themes/fonts/roboto-v32-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-300italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 300;
  src: url('../../files/mcg-themes/fonts/roboto-v32-latin-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('../../files/mcg-themes/fonts/roboto-v32-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 400;
  src: url('../../files/mcg-themes/fonts/roboto-v32-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url('../../files/mcg-themes/fonts/roboto-v32-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-500italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 500;
  src: url('../../files/mcg-themes/fonts/roboto-v32-latin-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('../../files/mcg-themes/fonts/roboto-v32-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 700;
  src: url('../../files/mcg-themes/fonts/roboto-v32-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  src: url('../../files/mcg-themes/fonts/roboto-v32-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-900italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 900;
  src: url('../../files/mcg-themes/fonts/roboto-v32-latin-900italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}




