:root {
  --sektion-max-breite: 85em; /* Achtung: Media-Queries mit diesem Wert manuell angleichen, da hier keine Variablen möglich sind  */
  --sektion-padding-y: 2em;
  --sektion-padding-x: 1em;

  --spalten-abstand: 3em;
  --spalten-halber-abstand: 1.5em;  /* Hälfte von --spalten-abstand */
  --spalten-kleinerabstand: 1em;
  --spalten-halber-kleinerabstand: 0.5em;  /* Hälfte von --spalten-kleinerabstand */

  --farbe-primaer: #2d6389;
  --farbe-alternativ: #c1c1c1;
  --farbe-betont: #98b935;
  --farbe-warnung: #e50838;

  --farbe-sf-normal: #2d6389;
  --farbe-sf-betont: #98b935;
  --farbe-sf-warnung: #e50838;
}

@media only screen and  (min-width: 768px) {
  :root {
    --sektion-padding-y: 3em;
    --sektion-padding-x: 6em;
  }
}



* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}



html {
  /*height: 100%;*/  /* wenn aktiviert funktioniert ScrollReveal nicht */
  overflow-x: hidden;
}

body {
  width: 100%;
  min-height: 100%;
  position: relative;
  overflow-x: hidden;
  margin: 0;
  padding: 0;
  background-color: #fff;
}

/* Definitionen zur Breakpoint-Erkennung im JS (width wird abgefragt) */
@media only screen and (min-width: 768px) {
  body {
    border-bottom: 1px solid #464646;
  }
}
@media only screen and (min-width: 992px) {
  body {
    border-bottom: 2px solid #464646;
  }
}

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

hr {
  display: block;
  height: 1px;
  width: 80%;
  border: 0;
  border-top: 2px solid #333;
  margin: 0.5em auto;
  padding: 0;
}

img {
  border: none;
  outline: none;
  vertical-align: middle;
}

audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle;
}
video {
  position: relative;
}

table {
  width: 100%;
  border: none;
}

ul,
li {
  margin: 0;
  padding: 0;
}

ul.liste,
.fliesstext ul {
  list-style-type: square;
  list-style-position: outside;
  padding-left: 1em;
}
ul.liste li,
.fliesstext ul li {
  list-style-type: square;
  padding: 0 0 0.3em 0;
}




/* ----- Schrift-Formate ----- */

body {
  font-family: 'Basistypo', sans-serif;
  font-size: 14px;
  line-height: 1.4em;
  color: #000;
}


h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0;
  font-family: 'Basistypo', sans-serif;
  line-height: 1.2em;
  font-weight: 600;
  color: inherit;
  margin-bottom: 0.3em;
}
p + h1, p + h2 {
  margin-top: 0.6em;
}
p + h3, p + h4, p + h5, p + h6 {
  margin-top: 1.6em;
}

h1 + hr, h2 + hr, h3 + hr {
  margin-top: -0.5em;
  margin-bottom: 1.5em;
}

h1 {
  font-size: 3.2em;
  line-height: 1.1em;
  letter-spacing: -0.01em;
  margin-left: -0.065em;  /* visuelle Einrückung der großen Schrift ausgleichen */
}

h2 {
  font-size: 2.6em;
  letter-spacing: -0.01em;
  margin-left: -0.065em;  /* visuelle Einrückung der großen Schrift ausgleichen */
}

h3 {
  font-size: 2.0em;
  margin-left: -0.055em;  /* visuelle Einrückung der großen Schrift ausgleichen */
}

h4 {
  font-size: 1.6em;
  margin-left: -0.04em;  /* visuelle Einrückung der großen Schrift ausgleichen */
}

h5 {
  font-size: 1.2em;
  line-height: 1.5em;
  letter-spacing: 0.05em;
  margin-left: -0.03em;  /* visuelle Einrückung der großen Schrift ausgleichen */
}

h6 {
  font-size: 0.85em;
  font-weight: 500;
  line-height: 1.3em;
  letter-spacing: 0.05em;
  position: relative;
  text-transform: uppercase;
}

h5 + h1, h5 + h2, h2 + h3, h2 + h4 {
  margin-top: -0.2em;
}

h6 + h1, h6 + h2 {
  margin-top: 0.5em;
}

li h1, li h2, li h3, li h4, li h5, li h6 {
  display: inline-block;
}

p {
  font-size: 1.0em;
  margin: 0 0 0.9em 0;
}

.hinweis {
  font-size: 0.85em;
  opacity: 0.75;
}

button,
input,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

@media only screen and (max-width: 767px) {

  h1 {
    font-size: 2.5em;
  }

  h2 {
    font-size: 2.0em;
  }

  h3 {
    font-size: 1.7em;
  }

  h4 {
    font-size: 1.3em;
  }

  h5 {
    font-size: 1.0em;
  }

}

@media only screen and (min-width: 992px) {

  body {
    font-size: 16px;
  }

  h1 + hr, h2 + hr, h3 + hr {
    margin-bottom: 3em;
  }

}


@media only screen and (min-width: 1400px) {

  body {
    font-size: 18px;
  }

}

@media only screen and (min-width: 1700px) {

  body {
    font-size: 18px;
  }

}





/* Links */

a {
  color: inherit;
  text-decoration: underline;
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  transition: color 200ms, background-color 200ms, border-color 200ms;
}
a:hover {
  text-decoration: underline;
  color: var(--farbe-primaer);
}

a:focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

a.block {
  display:block;
  width: 100%;
  height: 100%;
}





/* Formulare */
form,
fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

fieldset {
  margin: 0 0 2em 0;
}

/* Clearfix */
fieldset:before,
fieldset:after {
  content: " ";
  display: table;
}
fieldset:after {
  clear: both;
}


/* Formularaufteilung und Feldbreiten */
fieldset .halb                 { width: 49%; }

input:not([type="submit"]),
textarea,
select,
.superselect,
.cke_textarea_inline {
  width: 98%;
  font-size: inherit;
  line-height: inherit;
}

.CodeMirror {
  height: auto;
  color: inherit;
  border: 1px solid #ccc;
  background: #f5f5f5;
  font-size: 13px;
  width: 98%;
}
.CodeMirror-focused {
  background: #fff;
}

.feld .eingabe {
  position: relative;
  margin-left: 0;
}

.feld .b80                     { width: 100%; }
.feld .dreiviertel, .feld .b75 { width: 100%; }
.feld .zweidrittel, .feld .b66 { width: 100%; }
.feld .b60                     { width: 100%; }
.feld .halb, .feld .b50        { width: 100%; }
.feld .b40                     { width: 100%; }
.feld .b30                     { width: 100%; }
.feld .drittel, .feld .b33     { width: 100%; }
.feld .viertel, .feld .b25     { width: 23%; }
.feld .fuenftel, .feld .b20    { width: 23%; }
.feld .b15                     { width: 23%; }

@media only screen and (min-width: 576px) {
  fieldset .halb                 { width: 100%; }
  .feld .b80                     { width: 100%; }
  .feld .dreiviertel, .feld .b75 { width: 100%; }
  .feld .zweidrittel, .feld .b66 { width: 100%; }
  .feld .b60                     { width: 100%; }
  .feld .halb, .feld .b50        { width: 100%; }
  .feld .b40                     { width: 48%; }
  .feld .b30                     { width: 48%; }
  .feld .drittel, .feld .b33     { width: 48%; }
  .feld .viertel, .feld .b25     { width: 48%; }
  .feld .fuenftel, .feld .b20    { width: 48%; }
  .feld .b15                     { width: 48%; }
}

@media only screen and (min-width: 992px) {
  fieldset .halb                 { width: 49%; }
  fieldset.einspaltig .halb      { width: 48%; }
  .feld .b80                     { width: 78%; }
  .feld .dreiviertel, .feld .b75 { width: 73%; }
  .feld .zweidrittel, .feld .b66 { width: 64%; }
  .feld .b60                     { width: 58%; }
  .feld .halb, .feld .b50        { width: 48%; }
  .feld .b40                     { width: 38%; }
  .feld .b30                     { width: 28%; }
  .feld .drittel, .feld .b33     { width: 31%; }
  .feld .viertel, .feld .b25     { width: 23%; }
  .feld .fuenftel, .feld .b20    { width: 18%; }
  .feld .b15                     { width: 13%; }

  .voll > .feld {
    margin-right: 10px;
  }
  .feld > label {
    width: 160px;
    float: left;
  }
  .feld .eingabe {
    margin-left: 170px;
  }
}

.feld .b80,
.feld .dreiviertel,
.feld .b75,
.feld .zweidrittel,
.feld .b66,
.feld .b60,
.feld .halb,
.feld .b50,
.feld .b40,
.feld .b30,
.feld .drittel,
.feld .b33,
.feld .viertel,
.feld .b25,
.feld .fuenftel,
.feld .b20,
.feld .b15 {
  margin-right: 2%;
  float: left; /* damit die Leerzeichen im Quelltext zwischen den Feldern keine Breite einnehmen (wie bei inline-block), muss gefloatet werden */
}



.feld .abstand {
  margin-bottom: 10px;
}
.feld .abstand_oben {
  margin-top: 10px;
}



.feld {
  margin: 0 20px 15px 0;
}
.feld:after {
  clear: both;
  content: " ";
  display: table;
}
fieldset.einspaltig .feld {
  margin-right: 0;
  margin-left: 0;
}

.feld > label {
  display: block;
  line-height: 20px;
  padding: 5px 0 5px 0; /* Ausgleich für den oberen und unteren Innenabstand der Eingabefelder plus Rahmenlinie */
}
.feld.pflicht > label {
  font-weight: 600;
}

fieldset.einspaltig .feld > label {
  width: auto;
  float: none;
}
.feld > label.eingabelabel {
  padding: 0;
}

.feld .eingabe {
  /*min-height: 115px;*/
}
.feld .eingabe + .eingabe {
  margin-top: 5px;
}
fieldset.einspaltig .feld .eingabe {
  margin-left: 0;
}
.feld .eingabe label,
.check label,
label.check {
  position: relative;
  display: inline-block;
  padding-left: 30px;
  margin-right: 30px;
  width: auto;
}
.feld .eingabe label input[type=radio],
.feld .eingabe label input[type=checkbox],
.check input[type=radio],
.check input[type=checkbox] {
  position: absolute;
  left: 0;
  margin-top: 3px;
}
.feld .eingabe.eingerueckt {
  margin-left: 200px;
}
.feld .eingabe .eingerueckt {
  margin-left: 30px;
}

.feld .eingabe label + label,
.feld .eingabe .hinweis + label,
.feld .eingabe .hinweis + input,
.feld .eingabe .hinweis + textarea {
  margin-top: 5px;
}

/* Felder um eine Reihe nach unten versetzen */
.feld.versatz {
  margin-top: 45px;
}

input[type=text],
input[type=number],
input[type=date],
input[type=email],
input[type=password],
textarea,
select {
  padding: 4px 6px 4px 6px;
  margin: 0 0 0 0;
  border: 1px solid #ccc;
  background: #f5f5f5;
  outline: none;
}
select:not([multiple]) {
  height: 36px;  /* Höhe festlegen, sonst kommt es zu kleinen Abweichungen (vermutlich weil line-height ignoriert wird */
}
/* Farbe der Select-Options festlegen, sonst ist unter Umtänden weißer Text auf weißem Hintergrund (Chrome) */
option {
  color: #333;
  background-color: #fff;
}

input[type=text]:focus,
input[type=number]:focus,
input[type=date]:focus,
input[type=email]:focus,
input[type=password]:focus,
textarea:focus,
select:focus {
  background: #fff;
  border: 1px solid #ccc;
  box-shadow: 0 1px 5px rgba(0, 0, 0, .2);
}

input[type=radio],
input[type=checkbox] {
  width: auto;
  border: none;
}

textarea {
  resize: vertical;
  min-height: 120px;
}
textarea.reihen3 {
  /* 45px pro Reihen inkl. Margin abzüglich 15px Margin der Textarea */
  height: 120px;
}
textarea.reihen4 {
  height: 165px;
}
textarea.reihen5 {
  height: 210px;
}
textarea.reihen8 {
  height: 345px;
}
textarea.reihen15 {
  height: 660px;
}

::-webkit-input-placeholder { color: #aaa; }
::-moz-placeholder { color: #aaa; }
:-ms-input-placeholder { color: #aaa; }


.datepicker {
  width: 150px;
  padding-right: 28px !important;
}
.Zebra_DatePicker_Icon_Wrapper {
  margin-right: 2%;
}
button.Zebra_DatePicker_Icon_Inside {
  top: 0 !important;
}


/* Passwort-Anzeiger */
.passwort-anzeigen {
  /* display: inline-block; */
  position: relative;
}
.passwort-anzeigen input {
  padding-right: 30px;
}
.passwort-anzeigen .schalter {
  position: absolute;
  top: 6px;
  right: 14px;
  width: 20px;
  height: 20px;
  cursor: pointer;
  opacity: 0.5;
  background: url('../set/passwortanzeiger.svg') no-repeat center center;
  background-size: 80%;
}
.passwort-anzeigen .schalter.aktiv {
  opacity: 1;
}





/* Tom-Select */
.ts-wrapper {
  display: inline-flex;
  vertical-align: middle;
  min-height: 30px;
}
.ts-control {
  padding: 4px 8px;
  background: #f5f5f5;
  border: 1px solid #ccc;
  border-radius: 0;
}
.ts-control input,
.fehler .ts-control input,
.ts-control input.fehler {
  border: none !important;
  width: auto !important;
}
.ts-wrapper.input-active .ts-control,
.ts-wrapper.dropdown-active .ts-control {
  background: #fff;
  box-shadow: 0 1px 5px rgba(0, 0, 0, .2);
}
.ts-wrapper.multi.has-items .ts-control {
  padding: 4px 8px 1px 8px;
}
.ts-wrapper.multi .ts-control > div {
  padding: 3px 6px 2px 6px;
}
.ts-dropdown .active {
  background-color: #d54e21;
  color: #fff;
}

.ts-wrapper.multi .ts-control > div.eingabe-tag {
  color: #333;
  background-color: #ffffff;
  border: 1px solid #ababab;
  padding: 2px 6px 1px 6px;
}
.ts-wrapper.multi .ts-control > div.gruppen-tag {
  background-color: #864dcc;
}
/* Listeneintrag formatieren */
.ts-wrapper .ts-dropdown .option.gruppen-tag {
  /* border-left: 3px solid #864dcc; */
}
.ts-wrapper.multi .ts-control > div.gruppen-tag:before {
  content: "";
  width: 15px;
  height: 15px;
  margin-right: 4px;
  background: center center / 100% no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-users-group' width='16' height='16' viewBox='0 0 24 24' stroke-width='1.5' stroke='%23ffffff' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E %3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'%3E%3C/path%3E %3Cpath d='M10 13a2 2 0 1 0 4 0a2 2 0 0 0 -4 0'%3E%3C/path%3E %3Cpath d='M8 21v-1a2 2 0 0 1 2 -2h4a2 2 0 0 1 2 2v1'%3E%3C/path%3E %3Cpath d='M15 5a2 2 0 1 0 4 0a2 2 0 0 0 -4 0'%3E%3C/path%3E %3Cpath d='M17 10h2a2 2 0 0 1 2 2v1'%3E%3C/path%3E %3Cpath d='M5 5a2 2 0 1 0 4 0a2 2 0 0 0 -4 0'%3E%3C/path%3E %3Cpath d='M3 13v-1a2 2 0 0 1 2 -2h2'%3E%3C/path%3E %3C/svg%3E");
}
.ts-wrapper.multi .ts-control > div.nutzer-tag {
  background-color: #ECC218;
}
.ts-wrapper.multi .ts-control > div.nutzer-tag:before {
  content: "";
  width: 15px;
  height: 15px;
  margin-right: 4px;
  background: center center / 100% no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-user' width='16' height='16' viewBox='0 0 24 24' stroke-width='1.5' stroke='%23ffffff' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E %3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'%3E%3C/path%3E %3Cpath d='M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0'%3E%3C/path%3E %3Cpath d='M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2'%3E%3C/path%3E %3C/svg%3E");
}








/* Buttons */
.sf,
input[type=submit] {
  display: inline-block;
  position: relative;
  text-decoration: none;
  user-select: none;
  cursor: pointer;
  white-space: nowrap;
  outline: none;
  /* min-width: 17em; */
  height: 44px;
  margin: 1em 2em 1em 0;
  padding: 0 2em 0 2em;
  border: none;
  border-radius: 4px;
  font-size: 0.8em;
  font-weight: 500;
  line-height: 44px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  text-align: center;
  color: currentColor;
  background-color: transparent;
  border: 1px solid currentColor;
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.1);
  transition: color 250ms ease, background-color 250ms ease, border-color 250ms ease;
}
.sf.rechts,
input[type=submit].rechts {
  margin: 1em 0 1em 2em;
}
.sf:hover,
input[type=submit]:hover {
  background-color: var(--farbe-sf-normal);
  color: #fff;
  border-color: transparent;
  text-decoration: none;
}
.hell .sf:hover,
.hell input[type=submit]:hover {
  background-color: #fff;
  color: var(--farbe-sf-normal);
}
.sf.klein,
input[type=submit].klein {
  margin: 0.5em 1em 0.5em 0;
  padding: 0 1.5em 0 1.5em;
  height: 32px;
  line-height: 32px;
}
.sf.mini,
input[type=submit].mini {
  margin: 0.5em 1em 0.5em 0;
  padding: 0 1em 0 1em;
  height: 24px;
  line-height: 24px;
  font-size: 0.7em;
  letter-spacing: 0.2px;
}
.sf.betont,
input[type=submit].betont {
  color: #fff;
  background-color: var(--farbe-sf-betont);
  border-color: transparent;
}
.sf.betont:hover,
input[type=submit].betont:hover {
  background-color: #fff;
  color: var(--farbe-sf-betont);
}

.sf.warnung,
input[type=submit].warnung,
form.sicherungshinweis.dirty .sf.warnung-sicherungshinweis {
  color: #fff;
  background-color: var(--farbe-sf-warnung);
  border-color: transparent;
}
.sf.warnung:hover,
input[type=submit].warnung:hover,
form.sicherungshinweis.dirty .sf.warnung-sicherungshinweis:hover {
  background-color: #fff;
  color: var(--farbe-sf-warnung);
}

.sf.hell,
input[type=submit].hell {
  background-color: #fff;
  color: var(--farbe-sf-normal);
  border-color: transparent;
}
.sf.hell:hover,
input[type=submit].hell:hover {
  background-color: var(--farbe-sf-normal);
  color: #fff;
}
.sf.hell:active,
input[type=submit].hell:active {
  color: #ddd;
}

/* Elemente mit Klasse bestaetigung erhalten beim ersten Klick zusätzlich die Klasse bestaetigt und sind erst danach "scharf" */
.sf.bestaetigt {
  background-color: #9408e5;
  border-color: transparent;
}
.sf.bestaetigt:hover {
  background-color: #fff;
  color: #9408e5;
}

.sf:active,
input[type=submit]:active {
  color: #999;
}

.sf.img,
input[type=submit].img {
  white-space: nowrap;
  min-width: 1em;
  width: 3em;
  padding: 0 0.2em 0 0.2em;
}
.sf.img:hover,
input[type=submit].img:hover {
  background-color: #555;
}
.sf.keintext,
input[type=submit].keintext {
  text-indent: 80px;
  white-space: nowrap;
  overflow: hidden;
  min-width: 0;
  width: 3.5em;
  padding: 0 0.5em 0 0.5em;
}
.sf.keintext:before,
input[type=submit].keintext:before {
  display: block;
  position: absolute;
  text-indent: 0;
  font-size: 200%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}






/* Farben */

.betont {
  color: var(--farbe-betont);
}
.hg-betont {
  background-color: var(--farbe-betont);
}

.alternativ {
  color: var(--farbe-alternativ);
}
.hg-alternativ {
  background-color: var(--farbe-alternativ);
}

.warnung:not(.sf):not(button) {
  padding: 10px;
  background-color: var(--farbe-warnung);
  color: #fff;
}








/* Spalten */

.spalten {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: stretch;
  align-items: stretch;
  justify-content: flex-start;
  margin-right: calc(var(--spalten-halber-abstand) * -1);
  margin-left: calc(var(--spalten-halber-abstand) * -1);
}
.spalten .spalte,
.spalten .spalte.voll,
.spalten .spalte.b100 {
  position: relative;
  margin: var(--spalten-halber-abstand);
  width: calc(100% - var(--spalten-abstand));
}

.spalten .spalte.b80           { width: calc(100% - var(--spalten-abstand)); }
.spalten .spalte.dreiviertel,
.spalten .spalte.b75           { width: calc(100% - var(--spalten-abstand)); }
.spalten .spalte.b70           { width: calc(100% - var(--spalten-abstand)); }
.spalten .spalte.zweidrittel,
.spalten .spalte.b66           { width: calc(100% - var(--spalten-abstand)); }
.spalten .spalte.b60           { width: calc(100% - var(--spalten-abstand)); }
.spalten .spalte.halb,
.spalten .spalte.b50           { width: calc(100% - var(--spalten-abstand)); }
.spalten .spalte.b40           { width: calc(100% - var(--spalten-abstand)); }
.spalten .spalte.drittel,
.spalten .spalte.b33           { width: calc(100% - var(--spalten-abstand)); }
.spalten .spalte.b30           { width: calc(100% - var(--spalten-abstand)); }
.spalten .spalte.viertel,
.spalten .spalte.b25           { width: calc(50% - var(--spalten-abstand)); }
.spalten .spalte.fuenftel,
.spalten .spalte.b20           { width: calc(50% - var(--spalten-abstand)); }
.spalten .spalte.b15           { width: calc(50% - var(--spalten-abstand)); }
.spalten .spalte.achtel,
.spalten .spalte.b12_5         { width: calc(50% - var(--spalten-abstand)); }

@media only screen and (min-width: 576px) {
  .spalten .spalte.b80           { width: calc(100% - var(--spalten-abstand)); }
  .spalten .spalte.dreiviertel,
  .spalten .spalte.b75           { width: calc(100% - var(--spalten-abstand)); }
  .spalten .spalte.b70           { width: calc(100% - var(--spalten-abstand)); }
  .spalten .spalte.zweidrittel,
  .spalten .spalte.b66           { width: calc(100% - var(--spalten-abstand)); }
  .spalten .spalte.b60           { width: calc(100% - var(--spalten-abstand)); }
  .spalten .spalte.halb,
  .spalten .spalte.b50           { width: calc(100% - var(--spalten-abstand)); }
  .spalten .spalte.b40           { width: calc(50% - var(--spalten-abstand)); }
  .spalten .spalte.drittel,
  .spalten .spalte.b33           { width: calc(50% - var(--spalten-abstand)); }
  .spalten .spalte.b30           { width: calc(50% - var(--spalten-abstand)); }
  .spalten .spalte.viertel,
  .spalten .spalte.b25           { width: calc(50% - var(--spalten-abstand)); }
  .spalten .spalte.fuenftel,
  .spalten .spalte.b20           { width: calc(50% - var(--spalten-abstand)); }
  .spalten .spalte.b15           { width: calc(50% - var(--spalten-abstand)); }
  .spalten .spalte.achtel,
  .spalten .spalte.b12_5         { width: calc(50% - var(--spalten-abstand)); }
}

@media only screen and (min-width: 992px) {
  .spalten .spalte.b80           { width: calc(80% - var(--spalten-abstand)); }
  .spalten .spalte.dreiviertel,
  .spalten .spalte.b75           { width: calc(75% - var(--spalten-abstand)); }
  .spalten .spalte.b70           { width: calc(70% - var(--spalten-abstand)); }
  .spalten .spalte.zweidrittel,
  .spalten .spalte.b66           { width: calc(66% - var(--spalten-abstand)); }
  .spalten .spalte.b60           { width: calc(60% - var(--spalten-abstand)); }
  .spalten .spalte.halb,
  .spalten .spalte.b50           { width: calc(50% - var(--spalten-abstand)); }
  .spalten .spalte.b40           { width: calc(40% - var(--spalten-abstand)); }
  .spalten .spalte.drittel,
  .spalten .spalte.b33           { width: calc(33% - var(--spalten-abstand)); }
  .spalten .spalte.b30           { width: calc(30% - var(--spalten-abstand)); }
  .spalten .spalte.viertel,
  .spalten .spalte.b25           { width: calc(25% - var(--spalten-abstand)); }
  .spalten .spalte.fuenftel,
  .spalten .spalte.b20           { width: calc(20% - var(--spalten-abstand)); }
  .spalten .spalte.b15           { width: calc(15% - var(--spalten-abstand)); }
  .spalten .spalte.achtel,
  .spalten .spalte.b12_5         { width: calc(12.5% - var(--spalten-abstand)); }
}

@media only screen and (max-width: 575px) {
  .spalten .spalte.mobil-voll,
  .spalten .spalte.mobil-b100    { width: calc(100% - var(--spalten-abstand)); }
  .spalten .spalte.mobil-b80     { width: calc(80% - var(--spalten-abstand)); }
  .spalten .spalte.mobil-dreiviertel,
  .spalten .spalte.mobil-b75     { width: calc(75% - var(--spalten-abstand)); }
  .spalten .spalte.mobil-b70     { width: calc(70% - var(--spalten-abstand)); }
  .spalten .spalte.mobil-zweidrittel,
  .spalten .spalte.mobil-b66     { width: calc(66% - var(--spalten-abstand)); }
  .spalten .spalte.mobil-b60     { width: calc(60% - var(--spalten-abstand)); }
  .spalten .spalte.mobil-halb,
  .spalten .spalte.mobil-b50     { width: calc(50% - var(--spalten-abstand)); }
  .spalten .spalte.mobil-b40     { width: calc(40% - var(--spalten-abstand)); }
  .spalten .spalte.mobil-drittel,
  .spalten .spalte.mobil-b33     { width: calc(33% - var(--spalten-abstand)); }
  .spalten .spalte.mobil-b30     { width: calc(30% - var(--spalten-abstand)); }
  .spalten .spalte.mobil-viertel,
  .spalten .spalte.mobil-b25     { width: calc(25% - var(--spalten-abstand)); }
  .spalten .spalte.mobil-b20     { width: calc(20% - var(--spalten-abstand)); }
  .spalten .spalte.mobil-b15     { width: calc(15% - var(--spalten-abstand)); }
  .spalten .spalte.mobil-achtel,
  .spalten .spalte.mobil-b12_5   { width: calc(12.5% - var(--spalten-abstand)); }
}

@media only screen and (min-width: 576px) and (max-width: 991px) {
  .spalten .spalte.tablet-voll,
  .spalten .spalte.tablet-b100   { width: calc(100% - var(--spalten-abstand)); }
  .spalten .spalte.tablet-b80    { width: calc(80% - var(--spalten-abstand)); }
  .spalten .spalte.tablet-dreiviertel,
  .spalten .spalte.tablet-b75    { width: calc(75% - var(--spalten-abstand)); }
  .spalten .spalte.tablet-b70    { width: calc(70% - var(--spalten-abstand)); }
  .spalten .spalte.tablet-zweidrittel,
  .spalten .spalte.tablet-b66    { width: calc(66% - var(--spalten-abstand)); }
  .spalten .spalte.tablet-b60    { width: calc(60% - var(--spalten-abstand)); }
  .spalten .spalte.tablet-halb,
  .spalten .spalte.tablet-b50    { width: calc(50% - var(--spalten-abstand)); }
  .spalten .spalte.tablet-b40    { width: calc(40% - var(--spalten-abstand)); }
  .spalten .spalte.tablet-drittel,
  .spalten .spalte.tablet-b33    { width: calc(33% - var(--spalten-abstand)); }
  .spalten .spalte.tablet-b30    { width: calc(30% - var(--spalten-abstand)); }
  .spalten .spalte.tablet-viertel,
  .spalten .spalte.tablet-b25    { width: calc(25% - var(--spalten-abstand)); }
  .spalten .spalte.tablet-b20    { width: calc(20% - var(--spalten-abstand)); }
  .spalten .spalte.tablet-b15    { width: calc(15% - var(--spalten-abstand)); }
  .spalten .spalte.tablet-achtel,
  .spalten .spalte.tablet-b12_5  { width: calc(12.5% - var(--spalten-abstand)); }
}








/* Breiten */

.voll, .b100        { width: 100%; }
.b80                { width: 100%; }
.dreiviertel, .b75  { width: 100%; }
.b70                { width: 100%; }
.zweidrittel, .b66  { width: 100%; }
.b60                { width: 100%; }
.halb, .b50         { width: 100%; }
.b40                { width: 100%; }
.drittel, .b33      { width: 100%; }
.b30                { width: 100%; }
.viertel, .b25      { width:  50%; }
.fuenftel, .b20     { width:  50%; }
.b15                { width:  50%; }
.achtel, .b12_5     { width:  50%; }

.voll\!, .b100\!        { width: 100%; }
.b80\!                  { width:  80%; }
.dreiviertel\!, .b75\!  { width:  75%; }
.b70\!                  { width:  70%; }
.zweidrittel\!, .b66\!  { width:  66.6%; }
.b60\!                  { width:  60%; }
.halb\!, .b50\!         { width:  50%; }
.b40\!                  { width:  40%; }
.drittel\!, .b33\!      { width:  33.3%; }
.b30\!                  { width:  30%; }
.viertel\!, .b25\!      { width:  25%; }
.fuenftel\!, .b20\!     { width:  20%; }
.b15\!                  { width:  15%; }
.achtel\!, .b12_5\!     { width:  12.5%; }

.max-b80                   { max-width: 80%; }
.max-dreiviertel, .max-b75 { max-width: 75%; }
.max-zweidrittel, .max-b66 { max-width: 66.6%; }
.max-b60                   { max-width: 60%; }
.max-halb, .max-b50        { max-width: 50%; }
.max-b40                   { max-width: 40%; }
.max-drittel, .max-b33     { max-width: 33.3%; }
.max-viertel, .max-b25     { max-width: 25%; }
.max-fuenftel, .max-b20    { max-width: 20%; }
.max-b15                   { max-width: 15%; }
.max-achtel, .max-b12_5    { max-width: 12.5%; }

@media only screen and (min-width: 576px) {
  .voll, .b100        { width: 100%; }
  .b80                { width: 100%; }
  .dreiviertel, .b75  { width: 100%; }
  .b70                { width: 100%; }
  .zweidrittel, .b66  { width: 100%; }
  .b60                { width: 100%; }
  .halb, .b50         { width: 100%; }
  .b40                { width: 100%; }
  .drittel, .b33      { width:  50%; }
  .b30                { width:  50%; }
  .viertel, .b25      { width:  50%; }
  .fuenftel, .b20     { width:  50%; }
  .b15                { width:  50%; }
  .achtel, .b12_5     { width:  50%; }
}

@media only screen and (min-width: 992px) {
  .voll, .b100        { width: 100%; }
  .b80                { width:  80%; }
  .dreiviertel, .b75  { width:  75%; }
  .b70                { width:  70%; }
  .zweidrittel, .b66  { width:  66.6%; }
  .b60                { width:  60%; }
  .halb, .b50         { width:  50%; }
  .b40                { width:  40%; }
  .drittel, .b33      { width:  33.3%; }
  .b30                { width:  30%; }
  .viertel, .b25      { width:  25%; }
  .fuenftel, .b20     { width:  20%; }
  .b15                { width:  15%; }
  .achtel, .b12_5     { width:  12.5%; }
}

@media only screen and (max-width: 767px) {
  .mobil-voll, .mobil-b100        { width: 100%; }
  .mobil-b80                      { width:  80%; }
  .mobil-dreiviertel, .mobil-b75  { width:  75%; }
  .mobil-b70                      { width:  70%; }
  .mobil-zweidrittel, .mobil-b66  { width:  66%; }
  .mobil-b60                      { width:  60%; }
  .mobil-halb, .mobil-b50         { width:  50%; }
  .mobil-b40                      { width:  40%; }
  .mobil-drittel, .mobil-b33      { width:  33%; }
  .mobil-b30                      { width:  30%; }
  .mobil-viertel, .mobil-b25      { width:  25%; }
  .mobil-fuenftel, .mobil-b20     { width:  20%; }
  .mobil-b15                      { width:  15%; }
  .mobil-achtel, .mobil-b12_5     { width:  12.5%; }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tablet-voll, .tablet-b100        { width: 100%; }
  .tablet-b80                       { width:  80%; }
  .tablet-dreiviertel, .tablet-b75  { width:  75%; }
  .tablet-b70                       { width:  70%; }
  .tablet-zweidrittel, .tablet-b66  { width:  66%; }
  .tablet-b60                       { width:  60%; }
  .tablet-halb, .tablet-b50         { width:  50%; }
  .tablet-b40                       { width:  40%; }
  .tablet-drittel, .tablet-b33      { width:  33%; }
  .tablet-b30                       { width:  30%; }
  .tablet-viertel, .tablet-b25      { width:  25%; }
  .tablet-fuenftel, .tablet-b20     { width:  20%; }
  .tablet-b15                       { width:  15%; }
  .tablet-achtel, .tablet-b12_5     { width:  12.5%; }
}

.max-b300 { max-width: 300px; }
.max-b400 { max-width: 400px; }
.max-b500 { max-width: 500px; }
.max-b600 { max-width: 600px; }
.max-b700 { max-width: 700px; }
.max-b800 { max-width: 800px; }





/* Abstände */

.keinabstand { margin: 0 !important; }

.kleinerabstandlinks  { margin-left: 1em !important; }
.kleinerabstandrechts { margin-right: 1em !important; }
.kleinerabstandoben   { margin-top: 1em !important; }
.kleinerabstandunten  { margin-bottom: 1em !important; }

.abstandlinks  { margin-left: 2em !important; }
.abstandrechts { margin-right: 2em !important; }
.abstandoben   { margin-top: 2em !important; }
.abstandunten  { margin-bottom: 2em !important; }

.grosserabstandlinks  { margin-left: 4em !important; }
.grosserabstandrechts { margin-right: 4em !important; }
.grosserabstandoben   { margin-top: 4em !important; }
.grosserabstandunten  { margin-bottom: 4em !important; }




/* Formate für Bilder */

.bildunterschrift {
  margin-left: 0;
  margin-right: 0;
  padding: 2px;
  background-color: #EEEEEE;
}
.bild {
  display: inline-block;
  max-width: 100%;
  height: auto;
  margin: 10px 0 10px 0;
}
.bildblock .bild {
  margin: 0;
}
.bild-links,
.bild-rechts {
  display: inline-block;
  max-width: 100%;
  height: auto;
  margin: 10px 10px 0 10px;
}
.bild-links {
  float: left;
  max-width: 40%;
  margin: 10px 10px 0 0;
}
.bild-mittig {
  text-align: center;
  max-width: 100%;
  height: auto;
  margin: 10px 0 10px 0;
}
.bild-mittig > figure {
  display: inline-block;
}
.bild-rechts {
  float: right;
  max-width: 40%;
  margin: 10px 0 0 10px;
}

.poster {
  position: relative;
  border: 0;
  border-radius: 0;
  margin: 2.5em 1.5em 0.5em 1.5em;
  background: #fff;
  box-shadow: 1px 1px 6px #999;
}
.poster,
.poster ~ .cke_widget_drag_handler_container {
  transform: rotate(5deg);
  transform-origin: bottom left;
}
.poster:not(.bild-links):not(.bild-rechts) {
  max-width: 95%; /* etwas schmaler, sonst ragt die Ecke wegen Drehung zu weit an anderen Inhalt heran */
}
.poster.bild-links {
  transform: rotate(-5deg);
  margin: 2.5em 2.5em 1.5em 0.5em;
}
.poster.bild-rechts {
  margin: 2.5em 0.5em 1.5em 2.5em;
}

.poster > figcaption {
  color: #777;
  margin-top: 5px;
  right: 20px;
  font-size: 11px;
  text-align: right;
}
figure.poster {
  padding: 20px 20px 20px 20px;
  margin-bottom: 30px;
}
figure.poster img {
  max-width:100%;
}
img.poster {
  border: 20px solid #f7f7f7;
}
.herausgestellt img.poster {
  border-color: #fff;
}

@media only screen and (max-width: 575px) {
  .poster.bild-links,
  .poster.bild-rechts {
    float: none;
    margin: 2.5em 1.5em 0.5em 1.5em;
  }
}






/* ----- Navigationsleiste ----- */

header {
  position: relative;
  position: fixed; /* für m1/m2 overscroll */
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  height: auto;
  width: 100%;
  z-index: 100;
  background-color: rgb(255 255 255 / 70%);
  backdrop-filter: blur(8px);
  font-weight: 500;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  box-shadow: 0 1px 3px rgb(0 0 0 / 12%);
  transition: background-color .2s ease-in-out;
}
header.fixiert {
  position: fixed;
}

header .zelle {
  display: flex;
  flex-direction: row;
  flex: 1 1 auto;
  padding: 0 20px;
  min-height: 45px;
}

header .main-menu > ul:before,
header .main-menu > ul:after {
  content: '';
  display: table;
}
header .main-menu > ul:after {
  clear: both;
}

header .logo,
header .meta,
header .menu-toggler {
  display: flex;
  align-self: stretch;
  align-items: center;
}

header .logo,
footer .logo {
  padding: 0;
  font-size: 22px;
  font-weight: 600;
  color: #686868;
  background-color: transparent !important;
  text-transform: none;
  transition: font-size .2s ease-in-out;
}
header .logo:before,
footer .logo:before {
  display: inline-block;
  content: "";
  width: 50px;
  height: 50px;
  background: url('../set/logo.png') no-repeat left center;
  background-size: contain;
  transition: all .2s ease-in-out;
}
footer .logo:before {
  background-image: url('../set/logo-negativ.png');
}
header .logo span,
footer .logo span {
  display: none;
}

header .meta {
  justify-content: flex-end;
  overflow: hidden;
  width: 100%;
  padding: 0 1em;
}
header .meta .bereich {
  display: none;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  vertical-align: bottom;
  font-weight: 700;
  font-size: 0.8em;
}

header .menu-toggler {
  position: relative;
  cursor: pointer;
  user-select: none;
  padding: 12px 40px 10px 15px;

  /* "Menü"-Text unsichtbar machen: */
  width: 48px;
  padding-right: 15px;
  text-indent: 100px;
  overflow: hidden;
  white-space: nowrap;
}
header .menu-toggler > span {
  position: absolute;
  display: block;
  width: 18px;
  height: 2px;
  top: 50%;
  right: 15px;
  background: #333;
  transition: background .2s ease-out;
}
header .menu-toggler > span:before,
header .menu-toggler > span:after {
  background: #333;
  content: '';
  display: block;
  height: 100%;
  position: absolute;
  transition: all .2s ease-out;
  width: 100%;
}
header .menu-toggler > span:before {
  top: 5px;
}
header .menu-toggler > span:after {
  top: -5px;
}

header > input[type="checkbox"]:checked ~ .zelle .menu-toggler > span {
  background: transparent;
}
header > input[type="checkbox"]:checked ~ .zelle .menu-toggler > span:before {
  transform: rotate(-45deg);
}
header > input[type="checkbox"]:checked ~ .zelle .menu-toggler > span:after {
  transform: rotate(45deg);
}
header > input[type="checkbox"]:checked ~ .zelle .menu-toggler > span:before,
header > input[type="checkbox"]:checked ~ .zelle .menu-toggler > span:after {
  top: 0;
}

header .main-menu {
  padding: 0;
  max-height: 0;
  width: 100%;
  opacity: 0;
  overflow: auto;
  transition: opacity 300ms, max-height 300ms ease-out, padding 500ms;
  box-shadow: 0 10px 10px rgb(0 0 0 / 20%);
}
header > input[type="checkbox"]:checked ~ .main-menu {
  max-height: calc(100vh - 45px);
  opacity: 1;
}

header ul {
  margin: 0;
  padding: 0;
}
header .main-menu > ul {
  padding: 2em 0;
}

header li {
  position: relative;
  display: block;
  color: #000;
  border-style: solid;
  /* border-color: rgba(0, 0, 0, .05); */
  border-color: transparent;
  border-width: 0 0 1px 0;
}

header label.drop-icon {
  position: absolute;
  top: 0;
  right: 1.5em;
  padding: 0.5em 1em;
  font-size: 1em;
  line-height: 1.5em;
  text-align: center;
  border-radius: 3px;
  background-color: rgba(0, 0, 0, .125);
  color: rgba(255, 255, 255, .75);
}
header label.drop-icon:before {
  display: inline-block;
  content: "";
  width: 0;
  height: 0;
  vertical-align: middle;
  border-style: solid;
  border-width: 5px 3.5px 0 3.5px;
  border-color: #454545 transparent transparent transparent;
}
header input[type="checkbox"]:checked ~ label.drop-icon:before {
  border-width: 0 3.5px 5px 3.5px;
  border-color: transparent transparent #454545 transparent;
}

header input[type="checkbox"] {
  display: none;
}

header .sub-menu {
  display: none;
  padding: 0 0 1em 1em;
  font-size: 15px;
  font-weight: 400;
  border-style: solid;
  /* border-color: rgba(0, 0, 0, .05); */
  border-color: transparent;
  border-width: 1px 1px 0 1px;
  text-transform: none;
}

header input[type="checkbox"]:checked ~ .sub-menu {
  display: block;
}

header .sub-menu li:last-child {
  border-width: 0;
}

header .sub-menu ul:not(.sub-menu) {
  margin-bottom: 2em;
}

header a {
  position: relative;
  display: block;
  color: #000;
  padding: 1em 5em 1em 1.5em;
  text-decoration: none;
  transition: all 300ms ease-in-out;
}

header a:hover,
header a.aktiv {
  background-color: rgb(255 255 255 / 65%);
  color: var(--farbe-primaer);
  text-decoration: none;
}

header .sub-menu a {
  line-height: 1.5em;
  padding-top: 0.2em;
  padding-bottom: 0.2em;
}

header .sub-menu a:hover {
  color: var(--farbe-primaer);
  background-color: #f5f5f5;
}

header .main-menu .sf {
  margin: 1em 1.5em 0 1.5em;
  line-height: 32px;
  height: 32px;
}

@media only screen and (min-width: 576px) {
  header .meta {
    justify-content: space-between;
    padding: 0 2em;
  }
  header .meta .bereich {
    display: block;
  }
}

@media only screen and (min-width: 1200px) {
  header {
    flex-direction: row;
    height: auto;
    background-color: transparent;
    backdrop-filter: none;
    box-shadow: none;
    font-weight: 600;
    font-size: 0.8em;
  }
  header.fixiert {
    background-color: rgb(255 255 255 / 70%);
    backdrop-filter: blur(8px);
    box-shadow: 0 1px 3px rgb(0 0 0 / 12%);
  }

  header .zelle {
    padding: 0 60px;
  }

  header .logo,
  footer .logo {
    font-size: 40px;
  }
  header .logo:before,
  footer .logo:before {
    width: 70px;
    height: 70px;
  }
  header.fixiert .logo {
    font-size: 30px;
  }
  header.fixiert .logo:before {
    height: 30px;
  }

  header .meta {
    display: none;
    width: auto;
    min-width: 200px;
    max-width: 400px;
    padding: 0 3em;
  }

  header .main-menu {
    overflow: visible;
    vertical-align: top;
    text-align: center;
    margin: 0;
    padding: 0;
    opacity: 1;
    max-height: none;
    box-shadow: none;
  }
  header .main-menu > ul {
    padding: 0;
  }

  header .menu-toggler,
  header a {
    line-height: 100px;
  }

  header a {
    padding: 0 1.5em;
  }

  header.fixiert header .menu-toggler,
  header.fixiert a {
    line-height: 60px;
  }

  header.fixiert .sub-menu a {
    line-height: 1.5em;
  }

  header .menu-toggler,
  header label.drop-icon {
    display: none;
  }

  header .has-sub-menu:after {
    display: inline-block;
    content: "";
    margin-left: 5px;
    width: 0;
    height: 0;
    vertical-align: middle;
    margin-top: -4px;
    border-style: solid;
    border-width: 4px 3.5px 0 3.5px;
    border-color: #2c2c2c transparent transparent transparent;
  }
  header li ul .has-sub-menu:after {
    border-width: 3.5px 0 3.5px 4px;
    border-color: transparent transparent transparent #2c2c2c;
  }

  header li {
    display: inline-block;
    text-align: left;
    border-width: 0 1px 0 0;
  }

  header .sub-menu {
    position: absolute;
    z-index: 3000;
    top: 90%;
    left: 0;
    margin: 0;
    padding: 1.5em 0;
    width: 18em;
    border-width: 0;
    background-color: #fff;
    box-shadow: 1px 5px 30px rgb(0 0 0 / 15%);
  }
  header .sub-menu.wide {
    width: 54em;
    left: -18em;
  }
  header .sub-menu.wide > li {
    clear: both;
  }

  header .sub-menu,
  header input[type="checkbox"]:checked ~ .sub-menu {
    display: none;
  }

  header .sub-menu li {
    float: none;
    display: block;
    border-width: 0 0 1px 0;
  }

  header .sub-menu ul:not(.sub-menu) {
    float: left;
    width: 33%;
  }

  header .sub-menu .sub-menu {
    top: 0;
    left: 100%;
  }

  header .sub-menu .drop-icon {
    position: absolute;
    top: 0;
    right: 0;
    padding: 0.5em 1em;
  }

  header li:hover > input[type="checkbox"] ~ .sub-menu {
    display: block;
  }

  header .keintext {
    width: 50px;
    text-indent: 80px;
    padding-left: 0.75em;
    padding-right: 0.75em;
    white-space: nowrap;
    overflow: hidden;
  }
  header .keintext:before {
    display: block;
    position: absolute;
    text-indent: 0;
    top: 50%;
    transform: translateY(-65%);
  }

  header .main-menu .suche a {
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
    text-indent: -1000px;
    padding-right: 3.5em;
  }
  header .main-menu .suche a:before {
    text-indent: 1000px;
    font-size: 1.5em;
  }
}

@media only screen and (min-width: 1600px) {
  header {
    padding: 0 90px 0 90px;
  }
}



.menueoeffner {
  position: fixed;
  top: 0;
  left: 0;
  width: 4em;
  height: 4em;
  padding: 1em;
  background-color: #000;
  transition: left 500ms ease, right 500ms ease;
}
#menu.alterniert .menueoeffner {
  left: calc(100% - 4em);
  background-color: transparent;
}
.menueoeffner:hover,
#menu.alterniert .menueoeffner:hover {
  opacity: 0.85;
}
.menueoeffner-box {
  width: 100%;
  height: 100%;
  top: 8px;
}
#menu.alterniert .menueoeffner .menueoeffner-inner,
#menu.alterniert .menueoeffner .menueoeffner-inner::before,
#menu.alterniert .menueoeffner .menueoeffner-inner::after {
  background-color: #fff;
}
.menueoeffner-inner,
.menueoeffner-inner::before,
.menueoeffner-inner::after {
  width: 100%;
  height: 2px;
  background-color: #fff;
  border-radius: 0;
  transition-duration: 0.35s;
}

@media only screen and  (min-width: 768px) {
  .menueoeffner {
    left: 0;
    background-color: transparent;
  }

  #menu.alterniert .menueoeffner {
    left: 14em;
  }
}

@media only screen and (min-width: 992px) {
  .menueoeffner {
    left: 14em;
  }

  /* in der Desktop-Ansicht ist die Logik umgekehrt:
     das Menü ist immer sichtbar und wird beim Alternieren ausgeblendet */
  #menu.alterniert .menueoeffner {
    left: 0;
  }

  .menueoeffner .menueoeffner-inner {
    transform: translate3d(0, 6px, 0) rotate(45deg);
  }
  .menueoeffner .menueoeffner-inner::after {
    transform: translate3d(0, -8px, 0) rotate(-90deg);
  }

  #menu.alterniert .menueoeffner .menueoeffner-inner {
    transform: translate3d(0, 7px, 0) rotate(0deg);
  }
  #menu.alterniert .menueoeffner .menueoeffner-inner::after {
    transform: translate3d(0, -12px, 0) rotate(0deg);
  }

}





/* ----- Seitenaufbau ----- */

.inhalt {
  position: relative;
  display: flex;
  align-items: flex-start;
  z-index: 1;
}

.sektionen {
  position: relative;
  width: 100%;
  flex: 1 1 auto;
  z-index: 3;
}
/* Offset für Navigation */
.sektionen > section:first-child {
  /* kein Offset wegen transparentem Hintergrund */
  /* margin-top: 45px; */
}
/* letzte Inhaltssektion mit mehr Abstand footer */
.sektionen > section:last-of-type {
  padding-bottom: var(--sektion-padding-y);
}
@media only screen and (min-width: 1300px) {
  /* Offset für Navigation */
  .sektionen > section:first-child {
    /* kein Offset wegen transparentem Hintergrund */
    /* margin-top: 70px; */
  }
}

.container {
  position: relative;
  width: 100%;
}
.container:before,
.container:after {
  content: " ";
  display: table;
}
.container:after {
  clear: both;
}

section {
  position: relative;
  /* background-color: #fff; */  /* für m1/m2 overscroll */
}
section:target {
  /* Hilfsmittel um beim Sprung zu Ankerpunkten einen Versatz zu erreichen, damit das Element nicht von der Menüleiste verdeckt wird */
  padding-top: 70px;
  margin-top: -70px;
  background-clip: content-box;
}
section .container {
  padding: var(--sektion-padding-y) var(--sektion-padding-x);
  max-width: var(--sektion-max-breite);
  margin: 0 auto;
}
section.separator:after {
  display: block;
  content: "";
  width: calc(100% - (2 * var(--sektion-padding-x)));
  max-width: calc(var(--sektion-max-breite) - (2 * var(--sektion-padding-x)));
  height: 0;
  margin: 0 auto;
  border-bottom: 1px solid #eee;
}
section.verbinden .container {
  padding-bottom: 0.25em;
}
section.verbinden + section .container,
section.verbinden + div > section .container {
  padding-top: 0.25em;
}
section .container img {
  max-width: 100%;
  height: auto;
  max-height: none;
}
section.hell {
  color: #fff;
  background-color: #181818;
}
section.verlauf {
  background-color: #f0f0f0;
  background: linear-gradient(40deg, #c5c5c5, #f0f0f0);
}
section.hell.verlauf {
  color: #fff;
  background-color: var(--farbe-primaer);
  background: linear-gradient(40deg, #181818, var(--farbe-primaer));
}

body.editor section {
  border-bottom: 1px dashed rgba(0,0,0,0.5);
  border-top: 1px dashed rgba(255,255,255,0.5);
}
body.editor section:not(.dcr-m1):not(.dcr-m2):not(.dcr-m3):not(.dcr-m35) {
  padding: 5em 0;
}
body.editor .abschnitt,
body.editor section:not(.dcr-m10) .zelle {
  border-bottom: 1px dashed rgba(0,0,0,0.2);
  border-top: 1px dashed rgba(255,255,255,0.2);
  /* padding: 3em 0; */
}


@media only screen and  (min-width: 768px) {
  /* section .container {
    padding: var(--sektion-padding-y) var(--sektion-padding-x);
  }
  section.separator:after {
    width: calc(100% - (2 * var(--sektion-padding-x)));
    max-width: calc(var(--sektion-max-breite) - (2 * var(--sektion-padding-x)));
  } */
  section.verbinden .container {
    padding-bottom: 0.5em;
  }
  section.verbinden + section .container {
    padding-top: 0.5em;
  }

}

@media only screen and (min-width: 992px) {
}

@media only screen and (min-width: 1400px) {
}

@media only screen and (min-width: 1700px) {
}







.iframed section .container {
  padding-left: 0;
  padding-right: 0;
  margin: 0;
}







/* ----- Abschnittsgruppen ----- */

body:not(.editor) .abschnitt ~ .abschnitt,
.abschnittsgruppe.initialisiert .abschnitt {
  display: none;
}
.abschnittsgruppe.initialisiert .abschnitt.aktiv {
  display: flex;
}

.abschnittsueberschrift {
  display: none;
  width: 100%;
}
body.editor .abschnittsueberschrift {
  display: block;
}

.abschnittsumschalter {
  display: none;
}
.abschnittsgruppe.initialisiert .abschnittsumschalter {
  display: block;
}
body.editor .abschnittsumschalter {
  display: block;
}

.abschnittsumschalter .bezeichnung {
  display: none;
}
body.editor .abschnittsumschalter .bezeichnung {
  display: block;
}

.abschnittsumschalter .schalter a {
  font-weight: 700;
}
.abschnittsumschalter .schalter a:hover {
}
.abschnittsumschalter .schalter a.aktiv {
}
.abschnittsumschalter .schalter a.aktiv:hover {
}







/* ----- Flickity ----- */

.flickity-button {
  background: rgba(0, 0, 0, 0.75);
  color: #fff;
}
.flickity-button:hover {
  background: rgba(0, 0, 0, 0.75);
  color: #fff;
}
.flickity-button:focus {
  box-shadow: none;
}

.flickity-prev-next-button {
  z-index: 1;
  width: 40px;
  height: 40px;
  padding: 0;
  border-radius: 0;
}
.flickity-prev-next-button.previous {
  left: 1em;
}
.flickity-prev-next-button.next {
  right: 1em;
}
.flickity-prev-next-button:disabled {
  opacity: 0 !important;
}
.flickity-prev-next-button .flickity-button-icon {
  left: 30%;
  top: 30%;
  width: 40%;
  height: 40%;
}

.slider-position {
  display: inline-block;
  margin-top: 2em;
}

@media only screen and  (min-width: 768px) {
  .flickity-button {
    opacity: 0.15;
  }
  .flickity-enabled:hover .flickity-button {
    opacity: 0.5;
    transition: opacity 800ms;
  }
  .flickity-enabled .flickity-button:hover {
    opacity: 1;
  }
  .flickity-prev-next-button.previous {
    left: 3em;
  }
  .flickity-prev-next-button.next {
    right: 3em;
  }
}

@media only screen and (min-width: 992px) {
  .flickity-prev-next-button {
    width: 40px;
    height: 50px;
  }
}



.theme-hell #supra-fond {
  background-color: #a5a5a5;
}
#supra-slider {
  display:none;
  z-index: 50001;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  padding: 8vw;
}
#supra-slider #supra-inhalt {
  color: #fff;
  position: relative;
  top: 50% !important;
  transform: translate(0, -50%) !important;
}
.theme-hell #supra-slider #supra-inhalt {
  color: #000;
}
#supra-slider .schliesser {
  position: absolute;
  display: block;
  z-index: 50002;
  cursor: pointer;
  top: 2em;
  right: 2em;
  width: 2em;
  height: 2em;
  padding: 0;
  text-decoration: none;
  color: transparent;
  outline: none;
  background: transparent;
  border: none;
}
#supra-slider .schliesser:before {
  display: block;
  content: "";
  cursor: pointer;
  width: 100%;
  height: 100%;
  vertical-align: middle;
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMTUgMTUiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDE1IDE1OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGw6bm9uZTtzdHJva2U6I2ZmZmZmZjtzdHJva2Utd2lkdGg6MjtzdHJva2UtbGluZWNhcDpzcXVhcmU7fQo8L3N0eWxlPgo8ZyBpZD0iV2VsY29tZSI+Cgk8ZyBpZD0iRGVza3RvcC1IRCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTI2NC4wMDAwMDAsIC0zMDcuMDAwMDAwKSI+CgkJPGcgaWQ9IlRvb2xiYXIiPgoJCQk8ZyBpZD0iQnV0dG9ucyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNDAuMDAwMDAwLCAzMDkuMDAwMDAwKSI+CgkJCQk8ZyBpZD0iQnV0dG9uX3gyRl9Dcm9zcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjI2LjAwMDAwMCwgMC4wMDAwMDApIj4KCQkJCQk8ZyBpZD0iR3JvdXAiPgoJCQkJCQk8cGF0aCBpZD0iTGluZS0yIiBjbGFzcz0ic3QwIiBkPSJNMTEuNCwwLjNsLTEwLjgsMTEiLz4KCQkJCQkJPHBhdGggaWQ9IkxpbmUtMl8xXyIgY2xhc3M9InN0MCIgZD0iTTAuMywwLjNsMTAuOCwxMC45Ii8+CgkJCQkJPC9nPgoJCQkJPC9nPgoJCQk8L2c+CgkJPC9nPgoJPC9nPgo8L2c+Cjwvc3ZnPgo=') no-repeat center center;
  background-size: 100%;
}
.theme-hell #supra-slider .schliesser:before {
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMTUgMTUiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDE1IDE1OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGw6bm9uZTtzdHJva2U6IzAwMDAwMDtzdHJva2Utd2lkdGg6MjtzdHJva2UtbGluZWNhcDpzcXVhcmU7fQo8L3N0eWxlPgo8ZyBpZD0iV2VsY29tZSI+Cgk8ZyBpZD0iRGVza3RvcC1IRCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTI2NC4wMDAwMDAsIC0zMDcuMDAwMDAwKSI+CgkJPGcgaWQ9IlRvb2xiYXIiPgoJCQk8ZyBpZD0iQnV0dG9ucyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNDAuMDAwMDAwLCAzMDkuMDAwMDAwKSI+CgkJCQk8ZyBpZD0iQnV0dG9uX3gyRl9Dcm9zcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjI2LjAwMDAwMCwgMC4wMDAwMDApIj4KCQkJCQk8ZyBpZD0iR3JvdXAiPgoJCQkJCQk8cGF0aCBpZD0iTGluZS0yIiBjbGFzcz0ic3QwIiBkPSJNMTEuNCwwLjNsLTEwLjgsMTEiLz4KCQkJCQkJPHBhdGggaWQ9IkxpbmUtMl8xXyIgY2xhc3M9InN0MCIgZD0iTTAuMywwLjNsMTAuOCwxMC45Ii8+CgkJCQkJPC9nPgoJCQkJPC9nPgoJCQk8L2c+CgkJPC9nPgoJPC9nPgo8L2c+Cjwvc3ZnPgo=') no-repeat center center;
  background-size: 100%;
}

#supra-inhalt .download {
  /* display: block; */
  display: none;
  float: right;
  width: 1.5em;
  height: 1.5em;
  margin-top: 2em;
  margin-left: 1.5em;
}
#supra-inhalt .download:before,
#supra-inhalt .styleswitcher:before {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background: url('data:image/svg+xml;base64,CjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iRWJlbmVfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiCgkgdmlld0JveD0iMCAwIDMwIDMwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAzMCAzMDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOm5vbmU7c3Ryb2tlOiNGRkZGRkY7c3Ryb2tlLXdpZHRoOjEuNTt9Cjwvc3R5bGU+CjxnIGlkPSJTaXRlbWFwX3gyRl9TdHlsZSI+Cgk8ZyBpZD0iQnV0dG9uc194MkZfSWNvbnMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xNTE0LjAwMDAwMCwgLTIzMi4wMDAwMDApIj4KCQk8ZyBpZD0iRG93bmxvYWQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE1MTQuMDAwMDAwLCAyMzIuMDAwMDAwKSI+CgkJCTxwYXRoIGlkPSJMaW5lIiBjbGFzcz0ic3QwIiBkPSJNOC4yNiwyMC40NDZoMTIuNDgiLz4KCQkJPHBhdGggaWQ9IkxpbmUtMiIgY2xhc3M9InN0MCIgZD0iTTE0LjY3Miw2LjEyN3YxMC43ODgiLz4KCQkJPHBvbHlsaW5lIGlkPSJQYXRoIiBjbGFzcz0ic3QwIiBwb2ludHM9IjEwLDEyIDE0LjU5LDE3LjA0OCAxOS4xODEsMTIgCQkJIi8+CgkJCTxjaXJjbGUgaWQ9Ik92YWwiIGNsYXNzPSJzdDAiIGN4PSIxNSIgY3k9IjE1IiByPSIxNC4yNSIvPgoJCTwvZz4KCTwvZz4KPC9nPgo8L3N2Zz4K') no-repeat center center;
  background-size: 100%;
}
.theme-hell #supra-inhalt .download:before {
  background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzBweCIgaGVpZ2h0PSIzMHB4IiB2aWV3Qm94PSIwIDAgMzAgMzAiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8ZyBpZD0iU2l0ZW1hcC9TdHlsZSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9IkJ1dHRvbnMvSWNvbnMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xNTE0LjAwMDAwMCwgLTIzMi4wMDAwMDApIiBzdHJva2U9IiMwMDAwMDAiIHN0cm9rZS13aWR0aD0iMS41Ij4KICAgICAgICAgICAgPGcgaWQ9IkRvd25sb2FkIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxNTE0LjAwMDAwMCwgMjMyLjAwMDAwMCkiPgogICAgICAgICAgICAgICAgPHBhdGggZD0iTTguMjYsMjAuNDQ1ODk3NyBMMjAuNzQsMjAuNDQ1ODk3NyIgaWQ9IkxpbmUiIGZpbGwtcnVsZT0ibm9uemVybyI+PC9wYXRoPgogICAgICAgICAgICAgICAgPHBhdGggZD0iTTE0LjY3MjQxMzgsNi4xMjcyODk4NyBMMTQuNjcyNDEzOCwxNi45MTU1NzY3IiBpZD0iTGluZS0yIiBmaWxsLXJ1bGU9Im5vbnplcm8iPjwvcGF0aD4KICAgICAgICAgICAgICAgIDxwb2x5bGluZSBpZD0iUGF0aCIgZmlsbC1ydWxlPSJub256ZXJvIiBwb2ludHM9IjEwIDEyIDE0LjU5MDM0NDggMTcuMDQ3NTYyNCAxOS4xODA2ODk3IDEyIj48L3BvbHlsaW5lPgogICAgICAgICAgICAgICAgPGNpcmNsZSBpZD0iT3ZhbCIgY3g9IjE1IiBjeT0iMTUiIHI9IjE0LjI1Ij48L2NpcmNsZT4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+') no-repeat center center;
  background-size: 100%;
}
#supra-inhalt .styleswitcher {
  display: block;
  /* display: none; */
  float: right;
  width: 1.5em;
  height: 1.5em;
  margin-top: 2em;
  margin-left: 1.5em;
}
#supra-inhalt .styleswitcher:before {
  background: url('data:image/svg+xml;base64,CjxzdmcgaWQ9IkViZW5lXzEiIGRhdGEtbmFtZT0iRWJlbmUgMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgMTMuMzUzIDE4LjY0NyI+PGRlZnM+PHN0eWxlPi5jbHMtMXtmaWxsOiNmZmY7c3Ryb2tlOiNmZmY7c3Ryb2tlLW1pdGVybGltaXQ6MTA7fTwvc3R5bGU+PC9kZWZzPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTYuNDI5LDguODIzYTEwLjY0MiwxMC42NDIsMCwwLDEsMi42OS03LjEsNyw3LDAsMCwwLS45MzktLjAwNSw3LjMzOSw3LjMzOSwwLDAsMC02LjQ4Nyw2Ljc3LDcuMDM1LDcuMDM1LDAsMCwwLDYuOTI0LDcuNDQ2Yy4xNjgsMCwuMzM2LS4wMDYuNS0uMDE4QTEwLjY0MywxMC42NDMsMCwwLDEsNi40MjksOC44MjNabTEuNjg2LDBhOC44NjQsOC44NjQsMCwwLDAsNC4xLDcuNTE0LjMuMywwLDAsMS0uMDI1LjUxOCw4LjQxNiw4LjQxNiwwLDAsMS0zLjU3MS43OTJBOC43MzMsOC43MzMsMCwwLDEsLjAwOSw4LjQxNiw5LjAzMSw5LjAzMSwwLDAsMSw4LjA3Ni4wMTdhOC40MzIsOC40MzIsMCwwLDEsNC4xMTMuNzc2LjMuMywwLDAsMSwuMDI0LjUxNyw4Ljg2NCw4Ljg2NCwwLDAsMC00LjEsNy41MTNaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjUgMC41KSIvPjwvc3ZnPg==') no-repeat center center;
  background-size: 60%;
}
#supra-inhalt .styleswitcher[data-class="theme-hell"]:before {
  background: url('data:image/svg+xml;base64,CjxzdmcgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE2IDE2IiB3aWR0aD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxkZWZzPjxwYXRoIGlkPSJhIiBkPSJtNi40NzA1ODgyNCAxMy42NTQyMzc4di0xLjE3NjQ3MDVjMC0uMzI0ODczNC4yNjMzNjE5MS0uNTg4MjM1My41ODgyMzUyOS0uNTg4MjM1M3MuNTg4MjM1MjkuMjYzMzYxOS41ODgyMzUyOS41ODgyMzUzdjEuMTc2NDcwNWMwIC4zMjQ4NzM0LS4yNjMzNjE5MS41ODgyMzUzLS41ODgyMzUyOS41ODgyMzUzcy0uNTg4MjM1MjktLjI2MzM2MTktLjU4ODIzNTI5LS41ODgyMzUzem01LjI4NDkzMTc2LTIuOTA0NDA2MS44NTMyODAzLjgwOTkzNTZjLjIzNTYyNjkuMjIzNjU3NS4yNDUzMjk5LjU5NTk4MTEuMDIxNjcyNC44MzE2MDgtLjIyMzY1NzYuMjM1NjI2OC0uNTk1OTgxMS4yNDUzMjk5LS44MzE2MDguMDIxNjcyM2wtLjg1MzI4MDQtLjgwOTkzNTZjLS4yMzU2MjY4LS4yMjM2NTc1LS4yNDUzMjk5LS41OTU5ODExLS4wMjE2NzIzLS44MzE2MDguMjIzNjU3NS0uMjM1NjI2OC41OTU5ODExLS4yNDUzMjk5LjgzMTYwOC0uMDIxNjcyM3ptLTguOTU5OTM2NiAwYy4yMzU2MjY4Ni0uMjIzNjU3Ni42MDc5NTA0NC0uMjEzOTU0NS44MzE2MDc5OC4wMjE2NzIzLjIyMzY1NzU0LjIzNTYyNjkuMjEzOTU0NDkuNjA3OTUwNS0uMDIxNjcyMzcuODMxNjA4bC0uODUzMjgwMzQuODA5OTM1NmMtLjIzNTYyNjg3LjIyMzY1NzYtLjYwNzk1MDQ0LjIxMzk1NDUtLjgzMTYwNzk4LS4wMjE2NzIzLS4yMjM2NTc1NS0uMjM1NjI2OS0uMjEzOTU0NS0uNjA3OTUwNS4wMjE2NzIzNi0uODMxNjA4em0tMi4yMDczNDgxMS0zLjEwMjc3Mjg4Yy0uMzI0ODczMzggMC0uNTg4MjM1MjktLjI2MzM2MTkxLS41ODgyMzUyOS0uNTg4MjM1MjlzLjI2MzM2MTkxLS41ODgyMzUyOS41ODgyMzUyOS0uNTg4MjM1MjloMS4xNzY0NzA1OWMuMzI0ODczMzggMCAuNTg4MjM1My4yNjMzNjE5MS41ODgyMzUzLjU4ODIzNTI5cy0uMjYzMzYxOTIuNTg4MjM1MjktLjU4ODIzNTMuNTg4MjM1Mjl6bTExLjc2NDcwNTkxIDBjLS4zMjQ4NzM0IDAtLjU4ODIzNTMtLjI2MzM2MTkxLS41ODgyMzUzLS41ODgyMzUyOXMuMjYzMzYxOS0uNTg4MjM1MjkuNTg4MjM1My0uNTg4MjM1MjloMS4xNzY0NzA2Yy4zMjQ4NzMzIDAgLjU4ODIzNTMuMjYzMzYxOTEuNTg4MjM1My41ODgyMzUyOXMtLjI2MzM2Mi41ODgyMzUyOS0uNTg4MjM1My41ODgyMzUyOXptLTUuODgyMzUyOTYtNy4wNTg4MjM1M2MwLS4zMjQ4NzMzOC4yNjMzNjE5MS0uNTg4MjM1MjkuNTg4MjM1MjktLjU4ODIzNTI5cy41ODgyMzUyOS4yNjMzNjE5MS41ODgyMzUyOS41ODgyMzUyOXYxLjE3NjQ3MDU5YzAgLjMyNDg3MzM4LS4yNjMzNjE5MS41ODgyMzUzLS41ODgyMzUyOS41ODgyMzUzcy0uNTg4MjM1MjktLjI2MzM2MTkyLS41ODgyMzUyOS0uNTg4MjM1M3ptNS4yODQ5MzE3NiAyLjkwNDQwNjE4Yy0uMjM1NjI2OS4yMjM2NTc1NS0uNjA3OTUwNS4yMTM5NTQ1LS44MzE2MDgtLjAyMTY3MjM2LS4yMjM2NTc2LS4yMzU2MjY4Ny0uMjEzOTU0NS0uNjA3OTUwNDQuMDIxNjcyMy0uODMxNjA3OThsLjg1MzI4MDQtLjgwOTkzNTYxYy4yMzU2MjY5LS4yMjM2NTc1NS42MDc5NTA0LS4yMTM5NTQ1LjgzMTYwOC4wMjE2NzIzNi4yMjM2NTc1LjIzNTYyNjg3LjIxMzk1NDUuNjA3OTUwNDQtLjAyMTY3MjQuODMxNjA3OTh6bS04Ljk1OTkzNjYgMC0uODUzMjgwMzUtLjgwOTkzNTYxYy0uMjM1NjI2ODYtLjIyMzY1NzU0LS4yNDUzMjk5MS0uNTk1OTgxMTEtLjAyMTY3MjM2LS44MzE2MDc5OC4yMjM2NTc1NC0uMjM1NjI2ODYuNTk1OTgxMTEtLjI0NTMyOTkxLjgzMTYwNzk4LS4wMjE2NzIzNmwuODUzMjgwMzQuODA5OTM1NjFjLjIzNTYyNjg2LjIyMzY1NzU0LjI0NTMyOTkxLjU5NTk4MTExLjAyMTY3MjM3LjgzMTYwNzk4LS4yMjM2NTc1NC4yMzU2MjY4Ni0uNTk1OTgxMTIuMjQ1MzI5OTEtLjgzMTYwNzk4LjAyMTY3MjM2em00LjI2MzI0MDEzIDYuNTA3MzU4NTNjMS42MjQzNjY5MSAwIDIuOTQxMTc2NDctMS4zMTY4MDk1NiAyLjk0MTE3NjQ3LTIuOTQxMTc2NDdzLTEuMzE2ODA5NTYtMi45NDExNzY0Ny0yLjk0MTE3NjQ3LTIuOTQxMTc2NDctMi45NDExNzY0NyAxLjMxNjgwOTU2LTIuOTQxMTc2NDcgMi45NDExNzY0NyAxLjMxNjgwOTU2IDIuOTQxMTc2NDcgMi45NDExNzY0NyAyLjk0MTE3NjQ3em0wIDEuMTc2NDcwNmMtMi4yNzQxMTM2OCAwLTQuMTE3NjQ3MDYtMS44NDM1MzMzOS00LjExNzY0NzA2LTQuMTE3NjQ3MDdzMS44NDM1MzMzOC00LjExNzY0NzA2IDQuMTE3NjQ3MDYtNC4xMTc2NDcwNiA0LjExNzY0NzA3IDEuODQzNTMzMzggNC4xMTc2NDcwNyA0LjExNzY0NzA2LTEuODQzNTMzMzkgNC4xMTc2NDcwNy00LjExNzY0NzA3IDQuMTE3NjQ3MDd6Ii8+PG1hc2sgaWQ9ImIiIGZpbGw9IiNmZmYiPjx1c2UgZmlsbD0ibm9uZSIgeGxpbms6aHJlZj0iI2EiLz48L21hc2s+PC9kZWZzPjxnIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLjk0MTE3NiAuOTQxMTc2KSI+PHVzZSBmaWxsLXJ1bGU9Im5vbnplcm8iIHhsaW5rOmhyZWY9IiNhIi8+PGcgbWFzaz0idXJsKCNiKSI+PHBhdGggZD0ibTAgMGgxNjguMjM1Mjk0djE2OC4yMzUyOTRoLTE2OC4yMzUyOTR6IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNzcuNjQ3MDU5IC03OC4yMzUyOTQpIi8+PC9nPjwvZz48L3N2Zz4=') no-repeat center center;
  background-size: 90%;
}
.theme-hell #supra-inhalt .styleswitcher:before {
  background: url('data:image/svg+xml;base64,CjxzdmcgaGVpZ2h0PSIxOCIgdmlld0JveD0iMCAwIDEzIDE4IiB3aWR0aD0iMTMiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0ibTEzMzAuNDI5MzUgNTM2LjgyMzQ5MWMwLTIuNjgyODM3Ljk5MDQyLTUuMTkzMjA1IDIuNjg5NDctNy4wOTY0NDktLjMwOTM4LS4wMjI2OTctLjYyMjctLjAyNDQyOS0uOTM4NjEtLjAwNDYyMy0zLjMyMjE2LjIwODIwOS02LjMzNzQgMy4zNDgwOTMtNi40ODc1NyA2Ljc2OTk2LS4xNzg3NCA0LjA3MTc1NyAyLjk4MDAxIDcuNDQ1OTg3IDYuOTI0MzIgNy40NDU5ODcuMTY4MjggMCAuMzM1NjUtLjAwNjE0OS41MDE4OC0uMDE4MzU1LTEuNjk5MTQtMS45MDMzODItMi42ODk0OS00LjQxMzc3OC0yLjY4OTQ5LTcuMDk2NTJ6bTEuNjg1MzYgMGMwIDMuMTc2MDU1IDEuNjM5MzEgNS45NTkyOTQgNC4wOTgxMyA3LjUxMzA1NS4xOTU0Ny4xMjM1MzcuMTgzOTguNDIwNzU5LS4wMjQ5OS41MTgyNjQtMS4wODc5NC41MDg0MS0yLjI5Njk2Ljc5MjI0OS0zLjU3MDg5Ljc5MjI0OS00Ljg5MDkyIDAtOC44MzAwNS00LjE3MjQzMy04LjYwODAxLTkuMjMwNjQ5LjE4ODI5LTQuMjkwMzgxIDMuODgwOTctOC4xMzcwNiA4LjA2NzI3LTguMzk5NDI4IDEuNDczMTQtLjA5MjM1OCAyLjg3MTg4LjE5NTU5OSA0LjExMzA3Ljc3NTkyNS4yMDgzOS4wOTczNTguMjE5MTYuMzkzOTkyLjAyNDI3LjUxNzIzNC0yLjQ1OTI1IDEuNTUzNzYxLTQuMDk4ODUgNC4zMzcwMDEtNC4wOTg4NSA3LjUxMzM1eiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTEzMjQgLTUyOCkiLz48L3N2Zz4=') no-repeat center center;
  background-size: 60%;
}
.theme-hell #supra-inhalt .styleswitcher[data-class="theme-hell"]:before {
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMTYgMTYiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDE2IDE2OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbHRlcjp1cmwoI0Fkb2JlX09wYWNpdHlNYXNrRmlsdGVyKTt9Cgkuc3Qxe2ZpbGw6bm9uZTt9Cgkuc3Qye21hc2s6dXJsKCNiXzFfKTt9Cjwvc3R5bGU+CjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC45NDExNzYgLjk0MTE3NikiPgoJPGc+CgkJPHBhdGggaWQ9ImFfMV8iIGQ9Ik02LjUsMTMuN3YtMS4yYzAtMC4zLDAuMy0wLjYsMC42LTAuNnMwLjYsMC4zLDAuNiwwLjZ2MS4yYzAsMC4zLTAuMywwLjYtMC42LDAuNlM2LjUsMTQsNi41LDEzLjd6IE0xMS44LDEwLjcKCQkJbDAuOSwwLjhjMC4yLDAuMiwwLjIsMC42LDAsMC44cy0wLjYsMC4yLTAuOCwwbC0wLjktMC44Yy0wLjItMC4yLTAuMi0wLjYsMC0wLjhTMTEuNSwxMC41LDExLjgsMTAuN3ogTTIuOCwxMC43CgkJCWMwLjItMC4yLDAuNi0wLjIsMC44LDBzMC4yLDAuNiwwLDAuOGwtMC45LDAuOGMtMC4yLDAuMi0wLjYsMC4yLTAuOCwwcy0wLjItMC42LDAtMC44TDIuOCwxMC43eiBNMC42LDcuNkMwLjMsNy42LDAsNy40LDAsNy4xCgkJCXMwLjMtMC42LDAuNi0wLjZoMS4yYzAuMywwLDAuNiwwLjMsMC42LDAuNlMyLjEsNy42LDEuOCw3LjZIMC42eiBNMTIuNCw3LjZjLTAuMywwLTAuNi0wLjMtMC42LTAuNnMwLjMtMC42LDAuNi0wLjZoMS4yCgkJCWMwLjMsMCwwLjYsMC4zLDAuNiwwLjZzLTAuMywwLjYtMC42LDAuNkgxMi40eiBNNi41LDAuNkM2LjUsMC4zLDYuNywwLDcuMSwwczAuNiwwLjMsMC42LDAuNnYxLjJjMCwwLjMtMC4zLDAuNi0wLjYsMC42CgkJCVM2LjUsMi4xLDYuNSwxLjhWMC42eiBNMTEuOCwzLjVjLTAuMiwwLjItMC42LDAuMi0wLjgsMGMtMC4yLTAuMi0wLjItMC42LDAtMC44bDAuOS0wLjhjMC4yLTAuMiwwLjYtMC4yLDAuOCwwczAuMiwwLjYsMCwwLjgKCQkJTDExLjgsMy41eiBNMi44LDMuNUwxLjksMi43Yy0wLjItMC4yLTAuMi0wLjYsMC0wLjhzMC42LTAuMiwwLjgsMGwwLjksMC44YzAuMiwwLjIsMC4yLDAuNiwwLDAuOEMzLjQsMy43LDMsMy43LDIuOCwzLjV6IE03LjEsMTAKCQkJQzguNywxMCwxMCw4LjcsMTAsNy4xUzguNyw0LjEsNy4xLDQuMVM0LjEsNS40LDQuMSw3LjFTNS40LDEwLDcuMSwxMHogTTcuMSwxMS4yYy0yLjMsMC00LjEtMS44LTQuMS00LjFzMS44LTQuMSw0LjEtNC4xCgkJCXM0LjEsMS44LDQuMSw0LjFTOS4zLDExLjIsNy4xLDExLjJ6Ii8+Cgk8L2c+Cgk8ZGVmcz4KCQk8ZmlsdGVyIGlkPSJBZG9iZV9PcGFjaXR5TWFza0ZpbHRlciIgZmlsdGVyVW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4PSItNzcuNiIgeT0iLTc4LjIiIHdpZHRoPSIxNjguMiIgaGVpZ2h0PSIxNjguMiI+CgkJCTxmZUNvbG9yTWF0cml4ICB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMSAwIDAgMCAwICAwIDEgMCAwIDAgIDAgMCAxIDAgMCAgMCAwIDAgMSAwIi8+CgkJPC9maWx0ZXI+Cgk8L2RlZnM+Cgk8bWFzayBtYXNrVW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4PSItNzcuNiIgeT0iLTc4LjIiIHdpZHRoPSIxNjguMiIgaGVpZ2h0PSIxNjguMiIgaWQ9ImJfMV8iPgoJCTxnIGNsYXNzPSJzdDAiPgoJCQk8cGF0aCBpZD0iYV8yXyIgY2xhc3M9InN0MSIgZD0iTTUuNSwxMi43di0xLjJjMC0wLjMsMC4zLTAuNiwwLjYtMC42czAuNiwwLjMsMC42LDAuNnYxLjJjMCwwLjMtMC4zLDAuNi0wLjYsMC42UzUuNSwxMyw1LjUsMTIuNwoJCQkJeiBNMTAuOCw5LjhsMC45LDAuOGMwLjIsMC4yLDAuMiwwLjYsMCwwLjhzLTAuNiwwLjItMC44LDBMMTAsMTAuN2MtMC4yLTAuMi0wLjItMC42LDAtMC44UzEwLjYsOS42LDEwLjgsOS44eiBNMS45LDkuOAoJCQkJYzAuMi0wLjIsMC42LTAuMiwwLjgsMHMwLjIsMC42LDAsMC44bC0wLjksMC44Yy0wLjIsMC4yLTAuNiwwLjItMC44LDBzLTAuMi0wLjYsMC0wLjhMMS45LDkuOHogTS0wLjQsNi43CgkJCQljLTAuMywwLTAuNi0wLjMtMC42LTAuNnMwLjMtMC42LDAuNi0wLjZoMS4yYzAuMywwLDAuNiwwLjMsMC42LDAuNlMxLjEsNi43LDAuOCw2LjdILTAuNHogTTExLjQsNi43Yy0wLjMsMC0wLjYtMC4zLTAuNi0wLjYKCQkJCXMwLjMtMC42LDAuNi0wLjZoMS4yYzAuMywwLDAuNiwwLjMsMC42LDAuNnMtMC4zLDAuNi0wLjYsMC42SDExLjR6IE01LjUtMC40YzAtMC4zLDAuMy0wLjYsMC42LTAuNnMwLjYsMC4zLDAuNiwwLjZ2MS4yCgkJCQljMCwwLjMtMC4zLDAuNi0wLjYsMC42UzUuNSwxLjEsNS41LDAuOFYtMC40eiBNMTAuOCwyLjZjLTAuMiwwLjItMC42LDAuMi0wLjgsMGMtMC4yLTAuMi0wLjItMC42LDAtMC44bDAuOS0wLjgKCQkJCWMwLjItMC4yLDAuNi0wLjIsMC44LDBzMC4yLDAuNiwwLDAuOEwxMC44LDIuNnogTTEuOSwyLjZMMSwxLjdDMC44LDEuNSwwLjgsMS4xLDEsMC45czAuNi0wLjIsMC44LDBsMC45LDAuOAoJCQkJYzAuMiwwLjIsMC4yLDAuNiwwLDAuOEMyLjUsMi44LDIuMSwyLjgsMS45LDIuNnogTTYuMSw5LjFjMS42LDAsMi45LTEuMywyLjktMi45UzcuNywzLjIsNi4xLDMuMlMzLjIsNC41LDMuMiw2LjEKCQkJCVM0LjUsOS4xLDYuMSw5LjF6IE02LjEsMTAuMkMzLjgsMTAuMiwyLDguNCwyLDYuMVMzLjgsMiw2LjEsMnM0LjEsMS44LDQuMSw0LjFTOC40LDEwLjIsNi4xLDEwLjJ6Ii8+CgkJPC9nPgoJPC9tYXNrPgoJPGcgY2xhc3M9InN0MiI+CgkJPHBhdGggZD0iTS03Ny42LTc4LjJIOTAuNlY5MEgtNzcuNlYtNzguMnoiLz4KCTwvZz4KPC9nPgo8L3N2Zz4K') no-repeat center center;
  background-size: 90%;
}

#supra-slider .container {
  max-width: 100%;
}
#supra-slider .container:not(.flickity-enabled) .zelle ~ .zelle {
  display: none;
}
#supra-slider .zelle {
  display: block !important;
  max-height: 100vh;
  margin: 0 auto;
}
#supra-slider .fliesstext,
#supra-slider .bild {
  display: none;
}
#supra-slider .grossansicht {
  display: block;
}
#supra-slider .grossansicht img {
  display: inline-block;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 80vh;
  vertical-align: middle;
  object-fit: contain;
  object-position: center;
}
#supra-slider .ueberschrift {
  display: inline-block;
}
#supra-slider h3 {
  text-transform: uppercase;
}
#supra-slider h4 {
  font-size: 1em;
  letter-spacing: 0.2em;
  color: inherit;
}

#supra-slider .flickity-button {
  background: rgba(255, 255, 255, 1);
  color: #000;
}
#supra-slider .flickity-button:hover {
  background: rgba(255, 255, 255, 1);
  color: #000;
}
#supra-slider .flickity-prev-next-button {
  width: 30px;
  height: 30px;
}
#supra-slider .flickity-prev-next-button.previous {
  left: -3rem;
}
#supra-slider .flickity-prev-next-button.next {
  right: -3rem;
}
.theme-hell #supra-slider .flickity-prev-next-button.previous {

}
.theme-hell #supra-slider .flickity-prev-next-button.next {

}

@media only screen and (min-width: 992px) {
  #supra-slider {
    padding: 10vw;
  }
  #supra-slider .flickity-prev-next-button {
    width: 40px;
    height: 40px;
  }
  #supra-slider .flickity-prev-next-button.previous {
    left: -6rem;
  }
  #supra-slider .flickity-prev-next-button.next {
    right: -6rem;
  }

  #supra-slider .flickity-button {
    opacity: 0.25;
    transition: opacity 800ms;
  }
  #supra-slider .flickity-enabled .flickity-button:hover {
    opacity: 1;
  }

}





/* ----- Akkordeon ----- */


.akkordeon {
}
.akkordeon .akkordeon {
  margin: 0 0 30px 30px;
}

.akkordeon .titel {
  display: block;
  font-size: 2em;
  font-weight: 300;
  text-decoration: none;
  padding: 1em 0 0.5em 0;
  margin-bottom: 0;
  border-top: 1px solid #dcdcdc;
  overflow: hidden;
  height: auto;
  max-height: 500px;
  opacity: 1;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  transition: opacity 500ms, max-height 50ms, padding 50ms;
}
.akkordeon:not(.tabs) .titel {
  cursor: pointer;
}
.akkordeon .titel:first-child {
  border-top: none;
}
.akkordeon.tabs.initialisiert .titel {
  opacity: 0;
  max-height: 0;
  padding: 0;
  border-top: none;
}
.akkordeon.tabs .titel.aktiv {
  max-height: 500px;
  opacity: 1;
}
.akkordeon.tabs.initialisiert .titel.aktiv {
  opacity: 1;
}

.akkordeon:not(.tabs) .titel:before {
  float: right;
  margin-left: 20px;
  font-family: "basis-icons";
  content: "\e834";
  color: #999;
  font-size: 100%;
  width: 35px;
  height: 35px;
}
.akkordeon:not(.tabs) .titel.aktiv:before {
  content: "\e835";
}

.akkordeon .inhalt {
  display: block;
  padding: 0 0 3em 0;
  margin: 0;
  overflow: hidden;
  height: auto;
  max-height: 5000px;
  opacity: 1;
  transition: opacity 500ms, max-height 100ms, padding 100ms;
}
.akkordeon.tabs .inhalt {
  padding: 0;
}
.akkordeon.initialisiert .inhalt {
  max-height: 0;
  opacity: 0;
  padding: 0
}
.akkordeon .inhalt.aktiv,
.akkordeon .titel.aktiv + .inhalt {
  max-height: 5000px;
  opacity: 1;
  padding: 0 0 3em 0;
}

.akkordeon .tableiste {
  margin-bottom: 2em;
  border-bottom: 1px solid #ccc;
}
.akkordeon .tableiste li {
  float: left;
  font-size: 1.1em;
}
.akkordeon .tableiste li a {
  display: block;
  padding: 0.5em 1em;
  text-decoration: none;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
.akkordeon .tableiste li a:hover {
  background-color: #ccc;
  border-bottom: 3px solid #ccc;
}
.akkordeon .tableiste li.aktiv a {
  border-bottom: 3px solid #ccc;
  font-weight: bold;
}

.akkordeon:before,
.akkordeon:after,
.akkordeon .inhalt:before,
.akkordeon .inhalt:after,
.akkordeon .tableiste:before,
.akkordeon .tableiste:after {
  content: " ";
  display: table;
}
.akkordeon:after,
.akkordeon .inhalt:after,
.akkordeon .tableiste:after {
  clear: both;
}

.akkordeon .titel h4 {
  font-size: 1.3em;
}







/* ----- Scroll-Helfer ----- */
.nachoben {
  position: fixed;
  bottom: 40px;
  right: 40px;
  text-indent: -9999px;
  width: 40px;
  height: 40px;
  z-index: 40000;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' enable-background='new 0 0 24 24' height='24px' viewBox='0 0 24 24' width='24px' fill='%23666666' %3E%3Cg%3E%3Crect fill='none' height='24' width='24'/%3E%3Cpath d='M12,20c-4.41,0-8-3.59-8-8s3.59-8,8-8s8,3.59,8,8S16.41,20,12,20 M12,22c5.52,0,10-4.48,10-10c0-5.52-4.48-10-10-10 C6.48,2,2,6.48,2,12C2,17.52,6.48,22,12,22L12,22z M11,12l0,4h2l0-4h3l-4-4l-4,4H11z'/%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
  background-size: 100%;
  opacity: 0.75;
  transition: transform 400ms;
}
.nachoben:hover {
  transform: translateY(-8px);
}
@media only screen and (max-width: 991px) {
  .nachoben {
    display: none !important;
  }
}


.nachunten {
  position: absolute;
  z-index: 1;
  bottom: 30px;
  left: 50%;
  margin-left: -10px;
  width: 20px;
  height: 40px;
  opacity: 0.4;
}
.nachunten span,
.nachunten span:before {
  position: absolute;
  left: 50%;
}
.nachunten span {
  width: 20px;
  height: 40px;
  border-radius: 20px;
  box-shadow: inset 0 0 0 2px #000;
}
.nachunten span:before {
  content: '';
  width: 2px;
  height: 12px;
  background: #000;
  margin-left: -1px;
  top: 6px;
  border-radius: 2px;
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-name: scroll;
          animation-name: scroll;
}
@keyframes scroll {
  0% {
    opacity: 1;
  }
  35% {
    opacity: 1;
  }
  70% {
    opacity: 0;
    transform: translateY(16px);
  }
  100% {
    opacity: 0;
  }
}







/* ----- Video-Elemente ----- */
.videocontainer,
.videodetector {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
  background-color: transparent;
}
.videocontainer iframe,
.videodetector iframe,
.videocontainer object,
.videodetector object,
.videocontainer embed,
.videodetector embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.remove-videodetector {
  display: none;
}
.editor .remove-videodetector {
  display: block;
  position: absolute;
  top: 15px;
  left: 15px;
  z-index: 999;
  padding: 0 20px 0 20px;
  margin: 4px 8px 4px 0;
  height: auto;
  width: auto;
  min-width: 0;
  font-size: 18px;
  line-height: 36px;
  letter-spacing: inherit;
  text-transform: none;
  font-family: 'Roboto Condensed', sans-serif;
  font-weight: 400;
  color: #fff;
  background-color: #d54e21;
  border: 1px solid #d54e21;
  appearance: none;
  user-select: none;
  cursor: pointer !important;
  text-decoration: none !important;
  border-radius: 3px;
  transition: color 250ms ease, background-color 250ms ease;
}
.editor .remove-videodetector:hover {
  background-color: #C1471D;
  border-color: #C1471D;
}








/* Ansprechpartner */
.ansprechpartner:before,
.ansprechpartner:after {
  content: " ";
  display: table;
}
.ansprechpartner:after {
  clear: both;
}
.ansprechpartner {
  margin-bottom: 50px;
}
.ansprechpartner .bild {
  max-width: 100%;
  height: auto;
  margin-top: 15px;
  box-shadow: 1px 1px 8px rgba(0, 0, 0, .3);
}
.ansprechpartner td, th {
  text-align: left;
  vertical-align: top;
}
.ansprechpartner td:first-child {
  min-width: 100px;
}









/* ----- Module ----- */


/* in Überschriften auf kleinen Bildschirmen keine manuellen Zeilenumbrüche zeigen */
@media only screen and (max-width: 991px) {
  .ueberschrift br {
    display: none;
  }
}



.dcr-m1,
.dcr-m2,
.dcr-m3 {
  height: 100vh;
  min-height: 100vh;
  width: 100%;
  /* z-index: 0; */ /* für m1/m2 overscroll */
}
.dcr-m1 {
  margin-top: 0 !important;
}
.dcr-m2 {
  height: 65vh;
  min-height: 65vh;
}
.dcr-m3 {
  height: 45vh;
  min-height: 45vh;
}
.dcr-m1 .zelle,
.dcr-m2 .zelle,
.dcr-m3 .zelle {
  position: absolute;
  overflow: hidden;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.dcr-m1 .bildblock,
.dcr-m2 .bildblock,
.dcr-m3 .bildblock {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
.dcr-m1 .bild,
.dcr-m1 .bildblock,
.dcr-m2 .bild,
.dcr-m2 .bildblock,
.dcr-m3 .bild,
.dcr-m3 .bildblock {
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
  margin: 0;
  /* für m1/m2/m3 overscroll: */
  /* position: fixed;
  height: 100vh !important; */
}
.dcr-m2 .bild,
.dcr-m2 .bildblock {
  /* height: 65vh !important; */  /* für m2 overscroll: */
}
.dcr-m3 .bild,
.dcr-m3 .bildblock {
  /* height: 45vh !important; */  /* für m3 overscroll: */
}
.dcr-m2 .bildblock .bild img,
.dcr-m2 .bildblock .bild .cke_widget_image,
.dcr-m1 .bildblock .bild img,
.dcr-m1 .bildblock .bild .cke_widget_image,
.dcr-m3 .bildblock .bild img,
.dcr-m3 .bildblock .bild .cke_widget_image {
  display: inline-block;
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
  vertical-align: middle;
  object-fit: cover;
  object-position: center;
}
.dcr-m1 .bildblock .bild img.oberkante,
.dcr-m2 .bildblock .bild img.oberkante,
.dcr-m3 .bildblock .bild img.oberkante {
  object-position: top;
  transform: none !important;
}
.dcr-m1 .bildblock .bild img.unterkante,
.dcr-m2 .bildblock .bild img.unterkante,
.dcr-m3 .bildblock .bild img.unterkante {
  object-position: bottom;
  transform: none !important;
}
.dcr-m1 .container,
.dcr-m2 .container,
.dcr-m3 .container {
  height: 100%;
  z-index: 2;
  padding-top: 25vh;
  padding-bottom: 0;
   /* für m1/m2/m3 overscroll: */
  /* position: fixed;
  width: 100%;
  max-width: none; */
}
body.editor .dcr-m1 .container,
body.editor .dcr-m2 .container,
body.editor .dcr-m3 .container {
  height: 92%;
  border-bottom: 1px dotted rgb(255 0 0 / 30%);
}
.dcr-m2 .container {
  padding-top: 18vh;
  /* height: 65vh; */  /* für m2 overscroll */
}
.dcr-m3 .container {
  padding-top: 12vh
  /* height: 45vh; */  /* für m3 overscroll */
}
.dcr-m1 .textblock,
.dcr-m2 .textblock,
.dcr-m3 .textblock {
  display: block;
  z-index: 1;
  /* padding: 1em; */
  max-width: 900px;
  /* position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); */
}

.dcr-m1 .textblock,
.dcr-m2 .textblock,
.dcr-m3 .textblock {
  text-shadow: 1px 1px 2px rgb(255 255 255 / 90%);
}
.dcr-m1.hell .textblock,
.dcr-m2.hell .textblock,
.dcr-m3.hell .textblock {
  text-shadow: 1px 1px 2px rgb(0 0 0 / 90%);
}
.dcr-m1 .sf,
.dcr-m2 .sf,
.dcr-m3 .sf {
  text-shadow: none;
}
.dcr-m1 .ueberschrift,
.dcr-m2 .ueberschrift,
.dcr-m3 .ueberschrift {
  margin-bottom: 1em;
}
.dcr-m1 h1,
.dcr-m2 h1,
.dcr-m3 h1,
.dcr-m1 h2,
.dcr-m2 h2,
.dcr-m3 h2 {
  font-size: 2.8em;
  line-height: 1.1em;
}
.dcr-m1 h1.extra,
.dcr-m2 h1.extra,
.dcr-m3 h1.extra,
.dcr-m1 h2.extra,
.dcr-m2 h2.extra,
.dcr-m3 h2.extra {
  font-size: 3.5em;
}
.dcr-m1 .fliesstext,
.dcr-m2 .fliesstext,
.dcr-m3 .fliesstext {
  max-width: 36em;
}
.dcr-m2 .scrollen,
.dcr-m3 .scrollen {
  display: none !important;
}

.dcr-m1 .flickity-prev-next-button.previous,
.dcr-m2 .flickity-prev-next-button.previous,
.dcr-m3 .flickity-prev-next-button.previous {
  left: 0;
}
.dcr-m1 .flickity-prev-next-button.next,
.dcr-m2 .flickity-prev-next-button.next,
.dcr-m3 .flickity-prev-next-button.next {
  right: 0;
}

@media only screen and (min-width: 768px) {
  .dcr-m1 h1,
  .dcr-m2 h1,
  .dcr-m3 h1,
  .dcr-m1 h2,
  .dcr-m2 h2,
  .dcr-m3 h2 {
    font-size: 3.8em;
  }
  .dcr-m1 h1.extra,
  .dcr-m2 h1.extra,
  .dcr-m3 h1.extra,
  .dcr-m1 h2.extra,
  .dcr-m2 h2.extra,
  .dcr-m3 h2.extra {
    font-size: 4.5em;
  }
}



.dcr-m6 {
  z-index: 1;
}
.dcr-m6 .container {
  text-align: center;
  padding-bottom: 0;
}
.dcr-m6 h2 strong {
  font-size: 2em;
  font-weight: 300;
  line-height: 1em;
  letter-spacing: -2px;
  margin-bottom: 0.3em;
}
.dcr-m6 hr {
  margin-top: 1em;
  margin-bottom: 0;
}



.dcr-m10 {
  /* text-align: center; */
}
.dcr-m10 .fliesstext {
  text-align: justify;
  font-size: 1.1em;
  line-height: 1.4em;
  font-weight: 500;
}



.dcr-m11.herausgestellt {
  background-color: #f7f7f7;
}
.dcr-m11 .ueberschrift {
  /* text-align: center; */
}


.dcr-m12 .fliesstext {
}
@media only screen and  (min-width: 768px) {
  .dcr-m12 .fliesstext {
    column-count: 2;
    column-gap: var(--spalten-abstand);
    column-rule: none;
  }
}



form[name=filtern] .dcr-m10 + .dcr-m15 .container {
  padding-top: 0;
}
.dcr-m15 .raster {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: stretch;
  align-items: stretch;
  justify-content: center;
  margin-right: calc(var(--spalten-halber-abstand) * -1);
  margin-left: calc(var(--spalten-halber-abstand) * -1);
}
.dcr-m15.linksbuendig .raster {
  justify-content: flex-start;
}
.dcr-m15.rechtsbuendig .raster {
  justify-content: flex-end;
}
.dcr-m15 .zelle,
.dcr-m15 .zelle.voll,
.dcr-m15 .zelle.b100 {
  position: relative;
  margin: var(--spalten-halber-abstand);
  width: calc(100% - var(--spalten-abstand));
}
.dcr-m15 .zelle.b80           { width: calc(100% - var(--spalten-abstand)); }
.dcr-m15 .zelle.dreiviertel,
.dcr-m15 .zelle.b75           { width: calc(100% - var(--spalten-abstand)); }
.dcr-m15 .zelle.b70           { width: calc(100% - var(--spalten-abstand)); }
.dcr-m15 .zelle.zweidrittel,
.dcr-m15 .zelle.b66           { width: calc(100% - var(--spalten-abstand)); }
.dcr-m15 .zelle.b60           { width: calc(100% - var(--spalten-abstand)); }
.dcr-m15 .zelle.halb,
.dcr-m15 .zelle.b50           { width: calc(100% - var(--spalten-abstand)); }
.dcr-m15 .zelle.b40           { width: calc(100% - var(--spalten-abstand)); }
.dcr-m15 .zelle.drittel,
.dcr-m15 .zelle.b33           { width: calc(100% - var(--spalten-abstand)); }
.dcr-m15 .zelle.b30           { width: calc(100% - var(--spalten-abstand)); }
.dcr-m15 .zelle.viertel,
.dcr-m15 .zelle.b25           { width: calc(50% - var(--spalten-abstand)); }
.dcr-m15 .zelle.fuenftel,
.dcr-m15 .zelle.b20           { width: calc(50% - var(--spalten-abstand)); }
.dcr-m15 .zelle.b15           { width: calc(50% - var(--spalten-abstand)); }
.dcr-m15 .zelle.achtel,
.dcr-m15 .zelle.b12_5         { width: calc(50% - var(--spalten-abstand)); }

@media only screen and (min-width: 576px) {
  .dcr-m15 .zelle.b80           { width: calc(100% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.dreiviertel,
  .dcr-m15 .zelle.b75           { width: calc(100% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.b70           { width: calc(100% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.zweidrittel,
  .dcr-m15 .zelle.b66           { width: calc(100% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.b60           { width: calc(100% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.halb,
  .dcr-m15 .zelle.b50           { width: calc(100% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.b40           { width: calc(50% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.drittel,
  .dcr-m15 .zelle.b33           { width: calc(50% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.b30           { width: calc(50% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.viertel,
  .dcr-m15 .zelle.b25           { width: calc(50% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.fuenftel,
  .dcr-m15 .zelle.b20           { width: calc(50% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.b15           { width: calc(50% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.achtel,
  .dcr-m15 .zelle.b12_5         { width: calc(50% - var(--spalten-abstand)); }
}

@media only screen and (min-width: 992px) {
  .dcr-m15 .zelle.b80           { width: calc(80% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.dreiviertel,
  .dcr-m15 .zelle.b75           { width: calc(75% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.b70           { width: calc(70% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.zweidrittel,
  .dcr-m15 .zelle.b66           { width: calc(66% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.b60           { width: calc(60% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.halb,
  .dcr-m15 .zelle.b50           { width: calc(50% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.b40           { width: calc(40% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.drittel,
  .dcr-m15 .zelle.b33           { width: calc(33% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.b30           { width: calc(30% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.viertel,
  .dcr-m15 .zelle.b25           { width: calc(25% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.fuenftel,
  .dcr-m15 .zelle.b20           { width: calc(20% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.b15           { width: calc(15% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.achtel,
  .dcr-m15 .zelle.b12_5         { width: calc(12.5% - var(--spalten-abstand)); }
}

@media only screen and (max-width: 575px) {
  .dcr-m15 .zelle.mobil-voll,
  .dcr-m15 .zelle.mobil-b100    { width: calc(100% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.mobil-b80     { width: calc(80% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.mobil-dreiviertel,
  .dcr-m15 .zelle.mobil-b75     { width: calc(75% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.mobil-b70     { width: calc(70% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.mobil-zweidrittel,
  .dcr-m15 .zelle.mobil-b66     { width: calc(66% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.mobil-b60     { width: calc(60% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.mobil-halb,
  .dcr-m15 .zelle.mobil-b50     { width: calc(50% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.mobil-b40     { width: calc(40% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.mobil-drittel,
  .dcr-m15 .zelle.mobil-b33     { width: calc(33% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.mobil-b30     { width: calc(30% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.mobil-viertel,
  .dcr-m15 .zelle.mobil-b25     { width: calc(25% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.mobil-b20     { width: calc(20% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.mobil-b15     { width: calc(15% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.mobil-achtel,
  .dcr-m15 .zelle.mobil-b12_5   { width: calc(12.5% - var(--spalten-abstand)); }
}

@media only screen and (min-width: 576px) and (max-width: 991px) {
  .dcr-m15 .zelle.tablet-voll,
  .dcr-m15 .zelle.tablet-b100   { width: calc(100% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.tablet-b80    { width: calc(80% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.tablet-dreiviertel,
  .dcr-m15 .zelle.tablet-b75    { width: calc(75% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.tablet-b70    { width: calc(70% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.tablet-zweidrittel,
  .dcr-m15 .zelle.tablet-b66    { width: calc(66% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.tablet-b60    { width: calc(60% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.tablet-halb,
  .dcr-m15 .zelle.tablet-b50    { width: calc(50% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.tablet-b40    { width: calc(40% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.tablet-drittel,
  .dcr-m15 .zelle.tablet-b33    { width: calc(33% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.tablet-b30    { width: calc(30% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.tablet-viertel,
  .dcr-m15 .zelle.tablet-b25    { width: calc(25% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.tablet-b20    { width: calc(20% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.tablet-b15    { width: calc(15% - var(--spalten-abstand)); }
  .dcr-m15 .zelle.tablet-achtel,
  .dcr-m15 .zelle.tablet-b12_5  { width: calc(12.5% - var(--spalten-abstand)); }
}



form[name=filtern] .dcr-m10 + .dcr-m16 .container {
  padding-top: 0;
}
.dcr-m16 .raster {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: stretch;
  margin-right: calc(var(--spalten-halber-abstand) * -1);
  margin-left: calc(var(--spalten-halber-abstand) * -1);
}
.dcr-m16 .raster .zelle,
.dcr-m16 .raster .zelle.voll,
.dcr-m16 .raster .zelle.b100 {
  position: relative;
  /* overflow: hidden; */ /* warum war das hier? */
  margin: var(--spalten-halber-abstand);
  width: calc(100% - var(--spalten-abstand));
}

.dcr-m16 .textblock {
  /* padding: 2em 1.5em; */
}

@media only screen and  (min-width: 768px) {
  .dcr-m16 .raster {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: center;
  }

  .dcr-m16 .raster .zelle {
    width: calc(70% - var(--spalten-abstand));
  }
  .dcr-m16 .raster .zelle ~ .zelle {
    width: calc(30% - var(--spalten-abstand));
  }

  .dcr-m16.b30_70 .raster .zelle {
    width: calc(30% - var(--spalten-abstand));
  }
  .dcr-m16.b30_70 .raster .zelle ~ .zelle {
    width: calc(70% - var(--spalten-abstand));
  }

  .dcr-m16.b70_30 .raster .zelle {
    width: calc(70% - var(--spalten-abstand));
  }
  .dcr-m16.b70_30 .raster .zelle ~ .zelle {
    width: calc(30% - var(--spalten-abstand));
  }

  .dcr-m16.b40_60 .raster .zelle {
    width: calc(40% - var(--spalten-abstand));
  }
  .dcr-m16.b40_60 .raster .zelle ~ .zelle {
    width: calc(60% - var(--spalten-abstand));
  }

  .dcr-m16.b60_40 .raster .zelle {
    width: calc(60% - var(--spalten-abstand));
  }
  .dcr-m16.b60_40 .raster .zelle ~ .zelle {
    width: calc(40% - var(--spalten-abstand));
  }

  .dcr-m16.b50_50 .raster .zelle {
    width: calc(50% - var(--spalten-abstand));
  }
  .dcr-m16.b50_50 .raster .zelle ~ .zelle {
    width: calc(50% - var(--spalten-abstand));
  }
}



.dcr-m20 .abschnitt,
.dcr-m21 .abschnitt,
.dcr-m22 .abschnitt {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: stretch;
  margin-right: calc(var(--spalten-abstand) * -1);
  margin-left: calc(var(--spalten-abstand) * -1);
}
.dcr-m22 .abschnitt {
  flex-flow: wrap;
}
.dcr-m20 .abschnitt > div,
.dcr-m21 .abschnitt > div,
.dcr-m22 .abschnitt > div {
  padding: var(--spalten-abstand);
}
.dcr-m20 .bildblock,
.dcr-m20 .textblock,
.dcr-m21 .bildblock,
.dcr-m21 .textblock,
.dcr-m22 .bildblock,
.dcr-m22 .textblock{
  width: 100%;
  max-width: 100%;
}

.dcr-m20 .abschnittsumschalter .schalter a,
.dcr-m21 .abschnittsumschalter .schalter a,
.dcr-m22 .abschnittsumschalter .schalter a {
  line-height: 1.75em;
  margin-right: 3em;
  padding: 0.5em 0 0.25em 0;
  text-decoration: none;
  font-weight: 700;
  color: #a5a5a5;
  border-bottom: 1px solid #000;
  border-color: transparent;
  transition: border-color 250ms ease;
}
.dcr-m20 .abschnittsumschalter .schalter a:hover,
.dcr-m21 .abschnittsumschalter .schalter a:hover,
.dcr-m22 .abschnittsumschalter .schalter a:hover {
  border-color: #a5a5a5;
}
.dcr-m20 .abschnittsumschalter .schalter a.aktiv,
.dcr-m21 .abschnittsumschalter .schalter a.aktiv,
.dcr-m22 .abschnittsumschalter .schalter a.aktiv {
  color: #333;
  border-color: #000;
}

@media only screen and  (min-width: 1200px) {
  .dcr-m20 .abschnitt,
  .dcr-m21 .abschnitt {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .dcr-m21 .abschnitt {
    flex-direction: row-reverse;
  }
  .dcr-m20 .bild,
  .dcr-m21 .bild,
  .dcr-m22 .bild {
    padding-bottom: 2em;
  }

  /* Verhältnis 40%-Text 60%-Bild ist das Standardverhältnis */
  .dcr-m20 .bildblock,
  .dcr-m20.text-b40 .bildblock,
  .dcr-m21 .bildblock,
  .dcr-m21.text-b40 .bildblock {
    width: 60%;
  }
  .dcr-m20 .textblock,
  .dcr-m20.text-b40 .textblock,
  .dcr-m21 .textblock,
  .dcr-m21.text-b40 .textblock {
    width: 40%;
  }

  /* Verhältnis 60%-Text 40%-Bild */
  .dcr-m20.text-b60 .bildblock,
  .dcr-m21.text-b60 .bildblock {
    width: 40%;
  }
  .dcr-m20.text-b60 .textblock,
  .dcr-m21.text-b60 .textblock {
    width: 60%;
  }

  /* Verhältnis 70%-Text 30%-Bild */
  .dcr-m20.text-b70 .bildblock,
  .dcr-m21.text-b70 .bildblock {
    width: 30%;
  }
  .dcr-m20.text-b70 .textblock,
  .dcr-m21.text-b70 .textblock {
    width: 70%;
  }

  /* Verhältnis 30%-Text 70%-Bild */
  .dcr-m20.text-b30 .bildblock,
  .dcr-m21.text-b30 .bildblock {
    width: 70%;
  }
  .dcr-m20.text-b30 .textblock,
  .dcr-m21.text-b30 .textblock {
    width: 30%;
  }

  /* Verhältnis 50%-Text 50%-Bild */
  .dcr-m20.text-b50 .bildblock,
  .dcr-m21.text-b50 .bildblock {
    width: 50%;
  }
  .dcr-m20.text-b50 .textblock,
  .dcr-m21.text-b50 .textblock {
    width: 40%;
  }
}

/* optionaler vollflächiger Link (erstes Element innerhalb .abschnitt) */
.dcr-m20 .link,
.dcr-m21 .link,
.dcr-m22 .link {
  position: absolute;
  z-index: 2;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.dcr-m20 .link a,
.dcr-m21 .link a,
.dcr-m22 .link a {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  text-indent: -1000px;
  text-decoration: none;
}
.dcr-m20 .abschnitt:hover .textblock .sf,
.dcr-m21 .abschnitt:hover .textblock .sf,
.dcr-m20 .abschnitt:hover .textblock .sf {
  color: #fff;
  background-color: var(--farbe-sf-normal);
}




.dcr-m30 .zelle {
  cursor: pointer;
  width: 100%;
}
.dcr-m30 .container.supradaten,
.dcr-m30 .fliesstext,
.dcr-m30 .bild {
  display: none;
}
.dcr-m30 .grossansicht {
  display: block;
}
.dcr-m30 .grossansicht img {
  display: inline-block;
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
  vertical-align: middle;
  object-fit: cover;
  object-position: center;
}
.dcr-m30 .ueberschrift {
  display: inline-block;
}
.dcr-m30 h3 {
  text-transform: uppercase;
}
.dcr-m30 h4 {
  font-size: 1em;
  letter-spacing: 0.2em;
  color: inherit;
}

body.editor .dcr-m30 .fliesstext {
  display: block;
}
body.editor .dcr-m30 .bild:not(.grossansicht) {
  display: block;
  position: absolute;
  overflow: hidden;
  z-index: 2;
  right: 20px;
  bottom: 20px;
  width: 320px;
  height: 180px !important;
  border: 1px dotted red;
}
body.editor .dcr-m30 .bild:not(.grossansicht):before {
  display: inline-block;
  position: absolute;
  z-index: 3;
  padding: 1px 4px;
  font-size: 12px;
  content: "Bild für kleine Ansicht";
  background-color: rgba(255, 255, 255, 0.5);
}



.dcr-m31 .container {
  padding: 0;
  max-width: none;
}
.dcr-m31 .zelle {
  width: 100%;
}
.dcr-m31 .bild {
  display: none;
}
.dcr-m31 .grossansicht {
  display: block;
}
.dcr-m31 .grossansicht img {
  display: inline-block;
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
  vertical-align: middle;
  object-fit: cover;
  object-position: center;
}
.dcr-m31 .textblock {
  display: block;
  position: absolute;
  z-index: 1;
  padding: 0.5em;
  margin: 1em 4em;
  width: calc(100% - 8em);
  bottom: 5%;
  background-color: rgba(255,255,255,0.4);
  text-align: center;
}
.dcr-m31 .ueberschrift {
  display: inline-block;
}
.dcr-m31 .flickity-prev-next-button {
  width: 40px;
  height: 50px;
}
.dcr-m31 .flickity-prev-next-button.previous {
  left: 0;
}
.dcr-m31 .flickity-prev-next-button.next {
  right: 0;
}

body.editor .dcr-m31 .fliesstext {
  display: block;
}
body.editor .dcr-m31 .bild:not(.grossansicht) {
  display: block;
  position: absolute;
  overflow: hidden;
  z-index: 2;
  right: 20px;
  bottom: 20px;
  width: 320px;
  height: 180px !important;
  border: 1px dotted red;
}
body.editor .dcr-m31 .bild:not(.grossansicht):before {
  display: inline-block;
  position: absolute;
  z-index: 3;
  padding: 1px 4px;
  font-size: 12px;
  content: "Bild für kleine Ansicht";
  background-color: rgba(255, 255, 255, 0.5);
}

@media only screen and  (min-width: 992px) {
  .dcr-m31 .textblock {
    padding: 4em;
    margin: 1em 6em;
    width: calc(100% - 12em);
  }
}


.dcr-m35 {
  background-color: #f7f7f7;
  padding: 2em 1em;
}
.dcr-m35 .container {
  max-width: none;
  padding: 0;
}
section.dcr-m35.verbinden {
  padding-bottom: 0.25em;
}
section.dcr-m35.verbinden .container {
  padding-bottom: 0;
}
section.dcr-m35.verbinden + section {
  padding-top: 0.25em;
}
section.dcr-m35.verbinden + section .container {
  padding-top: 0;
}
.dcr-m35 .raster {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: stretch;
  margin-right: calc(var(--spalten-halber-kleinerabstand) * -1);
  margin-left: calc(var(--spalten-halber-kleinerabstand) * -1);
}
.dcr-m35.linksbuendig .raster {
  justify-content: flex-start;
}
.dcr-m35.rechtsbuendig .raster {
  justify-content: flex-end;
}
.dcr-m35 .zelle {
  position: relative;
  overflow: hidden;
  margin: var(--spalten-halber-kleinerabstand);
  width: calc(100% - var(--spalten-kleinerabstand));
}
.dcr-m35 .link {
  position: absolute;
  z-index: 2;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
body.editor .dcr-m35 .link {
  top: auto;
  bottom: 0;
  height: 2em;
  font-size: 0.75em;
  border: 1px dotted red;
  overflow-x: hidden;
  white-space: nowrap;
}
.dcr-m35 .link a,
.dcr-m35 .link a:hover {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  text-indent: -1000px;
  text-decoration: none;
}
body.editor .dcr-m35 .link a {
  text-indent: 0;
  padding: 1px 4px;
  background-color: rgba(255,255,255,0.5);
}
body.editor .dcr-m35 .link a:before {
  content: "Link: ";
}
.dcr-m35 .textblock {
  margin-top: 0.3em;
  padding: 1em;
  font-size: 0.75em;
}
.dcr-m35 .textblock .sf {
  font-size: 1.25em;
}
.dcr-m35 .zelle:hover .textblock .sf {
  color: #fff;
  background-color: var(--farbe-sf-normal);
}
.dcr-m35 .ueberschrift {
  font-size: 0.85em;
}
.dcr-m35 .bildblock {
  overflow: hidden;
  width: 100%;
  max-width: 100% !important;
  height: calc((100vw - 2em) * .66);  /* - 2em container-padding, .66 = Seitenverhältnis 3:2 */
}
.dcr-m35 .bildblock .bild {
  position: relative;
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
}
.dcr-m35 .bildblock .bild:after {
  position: absolute;
  content: "";
  display: block;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  background-image: linear-gradient(to top,rgba(45,99,137,0.3) 0,rgba(45,99,137,0) 100%);
  transition: opacity 500ms;
}
.dcr-m35 .zelle:hover .bildblock .bild:after {
  opacity: 1;
}
body.editor .dcr-m35 .bildblock .bild:after {
  display: none !important;
}
.dcr-m35 .bildblock .bild img,
.dcr-m35 .bildblock .bild .cke_widget_image {
  display: inline-block;
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
  vertical-align: middle;
  object-fit: cover;
  object-position: center;
  transition: transform 750ms ease;
}
.dcr-m35 h2 {
  font-size: 2.4em;
  letter-spacing: -0.03em;
  margin-bottom: 0.3em;
  transition: color 200ms;
}
.dcr-m35 .zelle:hover .ueberschrift {
  color: var(--farbe-primaer);
}

@media only screen and  (min-width: 768px) {
  .dcr-m35 {
    padding: 3em 3em;
  }
  section.dcr-m35.verbinden {
    padding-bottom: 0.25em;
  }
  section.dcr-m35.verbinden .container {
    padding-bottom: 0;
  }
  section.dcr-m35.verbinden + section {
    padding-top: 0.25em;
  }
  section.dcr-m35.verbinden + section .container {
    padding-top: 0;
  }
  .dcr-m35 .raster {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: center;
  }

  /* dreispaltig ist die Standard-Aufteilung, vierspaltig wird in dieser Auflösung noch dreispaltig dargestellt */
  .dcr-m35 .zelle,
  .dcr-m35.dreispaltig .zelle,
  .dcr-m35.vierspaltig .zelle {
    width: calc(33.3333333% - var(--spalten-kleinerabstand));
  }
  .dcr-m35.zweispaltig .zelle {
    width: calc(50% - var(--spalten-kleinerabstand));
  }

  .dcr-m35 .bildblock,
  .dcr-m35.dreispaltig .bildblock,
  .dcr-m35.vierspaltig .bildblock {
    height: calc((100vw - 6em - (2 * var(--spalten-kleinerabstand))) * .66 / 3);  /* - 6em container-padding, - 2em zell-padding (4 * 0.5em zwischen den Zellen) */
  }
  .dcr-m35.zweispaltig .bildblock {
    height: calc((100vw - 6em - var(--spalten-kleinerabstand)) * .66 / 2);  /* - 6em container-padding, - 1em zell-padding (2 * 0.5em zwischen den Zellen) */
  }
}

@media only screen and  (min-width: 992px) {
  .dcr-m35.vierspaltig .zelle {
    width: calc(25% - var(--spalten-kleinerabstand));
  }

  .dcr-m35.vierspaltig .bildblock {
    height: calc((100vw - 6em - (3 * var(--spalten-kleinerabstand))) * .66 / 4);  /* - 6em container-padding, - 3em zell-padding (6 * 0.5em zwischen den Zellen) */
  }

  .dcr-m35 .zelle:hover img {
    transform: scale(1.05);
  }
}



.dcr-m6 + .dcr-m36 .container {
  padding-top: 3em;
}
.dcr-m36 .raster {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: stretch;
  margin-right: calc(var(--spalten-halber-abstand) * -1);
  margin-left: calc(var(--spalten-halber-abstand) * -1);
}
.dcr-m36.linksbuendig .raster {
  justify-content: flex-start;
}
.dcr-m36.rechtsbuendig .raster {
  justify-content: flex-end;
}
.dcr-m36 .zelle {
  position: relative;
  overflow: hidden;
  margin: var(--spalten-halber-abstand);
  width: calc(100% - var(--spalten-abstand));
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 8%);
}
.dcr-m36 .link {
  position: absolute;
  z-index: 2;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
body.editor .dcr-m36 .link {
  top: auto;
  bottom: 0;
  height: 2em;
  font-size: 0.75em;
  border: 1px dotted red;
  overflow-x: hidden;
  white-space: nowrap;
}
.dcr-m36 .link a,
.dcr-m36 .link a:hover {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  text-indent: -1000px;
  text-decoration: none;
}
body.editor .dcr-m36 .link a {
  text-indent: 0;
  padding: 1px 4px;
  background-color: rgba(255,255,255,0.5);
}
body.editor .dcr-m36 .link a:before {
  content: "Link: ";
}
.dcr-m36 .textblock {
  padding: 2em 1.5em;
  margin: 0;
  font-size: 0.75em;
}
.dcr-m36 .textblock .sf {
  font-size: 1.25em;
}
.dcr-m36 .zelle:hover .textblock .sf {
  color: #fff;
  background-color: var(--farbe-sf-normal);
}
.dcr-m36 .ueberschrift {
  font-size: 0.85em;
}
.dcr-m36 .bildblock {
  overflow: hidden;
  width: 100%;
  max-width: 100% !important;
  height: calc((100vw - 2em) * .66);  /* - 2em container-padding, .66 = Seitenverhältnis 3:2 */
}
.dcr-m36 .bildblock .bild {
  position: relative;
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
  margin: 0;
}
.dcr-m36 .bildblock .bild:after {
  position: absolute;
  content: "";
  display: block;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  background-image: linear-gradient(to top,rgba(45,99,137,0.3) 0,rgba(45,99,137,0) 100%);
  transition: opacity 500ms;
}
.dcr-m36 .zelle:hover .bildblock .bild:after {
  opacity: 1;
}
body.editor .dcr-m36 .bildblock .bild:after {
  display: none !important;
}
.dcr-m36 .bildblock .bild img,
.dcr-m36 .bildblock .bild .cke_widget_image {
  display: inline-block;
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
  vertical-align: middle;
  object-fit: cover;
  object-position: center;
  transition: transform 750ms ease;
}
.dcr-m36 h2 {
  font-size: 2.4em;
  line-height: 1.2em;
  letter-spacing: -0.03em;
  margin-bottom: 0.3em;
}
.dcr-m36 .zelle:hover .ueberschrift {
  color: var(--farbe-primaer);
}


@media only screen and  (min-width: 768px) {
  .dcr-m36 .raster {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: center;
  }

  /* dreispaltig ist die Standard-Aufteilung, vierspaltig wird in dieser Auflösung noch dreispaltig dargestellt */
  .dcr-m36 .zelle,
  .dcr-m36.dreispaltig .zelle,
  .dcr-m36.vierspaltig .zelle {
    width: calc(33.3333333% - var(--spalten-abstand));
  }
  .dcr-m36.zweispaltig .zelle {
    width: calc(50% - var(--spalten-abstand));
  }

  .dcr-m36 .bildblock,
  .dcr-m36.dreispaltig .bildblock,
  .dcr-m36.vierspaltig .bildblock {
    height: calc((100vw - 12em - (2 * var(--spalten-abstand))) * .66 / 3);  /* - 12em container-padding, - 6em zell-padding (4 * 1.5em zwischen den Zellen) */
  }
  .dcr-m36.zweispaltig .bildblock {
    height: calc((100vw - 12em - var(--spalten-abstand)) * .66 / 2);  /* - 12em container-padding, - 3em zell-padding (2 * 1.5em zwischen den Zellen) */
  }
}

@media only screen and  (min-width: 992px) {
  .dcr-m36 .zelle:hover img {
    transform: scale(1.05);
  }

  .dcr-m36.vierspaltig .zelle {
    width: calc(25% - var(--spalten-abstand));
  }
  .dcr-m36.vierspaltig .bildblock {
    height: calc((100vw - 12em - (3 * var(--spalten-abstand))) * .66 / 4);  /* - 12em container-padding, - 9em zell-padding (6 * 1.5em zwischen den Zellen) */
  }
}

/* maximale container-Breite */
@media only screen and  (min-width: 85em) {
  .dcr-m36 .bildblock,
  .dcr-m36.dreispaltig .bildblock {
    height: calc((var(--sektion-max-breite) - 12em - (2 * var(--spalten-abstand))) * .66 / 3);  /* - 12em container-padding, - 6em zell-padding (4 * 1.5em zwischen den Zellen) */
  }
  .dcr-m36.zweispaltig .bildblock {
    height: calc((var(--sektion-max-breite) - 12em - var(--spalten-abstand)) * .66 / 2);  /* - 12em container-padding, - 3em zell-padding (2 * 1.5em zwischen den Zellen) */
  }
  .dcr-m36.vierspaltig .bildblock {
    height: calc((var(--sektion-max-breite) - 12em - (3 * var(--spalten-abstand))) * .66 / 4);  /* - 12em container-padding, - 9em zell-padding (6 * 1.5em zwischen den Zellen) */
  }
}





.dcr-m6 + .dcr-m37 .container {
  padding-top: 3em;
}
.dcr-m37 .raster {
  display: flex;
  align-content: stretch;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: center;
  margin-right: -1em;
  margin-left: -1em;
}
.dcr-m37.linksbuendig .raster {
  justify-content: flex-start;
}
.dcr-m37.rechtsbuendig .raster {
  justify-content: flex-end;
}
.dcr-m37 .zelle {
  position: relative;
  overflow: hidden;
  margin: 1em;
  width: 160px;
}
.dcr-m37 .link {
  position: absolute;
  z-index: 2;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
body.editor .dcr-m37 .link {
  top: auto;
  bottom: 0;
  height: 2em;
  font-size: 0.75em;
  border: 1px dotted red;
  overflow-x: hidden;
  white-space: nowrap;
}
.dcr-m37 .link a,
.dcr-m37 .link a:hover {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  text-indent: -1000px;
  text-decoration: none;
}
body.editor .dcr-m37 .link a {
  text-indent: 0;
  padding: 1px 4px;
  background-color: rgba(255,255,255,0.5);
}
body.editor .dcr-m37 .link a:before {
  content: "Link: ";
}
.dcr-m37 .textblock {
  padding: 0.75em 0 0 0;
  /* text-align: center; */
  font-size: 0.75em;
}
.dcr-m37 .textblock .sf {
  font-size: 1.25em;
}
.dcr-m37 .zelle:hover .textblock .sf {
  color: #fff;
  background-color: var(--farbe-sf-normal);
}
.dcr-m37 .bildblock {
  overflow: hidden;
  width: 160px;
  height: 160px;
  padding: 10px;
  border: 1px solid #ddd;
}
.dcr-m37 .bildblock .bild {
  position: relative;
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
  margin: 0;
}
/* .dcr-m37 .bildblock .bild:after {
  position: absolute;
  content: "";
  display: block;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  background-image: linear-gradient(to top,rgba(0,0,0,0.15) 0,rgba(0,0,0,0) 100%);
  transition: opacity 500ms;
}
.dcr-m37 .zelle:hover .bildblock .bild:after {
  opacity: 1;
}
body.editor .dcr-m37 .bildblock .bild:after {
  display: none !important;
} */
.dcr-m37 .bildblock .bild img,
.dcr-m37 .bildblock .bild .cke_widget_image {
  display: inline-block;
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
  vertical-align: middle;
  object-fit: contain;
  object-position: center;
  transition: transform 750ms ease;
}
.dcr-m37 h5,
.dcr-m37 h6 {
  letter-spacing: 0;
}
.dcr-m37 .zelle:hover .ueberschrift {
  color: var(--farbe-primaer);
}
body.editor .dcr-m37 .fliesstext {
  position: relative;  /* verhindern, dass der Tag bei Bearbeitung nach unten springt, weil der Editor position:relative ergänzt */
}
.dcr-m37 .tag {
  position: absolute;
  top: 0.75em;
  left: 0.75em;
  border-radius: 3px;
  font-size: 0.7em;
  line-height: 1.75em;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 1px 8px 0;
  z-index: 1;
  background: #51a312;
}

@media only screen and  (min-width: 768px) {
  .dcr-m37 .zelle {
    width: 205px;
  }
  .dcr-m37 .bildblock {
    width: 205px;
    height: 205px;
    padding: 20px;
  }
}

@media only screen and  (min-width: 992px) {
  .dcr-m37 .zelle:hover img {
    transform: scale(1.05);
  }
}



.dcr-m6 + .dcr-m38 .container {
  padding-top: 3em;
}
.dcr-m38 .raster {
  display: flex;
  align-content: stretch;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: center;
  margin-right: -1em;
  margin-left: -1em;
}
.dcr-m38.linksbuendig .raster {
  justify-content: flex-start;
}
.dcr-m38.rechtsbuendig .raster {
  justify-content: flex-end;
}
.dcr-m38 .zelle {
  position: relative;
  overflow: hidden;
  margin: 1em;
  width: 115px;
}
.dcr-m38 .link {
  position: absolute;
  z-index: 2;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
body.editor .dcr-m38 .link {
  top: auto;
  bottom: 0;
  height: 2em;
  font-size: 0.75em;
  border: 1px dotted red;
  overflow-x: hidden;
  white-space: nowrap;
}
.dcr-m38 .link a,
.dcr-m38 .link a:hover {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  text-indent: -1000px;
  text-decoration: none;
}
body.editor .dcr-m38 .link a {
  text-indent: 0;
  padding: 1px 4px;
  background-color: rgba(255,255,255,0.5);
}
body.editor .dcr-m38 .link a:before {
  content: "Link: ";
}
.dcr-m38 .textblock {
  padding: 0.75em 0 0 0;
  text-align: center;
  font-size: 0.75em;
}
.dcr-m38 .textblock .sf {
  font-size: 1.25em;
}
.dcr-m38 .zelle:hover .textblock .sf {
  color: #fff;
  background-color: var(--farbe-sf-normal);
}
.dcr-m38 .bildblock {
  overflow: hidden;
  width: 115px;
  height: 115px;
  border-radius: 100%;
  border: 1px solid #999;
}
.dcr-m38 .bildblock .bild {
  position: relative;
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
  margin: 0;
}
.dcr-m38 .bildblock .bild:after {
  position: absolute;
  content: "";
  display: block;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  background-image: linear-gradient(to top,rgba(0,0,0,0.15) 0,rgba(0,0,0,0) 100%);
  transition: opacity 500ms;
}
.dcr-m38 .zelle:hover .bildblock .bild:after {
  opacity: 1;
}
.dcr-m38 .bildblock .bild img,
.dcr-m38 .bildblock .bild .cke_widget_image {
  display: inline-block;
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
  vertical-align: middle;
  object-fit: cover;
  object-position: center;
  transition: transform 750ms ease;
}
.dcr-m38 h5,
.dcr-m38 h6 {
  letter-spacing: 0;
}
.dcr-m38 .zelle:hover .ueberschrift {
  color: var(--farbe-primaer);
}

@media only screen and  (min-width: 768px) {
  .dcr-m38 .zelle {
    width: 130px;
  }
  .dcr-m38 .bildblock {
    width: 130px;
    height: 130px;
  }
}

@media only screen and  (min-width: 992px) {
  .dcr-m38 .zelle:hover img {
    transform: scale(1.05);
  }
}



.dcr-m40 .container {
  padding: 1.5em 1em 1em 1em;
}
.dcr-m40 img {
  max-width: 30vw;
}
@media only screen and  (min-width: 768px) {
  .dcr-m40 .container {
    padding: 3em 4em 1em 4em;
  }
}



.dcr-m50 {
  padding: 4em 0;
  color: #cbcbcb;
  background-color: #464646;
}
/* .dcr-m50:before {
  display: block;
  content: "";
  width: calc(100% - 6em);
  margin: 0 auto 0 auto;
  height: 4em;
  border-bottom: 1px solid #333;
} */
.dcr-m50 .container {
  padding-top: 4em;
  padding-bottom: 4em;
}
.dcr-m50 .raster {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: stretch;
  margin-right: calc(var(--spalten-halber-abstand) * -1);
  margin-left: calc(var(--spalten-halber-abstand) * -1);
}
.dcr-m50 .zelle {
  position: relative;
  overflow: hidden;
  margin: var(--spalten-halber-abstand);
  width: calc(50% - var(--spalten-abstand));
}
.dcr-m50 .zelle:first-child {
    width: 100%;
  }
  .dcr-m50 .zelle:first-child .textblock {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: stretch;
    align-items: stretch;
    justify-content: flex-start;
    margin-right: calc(var(--spalten-halber-abstand) * -1);
    margin-left: calc(var(--spalten-halber-abstand) * -1);
  }
  .dcr-m50 .zelle:first-child .ueberschrift {
    margin: var(--spalten-halber-abstand);
    width: calc(25% - var(--spalten-abstand));
  }
  .dcr-m50 .zelle:first-child .fliesstext {
    margin: var(--spalten-halber-abstand);
    width: calc(75% - var(--spalten-abstand));

  }
  .dcr-m50 .zelle.fusszeile {
    width: 100%;
    font-size: 0.75em;
    color: #888;
    margin-top: 5em;
  }
.dcr-m50 .ueberschrift {
  color: #fff;
  text-transform: uppercase;
}
.dcr-m50 .fliesstext {
  line-height: 1.4em;
}
.dcr-m50 h6 {
  color: #cbcbcb;
  margin-bottom: 2em;
}
.dcr-m50 a {
  text-decoration: none;
}
.dcr-m50 a:hover {
  color: #fff;
  text-decoration: underline;
}
.dcr-m50 ul {
  padding: 0 !important;
}
.dcr-m50 li {
  list-style: none !important;
  padding: 0 0 0.5em;
  margin-bottom: 0.4em;
}
.dcr-m50 li a {
  position: relative;
  display: inline-block;
  /* padding-left: 0.75em; */
}
/* .dcr-m50 li a:before {
  position: absolute;
  display: inline-block;
  content: "› ";
  left: 0;
  margin-top: -2px;
  font-size: 1.3em;
} */
.dcr-m50 .sf {
  margin-right: 1em;
}
.dcr-m50 .i-facebook {
  background-color: #3b5998;
}
.dcr-m50 .i-instagram {
  background-color: #405de6;
}
.dcr-m50 .i-facebook:hover,
.dcr-m50 .i-instagram:hover {
  background-color: #4b4b4b;
  color: #fff;
}

@media only screen and  (min-width: 768px) {
  .dcr-m50 .zelle {
    width: calc(33.3333333% - var(--spalten-abstand));
  }
  .dcr-m50 .zelle:first-child {
    width: 100%;
  }
}

@media only screen and  (min-width: 992px) {
  .dcr-m50 .zelle {
    width: calc(25% - var(--spalten-abstand));
  }
  .dcr-m50 .zelle:first-child {
    width: 100%;
  }
  .dcr-m50 .zelle:nth-child(2) {
    margin-left: calc(25% + var(--spalten-halber-abstand));
  }
  .dcr-m50 .zelle.fusszeile {
    width: 75%;
    margin-left: calc(25% + var(--spalten-halber-abstand));
  }
}



.dcr-m55 {
  color: #cbcbcb;
  background-color: #464646;
}
/* .dcr-m55:before {
  display: block;
  content: "";
  width: 100%;
  height: 4em;
  border-bottom: 1px solid #eaeaea;
} */
.dcr-m50 + .dcr-m55:before {
  height: 1px
}
.dcr-m55 .container {
  text-align: center;
  padding-top: 2em;
  padding-bottom: 1em;
}
.dcr-m55 p {
  font-size: 0.925em;
}







/* Seitensuche */
.seitensuche {
  margin-bottom: 2em;
}
.seitensuche #search-input {
  width: calc(100% - 150px);
  max-width: 30em;
  line-height: 34px;
  margin: 1em 0;
  vertical-align: middle;
}
.seitensuche .sf {
  vertical-align: middle;
}

.seitensuche_nav {
  margin: 3em auto;
  text-align: center;
  font-weight: bold;
}
.seitensuche_nav a,
.seitensuche_nav span {
  display: inline-block;
  padding: 0.5em 3em;
  border: 1px solid #ddd;
}
.seitensuche_nav a:first-of-type {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.seitensuche_nav a:last-of-type {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.seitensuche_nav a {
  background-color: #ddd;
  border-radius: 4px;
  text-decoration: none;
}
.seitensuche_nav a:hover {
  background-color: #ccc;
}
.seitensuche_nav a.disabled {
  pointer-events: none;
  cursor: default;
  opacity: 0.3;
}

.suchtreffer {
  margin-bottom: 1em;
}
.suchtreffer a {
  font-weight: bold;
}
.treffer_1,
.treffer_2,
.treffer_3,
.treffer_4,
.treffer_5 {
  font-weight: bold;
}







#modul_error {
  padding: 10em 10em 0;
}












/* Box für Fehler-/Erfolgsmeldungen */
.meldungsbox {
  border: 1px solid #ccc;
  margin: 20px 0 20px 0;
  padding: 10px;
  background-color: #f5f5f5;
}
.meldungsbox .fehler {
  margin-top: 10px;
  letter-spacing: 0.6px;
  font-weight: bold;
  color: var(--farbe-warnung);
}
.fehler label,
label.fehler {
  color: var(--farbe-warnung);
}
input.fehler,
textarea.fehler,
select.fehler,
.fehler > textarea,
.fehler > select,
.fehler .cke_editor_htmlinput,
.fehler .cke_textarea_inline {
  border: solid 1px var(--farbe-warnung) !important;
}
.fehler > .superselect .ts-control {
  font-weight: bold;
  color:var(--farbe-warnung);
  border: solid 1px var(--farbe-warnung) !important;
}
.validierungshinweis,
.validierungsfehler {
  display: none;
  font-weight: bold;
  letter-spacing: 1px;
  color: var(--farbe-warnung);
  margin-top: 10px;
}

/* Placeholder im Fehlerfall rot färben */
.fehler ::placeholder,
.fehler::placeholder {
  font-weight: bold;
  color: var(--farbe-warnung);
}


.fehler {
  font-weight: bold;
  color: var(--farbe-warnung);
}
.meldung {
  font-weight: bold;
  color:#777;
}
.erfolg {
  font-weight: bold;
  color:#509531;
}

.melder {
  display: none;
}
.melder.fehler,
.melder.meldung,
.melder.erfolg {
  display: block;
  margin-bottom: 20px;
}
span.melder.fehler,
span.melder.meldung,
span.melder.erfolg {
  display: inline;
}








/* ----- universelle Formate zur Modifizierung des Standard-Verhaltens:
   am Ende platziert, um vorhergehende Anweisungen überschreiben zu können ----- */

/* Verhalten */

.text-nowrap {
  white-space:nowrap;
}

.text-break {
  word-wrap: break-word;
}

.text-uppercase {
  text-transform: uppercase;
}

.text-ellipsis {
  text-overflow: ellipsis;
}

.ib {
  display: inline-block;
}
.i {
  display: inline;
}
.b {
  display: block;
}

.verdeckt {
  display: none;
}
.verdeckt-erzwungen {
  display: none !important;
}
@media only screen and (max-width: 991px) {
  .mobil-verdeckt {
    display: none;
  }
  .mobil-sichtbar {
    display: block;
  }
}

.unauswaehlbar {
  user-select: none;
}



/* Textspalten */
.text-zweispaltig\! {
  column-count: 2;
  column-gap: var(--spalten-abstand);
  column-rule: none;
}
.text-dreispaltig\! {
  column-count: 3;
  column-gap: var(--spalten-abstand);
  column-rule: none;
}

@media only screen and (min-width: 768px) {
  .text-zweispaltig {
    column-count: 2;
    column-gap: var(--spalten-abstand);
    column-rule: none;
  }
  .text-dreispaltig {
    column-count: 2;
    column-gap: var(--spalten-abstand);
    column-rule: none;
  }
}

@media only screen and (min-width: 992px) {
  .text-dreispaltig {
    column-count: 3;
    column-gap: var(--spalten-abstand);
    column-rule: none;
  }
}



/* allgemeine Formate */

.text-links {
  text-align: left;
}
.text-rechts {
  text-align: right;
}
.text-mittig {
  text-align: center;
}
.text-unten {
  vertical-align: bottom;
  display: table-cell;
}

.links {
  float: left;
}
.rechts {
  float: right;
}

.abgerundet {
  border-radius: 10px;
}
.stark-abgerundet {
  border-radius: 20px;
}

.gedreht {
  transform: rotate(-4deg);
}

.ausfuellen {
  display: block;
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
}
.ausfuellen .container,
.ausfuellen img,
.ausfuellen iframe,
.ausfuellen video {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

.schatten {
  box-shadow: 1px 1px 10px rgba(0, 0, 0, .4);
}
.schatten-gross {
  box-shadow: 2px 2px 30px rgba(0, 0, 0, .3);
}

.transparent {
  opacity: 0.3;
}

.unscharf {
  -webkit-filter: blur(4px);
  filter: blur(4px);
}
.sehr-unscharf {
  -webkit-filter: blur(8px);
  filter: blur(8px);
}
.scharf {
  -webkit-filter: blur(0);
  filter: blur(0);
  -webkit-transition: 1s -webkit-filter linear;
  transition: 1s -webkit-filter linear;
}











/* ----- Helfer ----- */

/* Hide visually and from screen readers */
.hidden {
  display: none !important;
}

/* Hide only visually, but have it available for screen readers */
.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap; /* 1 */
}

/* Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  clip: auto;
  -webkit-clip-path: none;
  clip-path: none;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto;
  white-space: inherit;
}

/* Hide visually and from screen readers, but maintain layout */
.invisible {
  visibility: hidden;
}


.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}

.clearfix:after {
  clear: both;
}










/* ----- Print-Styles ----- */

@media print {

  *,
  *:before,
  *:after {
    background: transparent !important;
    color: #000 !important; /* Black prints faster */
    box-shadow: none !important;
    text-shadow: none !important;
  }

  a,
  a:visited {
    text-decoration: underline;
  }

  a[href]:after {
    content: " (" attr(href) ")";
  }

  abbr[title]:after {
    content: " (" attr(title) ")";
  }

  /*
   * Don't show links that are fragment identifiers,
   * or use the `javascript:` pseudo protocol
   */

  a[href^="#"]:after,
  a[href^="javascript:"]:after {
    content: "";
  }

  pre {
    white-space: pre-wrap !important;
  }
  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }

  thead {
    display: table-header-group;
  }

  tr,
  img {
    page-break-inside: avoid;
  }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
  h3 {
    page-break-after: avoid;
  }

}