/* archivo-black-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: "Archivo Black";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/archivo-black-v21-latin-regular.woff2") format("woff2");
  /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* lato-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: "Lato Regular";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/lato-v24-latin-regular.woff2") format("woff2");
  /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* lato-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: "Lato Bold";
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/lato-v24-latin-700.woff2") format("woff2");
  /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
:root {
  line-height: 1.5;
}

body {
  margin: 8px;
}

a {
  color: #0345bf;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

h1, h2, h3, h4, h5, figure, p, ol, ul {
  margin: 0;
}

ol[role=list], ul[role=list] {
  list-style: none;
  padding-inline: 0;
}

h1, h2, h3, h4, h5 {
  font-size: inherit;
  font-weight: inherit;
}

img {
  display: block;
  max-inline-size: 100%;
}

/******** START */
.mobile_navigation {
  display: none;
}

header {
  margin: 0 auto;
  max-width: 1600px;
}
header img {
  height: 200px;
  width: 100%;
  object-fit: cover;
}

.head {
  max-width: 1600px;
  margin: 0 auto;
  position: relative;
}
.head .slogan {
  display: inline-block;
  font-family: "Archivo Black", serif;
  color: #0345bf;
  font-size: 170%;
  line-height: 110%;
  margin-bottom: 25px;
  padding: 20px 0;
  border-bottom: 1px solid #0345bf;
  position: relative;
}
.head .slogan a {
  text-decoration: none !important;
}
.head .hamburger {
  display: none;
}

main {
  max-width: 1600px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  gap: 2%;
}
main .left {
  flex: 1 1 18%;
}
main .canvas {
  flex: 1 0 80%;
}

.navigation ul, .mobile_navigation ul {
  padding-left: 12px;
  list-style-type: none;
}
.navigation ul a, .mobile_navigation ul a {
  font-family: "Archivo Black", serif;
  font-size: 110%;
}
.navigation ul a:hover, .mobile_navigation ul a:hover {
  color: #000000;
  text-decoration: none;
}
.navigation ul span, .mobile_navigation ul span {
  font-family: "Archivo Black", serif;
  font-size: 110%;
  color: #000000;
}

.canvas {
  font-family: "Lato Regular", sans-serif;
}
.canvas figure {
  margin-bottom: 20px;
}
.canvas figure img {
  max-width: 100%;
  height: auto;
}
.canvas .intro_claim {
  font-size: 130%;
  font-family: "Lato Bold", serif;
  color: #0345bf;
  line-height: 150%;
  margin: 0 0 75px;
  padding: 0 21% 0 0;
}
.canvas h1 {
  font-size: 170%;
  font-family: "Archivo Black", serif;
  color: #0345bf;
  line-height: 190%;
  margin: 0 0 32px;
}
.canvas h2 {
  font-size: 140%;
  font-family: "Archivo Black", serif;
  color: #0345bf;
  line-height: 140%;
  margin: 0 0 10px;
}
.canvas p {
  font-size: 130%;
  font-family: "Lato Regular", sans-serif;
  color: #000000;
  line-height: 150%;
  margin: 0 0 32px;
}
.canvas p.nogap {
  margin-bottom: 10px;
}
.canvas p.titel {
  font-family: "Lato Bold", sans-serif;
  font-size: 160%;
}
.canvas ul {
  margin-bottom: 32px;
}
.canvas li {
  font-size: 130%;
  font-family: "Lato Regular", sans-serif;
  color: #000000;
  line-height: 150%;
}
.canvas .galery {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.canvas .galery img {
  width: 49.5%;
  margin-bottom: 12px;
}
.canvas .button {
  background: #0345bf;
  padding: 8px 32px;
  display: inline-block;
  border-radius: 6px;
  color: #ffffff;
  font-family: "Lato Regular", sans-serif;
  font-size: 143%;
  border: 1px solid #0345bf;
  margin-bottom: 32px;
}
.canvas .button:hover {
  text-decoration: none;
  color: #0345bf;
  background-color: #ffffff;
}

.footer {
  max-width: 1600px;
  margin: 36px auto 0;
  border-top: 1px solid #0345bf;
}
.footer .inner {
  max-width: 1600px;
  margin: 0 auto;
  font-family: "Lato Regular", sans-serif;
  padding: 36px 20px 0;
  text-align: center;
}
.footer .bold {
  font-family: "Lato Bold", sans-serif;
  font-size: 110%;
}
.footer p span {
  font-family: "Lato Bold", sans-serif;
}

.logos {
  max-width: 1600px;
  margin: 36px auto 0;
  border-top: 1px solid #0345bf;
}
.logos .inner div {
  max-width: 1600px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 60px;
  padding: 36px 20px 20px;
  flex-wrap: wrap;
}
.logos .inner div img {
  height: 140px;
  width: auto;
}
.logos .inner div img.smallerondesktop {
  height: 100px;
}
.logos .inner p {
  font-family: "Lato Bold", sans-serif;
  font-size: 120%;
  text-align: center;
  padding: 65px 0 48px;
}

@media (max-width: 1450px) {
  .head .slogan {
    display: block;
  }
}
@media (max-width: 870px) {
  main {
    display: block;
  }

  .navigation {
    display: none;
  }

  .footer .inner {
    text-align: left;
  }

  .canvas .intro_claim {
    margin-bottom: 20px;
  }

  .head .hamburger {
    display: block;
    position: absolute;
    right: 8px;
    top: 20px;
    width: 38px;
    height: auto;
    cursor: pointer;
  }

  .mobile_navigation {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 32px 8px;
    background-color: rgba(255, 255, 255, 0.97);
    box-sizing: border-box;
  }
  .mobile_navigation ul {
    padding: 0 32px 64px;
    margin-bottom: 32px;
    border-bottom: 1px solid #0345bf;
  }
  .mobile_navigation ul li a, .mobile_navigation ul li span {
    font-size: 150%;
    line-height: 185%;
  }
  .mobile_navigation img {
    position: absolute;
    top: 32px;
    right: 32px;
    width: 38px;
    height: auto;
    cursor: pointer;
  }
  .mobile_navigation.on {
    display: block;
  }
}
@media (max-width: 670px) {
  .canvas .intro_claim {
    padding: 0;
  }
}
@media (max-width: 580px) {
  header img {
    height: 100px;
  }

  .canvas .galery {
    display: block;
  }
  .canvas .galery img {
    width: 100%;
  }

  .logos .inner div img {
    height: auto;
    max-width: 100%;
  }
  .logos .inner div img.quer {
    max-width: 70%;
  }
  .logos .inner div img.smallerondesktop {
    height: auto;
  }
}
@media (max-width: 460px) {
  .button.longtext {
    padding: 12px 16px;
    border-radius: 6px;
    font-family: "Lato Regular", sans-serif;
    font-size: 122%;
    border: 1px solid #0345bf;
    margin-bottom: 32px;
  }
}
@media (max-width: 400px) {
  .logos .inner div img {
    height: auto;
    max-width: 100%;
  }
  .logos .inner div img.quer {
    max-width: 100%;
  }
}

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