@charset "UTF-8";
/** Farb-Thema */
/** Bildschirmbreiten für Media-Query */
/** Schriften */
@font-face {
  font-family: "BPreplay";
  src: url("../fonts/BPreplay-webfont.eot");
  src: url("../fonts/BPreplay-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/BPreplay-webfont.woff") format("woff"), url("../fonts/BPreplay-webfont.ttf") format("truetype"), url("../fonts/BPreplay-webfont.svg#BPreplayRegular") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "BPreplay";
  src: url("../fonts/BPreplayItalics-webfont.eot");
  src: url("../fonts/BPreplayItalics-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/BPreplayItalics-webfont.woff") format("woff"), url("../fonts/BPreplayItalics-webfont.ttf") format("truetype"), url("../fonts/BPreplayItalics-webfont.svg#BPreplayItalic") format("svg");
  font-weight: normal;
  font-style: italic;
}
@font-face {
  font-family: "BPreplay";
  src: url("../fonts/BPreplayBold-webfont.eot");
  src: url("../fonts/BPreplayBold-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/BPreplayBold-webfont.woff") format("woff"), url("../fonts/BPreplayBold-webfont.ttf") format("truetype"), url("../fonts/BPreplayBold-webfont.svg#BPreplayBold") format("svg");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: "BPreplay";
  src: url("../fonts/BPreplayBoldItalics-webfont.eot");
  src: url("../fonts/BPreplayBoldItalics-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/BPreplayBoldItalics-webfont.woff") format("woff"), url("../fonts/BPreplayBoldItalics-webfont.ttf") format("truetype"), url("../fonts/BPreplayBoldItalics-webfont.svg#BPreplayBoldItalic") format("svg");
  font-weight: bold;
  font-style: italic;
}
@font-face {
  font-family: "DroidSerif";
  src: url("../fonts/DroidSerif-Regular-webfont.eot");
  src: url("../fonts/DroidSerif-Regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/DroidSerif-Regular-webfont.woff") format("woff"), url("../fonts/DroidSerif-Regular-webfont.ttf") format("truetype"), url("../fonts/DroidSerif-Regular-webfont.svg#DroidSerifRegular") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "DroidSerif";
  src: url("../fonts/DroidSerif-Italic-webfont.eot");
  src: url("../fonts/DroidSerif-Italic-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/DroidSerif-Italic-webfont.woff") format("woff"), url("../fonts/DroidSerif-Italic-webfont.ttf") format("truetype"), url("../fonts/DroidSerif-Italic-webfont.svg#DroidSerifItalic") format("svg");
  font-weight: normal;
  font-style: italic;
}
@font-face {
  font-family: "DroidSerif";
  src: url("../fonts/DroidSerif-Bold-webfont.eot");
  src: url("../fonts/DroidSerif-Bold-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/DroidSerif-Bold-webfont.woff") format("woff"), url("../fonts/DroidSerif-Bold-webfont.ttf") format("truetype"), url("../fonts/DroidSerif-Bold-webfont.svg#DroidSerifBold") format("svg");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: "DroidSerif";
  src: url("../fonts/DroidSerif-BoldItalic-webfont.eot");
  src: url("../fonts/DroidSerif-BoldItalic-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/DroidSerif-BoldItalic-webfont.woff") format("woff"), url("../fonts/DroidSerif-BoldItalic-webfont.ttf") format("truetype"), url("../fonts/DroidSerif-BoldItalic-webfont.svg#DroidSerifBoldItalic") format("svg");
  font-weight: bold;
  font-style: italic;
}
@font-face {
  font-family: "symbols";
  src: url("../fonts/symbols.eot");
  src: url("../fonts/symbols.eot?#iefix") format("embedded-opentype"), url("../fonts/symbols.woff") format("woff"), url("../fonts/symbols.ttf") format("truetype"), url("../fonts/symbols.svg#symbols") format("svg");
  font-weight: normal;
  font-style: normal;
}
:root[data-layout=classic] {
  /** Browser-Reset *************************************************************/
  /** v1.0 | 20080212, s. http://meyerweb.com/eric/tools/css/reset/ */
}
:root[data-layout=classic] html, :root[data-layout=classic] body, :root[data-layout=classic] div, :root[data-layout=classic] span, :root[data-layout=classic] applet, :root[data-layout=classic] object, :root[data-layout=classic] iframe,
:root[data-layout=classic] h1, :root[data-layout=classic] h2, :root[data-layout=classic] h3, :root[data-layout=classic] h4, :root[data-layout=classic] h5, :root[data-layout=classic] h6, :root[data-layout=classic] p, :root[data-layout=classic] blockquote, :root[data-layout=classic] pre,
:root[data-layout=classic] a, :root[data-layout=classic] abbr, :root[data-layout=classic] acronym, :root[data-layout=classic] address, :root[data-layout=classic] big, :root[data-layout=classic] cite, :root[data-layout=classic] code,
:root[data-layout=classic] del, :root[data-layout=classic] dfn, :root[data-layout=classic] em, :root[data-layout=classic] font, :root[data-layout=classic] img, :root[data-layout=classic] ins, :root[data-layout=classic] kbd, :root[data-layout=classic] q, :root[data-layout=classic] s, :root[data-layout=classic] samp,
:root[data-layout=classic] small, :root[data-layout=classic] strike, :root[data-layout=classic] strong, :root[data-layout=classic] sub, :root[data-layout=classic] sup, :root[data-layout=classic] tt, :root[data-layout=classic] var,
:root[data-layout=classic] b, :root[data-layout=classic] u, :root[data-layout=classic] i, :root[data-layout=classic] center,
:root[data-layout=classic] dl, :root[data-layout=classic] dt, :root[data-layout=classic] dd, :root[data-layout=classic] ol, :root[data-layout=classic] ul, :root[data-layout=classic] li,
:root[data-layout=classic] fieldset, :root[data-layout=classic] form, :root[data-layout=classic] label, :root[data-layout=classic] legend,
:root[data-layout=classic] table, :root[data-layout=classic] caption, :root[data-layout=classic] tbody, :root[data-layout=classic] tfoot, :root[data-layout=classic] thead, :root[data-layout=classic] tr, :root[data-layout=classic] th, :root[data-layout=classic] td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
:root[data-layout=classic] body {
  line-height: 1;
}
:root[data-layout=classic] ol, :root[data-layout=classic] ul {
  list-style: none;
}
:root[data-layout=classic] blockquote, :root[data-layout=classic] q {
  quotes: none;
}
:root[data-layout=classic] blockquote:before, :root[data-layout=classic] blockquote:after,
:root[data-layout=classic] q:before, :root[data-layout=classic] q:after {
  content: "";
  content: none;
}
:root[data-layout=classic] {
  /* remember to define focus styles! */
}
:root[data-layout=classic] :focus {
  outline: 0;
}
:root[data-layout=classic] {
  /* remember to highlight inserts somehow! */
}
:root[data-layout=classic] ins {
  text-decoration: none;
}
:root[data-layout=classic] del {
  text-decoration: line-through;
}
:root[data-layout=classic] {
  /* tables still need 'cellspacing="0"' in the markup */
}
:root[data-layout=classic] table {
  border-collapse: collapse;
  border-spacing: 0;
}
:root[data-layout=classic] {
  /** Eigene Reset-Erweiterungen */
}
:root[data-layout=classic] a {
  color: inherit;
  text-decoration: none;
}
:root[data-layout=classic] hr {
  padding: 0;
  margin: 0;
}
:root[data-layout=classic] {
  /** Allgemein nützliche Marker-Klassen */
  /** Micro Clearfix-Hack nach http://nicolasgallagher.com/micro-clearfix-hack/ */
}
:root[data-layout=classic] .cf:before,
:root[data-layout=classic] .cf:after {
  content: "";
  display: table;
}
:root[data-layout=classic] .cf:after {
  clear: both;
}
:root[data-layout=classic] {
  /** Hide helpful content in a way, that it is still accessible to screen-readers */
}
:root[data-layout=classic] .hide {
  position: absolute;
  left: -99999999em;
}
:root[data-layout=classic] {
  /** Symbol-Font für Vektor-Icons */
}
:root[data-layout=classic] .symbols {
  font-family: "symbols";
}
:root[data-layout=classic] a.img {
  border: none;
}
:root[data-layout=classic] {
  /** Typografische Grundeinstellungen ******************************************/
}
:root[data-layout=classic] body {
  font-family: "DroidSerif", "Times New Roman", "Palatino Linotype", serif;
  letter-spacing: 0;
  line-height: 1.5em;
  padding: 0 1em 1em 1.5em;
  background-color: #FFF;
}
:root[data-layout=classic] h1, :root[data-layout=classic] h2, :root[data-layout=classic] h3, :root[data-layout=classic] h4, :root[data-layout=classic] h5, :root[data-layout=classic] h6 {
  font-family: "BPreplay", Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: rgb(114.75, 114.75, 114.75);
  line-height: 1.25em;
  margin: 1.125em 0 0.25em 0; /** Im Desktop-Layout wird margin-top für article#content h1 in screen/content.scss auf 0 gesetzt */
}
:root[data-layout=classic] h1 {
  font-size: 137.5%; /** 22 px */
  color: #0ACF00;
  padding: 0 0 0.25em 0; /** 0 0 5px 0 */
}
:root[data-layout=classic] h2 {
  font-size: 125%; /** 20 px */
}
:root[data-layout=classic] h3 {
  font-size: 112.5%; /** 18px */
}
:root[data-layout=classic] h4 {
  /** font-size: 16px */
}
:root[data-layout=classic] h1 a, :root[data-layout=classic] h2 a, :root[data-layout=classic] h3 a, :root[data-layout=classic] h4 a {
  color: #0ACF00;
  border-style: none;
}
:root[data-layout=classic] h1 a:hover,
:root[data-layout=classic] h2 a:hover,
:root[data-layout=classic] h3 a:hover,
:root[data-layout=classic] h4 a:hover {
  color: #078600;
  border-bottom: 1px solid #078600;
}
:root[data-layout=classic] h1 a:focus,
:root[data-layout=classic] h2 a:focus,
:root[data-layout=classic] h3 a:focus,
:root[data-layout=classic] h4 a:focus,
:root[data-layout=classic] h1 a:active,
:root[data-layout=classic] h2 a:active,
:root[data-layout=classic] h3 a:active,
:root[data-layout=classic] h4 a:active {
  color: #2D9B27;
  border-bottom: 1px solid #2D9B27;
}
:root[data-layout=classic] p {
  margin: 0.5em 0 0.5em 0;
}
:root[data-layout=classic] ul, :root[data-layout=classic] ol {
  margin: 0.25em 0 0.25em 0; /** 4px 0 4px 0 */
  padding: 0 0 0 1em; /** 0 0 0 16px */
}
:root[data-layout=classic] ul {
  list-style-type: square;
}
:root[data-layout=classic] ol {
  list-style-type: decimal;
  padding-left: 1.1875em; /** 19px */
}
:root[data-layout=classic] li {
  padding-bottom: 0.25em; /** 2px */
}
:root[data-layout=classic] table, :root[data-layout=classic] th, :root[data-layout=classic] td {
  padding: 0.1em 0.2em;
}
:root[data-layout=classic] th, :root[data-layout=classic] td {
  font-size: 87.5%; /** 14px */
  line-height: 1.5em; /** 20px */
  border: 0.071428571em solid #000; /** 1px */
  padding: 0.214285714em 0.5em; /** 3px 7px */
}
:root[data-layout=classic] pre {
  line-height: 1.2em;
}
:root[data-layout=classic] code {
  font-size: 120%; /** Otherwise, the font-size will be 75%, though not specified so anywhere!! */
  line-height: 1.2em;
}
:root[data-layout=classic] pre code {
  font-size: 100%; /** Reset: inside pre, the parent already controls the size */
}
:root[data-layout=classic] :not(pre) > code {
  background-color: #CEF7C8;
  padding: 0.1em 0.3em;
  border-radius: 0.2em;
}
:root[data-layout=classic] pre.astro-code,
:root[data-layout=classic] pre.shiki {
  padding: 0.5em 1em;
  border-radius: 0.25em;
  overflow-x: auto;
}
:root[data-layout=classic] pre.astro-code code,
:root[data-layout=classic] pre.shiki code {
  counter-reset: line;
}
:root[data-layout=classic] pre.astro-code code .line::before,
:root[data-layout=classic] pre.shiki code .line::before {
  counter-increment: line;
  content: counter(line);
  display: inline-block;
  width: 2ch;
  margin-right: 1.5em;
  text-align: right;
  color: rgba(255, 255, 255, 0.3);
  user-select: none;
}
:root[data-layout=classic] hr {
  border: none;
  border-top: 2px solid #0ACF00;
  background-color: #0ACF00;
  height: 1px;
  margin: 1em 0 1em 0;
}
:root[data-layout=classic] a {
  color: #078600;
  border-bottom: 1px dashed #078600;
}
:root[data-layout=classic] a:hover {
  color: #077600;
  border-bottom: 1px solid #077600;
}
:root[data-layout=classic] a:focus,
:root[data-layout=classic] a:active {
  color: #078600;
  border-bottom: 1px solid #078600;
}
:root[data-layout=classic] a:visited {
  border-bottom: 1px dotted #077600;
}
:root[data-layout=classic] h2 a,
:root[data-layout=classic] h3 a,
:root[data-layout=classic] h4 a {
  color: rgb(114.75, 114.75, 114.75);
}
:root[data-layout=classic] h2 a:focus,
:root[data-layout=classic] h2 a:active,
:root[data-layout=classic] h3 a:focus,
:root[data-layout=classic] h3 a:active,
:root[data-layout=classic] h4 a:focus,
:root[data-layout=classic] h4 a:active {
  color: #0ACF00;
  border-bottom: 1px solid #0ACF00;
}
:root[data-layout=classic] .logo {
  font-family: "BPreplay", Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #0ACF00;
}
:root[data-layout=classic] #header {
  font-family: "BPreplay", Helvetica, Arial, sans-serif;
  font-weight: bold;
}
:root[data-layout=classic] #logo {
  position: relative;
  display: inline-block;
  font-size: 100%; /* Um das Rechnen einfacher zu gestalten */
  margin: 0;
  padding: 0 0 0 0.1875em; /* 30px */
  color: #0ACF00;
  border: none;
  position: relative;
  top: 0.5em;
  left: -0.875em;
}
:root[data-layout=classic] #logo a.l:hover {
  color: #078600;
  border-style: none;
}
:root[data-layout=classic] #logo > .l > img.l {
  width: 6.25em; /** 100px */
}
:root[data-layout=classic] #slogan {
  color: #0ACF00;
}
:root[data-layout=classic] #menu,
:root[data-layout=classic] #submenu {
  font-family: "BPreplay", Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #0ACF00;
  margin: 0.5em 0 1.5em 0;
  padding: 0.25em 0.25em 0.25em 1.5em;
  border: 1px solid #0ACF00;
}
:root[data-layout=classic] #menu li.m,
:root[data-layout=classic] #submenu li.s {
  padding: 0.2em;
}
:root[data-layout=classic] #menu li.m a.m,
:root[data-layout=classic] #submenu li.s a.s {
  color: #0ACF00;
}
:root[data-layout=classic] #menu li.m a.m:hover,
:root[data-layout=classic] #submenu li.s a.s:hover {
  color: #077600;
}
:root[data-layout=classic] #menu li.m strong.m,
:root[data-layout=classic] #menu li.m a.m.selected,
:root[data-layout=classic] #menu li.m a.m:focus,
:root[data-layout=classic] #menu li.m a.m:active,
:root[data-layout=classic] #submenu li.s strong.s,
:root[data-layout=classic] #submenu li.s a.s.selected,
:root[data-layout=classic] #submenu li.s a.s:focus,
:root[data-layout=classic] #submenu li.s a.s:active {
  color: #078600;
}
:root[data-layout=classic] .alias-hint {
  display: none;
}
:root[data-layout=classic] .version-hint {
  display: none;
}
:root[data-layout=classic] #breadcrumb {
  font-family: "BPreplay", Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #0ACF00;
}
:root[data-layout=classic] #breadcrumb strong.b.title {
  float: left;
  margin: 0 0.5em 0 0;
}
:root[data-layout=classic] #breadcrumb ol.b {
  display: inline;
  margin: 0;
  padding: 0;
  list-style-type: none;
}
:root[data-layout=classic] #breadcrumb ol.b li.b {
  float: left;
  margin: 0 0 0.5em 0.5em;
  padding: 0;
}
:root[data-layout=classic] #breadcrumb ol.b li.b:before {
  content: "> ";
}
:root[data-layout=classic] #breadcrumb ol.b li.b:first-child:before {
  content: "";
}
:root[data-layout=classic] #breadcrumb ol.b li.b strong.b {
  border-bottom: 1px solid #0ACF00;
}
:root[data-layout=classic] #breadcrumb ol.b li.b a.b {
  color: #0ACF00;
}
:root[data-layout=classic] #breadcrumb ol.b li.b a.b:hover,
:root[data-layout=classic] #breadcrumb ol.b li.b a.b:focus,
:root[data-layout=classic] #breadcrumb ol.b li.b a.b:active {
  color: #078600;
}
:root[data-layout=classic] #breadcrumb a.hide {
  position: static;
}
:root[data-layout=classic] #breadcrumb a.hide:before {
  content: "";
  display: table;
  clear: both;
}
:root[data-layout=classic] #breadcrumb hr.b {
  clear: both;
}
:root[data-layout=classic] {
  /** LEER */
}
:root[data-layout=classic] .marginal h1 {
  font-size: 125%; /** 20 px */
  line-height: 1em; /** 20px */
  margin: 1.5em 0 0.5em 0; /** 30px 0 10px 0 */
  padding: 0;
}
:root[data-layout=classic] .content > .marginal {
  display: flex;
  flex-direction: column;
}
:root[data-layout=classic] .content > .marginal > #nav {
  order: -1;
}
:root[data-layout=classic] #footerlinks {
  font-family: "BPreplay", Helvetica, Arial, sans-serif;
  font-weight: bold;
  position: relative;
  margin: 0;
  padding: 0;
  list-style-type: none;
}
:root[data-layout=classic] #footerlinks li.f {
  font-size: 137.5%; /** 22 px */
  float: left;
  margin: 0.5em 1em 0 0;
}
:root[data-layout=classic] #footerlinks #copyright {
  color: #000;
  margin: 0;
  width: 100%;
}
:root[data-layout=classic] #footerlinks a.f {
  color: #0ACF00;
  border-color: #0ACF00;
}
:root[data-layout=classic] #footerlinks a.f:hover {
  color: #078600;
  border-color: #078600;
  border-style: solid;
}
:root[data-layout=classic] #footer-layouts {
  display: contents;
}
:root[data-layout=classic] .footer-heading,
:root[data-layout=classic] hr.footer-section-divider {
  display: none;
}
:root[data-layout=classic] {
  /* float: right + margin-top replicate the old #layout-switcher positioning:
     1.25em border-top (screen/footer.scss) + 0.5em * 1.375 (font-size) = 1.9375em */
}
:root[data-layout=classic] .footer-layouts-inner {
  float: right;
  list-style: none;
  margin: 1.9375em 0 0 0;
  padding: 0;
}
:root[data-layout=classic] #footer-legal {
  display: contents;
}
:root[data-layout=classic] #layout-switcher {
  font-family: "BPreplay", Helvetica, Arial, sans-serif;
  font-weight: bold;
  /* float + position:relative + z-index: stacks above #footerlinks (position:relative, no z-index) */
  position: relative;
  z-index: 1;
  color: rgb(178.5, 178.5, 178.5);
}
:root[data-layout=classic] #layout-switcher .layout-option {
  display: inline;
  font-size: 137.5%;
}
:root[data-layout=classic] #layout-switcher .layout-option + .layout-option::before {
  content: " | ";
  color: rgb(178.5, 178.5, 178.5);
}
:root[data-layout=classic] #layout-switcher button {
  background: none;
  border: none;
  border-bottom: 1px dashed rgb(178.5, 178.5, 178.5);
  padding: 0;
  font: inherit;
  cursor: pointer;
  color: rgb(178.5, 178.5, 178.5);
}
:root[data-layout=classic] #layout-switcher button:hover {
  color: #078600;
  border-bottom: 1px solid #078600;
}
:root[data-layout=classic] #layout-switcher button.active {
  color: rgb(114.75, 114.75, 114.75);
  border-bottom: none;
  pointer-events: none;
  cursor: default;
}
:root[data-layout=classic] {
  /** Formulare *****************************************************************/
}
:root[data-layout=classic] .form {
  position: relative;
  width: 100%;
  overflow: hidden;
}
:root[data-layout=classic] {
  /** Trennlinie */
}
:root[data-layout=classic] .form hr.f {
  border-style: none;
  border-top-style: dashed;
  border-color: #0ACF00;
  border-width: 0.0625em;
  margin: 0.625em 0; /** 10px 0 */
  background-color: transparent;
}
:root[data-layout=classic] {
  /** Text im Formular */
}
:root[data-layout=classic] .form p.f {
  color: rgb(114.75, 114.75, 114.75);
}
:root[data-layout=classic] .form p.f,
:root[data-layout=classic] .form .radiobutton > legend.f,
:root[data-layout=classic] .form .checkbox > legend.f,
:root[data-layout=classic] .form .textarea > label.f {
  display: block;
  font-size: 87.5%; /** 14px */
  line-height: 1.5em; /** 21px */
  color: rgb(114.75, 114.75, 114.75);
  margin: 0.428571429em 0; /** 6px 0 */
}
:root[data-layout=classic] {
  /** Aufzählungen im Formular */
}
:root[data-layout=classic] .form ul.f,
:root[data-layout=classic] .form ol.f {
  color: rgb(114.75, 114.75, 114.75);
  margin: 1em 0;
}
:root[data-layout=classic] {
  /** Info-Text */
}
:root[data-layout=classic] .form p.f.info,
:root[data-layout=classic] .form .textarea > label.f.info,
:root[data-layout=classic] .form .radiobutton > legend.f.info,
:root[data-layout=classic] .form .checkbox > legend.f.info,
:root[data-layout=classic] .form .textarea > label.f.info {
  display: block;
  font-size: 81.25%; /** 13px */
  line-height: 1.230769231em; /** 16px */
  font-style: italic;
  color: rgb(114.75, 114.75, 114.75);
  padding: 0 0 0 1.538461538em; /** 0 0 0 20px */
  background-image: url(../img/em.png);
  background-repeat: no-repeat;
  background-position: 0 1px;
  margin-top: 0.461538462em; /** 6px */
  margin-bottom: 0.461538462em; /** 6px */
}
:root[data-layout=classic] .form .info > a {
  display: inline-block;
}
:root[data-layout=classic] {
  /** Überschriften */
}
:root[data-layout=classic] .form h1.f {
  font-size: 137.5%; /** 22px */
  letter-spacing: 0.0454545em; /** 1px */
  line-height: 1em;
  padding: 0 0 0.454545455em; /** 0 0 10px */
  border-bottom: 0.090909091em solid #0ACF00; /** 2px */
  margin: 0.272727273em 0 0.909090909em 0; /** 6px 0 20px 0 */
}
:root[data-layout=classic] .form h2.f {
  font-size: 100%; /** 16px */
  letter-spacing: 0.0625em; /** 1px */
  text-transform: uppercase;
  line-height: 1.625em; /** 26px */
  padding: 0 0 0 0.125em; /** 0 0 0 2px */
  border-bottom: 0.0625em solid #0ACF00; /** 1px */
  margin: 1.875em 0 0.25em 0; /** 30px 0 4px 0 */
}
:root[data-layout=classic] .form h3.f {
  /**  border-bottom: 1px dashed $normal; */
}
:root[data-layout=classic] .form p.required {
  text-indent: -999em;
  margin: -1.785714286em 0 0 0; /** -25px 0 0 0 zu 14px */
}
:root[data-layout=classic] .form p.required > strong.r {
  display: block;
  float: right;
  position: relative;
  right: -994em;
  margin-right: 1em; /** 14px */
  font-weight: normal;
}
:root[data-layout=classic] .form p.required > strong.symbol {
  font-size: 128.5714286%; /** 18px zu 14px */
  margin-right: 0.555555em; /** 10px */
  padding-top: 0.1666666em; /** 3px */
  right: -773.11em; /** Anpassung wegen abweichender Schriftgröße nötig: 994em * 14px / 18px */
  font-weight: 700;
  color: #2D9B27;
}
:root[data-layout=classic] {
  /** Fehler-Hinweise */
}
:root[data-layout=classic] .f.error {
  color: #e60000;
}
:root[data-layout=classic] span.f.error {
  display: block;
  position: relative;
  font-size: 87.5%; /** 14px */
  line-height: 1.214285714em; /** 17px */
  padding: 0.571428571em; /** 8px */
  color: #FFF;
  background-color: #e60000;
  margin: 0.857142857em 0 0 0; /** 12px 0 0 0 */
}
:root[data-layout=classic] span.f.error > span.e {
  display: block;
  width: 0.857142857em; /** 12px */
  height: 0.428571429em; /** 6px */
  background-image: url(../img/arrow-red.gif);
  text-indent: -9999em;
  position: absolute;
  top: -0.428571429em; /** -6px */
  left: 2.142857143em; /** 30px */
}
:root[data-layout=classic] span.f.error > strong.e {
  text-transform: uppercase;
}
:root[data-layout=classic] {
  /** Input, Select und Dateiupload mit Label */
}
:root[data-layout=classic] .form .text,
:root[data-layout=classic] .form .select,
:root[data-layout=classic] .form .file {
  position: relative;
  margin-bottom: 0.75em; /** 12px */
}
:root[data-layout=classic] .form .text,
:root[data-layout=classic] .form .file {
  margin-right: 10em; /** 160px */
}
:root[data-layout=classic] .form .select {
  margin-right: 9em; /** 144px */
}
:root[data-layout=classic] h2.f + div.text,
:root[data-layout=classic] h2.f + div.select,
:root[data-layout=classic] h2.f + div.file,
:root[data-layout=classic] h2.f + div.captcha,
:root[data-layout=classic] p.f + div.text,
:root[data-layout=classic] p.f + div.select,
:root[data-layout=classic] p.f + div.file {
  margin-top: 20px;
}
:root[data-layout=classic] .form .text > label.f,
:root[data-layout=classic] .form .textarea > label.f,
:root[data-layout=classic] .form .select > label.f,
:root[data-layout=classic] .form .file > label.f,
:root[data-layout=classic] .form .captcha > span.f {
  display: block;
  position: relative;
  font-size: 87.5%; /** 14px */
  line-height: 1.214285714em; /** 17px */
  padding: 0.571428571em 0 0.571428571em 0; /** 8px 0 8px 0 */
  color: #000;
}
:root[data-layout=classic] .form .file > label.f {
  padding-top: 0.285714286em; /** 4px */
  padding-bottom: 0.285714286em; /** 4px */
}
:root[data-layout=classic] .form .captcha > span.f {
  position: absolute;
}
:root[data-layout=classic] .form .required > label.f {
  padding-left: 1em; /** 14px */
}
:root[data-layout=classic] .form .required > label.f > .required {
  display: block;
  position: absolute;
  font-size: 128.5714286%; /** 18px zu 14px */
  font-weight: 700;
  color: #2D9B27;
  top: 0.611111111em; /** 11px */
  left: 0;
}
:root[data-layout=classic] .form .file > label.f > .required {
  top: 0.5em; /** 7px */
}
:root[data-layout=classic] .form .text > input.f,
:root[data-layout=classic] .form .select > select.f,
:root[data-layout=classic] .form .file > input.f {
  display: block;
  width: 100%;
  position: absolute;
  top: 0;
  font-size: 81.25%; /** 13px */
  border: 0.076923077em solid #0ACF00; /** 1px */
  color: #000;
  background-color: #CEF7C8;
}
:root[data-layout=classic] .form .text > input.f {
  line-height: 1.307692308em; /** 17px */
  padding: 0.538461538em; /** 7px */
  right: -12.307692308em; /** -160px */
}
:root[data-layout=classic] .form .select > select.f {
  line-height: 1.230769231em; /** 16px */
  padding: 0.461538462em 0.538461538em; /** 6px 7px */
  right: -11.076923077em; /** -144px */
}
:root[data-layout=classic] .form .file > input.f {
  margin-left: 11.076923077em; /** 144px */
}
:root[data-layout=classic] .form .captcha > img.f {
  float: right;
  margin-top: -0.9375em; /** 15px */
  width: 7.5em; /** 120px */
  height: 3.75em; /** 60px */
}
:root[data-layout=classic] .form .text > input.f:focus,
:root[data-layout=classic] .form .select > select.f:focus,
:root[data-layout=classic] .form .text > input.f:active,
:root[data-layout=classic] .form .select > select.f:active {
  background-color: transparent;
}
:root[data-layout=classic] .form .text > p.f.info,
:root[data-layout=classic] .form .select > p.f.info,
:root[data-layout=classic] .form .file > p.f.info {
  position: relative;
  left: 11.076923077em; /** 144px */
}
:root[data-layout=classic] .form .text > span.f.error,
:root[data-layout=classic] .form .select > span.f.error,
:root[data-layout=classic] .form .file > span.f.error {
  width: 100%;
  margin: 0.857142857em 0 0 10.285714286em; /** 12px 0 0 144px zu 14(!)px*/
}
:root[data-layout=classic] {
  /** Textfelder */
}
:root[data-layout=classic] .form .textarea {
  position: relative;
  margin: 0 0.6875em 0.75em 0.6875em; /** 0px 11px 12px 11px */
}
:root[data-layout=classic] .form .textarea > label.f {
  margin: 0.615384615em -0.846153846em; /** 8px -11px */
}
:root[data-layout=classic] .form .textarea > textarea.f,
:root[data-layout=classic] .form .textarea > div.textarea {
  width: 100%;
  border: 0.076923077em solid #0ACF00; /** 1px */
  color: #000;
  background-color: #CEF7C8;
  padding: 0.769230769em; /** 10px */
  position: relative;
  left: -0.846153846em; /** -11px */
}
:root[data-layout=classic] .form .textarea > div.textarea {
  margin: 0;
  font-size: 87.5%; /** 14px */
}
:root[data-layout=classic] .form .textarea > textarea.f:focus,
:root[data-layout=classic] .form .textarea > textarea.f:active {
  background-color: transparent;
}
:root[data-layout=classic] .form .textarea > span.f.error {
  margin: 0.714285714em -0.785714286em 0 -0.785714286em; /** 10px -11px 0 -11px */
}
:root[data-layout=classic] {
  /** Radiobuttons und Checkboxen */
}
:root[data-layout=classic] .form .radiobutton > legend.f.info,
:root[data-layout=classic] .form .checkbox > legend.f.info {
  padding: 0.230769231em 0 0 1.538461538em; /** 3px 0 0 20px zu 13px*/
  background-position: 0 0.230769231em; /** 0 3px */
}
:root[data-layout=classic] .form .col2,
:root[data-layout=classic] .form .radiobutton > .col2,
:root[data-layout=classic] .form .checkbox > .col2 {
  width: 48%;
  float: left;
}
:root[data-layout=classic] .form .col2.left,
:root[data-layout=classic] .form .radiobutton > .col2.left,
:root[data-layout=classic] .form .checkbox > .col2.left {
  margin-right: 2%;
}
:root[data-layout=classic] .form .col2.right,
:root[data-layout=classic] .form .radiobutton > .col2.right,
:root[data-layout=classic] .form .checkbox > .col2.right {
  float: right;
  margin-left: 2%;
}
:root[data-layout=classic] .form div.checkbox,
:root[data-layout=classic] .form .radiobutton > .f,
:root[data-layout=classic] .form .checkbox > .f,
:root[data-layout=classic] .form .radiobutton > .col2 > .f,
:root[data-layout=classic] .form .checkbox > .col2 > .f {
  position: relative;
}
:root[data-layout=classic] .form div.checkbox > label.f,
:root[data-layout=classic] .form .radiobutton > .f > label.f,
:root[data-layout=classic] .form .checkbox > .f > label.f,
:root[data-layout=classic] .form .radiobutton > .col2 > .f > label.f,
:root[data-layout=classic] .form .checkbox > .col2 > .f > label.f {
  display: block;
  font-size: 87.5%; /** 14px */
  line-height: 1.285714286em; /** 18px */
  color: #000;
  margin: 0.571428571em 0 0.571428571em 1.428571429em; /** 8px 0 8px 20px */
}
:root[data-layout=classic] .form div.checkbox > input.f,
:root[data-layout=classic] .form .radiobutton > .f > input.f,
:root[data-layout=classic] .form .checkbox > .f > input.f,
:root[data-layout=classic] .form .radiobutton > .col2 > .f > input.f,
:root[data-layout=classic] .form .checkbox > .col2 > .f > input.f {
  position: absolute;
  margin: 0.285714286em 0; /** 4px 0 */
}
:root[data-layout=classic] .form div.checkbox > input.error,
:root[data-layout=classic] .form .radiobutton > .f > input.error,
:root[data-layout=classic] .form .checkbox > .f > input.error {
  /** Wäre möglich -- konnte aber keine CSS-Eigenschaft finden, die sich rot färben ließ: der Firefox hat alles ignoriert! */
}
:root[data-layout=classic] .form div.checkbox:hover > label.f,
:root[data-layout=classic] .form .radiobutton > .f:hover > label.f,
:root[data-layout=classic] .form .checkbox > .f:hover > label.f,
:root[data-layout=classic] .form div.checkbox:focus > label.f,
:root[data-layout=classic] .form .radiobutton > .f:focus > label.f,
:root[data-layout=classic] .form .checkbox > .f:focus > label.f,
:root[data-layout=classic] .form div.checkbox:active > label.f,
:root[data-layout=classic] .form .radiobutton > .f:active > label.f,
:root[data-layout=classic] .form .checkbox > .f:active > label.f,
:root[data-layout=classic] .form .radiobutton > .col2 > .f:hover > label.f,
:root[data-layout=classic] .form .checkbox > .col2 > .f:hover > label.f,
:root[data-layout=classic] .form .radiobutton > .col2 > .f:focus > label.f,
:root[data-layout=classic] .form .checkbox > .col2 > .f:focus > label.f,
:root[data-layout=classic] .form .radiobutton > .col2 > .f:active > label.f,
:root[data-layout=classic] .form .checkbox > .col2 > .f:active > label.f {
  color: #000;
}
:root[data-layout=classic] {
  /** Sondereinstellungen für Fehler-Hervorhebungen */
}
:root[data-layout=classic] .form .text > input.error,
:root[data-layout=classic] .form .textarea > textarea.error,
:root[data-layout=classic] .form .select > select.error,
:root[data-layout=classic] .form .file > input.error {
  color: #000;
  font-weight: 700;
  border-color: #e60000;
  background-color: white;
}
:root[data-layout=classic] {
  /** Absende-Buttons */
}
:root[data-layout=classic] ul.buttons,
:root[data-layout=classic] ol.buttons {
  margin: 0;
  padding: 0;
  list-style-type: none;
  text-align: right;
}
:root[data-layout=classic] ul.buttons > li.b,
:root[data-layout=classic] ol.buttons > li.b {
  display: inline-block;
  margin: 0;
  padding: 0;
}
:root[data-layout=classic] .form .submit {
  text-align: right;
  margin-bottom: 0.75em; /** 12px */
}
:root[data-layout=classic] .form .submit > input.f,
:root[data-layout=classic] .form .submit > a.f,
:root[data-layout=classic] a.ln.button {
  display: inline-block;
  font-family: "PT Sans", Helvetica, Arial, sans-serif;
  font-size: 81.25%; /** 13px */
  letter-spacing: 0.076923077em; /** 1px */
  line-height: 25px;
  padding: 0 6px;
  height: 1.923076923em; /** 25px */
  color: #FFF;
  font-weight: 700;
  background-color: #0ACF00;
  border-style: none;
}
:root[data-layout=classic] .form .submit > input.f,
:root[data-layout=classic] .form .submit > a.f,
:root[data-layout=classic] ul.buttons > li.b,
:root[data-layout=classic] ol.buttons > li.b {
  margin: 0 0 0 0.615384615em; /** 0 0 0 8px */
}
:root[data-layout=classic] a.ln.button:before {
  content: none;
}
:root[data-layout=classic] .form .submit > input.left,
:root[data-layout=classic] .form .submit > a.left,
:root[data-layout=classic] a.ln.button.left {
  float: left;
  margin: 0 0.923076923em 0 0; /** 0 12px 0 0 */
}
:root[data-layout=classic] .form .submit > input.right,
:root[data-layout=classic] .form .submit > a.right,
:root[data-layout=classic] a.ln.button.right {
  float: right;
  margin: 0 0 0 0.923076923em; /** 0 0 0 12px */
}
:root[data-layout=classic] .form .submit > input.f:hover,
:root[data-layout=classic] .form .submit > a.f:hover,
:root[data-layout=classic] a.ln.button:hover,
:root[data-layout=classic] .form .submit > input.f:focus,
:root[data-layout=classic] .form .submit > a.f:focus,
:root[data-layout=classic] a.ln.button:focus,
:root[data-layout=classic] .form .submit > a.f:active,
:root[data-layout=classic] .form .submit > input.f:active,
:root[data-layout=classic] a.ln.button:active {
  background-color: #2D9B27;
  text-decoration: none;
}
:root[data-layout=classic] ul.t {
  margin: 2em 0 0 0;
  padding: 0;
}
:root[data-layout=classic] ul.t > li {
  display: inline-block;
  margin: 0 0.8em 0.8em 0;
  font-weight: 500;
}
:root[data-layout=classic] ul.t > li > a {
  font-family: "BPreplay", Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 1.2em;
  display: block;
  border: none;
  transition: transform 0.1s;
  color: #FFF;
}
:root[data-layout=classic] ul.t > li > a:hover,
:root[data-layout=classic] ul.t > li > a:active {
  transform: scale(0.96);
}
:root[data-layout=classic] ul.t > li > a > span.title {
  display: inline-block;
  padding: 3px 10px;
  background-color: #42E73A;
  border-radius: 6px 0 0 6px;
}
:root[data-layout=classic] ul.t > li > a > span.sep {
  display: none;
}
:root[data-layout=classic] ul.t > li > a > span.count {
  display: inline-block;
  padding: 3px 10px;
  margin: 0 0 0 1px;
  background-color: #0ACF00;
  border-radius: 0 6px 6px 0;
}
:root[data-layout=classic] ul.t > li > a:hover > span.title,
:root[data-layout=classic] ul.t > li > a:active > span.title {
  background-color: #0ACF00;
}
:root[data-layout=classic] .withbackground .content > .marginal > #nav {
  z-index: 2;
}
:root[data-layout=classic] .withbackground .content > .main {
  display: block;
}
:root[data-layout=classic] .withbackground .content > .main > * {
  position: relative;
  z-index: 3;
}
:root[data-layout=classic] #footer {
  z-index: 3;
}
:root[data-layout=classic] .withbackground .content > .main > .background {
  font-family: "BPreplay", Helvetica, Arial, sans-serif;
  font-weight: bold;
  display: block;
  position: absolute;
  z-index: 1;
  line-height: 0.8em;
  height: 0.8em;
  overflow: hidden;
}
:root[data-layout=classic] .withbackground .content > .main > .heller {
  color: #6EE768;
  z-index: 2;
}
:root[data-layout=classic] .withbackground .content > .main > .sehrhell {
  color: #CEF7C8;
  text-shadow: 0.02em 0.01em 0 #FFF;
}
:root[data-layout=classic] #bs1 {
  font-size: 2000%;
  top: 55%;
  left: 11%;
}
:root[data-layout=classic] #bs2 {
  font-size: 2600%;
  top: 30%;
  right: -1%;
}
:root[data-layout=classic] #bs3 {
  font-size: 5000%;
  top: -5%;
  right: -5%;
}
:root[data-layout=classic] #bs4 {
  font-size: 600%;
  top: 0;
  left: 50%;
}
:root[data-layout=classic] #bs5 {
  font-size: 3600%;
  top: 13%;
  left: 35%;
}
:root[data-layout=classic] #bs6 {
  font-size: 2000%;
  top: 0%;
  left: 23%;
}
:root[data-layout=classic] #bs7 {
  font-size: 600%;
  top: 72%;
  left: 5%;
}
:root[data-layout=classic] #bs8 {
  font-size: 2200%;
  top: 10%;
  right: 27%;
}
:root[data-layout=classic] #bs9 {
  font-size: 1200%;
  bottom: 26%;
  left: 36%;
}
:root[data-layout=classic] #logo {
  padding: 0;
  z-index: 3;
  left: auto;
  top: 0.3125em; /* 5px */
}
:root[data-layout=classic] #logo > .l > img.l {
  width: 12.5em; /** 200px */
  -webkit-filter: drop-shadow(-5px -5px 5px #fff);
  filter: drop-shadow(-5px -5px 5px #fff);
}
:root[data-layout=classic] #slogan {
  display: block;
  color: #FFF;
  background-color: #0ACF00;
  font-size: 187.5%; /** 30px */
  line-height: 0.6666666667em; /* 20px */
  height: 0.6em; /* 18px */
  padding: 0.066666667em 0.066666667em 0 0; /** 2px 2px 0 0 */
  margin-left: 2em;
  position: relative;
  z-index: 2;
  top: -1.3em; /* 39px */
  text-align: right;
  overflow: hidden;
}
:root[data-layout=classic] #slogan > strong {
  display: inline-block;
  position: relative;
  top: -0.2em; /* -6px */
}
:root[data-layout=classic] #nav > h1.nav,
:root[data-layout=classic] #nav div > h2.nav {
  display: none;
}
:root[data-layout=classic] #menu > li.m > .sep,
:root[data-layout=classic] #menu > li.m > .description {
  display: none;
}
:root[data-layout=classic] #nav .home {
  font-family: "BPreplay", Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 125%; /** 20px */
  line-height: 1em; /** 20px */
  margin: 1.5em 0 0.5em 0; /** 30px 0 10px 0 */
  padding: 0 0 0 1.65em; /** 0 0 0 33px */
}
:root[data-layout=classic] #nav .home:before {
  content: "V ";
  color: #FFF;
  margin: 0 0.75em 0 -1.7em; /** 0 15em 0 -34px */
}
:root[data-layout=classic] #nav .home > a.s > .home-surrounding,
:root[data-layout=classic] #nav .home > strong.s > .home-surrounding {
  display: none;
}
:root[data-layout=classic] #nav .home > a.s,
:root[data-layout=classic] #nav .home > strong.s {
  color: #FFF;
}
:root[data-layout=classic] #nav .home > a.s {
  border-style: dashed;
  border-color: #FFF;
}
:root[data-layout=classic] #nav .home > strong.s {
  border-bottom: 1px solid #FFF;
}
:root[data-layout=classic] #nav .home > a.s:hover,
:root[data-layout=classic] #nav .home > a.s:focus,
:root[data-layout=classic] #nav .home > a.s:active {
  border-style: solid;
}
:root[data-layout=classic] #submenu {
  font-size: 125%; /** 20 px */
  list-style-type: none;
  padding: 0 0 0 1.65em; /** 0 0 0 33px */
  border-style: none;
}
:root[data-layout=classic] #submenu ul.s {
  padding: 0;
  list-style-type: none;
}
:root[data-layout=classic] #submenu.active,
:root[data-layout=classic] #submenu ul.active {
  margin-top: 1.5em; /** 24px */
}
:root[data-layout=classic] #submenu li.s {
  margin: 0 0 0.5em 0; /** 0 0 10px 0 */
  padding: 0;
}
:root[data-layout=classic] #submenu li.s.off {
  display: none;
}
:root[data-layout=classic] #submenu li.s > a.s {
  color: #078600;
}
:root[data-layout=classic] #submenu li.s > a.s.selected,
:root[data-layout=classic] #submenu li.s > strong.s {
  color: #FFF;
  border-color: #FFF;
}
:root[data-layout=classic] #submenu li.s > strong.s {
  border-bottom: 1px solid #FFF;
}
:root[data-layout=classic] #submenu li.s > a.s.selected:before,
:root[data-layout=classic] #submenu li.s > a.s:hover:before,
:root[data-layout=classic] #submenu li.s > a.s:focus:before,
:root[data-layout=classic] #submenu li.s > a.s:active:before,
:root[data-layout=classic] #submenu li.s > strong.s:before {
  content: "> ";
  margin: 0 0.75em 0 -1.7em; /** 0 15px 0 -34px = Warum auch immer?!? */
}
:root[data-layout=classic] #submenu li.s.sub > a.s.selected:before,
:root[data-layout=classic] #submenu li.s.sub > a.s:hover:before,
:root[data-layout=classic] #submenu li.s.sub > a.s:focus:before,
:root[data-layout=classic] #submenu li.s.sub > a.s:active:before,
:root[data-layout=classic] #submenu li.s.sub > strong.s:before {
  content: "V ";
}
:root[data-layout=classic] #submenu li.s.nav-leaf {
  display: none;
}
:root[data-layout=classic] #submenu li.s > a.s > strong {
  display: contents;
}
:root[data-layout=classic] {
  /** Make the footer sticky */
}
:root[data-layout=classic] html, :root[data-layout=classic] body {
  height: 100%;
}
:root[data-layout=classic] #page {
  position: relative;
  min-height: 100%;
}
:root[data-layout=classic] #footer {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
:root[data-layout=classic] {
  /** Pages under construction... */
}
:root[data-layout=classic] .wip,
:root[data-layout=classic] .wip h1,
:root[data-layout=classic] .wip h2,
:root[data-layout=classic] .wip h3,
:root[data-layout=classic] .wip h4,
:root[data-layout=classic] .wip h5,
:root[data-layout=classic] .wip h6,
:root[data-layout=classic] .wip a {
  color: rgba(128, 128, 128, 0);
  text-decoration: none;
  border-color: rgba(128, 128, 128, 0);
  text-shadow: 0 0 6px #404040;
}
:root[data-layout=classic] .wip {
  position: relative;
}
:root[data-layout=classic] .wip img.w {
  margin-top: 30%;
  position: absolute;
  width: 100%;
}
:root[data-layout=classic] .pack {
  overflow: hidden;
}
:root[data-layout=classic] .pack > .p.left,
:root[data-layout=classic] .pack > .p.right {
  width: 42%;
  padding: 0 3% 999em 3%;
  margin: 0 0 -998em 0;
}
:root[data-layout=classic] .pack.bg > .p.left,
:root[data-layout=classic] .pack.bg > .p.right {
  background-color: #CEF7C8;
}
:root[data-layout=classic] .pack > .p.left {
  float: left;
}
:root[data-layout=classic] .pack > .p.right {
  float: right;
}
:root[data-layout=classic] .pack > .p img.p {
  width: 91.9118%;
}
:root[data-layout=classic] .single {
  padding: 0 3% 1em 3%;
  margin: 3% 0;
}
:root[data-layout=classic] .single.bg {
  background-color: #CEF7C8;
}
@media (min-width: 580px) {
  :root[data-layout=classic] {
    /** Seite gesamt (Abmessungen, Aussenabstände etc.) */
  }
  :root[data-layout=classic] body {
    padding: 0;
    overflow-y: scroll; /** Die vertikale Scroll-Leiste stets anzeigen */
  }
  :root[data-layout=classic] #page {
    margin: 0 auto; /** Seiteninhalte zentrieren, wenn max-width des Inhalts (s.u.) erreicht ist */
    max-width: 62.375em; /** 608px + 390px (Marginalspalte) = ca. 1000px (muss zu Wergen in faux-columns.scss passen!!) */
  }
  :root[data-layout=classic] {
    /** Seitenaufteilung mit Menü (Zweispaltig) */
  }
  :root[data-layout=classic] body {
    padding: 0 3em 0 5em;
  }
  :root[data-layout=classic] .content {
    position: relative;
    padding: 0 0 8.5em 0; /** Unten: mind. 126px (Höhe des absolut positionierten Footers) + Puffer */
  }
  :root[data-layout=classic] .menu .content,
  :root[data-layout=classic] .nomenu .content {
    padding-right: 27em;
  }
  :root[data-layout=classic] .content > .main {
    min-height: 1em;
    position: relative;
    width: 100%;
  }
  :root[data-layout=classic] .menu .content > .main,
  :root[data-layout=classic] .nomenu .content > .main {
    float: left;
  }
  :root[data-layout=classic] .content > .marginal {
    position: relative;
    background-color: #6EE768;
  }
  :root[data-layout=classic] .menu .content > .marginal,
  :root[data-layout=classic] .nomenu .content > .marginal {
    float: left;
    margin: 0 -27em 0 2.625em;
    padding: 0 2em 1.0625em 2em;
    width: 20.375em;
  }
  :root[data-layout=classic] {
    /** Anpassungen für Seiten ohne Menü */
  }
  :root[data-layout=classic] .nomenu .content > .marginal {
    background-color: #CEF7C8;
  }
  :root[data-layout=classic] {
    /** Anpassungen für einspaltige Seiten */
  }
  :root[data-layout=classic] .onecolumn .content > .marginal {
    margin-top: 4em;
    background-color: transparent;
  }
  :root[data-layout=classic] {
    /** Seitenkopf positionieren */
  }
  :root[data-layout=classic] #header {
    margin-left: -2.125em;
    padding: 0.125em 0 1em 0;
  }
  :root[data-layout=classic] #header > hr.h {
    display: none;
  }
  :root[data-layout=classic] {
    /** Bereichsauswahl positionieren und stylen */
  }
  :root[data-layout=classic] .onecolumn #nav {
    position: absolute;
    top: 0;
    right: 0; /** Hier eigentlich nicht nötig, aber für Tablet-Style erforderrlich! */
    width: 100%;
  }
  :root[data-layout=classic] #nav > hr.n {
    display: none;
  }
  :root[data-layout=classic] #nav {
    position: relative;
    top: auto;
    right: auto;
    width: 22.375em; /** 358px = 326px + 32px*/
  }
  :root[data-layout=classic] #menu {
    position: relative;
    width: 200%;
    top: -8em; /** 136px */
    right: 100%;
    text-align: right;
    list-style-type: none;
    margin: 0 0 -2.125em 0; /** 0 0 -34px 0 */
    padding: 0;
    border-style: none;
  }
  :root[data-layout=classic] .onecolumn #menu {
    top: -15.5625em; /** -249px -- warum auch immer... */
  }
  :root[data-layout=classic] #menu > li.m {
    display: inline-block;
    padding: 0 0 0 4em;
  }
  :root[data-layout=classic] #menu > li.m > .m {
    font-size: 250%; /** 40px */
    color: #0ACF00;
  }
  :root[data-layout=classic] #menu > li.m > a.m {
    border-color: #0ACF00;
  }
  :root[data-layout=classic] #menu > li.m > a.m:hover {
    border-color: #078600;
  }
  :root[data-layout=classic] #menu > li.m > a.m:hover,
  :root[data-layout=classic] #menu > li.m > strong.m {
    border-style: solid;
  }
  :root[data-layout=classic] #menu > li.m > a.m.selected {
    color: #0ACF00;
  }
  :root[data-layout=classic] #menu > li.m > a.m:hover {
    color: #078600;
  }
  :root[data-layout=classic] #menu > li.m > a.m:hover:before,
  :root[data-layout=classic] #menu > li.m > a.m.selected:before,
  :root[data-layout=classic] #menu > li.m > strong.m:before {
    content: "> ";
    margin-left: -0.92em;
  }
  :root[data-layout=classic] {
    /** Breadcrump positionieren */
  }
  :root[data-layout=classic] #breadcrumb {
    position: absolute;
    top: 7.875em; /* 126px */
    left: 10em;
    z-index: 3;
  }
  :root[data-layout=classic] #breadcrumb > a.hide {
    position: absolute;
  }
  :root[data-layout=classic] #breadcrumb > hr.b {
    display: none;
  }
  :root[data-layout=classic] #breadcrumb > strong.b.title,
  :root[data-layout=classic] #breadcrumb > ol.b > li.b:first-child {
    text-indent: -999em;
    width: 0;
    margin: 0;
  }
  :root[data-layout=classic] {
    /** Footer positionieren */
  }
  :root[data-layout=classic] #footer {
    padding: 2em 0;
  }
  :root[data-layout=classic] .onecolumn #footer {
    background-color: #FFF;
  }
  :root[data-layout=classic] #footer > hr.f {
    display: none;
  }
  :root[data-layout=classic] #footerlinks {
    border-top: 1.25em solid #0ACF00; /** 20px */
  }
  :root[data-layout=classic] #footerlinks > li.f {
    line-height: 0.6666666667em; /* 20px */
    display: inline-block;
    float: none;
    margin: 0.5em 1em 0 0;
    color: #0ACF00;
    vertical-align: top;
  }
  :root[data-layout=classic] #footerlinks > li#copyright {
    position: absolute;
    float: none;
    width: auto;
    right: 0.625em;
    top: -1em; /** 30px */
    line-height: 1.4em; /* 42px */
    color: #FFF;
    margin: 0;
    font-size: 187.5%; /** 30px */
  }
  :root[data-layout=classic] #footerlinks a.f {
    color: #0ACF00;
    border-color: #0ACF00;
  }
  :root[data-layout=classic] #footerlinks a.f:hover {
    color: #078600;
    border-color: #078600;
    border-style: solid;
  }
}
@media (min-width: 580px) and (max-width: 939px) {
  :root[data-layout=classic] {
    /** Seite gesamt (Abmessungen, Aussenabstände etc.) */
    /** Seitenaufteilung mit/ohne Menü für Tablets optimieren */
    /** Seitenkopf positionieren */
    /** Bereichsauswahl positionieren */
    /** Footer positionieren */
    /** Breadcrump positionieren */
    /** Faux-Column-Hack für Marginalinhalte */
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 800px) {
  :root[data-layout=classic] h1 {
    font-size: 150%; /** 24 px */
  }
}
@media (min-width: 580px) and (max-width: 939px) {
  :root[data-layout=classic] body {
    padding: 0;
  }
  :root[data-layout=classic] #page {
    overflow: hidden;
  }
  :root[data-layout=classic] .nomenu #page {
    padding: 0;
  }
  :root[data-layout=classic] .menu .content {
    padding: 0;
  }
  :root[data-layout=classic] .nomenu .content {
    padding: 0 0 5em 0;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 800px) {
  :root[data-layout=classic] .nomenu .content {
    padding-bottom: 4em;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 700px) {
  :root[data-layout=classic] .nomenu .content {
    padding-bottom: 3.25em;
  }
}
@media (min-width: 580px) and (max-width: 939px) {
  :root[data-layout=classic] .content.cf:before,
  :root[data-layout=classic] .content.cf:after {
    clear: none;
    content: none;
    display: inline;
  }
  :root[data-layout=classic] .menu .content > .main,
  :root[data-layout=classic] .nomenu .content > .main,
  :root[data-layout=classic] .onecolumn .content > .main {
    float: none;
    width: auto;
    padding: 0 3em 0 5em;
    /** Die 1px-Rahmen triggern, dass das erste Margin den Footer aufschiebt.
        Bei einem Wert von 0 ragt dieses Margin dann einfach aus dem Footer
        heraus... */
    border-top: 1px solid #FFF;
    border-bottom: 1px solid #FFF;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 800px) {
  :root[data-layout=classic] .menu .content > .main,
  :root[data-layout=classic] .nomenu .content > .main,
  :root[data-layout=classic] .onecolumn .content > .main {
    padding: 0 2em 0 3em;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 700px) {
  :root[data-layout=classic] .menu .content > .main,
  :root[data-layout=classic] .nomenu .content > .main,
  :root[data-layout=classic] .onecolumn .content > .main {
    padding: 0 1em 0 2.5em;
  }
}
@media (min-width: 580px) and (max-width: 939px) {
  :root[data-layout=classic] .menu .content > .marginal,
  :root[data-layout=classic] .nomenu .content > .marginal,
  :root[data-layout=classic] .onecolumn .content > .marginal {
    position: static;
    width: 100%;
  }
  :root[data-layout=classic] .menu .content > .marginal {
    margin: 3em 0 -994em -15em;
    padding: 2em 0 999em 0;
  }
  :root[data-layout=classic] .nomenu .content > .marginal {
    margin: 3em 0 -994em 0;
    padding: 0 0 999em 0;
    background-color: transparent;
  }
  :root[data-layout=classic] .onecolumn .content > .marginal {
    margin: 6.5em 0 -1001.175em 0;
    padding: 0 0 999em 0;
    background-color: transparent;
  }
  :root[data-layout=classic] #header {
    padding: 0.125em 3em 2em 5em;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 800px) {
  :root[data-layout=classic] #header {
    margin-left: -1.5em;
    padding: 0.125em 2em 2em 3em;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 700px) {
  :root[data-layout=classic] #header {
    margin-left: -1.2em;
    padding: 0.125em 1em 2em 2.5em;
  }
}
@media (min-width: 580px) and (max-width: 939px) {
  :root[data-layout=classic] .menu #nav {
    position: static;
    border-right: 0.125em solid #FFF;
    margin-left: 20em;
    width: auto;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 800px) {
  :root[data-layout=classic] .menu #nav {
    margin-left: 18.5em;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 700px) {
  :root[data-layout=classic] .menu #nav {
    margin-left: 17.5em;
  }
  :root[data-layout=classic] .menu #nav #menu > li.about {
    display: inline-block;
  }
}
@media (min-width: 580px) and (max-width: 939px) {
  :root[data-layout=classic] .nomenu #nav {
    position: absolute;
    top: 0;
    right: 0; /** Hier eigentlich nicht nötig, aber für Tablet-Style erforderrlich! */
    width: 100%;
  }
  :root[data-layout=classic] .menu #menu,
  :root[data-layout=classic] .nomenu #menu,
  :root[data-layout=classic] .onecolumn #menu {
    position: absolute;
    width: auto;
    top: -9em;
    right: 3em;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 800px) {
  :root[data-layout=classic] .menu #menu,
  :root[data-layout=classic] .nomenu #menu,
  :root[data-layout=classic] .onecolumn #menu {
    top: -7.7em;
    right: 2em;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 700px) {
  :root[data-layout=classic] .menu #menu,
  :root[data-layout=classic] .nomenu #menu,
  :root[data-layout=classic] .onecolumn #menu {
    top: -6.5em;
    right: 1em;
  }
}
@media (min-width: 580px) and (max-width: 939px) {
  :root[data-layout=classic] #menu > li.about {
    display: none;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 800px) {
  :root[data-layout=classic] #menu > li.m {
    padding: 0 0 0 3em;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 700px) {
  :root[data-layout=classic] #menu > li.m {
    padding: 0 0 0 2em;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 800px) {
  :root[data-layout=classic] #menu > li.m > .m {
    font-size: 200%; /* 32px */
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 700px) {
  :root[data-layout=classic] #menu > li.m > .m {
    font-size: 150%; /* 24px */
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 800px) {
  :root[data-layout=classic] #menu > li.m > a.m:hover:before,
  :root[data-layout=classic] #menu > li.m > a.m.selected:before,
  :root[data-layout=classic] #menu > li.m > strong.m:before {
    content: "> ";
    margin-left: -0.95em;
  }
}
@media (min-width: 580px) and (max-width: 939px) {
  :root[data-layout=classic] .menu #footer {
    position: static;
    float: right;
    margin: 3em 0 -999em -15em;
    padding: 0 0 999em 0;
    width: 15em;
    background-color: #6EE768;
  }
  :root[data-layout=classic] .nomenu #footer,
  :root[data-layout=classic] .onecolumn #footer {
    padding: 0 3em 1.5em 5em;
    background-color: #6EE768;
    border-style: none;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 800px) {
  :root[data-layout=classic] .nomenu #footer,
  :root[data-layout=classic] .onecolumn #footer {
    padding: 0 2em 1em 3em;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 700px) {
  :root[data-layout=classic] .nomenu #footer,
  :root[data-layout=classic] .onecolumn #footer {
    padding: 0 1em 0.75em 2.5em;
  }
}
@media (min-width: 580px) and (max-width: 939px) {
  :root[data-layout=classic] .menu #breadcrumb,
  :root[data-layout=classic] .nomenu #breadcrumb,
  :root[data-layout=classic] .onecolumn #breadcrumb {
    left: 15em;
    right: 3em;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 800px) {
  :root[data-layout=classic] .menu #breadcrumb,
  :root[data-layout=classic] .nomenu #breadcrumb,
  :root[data-layout=classic] .onecolumn #breadcrumb {
    font-size: 87.5%; /* 14px */
    top: 7.2em;
    left: 12.7142857em; /* 178px */
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 700px) {
  :root[data-layout=classic] .menu #breadcrumb,
  :root[data-layout=classic] .nomenu #breadcrumb,
  :root[data-layout=classic] .onecolumn #breadcrumb {
    top: 6em; /* 84px */
    left: 5em; /*70px */
  }
}
@media (min-width: 580px) and (max-width: 939px) {
  :root[data-layout=classic] .nomenu .content > .marginal aside.m,
  :root[data-layout=classic] .onecolumn .content > .marginal aside.m {
    margin: 3.5em 0 -999em 0;
    padding: 2em 3em 995em 5em;
    background-color: #6EE768;
    position: relative;
    top: -4.5em;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 800px) {
  :root[data-layout=classic] .nomenu .content > .marginal aside.m,
  :root[data-layout=classic] .onecolumn .content > .marginal aside.m {
    padding-left: 3em;
    padding-right: 2em;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 700px) {
  :root[data-layout=classic] .nomenu .content > .marginal aside.m,
  :root[data-layout=classic] .onecolumn .content > .marginal aside.m {
    padding-left: 2.5em;
    padding-right: 1em;
  }
}
@media (min-width: 580px) and (max-width: 939px) {
  :root[data-layout=classic] .menu .content > .marginal > aside.m {
    margin: 0 -12em 1em 20em;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 800px) {
  :root[data-layout=classic] .menu .content > .marginal > aside.m {
    margin-left: 18.5em;
    margin-right: -13em;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 700px) {
  :root[data-layout=classic] .menu .content > .marginal > aside.m {
    margin-left: 17.5em;
    margin-right: -14em;
  }
}
@media (min-width: 580px) and (max-width: 939px) {
  :root[data-layout=classic] #submenu {
    padding-right: 1em;
  }
  :root[data-layout=classic] .nomenu .content > .marginal h1,
  :root[data-layout=classic] .onecolumn .content > .marginal h1,
  :root[data-layout=classic] .nomenu .content > .marginal h2,
  :root[data-layout=classic] .onecolumn .content > .marginal h2,
  :root[data-layout=classic] .nomenu .content > .marginal h3,
  :root[data-layout=classic] .onecolumn .content > .marginal h3,
  :root[data-layout=classic] .nomenu .content > .marginal h4,
  :root[data-layout=classic] .onecolumn .content > .marginal h4 {
    color: #FFF;
  }
  :root[data-layout=classic] .menu #footer #footer-layouts .footer-heading {
    display: block;
    color: rgb(178.5, 178.5, 178.5);
    font-size: 137.5%;
    font-weight: normal;
    line-height: 1em;
    margin: 2.75em 0 0.5em 2em;
    padding: 0;
  }
  :root[data-layout=classic] .menu #footer .footer-layouts-inner {
    float: none;
    margin: 0 0 1em 2.75em;
  }
  :root[data-layout=classic] .menu #footer #layout-switcher .layout-option {
    display: block;
    margin: 0 0 0.25em 0;
    line-height: 1em;
  }
  :root[data-layout=classic] .menu #footer #layout-switcher .layout-option + .layout-option::before {
    content: none;
  }
  :root[data-layout=classic] .nomenu #footer .footer-layouts-inner,
  :root[data-layout=classic] .onecolumn #footer .footer-layouts-inner {
    margin: 2.1875em 0 0 0;
  }
  :root[data-layout=classic] .menu #footer #footerlinks {
    position: static;
    border-style: none;
    margin: 0 0 0 2.75em;
  }
  :root[data-layout=classic] .menu #footer #footerlinks li.f {
    line-height: 1em;
    display: block;
    margin: 0 0 0.25em 0;
    color: #FFF;
  }
  :root[data-layout=classic] .menu #footer #footerlinks li#copyright {
    line-height: 1em;
    font-size: 137.5%;
    top: auto;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 0 2.18181818em 1.5em; /* ? 3*16px ? */
    background-color: #6EE768;
    text-align: right;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 800px) {
  :root[data-layout=classic] .menu #footer #footerlinks li#copyright {
    padding-right: 1.45454545em;
    padding-bottom: 1em;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 700px) {
  :root[data-layout=classic] .menu #footer #footerlinks li#copyright {
    padding-right: 0.72727272em;
    padding-bottom: 0.5em;
  }
}
@media (min-width: 580px) and (max-width: 939px) {
  :root[data-layout=classic] .menu #footer #footerlinks a.f {
    color: #FFF;
    border-color: #FFF;
  }
  :root[data-layout=classic] .menu #footer #footerlinks a.f:hover {
    color: #FFF;
    border-color: #FFF;
    border-style: solid;
  }
  :root[data-layout=classic] .nomenu #footer #footerlinks,
  :root[data-layout=classic] .onecolumn #footer #footerlinks {
    position: static;
    margin: -0.125em;
    padding-top: 1.5em;
    border-top: 0.125em solid #FFF;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 800px) {
  :root[data-layout=classic] .nomenu #footer #footerlinks,
  :root[data-layout=classic] .onecolumn #footer #footerlinks {
    padding-top: 1em;
  }
}
@media (min-width: 580px) and (max-width: 939px) and (max-width: 700px) {
  :root[data-layout=classic] .nomenu #footer #footerlinks,
  :root[data-layout=classic] .onecolumn #footer #footerlinks {
    padding-top: 0.5em;
  }
}
@media (min-width: 580px) and (max-width: 939px) {
  :root[data-layout=classic] .nomenu #footer #footerlinks li.f,
  :root[data-layout=classic] .onecolumn #footer #footerlinks li.f {
    line-height: 1em;
    margin: 0 1em 0 0;
    padding: 0;
  }
  :root[data-layout=classic] .nomenu #footer #footerlinks li.f > a.f,
  :root[data-layout=classic] .onecolumn #footer #footerlinks li.f > a.f {
    color: #FFF;
    border-color: #FFF;
  }
  :root[data-layout=classic] .nomenu #footer #footerlinks li#copyright,
  :root[data-layout=classic] .onecolumn #footer #footerlinks li#copyright {
    position: static;
    float: right;
    font-size: 137.5%;
    margin: 0;
  }
}
@media (min-width: 940px) {
  :root[data-layout=classic] {
    /** Faux-Column-Hack-Eigengewächs für die Marginalspalte */
  }
  :root[data-layout=classic] .menu #page,
  :root[data-layout=classic] .nomenu #page {
    max-width: 38em; /** 608px + 390px (Marginalspalte) = ca. 1000px */
    border-right: 24.375em solid #6EE768;
  }
  :root[data-layout=classic] .nomenu #page {
    border-right-color: #CEF7C8;
  }
  :root[data-layout=classic] .menu .content,
  :root[data-layout=classic] .nomenu .content {
    margin-right: -24.375em;
  }
  :root[data-layout=classic] .menu #header,
  :root[data-layout=classic] .nomenu #header {
    margin-right: -24.375em;
    background-color: #FFF;
  }
  :root[data-layout=classic] .menu #breadcrumb,
  :root[data-layout=classic] .nomenu #breadcrumb {
    right: -24.375em; /** Weil der Breadcrumb sonst an der Faux-Column umbricht! */
  }
  :root[data-layout=classic] .menu #footer,
  :root[data-layout=classic] .nomenu #footer {
    margin-right: -24.375em;
    background-color: #FFF;
  }
  :root[data-layout=classic] .menu .content > .marginal h1,
  :root[data-layout=classic] .menu .content > .marginal h2,
  :root[data-layout=classic] .menu .content > .marginal h3,
  :root[data-layout=classic] .menu .content > .marginal h4 {
    color: #FFF;
  }
  :root[data-layout=classic] {
    /** Artikel-Titel mit kurzem Abstand zur Oberkante der Marginalspalte */
  }
  :root[data-layout=classic] article#content > header h1 {
    margin-top: 0.3em; /** ~7px – kleiner Luft nach oben, aber bündig zum Marginalbereich */
  }
  :root[data-layout=classic] .mcontent {
    position: relative;
    padding: 0 24.375em 0 0;
  }
  :root[data-layout=classic] .mcontent > .mmain {
    float: left;
    min-height: 1em;
    position: relative;
    width: 100%;
    border-right: 0.125em solid #0ACF00;
  }
  :root[data-layout=classic] .mcontent > .mmarginal {
    float: left;
    margin: 0 -27em 0 -0.125em;
    padding: 0 2em 1.0625em 2em;
    position: relative;
    width: 20.375em;
    border-left: 0.125em solid #0ACF00;
  }
  :root[data-layout=classic] .mcontent > .mmain > * {
    margin-right: 5%;
  }
}
@media (min-width: 940px) and (max-width: 1079px) {
  :root[data-layout=classic] .pack > .p.left,
  :root[data-layout=classic] .pack > .p.right,
  :root[data-layout=classic] .pack.bg > .p.left,
  :root[data-layout=classic] .pack.bg > .p.right,
  :root[data-layout=classic] .single,
  :root[data-layout=classic] .single.bg {
    width: auto;
    padding-bottom: 1.5em;
    margin: 0 0 1.5em 0;
  }
}
@media (max-width: 939px) and (max-width: 800px) {
  :root[data-layout=classic] #logo {
    font-size: 80%;
  }
  :root[data-layout=classic] #slogan {
    font-size: 150%; /** 24px */
  }
}
@media (max-width: 939px) and (max-width: 700px) {
  :root[data-layout=classic] #logo {
    font-size: 60%;
  }
  :root[data-layout=classic] #slogan {
    font-size: 112.5%; /** 18px */
  }
}
@media (max-width: 939px) {
  :root[data-layout=classic] .withbackground .content {
    position: relative;
    top: auto;
    bottom: auto;
    left: auto;
    rigth: auto;
  }
  :root[data-layout=classic] #bs3 {
    display: none;
  }
  :root[data-layout=classic] #bs5 {
    left: auto;
    right: 13%;
  }
  :root[data-layout=classic] #bs7 {
    bottom: 21%;
  }
  :root[data-layout=classic] #bs8 {
    display: none;
  }
}
@media (max-width: 579px) {
  :root[data-layout=classic] h1 {
    font-size: 150%; /** 24 px */
  }
  :root[data-layout=classic] {
    /** Seite gesamt (Abmessungen, Aussenabstände etc.) */
  }
  :root[data-layout=classic] body {
    font-size: 87.5%; /** 14px */
    padding: 0;
  }
  :root[data-layout=classic] #page {
    position: relative;
    overflow: hidden;
  }
  :root[data-layout=classic] {
    /** Seitenaufteilung mit/ohne Menü */
  }
  :root[data-layout=classic] .content > .main {
    margin: 0 1em 0 2.5em;
  }
  :root[data-layout=classic] .menu .content > .main {
    border-top-style: none;
  }
  :root[data-layout=classic] {
    /** Seitenkopf positionieren */
  }
  :root[data-layout=classic] #header {
    margin: 0.125em 1em 1em 1.25em;
  }
  :root[data-layout=classic] #header > hr.h {
    display: none;
  }
  :root[data-layout=classic] #logo {
    font-size: 50%;
  }
  :root[data-layout=classic] {
    /** Bereichsauswahl positionieren und stylen */
  }
  :root[data-layout=classic] #nav > hr.n {
    display: none;
  }
  :root[data-layout=classic] #menu {
    border-style: none;
    font-size: 125%;
    line-height: 1.5em;
  }
  :root[data-layout=classic] #menu {
    font-size: 150%;
    border-bottom: 0.125em solid #FFF;
    margin-top: 0;
    padding: 0.25em 0.25em 1em 1.5em;
  }
  :root[data-layout=classic] #menu > li.m {
    float: left;
    list-style-type: none;
    padding: 0.25em 1em 0 0;
  }
  :root[data-layout=classic] {
    /** Navigations-Sprunglink reaktivieren und stylen */
    /** Inhalts-Sprunglink reaktivieren und stylen */
    /** Footer positionieren */
    /** Marginal-Inhalte anpassen... */
    /** Faux-Column-Hack für Marginalinhalte */
  }
}
@media (max-width: 579px) and (max-width: 359px) {
  :root[data-layout=classic] #menu > li.m {
    float: none;
  }
}
@media (max-width: 579px) {
  :root[data-layout=classic] #menu > li.m > a.m {
    color: #2D9B27;
  }
  :root[data-layout=classic] #menu > li.m > strong.m {
    color: #FFF;
    border-bottom: 0.0625em solid #FFF;
  }
  :root[data-layout=classic] #menu > li.m > a.m:hover,
  :root[data-layout=classic] #menu > li.m > a.m:focus,
  :root[data-layout=classic] #menu > li.m > a.m:active {
    color: #078600;
    border-bottom: 0.0625em solid #078600;
  }
  :root[data-layout=classic] #menu > li.m > a.m.selected {
    color: #FFF;
    border-bottom: 0.0625em dashed #FFF;
  }
  :root[data-layout=classic] #menu > li.m > a.m.selected:hover,
  :root[data-layout=classic] #menu > li.m > a.m.selected:focus,
  :root[data-layout=classic] #menu > li.m > a.m.selected:active {
    border-style: solid;
  }
  :root[data-layout=classic] #breadcrumb {
    position: absolute;
    top: 0.8em;
    right: 1.5em;
  }
  :root[data-layout=classic] #breadcrumb > strong.b,
  :root[data-layout=classic] #breadcrumb > ol.b,
  :root[data-layout=classic] #breadcrumb > hr.b {
    display: none;
  }
  :root[data-layout=classic] #breadcrumb > a.hide {
    display: block;
    overflow: hidden;
    width: 3.5em;
    height: 3em;
    line-height: 2.1em;
    color: #0ACF00;
    border-style: none;
  }
  :root[data-layout=classic] #breadcrumb > a.hide:before {
    content: "\e62c";
    font-family: "symbols";
    font-size: 378%; /** Vielfaches von 14px */
    padding: 0 0 1em 0;
    font-weight: normal;
  }
  :root[data-layout=classic] #breadcrumb > a.hide:hover,
  :root[data-layout=classic] #breadcrumb > a.hide:focus,
  :root[data-layout=classic] #breadcrumb > a.hide:active {
    color: #078600;
  }
  :root[data-layout=classic] #nav:target {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    padding: 0.25em 1em 999em 2.5em;
    margin-bottom: -993em;
    z-index: 5;
    background-color: #6EE768;
  }
  :root[data-layout=classic] #nav:target #menu {
    padding-top: 0;
    padding-bottom: 0.75em;
  }
  :root[data-layout=classic] #nav:target > a.hide {
    position: absolute;
    left: auto;
    top: 0.8em;
    right: 1.5em;
    display: block;
    overflow: hidden;
    width: 3.5em;
    height: 3em;
    line-height: 2.1em;
    color: #FFF;
    border-style: none;
  }
  :root[data-layout=classic] #nav:target > a.hide:before {
    content: "\e62c";
    font-family: "symbols";
    font-size: 378%; /** Vielfaches von 14px */
    padding: 0 0 1em 0;
    margin: 0 1em 0 0;
  }
  :root[data-layout=classic] #nav:target > a.hide:hover,
  :root[data-layout=classic] #nav:target > a.hide:focus,
  :root[data-layout=classic] #nav:target > a.hide:active {
    color: #078600;
  }
  :root[data-layout=classic] #footer {
    padding: 0 1em 0.5em 2.5em;
    background-color: #6EE768;
  }
  :root[data-layout=classic] #footer > hr.f {
    border-color: #FFF;
  }
  :root[data-layout=classic] .marginal h1,
  :root[data-layout=classic] .marginal h2,
  :root[data-layout=classic] .marginal h3,
  :root[data-layout=classic] .marginal h4 {
    color: #FFF;
  }
  :root[data-layout=classic] .marginal {
    margin-top: 4em;
    margin-bottom: -993em;
    padding: 1em 1em 999em 2.5em;
    background-color: #6EE768;
  }
}
@media (max-width: 579px) and (max-width: 410px) {
  :root[data-layout=classic] #slogan {
    color: #0ACF00;
    height: 0.3em;
    top: -1.1em;
  }
}
@media (max-width: 579px) {
  :root[data-layout=classic] #submenu {
    border-style: none;
    font-size: 125%;
    line-height: 1.5em;
  }
  :root[data-layout=classic] #footer .footer-layouts-inner {
    float: none;
    margin: 0.6875em 0 0 0;
  }
  :root[data-layout=classic] #footer #footerlinks {
    position: static;
    border-style: none;
  }
  :root[data-layout=classic] #footer #footerlinks li.about {
    display: none;
  }
  :root[data-layout=classic] #footer #footerlinks li.f {
    color: #FFF;
    line-height: 1em;
    margin: 0 1em 0 0;
    padding: 0 0 0.5em 0;
  }
  :root[data-layout=classic] #footer #footerlinks li.f a.f {
    color: #FFF;
    border-color: #FFF;
  }
  :root[data-layout=classic] #footer #footerlinks li#copyright {
    position: static;
    float: right;
    width: auto;
    font-size: 137.5%;
    margin: 0;
  }
}
@media (max-width: 579px) and (max-width: 229px) {
  :root[data-layout=classic] #footer #footerlinks li#copyright {
    color: #000;
    flow: none;
    width: 100%;
  }
}
@media (max-width: 579px) {
  :root[data-layout=classic] .pack > .p.left,
  :root[data-layout=classic] .pack > .p.right,
  :root[data-layout=classic] .pack.bg > .p.left,
  :root[data-layout=classic] .pack.bg > .p.right,
  :root[data-layout=classic] .single,
  :root[data-layout=classic] .single.bg {
    width: auto;
    padding-bottom: 1.5em;
    margin: 0 0 1.5em 0;
  }
  :root[data-layout=classic] .withbackground .content {
    position: relative;
  }
  :root[data-layout=classic] .withbackground .content > .main {
    z-index: 1;
  }
  :root[data-layout=classic] .withbackground .content > .marginal {
    position: relative;
    z-index: 3;
    border-top: 0.142857143em solid #FFF; /** 2px */
  }
  :root[data-layout=classic] #bs1 {
    top: -3%;
  }
  :root[data-layout=classic] #bs2 {
    font-size: 2000%;
    top: 0%;
    right: 3%;
  }
  :root[data-layout=classic] #bs4 {
    top: 5%;
    left: 57%;
  }
}
@media (max-width: 579px) and (max-width: 410px) {
  :root[data-layout=classic] #bs4 {
    display: none;
  }
}
@media (max-width: 579px) {
  :root[data-layout=classic] #bs6 {
    font-size: 1700%;
    bottom: -10%;
    left: 45%;
  }
  :root[data-layout=classic] #bs7 {
    top: 20%;
    left: 2%;
  }
}
@media (max-width: 579px) and (max-width: 410px) {
  :root[data-layout=classic] #bs7 {
    top: 34%;
    left: 30%;
  }
}
@media (max-width: 579px) {
  :root[data-layout=classic] #bs5,
  :root[data-layout=classic] #bs8 {
    display: none;
  }
  :root[data-layout=classic] #bs9 {
    top: 20%;
  }
}
@media (max-width: 579px) and (max-width: 410px) {
  :root[data-layout=classic] #bs9 {
    display: none;
  }
}
@media (max-width: 299px) {
  :root[data-layout=classic] body {
    font-size: 75%; /** 12px */
  }
  :root[data-layout=classic] #header {
    font-size: 75%;
    margin: 0.25em 0.5em 1em 1em;
  }
  :root[data-layout=classic] #nav:target {
    padding-left: 0.5em;
    padding-right: 0.5em;
  }
  :root[data-layout=classic] #breadcrumb,
  :root[data-layout=classic] #nav:target > a.hide {
    top: 0.5em;
    right: 0.5em;
  }
  :root[data-layout=classic] .content > .main,
  :root[data-layout=classic] #footer {
    margin: 0;
    padding: 0 0.5em;
  }
  :root[data-layout=classic] .content > .marginal {
    padding: 1em 0.5em 999em 0.5em;
    margin-bottom: -991em;
  }
}
@media (max-width: 299px) and (max-width: 210px) {
  :root[data-layout=classic] #nav:target {
    padding-top: 0;
  }
}
@media (max-width: 299px) and (max-width: 150px) {
  :root[data-layout=classic] #header {
    font-size: 50%;
  }
  :root[data-layout=classic] #header > hr.h {
    display: block;
    margin: 0;
  }
  :root[data-layout=classic] #slogan {
    display: none;
  }
  :root[data-layout=classic] #breadcrumb,
  :root[data-layout=classic] #nav:target > a.hide {
    top: 0.2em;
    line-heigth: 2.3em;
    width: 2.4em;
  }
  :root[data-layout=classic] #breadcrumb > a.hide:before,
  :root[data-layout=classic] #nav:target > a.hide:before {
    font-size: 264%; /** Vielfaches von 12px */
  }
}
@media (max-width: 299px) {
  :root[data-layout=classic] .withbackground .content > .marginal {
    border-top: 0.1666666667em solid #FFF; /** 2px */
  }
  :root[data-layout=classic] #bs1 {
    top: -2%;
    left: 57%;
  }
  :root[data-layout=classic] #bs2,
  :root[data-layout=classic] #bs6 {
    display: none;
  }
  :root[data-layout=classic] #bs7 {
    top: 32%;
    left: 46%;
  }
}

/*# sourceMappingURL=screen.css.map */