@import url(initcss.css);
/* barlow-regular - latin */
@font-face {
  font-display: swap;
  /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/barlow-v12-latin-regular.woff2") format("woff2");
  /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ }
/* barlow-500 - latin */
@font-face {
  font-display: swap;
  /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 500;
  src: url("../fonts/barlow-v12-latin-500.woff2") format("woff2");
  /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ }
/* barlow-700 - latin */
@font-face {
  font-display: swap;
  /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/barlow-v12-latin-700.woff2") format("woff2");
  /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ }
/* barlow-900 - latin */
@font-face {
  font-display: swap;
  /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 900;
  src: url("../fonts/barlow-v12-latin-900.woff2") format("woff2");
  /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ }
/*Margin Classes

 */
.margin-full {
  margin-top: 50px;
  margin-bottom: 50px; }
  @media (min-width: 767px) {
    .margin-full {
      margin-top: 75px;
      margin-bottom: 75px; } }
  @media (min-width: 1024px) {
    .margin-full {
      margin-bottom: 100px;
      margin-top: 100px; } }

.margin-top {
  margin-top: 50px; }
  @media (min-width: 767px) {
    .margin-top {
      margin-top: 75px; } }
  @media (min-width: 1024px) {
    .margin-top {
      margin-top: 100px; } }

.margin-bottom {
  margin-bottom: 50px; }
  @media (min-width: 767px) {
    .margin-bottom {
      margin-bottom: 75px; } }
  @media (min-width: 1024px) {
    .margin-bottom {
      margin-bottom: 100px; } }

.padding-top {
  padding-top: 50px; }
  @media (min-width: 767px) {
    .padding-top {
      padding-top: 75px; } }
  @media (min-width: 1024px) {
    .padding-top {
      padding-top: 100px; } }

.padding-bottom {
  padding-bottom: 50px; }
  @media (min-width: 767px) {
    .padding-bottom {
      padding-bottom: 75px; } }
  @media (min-width: 1024px) {
    .padding-bottom {
      padding-bottom: 100px; } }

.padding-full {
  padding-top: 50px;
  padding-bottom: 50px; }
  @media (min-width: 767px) {
    .padding-full {
      padding-top: 75px;
      padding-bottom: 75px; } }
  @media (min-width: 1024px) {
    .padding-full {
      padding-bottom: 100px;
      padding-top: 100px; } }

/**Farben*/
:root {
  --white: #ffffff;
  --body-bg: #304654;
  --contenbox-bg: #435C6B;
  --margin: 25px; }
  @media (min-width: 767px) {
    :root {
      --margin: 35px; } }

html {
  overscroll-behavior: none; }

body {
  font-size: 16px;
  background-color: var(--body-bg);
  font-family: "Barlow", sans-serif;
  width: 100%; }
  body header {
    text-align: center; }
    body header ul {
      list-style-type: none;
      padding: 0;
      display: grid;
      justify-content: center;
      grid-template-columns: 25px 25px;
      gap: 26px;
      padding-block-start: 20px; }
      @media (min-width: 767px) {
        body header ul {
          padding-block-start: 50px;
          gap: 24px; } }
      body header ul li {
        color: var(--white);
        cursor: pointer; }
      body header ul li.isactive {
        text-decoration: underline; }

.maincontent {
  display: -ms-grid;
  display: grid;
  position: relative;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  -webkit-padding-before: 100px;
  padding-block-start: 55px;
  padding-inline: 13px;
  height: 100%; }
  @media (min-width: 767px) {
    .maincontent {
      padding-inline: 21px;
      -webkit-padding-before: 115px;
      padding-block-start: 115px; } }

.logo {
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
  --maxwidth: 250px; }
  @media (min-width: 767px) {
    .logo {
      --maxwidth: 351px; } }
  @media (min-width: 1200px) {
    .logo {
      --maxwidth: 451px; } }
  .logo img {
    width: 100%;
    height: auto;
    max-width: var(--maxwidth);
    margin: 0 auto; }

.hintcontent {
  --fontsize: 2rem;
  --lineheight: 1.5;
  --conmaxwidth: 600px;
  --marginbs: 30px;
  margin-inline: auto;
  font-weight: 300;
  max-width: var(--conmaxwidth);
  margin: var(--marginbs) auto; }
  @media (min-width: 767px) {
    .hintcontent {
      --fontsize: 2rem;
      --marginbs: 100px; } }
  @media (min-width: 1200px) {
    .hintcontent {
      --fontsize: 2rem;
      --marginbs: 100px; } }
  .hintcontent h1 {
    font-family: 'Barlow', sans-serif;
    font-size: var(--fontsize);
    line-height: var(--lineheight);
    color: var(--white);
    font-weight: 500;
    text-align: center;
    max-width: 670px;
    margin-bottom: 3rem; }
  .hintcontent p, .hintcontent a {
    text-align: center;
    color: var(--white);
    font-size: 1rem;
    line-height: 1.25; }

p#infocontent {
  margin-bottom: 1rem; }

.contentbox {
  color: var(--white);
  background-color: var(--contenbox-bg);
  padding: 25px; }
  .contentbox p {
    font-size: 1rem;
    line-height: 1.25rem;
    padding-block-end: 20px; }
    @media (min-width: 767px) {
      .contentbox p {
        line-height: 1.5625rem;
        padding-block-end: 25px; } }
  .contentbox p:last-of-type {
    padding-block-end: 0px; }
  .contentbox a {
    color: var(--white); }
  @media (min-width: 767px) {
    .contentbox {
      padding: 35px; } }
  @media (min-width: 1024px) {
    .contentbox {
      padding: 35px 50px; } }

.firstcontentbox {
  margin-block-end: 25px; }
  @media (min-width: 767px) {
    .firstcontentbox {
      margin-block-end: 0px; } }

.secondcontentbox {
  margin-block-end: 75px; }
  @media (min-width: 767px) {
    .secondcontentbox {
      margin-block-end: 0px; } }

@media (min-width: 767px) {
  .gridrow {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 320px;
    gap: 0 25px;
    margin-block-end: 207px; } }
@media (min-width: 1024px) {
  .gridrow {
    max-width: 900px;
    margin-inline: auto;
    margin-block-end: 123px; } }

.innercontent {
  opacity: 0;
  -webkit-animation: fadeIn 1s linear;
  animation: fadeIn 1s linear;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-delay: .5s;
  animation-delay: .5s; }

@-webkit-keyframes fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
@keyframes fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

/*# sourceMappingURL=master.css.map */
