/* noto-sans-regular - latin */
@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-weight: 400;
  src: url("../media/fonts/noto-sans-v8-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("Noto Sans"), local("NotoSans"), url("../media/fonts/noto-sans-v8-latin-regular.eot?#iefix") format("embedded-opentype"), url("../media/fonts/noto-sans-v8-latin-regular.woff2") format("woff2"), url("../media/fonts/noto-sans-v8-latin-regular.woff") format("woff"), url("../media/fonts/noto-sans-v8-latin-regular.ttf") format("truetype"), url("../media/fonts/noto-sans-v8-latin-regular.svg#NotoSans") format("svg");
  /* Legacy iOS */ }

/* noto-sans-700 - latin */
@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-weight: 700;
  src: url("../media/fonts/noto-sans-v8-latin-700.eot");
  /* IE9 Compat Modes */
  src: local("Noto Sans Bold"), local("NotoSans-Bold"), url("../media/fonts/noto-sans-v8-latin-700.eot?#iefix") format("embedded-opentype"), url("../media/fonts/noto-sans-v8-latin-700.woff2") format("woff2"), url("../media/fonts/noto-sans-v8-latin-700.woff") format("woff"), url("../media/fonts/noto-sans-v8-latin-700.ttf") format("truetype"), url("../media/fonts/noto-sans-v8-latin-700.svg#NotoSans") format("svg");
  /* Legacy iOS */ }

body {
  font-family: "Noto Sans", Arial, sans-serif;
  font-size: 16px; }

h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child, p:first-child {
  margin-top: 0; }

h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child, p:last-child {
  margin-bottom: 0; }

a {
  color: black;
  text-decoration: none; }
  a[target="_blank"]:after {
    content: "\29C9";
    margin-left: 2px; }

p.success {
  color: #0dc10d; }

p.error, p.failure {
  color: #e30713; }

address {
  font-style: normal; }

@media (max-width: 425px) {
  body {
    font-size: .8em; } }

@media (min-width: 425px) {
  body {
    font-size: .85em; } }

@media (min-width: 768px) {
  body {
    font-size: .9em; } }

@media (min-width: 992px) {
  body {
    font-size: .95em; } }

@media (min-width: 1200px) {
  body {
    font-size: 1em; } }

* {
  box-sizing: border-box;
  outline-color: #e30713; }

html.no-js .hide-on-no-js {
  display: none !important; }

html.js .hide-on-js {
  display: none !important; }

body {
  min-width: 250px;
  background-color: #e30713; }

iframe {
  display: block;
  border: none; }

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

#browserupgrade {
  width: 100%;
  position: relative;
  margin: 0;
  padding: 1em 1em;
  z-index: 1;
  text-align: center;
  font-size: 1.2em;
  background-color: #e30713;
  color: white; }

.container {
  padding: 1em 0; }

#middle {
  position: fixed;
  top: 50%; }

@media (min-width: 768px) {
  .container {
    padding: 1em; } }

input, textarea {
  padding: 0.25em 0.5em;
  border: none;
  background-color: #111111;
  outline-color: white;
  border-radius: 5px; }
  input[type="checkbox"], textarea[type="checkbox"] {
    vertical-align: middle;
    margin-right: 0.25em; }

textarea {
  padding: 0.5em; }

label {
  font-size: 0.75em; }

form.validate input:invalid, form.validate textarea:invalid {
  outline: 5px auto #e30713; }

button,
.btn,
input[type="submit"],
textarea[type="submit"] {
  padding: 0.5em;
  border-radius: 5px;
  border: none;
  background-color: #e30713;
  color: white;
  box-shadow: 1px 1px 5px 0 black;
  transition: background-color .1s ease;
  outline-color: white; }
  button:hover,
  .btn:hover,
  input[type="submit"]:hover,
  textarea[type="submit"]:hover {
    background-color: #f82530; }
  button:active,
  .btn:active,
  input[type="submit"]:active,
  textarea[type="submit"]:active {
    outline: none;
    background-color: #b2050f; }
  button:disabled,
  .btn:disabled,
  input[type="submit"]:disabled,
  textarea[type="submit"]:disabled {
    background-color: #a7a7a7; }

.loader {
  width: 20px;
  height: 20px;
  border: 3px solid white;
  border-top: 3px solid #e30713;
  border-radius: 50%;
  animation: spin 1s linear infinite; }

@keyframes spin {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }

.arrow {
  display: inline-block;
  vertical-align: middle;
  margin: 0 0.25em;
  transition: transform .1s ease; }
  .arrow--down, .arrow--up {
    border-left: 0.5em solid transparent;
    border-right: 0.5em solid transparent;
    border-top: 0.5em solid #fff; }
  .arrow--up {
    transform: scaleY(-1); }

.is-clickable, button,
.btn,
input[type="submit"], textarea[type="submit"], #header #mobile-menu-button > div {
  cursor: pointer; }

#banner {
  height: 20em;
  padding: 5em 0 2em 0;
  overflow: hidden;
  background-color: #e30713; }
  #banner .img {
    height: 100%;
    width: 100%;
    background: #e30713 url(../media/images/header.jpg) no-repeat center;
    background-size: contain; }

@media (min-width: 425px) {
  #banner {
    height: 25em; } }

@media (min-width: 768px) {
  #banner {
    height: 27em; } }

@media (min-width: 992px) {
  #banner {
    height: 32em; } }

@media (min-width: 1200px) {
  #banner {
    height: 36.5em; } }

#cookie-info {
  position: fixed;
  bottom: 0;
  width: 100%;
  padding: 1em;
  color: white;
  background-color: #212121;
  box-shadow: 0 0 10px 0 black; }
  #cookie-info a {
    color: white;
    text-decoration: underline; }

@media (min-width: 992px) {
  #cookie-info {
    bottom: 1em;
    right: 1em;
    width: 20em;
    border-radius: 5px; } }

footer {
  color: white; }
  footer .container {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background-color: #212121; }
  footer a {
    color: white;
    text-decoration: underline; }
  footer #contact-wrapper p {
    margin: 1em 0; }
  footer #contact-wrapper form .input-wrapper {
    margin: 0.5em 0; }
    footer #contact-wrapper form .input-wrapper input, footer #contact-wrapper form .input-wrapper textarea {
      width: 100%; }
  footer #contact-wrapper form textarea {
    width: 100%;
    height: 10em;
    margin: 0.5em 0;
    resize: none; }
  footer #contact-wrapper form .submit-wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 0.5em; }
    footer #contact-wrapper form .submit-wrapper input, footer #contact-wrapper form .submit-wrapper textarea {
      margin-right: 1em; }
    footer #contact-wrapper form .submit-wrapper .loader {
      -ms-flex: 0 0 20px;
      flex: 0 0 20px; }
    footer #contact-wrapper form .submit-wrapper p {
      margin: 0.5em 0 0 0; }
  footer #contact-wrapper form .g-recaptcha {
    margin-top: 1em;
    max-width: 100%;
    overflow: auto; }
  footer #address-wrapper {
    margin-top: 0.5em; }
    footer #address-wrapper address {
      margin: 1em 0; }
    footer #address-wrapper #map-preview {
      position: relative;
      z-index: 0;
      background: #111111 url(../media/images/map.png) no-repeat center;
      background-size: cover; }
      footer #address-wrapper #map-preview::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: calc(100% + 1px);
        height: calc(100% + 2px);
        margin-left: -1px;
        margin-top: -1px;
        background-color: #111111;
        opacity: 0.75;
        z-index: 1; }
      footer #address-wrapper #map-preview > div {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: center;
        justify-content: center;
        position: relative;
        z-index: 2;
        height: 100%;
        text-align: center; }
        footer #address-wrapper #map-preview > div h3 {
          margin-bottom: 0; }
      footer #address-wrapper #map-preview .copyright-info {
        position: absolute;
        bottom: 0;
        left: 0;
        max-width: 100%;
        padding: 1em;
        text-align: left;
        opacity: 0.5; }
  footer #toggle-legal-info {
    margin-top: 1em;
    margin-bottom: 0;
    font-weight: normal;
    font-style: italic;
    color: #bfbfbf; }
    footer #toggle-legal-info .arrow--down, footer #toggle-legal-info .arrow--up {
      border-top-color: #bfbfbf; }
  footer #legal-info {
    font-size: 0.875em;
    margin-top: 1em; }
    footer #legal-info .phone-number {
      display: inline-block;
      height: calc(1em + 2px);
      vertical-align: middle;
      pointer-events: none; }
  footer #imprint,
  footer #privacy-policy {
    margin-top: 2em; }

@media (min-width: 425px) {
  footer #contact-wrapper form .input-wrapper {
    width: 50%;
    float: left;
    margin: 0;
    padding: 0 0.5em; }
    footer #contact-wrapper form .input-wrapper:first-child {
      padding-left: 0; }
    footer #contact-wrapper form .input-wrapper:nth-child(2) {
      padding-right: 0; }
  footer #contact-wrapper form .submit-wrapper {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap; }
    footer #contact-wrapper form .submit-wrapper p {
      margin: 0; } }

@media (min-width: 768px) {
  footer #address-wrapper #map-preview,
  footer #address-wrapper iframe {
    width: 100%;
    height: 30em; } }

@media (min-width: 992px) {
  footer #address-wrapper {
    margin-top: 0; }
    footer #address-wrapper #map-preview,
    footer #address-wrapper iframe {
      height: 20em; } }

@media (min-width: 1200px) {
  footer #address-wrapper #map-preview,
  footer #address-wrapper iframe {
    height: 25em; } }

#header {
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 1000; }
  #header .container {
    position: relative;
    padding: 0;
    overflow: hidden;
    box-shadow: 0 0 10px 0 black;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    background-color: white; }
  #header #logo a {
    float: left; }
    #header #logo a img {
      height: 5em;
      padding: 0.75em 0; }
  #header #mobile-menu-button {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: end;
    justify-content: flex-end;
    height: 5em; }
    #header #mobile-menu-button > div {
      width: 3em;
      height: 30px;
      position: relative; }
      #header #mobile-menu-button > div span {
        position: absolute;
        height: 2px;
        width: 100%;
        background: #e30713;
        border-radius: 1px;
        left: 0;
        transition: .25s ease-in-out; }
        #header #mobile-menu-button > div span:nth-child(1) {
          top: 0px; }
        #header #mobile-menu-button > div span:nth-child(2), #header #mobile-menu-button > div span:nth-child(3) {
          top: 14px; }
        #header #mobile-menu-button > div span:nth-child(4) {
          top: 28px; }
      #header #mobile-menu-button > div.open span:nth-child(1) {
        top: 18px;
        width: 0%;
        left: 50%; }
      #header #mobile-menu-button > div.open span:nth-child(2) {
        transform: rotate(45deg); }
      #header #mobile-menu-button > div.open span:nth-child(3) {
        transform: rotate(-45deg); }
      #header #mobile-menu-button > div.open span:nth-child(4) {
        top: 18px;
        width: 0%;
        left: 50%; }
  #header #main-menu {
    display: none;
    overflow: visible !important; }
    #header #main-menu ul {
      margin: 0 -18px;
      padding: 0;
      list-style-type: none;
      border-top: solid 2px #e30713; }
      #header #main-menu ul li {
        text-align: center; }
        #header #main-menu ul li a {
          display: block;
          padding: 1.5em 0;
          transition: .25s ease-in-out;
          transition-property: color, background-color; }
          #header #main-menu ul li a:hover, #header #main-menu ul li a.active {
            color: white;
            background-color: #e30713; }

@media (min-width: 425px) {
  #header #logo a img {
    padding: 0.75em; }
  #header #main-menu ul {
    margin: 0 -54px; } }

@media (min-width: 768px) {
  #header #mobile-menu-button > div {
    margin-right: 1em; }
  #header #main-menu ul {
    margin: 0; } }

@media (min-width: 992px) {
  #header #main-menu {
    display: block !important; }
    #header #main-menu ul {
      float: right;
      border-top: none; }
      #header #main-menu ul li {
        display: inline-block; }
        #header #main-menu ul li a {
          padding: 1.9em 1em; } }

#main {
  position: relative;
  margin-top: -2em; }
  #main article {
    margin-bottom: 1em; }
  #main .container {
    border-radius: 5px;
    background-color: white;
    box-shadow: 0 0 10px 0; }
  #main #termine iframe {
    width: 100%;
    overflow: auto; }
  #main #termine #veranstaltungen,
  #main #termine #einsaetze {
    height: 100px; }
  #main #termine #dienstplan {
    height: 550px; }
  #main #fahrzeuge .vehicle {
    margin-bottom: 1em; }
    #main #fahrzeuge .vehicle .vehicle-image {
      overflow: hidden;
      margin-bottom: 1em; }
    #main #fahrzeuge .vehicle .technical-data {
      overflow: auto; }
      #main #fahrzeuge .vehicle .technical-data strong {
        width: 12em;
        display: inline-block; }

@media (min-width: 768px) {
  #main #fahrzeuge .vehicle .vehicle-image {
    margin-bottom: 0; } }