﻿@font-face {
    font-family: 'Aviator-Bold';
    src: url('../fonts/Aviator-Bold.woff2') format('woff2'),
        url('../fonts/Aviator-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Aviator-Regular';
    src: url('../fonts/Aviator-Regular.woff2') format('woff2'),
        url('../fonts/Aviator-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Corbel';
    src: url('../fonts/Corbel.woff2') format('woff2'),
        url('../fonts/Corbel.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Corbel-Bold';
    src: url('../fonts/Corbel-Bold.woff2') format('woff2'),
        url('../fonts/Corbel-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Corbel-Italic';
    src: url('../fonts/Corbel-Italic.woff2') format('woff2'),
        url('../fonts/Corbel-Italic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'CorbelLight';
    src: url('../fonts/CorbelLight.woff2') format('woff2'),
        url('../fonts/CorbelLight.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'CorbelLight-Italic';
    src: url('../fonts/CorbelLight-Italic.woff2') format('woff2'),
        url('../fonts/CorbelLight-Italic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Corbel-BoldItalic';
    src: url('../fonts/Corbel-BoldItalic.woff2') format('woff2'),
        url('../fonts/Corbel-BoldItalic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
body{
    margin: 0;
    padding: 0;
    background: rgb(255,255,255);
    font-family: 'Corbel', sans-serif;
    color: #4D4D4D;
    font-size: 1.15rem;
}
ul{
    list-style: url(../images/li.png)
}

h1{
    margin: 1.5rem 0 1.5rem 0;
    padding: 0;
    color:#387F3D;
    position: relative;
    text-align: center;
    font-weight: 600;
    font-style: normal;
    font-size: 2.2rem;
    font-family: 'Aviator-Regular',sans-serif;
}
h1 span{
    position: relative;
}

/*h1 span::after{
  content: "";
width: 60px;
height: 4px;
background: #58A6DA;
position: absolute;
left: 3px;
bottom: -5px;
}
*/
h2{
    margin: 1rem 0 1rem 0;
    padding: 0;
    color: #387F3D;
    font-weight: 500;
    font-style: normal;
    font-size: 1.8rem;
    font-family: 'Aviator-Regular',sans-serif;
}
.beschreibung h2{
    margin-top: 0;
}

h1::before,h2::before,h3::before{
  content: "";
  display: block;
  clear: both;
}
h3{
    margin: 1.5rem 0 1.5rem 0;
    padding: 0;
    color: #387F3D;
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    font-size: 1.7rem;
    font-family: 'Aviator-Regular',sans-serif;
    text-align: center;

}
h3 span{
    border-bottom: 2px solid #387F3D;
    padding: 0.3rem;
}

h3.tagebuch{
  margin: 0rem 0 0 0;
  padding: 1.6rem 2rem 0 0;
    color: #387F3D;
    font-weight: normal;
    font-size: 1.5rem;
    font-family: 'Corbel-Bold',sans-serif;
    position: relative;
    text-align: right;
    }

.datum h3::after {
  content: "";
  width: 18px;
  height: 18px;
  border: 1px solid #000;
  background: #70cde3;
  border-radius: 0%;
  position: absolute;
  top: 2rem;
  right: -9px;
  transition: all 0.5s ease-in;
  -moz-transition: all 0.5s ease-in;
  -webkit-transition: all 0.5s ease-in;
  -o-transition: all 0.5s ease-in;
}
@media (max-width:800px){
    h3.tagebuch{
        text-align: left;
    }

  .datum h3::after{
      display: none;
  }

}
h4{
    font-family: 'Corbel-Bold';
    font-size: 1.5rem;
    color: #387f3d;
}

.clear:hover .datum h3::after {
  background: #319418;
  width: 18px;
  height: 18px;
   border-radius: 5px;
}
h3.tagebuch span {
  /*border-bottom: 5px solid #908E8D;*/
}
@media (max-width:800px){
   h3.tagebuch span::after{
       display: none;
   }

}

 h3.tagebuch span::after{
  content:'';
  border: 1px dotted #908E8D;
  top: 2.5rem;
  right: 0;
  width: 2rem;
  position: absolute;
 }

p{
    line-height: 160%;
   }
p.readmore a{
    color: #fff;
    background: #387F3D;
    position: relative;
padding: 8px;
display: inline-block;
margin: 0;
letter-spacing: 1px;
text-decoration: none;
transition: all 400ms ease-out;
-moz-transition: all 400ms ease-out;
-webkit-transition: all 400ms ease-out;
-o-transition: all 400ms ease-out;
}
p.readmore a:hover{
    background: #70cde3;
    color: #8F8D8D;
}



strong{
    font-family:'Corbel-Bold', sans-serif;
}
em{
   font-family:'Corbel-Italic', sans-serif;
}

hr{
     border: 0;
  height: 4px;
    background: linear-gradient(to right, transparent, #00c6ff, #0072ff, transparent);
    margin-bottom: 2rem;
  margin-top: 2rem;
  clear: both;
}
.slogan hr{
    margin: 0;
}
.clear{

}

.clear::after{
    display: block;
content: " ";
clear: both;
height: 0;
overflow: hidden;

}
img{
    max-width: 100%;
  height: auto;
}

img.randunten{
  border-bottom: 5px solid #387F3D;
  height: auto;
}

.abstand{
    margin-bottom: 4.5rem;
    margin-top: 4.5rem;
    position: relative;
}
.abstand img{
    height: auto;
}
 /*--------Bilder rechts- und linksbuendig-------*/
.rechtsbuendig, .linksbuendig{
   width: 30%;
    height: auto;
position: relative;
box-sizing: border-box;
padding:.5rem;
border: 1px solid rgba(221, 221, 221, 1);
font-size: 0.9rem;
}
.rechtsbuendig{
    float: right;
    margin: 0rem 0 .5rem 1.5rem;
}
.linksbuendig{
    float: left;
    margin: 0rem 1.5rem .5rem 0;
}
.rechtsbuendig img, .linksbuendig img, .rechtsbuendig video, .linksbuendig video{
    width: 100%;
    height: auto;
    box-sizing: border-box;
    display: block;
   border: 1px solid #387F3D;
}
@media (max-width:800px){
   .rechtsbuendig, .linksbuendig{
       width: 100%;
       display: block;
       float: none;
       margin: 0;
   }
 }
.bilder {
  -webkit-column-count: 4;
  -webkit-column-gap: 1rem;
  -moz-column-count: 4;
  -moz-column-gap: 1rem;
  -o-column-count: 4;
 -o-column-gap: 1rem;
  column-count: 4;
  column-gap: 1rem;

}
.bilder div, .bilder p{
border: 1px solid rgba(221, 221, 221, 1);
  padding: 0.5rem;
  box-sizing: border-box;
  position: relative;
  margin-bottom: 1rem;
  text-align: center;
  display: inline-block;
}

.bilder a::after, a.zoom::after{
position: absolute;
display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
  text-align: center;
  content:'';
  background: rgba(255,255,255,0) url(../images/lupe.png);
  top: 1rem;
  left: 1rem;
  bottom: 1rem;
  right: 1rem;
  opacity: 0;
}
.bilder a:hover::after, a.zoom:hover::after{
position: absolute;
   display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
  text-align: center;
  content: url(../images/lupe.png);
  background: rgba(255,255,255,0.7);
  top: 1rem;
  left: 1rem;
  bottom: 1rem;
  right: 1rem;
  opacity: 1;
}
.bilder span{
  padding-left: 10px;
}
a.zoom{
   display: block;
}

@media (max-width:800px){
  .bilder {
  -webkit-column-count: 1;
  -webkit-column-width: 100%;
  -webkit-column-gap: 0px;
  -webkit-column-rule: 0px choose rgba(25,11,136,0.5);
  -moz-column-count: 1;
  -moz-column-width: 100%;
  -moz-column-gap: 0px;
  -moz-column-rule: 0px choose rgba(25,11,136,0.5);
  -o-column-count: 1;
  -o-column-width: 100%;
  -o-column-gap: 0px;
  -o-column-rule: 0px choose rgba(25,11,136,0.5);
  column-count: 1;
  column-width: 100%;
  column-gap: 0px;
  column-rule: 0px choose rgba(25,11,136,0.5);
  box-sizing: border-box;
}
}
.bilder img, .bilder video {
/*  - border: 8px solid #fff;
    border-radius: 5px;
  webkit-box-shadow:  0 0 0 1px rgba(53,56,56,1);
-moz-box-shadow:  0 0 0 1px rgba(53,56,56,1);
box-shadow:  0 0 0 1px rgba(53,56,56,1); */
height: auto;
width: 100%;
box-sizing: border-box;
  position: relative;
  display:inline-block;
}
.zoom{

}

a.zoom, .bilder a{
    position: relative;
    overflow: hidden;
}
.bilder a{
    display: block;
}

/*article a.zoom img{
  box-sizing: border-box;
  position: relative;
} */

header{
    /*border-bottom: 1px solid #908E8D;*/
}

#logo{
    position: relative;
}
.index #logo{
    display: none;
}

nav{

}
@media (max-width:800px){
    header nav{
        display: none;
    }

}

.navbar-nav{
    display: flex;
  justify-content: center; /* Zentriert die Elemente horizontal */
  align-items: center;    /* Zentriert die Elemente optional vertikal */
 /*gap: 1rem;                Erzeugt flexibel steuerbare Abstände zwischen den Menüpunkten */
  list-style: none;       /* Entfernt Standard-Listenpunkte */
  padding: 0;
  flex-direction: row;
  }

nav ul{
position: relative;
}
nav ul li{
    float: left;
position: relative;
padding: 15px;
border-bottom: 1px solid #908E8D;
}
.index nav ul li{
    border: none;
}

nav ul li a{
 font-size: 1rem;
line-height: 1rem;
font-family: 'Corbel-Bold', sans-serif;
font-weight: normal;
    font-style: normal;
    font-display: swap;
color: #92908f;
text-decoration: none;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
nav>ul>li a:hover, nav>ul>li.active a, li.active a.pulldown{
    color: #387f3d;
    background: #fff;
}
nav ul li ul{
  visibility: hidden;
  height: auto;
  position: absolute;
  left: 0;
  top: 110px;
  border-left: 1px solid #ACAAAA;
  border-right: 1px solid #ACAAAA;
  border-bottom: 1px solid #ACAAAA;
  padding-top: 0px;
  z-index: 10000;
}
nav ul li ul li a{
   border-bottom: 1px solid #ACAAAA;
   display: block;
}

nav ul li:hover a.pulldown+ul{
  visibility: visible;
}
@media (max-width:800px){
nav ul li a.pulldown+ul{
  visibility: visible;
  height: auto;
  position: relative;
  left: 0;
  top: 110px;
  background: #fff;
  padding-top: 0px;
  z-index: 0;
}
}
nav ul li ul li{
  display: block;
  height: auto;
  line-height: 1rem;
}
nav ul li ul a{
  border-radius: 0;
  padding: 10px;
  display: block;
  line-height: 1rem;
  white-space: nowrap;
}
@media (max-width:800px){
 nav ul li ul a{
    padding: 10px 0 10px 20px;
  }
}
#headerbildstartseite{
   width: 100%;
   float: left;
   height: calc(100vh - 62px);
   overflow: hidden;
   border-bottom: 5px solid #908E8D;
   position: relative;
   z-index: 0;
}
#headerbildstartseite > div > div{
    position: relative;
}

#headerbild{
    width: 100%;
    margin-top: 2rem;
   overflow: hidden;
  height: 35vh;
   border-bottom: 5px solid #908E8D;
   z-index: 2 !important;
   display: flex;
   align-items: center;
   justify-content: center;
}
 #headerbild img{
   width:100vw;
 height:auto;
 /* object-fit: cover;
  object-position: center; */
 }

/*#video{
width: 100%;
   height: 100vh;
   overflow: hidden;
   border-bottom: 5px solid #908E8D;
   position: relative;
}*/
#video video, #headerbildstartseite video{
  width:100%;
 height:100vh;
 height: calc(100vh - 62px);
  position: relative;
  object-fit: cover;
  object-position: center;
}
.fuenfzig {
position: absolute;
z-index: 1;
top: -1px;
left: 50%;
transform: translateX(-50%);
  box-sizing: border-box;
 /* padding: 0 1rem 1rem 1rem;*/
  margin: 0 auto;
  width: auto;
  background: rgba(255,255,255,0.0);
  /*border-top: 1px dotted #666;
  border-left: 2px solid #387f3d;
  border-right: 2px solid #387f3d;
  border-bottom: 2px solid #387f3d;
  border-bottom-right-radius: 10px;
  -moz-border-radius-bottomright: 10px;
  -webkit-border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
  -moz-border-radius-bottomleft: 10px;
  -webkit-border-bottom-left-radius: 10px;*/
}
.fuenfzig img{
box-shadow: 0px 10px 15px 0px #908E8D;
-moz-box-shadow: 0px 10px 15px 0px #908E8D;
-webkit-box-shadow: 0px 10px 15px 0px #908E8D;
position: relative;
border-top: 1rem solid #387f3d;
margin-top: 0;
}
.fuenfzig::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  top: 0px;
  left: -100px;
  border-top: 130px solid #fff;
  border-left: 100px solid transparent;
}
.fuenfzig::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 0;
  height: 0;
  top: 0px;
  right: -100px;
  border-top: 130px solid #fff;
  border-right: 100px solid transparent;
}
.slogan{
    position: absolute;
     top:200px;
    left: 50%;
     transform: translateX(-50%);
    background: rgba(255,255,255,0.8);
    border: 2px dotted #908E8D;
    padding: 0 1rem 1rem 1rem;
    border-radius: 10px;
}
.slogan h1{
    margin-bottom: 0;
    margin-top: .5rem;
}

.slogan p{
    font-family: 'Corbel-Bold',sans-serif;
    margin: 0;
    text-align: center;
}

@media (max-width:800px){
  #headerbild, #video{
      display: none;
  }


}
/*#headerbild img, #headerbildstartseite img{
   object-fit: cover;
object-position: center center;
 width: auto;
  height: 1000px;
} */
main{
 padding: 2rem 15% 2rem 15%;
 box-sizing: border-box;
}
@media (max-width:800px){
  main{
    padding: 2rem;
  }

}

.index main{
    display: none;
}

#video + main{

    z-index: 100 !important;
    position: relative;
}
article{
 /*border-top: 1px dotted #908E8D; */
}
#video + main > article{
    padding-top: 1rem;
}

article a{
    color: #49B749;
    text-decoration: none;
}

div.datum{
   /*width: 20%;*/
    width: 12rem;
    float: left;
}
div.beschreibung{
     width: calc(100% - 12rem);
    overflow: hidden;
    float: left;
    box-sizing: border-box;
    padding: 1.5rem 0 2rem 1rem;
    border-left: 1px dotted #908E8D;
    border-bottom: 1px dotted #908E8D;
}
@media (max-width:800px){
 div.datum{
     width: 100%;
     float: none;
 }
 div.beschreibung{
     width: 100%;
     float: none;
 }

}
div.beschreibung::after{
  display: block;
content: " ";
clear: both;
height: 0;
overflow: hidden;
}
.schmall{
    width: 80%;
    margin: 0 auto;
}

#top{
  text-align: center;
   position: relative;
}
#top img{

}
footer{
  text-align: center;
border-top: 2px solid #8F8D8D;
background: linear-gradient(to right,  #00c6ff, #0072ff);
}
.index footer{
    display: none;
}

footer nav{
    padding: 35px 0 35px 0;
}

footer ul{
    display: inline;
vertical-align: middle;
text-align: center;
list-style: none;
  list-style-image: none;
}
footer ul.nav li {
  display: inline;
  margin: 0;
}
footer ul.nav > li > a {
  display: inline-block;
}
footer ul.nav li a {
    font-family: Lexend,sans-serif;
    font-weight: normal;
    font-style: normal;
    font-display: swap;
  color: #000;
  font-size: 1rem;
  padding: 0px 15px 0px 15px;
  text-decoration: none;
  text-transform: none;
  border-right: 1px solid #fff;
  transition: all 800ms ease-out;
  -moz-transition: all 800ms ease-out;
  -webkit-transition: all 800ms ease-out;
  -o-transition: all 800ms ease-out;
}
footer ul.nav li:last-child a {
  border: none;
}
footer ul.nav li a.hover, footer ul.nav li.active  a{
    color: #E6E6E6;
}
.item-content{
    position: relative;
}

/*----Mobiles Menue----*/
.sidenav,#open{
    display: none;
}
@media (max-width:800px){
.sidenav {
    width: 0;
    position: absolute;
    z-index: 10000;
    top: 0;
    left: 0;
    background-color: #19464D;
    overflow-x: hidden;
    overflow-y:auto;
    transition: 0.5s;
    display: block;
    padding-top: 60px;
    padding-bottom: 0px;
    border-bottom: 1px solid #fff;
    box-shadow: 0px 1px 10px 0px #968c8c; -moz-box-shadow: 0px 1px 10px 0px #968c8c; -webkit-box-shadow: 0px 1px 10px 0px #968c8c;
}
.sidenav ul.navbar-nav{
   flex-direction: column;
}

.sidenav h3{
    color: #fff;
    font-size: 1.2rem;

}

.sidenav .closebtn{
     position: absolute;
    top: 0;
    right: 0;
}
.sidenav ul{
    margin: 0 0 0 5px;
    border: none;
}
.sidenav ul{
  list-style: none;
  list-style-image: none;
  margin: 0 0 0 0;
  padding: 0;
}
.sidenav li{
  display: block;
  border-bottom: 1px dotted #fff;
    padding: 2px 0;
}
.sidenav li ul li{
  padding: 2px 0 2px 20px;
}
.sidenav a{
    color: #fff;
    margin: 8px 8px 8px 0;
    padding: 5px;
  border-left:none;
    font-size: 0.9rem;
    display: block;
    text-decoration: none;
    text-transform: none;

}
.sidenav a[href^="#"]{
    display: none;
}

.sidenav a:hover{
  background-color: #173c43;
  color: #49B749;
}



#open{
    background: #173C43;
    text-align: right;
    cursor:pointer;
    display: block;
    margin-bottom: 0px;
}
#mobilediv::after{
    clear: both;
    content: " ";
    display: block;
    height: 0;
    visibility: hidden;
}
}
/*--------Pagination-----*/
.pagination {
  display: flex;
  padding-left: 0;
  list-style: none;
  margin: 2rem 0 0 1rem;
}
.ms-0 {
  margin-left: 0 !important;
}
.mb-4 {
  margin-bottom: 1.5rem !important;
}
.page-item.active .page-link {
  z-index: 3;
  color: #fff;
  background-color: #49B749;
  border-color: #49B749;
}

.page-item .page-link {
  position: relative;
  display: block;
  color: #49B749;
  text-decoration: none;
  background-color: #fff;
  border: 1px solid #49B749;
  transition: color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out;
}
.disabled{
    display: none;
}
li.page-item:last-child {
    display: none;
}
li.page-item:nth-child(1) {
    display: none;
}
li.page-item:nth-child(2) {
    display: none;
}
li.page-item:nth-last-child(2) {
    display: none;
}
ul.pagination li{
    margin-left: 5px;
    padding: 0;
    border: none;
}
/* --------------------------*/
.next{
 margin-left: 1rem;
}
.previous, .next{
    color: #fff;
  background: #387F3D;
  position: relative;
  padding: 8px;
  display: inline-block;
  letter-spacing: 1px;
  text-decoration: none;
  transition: all 400ms ease-out;
  -moz-transition: all 400ms ease-out;
  -webkit-transition: all 400ms ease-out;
  -o-transition: all 400ms ease-out;
}
.previous:hover, .next:hover{
  background: #70cde3;
  color: #8F8D8D;
}
 table{
     border: 1px solid #d8d8d8;border-collapse: collapse;box-shadow: 0px 0px 4px 0px #d8d8d8;
  -moz-box-shadow: 0px 0px 4px 0px #d8d8d8;
  -webkit-box-shadow: 0px 0px 4px 0px #d8d8d8;
  margin-top: 1rem;
  margin-bottom: 1rem;
 }
 td{
  border: 1px solid #d8d8d8;
  padding: 1rem;
 }
#breadcrumb{
  padding: 0.5rem 0 0.5rem 0.5rem;
  background: #FEFEFE;
  margin: 1rem 1rem 1rem 1rem;
  border-top: 1px solid #908E8D;
  border-bottom: 1px solid #908E8D;
}
@media (max-width:800px){
  #breadcrumb{
      display: none;
  }

}

#breadcrumb ol{
    margin: 0;
    padding: 0;
    list-style-type: none;
}
#breadcrumb ol li{
  display: inline;
}
#breadcrumb ol span{
    padding: 0.5rem 1.0rem 0.5rem 1.0rem;
    border-right: 1px solid #908E8D;
}
#breadcrumb a{
    color: #48b749;
    text-decoration: none;
}
.breadcrumb-item + .breadcrumb-item::before{
    display: none;
}
