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

  --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: #ff9c00;
  --farbe-alternativ: #c1c1c1;
  --farbe-betont: #3ab74a;
  --farbe-warnung: #e50838;

  --farbe-sf-normal: #ff9c00;
  --farbe-sf-betont: #3ab74a;
  --farbe-sf-warnung: #e50838;
}

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



* {
  -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 transparent;
  }
}
@media only screen and (min-width: 992px) {
  body {
    border-bottom: 2px solid transparent;
  }
}

::-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: Helvetica, sans-serif;
  font-size: 13px;
  line-height: 1.75em;
  color: #000;
}


h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0;
  line-height: 1em;
  font-weight: normal;
  color: inherit;
  margin-bottom: 0.6em;
}

h1 {
  font-size: 6em;
  font-weight: 700;
  letter-spacing: -2px;
}

h2 {
  font-size: 4em;
  font-weight: 700;
}

h3 {
  font-size: 1.5em;
  font-weight: 700;
}

h4 {
  font-size: 1.25em;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--farbe-primaer);
  margin-bottom: 1.5em;
}

h5 {
  font-size: 1em;
  line-height: 1em;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  margin-bottom: 1.6em;
}
h5 i,
h5 em {
  letter-spacing: 0em;
  font-style: normal;
}
h5 i:after,
h5 em:after {
  display: inline-block;
  content: "";
  width: 3em;
  height: 1px;
  margin-right: 0.25em;
  background-color: #333;
}

h6 {
  font-size: 0.9em;
  line-height: 0.9em;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

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

.hinweis {
  font-size: 0.8em;
}

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

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

  h1 {
    font-size: 5em;
  }

  h2 {
    font-size: 3em;
  }

  p {
    font-size: 1.2em;
  }

}

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

  body {
    font-size: 14px;
  }

  h1 {
    font-size: 7em;
  }

}


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

  body {
    font-size: 15px;
  }

}

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

  body {
    font-size: 16px;
  }

}





/* Links */

a {
  color: inherit;
  text-decoration: underline;
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
}
a:hover {
  text-decoration: underline;
}

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:after {
  content: "*";
}

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: 16em;
  height: 3.5em;
  margin: 1em 2em 1em 0;
  padding: 0 2em 0 2em;
  border: none;
  border-radius: 3.5em;
  font-size: 0.75em;
  line-height: 3.6em;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  text-align: center;
  color: #fff;
  background-color: var(--farbe-primaer);
  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: #fff;
  color: var(--farbe-primaer);
  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: var(--farbe-sf-warnung);
  border-color: transparent;
}
.sf.bestaetigt:hover {
  background-color: #fff;
  color: var(--farbe-sf-warnung);
}

.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 ----- */


#menue {
  position: relative;
  flex: 0 0 auto;
  z-index: 999999999;
  width: 0;
  height: 100%;
  color: #d7d7d7;
  background-color: #000;
  transition: width 500ms ease;
}
#menue .container {
  position: fixed;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  align-content: stretch;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin-left: -100%;
  background-color: #000;
  transition: margin-left 500ms ease;
}
#menue .container > div {
  flex: 0 1 auto;
}
#menue .eintraege {
  flex: 1 1 auto;
  background-color: #202020;
  overflow-y: auto;
  opacity: 0;
  visibility: hidden;
  transition: visibility 0ms 500ms, opacity 500ms linear;  /* Ausblend-Animation mit Verzögerung bei visibility */
}
#menue .eintraege::-webkit-scrollbar {
  width: 4px;
  border-radius: 2px
}
#menue .eintraege::-webkit-scrollbar-thumb {
  background-color: #606060;
}

#menue .footer {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  height: 4em;
  margin-top: auto;
  opacity: 0;
  visibility: hidden;
  transition: visibility 0ms 500ms, opacity 500ms linear;  /* Ausblend-Animation mit Verzögerung bei visibility */
}
#menue .footer a {
  position: relative;
  width: 4em;
  height: 4em;
  padding: 0.75em;
}
#menue .footer a.icon span {
  display: none;
}
#menue .footer .zaehler {
  position: absolute;
  top: 0%;
  right: 0%;
  height: 1.75em;
  width: 1.75em;
  margin: 0.5em 0.5em 0 0.5em;
  border-radius: 100px;
  background-color: red;
  color: #fff;
  font-size: 0.75em;
  line-height: 1.75em;
  letter-spacing: -1px;
  text-align: center;
}
#menue .footer .icon:after {
  display: inline-block;
  content: "";
  width: 100%;
  height: 100%;
}
#menue .footer .profile:after {
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgNTggNTgiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDU4IDU4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGw6bm9uZTtzdHJva2U6I0ZGRkRGRDtzdHJva2Utd2lkdGg6Mjt9Cjwvc3R5bGU+Cgo8ZyBpZD0iSWNvbnMiPgoJPGcgaWQ9Ikljb24tT3V0bGluZXMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC01MjEuMDAwMDAwLCAtMzA3LjAwMDAwMCkiPgoJCTxnIGlkPSJHcm91cC0zIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg1MjEuMDAwMDAwLCAzMDcuMDAwMDAwKSI+CgkJCTxlbGxpcHNlIGlkPSJPdmFsLUNvcHkiIGNsYXNzPSJzdDAiIGN4PSIyOC45NzciIGN5PSIyMS4wNjMiIHJ4PSI4Ljk3NyIgcnk9IjkuMDYzIi8+CgkJCTxwYXRoIGlkPSJDb21iaW5lZC1TaGFwZS1Db3B5IiBjbGFzcz0ic3QwIiBkPSJNMTQsNDYuNkMxOC4xMDQsMzkuMzg2LDIzLjUxOSwzNSwyOS40NTQsMzVjNS45LDAsMTEuMjg3LDQuMzM0LDE1LjM4MSwxMS40NzMKCQkJCWMtNC4wOTcsMy43NC05LjUyOSw2LjAxOC0xNS40ODgsNi4wMThDMjMuNDU2LDUyLjQ5MSwxOC4wODEsNTAuMjY1LDE0LDQ2LjZ6Ii8+CgkJCTxjaXJjbGUgaWQ9Ik92YWwtQ29weS0yIiBjbGFzcz0ic3QwIiBjeD0iMjkiIGN5PSIyOSIgcj0iMjgiLz4KCQk8L2c+Cgk8L2c+CjwvZz4KPC9zdmc+Cg==') no-repeat center center;
  background-size: 100%;
}
#menue .footer .notifications:after {
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgNTggNTgiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDU4IDU4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGw6bm9uZTtzdHJva2U6I0ZGRkZGRjtzdHJva2Utd2lkdGg6Mjt9Cjwvc3R5bGU+Cgo8ZyBpZD0iSWNvbnMiPgoJPGcgaWQ9Ikljb24tT3V0bGluZXMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC01MjEuMDAwMDAwLCAtMjA0LjAwMDAwMCkiPgoJCTxnIGlkPSJHcm91cC01IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg1MjEuMDAwMDAwLCAyMDQuMDAwMDAwKSI+CgkJCTxwYXRoIGlkPSJSZWN0YW5nbGUiIGNsYXNzPSJzdDAiIGQ9Ik0xMiwyM3YyMS43NDZsNS43OTUtNS4yNDVIMzdWMjNIMTJ6Ii8+CgkJCTxwb2x5bGluZSBpZD0iUGF0aC00IiBjbGFzcz0ic3QwIiBwb2ludHM9IjIwLDE5Ljc1MSAyMCwxNiA0NSwxNiA0NSwzNCA0MS43OTUsMzQgCQkJIi8+CgkJCTxjaXJjbGUgaWQ9Ik92YWwiIGNsYXNzPSJzdDAiIGN4PSIyOSIgY3k9IjI5IiByPSIyOCIvPgoJCTwvZz4KCTwvZz4KPC9nPgo8L3N2Zz4=') no-repeat center center;
  background-size: 100%;
}
#menue .footer .downloads:after {
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgNTAgNTAiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUwIDUwOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGw6I0ZGRkZGRjt9Cjwvc3R5bGU+Cgo8Zz4KCTxnPgoJCTxnIGlkPSJNYXNrIj4KCQkJPHBhdGggaWQ9Ik92YWwiIGNsYXNzPSJzdDAiIGQ9Ik0yNSw0OGMxMi43LDAsMjMtMTAuMywyMy0yM1MzNy43LDIsMjUsMlMyLDEyLjMsMiwyNVMxMi4zLDQ4LDI1LDQ4eiBNMjUsNTBDMTEuMiw1MCwwLDM4LjgsMCwyNQoJCQkJUzExLjIsMCwyNSwwczI1LDExLjIsMjUsMjVTMzguOCw1MCwyNSw1MHoiLz4KCQk8L2c+Cgk8L2c+Cgk8ZyBpZD0iR3JvdXAtMyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAuMDAwMDAwLCAxMi4wMDAwMDApIj4KCQk8ZyBpZD0iUGF0aC0yLUNvcHktNCI+CgkJCTxnIGlkPSJHcm91cCI+CgkJCQk8ZyBpZD0iR3JvdXAtMiI+CgkJCQkJPHBhdGggaWQ9IkNvbWJpbmVkLVNoYXBlIiBjbGFzcz0ic3QwIiBkPSJNMiwzdjE4LjloMjZWMTAuNkgxNi42Yy0wLjUsMC0xLTAuMi0xLjQtMC42TDgsM0gyeiBNMCwxaDguOWw3LjcsNy42SDMwVjI0SDBWMXoiLz4KCQkJCQk8cG9seWdvbiBpZD0iUGF0aCIgY2xhc3M9InN0MCIgcG9pbnRzPSIxMi40LDIuOSAxMi40LDAuOSAzMC4xLDAuOSAzMC4xLDYuMyAyOC4xLDYuMyAyOC4xLDIuOSAJCQkJCSIvPgoJCQkJPC9nPgoJCQk8L2c+CgkJPC9nPgoJPC9nPgo8L2c+Cjwvc3ZnPg==') no-repeat center center;
  background-size: 100%;
}

#menue a {
  text-decoration: none;
  display: block;
}

#menue ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

#menue .logo {
  margin-bottom: 1em;
  padding: 2em 2em 1.75em 2em;
  opacity: 0;
  height: auto;
  visibility: hidden;
  transition: visibility 0ms 500ms, opacity 500ms linear;  /* Ausblend-Animation mit Verzögerung bei visibility */
}
#menue .logo a {
  height: 45px;
}
#menue .logo span {
  display: none;
}
#menue .logo a:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  vertical-align: middle;
  background: url('/depot/tpl/white-label/set/logo_white.svg') no-repeat left center;
  background-size: contain;
}

#menue .kategorie {
  padding: 1em 0 2em 0;
  background-color: #000;
  border-bottom: 1px solid #303030;
}
#menue .asset {
  padding: 1em 0 2em 0;
}

#menue .eintraege li.aktiv,
#menue .eintraege li:hover {
  background-color: #111;
}
#menue .eintraege li.aktiv {
  font-weight: 700;
}
#menue .eintraege li.alterniert {
  background-color: #1a1a1a;
}

/* Hauptkategorien standardmäßig einblenden und alterniert ausblenden */
#menue .eintraege .kategorie > ul,
#menue .eintraege .asset > ul {
  overflow: hidden;
  max-height: 4000px;
  /*Separate Transitions für Ein- und Ausblendung (hier Ausblendung) mit cubic-bezier, um die
  visuelle Verzögerung beim Mouse-Out zu beseitigen. Die Verzögerung entsteht, weil max-height auf 4000px
  gesetzt wird, meist aber nur auf <400px ausgefahren wird. Die Verzögerung ist der nicht sichtbare
  Animations weg bei der Verkleinerung*/
  transition: max-height 3750ms ease; /* Transition für Einblendung */
}
#menue .eintraege .kategorie.alterniert > ul,
#menue .eintraege .asset.alterniert > ul {
  max-height: 0;
  transition: max-height 1250ms cubic-bezier(0, 1, 0, 1);  /* Transition für Ausblendung */
}

/* Unterkategorien standardmäßig ausblenden und alterniert einblenden */
#menue .eintraege li ul {
  overflow: hidden;
  max-height: 0;
  /*Separate Transitions für Ein- und Ausblendung (hier Ausblendung) mit cubic-bezier, um die
  visuelle Verzögerung beim Mouse-Out zu beseitigen. Die Verzögerung entsteht, weil max-height auf 4000px
  gesetzt wird, meist aber nur auf <400px ausgefahren wird. Die Verzögerung ist der nicht sichtbare
  Animations weg bei der Verkleinerung*/
  transition: max-height 1250ms cubic-bezier(0, 1, 0, 1);
}
#menue .eintraege li.alterniert > ul {
  max-height: 4000px;
  transition: max-height 3750ms ease; /* Transition für Einblendung */
}
#menue .eintraege li.alterniert li {
  background-color: #111;
}
#menue .eintraege li.alterniert li:hover {
  background-color: #1a1a1a;
}


#menue h6 {
  color: #838383;
  font-size: 0.65em;
  line-height: 2em;
  font-weight: 700;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  cursor: pointer;
  padding: 0 2em 0 3em;
}

#menue .eintraege a {
  position: relative;
  padding: 1.1em 2em 0.8em 2em;
}
#menue .eintraege li ul a {
  padding-left: 3em;
}
#menue .eintraege a[data-alternieren]:before {
  display: inline-block;
  content: "";
  margin-top: 4px;
  float: right;
  width: 1em;
  height: 1em;
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgNy4xIDEyLjciIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDcuMSAxMi43OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGw6bm9uZTtzdHJva2U6I0Q3RDdENzt9Cjwvc3R5bGU+CjxnIGlkPSJXZWxjb21lIj4KCTxnIGlkPSJEZXNrdG9wLUhEIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTIyLjAwMDAwMCwgLTc5NS4wMDAwMDApIj4KCQk8ZyBpZD0iR3JvdXAtMyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoODkuMDAwMDAwLCA2NDguMDAwMDAwKSI+CgkJCQoJCQkJPGcgaWQ9IkJ1dHRvbl94MkZfQXJyb3dfeDJGX0Rvd24tbmVnIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0MC4wMDAwMDAsIDE1MC41MDAwMDApIHNjYWxlKDEsIC0xKSByb3RhdGUoMTgwLjAwMDAwMCkgdHJhbnNsYXRlKC00MC4wMDAwMDAsIC0xNTAuNTAwMDAwKSB0cmFuc2xhdGUoMzQuMDAwMDAwLCAxNDcuMDAwMDAwKSI+CgkJCQk8cG9seWxpbmUgaWQ9IlBhdGgiIGNsYXNzPSJzdDAiIHBvaW50cz0iMTIuNiwwLjQgNi42LDYuNCAxMi42LDEyLjQgCQkJCSIvPgoJCQk8L2c+CgkJPC9nPgoJPC9nPgo8L2c+Cjwvc3ZnPg==') no-repeat center center;
  background-size: 0.7em;
  transition: transform 300ms ease;
}
#menue .eintraege li.alterniert > a:before{
  transform: rotate(90deg);
}
#menue .eintraege a:after {
  display: block;
  position: absolute;
  content: "";
  bottom: 0;
  left: 2em;
  right: 2em;
  height: 1px;
  background-color: #1a1a1a;
}
#menue .eintraege .asset > ul li:last-child a:after,
#menue .eintraege .kategorie > ul li:last-child a:after {
  display: none;
}


/* Menü in Mobil-Version aktiv stellen */
#menue.alterniert {
  width: 100%;
}
#menue.alterniert .container {
  margin-left: 0;
}
#menue.alterniert .footer,
#menue.alterniert .logo,
#menue.alterniert .eintraege {
  opacity: 1;
  visibility: visible;
  transition: visibility 0ms 0ms, opacity 500ms linear;  /* Einblend-Animation ohne Verzögerung bei visibility */
}


@media only screen and  (min-width: 768px) {
  #menue {
    width: 4em;
  }
  #menue .container {
    width: 18em;
    margin-left: -14em;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.3);
  }
  #menue .footer {
    display: flex;
    opacity: 1;
    visibility: visible;
  }
  #menue .logo,
  #menue .eintraege,
  #menue .footer .profile,
  #menue .footer .notifications {
    opacity: 0;
    visibility: hidden;
    transition: visibility 0ms 500ms, opacity 500ms linear;  /* Ausblend-Animation mit Verzögerung bei visibility */
  }

  /* Menü in Tablet-Version aktiv stellen */
  #menue.alterniert {
    width: 18em;
  }
  #menue.alterniert .container {
    align-items: stretch;
  }
  #menue.alterniert .logo,
  #menue.alterniert .eintraege,
  #menue.alterniert .footer,
  #menue.alterniert .footer .profile,
  #menue.alterniert .footer .notifications {
    opacity: 1;
    visibility: visible;
    transition: visibility 0ms 0ms, opacity 500ms linear;  /* Einblend-Animation ohne Verzögerung bei visibility */
  }
}

@media only screen and (min-width: 992px) {
  #menue {
    width: 18em;
  }
  #menue .container {
    margin-left: 0;
    align-items: stretch;
  }
  #menue .logo,
  #menue .eintraege,
  #menue .footer,
  #menue .footer .profile,
  #menue .footer .notifications {
    opacity: 1;
    visibility: visible;
    transition: visibility 0ms 0ms, opacity 500ms linear;  /* Einblend-Animation ohne Verzögerung bei visibility */
  }

  /* in der Desktop-Ansicht ist die Logik umgekehrt:
     das Menü ist immer sichtbar und wird beim Alternieren ausgeblendet */
  #menue.alterniert {
    width: 4em;
  }
  #menue.alterniert .container {
    margin-left: -14em;
  }
  #menue.alterniert .footer {
    display: flex;
  }
  #menue.alterniert .logo,
  #menue.alterniert .eintraege,
  #menue.alterniert .footer .profile,
  #menue.alterniert .footer .notifications {
    opacity: 0;
    visibility: hidden;
    transition: visibility 0ms 500ms, opacity 500ms linear;  /* Ausblend-Animation mit Verzögerung bei visibility */
  }
}



.menueoeffner {
  position: fixed;
  top: 0;
  left: 0;
  width: 4em;
  height: 4em;
  padding: 1em;
  background-color: #000;
  transition: left 500ms ease, right 500ms ease;
}
#menue.alterniert .menueoeffner {
  left: calc(100% - 4em);
  background-color: transparent;
}
.menueoeffner:hover,
#menue.alterniert .menueoeffner:hover {
  opacity: 0.85;
}
.menueoeffner-box {
  width: 100%;
  height: 100%;
  top: 8px;
}
#menue.alterniert .menueoeffner .menueoeffner-inner,
#menue.alterniert .menueoeffner .menueoeffner-inner::before,
#menue.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;
}
/* folgende 4 Anweisungen: Menüsymbol soll nur zwei Linien haben */
.menueoeffner-inner:before {
  display: none;
}
.menueoeffner .menueoeffner-inner::after {
  top: 8px;
}
#menue.alterniert .menueoeffner .menueoeffner-box {
  top: 2px;
}
#menue.alterniert .menueoeffner .menueoeffner-inner::after {
  top: 20px;
}

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

  #menue.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 */
  #menue.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);
  }

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

}











/* ----- Toolbar ----- */

#toolbar {
  position: absolute;
  height: 4em;
  width: 100%;
  padding: 0.75em 1em;
  z-index: 899999999;
  background-color: #fff;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.1);
}

#toolbar ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

#toolbar li {
  display: inline-block;
  margin-left: 1.5em;
}

#toolbar li > a {
  display: inline-block;
  position: relative;
  text-decoration: none;
  height: 2.5em;
}
#toolbar a.icon {
  width: 2.5em;
}
#toolbar a span {
  line-height: 2.1em;
  font-size: 1em;
}
#toolbar ul li.active a span {
  font-weight: 700;
}
#toolbar a.icon span {
  display: none;
}
#toolbar .icon:after {
  display: inline-block;
  content: "";
  width: 100%;
  height: 100%;
}
#toolbar ul li.language {
  margin-left: 0;
}
#toolbar ul li.language a {
  margin-left: 0.5em;
  margin-right: 0.5em;
}
#toolbar li.language:before {
  content: "";
}
#toolbar li.language ~ li.language:before {
  content: "|";
}
#toolbar .profile {
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMjEgMjIiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDIxIDIyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxwYXRoIGQ9Ik0xOS4xLDguMmwwLjctMC43YzAsMCwwLDAsMCwwYzEuNy0xLjcsMS43LTQuNCwwLTZjLTEuNy0xLjctNC4zLTEuNy02LDBjMCwwLDAsMCwwLDBMMS45LDEzLjJjLTAuMSwwLjEtMC4yLDAuMi0wLjIsMC4zCglsLTEuNyw2LjZjLTAuMSwwLjMsMCwwLjUsMC4yLDAuN2MwLjIsMC4yLDAuNSwwLjMsMC43LDAuMmw2LjYtMS43YzAuMSwwLDAuMy0wLjEsMC4zLTAuMkwxOS4xLDguMkMxOS4xLDguMiwxOS4xLDguMiwxOS4xLDguMgoJQzE5LjEsOC4yLDE5LjEsOC4yLDE5LjEsOC4yeiBNMy41LDEzLjhsMTAtMTBsMy45LDMuOWwtMTAsMTBMMy41LDEzLjh6IE0xOC43LDIuNWMxLjEsMS4xLDEuMSwyLjgsMCwzLjljMCwwLDAsMCwwLDBsLTAuMiwwLjIKCWwtMy45LTMuOWwwLjEtMC4xYzAsMCwwLDAsMCwwQzE1LjksMS40LDE3LjYsMS40LDE4LjcsMi41eiBNMS44LDE5LjRsMS00LjFMNiwxOC4zTDEuOCwxOS40eiIvPgo8L3N2Zz4=') no-repeat center center;
  background-size: 60%;
}
#toolbar .notifications {
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMTcuMSAyMSIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMTcuMSAyMTsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiMxMzE0MTM7fQo8L3N0eWxlPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNMTcsMTUuNGMwLTAuNC0wLjItMC44LTAuNC0xYy0wLjMtMC4zLTAuNS0wLjYtMC44LTAuOWMtMC4yLTAuMi0wLjQtMC40LTAuNi0wLjZjMC0wLjQsMC0xLDAtMS41CgljMC0wLjcsMC0xLjQsMC0xLjhjLTAuMS0yLjYtMS4zLTQuOS0zLjQtNi4xYy0wLjEtMC4xLTAuMi0wLjEtMC4yLTAuMWMwLDAsMCwwLDAsMGMwLDAsMCwwLDAtMC4xYzAtMC45LTAuNC0xLjctMS4xLTIuMwoJQzkuOSwwLjMsOC45LDAuMSw4LDAuMkM2LjUsMC41LDUuNSwxLjcsNS41LDMuM0MzLjUsNC40LDIuMiw2LjUsMiw4LjlDMS45LDkuNywxLjksMTEsMS45LDEyLjFsMCwwLjhjMCwwLjEsMCwwLjEsMCwwLjEKCWMtMC4yLDAuMi0wLjQsMC41LTAuNiwwLjdjLTAuMiwwLjItMC40LDAuNS0wLjYsMC43Yy0wLjMsMC40LTAuNSwwLjgtMC41LDEuM2MwLDAuMiwwLDAuNSwwLDAuN2wwLDAuNGMwLDEsMC41LDEuNSwxLjUsMS41bDMuMywwCglDNS40LDE5LjgsNi44LDIxLDguNSwyMWMxLjcsMCwzLjEtMS4yLDMuNi0yLjdjMC41LDAsMS4xLDAsMS42LDBjMC42LDAsMS4yLDAsMS44LDBjMC45LDAsMS40LTAuNSwxLjQtMS40bDAtMC4zCglDMTcsMTYuMiwxNywxNS44LDE3LDE1LjR6IE04LjUsMTkuNWMtMC45LDAtMS42LTAuNS0yLTEuMmMxLjMsMCwyLjksMCw0LDBDMTAuMSwxOSw5LjQsMTkuNSw4LjUsMTkuNXogTTE1LjUsMTYuOAoJYy0xLjIsMC0yLjQsMC0zLjYsMGMtMC4yLDAtNC4xLDAtNi4yLDBsLTQuMSwwYzAsMCwwLDAsMCwwYzAsMCwwLDAsMCwwbDAtMC40YzAtMC4zLDAtMC41LDAtMC44YzAtMC4xLDAtMC4xLDAuMS0wLjIKCWMwLjItMC4yLDAuNC0wLjUsMC42LTAuN2MwLjItMC4yLDAuNC0wLjUsMC42LTAuN2MwLjMtMC4zLDAuNC0wLjcsMC40LTEuMWwwLTAuOGMwLTEsMC0yLjMsMC4xLTNjMC4yLTIsMS4yLTMuNiwyLjgtNC40CglDNi43LDQuMyw3LDQsNywzLjRjMC0wLjksMC41LTEuNiwxLjMtMS43YzAuNS0wLjEsMC45LDAsMS4zLDAuM2MwLjQsMC4zLDAuNSwwLjcsMC42LDEuMWMwLDAuNywwLjMsMS4yLDAuOSwxLjUKCWMxLjYsMC45LDIuNiwyLjgsMi42LDQuOWMwLDAuNCwwLDEuMSwwLDEuOGMwLDAuNiwwLDEuMiwwLDEuNmMwLDAuMywwLjEsMC43LDAuMywwLjljMC4yLDAuMiwwLjQsMC41LDAuNiwwLjcKCWMwLjMsMC4zLDAuNSwwLjYsMC43LDAuOGMwLDAsMC4xLDAuMSwwLjEsMC4yYzAsMC4zLDAsMC42LDAsMUwxNS41LDE2Ljh6Ii8+Cjwvc3ZnPg==') no-repeat center center;
  background-size: 50%;
}
#toolbar .dashboard {
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMjAuNyAyMC44IiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAyMC43IDIwLjg7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDpub25lO3N0cm9rZTojMDAwMDAwO3N0cm9rZS13aWR0aDoxLjU7fQo8L3N0eWxlPgo8cGF0aCBpZD0iUmVjdGFuZ2xlIiBjbGFzcz0ic3QwIiBkPSJNMS45LDFoNC42YzAuNiwwLDEsMC40LDEsMXY0LjZjMCwwLjYtMC40LDEtMSwxSDEuOWMtMC42LDAtMS0wLjQtMS0xVjJDMC45LDEuNCwxLjMsMSwxLjksMXoiCgkvPgo8cGF0aCBpZD0iUmVjdGFuZ2xlLUNvcHktMyIgY2xhc3M9InN0MCIgZD0iTTEuOSwxMy4zaDQuNmMwLjYsMCwxLDAuNCwxLDF2NC42YzAsMC42LTAuNCwxLTEsMUgxLjljLTAuNiwwLTEtMC40LTEtMXYtNC42CglDMC45LDEzLjgsMS4zLDEzLjMsMS45LDEzLjN6Ii8+CjxwYXRoIGlkPSJSZWN0YW5nbGUtQ29weSIgY2xhc3M9InN0MCIgZD0iTTE0LjMsMWg0LjZjMC42LDAsMSwwLjQsMSwxdjQuNmMwLDAuNi0wLjQsMS0xLDFoLTQuNmMtMC42LDAtMS0wLjQtMS0xVjIKCUMxMy4zLDEuNCwxMy43LDEsMTQuMywxeiIvPgo8cGF0aCBpZD0iUmVjdGFuZ2xlLUNvcHktNSIgY2xhc3M9InN0MCIgZD0iTTE0LjMsMTMuM2g0LjZjMC42LDAsMSwwLjQsMSwxdjQuNmMwLDAuNi0wLjQsMS0xLDFoLTQuNmMtMC42LDAtMS0wLjQtMS0xdi00LjYKCUMxMy4zLDEzLjgsMTMuNywxMy4zLDE0LjMsMTMuM3oiLz4KPC9zdmc+') no-repeat center center;
  background-size: 60%;
}
#toolbar .search {
  background: url("data:image/svg+xml,%3Csvg id='glyphicons-basic' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E %3Cpath id='search' d='M27.207,24.37866,20.6106,17.78235a9.03069,9.03069,0,1,0-2.82825,2.82825L24.37878,27.207a1,1,0,0,0,1.41425,0l1.414-1.41418A1,1,0,0,0,27.207,24.37866ZM13,19a6,6,0,1,1,6-6A6.00657,6.00657,0,0,1,13,19Z'/%3E %3C/svg%3E ") no-repeat center center;
  background-size: 85%;
}
#toolbar .user {
  display: none;
  padding-right: 2em;
}
#toolbar .user:after {
  content: "";
  display: inline-block;
  position: absolute;
  right: 0;
  margin: 0.8em 0.5em 0 0;
  width: 13px;
  height: 7px;
  vertical-align: middle;
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMTIuNzA3IDcuMDYxIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAxMi43MDcgNy4wNjE7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDpub25lO3N0cm9rZTojNjQ2NDY0O30KPC9zdHlsZT4KPHRpdGxlPmFycm93X2Rvd25fb3JhbmdlPC90aXRsZT4KPGcgaWQ9IldlbGNvbWUiPgoJPGcgaWQ9IkRlc2t0b3AtSEQiPgoJCTxnIGlkPSJHcm91cC0zIj4KCQkJPGcgaWQ9IkJ1dHRvbl9BcnJvd19Eb3duLW5lZyI+CgkJCQk8cG9seWxpbmUgaWQ9IlBhdGgiIGNsYXNzPSJzdDAiIHBvaW50cz0iMTIuMzU0LDAuMzU0IDYuMzU0LDYuMzU0IDAuMzU0LDAuMzU0IAkJCQkiLz4KCQkJPC9nPgoJCTwvZz4KCTwvZz4KPC9nPgo8L3N2Zz4=') no-repeat center center;
  background-size: 13px;
}

#toolbar .profile-information {
  position: absolute;
  display: none;
  align-items: flex-start;
  overflow: hidden;
  top: 4em;
  right: 4em;
  font-size: 13px;
  padding: 1.5em;
  color: #aaa;
  background-color: #fff;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.2);
}
#toolbar .profile-information.alterniert {
  display: flex;
}
#toolbar .profile-information a {
  font-weight: 700;
  text-decoration: none;
}
#toolbar .profile-information b {
  color: #000;
}
#toolbar .profile-image {
  position: relative;
  overflow: hidden;
  margin-right: 1em;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: #d0d0d0;
}
#toolbar .profile-image img {
  position: absolute;
  left: -1000%;
  right: -1000%;
  top: -1000%;
  bottom: -1000%;
  margin: auto;
  min-height: 100%;
  min-width: 100%;
  max-height: 150% !important;
  max-width: 150% !important;
}
#toolbar .profile-image a {
  position: absolute;
  display: block;
  opacity: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  font-size: 0.8em;
  line-height: 1.5em;
  padding-top: 0.75em;
  text-align: center;
  color: #fff;
  text-decoration: none;
  background-color: rgba(0, 0, 0, .6);
}
#toolbar .profile-image:hover a {
  opacity: 1;
}
#toolbar .profile-initials {
  position: absolute;
  top: 50%;
  width: 50px;
  height: 25px;
  color: #808080;
  font-size: 1.5em;
  line-height: 1.3em;
  font-weight: 700;
  text-align: center;
  transform: translate(0px, -50%);
}



@media only screen and  (min-width: 768px) {
  #toolbar {
    height: 3em;
    padding: 0.5em 4em;
  }

  #toolbar ul {
    line-height: 1.5em;
  }

  #toolbar li > a {
    line-height: 1.5em;
  }
  #toolbar a span {
    line-height: 2.5em;
    font-size: 0.8em;
  }
  #toolbar a.icon {
    width: 1.5em;
    height: 1.5em;
  }

  #toolbar ul li.language a {
    margin-left: 1.5em;
  }
  #toolbar ul li.language ~ li.language a {
    margin-left: 0.5em;
  }

  #toolbar .user {
    display: inline-block;
  }
}







/* ----- 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):not(.dcr-m18) .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) {
  .sektionen {
    width: calc(100% - 4em);
  }

  /* 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) {
  .sektionen {
    width: calc(100% - 18em);
  }
}

@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-cell {
  position: absolute !important;
}

.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;
  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;
  padding-bottom: 0.25em;
  border-bottom: 1px solid transparent;
  border-color: inherit;
}
#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;
  }
}

.scrollen {
  position: absolute;
  display: block;
  z-index: 1000;
  left: 50%;
  bottom: 2em;
  text-decoration: none;
  transform: translate(-50%, 0);
}
.scrollen:hover {
  text-decoration: none;
}
.scrollen:before {
  display: block;
  content: "";
  cursor: pointer;
  height: 1em;
  margin-bottom: 0.75em;
  vertical-align: middle;
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMTIuNzA3IDcuMDYxIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAxMi43MDcgNy4wNjE7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDpub25lO3N0cm9rZTojNjQ2NDY0O30KPC9zdHlsZT4KPHRpdGxlPmFycm93X2Rvd25fb3JhbmdlPC90aXRsZT4KPGcgaWQ9IldlbGNvbWUiPgoJPGcgaWQ9IkRlc2t0b3AtSEQiPgoJCTxnIGlkPSJHcm91cC0zIj4KCQkJPGcgaWQ9IkJ1dHRvbl9BcnJvd19Eb3duLW5lZyI+CgkJCQk8cG9seWxpbmUgaWQ9IlBhdGgiIGNsYXNzPSJzdDAiIHBvaW50cz0iMTIuMzU0LDAuMzU0IDYuMzU0LDYuMzU0IDAuMzU0LDAuMzU0IAkJCQkiLz4KCQkJPC9nPgoJCTwvZz4KCTwvZz4KPC9nPgo8L3N2Zz4K') no-repeat center center;
  background-size: 2em;
}
.scrollen > span {
  display: block;
  font-size: 1em;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  font-weight: 700;
}








/* ----- 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;
}








/* ----- Download-Buttons ----- */
section .download-now,
section .download-add {
  position: relative;
  display: inline-block;
  min-width: 3em;
  height: 3em;
  line-height: 3em;
  padding-left: 1.75em;
  padding-right: 1.25em;
  margin: 1em 2em 1em 0;
  text-indent: 1.5em;
  vertical-align: middle;
  text-decoration: none;
  border-radius: 100px;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.2);
}
section .bildblock .download-now,
section .bildblock .download-add {
  float: right;
  margin: -10px 0 0 0;
}
.dcr-m19 .bildblock .download-now,
.dcr-m20 .bildblock .download-now,
.dcr-m21 .bildblock .download-now,
.dcr-m22 .bildblock .download-now,
.dcr-m19 .bildblock .download-add,
.dcr-m20 .bildblock .download-add,
.dcr-m21 .bildblock .download-add,
.dcr-m22 .bildblock .download-add,
.flickity-cell .bildblock .download-now,
.flickity-cell .bildblock .download-add {
  margin: -80px 40px 0px 0;
}
.container.streifen .download-now,
.container.streifen .download-add,
.dcr-m10 .bildblock .download-now,
.dcr-m10 .bildblock .download-add {
    display: none;
}

section .download-now:before,
section .download-add:before {
  position: absolute;
  display: block;
  content: "";
  top: 0;
  left: 0;
  width: 3em;
  height: 3em;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100%;
  background-image: url("data:image/svg+xml,%3C?xml version='1.0' encoding='utf-8'?%3E %3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E %3Csvg version='1.1' id='svg2' xmlns:dc='http://purl.org/dc/elements/1.1/' xmlns:cc='http://creativecommons.org/ns%23' xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns%23' xmlns:svg='http://www.w3.org/2000/svg' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='49.464px' height='48px' viewBox='0 0 49.464 48' enable-background='new 0 0 49.464 48' xml:space='preserve'%3E %3Cg id='layer1' transform='translate(-177.65643,-410.93363)'%3E %3Cg id='g3362' transform='translate(177.65643,410.93363)'%3E %3Cellipse id='ellipse3343' fill='%23FFFFFF' cx='24.732' cy='24' rx='24.732' ry='24'/%3E %3Cg id='MILK_Icon_Rounded_Add_Bag'%3E %3Cg id='Group-3-Copy-2'%3E %3Cg id='Path-2-Copy-4'%3E %3Cpath id='Path-2-Copy-3' fill='none' stroke='%23646464' stroke-width='1.5' d='M11.12,14.26v16.4h21.2V20.1h-9.6l-5.76-5.84 H11.12z'/%3E %3Cpolyline id='Path-2' fill='none' stroke='%23646464' stroke-width='1.5' points='32.322,17.78 32.322,14.34 20.482,14.34 '/%3E %3C/g%3E %3C/g%3E %3Cg id='Group-5-Copy'%3E %3Ccircle id='Oval' fill='%23FFFFFF' stroke='%23646464' stroke-width='1.5' cx='32.562' cy='32.5' r='6.8'/%3E %3Cg id='Button_Cross-Copy-3'%3E %3Cg id='Group'%3E %3Cg id='Group-2'%3E %3Cpath id='Line-2' fill='none' stroke='%23646464' stroke-width='1.5' d='M32.57,35.82v-7.2'/%3E %3Cpath id='Line-2-2' fill='none' stroke='%23646464' stroke-width='1.5' d='M32.134,36.162l4.582-4.695'/%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3Cpath id='Line-2-2-6' fill='none' stroke='%23646464' stroke-width='1.5' d='M28.265,31.568l4.695,4.582'/%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/svg%3E ");
}
section .download-add:before {
  background-size: 100%;
  background-image: url("data:image/svg+xml,%3Csvg id='Ebene_1' data-name='Ebene 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 61.831 60'%3E%3Cdefs%3E%3Cstyle%3E.cls-1,.cls-3%7Bfill:%23fff;%7D.cls-2%7Bfill:none;%7D.cls-2,.cls-3%7Bstroke:%23646464;stroke-width:1.5px;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3EAdd_Bag_neu%3C/title%3E%3Cellipse class='cls-1' cx='30.915' cy='30' rx='30.915' ry='30'/%3E%3Cg id='MILK_Icon_Rounded_Add_Bag' data-name='MILK/Icon/Rounded/Add_Bag'%3E%3Cg id='Group-3-Copy-2'%3E%3Cg id='Path-2-Copy-4'%3E%3Cpath id='Path-2-Copy-3' class='cls-2' d='M13.9,17.825v20.5H40.4v-13.2h-12l-7.2-7.3Z'/%3E%3Cpolyline id='Path-2' class='cls-2' points='40.403 22.225 40.403 17.925 25.603 17.925'/%3E%3C/g%3E%3C/g%3E%3Cg id='Group-5-Copy'%3E%3Ccircle id='Oval' class='cls-3' cx='40.703' cy='40.625' r='8.5'/%3E%3Cg id='Button_Cross-Copy-3' data-name='Button/Cross-Copy-3'%3E%3Cg id='Group'%3E%3Cg id='Group-2'%3E%3Cpath id='Line-2' class='cls-2' d='M40.712,44.775v-9'/%3E%3Cpath id='Line-2-2' data-name='Line-2' class='cls-2' d='M36.612,40.375l8.2-.1'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}





/* Autorentipp */
.autorentipp {
  margin: 2em 0;
  padding-left: 1.5em;
  border-left: 1px solid #ccc;
}

.autorentipp .bild-links {
  max-width: 25% !important;
  margin: 0 1em 0 0;
}

.autorentipp h4 {
  font-size: 1.15em;
  font-weight: 700;
}

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

.autorentipp:after {
  clear: both;
}










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


.dcr-m1 {
  text-align: center;
}
.dcr-m1 .fliesstext p {
  font-size: 1em;
}



.dcr-m2 {
}



.dcr-m3 .fliesstext {
  column-count: 2;
  column-gap: 3em;
  column-rule: none;
}
@media only screen and  (max-width: 767px) {
  .dcr-m3 .fliesstext {
    column-count: 1;
  }
}



.dcr-m4 .abschnitt,
.dcr-m5 .abschnitt,
.dcr-m6 .abschnitt,
.dcr-m7 .abschnitt,
.dcr-m8 .abschnitt,
.dcr-m9 .abschnitt {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: stretch;
  margin-right: -1em;
  margin-left: -1em;
}
.dcr-m6 .abschnitt,
.dcr-m9 .abschnitt {
  flex-flow: wrap;
}
.dcr-m4 .abschnitt > div,
.dcr-m5 .abschnitt > div,
.dcr-m6 .abschnitt > div,
.dcr-m7 .abschnitt > div,
.dcr-m8 .abschnitt > div,
.dcr-m9 .abschnitt > div {
  padding: 1em;
}
.dcr-m4 h2,
.dcr-m5 h2,
.dcr-m6 h2,
.dcr-m7 h2,
.dcr-m8 h2,
.dcr-m9 h2 {
  font-weight: normal;
}
.dcr-m4 .bildblock,
.dcr-m4 .textblock,
.dcr-m5 .bildblock,
.dcr-m5 .textblock,
.dcr-m6 .bildblock,
.dcr-m6 .textblock,
.dcr-m7 .bildblock,
.dcr-m7 .textblock,
.dcr-m8 .bildblock,
.dcr-m8 .textblock,
.dcr-m9 .bildblock,
.dcr-m9 .textblock{
  width: 100%;
  max-width: 100%;
}
.dcr-m4 .bild,
.dcr-m5 .bild,
.dcr-m6 .bild,
.dcr-m7 .bild,
.dcr-m8 .bild,
.dcr-m9 .bild {
  padding-bottom: 2em;
}

.dcr-m4 .abschnittsumschalter,
.dcr-m5 .abschnittsumschalter,
.dcr-m6 .abschnittsumschalter {
  position: relative;
  margin-left: -0.5em;
}
.dcr-m4 .abschnittsumschalter,
.dcr-m5 .abschnittsumschalter,
.dcr-m6 .abschnittsumschalter,
.dcr-m7 .abschnittsumschalter,
.dcr-m8 .abschnittsumschalter,
.dcr-m9 .abschnittsumschalter {
  margin-right: 5em;
}
.dcr-m4 .abschnittsumschalter:hover .schalter,
.dcr-m5 .abschnittsumschalter:hover .schalter,
.dcr-m6 .abschnittsumschalter:hover .schalter {
  display: block;
}
.dcr-m4 .abschnittsumschalter .bezeichnung,
.dcr-m5 .abschnittsumschalter .bezeichnung,
.dcr-m6 .abschnittsumschalter .bezeichnung {
  display: block;
  position: relative;
  cursor: pointer;
  width: 15em;
  font-weight: 700;
  max-width: 100%;
  padding: 0.5em 2em 0.2em 0.5em;
  background-color: #fff;
  z-index: 2;
}
.dcr-m4 .abschnittsumschalter .bezeichnung:after,
.dcr-m5 .abschnittsumschalter .bezeichnung:after,
.dcr-m6 .abschnittsumschalter .bezeichnung:after {
  content: "";
  display: inline-block;
  position: absolute;
  right: 0;
  margin: 0.5em 0.5em 0 0;
  width: 14px;
  height: 8px;
  vertical-align: middle;
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMTIuNzA3IDcuMDYxIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAxMi43MDcgNy4wNjE7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDpub25lO3N0cm9rZTojMDAwMDAwO30KPC9zdHlsZT4KPHRpdGxlPmFycm93X2Rvd25fb3JhbmdlPC90aXRsZT4KPGcgaWQ9IldlbGNvbWUiPgoJPGcgaWQ9IkRlc2t0b3AtSEQiPgoJCTxnIGlkPSJHcm91cC0zIj4KCQkJPGcgaWQ9IkJ1dHRvbl9BcnJvd19Eb3duLW5lZyI+CgkJCQk8cG9seWxpbmUgaWQ9IlBhdGgiIGNsYXNzPSJzdDAiIHBvaW50cz0iMTIuMzU0LDAuMzU0IDYuMzU0LDYuMzU0IDAuMzU0LDAuMzU0IAkJCQkiLz4KCQkJPC9nPgoJCTwvZz4KCTwvZz4KPC9nPgo8L3N2Zz4=') no-repeat center center;
  background-size: 14px;
}

.dcr-m4 .abschnittsumschalter .schalter,
.dcr-m5 .abschnittsumschalter .schalter,
.dcr-m6 .abschnittsumschalter .schalter {
  display: none;
  position: absolute;
  background-color: #fff;
  min-width: 15em;
  z-index: 1;
  box-shadow: 1px 0 12px 0 rgba(0,0,0,0.1);
}
.dcr-m4 .abschnittsumschalter .schalter a,
.dcr-m5 .abschnittsumschalter .schalter a,
.dcr-m6 .abschnittsumschalter .schalter a {
  display: block;
  line-height: 1.75em;
  padding: 0.5em 0.5em 0.25em 0.5em;
  text-decoration: none;
  font-weight: 400;
}
.dcr-m4 .abschnittsumschalter .schalter a:hover,
.dcr-m5 .abschnittsumschalter .schalter a:hover,
.dcr-m6 .abschnittsumschalter .schalter a:hover {
  background-color: #f5f5f5;
}

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

@media only screen and  (min-width: 1200px) {
  .dcr-m4 .abschnitt,
  .dcr-m5 .abschnitt,
  .dcr-m7 .abschnitt,
  .dcr-m8 .abschnitt {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .dcr-m5 .abschnitt,
  .dcr-m8 .abschnitt {
    flex-direction: row-reverse;
  }
  .dcr-m4 .bildblock,
  .dcr-m5 .bildblock,
  .dcr-m7 .bildblock,
  .dcr-m8 .bildblock {
    width: 60%;
  }
  .dcr-m4 .textblock,
  .dcr-m5 .textblock,
  .dcr-m7 .textblock,
  .dcr-m8 .textblock {
    width: 40%;
  }
}



.dcr-m10 .container {
  display: grid;
  width: 100%;
  height: 100%;
  grid-auto-columns: 1fr;
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  grid-template-areas:
    ". ."
    ". ."
    ". ."
    ". ."
    ". ."
    ". .";
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto auto auto auto auto;
  counter-reset: zellenzaehler;
}
.dcr-m10 .zelle {
  position: relative;
  overflow: hidden;
  font-size: 0.8em;
  cursor: pointer;
  counter-increment: zellenzaehler;
}
.dcr-m10 .zelle:nth-child(1){
  grid-row: 1 / span 1;
  grid-column: 1 / span 1;
}
.dcr-m10 .zelle:nth-child(2){
  grid-row: 1 / span 1;
  grid-column: 2 / span 1;
}
.dcr-m10 .zelle:nth-child(3){
  grid-row: 2 / span 2;
  grid-column: 1 / span 1;
}
.dcr-m10 .zelle:nth-child(4){
  grid-row: 2 / span 2;
  grid-column: 2 / span 1;
}
.dcr-m10 .zelle:nth-child(5){
  grid-row: 4 / span 1;
  grid-column: 1 / span 1;
}
.dcr-m10 .zelle:nth-child(6){
  grid-row: 5 / span 1;
  grid-column: 1 / span 2;
}
.dcr-m10 .zelle:nth-child(7){
  grid-row: 6 / span 1;
  grid-column: 1 / span 2;
}
.dcr-m10 .zelle:nth-child(8){
  grid-row: 4 / span 1;
  grid-column: 2 / span 1;
}
.dcr-m10 .textblock {
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  padding: 1em;
  opacity: 0;
  color: #fff;
  background-color: rgba(0, 0, 0, 0.5);
  transition: opacity 750ms ease;
}
.dcr-m10 .zelle:hover .textblock {
  display: block;
  opacity: 1;
}
.dcr-m10 .ueberschrift {
  display: inline-block;
}
.dcr-m10 .fliesstext,
.dcr-m10 .grossansicht {
  display: none;
}
.dcr-m10 .bildblock,
.dcr-m10 .bildblock .bild {
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
}
.dcr-m10 .bildblock .bild img {
  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-m10 .zelle:hover img {
  transform: scale(1.1);
}
.dcr-m10 h3 {
  text-transform: uppercase;
  padding-bottom: 0.25em;
  color: inherit;
  border-bottom: 1px solid transparent;
  border-color: inherit;
}
.dcr-m10 h4 {
  color: inherit;
  font-size: 1em;
  font-weight: 300;
  letter-spacing: 0.2em;
}

body.editor .dcr-m10 .zelle .textblock {
  display: block;
  opacity: 1;
  bottom: auto;
}
body.editor .dcr-m10 .fliesstext {
  display: block;
}
body.editor .dcr-m10 .grossansicht {
  display: block;
  position: absolute;
  overflow: hidden;
  z-index: 2;
  right: 5px;
  bottom: 5px;
  width: 160px;
  height: 90px !important;
  border: 1px dotted red;
}
body.editor .dcr-m10 .grossansicht:before {
  display: inline-block;
  position: absolute;
  z-index: 3;
  padding: 1px 4px;
  font-size: 12px;
  content: "Bild für Großansicht";
  background-color: rgba(255, 255, 255, 0.5);
}

@media only screen and  (min-width: 768px) {
  .dcr-m10 .container {
    grid-template-areas:
      ". . ."
      ". . ."
      ". . ."
      ". . .";
    grid-template-rows: auto auto auto auto;
    grid-template-columns: 1fr 1fr 1fr;
  }
  .dcr-m10 .zelle:nth-child(1){
    grid-row: 1 / span 1;
    grid-column: 1 / span 1;
  }
  .dcr-m10 .zelle:nth-child(2){
    grid-row: 1 / span 1;
    grid-column: 2 / span 1;
  }
  .dcr-m10 .zelle:nth-child(3){
    grid-row: 1 / span 2;
    grid-column: 3 / span 1;
  }
  .dcr-m10 .zelle:nth-child(4){
    grid-row: 2 / span 2;
    grid-column: 1 / span 1;
  }
  .dcr-m10 .zelle:nth-child(5){
    grid-row: 2 / span 1;
    grid-column: 2 / span 1;
  }
  .dcr-m10 .zelle:nth-child(6){
    grid-row: 3 / span 1;
    grid-column: 2 / span 2;
  }
  .dcr-m10 .zelle:nth-child(7){
    grid-row: 4 / span 1;
    grid-column: 1 / span 2;
  }
  .dcr-m10 .zelle:nth-child(8){
    grid-row: 4 / span 1;
    grid-column: 3 / span 1;
  }
  .dcr-m10 .textblock:before {
    display: block;
    position: absolute;
    content: counter(zellenzaehler, decimal-leading-zero);
    bottom: 1em;
    left: 1em;
  }
}



.dcr-m11 .fliesstext,
.dcr-m11 .bild {
  display: none;
}
.dcr-m11 .grossansicht {
  display: block;
}
.dcr-m11 .grossansicht img {
  display: inline-block;
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
  vertical-align: middle;
  object-fit: cover;
  object-position: center;
}
.dcr-m11 .ueberschrift {
  display: inline-block;
}
.dcr-m11 h3 {
  text-transform: uppercase;
  padding-bottom: 0.25em;
  border-bottom: 1px solid transparent;
  border-color: inherit;
}
.dcr-m11 h4 {
  font-size: 1em;
  font-weight: 300;
  letter-spacing: 0.2em;
  color: inherit;
}

body.editor .dcr-m11 .fliesstext {
  display: block;
}
body.editor .dcr-m11 .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-m11 .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-m12 {
  padding-bottom: 6em;
}
.dcr-m12 .container.ansicht {
  padding-bottom: 1em;
}
.dcr-m12 .container.streifen {
  padding-bottom: 0;
  padding-top: 0;
}
.dcr-m12 .textblock,
.dcr-m12 .bild {
  display: none;
}
.dcr-m12 .container.ansicht .grossansicht {
  display: block;
}
.dcr-m12 .container.ansicht .grossansicht img {
  display: inline-block;
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
  vertical-align: middle;
  object-fit: cover;
  object-position: center;
}
.dcr-m12 .container.streifen .bild:not(.grossansicht) {
  display: block;
}
.dcr-m12 .container.streifen .flickity-cell {
  margin: 0 0.5em;
}
.dcr-m12 .container.streifen .flickity-cell {
  margin: 0 -0.5em;
}
body.editor .dcr-m12 .textblock {
  display: block;
}
body.editor .dcr-m12 .grossansicht {
  display: block;
}
body.editor .dcr-m12 .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-m12 .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-m13 .container {
  padding: 0;
  max-width: none;
}
.dcr-m13 .bild {
  display: none;
}
.dcr-m13 .grossansicht {
  display: block;
}
.dcr-m13 .grossansicht img {
  display: inline-block;
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
  vertical-align: middle;
  object-fit: cover;
  object-position: center;
}
.dcr-m13 .textblock {
  display: block;
  position: absolute;
  z-index: 1;
  padding: 4em;
  margin: 1em 6em;
  top: 50%;
  background-color: #fff;
  text-align: center;
  transform: translate(0, -50%);
}
.dcr-m13 .ueberschrift {
  display: inline-block;
}
.dcr-m13 h3 {
  font-weight: 400;
  font-size: 4em;
  line-height: 1em;
}
.dcr-m13 h4 {
}
.dcr-m13 .flickity-prev-next-button.previous,
.dcr-m13 .flickity-prev-next-button.next {
  width: 45px;
  height: 45px;
  left: 1rem;
}
.dcr-m13 .flickity-prev-next-button.next {
  left: auto;
  right: 1rem;
}

body.editor .dcr-m13 .fliesstext {
  display: block;
}
body.editor .dcr-m13 .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-m13 .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-m14,
.dcr-m15 {
  z-index: 1;
}
.dcr-m14 {
  background: #000;
  color: #fff;
}
.dcr-m14 ~ section,
.dcr-m15 ~ section {
  margin-top: -4em;
}
.dcr-m14 .container,
.dcr-m15 .container {
  text-align: center;
  padding-bottom: 0;
}
.dcr-m14 h2 {
  font-size: 7em;
  line-height: 1em;
  letter-spacing: -2px;
  margin-bottom: 0.3em;
}
.dcr-m15 h2 {
  font-size: 6em;
  line-height: 1em;
  letter-spacing: -2px;
  margin-bottom: 0.3em;
}



.dcr-m16:before {
  display: block;
  content: "";
  background: #000;
  position: absolute;
  width: 100%;
  height: 50%;
}
.dcr-m16 .raster,
.dcr-m17 .raster {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: stretch;
  margin-right: -0.5em;
  margin-left: -0.5em;
}
.dcr-m16 .zelle,
.dcr-m17 .zelle {
  position: relative;
  overflow: hidden;
  margin: 0.5em;
  width: calc(100% - 1em);
  max-width: 33em;
  min-height: 24em;
  box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.3);
}
.dcr-m16 .link,
.dcr-m17 .link {
  position: absolute;
  z-index: 2;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
body.editor .dcr-m16 .link,
body.editor .dcr-m17 .link {
  right: auto;
  bottom: auto;
  width: 50%;
  height: 2em;
  border: 1px dotted red;
}
.dcr-m16 .link a,
.dcr-m16 .link a:hover,
.dcr-m17 .link a,
.dcr-m17 .link a:hover {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  text-indent: -1000px;
  text-decoration: none;
}
body.editor .dcr-m16 .link a,
body.editor .dcr-m17 .link a {
  text-indent: 0;
  padding: 1px 4px;
  background-color: rgba(255,255,255,0.5);
}
body.editor .dcr-m16 .link a:before,
body.editor .dcr-m17 .link a:before {
  content: "Link für diesen Block";
}
.dcr-m16 .textblock,
.dcr-m17 .textblock {
  padding: 1em;
  color: #fff;
  background-color: #333;
}
.dcr-m16 .bildblock .bild,
.dcr-m17 .bildblock .bild {
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
}
.dcr-m16 .bildblock .bild img,
.dcr-m17 .bildblock .bild img {
  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-m16 h3,
.dcr-m17 h3 {
  font-size: 1em;
  line-height: 1em;
  margin-bottom: 1em;
}
.dcr-m16 h5,
.dcr-m17 h5 {
  font-size: 0.9em;
  line-height: 0.9em;
  margin-bottom: 0.75em;
  color: #4c4c4c;
}

@media only screen and  (min-width: 768px) {
  .dcr-m16 .raster,
  .dcr-m17 .raster {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: stretch;
  }
  .dcr-m16 .zelle,
  .dcr-m17 .zelle {
    width: calc(33.3333333% - 1em);
  }
}
@media only screen and  (min-width: 992px) {
  .dcr-m16 .textblock,
  .dcr-m17 .textblock {
    position: absolute;
    z-index: 1;
    left: 0;
    top: auto;
    right: 0;
    bottom: 0;
    opacity: 0.75;
    background-color: #1a1a1a;
    transition: opacity 2750ms ease;
  }
  .dcr-m16 .zelle:hover .textblock,
  .dcr-m17 .zelle:hover .textblock {
    display: block;
    opacity: 1;
  }
  .dcr-m16 .fliesstext,
  .dcr-m17 .fliesstext {
    overflow: hidden;
    max-height: 0;
    /*Separate Transitions für Ein- und Ausblendung (hier Ausblendung) mit cubic-bezier, um die
    visuelle Verzögerung beim Mouse-Out zu beseitigen. Die Verzögerung entsteht, weil max-height auf 500px
    gesetzt wird, meist aber nur auf <100px ausgefahren wird. Die Verzögerung ist der nicht sichtbare
    Animations weg bei der Verkleinerung*/
    transition: max-height 3750ms cubic-bezier(0, 1, 0, 1);
  }
  /*body.editor .dcr-m16 .fliesstext,
  body.editor .dcr-m17 .fliesstext {
    max-height: 500px;
  }*/
  .dcr-m16 .zelle:hover .fliesstext,
  .dcr-m17 .zelle:hover .fliesstext {
    max-height: 500px;
    transition: max-height 3750ms ease; /* Transition für Einblendung */
  }
  .dcr-m16 .bildblock,
  .dcr-m17 .bildblock {
    overflow: hidden;
    width: 100%;
    height: 100% !important;
    max-width: 100% !important;
  }
  .dcr-m16 .zelle:hover img,
  .dcr-m17 .zelle:hover img {
    transform: scale(1.1);
  }
}



.dcr-m18 .raster {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: stretch;
  margin-right: -0.5em;
  margin-left: -0.5em;
}
.dcr-m18 .zelle {
  position: relative;
  overflow: hidden;
  margin: 0.5em;
  width: calc(100% - 1em);
  max-width: 33em;
  box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.3);
}
.dcr-m18 .farbkachel {
  position: relative;
  width: 100%;
  height: 8em;
}
.dcr-m18 .farbkachel > * {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.dcr-m18 .textblock {
  padding: 1em;
}
.dcr-m18 dl {
  display: flex;
  flex-flow: row;
  flex-wrap: wrap;
  overflow: visible;
}
.dcr-m18 dt {
  flex: 0 0 35%;
  text-overflow: ellipsis;
  overflow: hidden;
  padding-right: 0.5em;
  color: #838383;
}
.dcr-m18 dd {
  flex:0 0 65%;
  margin-left: auto;
  text-align: left;
  text-overflow: ellipsis;
  overflow: hidden;
}
.dcr-m18 h6 {
  font-size: 1.2em;
  font-weight: 700;
  line-height: 1em;
  margin-bottom: 1em;
  text-transform: none;
}

@media only screen and  (min-width: 768px) {
  .dcr-m18 .raster {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: stretch;
  }
  .dcr-m18 .zelle {
    width: calc(50% - 1em);
  }
}
@media only screen and  (min-width: 992px) {
  .dcr-m18 .zelle {
    width: calc(25% - 1em);
  }
  .dcr-m18 .textblock {
  }
  .dcr-m18 .fliesstext {
  }
}





.dcr-m19,
.dcr-m20,
.dcr-m21,
.dcr-m22 {
  overflow: hidden;
  height: 100vh;
  min-height: 100vh;
}
.dcr-m20,
.dcr-m22 {
  height: 75vh;
  min-height: 75vh;
}
.dcr-m19 .bildblock,
.dcr-m20 .bildblock,
.dcr-m21 .bildblock,
.dcr-m22 .bildblock {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
.dcr-m19 .bild,
.dcr-m19 .bildblock,
.dcr-m20 .bild,
.dcr-m20 .bildblock,
.dcr-m21 .bild,
.dcr-m21 .bildblock,
.dcr-m22 .bild,
.dcr-m22 .bildblock {
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
}
.dcr-m19 .bildblock .bild img,
.dcr-m20 .bildblock .bild img,
.dcr-m21 .bildblock .bild img,
.dcr-m22 .bildblock .bild img {
  display: inline-block;
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
  vertical-align: middle;
  object-fit: cover;
  object-position: center;
}
.dcr-m19 .container,
.dcr-m20 .container,
.dcr-m21 .container,
.dcr-m22 .container {
  z-index: 2;
  padding-top: 12em;
  padding-bottom: 12em;
}
.dcr-m20 .container,
.dcr-m22 .container {
  padding-top: 8em;
  padding-bottom: 8em;
}
.dcr-m19 .fliesstext,
.dcr-m20 .fliesstext,
.dcr-m21 .fliesstext,
.dcr-m22 .fliesstext {
  max-width: 36em;
}
.dcr-m20 .scrollen,
.dcr-m22 .scrollen {
  display: none;
}



.dcr-m30 .container {
  padding: 0;
  max-width: none;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  align-content: stretch;
}
.dcr-m30 .zurueck,
.dcr-m30 .weiter {
  flex-flow: wrap;
  overflow: hidden;
  padding: 4em 4em;
  text-align: right;
  color: #fff;
  background-color: #838383;
}
.dcr-m30 .weiter {
  text-align: left;
  background-color: #000;
}
.dcr-m30 a,
.dcr-m30 a:hover {
  position: relative;
  display: block;
  text-decoration: none;
}
.dcr-m30 .symbol {
  position: absolute;
  top: 50%;
  left: -4rem;
  margin-top: -0.65em;
  height: 1.25em;
  width: 2.5em;
  transition: transform 1250ms ease 250ms;
}
.dcr-m30 .weiter .symbol {
  left: auto;
  right: -4rem;
}
.dcr-m30 .symbol:before {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgNjQgMzgiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDY0IDM4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGw6I0ZGRkZGRjt9Cjwvc3R5bGU+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0wLDE5YzAsMC41LDAuMywxLjEsMC42LDEuNGwxNiwxN2MwLjcsMC44LDIsMC45LDIuOCwwLjFjMC44LTAuNywwLjgtMi4xLDAuMS0yLjhMNi42LDIxSDYyYzEuMSwwLDItMC45LDItMgoJcy0wLjktMi0yLTJINi42TDE5LjUsMy40YzAuNy0wLjgsMC43LTIuMS0wLjEtMi44Yy0wLjgtMC44LTIuMS0wLjctMi44LDAuMWwtMTYsMTdDMC4xLDE4LjEsMCwxOC41LDAsMTl6Ii8+Cjwvc3ZnPg==') no-repeat center center;
  background-size: 100%;
}
.dcr-m30 .weiter .symbol:before {
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgNjQgMzgiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDY0IDM4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGw6I0ZGRkZGRjtzdHJva2U6I0ZGRkZGRjtzdHJva2UtbWl0ZXJsaW1pdDoxMDt9Cjwvc3R5bGU+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik02NCwxOS4xYzAtMC41LTAuMy0xLjEtMC42LTEuNGwtMTYtMTdjLTAuNy0wLjgtMi0wLjktMi44LTAuMWMtMC44LDAuNy0wLjgsMi4xLTAuMSwyLjhsMTIuOSwxMy43SDIKCWMtMS4xLDAtMiwwLjktMiwyczAuOSwyLDIsMmg1NS40TDQ0LjUsMzQuN2MtMC43LDAuOC0wLjcsMi4xLDAuMSwyLjhjMC44LDAuOCwyLjEsMC43LDIuOC0wLjFsMTYtMTdDNjMuOSwyMCw2NCwxOS42LDY0LDE5LjF6Ii8+Cjwvc3ZnPg==') no-repeat center center;
}
.dcr-m30 p {
  font-weight: 300;
  text-transform: uppercase;
  margin-bottom: 1.5em;
  transition: transform 750ms ease 0ms;
}
.dcr-m30 h3 {
  font-size: 2.5em;
  line-height: 1.2em;
  margin-bottom: 0;
  transition: transform 750ms ease 250ms;
}
.dcr-m30 .zurueck:hover p,
.dcr-m30 .zurueck:hover h3 {
  transform: translateX(2rem);
}
.dcr-m30 .zurueck:hover .symbol {
  transform: translateX(6rem);
}
.dcr-m30 .weiter:hover p,
.dcr-m30 .weiter:hover h3 {
  transform: translateX(-2rem);
}
.dcr-m30 .weiter:hover .symbol {
  transform: translateX(-6rem);
}

@media only screen and  (min-width: 992px) {
  .dcr-m30 .container {
    flex-direction: row;
    flex-wrap: wrap;
  }
  .dcr-m30 .zurueck,
  .dcr-m30 .weiter {
    width: 50%;
    padding: 6em 4em;
  }
}











/* Flexbox-Tabelle */
.tabellarisch {
  display: block;
  margin: 2em auto;
  width: 100%;
}
.tabellarisch > .zeile {
  display: flex;
  flex-flow: row wrap;
  border: solid 1px #d9d9d9;
  border-top: none;
  transition: 0.5s;
}
.tabellarisch > .zeile:first-of-type {
  border-top: solid 1px #d9d9d9;
}
.tabellarisch > .zeile:nth-child(odd) {
  background: #f9f9f9;
}
.tabellarisch > .zeile:hover {
  background: #f2f2f2;
  transition: 300ms;
}
.tabellarisch > .kopfzeile {
  background: #e5e5e5 !important;
  font-weight: bold;
}
.tabellarisch > .zeile > div {
  text-align: center;
  padding: 0.5em 0.5em;
  border-right: solid 1px #d9d9d9;
}
.tabellarisch > .zeile > div:last-of-type {
  border-right: none;
}
.tabellarisch.zweispaltig > .zeile > div {
  width: calc(100% / 2);
}
.tabellarisch.dreispaltig > .zeile > div {
  width: calc(100% / 3);
}
.tabellarisch.vierspaltig > .zeile > div {
  width: calc(100% / 4);
}
.tabellarisch.fuenfspaltig > .zeile > div {
  width: calc(100% / 5);
}
.tabellarisch.sechsspaltig > .zeile > div {
  width: calc(100% / 6);
}
.tabellarisch.siebenspaltig > .zeile > div {
  width: calc(100% / 7);
}
.tabellarisch.achtspaltig > .zeile > div {
  width: calc(100% / 8);
}

@media only screen and (max-width: 767px) {
  .tabellarisch.dreispaltig > .zeile > div {
    width: calc(100% / 2);
  }
  .tabellarisch.vierspaltig > .zeile > div {
    width: calc(100% / 3);
  }
  .tabellarisch.fuenfspaltig > .zeile > div {
    width: calc(100% / 4);
  }
  .tabellarisch > .zeile > div:first-of-type {
    width: 100%;
    border-bottom: solid 1px #d9d9d9;
    border-right: none;
  }
}

@media all and (max-width: 430px) {
  .tabellarisch > .zeile {
    border-bottom: none;
  }
  .tabellarisch > .zeile > div {
    width: 100%;
    border-bottom: solid 1px #d9d9d9;
    border-right: none;
  }
  .tabellarisch > .zeile > div:first-of-type {
    width: 100%;
    border-bottom: solid 1px #d9d9d9;
  }
}






/* Tabelle mit table-Markup */
table {
  border-collapse: collapse;
  margin: 2em auto;
  width: 100%;
}
td {
  border: 1px solid #d9d9d9;
  padding: 0.5em;
  text-align: center;
}
th {
  padding: 0.5em;
  background: #e5e5e5;
  border: 1px solid #d9d9d9;
  text-align: center;
}
tbody tr:nth-child(even) {
  background: #f9f9f9;
}
tbody tr:hover {
  background: #f2f2f2;
  transition: 300ms;
}

@media only screen and (max-width: 767px) {
  th, td {
    width: auto;
    display: block;
    border: none;
  }
  th {
    border-left: solid 1px #d9d9d9;
    border-right: solid 1px #d9d9d9;
    border-bottom: solid 1px #d9d9d9;
  }
  td {
    border-left: solid 1px #d9d9d9;
    border-right: solid 1px #d9d9d9;
    border-bottom: solid 1px #d9d9d9;
  }
  th, td {
    width: 100%;
  }
}



/* 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;
}

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




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






.dashboard {
  display: flex;
  flex-wrap: wrap;
}

.dashbox {
  display: block;
  position: relative;
  width: 100%;
  max-width: 345px;
  margin: 2em;
  border: 1px solid #eee;
  box-shadow: 0 2px 20px rgb(0 0 0 / 20%);
}

.dashbox img {
  margin-bottom: 0.5em;
}

.dashbox h3 {
  margin: 0;
  padding: 0.25em 0.5em;
  line-height: 1.3em;
}

body:not(.editor) .dashbox a {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  text-decoration: none;
  text-indent: -1000px;
  overflow: hidden;
  background-color: rgba(255 255 255 / 0%);
  transition: background-color 250ms ease;
}

body:not(.editor) .dashbox a:hover {
  background-color: rgba(255 255 255 / 30%);
}




body.assets {
  background-color: #000;
}
body.assets .sektionen {
  color: #fff;
}
body.assets .am-image-wrapper {
  height: 220px;
}
body.assets .am-image {
  width: 100%;
  height: 100% !important;
  max-width: 100% !important;
  object-fit: cover;
}
body.assets .p-dashboard,
body.assets .p-dashboard-date {
  margin-bottom: 0;
}

body.assets #search_bar .bereichefeld {
}
body.assets #search_bar .suchfeld {
  margin-top: 10px;
}
body.assets #search_bar .sf {
  width: 100%;
  margin-top: 10px;
}

@media only screen and (min-width: 768px) {
  body.assets #search_bar .bereichefeld {
    display: inline-block;
    width: 200px;
  }
  body.assets #search_bar .suchfeld {
    display: inline-block;
    width: calc(100% - 430px);
    margin-top: 0;
  }
  body.assets #search_bar .sf {
    float: right;
    margin-top: -3px;
    width: 150px;
  }

}

body.assets select, body.assets .ts-wrapper {
  width: 98%;
  font-size: 16px;
  line-height: 20px;
}
body.assets .ts-control,
body.assets .ts-control, .ts-wrapper.single.input-active .ts-control,
body.assets .ts-wrapper.dropdown-active .ts-control,
body.assets .ts-dropdown {
  border-color: #fff;
  background-color: #000;
}
body.assets .ts-dropdown .optgroup-header {
  color: #666;
  background: #000;
}
body.assets .ts-control {
  min-height: 38px;
}
body.assets .bereichefeld .ts-wrapper .ts-control .item {
  align-self: center;
}

.asset-slider {
  margin-bottom: 2em;
}
.asset-slider .container.supradaten {
  display: none;
}








/* in Zwischenablage kopieren */
.clipboard {
  position: relative;
}
body:not(.editor) .clipboard {
  cursor: pointer;
}
.clipboard:after {
  position: absolute;
  display: block;
  content: "";
  width: 1.4em;
  height: 1.4em;
  top: 3px;
  right: 3px;
  background: center center / 100% no-repeat url("data:image/svg+xml,%3Csvg id='glyphicons-basic' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E %3Cpath fill='%23999999' id='clipboard' d='M22,18.5v1a.5.5,0,0,1-.5.5h-11a.5.5,0,0,1-.5-.5v-1a.5.5,0,0,1,.5-.5h11A.5.5,0,0,1,22,18.5ZM21.5,22h-11a.5.5,0,0,0-.5.5v1a.5.5,0,0,0,.5.5h11a.5.5,0,0,0,.5-.5v-1A.5.5,0,0,0,21.5,22Zm0-8h-11a.5.5,0,0,0-.5.5v1a.5.5,0,0,0,.5.5h11a.5.5,0,0,0,.5-.5v-1A.5.5,0,0,0,21.5,14ZM26,10V26a2.00229,2.00229,0,0,1-2,2H8a2.00229,2.00229,0,0,1-2-2V10A2.00229,2.00229,0,0,1,8,8h2V7a1,1,0,0,1,1-1h2a2.00006,2.00006,0,0,1,2-2h2a2.00006,2.00006,0,0,1,2,2h2a1,1,0,0,1,1,1V8h2A2.00229,2.00229,0,0,1,26,10ZM24.001,26,24,10H22v1a1,1,0,0,1-1,1H11a1,1,0,0,1-1-1V10H8V26Z'%3E%3C/path%3E %3C/svg%3E ");
}
.clipboard:hover:after {
  top: 2px;
}
.clipped {
	-webkit-animation: clipped 0.6s both;
	        animation: clipped 0.6s both;
}
@-webkit-keyframes clipped {
  0%,
  50%,
  100% {
    opacity: 1;
  }
  25%,
  75% {
    opacity: 0;
  }
}
@keyframes clipped {
  0%,
  50%,
  100% {
    opacity: 1;
  }
  25%,
  75% {
    opacity: 0;
  }
}








#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;
  }

}