/* Rot*/
/* Blau*/
/* 16px > % */
/* 18px */
/* padding-top %*/
@media all {
  /*
   * @section global typography settings
   * 
   * vertical rhythm settings (based on em-unit)
   * -------------------------------------------
   * basefont-size:  14px (87.5%)
   * line-height  :  21px (factor: 1.5) */
  /* (en) reset font size for all elements to standard (16 Pixel) */
  /* (de) Alle Schriftgrößen auf Standardgröße (16 Pixel) zurücksetzen */
    html * {
      font-size: 100%;
      /**
       * (en) reset monospaced elements to font size 16px in all browsers
       * (de) Schriftgröße von monospaced Elemente in allen Browsern auf 16 Pixel setzen
       *
       * @see: http://webkit.org/blog/67/strange-medium/
       */ }
    pre, code, kbd, samp, var, tt {
      font-family: 'Source Code Pro';
      font-size: 90%;
      font-weight: 300;
      /* font-size: 18px; */ }
    body {
      font-family: 'DIN', sans-serif;
      font-size: 106.25%;
      color: black;
      font-weight: 300; }
      header h4 {
        margin-top: -1em;
        /*--- Headings | Überschriften ------------------------------------------------------------------------*/ }
    h1, h2, h3, h4, h5, h6 {
      font-family: 'DIN', sans-serif;
      font-weight: 400;
      text-transform: uppercase;
      color: #e73137;
      font-size: 115.5%;
      line-height: 1;
      margin: 0 0 1em 0; }
    h1 {
      margin: 0 0 1.35em 0;
      font-size: 166.666%; }
    h2 {
      font-size: 150%; }
    h3 {
      font-size: 133.333%; }
    h4 {
      font-size: 133.333%;
      color: black; }
    h5 {
      font-size: 125%; }
      h1 strong, h2 strong, h3 strong, h4 strong, h5 strong, h6 strong, h1 b, h2 b, h3 b, h4 b, h5 b, h6 b {
        font-weight: 400;
        /* --- Lists | Listen  -------------------------------------------------------------------------------- */ }
    ul, ol, dl {
      font-size: 100%;
      line-height: 1.35;
      margin: 0 0 1.35em 0; }
    ul {
      list-style-type: disc; }
    ol {
      list-style-type: decimal; }
    ul ul {
      list-style-type: circle;
      margin-top: 0; }
    ol ol {
      list-style-type: lower-latin;
      margin-top: 0; }
    ol ul {
      list-style-type: circle;
      margin-top: 0; }
    li {
      font-size: 100%;
      line-height: 1.35;
      margin-left: 1.2em; }
    ol li {
      line-height: 1.25; }
    dt {
      font-weight: 300; }
    dd {
      margin: 0 0 1.35em 0.8em;
      /* --- general text formatting | Allgemeine Textauszeichnung ------------------------------------------ */ }
    p {
      font-size: 100%;
      line-height: 1.35;
      margin: 0 0 1.35em 0; }
    blockquote, cite, q {
      font-family: 'DIN', sans-serif;
      font-style: normal; }
    blockquote, aside, .frame-big {
      background: transparent;
      color: #323232;
      font-style: normal;
      font-weight: 300;
      font-size: 115.5%;
      text-align: center; }
    blockquote {
      margin: 2.5em 0; }
    aside {
      margin: 1em 0;
      padding: 0 0 0 1.35em;
      position: relative; }
    aside:before {
      position: absolute;
      left: 0;
      top: 0;
      content: '»';
      font-size: 200%;
      line-height: 75%;
      font-weight: 300; }
    strong, b {
      font-weight: 700; }
    strong.medium {
      font-weight: 500; }
    em, i {
      font-style: italic; }
    big {
      font-size: 115.5%;
      line-height: 1.25; }
    .frame-small, small, figcaption {
      font-size: 87.5%;
      line-height: 1.25; }
      .frame-small p, small p, figcaption p {
        margin-bottom: 0.5em; }
    .csc-textpic-caption, figcaption {
      text-align: right; }
    pre, code, kbd, tt, samp, var {
      font-size: 100%; }
    pre {
      line-height: 1.35;
      margin: 0 0 1.35em 0;
      white-space: pre;
      white-space: pre-wrap;
      word-wrap: break-word; }
    pre, code {
      color: black;
      font-weight: 300;
      font-size: 80%; }
    kbd, samp, var, tt {
      color: white;
      font-weight: 300; }
    var, dfn {
      font-style: italic; }
    acronym, abbr {
      border-bottom: 1px rgba(125, 125, 125, 0.75) dotted;
      font-variant: small-caps;
      letter-spacing: 0.07em;
      cursor: help; }
    sub, sup {
      font-size: 75%;
      line-height: 0;
      position: relative;
      vertical-align: baseline; }
    sup {
      top: -0.5em; }
    sub {
      bottom: -0.25em; }
    mark {
      background: #7d7d7d;
      color: #7d7d7d; }
    hr, li.divider {
      color: black;
      background: transparent;
      margin: 0 0 0.75em 0;
      padding: 0 0 0.67857em 0;
      border: 0; }
    hr.visible-line, li.divider {
      border-bottom: 0.1em rgba(0, 0, 0, 0.5) solid;
      margin: 0 0 1em 0;
      padding: 0 0 1em 0;
      /*--- Links ----------------------------------------------------------------------------------------- */ }
    a {
      color: #e73137;
      background: transparent;
      text-decoration: none; }
    a:active, a:hover, a:focus {
      outline: none;
      background: none;
      color: #e73137;
      text-decoration: none;
      /* Link Animation */ }
    a {
      -webkit-transition: all 0.5s ease;
      -moz-transition: all 0.5s ease;
      -o-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
      transition: all 0.5s ease; }
    a:hover {
      -webkit-transition-delay: 0;
      -moz-transition-delay: 0;
      -o-transition-delay: 0;
      -ms-transition-delay: 0;
      transition-delay: 0; }
    a.black-link {
      color: black;
      cursor: pointer; }
    a.red-link {
      color: #e73137;
      cursor: pointer; }
    a.blue-link {
      color: #009fe3;
      cursor: pointer; }
      h3 a, h3 a:visited {
        color: black;
        /* --- images ------------------ */ }
    img, figure {
      margin: 0; }
    .flexible {
      margin-bottom: 1.35em;
      max-width: 100%;
      height: auto;
      /* IE6 workaround - 2% space for possible borders */ }
    * html .flexible {
      width: 98%; }
    .bordered {
      margin-bottom: 1.35em;
      border: 2px rgba(255, 255, 255, 0.5) solid;
      box-shadow: inset 0 0 1em rgba(255, 255, 255, 0.1);
      /**
       * ----------------------------------------------------------------------- #
       *
       * Generic Content Classes
       *
       * (en) standard classes for positioning and highlighting
       * (de) Standardklassen zur Positionierung und Hervorhebung
       *
       * @section content-generic-classes
       */ }
    .highlight {
      color: #7d7d7d;
      text-shadow: 0 0 2px white, 0 0 5px rgba(255, 255, 255, 0.5);
      color: black;
      font-weight: 300; }
      .highlight p, .highlight li {
        font-weight: 300; }
      .highlight h1, .highlight h2, .highlight h3, .highlight h4, .highlight h5, .highlight h6, .highlight p, .highlight li {
        text-shadow: 0 0 1px white, 0 0 3px rgba(255, 255, 255, 0.75);
        color: black; }
    .dimmed {
      color: rgba(125, 125, 125, 0.75); }
    .box, .frame-box-color1, .frame-box-color2, .frame-box-light, .frame-box-medium, .frame-box-dark {
      border-radius: 0;
      border-width: 0;
      padding: 1.5em;
      margin: 0 0 1.5em 0; }
    .box > *:last-child, .frame-box-color1 > *:last-child, .frame-box-color2 > *:last-child, .frame-box-light > *:last-child, .frame-box-medium > *:last-child, .frame-box-dark > *:last-child {
      margin-bottom: 0; }
    .main-content > .box, .main-content > .frame-box-color1, .main-content > .frame-box-color2, .main-content > .frame-box-light, .main-content > .frame-box-medium, .main-content > .frame-box-dark {
      margin: 0;
      padding: 0; }
    .info, .frame-box-color1, .frame-box-color2, .frame-box-light, .frame-box-medium, .frame-box-dark {
      background-color: rgba(0, 0, 0, 0.1);
      background-size: cover; }
    .frame-box-color1 {
      background-color: #e73137; }
    .frame-box-color1:hover {
      background-color: #e73137; }
    .frame-box-color2 {
      background-color: #009fe3; }
    .frame-box-color2:hover {
      background-color: #009fe3; }
    .frame-box-medium {
      background-color: rgba(0, 0, 0, 0.25); }
    .frame-box-dark {
      background-color: rgba(0, 0, 0, 0.5); }
      .frame-box-color1 h1, .frame-box-color2 h1, .frame-box-dark h1, .frame-box-color1 h2, .frame-box-color2 h2, .frame-box-dark h2, .frame-box-color1 h3, .frame-box-color2 h3, .frame-box-dark h3, .frame-box-color1 h4, .frame-box-color2 h4, .frame-box-dark h4, .frame-box-color1 h5, .frame-box-color2 h5, .frame-box-dark h5, .frame-box-color1 h6, .frame-box-color2 h6, .frame-box-dark h6, .frame-box-color1 p, .frame-box-color2 p, .frame-box-dark p, .frame-box-color1 a, .frame-box-color2 a, .frame-box-dark a, .frame-box-color1 a:visited, .frame-box-color2 a:visited, .frame-box-dark a:visited, .frame-box-color1 a:hover, .frame-box-color2 a:hover, .frame-box-dark a:hover, .frame-box-color1 a:active, .frame-box-color2 a:active, .frame-box-dark a:active {
        color: white; }
    .label {
      font-family: 'DIN', sans-serif;
      padding: 1px 6px 2px;
      display: inline-block;
      vertical-align: middle;
      letter-spacing: normal;
      white-space: nowrap;
      border-radius: 0;
      background: none;
      color: black;
      font-size: 14px;
      line-height: 12px; }
    .success {
      background: rgba(0, 165, 9, 0.75);
      color: white;
      box-shadow: inset 0 0 1em rgba(125, 125, 125, 0.5); }
    .warning {
      background: rgba(216, 151, 26, 0.75);
      color: white;
      box-shadow: inset 0 0 1em rgba(125, 125, 125, 0.5); }
    .error {
      background: rgba(231, 49, 55, 0.75);
      color: white;
      box-shadow: inset 0 0 1em rgba(125, 125, 125, 0.5); }
    .float-left {
      float: left;
      display: inline;
      margin: 0 1em 1.5em 0; }
    .float-right {
      float: right;
      display: inline;
      margin: 0 0 1.5em 1em; }
    .center {
      display: block;
      text-align: center;
      margin: 0 auto 1.5em auto;
      /**
       * ------------------------------------------------------------------------------------------------- #
       *
       * Tables | Tabellen
       *
       * (en) Generic classes for table-width and design definition
       * (de) Generische Klassen für die Tabellenbreite und Gestaltungsvorschriften für Tabellen
       *
       * @section content-tables
       */ }
    table {
      width: 100%;
      border-collapse: collapse;
      color: black;
      border: none;
      margin: 0 0 1.35714em 0;
      font-weight: 300; }
    table.narrow {
      margin: 0 0 1.42857em 0; }
    table.narrow th, table.narrow td {
      padding: 0 0.35em;
      line-height: 1.35; }
    table.fixed {
      table-layout: fixed; }
    table.bordertable {
      border: 1px rgba(125, 125, 125, 0.5) solid; }
    table.bordertable thead th {
      border-right: 1px rgba(125, 125, 125, 0.5) solid;
      border-bottom: 1px rgba(125, 125, 125, 0.5) solid; }
    table.bordertable tbody th[scope="row"] {
      background: rgba(255, 255, 255, 0.2); }
    table.bordertable tbody th {
      border-right: 1px solid rgba(125, 125, 125, 0.75); }
    table.bordertable tbody td {
      border-right: 1px solid rgba(125, 125, 125, 0.75); }
    caption {
      font-variant: normal;
      font-size: 85.71429%;
      line-height: 1.75; }
    th, td {
      line-height: 1.35em;
      vertical-align: top;
      padding: 0.25em 0.5em 0.25em 0; }
    th *:first-child, td *:first-child {
      margin-top: 0; }
    th.nowrap, td.nowrap {
      white-space: nowrap; }
    thead th {
      text-align: left;
      color: black;
      border-bottom: 1px rgba(125, 125, 125, 0.5) solid;
      font-weight: 700; }
    tbody {
      /* highlight row on mouse over */ }
    tbody th, tbody td {
      text-align: left;
      border: none; }
    tbody th {
      font-weight: 400;
      width: auto;
      min-width: 20%; }
    tbody tr:hover th, tbody tr:hover td {
      background: none;
      /* TYPO3 Styles */ }
    .align-left, h1.ce-headline-left, h2.ce-headline-left, h3.ce-headline-left, h4.ce-headline-left, h5.ce-headline-left, h6.ce-headline-left, .text-left {
      text-align: left; }
    .align-center, h1.ce-headline-center, h2.ce-headline-center, h3.ce-headline-center, h4.ce-headline-center, h5.ce-headline-center, h6.ce-headline-center, .text-center {
      text-align: center; }
    .align-right, h1.ce-headline-right, h2.ce-headline-right, h3.ce-headline-right, h4.ce-headline-right, h5.ce-headline-right, h6.ce-headline-right, .text-right {
      text-align: right; }
    .align-justify, .text-justify {
      text-align: justify; }
    .ce-bodytext p.text-justify {
      -ms-hyphens: auto;
      -webkit-hyphens: auto;
      hyphens: auto; }
    .floatbox img {
      max-width: 99% !important; }
    .float_left {
      float: left;
      margin: 0.4em 1em 2em 0; }
    .float_right {
      float: right;
      margin: 0.4em 0 2em 1em; }
    .float_left.box, .float_right.box {
      padding: 0;
      /* Space */ }
    .frame-space-before-extra-small {
      margin-top: 1em; }
    .frame-space-before-small {
      margin-top: 2em; }
    .frame-space-before-medium {
      margin-top: 3em; }
    .frame-space-before-large {
      margin-top: 4em; }
    .frame-space-before-extra-large {
      margin-top: 5em; }
    .frame-space-after-extra-small {
      margin-bottom: 1em; }
    .frame-space-after-small {
      margin-bottom: 2em; }
    .frame-space-after-medium {
      margin-bottom: 3em; }
    .frame-space-after-large {
      margin-bottom: 4em; }
    .frame-space-after-extra-large {
      margin-bottom: 5em; }
    video {
      width: auto;
      max-width: 100%;
      height: auto; } }

@media screen and (max-width: 568px) {
  h1, h2 {
    font-size: 125%; }
  h3, h4, h5 {
    font-size: 115.5%; } }