@charset "UTF-8";
/*-- Variablen --*/
/* orange */
/* blau */
/* magenta */
/* grün */
/* hellgrau */
/* dunkelgrau */
/* mittelgrau */
/* Document
 * ========================================================================== */
/**
 * 1. Add border box sizing in all browsers (opinionated).
 * 2. Backgrounds do not repeat by default (opinionated).
 */
*,
::before,
::after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box; /* 1 */
  background-repeat: no-repeat; /* 2 */
}

/**
 * 1. Add text decoration inheritance in all browsers (opinionated).
 * 2. Add vertical alignment inheritance in all browsers (opinionated).
 */
::before,
::after {
  text-decoration: inherit; /* 1 */
  vertical-align: inherit; /* 2 */
}

/**
 * 1. Use the default cursor in all browsers (opinionated).
 * 2. Change the line height in all browsers (opinionated).
 * 3. Breaks words to prevent overflow in all browsers (opinionated).
 * 4. Use a 4-space tab width in all browsers (opinionated).
 * 5. Remove the grey highlight on links in iOS (opinionated).
 * 6. Prevent adjustments of font size after orientation changes in iOS.
 */
:where(:root) {
  cursor: default; /* 1 */
  line-height: 1.5; /* 2 */
  overflow-wrap: break-word; /* 3 */
  -moz-tab-size: 4; /* 4 */
  -o-tab-size: 4;
     tab-size: 4; /* 4 */
  -webkit-tap-highlight-color: transparent; /* 5 */
  -webkit-text-size-adjust: 100%; /* 6 */
  -moz-text-size-adjust: 100%;
   -ms-text-size-adjust: 100%;
       text-size-adjust: 100%; /* 6 */
}

/* Sections
 * ========================================================================== */
/**
 * Remove the margin in all browsers (opinionated).
 */
:where(body) {
  margin: 0;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Edge, Firefox, and Safari.
 */
:where(h1) {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
 * ========================================================================== */
/**
 * Remove the margin on nested lists in Chrome, Edge, and Safari.
 */
:where(dl, ol, ul) :where(dl, ol, ul) {
  margin: 0;
}

/**
 * 1. Correct the inheritance of border color in Firefox.
 * 2. Add the correct box sizing in Firefox.
 */
:where(hr) {
  color: inherit; /* 1 */
  height: 0; /* 2 */
}

/**
 * Remove the list style on navigation lists in all browsers (opinionated).
 */
:where(nav) :where(ol, ul) {
  list-style-type: none;
  padding: 0;
}

/**
 * Prevent VoiceOver from ignoring list semantics in Safari (opinionated).
 */
:where(nav li)::before {
  content: "​";
  float: left;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 * 3. Prevent overflow of the container in all browsers (opinionated).
 */
:where(pre) {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
  overflow: auto; /* 3 */
}

/* Text-level semantics
 * ========================================================================== */
/**
 * Add the correct text decoration in Safari.
 */
:where(abbr[title]) {
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
:where(b, strong) {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
:where(code, kbd, samp) {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */
:where(small) {
  font-size: 80%;
}

/* Embedded content
 * ========================================================================== */
/*
 * Change the alignment on media elements in all browsers (opinionated).
 */
:where(audio, canvas, iframe, img, svg, video) {
  vertical-align: middle;
}

/**
 * Remove the border on iframes in all browsers (opinionated).
 */
:where(iframe) {
  border-style: none;
}

/**
 * Change the fill color to match the text color in all browsers (opinionated).
 */
:where(svg:not([fill])) {
  fill: currentColor;
}

/* Tabular data
 * ========================================================================== */
/**
 * 1. Collapse border spacing in all browsers (opinionated).
 * 2. Correct table border color in Chrome, Edge, and Safari.
 * 3. Remove text indentation from table contents in Chrome, Edge, and Safari.
 */
:where(table) {
  border-collapse: collapse; /* 1 */
  border-color: currentColor; /* 2 */
  text-indent: 0; /* 3 */
}

/* Forms
 * ========================================================================== */
/**
 * Remove the margin on controls in Safari.
 */
:where(button, input, select) {
  margin: 0;
}

/**
 * Correct the inability to style buttons in iOS and Safari.
 */
:where(button, [type=button i], [type=reset i], [type=submit i]) {
  -webkit-appearance: button;
}

/**
 * Change the inconsistent appearance in all browsers (opinionated).
 */
:where(fieldset) {
  border: 1px solid #a0a0a0;
}

/**
 * Add the correct vertical alignment in Chrome, Edge, and Firefox.
 */
:where(progress) {
  vertical-align: baseline;
}

/**
 * 1. Remove the margin in Firefox and Safari.
 * 3. Change the resize direction in all browsers (opinionated).
 */
:where(textarea) {
  margin: 0; /* 1 */
  resize: vertical; /* 3 */
}

/**
 * 1. Correct the odd appearance in Chrome, Edge, and Safari.
 * 2. Correct the outline style in Safari.
 */
:where([type=search i]) {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Safari.
 */
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/**
 * Correct the text style of placeholders in Chrome, Edge, and Safari.
 */
::-webkit-input-placeholder {
  color: inherit;
  opacity: 0.54;
}

/**
 * Remove the inner padding in Chrome, Edge, and Safari on macOS.
 */
::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style upload buttons in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
 * ========================================================================== */
/*
 * Add the correct styles in Safari.
 */
:where(dialog) {
  background-color: white;
  border: solid;
  color: black;
  height: -moz-fit-content;
  height: -webkit-fit-content;
  height: fit-content;
  left: 0;
  margin: auto;
  padding: 1em;
  position: absolute;
  right: 0;
  width: -moz-fit-content;
  width: -webkit-fit-content;
  width: fit-content;
}

:where(dialog:not([open])) {
  display: none;
}

/*
 * Add the correct display in Safari.
 */
:where(details > summary:first-of-type) {
  display: list-item;
}

/* Accessibility
 * ========================================================================== */
/**
 * Change the cursor on busy elements in all browsers (opinionated).
 */
:where([aria-busy=true i]) {
  cursor: progress;
}

/*
 * Change the cursor on disabled, not-editable, or otherwise
 * inoperable elements in all browsers (opinionated).
 */
:where([aria-disabled=true i], [disabled]) {
  cursor: not-allowed;
}

/*
 * Change the display on visually hidden accessible elements
 * in all browsers (opinionated).
 */
:where([aria-hidden=false i][hidden]) {
  display: initial;
}

:where([aria-hidden=false i][hidden]:not(:focus)) {
  clip: rect(0, 0, 0, 0);
  position: absolute;
}

@font-face {
  font-family: "Noto Sans";
  src: url("../../files/layout/fonts/NotoSans-VariableFont_wdth-wght.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Noto Sans";
  src: url("../../files/layout/fonts/NotoSans-Italic-VariableFont_wdth-wght.woff2") format("woff2");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "icomoon-cantare";
  src: url("../../files/layout/fonts/icomoon-cantare.woff?ap0nzm") format("woff"), url("../../files/layout/fonts/icomoon-cantare.svg?ap0nzm#icomoon-cantare") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
.grid-2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 0 auto 5em;
}
.grid-2 > * {
  width: 49%;
}
.grid-2 .ce_accordion {
  padding: 0;
  margin: 0;
}

.grid-3 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 0 auto 5em;
}
.grid-3 > * {
  width: 32%;
}
.grid-3 .ce_accordion {
  padding: 0;
  margin: 0;
}

.grid-4 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 0 auto 5em;
}
.grid-4 > * {
  width: 23%;
}
.grid-4 .ce_accordion {
  padding: 0;
  margin: 0;
}

html, body {
  font-family: "Noto Sans", sans-serif, sans-serif;
  color: #777980;
  font-size: 0.95rem;
  line-height: 1.8rem;
}

[class^=icon-], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icomoon-cantare" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

p {
  margin-bottom: 1.3em;
}
p .orange {
  color: #ff9c00;
}
p .blau {
  color: #4ea5d6;
}
p .magenta {
  color: #d04dcc;
}
p .gruen {
  color: #abc037;
}

strong {
  font-weight: 700;
}

i {
  font-style: italic;
}

h1, h2, h3, h4 {
  line-height: 1.1;
}

h1 {
  font-weight: 400;
  font-size: 250%;
  border-bottom: 1px solid;
  padding: 0 0 0.3em 0;
  margin: 0 0 1em;
}

h2 {
  font-weight: 400;
  font-size: 200%;
  margin: 2em 0 0.7em;
}

h3 {
  font-weight: 700;
  text-transform: uppercase;
  font-size: 150%;
  margin: 1.8em 0 0.3em;
}

h4 {
  font-weight: 700;
  margin: 1em 0 0;
}

h1 + h2, h1 + h3, h1 + h4, h2 + h3, h2 + h4, h3 + h4 {
  margin-top: 0;
}

a {
  text-decoration: none;
  -webkit-transition: all ease 0.3s;
  transition: all ease 0.3s;
}
a:link, a:visited {
  color: #777980;
  font-style: italic;
}
a:hover {
  color: #b8b8b8;
}

main a:before {
  content: "»";
  padding-right: 0.2em;
}

figure a:before {
  display: none;
}

hr {
  margin: 3em 0;
}

.menschliches a, .menschliches h1, .menschliches h2, .menschliches h3 {
  color: #ff9c00;
}
.menschliches a:hover {
  color: #dd8700;
}
.menschliches hr {
  border-color: #ff9c00;
}

.musikalisches a, .musikalisches h1, .musikalisches h2, .musikalisches h3 {
  color: #4ea5d6;
}
.musikalisches a:hover {
  color: #1888c9;
}
.musikalisches hr {
  border-color: #4ea5d6;
}

.bildliches a, .bildliches h1, .bildliches h2, .bildliches h3 {
  color: #d04dcc;
}
.bildliches a:hover {
  color: #c82cc2;
}
.bildliches hr {
  border-color: #d04dcc;
}

.verbindliches a, .verbindliches h1, .verbindliches h2, .verbindliches h3 {
  color: #abc037;
}
.verbindliches a:hover {
  color: #98b103;
}
.verbindliches hr {
  border-color: #abc037;
}

[class^=icon-], [class*=" icon-"] {
  margin-right: 0.5em;
}

.content-text ul {
  list-style: disc;
  margin: 0.5em 0 1.3em 2em;
  padding: 0;
}
.content-text li {
  padding-left: 0.5em;
}

/*#################################################
################## TABELLE ########################
#################################################*/
table {
  width: 100%;
  border-collapse: unset;
}
table .even {
  background: #ccc;
}
table th {
  font-weight: 700;
  text-align: left;
}
table th, table td {
  padding: 0.3em 0.7em;
}

.repertoire td, .repertoire th {
  width: 50%;
}

.icon-menu2:before {
  content: "\e902";
}

.icon-image:before {
  content: "\e942";
}

.icon-phone:before {
  content: "\ea1c";
}

.icon-email:before {
  content: "\ea34";
}

.icon-printer:before {
  content: "\ea6a";
}

.icon-home:before {
  content: "\e900";
}

.icon-location:before {
  content: "\ea39";
}

.icon-clock:before {
  content: "\ea4f";
}

.icon-calendar:before {
  content: "\ea60";
}

.icon-quotes-left:before {
  content: "\eb1b";
}

.icon-quotes-right:before {
  content: "\eb1c";
}

.icon-search:before {
  content: "\eb30";
}

.icon-menu:before {
  content: "\ec71";
}

.icon-link:before {
  content: "\ec9b";
}

.icon-arrow-up:before {
  content: "\edb7";
}

.icon-arrow-right:before {
  content: "\edbb";
}

.icon-arrow-down:before {
  content: "\edbf";
}

.icon-arrow-left:before {
  content: "\edc3";
}

.icon-facebook:before {
  content: "\eeef";
}

.icon-twitter:before {
  content: "\eef5";
}

.icon-vimeo:before {
  content: "\eeff";
}

.icon-linkedin:before {
  content: "\ef29";
}

.icon-clapboard-play:before {
  content: "\e959";
}

.icon-graduation:before {
  content: "\e99a";
}

.icon-bubbles4:before {
  content: "\eac9";
}

.icon-user:before {
  content: "\eaf7";
}

.icon-menu3:before {
  content: "\ec73";
}

.icon-info2:before {
  content: "\ed64";
}

.icon-spotify:before {
  content: "\eef3";
}

.icon-youtube:before {
  content: "\eefc";
}

.icon-flickr:before {
  content: "\ef03";
}

.icon-soundcloud:before {
  content: "\ef22";
}

.icon-headphones:before {
  content: "\e948";
}

.icon-file-pdf:before {
  content: "\ef3e";
}

.icon-file-word:before {
  content: "\ef40";
}

.icon-file-excel:before {
  content: "\ef41";
}

.icon-ticket:before {
  content: "\e9f9";
}

.icon-up:before {
  content: "\e901";
}

.icon-info-circle:before {
  content: "\f05a";
}

.icon-play-circle:before {
  content: "\f144";
}

/*#################################################
################## Turn off native styling ########
#################################################*/
textarea, button,
input[type=text],
input[type=button],
input[type=password],
input[type=search],
input[type=number],
input[type=tel],
input[type=email],
input[type=submit] {
  -webkit-appearance: none;
  border-radius: 0;
}

/*#################################################
################## Core styling ###################
#################################################*/
textarea, button,
input[type=text],
input[type=button],
input[type=password],
input[type=number],
input[type=search],
input[type=tel],
input[type=email],
input[type=submit] {
  font-family: "Noto Sans", sans-serif;
  font-weight: 400;
  border: none;
  width: 100%;
  padding: 0.7em 1em;
  background: #fff;
  font-size: 90%;
}

/*#################################################
################## Custom styling #################
#################################################*/
.formbody {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 0.5em;
  background: #ccc;
  margin: 0 auto;
}
.formbody > div {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  margin: 1em;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}
.formbody label {
  display: none;
}
.formbody fieldset {
  border: 0;
  padding: 0;
  margin: 0;
  min-width: 0;
  background-color: #fff;
  padding: 2.5em 2em 1em;
  position: relative;
}
.formbody fieldset legend {
  position: absolute;
  top: 0.7em;
  left: 2em;
}
.formbody fieldset span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.formbody fieldset span.invisible, .formbody fieldset span.mandatory {
  display: none;
}
.formbody fieldset span input {
  margin-right: 0.5em;
}
.formbody fieldset span label {
  display: block;
}
.formbody textarea {
  display: block;
  height: 90px;
}
.formbody .widget-textarea {
  width: 100%;
}
.formbody .widget-submit button {
  background-color: #abc037;
  color: #fff;
  cursor: pointer;
  -webkit-transition: background-color 0.5s ease;
  transition: background-color 0.5s ease;
  font-size: 100%;
  width: auto;
}
.formbody .widget-submit button:hover {
  background-color: #7b980c;
}

/*#################################################
################## Suche ##########################
#################################################*/
.mod_search .formbody fieldset {
  padding: 0.5em 2em;
}
.mod_search .formbody .widget-text input {
  height: 100%;
}
.mod_search .formbody .widget-submit {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}
.mod_search .relevance, .mod_search .url {
  font-size: 0.8rem;
  color: #aaa;
  margin: 0 0 2em;
}
.mod_search mark {
  background-color: transparent;
  font-weight: bold;
}

.invisible {
  display: none;
}

/*#################################################
################## MENÜ STARTSEITE ################
#################################################*/
.nav_startseite {
  margin-bottom: 3em;
}
.nav_startseite .level_1 {
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 30px;
}
.nav_startseite .level_1 li {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border: 2px solid #fff;
  border-radius: 67px 0 67px 0;
  text-align: left;
  font-weight: 700;
  position: relative;
  padding: 40px 15% 140px;
  text-transform: lowercase;
  overflow: hidden;
}
.nav_startseite .level_1 li::before {
  position: absolute;
  bottom: 30px;
  left: 0;
}
.nav_startseite .level_1 li a {
  color: #fff;
  font-size: 1.3rem;
  font-style: normal !important;
  letter-spacing: 0.05em;
  border-bottom: 1px solid;
  margin-bottom: 1em;
  z-index: 2;
  position: relative;
  white-space: nowrap;
}
.nav_startseite .level_1 li a::before {
  display: none;
}
.nav_startseite .level_1 li:first-child {
  display: none;
}
.nav_startseite .level_1 .menschliches {
  background: #ff9c00;
}
.nav_startseite .level_1 .menschliches::before {
  content: url(../../files/layout/img/menschliches.png);
  width: 173px;
  height: 181px;
}
.nav_startseite .level_1 .musikalisches {
  background: #4ea5d6;
}
.nav_startseite .level_1 .musikalisches::before {
  content: url(../../files/layout/img/musikalisches.png);
  width: 219px;
  height: 185px;
}
.nav_startseite .level_1 .bildliches {
  background: #d04dcc;
}
.nav_startseite .level_1 .bildliches::before {
  content: url(../../files/layout/img/bildliches.png);
  width: 174px;
  height: 183px;
}
.nav_startseite .level_1 .verbindliches {
  background: #abc037;
}
.nav_startseite .level_1 .verbindliches::before {
  content: url(../../files/layout/img/verbindliches.png);
  width: 180px;
  height: 184px;
}
.nav_startseite .level_2 {
  position: relative;
  z-index: 2;
}
.nav_startseite .level_2 li {
  background: none;
  border: none;
  border-radius: 0;
  width: 100%;
  height: auto;
  padding: 0;
  text-transform: lowercase;
}
.nav_startseite .level_2 li.first {
  padding-top: 0.3em;
}
.nav_startseite .level_2 li a {
  border: none;
  font-weight: 400;
  margin: 0;
}
.nav_startseite .level_2 li:first-child {
  display: block;
}
.nav_startseite .level_2 .menschliches {
  background: none;
}
.nav_startseite .level_2 .menschliches::before {
  display: none;
}
.nav_startseite .level_2 .musikalisches {
  background: none;
}
.nav_startseite .level_2 .musikalisches::before {
  display: none;
}
.nav_startseite .level_2 .bildliches {
  background: none;
}
.nav_startseite .level_2 .bildliches::before {
  display: none;
}
.nav_startseite .level_2 .verbindliches {
  background: none;
}
.nav_startseite .level_2 .verbindliches::before {
  display: none;
}

/*#################################################
################## MENÜ UNTERSEITEN ###############
#################################################*/
.nav_main {
  margin-top: 2em;
}
.nav_main .level_1 li:first-child {
  display: none;
}
.nav_main ul {
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 30px;
  margin: 0;
}
.nav_main ul li {
  border: 2px solid #fff;
  border-radius: 67px 0 67px 0;
  text-align: center;
  font-weight: 700;
}
.nav_main ul li a, .nav_main ul li strong {
  padding: 20px;
  display: block;
  font-style: normal;
  font-size: 1.3em;
  white-space: nowrap;
  color: #fff;
}
.nav_main ul li a:hover, .nav_main ul li strong:hover {
  color: #fff;
}
.nav_main ul li.menschliches {
  background: #ff9c00;
}
.nav_main ul li.musikalisches {
  background: #4ea5d6;
}
.nav_main ul li.bildliches {
  background: #d04dcc;
}
.nav_main ul li.verbindliches {
  background: #abc037;
}
.nav_main ul li:hover {
  opacity: 0.7;
}

.nav_sub {
  border: 2px solid #fff;
  border-radius: 67px 0 67px 0;
  position: relative;
  min-height: 500px;
  overflow: hidden;
}
.nav_sub::before {
  position: absolute;
  bottom: 30px;
}
.nav_sub ul {
  margin: 3em 1em 1em 2em;
  position: relative;
}
.nav_sub li {
  padding: 0;
  text-transform: lowercase;
}
.nav_sub li.first {
  padding-top: 0.3em;
}
.nav_sub li:before {
  display: none;
}
.nav_sub a, .nav_sub strong {
  color: #fff !important;
  font-size: 1.3rem;
  font-style: normal !important;
  letter-spacing: 0.05em;
}
.nav_sub .active {
  font-size: 1.3rem;
  letter-spacing: 0.05em;
}

.menschliches .nav_sub {
  background: #ff9c00;
}
.menschliches .nav_sub::before {
  content: url(../../files/layout/img/menschliches.png);
  width: 173px;
  height: 181px;
}

.musikalisches .nav_sub {
  background: #4ea5d6;
}
.musikalisches .nav_sub::before {
  content: url(../../files/layout/img/musikalisches.png);
  width: 219px;
  height: 185px;
}

.bildliches .nav_sub {
  background: #d04dcc;
}
.bildliches .nav_sub::before {
  content: url(../../files/layout/img/bildliches.png);
  width: 174px;
  height: 183px;
}

.verbindliches .nav_sub {
  background: #abc037;
}
.verbindliches .nav_sub::before {
  content: url(../../files/layout/img/verbindliches.png);
  width: 180px;
  height: 184px;
}

/*#################################################
################## own Reset ######################
#################################################*/
ol, ul {
  padding: 0;
}

nav ol, nav ul {
  list-style: none;
  padding: 0;
}

img {
  border-style: none;
}

img, picture {
  max-width: 100%;
  height: auto;
  display: block;
}

table {
  border-collapse: collapse;
  border-color: inherit;
  text-indent: 0;
}

/*#################################################
################## Layout ########################
#################################################*/
html, body {
  background: #fff;
}

#wrapper header .inside, #wrapper #container, #wrapper footer .inside {
  width: 100%;
  max-width: 1040px;
  margin: 0 auto;
  padding: 0 2em;
}

/*#################################################
################## LINIE ##########################
#################################################*/
.home #header {
  margin-right: 2em;
  margin-left: 2em;
}
.home #header .inside {
  position: relative;
  border-bottom: 2px solid #aaa;
}
.home #header .inside:before, .home #header .inside:after {
  content: "";
  display: block;
  width: 40.5px;
  height: 31px;
  background-image: url(../../files/layout/img/bogenende_bg.svg);
  background-size: cover;
  position: absolute;
}
.home #header .inside:before {
  top: 100%;
  left: 0;
}
.home #header .inside:after {
  right: 0;
  bottom: -2px;
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
@media (min-width: 917px) {
  .home #header .inside {
    border-bottom: 4px solid #aaa;
  }
  .home #header .inside:before, .home #header .inside:after {
    width: 81px;
    height: 63px;
  }
  .home #header .inside:after {
    bottom: -4px;
  }
}

#footer {
  margin-right: 2em;
  margin-left: 2em;
}
#footer .inside {
  position: relative;
  border-top: 2px solid #aaa;
}
#footer .inside:before, #footer .inside:after {
  content: "";
  display: block;
  width: 40.5px;
  height: 31px;
  background-image: url(../../files/layout/img/bogenende_bg.svg);
  background-size: cover;
  position: absolute;
}
#footer .inside:before {
  top: -2px;
  left: 0;
}
#footer .inside:after {
  right: 0;
  bottom: 100%;
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
@media (min-width: 917px) {
  #footer .inside {
    border-top: 4px solid #aaa;
  }
  #footer .inside:before, #footer .inside:after {
    width: 81px;
    height: 63px;
  }
  #footer .inside:before {
    top: -4px;
  }
}

/*#################################################
################## HEADER #########################
#################################################*/
#header {
  margin-bottom: 2em;
  text-align: center;
  padding-bottom: 1em;
  background: rgb(238, 238, 238);
  background: -webkit-gradient(linear, left bottom, left top, from(rgb(238, 238, 238)), to(rgb(255, 255, 255)));
  background: linear-gradient(0deg, rgb(238, 238, 238) 0%, rgb(255, 255, 255) 100%);
}
#header .logo {
  padding: 2em 1.5em 1em;
  margin: 0 auto;
  text-align: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
  z-index: 10;
}

.home #header {
  background: none;
}

/*#################################################
################## CONTAINER ######################
#################################################*/
#container aside {
  margin-top: 4em;
}
@media (min-width: 917px) {
  #container {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 30px 1fr 30px 1fr 30px 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 30px;
  }
  #container main {
    -ms-grid-column-span: 3;
    grid-column: span 3;
  }
  #container aside {
    -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
            order: -1;
    margin-top: 0;
  }
}

.home #container {
  display: block;
}

/*#################################################
################## FOOTER #########################
#################################################*/
#footer {
  margin-top: 5em;
}
#footer .inside {
  margin: 5em 0 2em;
  font-size: 90%;
  text-align: center;
}
#footer .inside nav ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 2em 0 1em;
}
#footer .inside nav li::after {
  content: "|";
  margin: 0 0.5em;
}
#footer .inside nav li.last::after {
  display: none;
}
#footer .inside nav li strong {
  font-weight: 400;
  font-style: italic;
}
#footer .inside nav a {
  color: #777980;
}
#footer .inside nav a:hover {
  color: #b8b8b8;
}
#footer .inside .facebook a {
  position: relative;
  width: 34px;
  height: 35px;
  background: #777980;
  color: #E5E5E5;
  display: block;
  margin: 0 auto;
  font-size: 2em;
  border-radius: 10px 0 10px 0;
}
#footer .inside .facebook a .icon-facebook {
  margin: 0;
  position: absolute;
  right: 0;
  bottom: -0.04em;
}
#footer .inside .facebook a:hover {
  background: #b8b8b8;
}
#footer .inside .mummert {
  font-style: normal;
  display: block;
  margin-top: 0.5em;
}

/*#################################################
################## BILDER #########################
#################################################*/
img {
  max-width: 100%;
  height: auto;
  margin: 0;
}

figure {
  margin: 0;
  overflow: hidden;
}
figure img {
  margin: 0;
  -webkit-transition: 0.2s all ease-in-out;
  transition: 0.2s all ease-in-out;
}
figure a:hover img {
  opacity: 0.7;
}

main .content-text figure {
  margin: 1em 0 0;
}
main .content-text:before, main .content-text:after {
  content: " ";
  display: table;
}
main .content-text:after {
  clear: both;
}
@media (min-width: 480px) {
  main .content-text.media--right figure {
    float: right;
    margin: 24px 0 1em 3em;
  }
  main .content-text.media--left figure {
    float: left;
    margin: 24px 3em 1em 0;
  }
}
@media (min-width: 917px) {
  main .content-text.media--right figure {
    float: right;
    margin: 24px 0 1em 3em;
    max-width: 50%;
  }
  main .content-text.media--left figure {
    float: left;
    margin: 24px 3em 1em 0;
    max-width: 50%;
  }
}

.content-image {
  margin: 2em 0;
}

/*#################################################
################## GALERIE ########################
#################################################*/
.content-gallery ul {
  display: -ms-grid;
  display: grid;
  grid-gap: 30px;
  list-style: none;
  padding: 0;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 2em 0 0;
}
.content-gallery ul li {
  padding: 0;
}
.content-gallery ul li:before {
  display: none;
}
.content-gallery.content-gallery--cols-1 ul {
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
}
.content-gallery.content-gallery--cols-2 ul {
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}
.content-gallery.content-gallery--cols-3 ul {
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}
.content-gallery.content-gallery--cols-4 ul {
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
}
.content-gallery.content-gallery--cols-5 ul {
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
}
.content-gallery.content-gallery--cols-6 ul, .content-gallery.content-gallery--cols-7 ul, .content-gallery.content-gallery--cols-8 ul, .content-gallery.content-gallery--cols-9 ul, .content-gallery.content-gallery--cols-10 ul, .content-gallery.content-gallery--cols-11 ul, .content-gallery.content-gallery--cols-12 ul {
  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
}

figcaption {
  font-size: 0.8em;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  font-weight: 300;
  padding-top: 0.6em;
}

/*#################################################
################## MACHRICHTEN ####################
#################################################*/
.bildliches .mod_newslist .layout_latest {
  width: 100%;
  height: 250px;
  overflow: hidden;
  margin-bottom: 2em;
  background: #fff;
  padding: 2em;
  position: relative;
}
.bildliches .mod_newslist figure {
  margin: 0 2em 0 0;
  float: left;
  height: 250px;
  overflow: hidden;
}
.bildliches .mod_newslist h2 {
  font-size: 170%;
  line-height: 140%;
  margin: 0;
  margin-bottom: 0px;
  margin-bottom: 0.5em;
}
.bildliches .mod_newslist h2 a {
  font-style: normal;
}
.bildliches .mod_newslist .content-text {
  font-size: 90%;
  line-height: 160%;
}
.bildliches .mod_newslist .info {
  bottom: 2em;
  position: absolute;
  left: 360px;
  margin: 0;
  padding: 0.2em 0;
}
.bildliches .mod_newslist .info span {
  margin-right: 0.3em;
}
.bildliches .mod_newslist .more {
  position: absolute;
  bottom: 2em;
  right: 2em;
  margin: 0;
  background: #d04dcc;
  padding: 0.2em 1em 0.2em 0.4em;
  clip-path: polygon(90% 0%, 100% 50%, 90% 100%, 0 100%, 0 50%, 0 0);
  -webkit-transition: all ease 0.3s;
  transition: all ease 0.3s;
}
.bildliches .mod_newslist .more a {
  color: #fff;
}
.bildliches .mod_newslist .more:hover a {
  color: #b11cab;
}
.bildliches .mod_newsreader .back {
  margin: 1em 0;
  background: #d04dcc;
  padding: 0.2em 0.4em 0.2em 1em;
  clip-path: polygon(100% 0%, 100% 50%, 100% 100%, 15% 100%, 0 50%, 15% 0);
  -webkit-transition: all ease 0.3s;
  transition: all ease 0.3s;
  width: 150px;
  text-align: center;
}
.bildliches .mod_newsreader .back a {
  color: #fff;
}
.bildliches .mod_newsreader .back:hover a {
  color: #b11cab;
}

.news_head {
  margin: 2em 0 0;
  text-align: center;
  width: 100% e;
}
.news_head span {
  color: #4ea5d6;
  font-size: 125%;
  font-weight: 700;
  font-style: normal;
}
.news_head .icon-bubbles4 {
  font-size: 160%;
}

/* ##################################################### */
/* ############## COOKIE-BAR ########################### */
/* ##################################################### */
.contao-cookiebar {
  top: unset;
}
.contao-cookiebar p {
  margin-top: 0;
  color: #fff;
}
.contao-cookiebar .cc-inner {
  border-radius: 0 !important;
  width: 100%;
  background: #777980;
  color: #fff;
}
.contao-cookiebar .cc-inner .cc-group .cc-detail-btn {
  width: auto;
  color: #fff;
}
.contao-cookiebar .cc-inner .cc-group .cc-detail-btn:hover {
  color: #E5E5E5;
}
.contao-cookiebar .cc-inner .cc-cookies {
  background: none;
}
.contao-cookiebar .cc-inner .cc-cookies .cc-cookie .cc-cookie-info {
  background: none;
  padding: 0;
  border: 0;
}
.contao-cookiebar .cc-inner a {
  color: #abc037;
  text-decoration: none;
}
.contao-cookiebar .cc-inner a:hover {
  color: #ff9c00;
}
.contao-cookiebar .cc-inner button {
  -webkit-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
}
.contao-cookiebar .cc-inner button.cc-btn {
  border-radius: 0 !important;
  background: none;
  border: 1px solid #b8b8b8;
  color: #b8b8b8;
  padding: 0.5em 1em;
}
.contao-cookiebar .cc-inner button.cc-btn:hover {
  background: none;
  border-color: #c8c8c8;
  color: #c8c8c8;
}
.contao-cookiebar .cc-inner button.cc-btn.success {
  background-color: #ff9c00 !important;
  border-color: #ff9c00;
  color: #fff;
}
.contao-cookiebar .cc-inner button.cc-btn.success:hover {
  background-color: #E5E5E5 !important;
  border-color: #E5E5E5;
}