@media (prefers-color-scheme: dark) {

    .hamburger .line1, .hamburger .line2, .hamburger .line1, .hamburger .line2 {
        background-color: var(--white);
    }

}



@media screen and (max-width : 1500px)  {

/* ///// CONTAINER AND TYPO ///// */

#containerS {
    width: 60%;
    margin: 7% 20% 0;
}

#containerM {
    width: 80%;
    margin: 7% 10% 0;
}

#containerP {
    width: 80%;
    margin: 7% 5% 0;
}

h4 {
    font-size: 1.3rem;
}


/* ///// HEADER ///// */


/* ///// NAVIGATION ///// */

.logo {
    max-width: 100px;
}


/* ///// SLIDER ///// */


/* ///// STARTSEITE ///// */


/* ///// UNTERSEITEN ///// */


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

}


@media screen and (max-width : 1400px)  {

/* ///// CONTAINER AND TYPO ///// */


/* ///// HEADER ///// */

.header .content {
    top: 60%;
    width: 55%;
}


/* ///// NAVIGATION ///// */

.logo {
    max-width: 75px;
}


/* ///// SLIDER ///// */


/* ///// STARTSEITE ///// */


/* ///// UNTERSEITEN ///// */


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

}


@media screen and (max-width : 1300px)  {

/* ///// CONTAINER AND TYPO ///// */

.bild-frame, .bild {
    height: 30vw;
}

/* ///// HEADER ///// */


/* ///// NAVIGATION ///// */


/* ///// SLIDER ///// */


/* ///// STARTSEITE ///// */


/* ///// UNTERSEITEN ///// */

.links {
    height: 30vw;
}

.link {
    margin: 0 1%;
    height: 14vw;
}


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

}


@media screen and (max-width : 1200px)  {

/* ///// CONTAINER AND TYPO ///// */

.parallaxParent {
    height: 50vw;
}


/* ///// HEADER ///// */


/* ///// NAVIGATION ///// */


/* ///// SLIDER ///// */


/* ///// STARTSEITE ///// */


/* ///// UNTERSEITEN ///// */


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

}


@media screen and (max-width : 1100px)  {

/* ///// CONTAINER AND TYPO ///// */

.item-page {
    margin: 12% 0%;
    width: 100%;
}

/* ///// HEADER ///// */


/* ///// NAVIGATION ///// */

a.switch-button.hochsaison {
    margin-top: 2em!important;
    float: left;
    position: relative;
    font-size: 1rem!important;
}


/* ///// SLIDER ///// */

#slider {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%; /* Slider so hoch wie Bildschirm) */
    overflow: hidden;
}

#slideshow-area .introimage, #slideshow-area .image {
    height: 100%; /* Slider so hoch wie Bildschirm) */
    overflow: hidden; /* Slider so hoch wie Bildschirm) */
    position: absolute; /* Slider so hoch wie Bildschirm) */
    top: 0; /* Slider so hoch wie Bildschirm) */
    left: 0; /* Slider so hoch wie Bildschirm) */
    bottom: 0; /* Slider so hoch wie Bildschirm) */
    right: 0; /* Slider so hoch wie Bildschirm) */
}

#slider .moduletable, #slider .newsflash, .slider, #slider .slick-track, #slider .slick-slide, #slider #slideshow-area, #slider .slick-list.draggable {
    height: 100%; /* Slider so hoch wie Bildschirm) */
}

#slider .hintergrundbild {
    height: 100%; /* Slider so hoch wie Bildschirm) */
}


/* ///// STARTSEITE ///// */


/* ///// UNTERSEITEN ///// */


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

a.lightbox {
    width: 2em;
    height: 2em;
    right: 2em;
    bottom: 2em;
}

}


@media screen and (max-width : 1000px)  {

/* ///// CONTAINER AND TYPO ///// */


/* ///// HEADER ///// */


/* ///// NAVIGATION ///// */


/* ///// SLIDER ///// */


/* ///// STARTSEITE ///// */


/* ///// UNTERSEITEN ///// */

#left-col {
    display: none!important;
}

#main-col {
    width: 100%!important;
}


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

}


@media screen and (max-width : 900px)  {


/* ///// CONTAINER AND TYPO ///// */

.wideWrap {
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
}

#containerS {
    width: 80%;
    margin: 10% 10% 0;
}

#containerM {
    width: 90%;
    margin: 10% 5% 0;
}

h1 {
    font-size: 2.5rem;
}

h2 {
    font-size: 1.5rem;
}

h4 {
    font-size: 1.1rem;
}

/* ///// HEADER ///// */


/* ///// NAVIGATION ///// */


/* ///// SLIDER ///// */


/* ///// STARTSEITE ///// */

.parallaxParent {
    height: 60vw;
}

/* ///// UNTERSEITEN ///// */

.links {
    height: 35vw;
}

.link {
    height: 14vw;
    padding-left: 1em;
    flex: 0 28%;
    margin: 0 1%;
}

.link h3 {
    font-size: 1rem;
    line-height: 1;
}

.link a {
    font-size: 0.7rem;
    margin-top: 0.5rem;
}



/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

}


@media screen and (max-width : 800px)  {

/* ////// HEADER ////// */ 

.header .content {
    width: 55%;
    top: auto;
    bottom: 10%;
}

/* ////// UNTERSEITEN ////// */

.section-parallax {
    height: 40vw;
}

.mitglieder-item {
    width: 30vw;
}

.left-col.bold p {
    width: 100%;
}

.right-col, .left-col {
    width: 100%;
}

.right-col.kontakt {
    margin-top: 10%;
}

.background-image {
    height: 35vw;
}

.vorstand {
    flex: 0 46%;
    margin: 2%;
}

.mitglied {
    flex: 0 calc(47% - 8vw);
    margin-bottom: 3%;
}

#ueber-uns {
    width: 80%;
    padding: 5% 10%;
}

#loadmore-area {
    margin-top: 5%;
}

}


@media screen and (max-width : 767px)  {

/* ///// CONTAINER AND TYPO ///// */

p, span.field-value, span.field-label, li, #footer a, .left-col.bold p, .newsdatum, .button, a.button {
    font-size: 1rem;
}

.addReadMore {
    font-size: 1rem;
    margin-top: 1rem; 
}

/* ///// HEADER ///// */

#heads {
    height: 100%;
}

#header {
    padding: 20px 0 20px 0;
}

#container-header {
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
}

.logo {
    min-width: auto;
}

/* ///// NAVIGATION ///// */

#sticky {
    top: 40px;
}

#sticky-fadein {
    top: -29px;
}

#sticky-fadein.active {
    top: 29px;
}

/* ///// SLIDER ///// */

.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
    right: 20px !important;
}

.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
    left: 20px !important;
}

.swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after, .swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after {
    font-size: 25px;
}

#hinweis .moduletable {
    top: 14%;
    width: 120px;
    height: 120px;
}

#hinweis p, #hinweis a {
    font-size: 0.8rem;
}


/* ///// STARTSEITE ///// */

.mitglieder-item {
    width: 75%;
    padding: 10vw 5vw!important;
}

#ueber-uns {
    width: 80%;
    padding: 15% 10%;
}


/* ///// UNTERSEITEN ///// */

.links {
    display: block;
    height: auto;
    padding: 10%;
}

.link {
    height: 30vw;
    padding-left: 1em;
    flex: 0%;
    margin: 5% 10%;
    width: auto;
}

.moduletable.news {
    margin-top: 5%;
}


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

a.scrolltotop {
    width: 35px;
    height: 29px;
}

}


@media screen and (max-width : 700px)  {

/* ///// CONTAINER AND TYPO ///// */

.bild-frame, .bild, .blog .bild-frame, .blog .bild {
    height: 60vw;
}

/* ///// HEADER ///// */


/* ///// NAVIGATION ///// */


/* ///// SLIDER ///// */


/* ///// STARTSEITE ///// */


/* ///// UNTERSEITEN ///// */


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

}


@media screen and (max-width : 600px)  {

/* ///// CONTAINER AND TYPO ///// */

.bild-frame, .bild {
    height: 60vw;
}

/* ///// HEADER ///// */


/* ///// NAVIGATION ///// */


/* ///// SLIDER ///// */


/* ///// STARTSEITE ///// */


/* ///// UNTERSEITEN ///// */


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

ul.repeatable-2 li {
    flex: 1 100%;
}

ul.repeatable-2 li, ul.repeatable-3 li, ul.repeatable-4 li {
    padding: 1%;
}

}


@media screen and (max-width : 500px)  {

/* ///// CONTAINER AND TYPO ///// */


#containerM {
    width: 90%;
    margin: 15% 5% 0;
}

#containerS {
    width: 90%;
    margin: 15% 5% 0;
}

#containerP {
    width: 90%;
    margin: 7% 0% 0;
    padding: 5%;
}

h1 {
    font-size: 2rem;
    text-align: center;
}

.header-unterseite h1 {
    letter-spacing: 8px;
}

.header h1 {
    font-size: 1.75rem;
    text-align: left;
    hyphens: none;
    letter-spacing: 4px;
}

h2 {
    font-size: 1.3rem;
    text-align: left;
    letter-spacing: 4px;
}

h4 {
    font-size: 1.0rem;
    text-align: left;
}

.center {
    text-align: left;
}

.parallaxParent {
    height: 80vw;
}

/* ///// HEADER ///// */


.header .content {
    width: 80%;
    bottom: 15%;
    top: auto;
    transform: none;
}

a.scrolldown {
    bottom: 1%;
    max-width: 15px;
}


/* ///// NAVIGATION ///// */

.logo {
    width: 75px;
}

#hamburger, #hamburger-fadein {
    right: 0;
}

#sticky {
    top: 50px;
}


/* ///// SLIDER ///// */


/* ///// STARTSEITE ///// */

.news-item {
    position: relative;
    width: 90%;
    margin: 10% auto;
}

.background-image {
    height: 60vh;
}

#claim .content {
    top: auto;
    bottom: 5%;
    transform: none;
    left: 10%;
    width: 80%;
}

#claim h1 {
    font-size: 2.5rem;
    letter-spacing: 4px;
}

#claim {
    padding: 15% 5%;
}

#mitglieder-startseite {
    width: 90%;
    padding: 5%;
    margin-top: 10%;
}

.count {
    right: -5%;
    font-size: 13rem;
}

.swiper-pagination {
    bottom: 10px;
}


/* ///// UNTERSEITEN ///// */

.vorstand {
    flex: 0 98%;
    margin: 2%;
    margin-bottom: 15%;
}

.mitglied {
    flex: 0 100%;
    margin: 0;
    margin-bottom: 5%;
    padding: 10vw 4vw;
}

.section-parallax {
    height: 55vw;
}

#parallax {
    margin-bottom: 5%;
}

.newscontent {
    margin: 5% 0;
}


/* ///// FOOTER ///// */

#footer .logo {
    width: 90%;
    max-width: 100px;
}

#footer {
    width: 80%;
    padding: 10% 10% 5% 10%;
}


/* ///// DIVERSES ///// */

}


@media screen and (max-width : 450px)  {

/* ///// CONTAINER AND TYPO ///// */


/* ///// HEADER ///// */

/* ///// NAVIGATION ///// */


/* ///// SLIDER ///// */


/* ///// STARTSEITE ///// */


/* ///// UNTERSEITEN ///// */


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

}


@media screen and (max-width : 350px)  {

/* ///// CONTAINER AND TYPO ///// */

h1 {
    font-size: 1.5rem;
    text-align: center;
}


/* ///// HEADER ///// */

.header h1 {
    font-size: 1.5rem;
}

.header-unterseite h1 {
    letter-spacing: 12px;
}

/* ///// NAVIGATION ///// */

.logo {
    width: 60px;
}


/* ///// SLIDER ///// */


/* ///// STARTSEITE ///// */


/* ///// UNTERSEITEN ///// */


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

}




@media screen and (max-width: 900px) and (orientation: landscape) {

#slider, #slider .slider, #slideshow-area .image, #slider .hintergrundbild {
    height: 90vw;
}

.header h1 {
    font-size: 1.5rem;
}

#heads {
    height: 150vh;
}

.header .content {
    top: 55%;
}

#heads.unterseite {
    height: 65vh;
}

#navigationWrap, #navigationWrap-fadein {
    overflow-y: scroll;
}

#claim .content {
    width: 55%;
}

.mitglieder-item {
    width: 30vw;
}

#responsive-navigation ul.menu a, #responsive-navigation span.separator {
    font-size: 1em;
}

}

