@charset "UTF-8";
.inner-container {
  width: 1040px;
}
@media (max-width: 425px) {
  .inner-container {
    padding: 10px;
    width: 100%;
    word-break: break-word;
  }
}
@media (max-width: 1040px) {
  .inner-container {
    padding: 10px;
  }
}

.container {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media (max-width: 425px) {
  .container {
    margin-bottom: 20px;
  }
}
.container a {
  text-decoration: none;
  color: #003559;
}

body {
  font-family: "PT Sans", sans-serif;
  font-size: 18px;
  margin: 0px;
  color: #003559;
  background-color: white;
}

h2 {
  color: #003559;
  margin-top: 10px;
  margin-bottom: 20px;
  font-family: "Bodoni Moda";
  font-size: 36px;
  font-style: italic;
  font-weight: 900;
  line-height: normal;
}

h3 {
  color: #003559;
  /* Titel 3 */
  font-family: "PT Sans", sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.preussisch-blau-bg {
  background-color: #003559;
  color: white;
}

.perlen-lila-bg {
  background-color: #aeb4dd;
}

.kapuzinerkresse-bg {
  background-color: #F4973D;
}

.dunkle-kapuzinerkresse-bg {
  background-color: #ae4f3a;
}

.smaragdgrün-bg {
  background-color: #47a78b;
}
.smaragdgrün-bg h2, .smaragdgrün-bg h4, .smaragdgrün-bg p, .smaragdgrün-bg .inner-container {
  color: white !important;
}

.smaragdgruen-bg {
  background-color: #47a78b;
}
.smaragdgruen-bg h2, .smaragdgruen-bg h4, .smaragdgruen-bg p, .smaragdgruen-bg .inner-container {
  color: white !important;
}

.smaragdgruen-font h2, .smaragdgruen-font h4, .smaragdgruen-font p, .smaragdgruen-font .inner-container {
  color: white !important;
}

.dunkles-smaragdgrün-bg {
  background-color: #327662;
}
.dunkles-smaragdgrün-bg h2, .dunkles-smaragdgrün-bg h4, .dunkles-smaragdgrün-bg p {
  color: white;
}

.preussisch-blau {
  color: #003559 !important;
}

.perlen-lila {
  color: #aeb4dd !important;
}

.timeline-content:has(.perlen-lila-bg) {
  background-color: #aeb4dd !important;
  background: #aeb4dd !important;
}

.kapuzinerkresse {
  color: #F4973D;
}

.dunkle-kapuzinerkresse {
  color: #ae4f3a !important;
}

.smaragdgrün {
  color: #47a78b !important;
}

.dunkles-smaragdgrün {
  color: #327662 !important;
}

.flex-v-d {
  display: flex;
  flex-wrap: wrap;
}

.flex-h-d {
  display: flex;
  flex-direction: column;
}

.col-d-50 {
  width: 50%;
}
@media (max-width: 425px) {
  .col-d-50 {
    width: 100%;
  }
}

.col-d-100 {
  width: 100%;
}

.rel-position {
  position: relative;
}

.wp-block-button {
  border-radius: 8px;
  background: #003559;
  color: white;
  border: none;
}

.wp-block-button:hover {
  background: #F4973D;
  color: #003559;
}
.wp-block-button:hover a {
  background: #F4973D;
  color: #003559;
}

.wp-block-button:focus {
  outline: 2px solid #003559; /* Sets the outline color and style */
  outline-offset: 5px;
}

.wp-block-button a {
  background: #003559;
  font-family: "PT Sans", sans-serif;
  color: white;
  padding: 10px !important;
}

.grand-padding {
  padding: 50px 0px;
}

.medium-padding {
  padding: 30px 0px;
}

.small-padding {
  padding: 20px 0px;
}

.none-padding {
  padding: 0px 0px;
}

.partners .details-link {
  width: 100%;
  text-align: right;
}
.partners .details-link a:hover {
  color: #003559;
}
.partners .details-link a {
  text-align: right;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  color: #FFF;
}

.none-margin {
  margin-bottom: 0px !important;
}

.small-margin {
  margin-bottom: 20px !important;
}

.medium-margin {
  margin-bottom: 40px !important;
}

.big-margin {
  margin-bottom: 60px !important;
}

.card-image img {
  width: 100% !important;
  height: 282px !important;
  object-fit: cover !important;
}

.details-link a {
  color: #003559;
  text-decoration: none;
  font-weight: bold;
}

.timeline__content {
  border-radius: 50% !important;
  aspect-ratio: 1;
  display: flex !important;
  align-items: center !important;
  flex-direction: column !important;
  justify-content: center !important;
}
.timeline__content p {
  text-align: center;
}
.timeline__content:before {
  display: none;
}
.timeline__content:after {
  display: none;
}

.timeline__item--bottom .timeline__content {
  transform: translateY(-29%);
  z-index: 0;
}
@media (max-width: 425px) {
  .timeline__item--bottom .timeline__content {
    transform: translateY(0%);
  }
}

.timeline__item--top .timeline__content {
  transform: translateY(29%);
  z-index: 0;
}
@media (max-width: 425px) {
  .timeline__item--top .timeline__content {
    transform: translateY(0%);
  }
}

.nav-open-container {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: space-between;
  height: 100%;
}

.hero-wrapper {
  display: flex;
}
.hero-wrapper .hero-content {
  width: 100%;
  position: relative;
  height: 500px;
}
.hero-wrapper .hero-image {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 500px;
  object-fit: cover;
}
.hero-wrapper .hero-title {
  position: absolute;
  bottom: 20px;
  left: 20px;
}

.extended-menue {
  display: none;
}

.top-nav {
  position: relative;
  background-color: white;
  display: flex;
  justify-content: center;
  padding: 20px 0px;
  color: #003559;
}

.top-nav-start {
  padding: 20px 0px;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 100;
  color: white;
  transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out, padding 0.3s ease-in-out;
}

.top-nav-start.sticky, .top-nav.sticky {
  position: fixed;
  width: 100%;
  top: 0; /* Sticks to the top of the viewport */
  background-color: #fff; /* Example: different background for sticky */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Subtle shadow */
  padding: 10px 0; /* Example: slightly reduced padding when sticky */
  z-index: 100;
  color: #003559;
}

.top-nav-start > .bar-menue {
  color: white;
  font-size: 34px;
}

.top-nav-start.sticky > .bar-menue, .top-nav.sticky > .bar-menue {
  color: #003559;
  font-size: 34px;
}

.top-nav-start > .inner-container, .top-nav > .inner-container {
  display: flex;
  justify-content: space-between;
}

/*
.bar-menue{
    position: absolute;
    right: 20px;
    top:10px;
}*/
.logo object, .logo img, .logo svg {
  height: 50px;
}
@media (max-width: 425px) {
  .logo object, .logo img, .logo svg {
    height: 30px;
  }
}

.hidden-menu-container .logo {
  margin-top: 20px;
}

.hidden-menu-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #003559; /* Background color of the menu */
  z-index: 200; /* Lower than bar-menu when closed, higher when open */
  /* Initially hidden using clip-path */
  clip-path: circle(0% at 100% 0%); /* Starts as a tiny circle at top-right */
  -webkit-clip-path: circle(0% at 100% 0%); /* For WebKit browsers */
  transition: clip-path 0.7s ease-in-out, -webkit-clip-path 0.7s ease-in-out; /* Transition duration and easing */
  visibility: hidden; /* Hide element completely when closed */
  opacity: 0; /* Also hide visually */
  transition-delay: 0s, 0s, 0.7s, 0.7s; /* Delay visibility/opacity change until after clip-path animation starts */
  min-height: 100vh;
  min-height: 100dvh;
  overflow-y: scroll;
}

/* Styles for when the menu is open */
.hidden-menu-container.open {
  clip-path: circle(150% at 100% 0%); /* Expands to cover the whole screen from top-right */
  -webkit-clip-path: circle(150% at 100% 0%);
  visibility: visible;
  opacity: 1;
  transition-delay: 0s, 0s, 0s, 0s; /* No delay when opening */
}

/* Menu list styles */
.hidden-menu-container nav ul {
  list-style: none;
  padding: 0;
  margin: 0;
  padding-top: 100px;
}

.hidden-menu-container nav li {
  margin: 20px 0;
  font-size: 2em;
  opacity: 0; /* Initially hidden */
  transform: translateY(20px); /* Slightly move down */
  transition: opacity 0.3s ease-out, transform 0.3s ease-out;
}
@media (max-width: 425px) {
  .hidden-menu-container nav li {
    font-size: 1.5em;
  }
}

.hidden-menu-container.open nav li {
  opacity: 1;
  transform: translateY(0);
}

/* Add staggered delay for list items */
.hidden-menu-container.open nav li:nth-child(1) {
  transition-delay: 0.5s;
}

.hidden-menu-container.open nav li:nth-child(2) {
  transition-delay: 0.6s;
}

.hidden-menu-container.open nav li:nth-child(3) {
  transition-delay: 0.7s;
}

.hidden-menu-container.open nav li:nth-child(4) {
  transition-delay: 0.8s;
}

.hidden-menu-container.open nav li:nth-child(5) {
  transition-delay: 0.9s;
}

.hidden-menu-container nav a {
  color: white;
  text-decoration: none;
  font-weight: bold;
  transition: color 0.3s ease;
}

.hidden-menu-container nav a:hover {
  color: #F4973D; /* Orange on hover */
}

/* Close button styles */
.close-menu {
  position: absolute;
  top: 20px;
  right: 20px;
  background: none;
  border: 2px solid white;
  color: white;
  font-size: 1.5em;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: background-color 0.3s ease, color 0.3s ease;
  z-index: 11; /* Ensure it's above everything */
  opacity: 0; /* Initially hidden */
  transform: scale(0.8);
  transition: opacity 0.3s ease-out, transform 0.3s ease-out;
}

.hidden-menu-container.open .close-menu {
  opacity: 1;
  transform: scale(1);
  transition-delay: 0.4s; /* Appear slightly after menu opens */
}

.close-menu:hover {
  background-color: white;
  color: #003559;
}

.top-links {
  color: #FFF;
  /* Menu-Over */
  font-family: "Bodoni Moda";
  font-size: 24px;
  font-style: italic;
  font-weight: 900;
  line-height: normal;
}
@media (max-width: 425px) {
  .top-links {
    font-size: 16px;
  }
}

.bottom-links {
  color: #FFF;
  /* Button */
  font-family: "PT Sans", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.nav-container {
  display: block;
  height: 90%;
}
.nav-container .inner-container {
  height: 100%;
}
.nav-container .inner-container .top-links, .nav-container .inner-container .bottom-links {
  padding: 0;
}
@media (min-width: 425px) {
  .nav-container .inner-container {
    padding: 20px;
  }
}

.footer-wrapper {
  display: flex;
  justify-content: center;
  width: 100%;
  background-color: #003559; /* This will be the color of your circle */
  -webkit-clip-path: circle(3000px at 500px 3000px); /* For WebKit browsers */
  clip-path: circle(3000px at 500px 3000px);
  overflow: visible;
  color: white;
  text-decoration: none;
  overflow: visible;
  min-height: 700px;
}
@media (max-width: 425px) {
  .footer-wrapper {
    -webkit-clip-path: unset; /* For WebKit browsers */
    clip-path: unset;
    background-color: white; /* This will be the color of your circle */
  }
}

.footer-container {
  width: 1040px;
  display: flex;
  flex-direction: column;
  list-style: none;
}
@media (max-width: 425px) {
  .footer-container {
    width: 100%;
    flex-wrap: wrap;
  }
}
.footer-container h3 {
  color: #FFF;
  /* Titel 3 */
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  margin-top: unset;
}
@media (max-width: 425px) {
  .footer-container h3 {
    margin-top: 60px;
  }
}
.footer-container ul {
  list-style: none;
}
@media (max-width: 425px) {
  .footer-container ul {
    margin: 0;
    padding: 0;
  }
}
.footer-container a {
  text-decoration: none;
  color: white;
}
.footer-container p {
  color: #FFF;
  /* Fließtext */
  font-family: "PT Sans", sans-serif;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.footer-intro {
  margin-top: 40px;
}
@media (max-width: 425px) {
  .footer-intro {
    padding-top: 20px;
    width: 100%;
    padding: 10px;
    background-color: #003559; /* This will be the color of your circle */
    -webkit-clip-path: circle(300px at 123px 300px); /* For WebKit browsers */
    clip-path: circle(300px at 123px 300px);
  }
}

.footer-links {
  display: flex;
  gap: 30px;
}
@media (max-width: 425px) {
  .footer-links {
    flex-wrap: wrap;
    gap: 0;
    width: 100%;
    padding: 10px;
    background-color: #003559; /* This will be the color of your circle */
  }
}

.footer-column {
  width: 32%;
}
@media (max-width: 425px) {
  .footer-column {
    width: 100%;
    margin-bottom: 30px;
  }
}

.footer-right-links {
  margin-bottom: 10px;
}

.footer-right-links {
  font-size: 18px; /* changed from 24px to 18px Juanca*/
}

.footer-left-links {
  margin-bottom: 10px;
  display: block;
  font-size: 18px; /* changed from 24px to 18px Juanca*/
}

#footer {
  padding-top: 30px;
  overflow: hidden;
}

#content {
  overflow: hidden;
}

.presse-download {
  background-color: #003559;
  color: white;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.presse-download a {
  color: white;
  padding: 10px;
  text-decoration: none;
  border: 1px solid white;
}

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