@font-face {font-family: 'nunito'; src: url('fonts/Nunito/Nunito-VariableFont_wght.ttf') format('truetype'); font-style: normal; font-weight: normal;}

@font-face {font-family:'kanit'; src: url('fonts/Kanit/Kanit-Regular.ttf') format('truetype'); font-style: normal; font-weight: normal;}

body {margin:0; box-sizing: border-box; line-height: 1.7; -webkit-text-size-adjust: 100%;}

.completePage {position: relative; width: 100%; min-height: 100vh; margin:auto; display: block; max-height: fit-content; scroll-behavior: smooth;}

nav {background-color: #ffffff; padding: 0px 2%; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; position: fixed; width: 97%; top: 0; gap: 10px;}

.navbar { display: flex; flex-direction: row;  justify-content: space-between; align-items: flex-start; flex-shrink: 0; gap: 20px; width: 100%;}

.nav_link { text-decoration: none; }


.landing_page_hero{ background-image: url(Bilder/landing_page_hero_phone-min.png); background-repeat: no-repeat; background-size:cover; width: 100%; height: 100vh; margin-bottom: -50px; background-position-x:center;}

.landing_page_intro, .landing_page_jubilaum, .landing_page_unterwegs, .landing_page_routen, .landing_page_fragen, .landing_page_contact,  .historie_page_body, .unsereteam_page_body,  .contact_page_body, .cookies_page_body, .datenschutz_page_body, .impressum_page_body { margin: 50px 3%;}

.historie_page_hero, .unsereteam_page_hero, .contact_page_hero, .cookies_page_hero, .datenschutz_page_hero, .impressum_page_hero{ margin: 20px 3%;}

.landing_page_intro_container, .landing_page_jubilaum_container, .landing_page_unterwegs_container, .landing_page_routen_container, .landing_page_fragen_container, .landing_page_contact_container, .cookies_page_body_container, .datenschutz_page_container, .impressum_page_container, .contact_page_body_section, .historie_page_hero, .historie_page_body_container, .unsereteam_page_hero, .unsereteam_page_body_container, .contact_page_hero, .contact_page_body_container {padding: 0px 3%;}

.landing_page_intro_container, .landing_page_contact_container, .contact_page_body_section {display: flex; flex-direction: column; flex-wrap: nowrap; justify-content:center; align-items: center; gap: 25px;}
.landing_page_jubilaum_container, .landing_page_fragen_container {display: flex; flex-direction: column-reverse; flex-wrap: nowrap; justify-content:center; align-items: center; gap: 25px;}

.landing_page_intro_textbox, .landing_page_jubilaum_textbox, .landing_page_fragen_textbox {flex: .95 1;}

.landing_page_intro_textbox, .landing_page_jubilaum_textbox, .landing_page_unterwegs_textbox, .landing_page_fragen_textbox, .landing_page_contact_textbox, .landing_page_contact_contactpartner, .contact_page_contact_contactpartner {display: flex; flex-direction: column; align-items:center; gap: 0px; width: 100%;}

.landing_page_contact_textbox {align-items: flex-start;}

.landing_page_routen_container {width: auto; display: flex; flex-direction: column; align-items: flex-start;}

.landing_page_routen_tittle {width: 150px; height: 50px; flex-shrink: 0; border-radius: 40px 0px; background: #415449; align-self: flex-start;}

.landing_page_routen_tittle h2 {display: flex; width: 150px; height: 14px; flex-direction: column; justify-content: center; flex-shrink: 0; text-align: center;}

.landing_page_routen_linien {display: inline-flex; flex-direction: column; align-items: flex-start; gap: 0px;width: 99%; height:fit-content; flex-shrink: 0; border-radius: 0px 0px; background: transparent; padding: 10px 5px; align-self: flex-end;}

.landing_page_routen_linie_090, .landing_page_routen_linie_091, .landing_page_routen_linie_097, .landing_page_routen_linie_098, .landing_page_routen_linie_870 {display: inline-flex; justify-content: center; align-items: center; gap: 15px;}

.landing_page_contact_container, .unsereteam_page_contact_contactpartner, .contact_page_body_section {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start;}

.landing_page_contact_contactpartner, .contact_page_contact_contactpartner {width: 100%; display: flex; flex-direction: column; align-items: flex-start; gap: 25px;}

.landing_page_contact_contactpartner_indv, .unsereteam_page_contact_contactpartner_indv, .contact_page_contact_contactpartner_indv {display: inline-block; align-items: center; gap: 10px;}


.historie_page_hero, .unsereteam_page_hero, .contact_page_hero { margin-top: 80px; display: flex;flex-direction: column; align-items: flex-start; justify-content:center;}

.historie_page_hero_titlebox, .unsereteam_page_hero_titlebox, .contact_page_hero_titlebox {border-radius: 0px 88px 0px 0px; background: #415449; display: flex; width: fit-content; max-width: 100%; min-width: 100%; height: fit-content; flex-direction: column; justify-content: center; align-items: center; flex-shrink: 0; }

.historie_page_hero_titlebox h2, .unsereteam_page_hero_titlebox h2, .contact_page_hero_titlebox h2 {color: #fff; padding: 0px 20px; justify-content: center; align-items: center; flex-shrink: 0;}

.historie_page_body_section_date_and_picture {display: flex; flex-direction: row; align-items: flex-end; gap: 20px;}

.historie_page_body_section {display: flex; flex-direction: column; align-items: flex-start; gap: 10px; margin-bottom: 50px;}

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


.unsereteam_page_body_section, .contact_page_body_section {margin-bottom: 20px;}


.cookies_page_hero, .datenschutz_page_hero,.impressum_page_hero {margin-top: 100px;background-color: #B3C959;}

.cookies_page_hero h2, .datenschutz_page_hero h2,.impressum_page_hero h2 {padding: 25px;}


footer {background: #1A2F22;}

.footer_container {display: flex; flex-direction: column; align-items:flex-start;justify-content: space-between; gap: 7px; margin: 0px 3%;}

.footer_contact {display: inline-flex; flex-direction: column; align-items: flex-start; gap: 7px;}

.footer_rights {display: inline-flex; flex-direction: column; align-items: flex-start; gap: 14px; border-left: 0px solid #A9B672; margin: 0px 0px;}

.footer_contact_elements p span {padding-left: 0px;}

.footer_copyright {padding-left: 0px;}


button { width: 250px; height: 42px; flex-shrink: 0; border-radius: 74px; border: 2px solid #FFF; background: #415449; box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25); color: #FFF; text-align: center; font-family: Nunito; font-size: 16px; font-style: normal; font-weight: 500; line-height: 150%; text-decoration: none; -webkit-tap-highlight-color: transparent;}

button:hover {background: #B3C959; color: #415449; border: 2px solid #415449; font-weight: 700;}

.navbar_bild_container {width: 20%;}
.navbar_bild_container img {width: 100%; height: auto; display: block;}
.landing_page_intro_bild_container, .landing_page_jubilaum_bild_container, .landing_page_routen_bild_container, .landing_page_fragen_bild_container, .historie_page_hero_bild_container, .unsereteam_page_hero_bild_container, .contact_page_hero_bild_container {max-width: 100%;}
.landing_page_intro_bild_container img, .landing_page_jubilaum_bild_container img, .landing_page_fragen_bild_container img {width: 80%; height: auto; display: block; margin: 10px auto;}
.landing_page_routen_bild_container img {width: 100%; height: auto; display: block; margin: 10px auto;}
.historie_page_hero_bild_container img, .unsereteam_page_hero_bild_container img, .contact_page_hero_bild_container img {width: 100%; height: auto; display: block; margin: 0px auto;}
.historie_page_body_section_bild img {width: 100%; height: auto; display: block; margin: 0px auto;}

.icon {margin-right: 10px;}


.historie_page_body_section_date h1 {color: #415449; text-align: center; font-family: Kanit; font-size: 40px; font-style: normal; font-weight: 400; line-height: 75%}

h2 {font-family: Kanit; font-size: 24px; font-style: normal; font-weight: 400; line-height: 120%; color: #1A2F22; margin-bottom: 20px;}

h3 {color: #B3C959; margin: 50px 0px 10px 0px; font-family: Nunito; font-size: 16px; font-style: normal; font-weight: 600; line-height: 150%}

h4 {margin: 20px 0px 10px 0px; font-family: Nunito; font-size: 15px; font-style: normal; font-weight: 600; line-height: 150%}

.contact_name, .contactdata span, .footer_contact_elements span  {font-size: 16px;font-weight: 600;}

p, .navbar a, li {color: #1A2F22; font-family: Nunito; font-size: 14px; font-style: normal; font-weight: 400; line-height: 150%}

.linie_each {color: #1A2F22;}

.navbar a {color: #415449 !important; font-family: Nunito !important; font-size:14px; font-style: normal; font-weight: 700; line-height: normal;}
.navbar a:hover {color: #B3C959 !important;}

.footer_contact_elements .contactdata, .footer_rights_elements .contactdata {color: #B6B3B3;}

.contactdata {color: #1A2F22; font-family: Nunito; font-size: 14px; font-style: normal; font-weight: 400; line-height: 150%;  padding: 0px 0px; display: flex; flex-direction: row; align-items: center;justify-content:flex-start; gap: 7px;}

span, p a, li a {color: #B3C959;}

a {text-decoration: none;}


@media (min-width: 576px) {


.landing_page_contact_textbox h2 {align-self: center;}

.navbar_bild_container {width: 10%;}


}

@media (min-width: 768px) {

    .landing_page_hero{ background-image: url(Bilder/landing_page_hero-min.png); margin-bottom: 100px; background-position-x: left; background-attachment:fixed;}

    .historie_page_body_section_date h1 {font-size: 50px;}
    .landing_page_intro, .landing_page_jubilaum, .landing_page_unterwegs, .landing_page_routen, .landing_page_fragen, .landing_page_contact, .unsereteam_page_body,  .contact_page_body, .cookies_page_body, .datenschutz_page_body, .impressum_page_body { margin: 100px 3%;}
   .historie_page_body { margin: 20px 3%;}
  
    .landing_page_intro_container, .landing_page_jubilaum_container, .landing_page_unterwegs_container, .landing_page_routen_container, .landing_page_fragen_container, .landing_page_contact_container, .cookies_page_body_container, .datenschutz_page_container, .impressum_page_container, .contact_page_body_section, .historie_page_hero, .historie_page_body_container, .unsereteam_page_hero, .unsereteam_page_body_container, .contact_page_hero {padding: 0px 5%;}

    .contact_page_body_container {padding: 0px 0px;}
    
    .landing_page_intro_container, .landing_page_jubilaum_container, .landing_page_fragen_container, .landing_page_contact_container, .contact_page_body_section {flex-direction: row; justify-content: space-between; gap: 10%;}
    .landing_page_intro_textbox, .landing_page_jubilaum_textbox, .landing_page_unterwegs_textbox, .landing_page_fragen_textbox, .landing_page_contact_textbox, .landing_page_contact_contactpartner, .contact_page_contact_contactpartner {align-items: flex-start;}

    .landing_page_routen_tittle {width: 200px; height: 60px; border-radius: 70px 0px;}
    
    .landing_page_routen_tittle h2 {width: 200px; height: 15px;}
    
    .landing_page_routen_linien {width: 94%; padding: 10px 0px; align-self: flex-start;}

    .landing_page_contact_container, .unsereteam_page_contact_contactpartner, .contact_page_body_section {flex-direction: row; flex-wrap: nowrap;}

    .landing_page_contact_contactpartner, .contact_page_contact_contactpartner {width: 40%;}


    .historie_page_hero, .unsereteam_page_hero, .contact_page_hero {margin-top: 100px; flex-direction: row;}
    
    .historie_page_hero_titlebox, .unsereteam_page_hero_titlebox, .contact_page_hero_titlebox {max-width: 30%; min-width: 30%}
    
    .historie_page_hero_titlebox h2, .unsereteam_page_hero_titlebox h2, .contact_page_hero_titlebox h2 {padding: 10px 20px;}
    
    .historie_page_body_section_date_and_picture {flex-direction: column;}
    
    .historie_page_body_section {flex-direction: row;gap: 50px;}
    .historie_page_body_section_date_and_picture {width: 20%;}
    .historie_page_body_section_text {padding-top: 30px; width: 80%;}

    .landing_page_contact_textbox h2 {align-self: auto;}

    .landing_page_intro_bild_container, .landing_page_jubilaum_bild_container, .landing_page_fragen_bild_container {width: 35%;}
    .landing_page_intro_bild_container img, .landing_page_jubilaum_bild_container img, .landing_page_fragen_bild_container img {width: 100%; height: auto; display: block; margin: 10px auto;}

    h2 {font-size: 30px; margin-bottom: 10px;}
    
    h3 {margin: 80px 0px 25px 0px; font-size: 20px;}
    
    h4 {margin: 50px 0px 10px 0px; font-size: 16px;}
    
    .contact_name, .contactdata span, .footer_contact_elements span  {font-size: 18px;}
    
    p, .navbar a, li {font-size: 16px;}
    
    .navbar a {padding-left: 50px !important;}
    
    .contactdata {font-size: 16px; padding: 0px 20px;}


}




@media (min-width: 992px) {

    nav {flex-direction: row; align-items: center; gap: 20px;}

    .navbar { align-items: flex-end; width: 50%;}
    
    .landing_page_intro, .landing_page_jubilaum, .landing_page_unterwegs, .landing_page_routen, .landing_page_fragen, .landing_page_contact, .cookies_page_body, .datenschutz_page_body, .impressum_page_body { margin: 150px 5%;}

    .historie_page_body{ margin: 0px 5% 150px 5%;}
   .unsereteam_page_body { margin: 90px 5% 150px 5%;}
    .contact_page_body { margin: 75px 5% 150px 5%;}
    
    .historie_page_hero, .unsereteam_page_hero, .contact_page_hero, .cookies_page_hero, .datenschutz_page_hero, .impressum_page_hero{ margin: 50px 5%;}
    
    .landing_page_intro_container, .landing_page_jubilaum_container, .landing_page_unterwegs_container, .landing_page_routen_container, .landing_page_fragen_container, .landing_page_contact_container, .cookies_page_body_container, .datenschutz_page_container, .impressum_page_container, .contact_page_body_section, .historie_page_hero, .historie_page_body_container, .unsereteam_page_hero, .unsereteam_page_body_container, .contact_page_hero {padding: 0px 5%;}

 .contact_page_body_container {padding: 0px 0px;}

    .landing_page_intro_textbox, .landing_page_jubilaum_textbox, .landing_page_unterwegs_textbox, .landing_page_fragen_textbox, .landing_page_contact_textbox, .landing_page_contact_contactpartner, .contact_page_contact_contactpartner {gap: 16px;}
    
    .landing_page_routen_container {align-items: center; max-width:fit-content;}
    
    .landing_page_routen_tittle {width: 241px; height: 90px; background: #415449;}
    
    .landing_page_routen_tittle h2 {width: 241px; height: 30px;}

    .landing_page_routen_linien {width: fit-content; height:fit-content; border-radius: 88px 0px; background: #415449;  padding: 16px 50px; align-self: flex-end;}
    

    .landing_page_contact_container, .unsereteam_page_contact_contactpartner, .contact_page_body_section {align-items: center;}
    
    .landing_page_contact_contactpartner_indv, .unsereteam_page_contact_contactpartner_indv, .contact_page_contact_contactpartner_indv {display: inline-flex; gap: 40px;}
    
    
    .historie_page_hero_titlebox, .unsereteam_page_hero_titlebox, .contact_page_hero_titlebox {border-radius: 0px 0px 88px 0px; max-width: 50%; min-width: 50%;}
    
    .historie_page_hero_titlebox h2, .unsereteam_page_hero_titlebox h2, .contact_page_hero_titlebox h2 {padding: 50px 50px;}
    
    .historie_page_body_section {display: inline-flex; margin-bottom: 180px;}
    
    .unsereteam_page_body_section, .contact_page_body_section {margin-bottom: 100px;}
      
    .footer_container {flex-direction: row; align-items:last baseline;}
    
    .footer_rights {border-left: 2px solid #A9B672; margin: 50px 0px;}
    
    .footer_contact_elements p span {padding-left: 20px;}
    
    .footer_copyright {padding-left: auto;}
    
    
    button {width: 291px; height: 58px; font-size: 18px;}
    
    .navbar_bild_container {width: 100px;}
    
    .historie_page_body_section_date h1 {font-size: 62px;}
    
    h2 {font-size: 38px;}
    
    h3 {font-size: 26px;}
    
    h4 {font-size: 18px;}
    
    .contact_name, .contactdata span, .footer_contact_elements span  {font-size: 22px;}
    
    p, .navbar a, li {font-size: 18px;}
    
    .contactdata {font-size: 18px;}
 
    .linie_each {color: #fff;}

}

@media (min-width: 1440px) {

    .landing_page_intro, .landing_page_jubilaum, .landing_page_unterwegs, .landing_page_routen, .landing_page_fragen, .landing_page_contact, .cookies_page_body, .datenschutz_page_body, .impressum_page_body { margin: 150px 15%;}

    .historie_page_body{ margin: 0px 15% 150px 15%;}
   .unsereteam_page_body { margin: 90px 15% 150px 15%;}
    .contact_page_body { margin: 75px 15% 150px 15%;}
    
    .historie_page_hero, .unsereteam_page_hero, .contact_page_hero, .cookies_page_hero, .datenschutz_page_hero, .impressum_page_hero{ margin: 120px 15% 0px 15%;}
    
    .footer_container {flex-direction: row; align-items:last baseline; padding: auto 15%;}
    


 

}