:root {
  --o: rgb(219,190,41);
  --old: #004944;
  --g: #e8e8e8;
  --b: #1a1a1a;
  --w: #fff;
  --dg: #686868;
  --mg: #bbbbbb;
  --green: #77cbb9;
  --pink: #DD5577;
  --plight: #DB9AAD;
  --glight: #8dd8c6;
  --glight2: #a3d8cb;
  --olight: #D8CA8D;
  --olight2: #D8CEA3;
}
*,
*:before,
*:after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    background: var(--b);
}

body {
    font:1.3em/135% Lato,system-ui,Sans-Serif;
    color: var(--b);
    hyphens:auto;
    background-color: var(--w);
}
h1 {
    font-weight: 900;
    line-height: 100%;
    color: var(--w);
    font-size: clamp(2em, 5vw, 5em);
    position: relative;
    text-shadow: 0px 0px 10px rgba(0,0,0,0.25);
    margin-block: 0 50px;
    font-family: Oswald;
    text-transform: uppercase;
}
h1 em {
  font-weight: 400;
  color: var(--o);
}
h1:after,h2:after {
  content: "";
  width: 1em;
  height: 10px;
  background: var(--o);
  display: block;
  margin-inline: auto;
  margin-block: 50px 0;
}
h2 {
    font-weight: 900;
    line-height: 100%;
    color: var(--b);
    font-size: clamp(1.5em, 3vw, 3em);
    position: relative;
    font-family: Oswald;
    text-transform: uppercase;
}

#header {
    border-bottom: 1px solid var(--g);
    box-shadow: 0px 5px 15px 5px rgb(26,26,26,0.15);
    position: sticky;
    top: -125px;
    z-index: 3;
    background: var(--w);
}
#header h3, #header p {
    margin: 0;
}
#header a{
    text-decoration: none;
    color: var(--o);
}
#header a:hover,#header a:focus{
    color: var(--b);
}
#header .inside {
  padding: 30px 30px 0px 30px;
}
#header .inside_header_wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-flow: row wrap;
  padding-bottom: 30px;
  gap: 30px;
}
#header .header_wrap {
   display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: row wrap;
  gap: 30px;
}
.content-image figure a, .content-image figure a img {
  display: block;
}
.header-logo-container{
}
.header-logo-container .logo-subline{
  color: var(--mg);
  font-size: 0.75em;
}
#header .header-logo-container .logo-subline a{
  color: var(--mg);
}
#header .header-logo-container .logo-subline a:hover,#header .header-logo-container .logo-subline a:focus{
    color: var(--b);
}
.header_info_wrap {
  display: flex;
  justify-content: space-evenly;
  gap: 50px;
  flex-flow: row wrap;
  font-size: 0.75em;
  font-weight: 600;
  line-height: 135%;
  color: var(--dg);
}
.header_info_wrap .content-text .rte {
  display: flex;
  justify-content: space-evenly;
  gap: 10px;
  align-items: center;
}
.header_info_wrap .content-text .rte {
  display: flex;
  justify-content: space-evenly;
  gap: 10px;
  align-items: center;
}
.header_info_wrap em::before {
  width: 2.6em;
  height: 2.6em;
  border: 2px solid var(--dg);
  border-radius: 50%;
  text-align: center;
  vertical-align: middle;
  display: inline-block;
  line-height: 2.3;
}
.header_info_wrap .content-text:hover em::before, .header_info_wrap .content-text:focus-within em::before {
  background: var(--dg);
  color: var(--w);
}
#header .mod_navigation{
  width: 100%;
  overflow: scroll;
}
#header .mod_navigation ul{
  padding: 0;
  margin: 0;
  list-style-type: none;
  display: flex;
  justify-content: start;
  align-items: center;
  gap: 1px;
  flex-flow: row;
  background: var(--w);
  border-top: 1px solid var(--g);
  overflow-x: scroll;
  min-width: 1650px;
}
#header .mod_navigation ul li a{
  padding: 20px;
  color: var(--dg);
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: center;
}
#header .mod_navigation ul li a:hover, #header .mod_navigation ul li a:focus {
  color: var(--w);
  background: var(--o);
}
.side-menu {
    display: none;
}
.mod_article {
  min-height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 50px;
}
.mod_article.no-flex {
  display: block;
}
#start {
  background: #ffffff url("/files/img/d-back.jpg") no-repeat center center;
  background-attachment: fixed;
  background-size: cover;
  color: var(--w);
  min-height: calc(100vh - 150px);
  background-position: center center;
  padding-block: 120px;
}
/*#start * {
  max-width: 100%;
  width: 100%;
}*/
#start p {
  text-shadow: 0px 0px 10px rgba(0,0,0,0.25);
  font-size: clamp(0.9em, 1.3vw, 1.3em);
  max-width: 750px;
}

#kontakt {
  min-height: auto;
  background: var(--b);
}
#kontakt * {
  width: 100%;
  max-width: 100%;
}
#kontakt .header_info_wrap {
  padding: 50px 20px;
  justify-content: center;
  align-items: center;
  flex-flow: row;
  font-size: 1em;
  color: var(--w);
}
#kontakt .header_info_wrap em::before{
  border: 2px solid var(--w);
}

#kontakt .header_info_wrap .content-text .rte{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: column;
  text-align: center;
}
#kontakt .header_info_wrap .content-text .rte p{
  margin: 0;
}
#kontakt .header_info_wrap .content-text .rte p a{
  color: var(--o);
  text-decoration: none;
}
#kontakt .header_info_wrap .content-text .rte p a:hover,#kontakt .header_info_wrap .content-text .rte p a:focus{
  color: var(--w);
}
#kontakt .header_info_wrap .content-text:hover em::before,#kontakt  .header_info_wrap .content-text:focus-within em::before {
  background: var(--w);
  color: var(--dg);
}
#karte {
  min-height: fit-content;
  min-width: fit-content;
  .embed-wrapper {
    position: relative;
    min-width: 100%;
    height: calc(-69px + 100vh);
    iframe {
      visibility: visible;
      min-width: 100vw;
      height: calc(-69px + 100vh);
      border:0px;
      position: absolute;
      top: 0px;
      left: 0px;
    }
    #overlay {
      position: absolute;
      box-sizing: border-box;
      padding:1rem;
      top: 0;
      bottom: 0;
      min-width: 100vw;
      height: calc(100vh - 69px);
      background-color: #f1f1f1;
      background-image: linear-gradient(135deg, #f1f1f1 25%, #ffffff 25%, #ffffff 50%, #f1f1f1 50%, #f1f1f1 75%, #ffffff 75%, #ffffff 100%);
      background-size: 56.57px 56.57px;
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap:1em;
      button {
        width: auto;
        background: transparent;
        border: 2px solid var(--b);
        color: var(--b);
        display: inline-block;
        padding:20px 30px;
        cursor: pointer;
        font:inherit;
        font-weight: inherit;
        border-radius:calc(1.3em + 10px);
        font-weight: 600;
        position: relative;
        z-index: 2;
        overflow: hidden;
        transition: all ease .25s;
        &:after{
          position: absolute;
          content: "";
          top: 0;
          left: 0;
          width: 0;
          height: 100%;
          background: var(--b);
          transition: all ease .25s;
          z-index: -1;
        }
        &:hover, &:focus {
          
          border: 2px solid var(--b);
          color: var(--w);
        }
        &:hover:after{
          width: 100%;
        }
      }
    }
  }
}

#zeitstrahl {
  min-height: 100vh;
  display: block;
  justify-content: center;
  align-items: center;
  padding: 50px;
}
#zeitstrahl *{
  max-width: 100%;
}
.mod_article *{
  max-width: 900px;
  margin-inline:auto;
}
.mod_article:nth-child(odd) {
  background: var(--g);
}
.ce_timelineSliderStart {
  padding: 50px 0;
  border-top: 5px solid var(--g);
}
.roadmap__navigation li{
  position: static !important;
}
.roadmap.roadmap--orientation-auto .roadmap__navigation > * a, .roadmap.roadmap--orientation-horizontal .roadmap__navigation > * a, .roadmap.roadmap--orientation-vertical .roadmap__navigation > * a{
  position: absolute !important;
  padding: 15px;
  background: transparent;
  color: var(--b);
  display: block;
  line-height: 1;
  border-radius: 10px;
}  
.roadmap .roadmap__navigation a:before, .roadmap .roadmap__navigation a:after {
  display: inline-block;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
}
.roadmap__navigation a:hover, .roadmap__navigation a:focus{
  background: var(--b) !important;
  color: var(--w) !important;
}  
.roadmap__navigation .next{
  right: 0;
}
.roadmap__navigation .prev{
  left: 0;
}
.roadmap__navigation .next:after{
  font: var(--fa-font-solid);
  content: '\f054';
}
.roadmap__navigation .prev:before{
  font: var(--fa-font-solid);
  content: '\f053';
}
.roadmap__events .event__content h3 {
  color: var(--o);
  text-transform: uppercase;
  font-weight: 900;
}
.roadmap__events .event__content .reich {
  color: var(--green);
}
.roadmap__events .event__content .international {
  color: var(--pink);
}

.swiper-container {
position: relative;
padding-block: 70px 80px;
z-index: 0;
}
.swiper-container::before {
content: "";
width: calc(100% - 100px);
height: 3px;
background: var(--dg);
  display: block;
  position: absolute;
  top: 22px;
  z-index: 2;
  opacity: 1;
  left: 50%;
  transform: translateX(-50%);
}
.custom-timeline .swiper-slide {
  text-align: center;
  position: relative;
  padding-inline: 30px;
  background: var(--plight);
  border-radius: 0.5em;
  cursor: grab;
}
.custom-timeline .swiper-slide:active {
  cursor: grabbing;
}
.custom-timeline .swiper-slide.reich {
background: var(--glight2);
}
.custom-timeline .swiper-slide.doebeln {
background: var(--olight2);
}
.custom-timeline .swiper-slide::before {
content: "";
  display: block;
  width: 3px;
  height: 48px;
  position: absolute;
  top: -48px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--dg);
}
.custom-timeline .swiper-slide::after {
  content: "";
  display: block;
  width: 15px;
  height: 15px;
  background: var(--dg);
  border-radius: 100%;
  border: 3px solid var(--dg);
  position: absolute;
  top: -54px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
}
.custom-timeline .swiper-slide p {
text-align: left;
}
.custom-timeline .swiper-slide h2 {
  font-size: 1.5em;
  margin-bottom: 0px;
}
.custom-timeline .swiper-slide h2:after {
  margin-block: 20px 0;
  height: 4px;
  background: var(--b);
}
.custom-timeline .swiper-slide h3 {
  font-size: 1.3em;
  margin-block: 12.5px 0;
}
.swiper-button-next, .swiper-button-prev{
top: 22px;
  background: var(--g);
  width: 44px;
  height: 44px;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 3px solid var(--dg);
  transition: all ease 0.3s ;
}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next{
  left:0;
}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev{
  right: 0;
}
.swiper-button-next::after, .swiper-button-prev::after{
  font-size: 1.3em;
  color: var(--dg);
  font: var(--fa-font-solid);
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
}
.swiper-button-next:hover, .swiper-button-prev:hover, .swiper-button-next:focus, .swiper-button-prev:focus{
  background: var(--dg);
}
.swiper-button-next:hover::after, .swiper-button-prevhover::after, .swiper-button-next:focus::after, .swiper-button-prev:focus::after{
  color: var(--g);
}
.swiper-button-next::after{
  content: '\f054';
}
.swiper-button-prev::after{
  content: '\f053';
}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
  opacity: 0;
  transition: all ease 0.3s ;
}
.swiper-pagination-bullet-active {
  background: var(--b);
}
.btn-lnk a {
  padding: 20px 30px;
  margin-block: 20px;
  text-decoration:none;
  color: var(--b);
  border: 2px solid var(--b);
  display: inline-block;
  border-radius: calc(1.3em + 10px);
  box-shadow: 0px 0px 15px 0 var(--g);
  font-weight: 600;
  margin-inline: 5px;
  position: relative;
  transition: all ease .25s;
  z-index: 2;
  overflow: hidden;
}
.btn-lnk a:after {
    position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: var(--b);
  transition: all .25s;
  z-index: -1;
}
.btn-lnk a:hover:after, .btn-lnk a:focus:after {
  width: 100%;
}
.btn-lnk a:hover, .btn-lnk a:focus {
  color: var(--w);
}
#start.btn-lnk a {
  width: auto;
  max-width: auto;
  border-color: var(--w);
  color: var(--w);
  box-shadow: 0px 0px 15px 0 var(--b);
}
#start.btn-lnk a:after {
  background: var(--w);
}
#start.btn-lnk a:hover, #start.btn-lnk a:focus {
  color: var(--b);
  
}
#karte {
padding: 0;
scroll-margin-top: 69px;
}

.embed-container { 
  position: relative; 
  padding-bottom: 56.25%; 
  height: 0; 
  overflow: hidden; 
  max-width: 100%; 
} 
.embed-container iframe, .embed-container object, .embed-container embed { 
  position: absolute; 
  top: 0; 
  left: 0; 
  width: 100%;
  height: 100%; 
}

.mod_article blockquote {
  margin: 0;
  background: rgba(0,0,0,0.1);
  padding: 1em;
  border-radius: 0.5em;
  width: auto;
  max-width: auto;
  font-size: 1.2em;
  font-style: italic;
  font-family: Bitter,Georgia,Lato,system-ui;
  font-weight:500;
 }
 
#auszeichnungen-foerderer {
  flex-flow: column;
}
#auszeichnungen-foerderer .content-text,
#auszeichnungen-foerderer .content-text .rte,
#auszeichnungen-foerderer .content-text .rte h2 {
  max-width: 100%;
}
.support-wrap {
  display: flex;
  flex-flow: row wrap;
  gap: 100px;
  justify-content: center;
  align-items: center;
  margin-bottom: 50px;
  max-width: 100%;
  .content-image {
    margin:0;
  }
}

#footer{
  background: var(--b);
  padding: 100px;
  color: var(--mg);
}
#footer .inside{
  max-width: 1170px;
  width: 100%;
  padding: 0 15px;
  margin: 0 auto;
  display: flex;
  flex-flow:row wrap;
  gap: 60px;
  justify-content: space-between;
  align-items: start;
}
#footer .foot-info,#footer .foot-contact,#footer .foot-logo{
  width: calc(33% - 40px);
}
#footer h3{
  font-family: Oswald,Lato,system-ui;
  text-transform: uppercase;
  font-weight:500;
}
#footer .foot-info p{
  margin: 0;
}
#footer a{
  color: var(--dg);
  text-decoration: none;
}
#footer .foot-info a{
  padding: 10px 0px;
  display: block;
  position: relative;
}
#footer a:hover, #footer a:focus{
  color: var(--g);
}
#footer .foot-info p:nth-child(2) a{
  border-top: 1px solid var(--dg);
  border-bottom: 1px solid var(--dg);
}
#footer .foot-info a:after{
  display: inline-block;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font: var(--fa-font-solid);
  content: '\f054';
  font-size: 75%;
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
}
.top-link a{
  position: fixed;
  right: 0;
  bottom: 85px;
  padding: 10px 15px;
  background: var(--o);
  color: var(--w);
  &:hover, &:focus {
    background: var(--b);
    
  }
}


@media (max-width: 1462px){
  #header {
    top: -222px;
}
}
@media (max-width: 930px){
  #header .header_info_wrap {
    display: none;
  }
  #header {
    top: -120px;
    z-index:2;
  }
  .ce_timelineSliderStart {
    overflow: visible;
  }
  .roadmap.roadmap--orientation-auto {
  margin: 0px auto;
  }
  .roadmap.roadmap--orientation-horizontal, .roadmap.roadmap--orientation-auto {
    width: 100%;
  }
  .roadmap.roadmap--orientation-auto .roadmap__events{
    width: 100%;
  }
  .roadmap.roadmap--orientation-auto .roadmap__navigation > * a, .roadmap.roadmap--orientation-horizontal .roadmap__navigation > * a, .roadmap.roadmap--orientation-vertical .roadmap__navigation > * a{
    top: 0px;
    z-index: 1;
  }
  .roadmap__navigation .prev{
    left: -30px;
  }
  .roadmap__navigation .next{
    right: -30px;
  }
  .roadmap.roadmap--orientation-auto .roadmap__events__event .event{
    width: 45%;
  }
}