/*
 * ZIS Mannheim – Stylesheet der statischen Seiten.
 *
 * Erzeugt aus den SCSS-Quellen der frueheren Symfony-Anwendung (assets/styles/)
 * und auf die tatsaechlich verwendeten Regeln reduziert. Diese Datei ist ein
 * Ergebnis, keine Quelle: bitte nicht von Hand erweitern, sondern siehe README.
 */
*, ::after, ::before {
  box-sizing: border-box;
}

body {
  margin: 0;
}

hr {
  border: 0;
  border-bottom: 1px solid #e5e5e5;
}

.center {
  text-align: center;
}

.right-align {
  text-align: right;
}

.list-reset {
  list-style: none;
  padding-left: 0;
}

.block {
  display: block;
}

.inline-block {
  display: inline-block;
}

.mt0 {
  margin-top: 0;
}

.mr1 {
  margin-right: 0.5rem;
}

.mb1 {
  margin-bottom: 0.5rem;
}

.mb2 {
  margin-bottom: 1rem;
}

.mt3 {
  margin-top: 2rem;
}

.mb3 {
  margin-bottom: 2rem;
}

.my3 {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.py1 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.pr2 {
  padding-right: 1rem;
}

.pl2 {
  padding-left: 1rem;
}

.px2 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.p3 {
  padding: 2rem;
}

.py3 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.px3 {
  padding-left: 2rem;
  padding-right: 2rem;
}

.pt4 {
  padding-top: 4rem;
}

.pb4 {
  padding-bottom: 4rem;
}
.col {
  float: left;
  box-sizing: border-box;
}

.col-8 {
  width: 66.6666666667%;
}

.col-12 {
  width: 100%;
}
@media (min-width: 48em) {
  .md-col-6 {
    width: 50%;
  }
  .md-col-10 {
    width: 83.3333333333%;
  }
  .md-col-12 {
    width: 100%;
  }
}
@media (min-width: 77em) {
  .lg-col-3 {
    width: 25%;
  }
  .lg-col-9 {
    width: 75%;
  }
}
.flex {
  display: flex;
}
@media (min-width: 48em) {
  .md-flex {
    display: flex;
  }
}
.flex-column {
  flex-direction: column;
}

.items-center {
  align-items: center;
}
.flex-auto {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
}
.relative {
  position: relative;
}

.bg-white {
  background-color: #fff;
}

.bg-green {
  background-color: #30b16e;
}

.bg-lime {
  background-color: #d9ed09;
}
@media (min-width: 48em) {
  .md-mb0 {
    margin-bottom: 0;
  }
  .md-mr1 {
    margin-right: 0.5rem;
  }
}
@media (min-width: 48em) {
  .md-p3 {
    padding: 2rem;
  }
}
@media (min-width: 77em) {
  .lg-pl0 {
    padding-left: 0;
  }
}

.box-shadow {
  box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.05);
}

.button {
  border-radius: 0.15rem;
  box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.15);
  display: inline-block;
  border: 0;
  cursor: pointer;
  font-size: 1rem;
  line-height: 1.5;
  padding: 0.75rem 3rem;
  transition: 0.3s ease all;
  text-align: center;
}
.button:hover {
  text-decoration: none;
}
.button.bg-lime:hover {
  background: #acbc07;
  transition: 0.3s ease all;
}

.bg-green {
  background: #30b16e;
}

.bg-lightblue {
  background: #ecf0f7;
}

.bg-lime {
  background: #d9ed09;
}

.bg-primary {
  background: #061843;
}

.bg-warning {
  background: #ff614d;
}

.text-black {
  color: #111;
}

.text-white {
  color: #fff;
}

.form-input {
  background: #e5e5e5;
  border: 0;
  color: #061843;
  font-size: 1rem;
  padding: 0.5rem 0.5rem;
}

.flex-auto {
  flex: 1 1 0;
  width: auto;
}

.flex-column {
  flex-direction: column;
}

.flex-container {
  max-width: 77em;
}

@media (min-width: 48em) {
  .md-flex-auto {
    flex: 1 1 0;
    width: auto;
  }
}
@media (min-width: 40em) {
  .md-flex-row {
    flex-direction: row;
  }
}
.full-width {
  width: 100%;
}

.full-height {
  height: 100%;
}
.w-4 {
  width: 4rem;
}

.z-10 {
  z-index: 10;
}

body.has-sticky-header {
  padding-top: 29%;
}
body.has-static-sticky-header {
  padding-top: 70px;
}

header {
  background: url("/images/header.jpg") no-repeat 100%/cover;
  padding-top: 29%;
  position: relative;
}
header .header-content {
  color: #fff;
  height: 100%;
  width: 100%;
}
header .header-logo a {
  width: 100%;
  z-index: 10;
}
header .header-logo p {
  color: #fff;
  line-height: 1.2;
}
header .header-overlay {
  background: rgba(6, 24, 67, 0.6);
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 2;
}
header .logo-color {
  display: none;
  max-width: 22rem;
}
header .logo-sw {
  display: block;
}

body.has-sticky-header header {
  background: none;
  box-shadow: 4px 4px 10px rgba(17, 17, 17, 0.05);
  position: fixed;
  padding-top: 70px;
  top: 0;
  width: 100%;
  z-index: 11;
}
body.has-sticky-header header .header-content {
  color: #585858;
}
body.has-sticky-header header .header-overlay {
  background-color: rgba(255, 255, 255, 0.9);
}
body.has-sticky-header header .logo-color {
  display: block;
}
body.has-sticky-header header .logo-sw {
  display: none;
}

.logo {
  max-width: 36rem;
}

.logo-footer {
  max-width: 14rem;
}

@media (min-width: 48em) {
  .md-mtn5 {
    margin-top: -5rem;
  }
}
@media (min-width: 77em) {
  .lg-mrn3 {
    margin-right: -2rem;
  }
  .lg-mln5 {
    margin-left: -5rem;
  }
}
body {
  font-family: myriad-pro, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
}

a {
  color: #385eb5;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

h1,
h2,
h3,
h4 {
  font-weight: normal;
  margin-top: 0;
}

p {
  color: #585858;
  line-height: 1.6;
}

.font-large {
  font-size: 2.275rem;
}

.text-medium {
  font-size: 1.5rem;
}

/*
 * Ergaenzung gegenueber der Symfony-Anwendung:
 * Lange, nicht umbrechbare Woerter – in der Datenschutzerklaerung sind das
 * ausgeschriebene Internetadressen – wurden auf schmalen Bildschirmen breiter
 * als das Fenster und erzeugten waagerechtes Scrollen. break-word greift nur
 * dann, wenn ein Wort allein nicht in die Zeile passt, und laesst jede bereits
 * passende Textzeile unveraendert.
 */
body {
  overflow-wrap: break-word;
}