/*mobile Anpassungen*/
/*Prefers*/
@media (prefers-reduced-motion: reduce) {
  /**, *::before, *::after {scroll-behavior: auto !important;animation-duration: .01s !important;transition-duration: .01s !important;}*/
}
@media (prefers-contrast: more) {
    :root {}
}
/*Höhen*/
@media only screen and (max-height: 600px) {}
/*Breiten*/
@media only screen and (max-width: 1560px) {
    .teaserbox-infos {flex-direction: column;align-items: start;}
    .teaserbox-infos .headline-over::after {display: none;visibility: hidden;}
}
@media only screen and (max-width: 1500px) {
    .headline-termin-container {padding: 2em 1em 0 2em;}
}
@media only screen and (max-width: 1350px) {
    #footer .footer-1 {padding: 1em 0 7em 0;}
    #footer .footer-1 .footer-1-wrapper {width: 90vw;}
}
@media only screen and (max-width: 1200px) {    
    main .headline, main .absatz .inner, main #breadcrumb, main .yform, .macy-container, #start main .headline, #start main .absatz .inner, #start main #breadcrumb, #start main .yform, #start .macy-container {max-width: 100%;margin: 0 2em;}
    /*.hg-hellgrau {padding-left: 0;padding-right: 0;}*/
    .teaserbox, #start .teaserbox {width: clamp(13em, 40vw, 23em);}      
    .yform fieldset {height: 35em;}
    .yform form input, .yform form textarea, .yform form select, .yform form optgroup {width: 100%;}    
    #pfeil {right: 2em;} 
}
@media only screen and (max-width: 1050px) {
    #footer .footer-1 .footer-1-wrapper {width: 100vw;margin: 0 1.5em;}
    main .absatz .accordion_toggler_1 .accordion_toggler_headline::before {top: 24px;font-size: 23px;}   
}
@media only screen and (max-width: 1000px) {
    h1, h2, h3, h4, h5, h6 {hyphens: auto;}
    main {margin-bottom: 0 !important;}
    #footer .footer-1 {position: relative;padding: 2em 0 1em 0;}
    #footer .footer-1 .footer-1-wrapper {flex-direction: column;}
    #footer .footer-1-container {width: 100% !important;}
    #footer .footer-1 .absatz p br {display: none;visibility: hidden;}
    #footer .footer-1 table {width: 18em !important;}
}
@media only screen and (max-width: 950px) {
    #sprunglink-mainnav, #sprunglink-topnav {display: none;visibility: hidden;}
    #sprunglink-menu-mobile, .header-inner .header-top-container .logo-container {display: block;visibility: visible;}
    #menu-mobile-opener {display: flex;visibility: visible;}
    #header {border: none;}
    .header-inner .logo {margin: 0.4em 0.7em;padding: 0.4em;}  
    .header-inner .logo img {width: 6em;}
    .header-inner .header-top-container .kontakt-social .social {border-right: 2px solid var(--grau);padding-right: 0.5em;}
    #darkMode {margin: 0;}    
    .headline-termin-container {padding: 2em 2em;}
    
    #mainnav ul.rex-navi1, #topnav, .header-inner .header-container {display: none;visibility: hidden;}
    .header-inner .header-top-container .kontakt-social {margin-right: 3.5em;}
    .header-slider .splide__toggle {left: 1em;}
    .header-slider .splide__toggle {left: 0;}
    /*#darkMode {position: fixed;right: 0;top: 5.5em;z-index: 100;}*/
    
    .contentbild-breite-550px {float: none;clear: both;margin: 1em 2em 2em 0;}
    .contentbild-breite-550px figcaption {text-align: left !important;} 
    #pfeil {right: 1em;}
}
@media only screen and (max-width: 900px) {
    #slider-termin-container {flex-direction: column;}
    .slider, .headline-termin-container {width: 100vw;}
    .header-slider .splide__slide {height: 30em !important;}
    .headline-termin-container {height: auto;}
    .headline-termin-container .startseite-termin-spalten-headline a {padding: 0;}

    main .spalten-container-3 {gap: 0.5em;flex-direction: column;}
    main .text-spalte {width: 100%;}

    .teaserbox-container {flex-direction: column;}
    .teaserbox, #start .teaserbox {width: 100%;}
    .teaserbox-inner {display: flex;}
    .teaserbox-img {min-width: 50%;width: 50%;}
    .teaserbox-img img {object-fit: cover;height: 100%;}
    .teaserbox-text-container {padding: 0.5em 2.8em 0.5em 1em;margin-bottom: 0;}
    .bereichsname {padding: 0.5em;}

    .contentbild-breite-500px {float: none;clear: both;margin: 1em 2em 2em 0;}
    .contentbild-breite-500px figcaption {text-align: left !important;} 
    .openstreetmap {background-size: cover;}
}
@media only screen and (max-width: 800px) {
    main .headline, main .absatz .inner, main #breadcrumb, main .yform, .macy-container, #start main .headline, #start main .absatz .inner, #start main #breadcrumb, #start main .yform, #start .macy-container {margin: 0 1em;}
    .header-inner .logo {margin: 0.2em;}
    .headline-termin-container {padding: 2em 1em;}
    .teaser-bereiche-container {grid-template-rows: 1fr 1fr;}
    .bereichsteaser.bereichsteaser-1 {grid-column: 1;grid-row: 1;}
    .bereichsteaser.bereichsteaser-2 {grid-column: 2;grid-row: 1;}
    .bereichsteaser.bereichsteaser-3 {grid-column: 3;grid-row: 1;}
    .bereichsteaser.bereichsteaser-4 {grid-column: 1;grid-row: 2;}
    .bereichsteaser.bereichsteaser-5 {grid-column: 2;grid-row: 2;}
    .bereichsteaser.bereichsteaser-6 {grid-column: 3;grid-row: 2;}
    .bereichsname {padding: 0 0 0 0.5em;}
    .bereichsname p {padding-bottom: 0.3em;}        
    .parallax .parallax-text-wrapper {width: 96%;margin: 0 2%;}
    .parallax .buttons {flex-direction: column;}  
    main .absatz ul li {padding-left: 1rem;}    
    main .absatz ul li::before {left: -.4em;}
    .video .spalte-1, .video .spalte-2 {float: none;clear: both;width: auto;}    
    .yform form .checkbox p {max-width: 80%;}
    #footer .footer-2 {padding: 0.6em 1em;}
    #footer .footer-1 .footer-1-wrapper {width: 100vw;margin: 0 1em;}
    .contentbild-breite-450px {float: none;clear: both;margin: 1em 2em 2em 0;}
    .contentbild-breite-450px figcaption {text-align: left !important;}  
    #pfeil {right: 1em;}
}
@media only screen and (max-width: 700px) {
    #menu-mobile .menu-mobile-content .rex-navi2 {width: 70%;}
    .teaser-bereiche-container {grid-template-columns: 1fr 1fr;grid-template-rows: 1fr 1fr 1fr;}
    .bereichsteaser.bereichsteaser-1 {grid-column: 1;grid-row: 1;}
    .bereichsteaser.bereichsteaser-2 {grid-column: 2;grid-row: 1;}
    .bereichsteaser.bereichsteaser-3 {grid-column: 1;grid-row: 2;}
    .bereichsteaser.bereichsteaser-4 {grid-column: 2;grid-row: 2;}
    .bereichsteaser.bereichsteaser-5 {grid-column: 1;grid-row: 3;}
    .bereichsteaser.bereichsteaser-6 {grid-column: 2;grid-row: 3;}
    .yform fieldset {height: auto;}
    .yform .form-group, .yform form .checkbox {width: 100%;}
    .yform form input, .yform form textarea, .yform form select, .yform form optgroup, .yform form textarea {width: 100%;}
    .yform form select {width: calc(70% + 16px);}        
    #footer .footer-2 p {display: flex;flex-direction: column;margin-right: 3em;}
    #footer .footer-2 .footer-rechts a {padding: 0.5em 0.5em;}

    .contentbild-breite-400px {float: none;clear: both;margin: 1em 2em 2em 0;}
    .contentbild-breite-400px figcaption {text-align: left !important;}  
}
@media only screen and (max-width: 600px) {
    .menu-open #menu-mobile {width: 100vw;}
    #menu-mobile .menu-mobile-content .rex-navi2 {width: 80%;}
    .header-inner .header-top-container .kontakt-social .absatz .inner p {display: flex;}
    .header-inner .header-top-container .kontakt-social .absatz .inner a {position: relative;padding-left: 0;overflow-wrap: anywhere;display: inline-block;width: 2em;height: 2em;}
    .header-inner .header-top-container .kontakt-social .absatz .inner a:before {content: '\e0b0';position: absolute;font-family: var(--icon-font);font-size: 1.7rem;top: 0.01em;left: 0;
            width: inherit;height: inherit;color: var(--orange);display: flex;align-items: center;justify-content: center;}
    .header-inner .header-top-container .kontakt-social .absatz .inner a span {display: none;visibility: hidden;}
    .header-inner .header-top-container .kontakt-social .social a.facebook::before {font-size: 1.3rem;}
    .header-inner .header-top-container .kontakt-social .social a.instagram::before {font-size: 1.6rem;} 
    #darkMode::before {font-size: 1.7rem;}
    
    .teaserbox-inner {display: block;}
    .teaserbox-img {min-width: auto;width: auto;display: block;aspect-ratio: unset;}
    .teaserbox-infos {flex-direction: row;align-items: center;}
    .teaserbox-infos .headline-over::after {display: inline;visibility: visible;}
    main .text-2spalten {display: block;}
    main .text-spalte-1, main .text-spalte-2 {width: 100% !important;} 
    .parallax .buttons a {padding: 0.5em 1em;}
    .contentbild-breite-300px {float: none;clear: both;margin: 1em 2em 2em 0;}
    .contentbild-breite-300px figcaption {text-align: left !important;}  
}
@media only screen and (max-width: 500px) {
    .teaser-bereiche-container {display: flex;flex-wrap: wrap;}
    .bereichsteaser.bereichsteaser {width: 100%;aspect-ratio: 9 / 4;}
    .contentbild-breite-200px {float: none;clear: both;margin: 1em 2em 2em 0;}
    .contentbild-breite-200px figcaption {text-align: left !important;}  
}
@media only screen and (max-width: 480px) {
    #footer .footer-1 table {width: 100% !important;}
}
@media only screen and (max-width: 420px) {
    .headline-termin-container .startseite-termin-spalten-headline .headline-over, .startseite-termin-more, .teaserboxen-headline .teaser-beitrag-more {display: inline;}
    .headline-termin-container .startseite-termin-spalten-headline h2 .headline-over:before, .startseite-termin-more:before, .teaserboxen-headline .teaser-beitrag-more:before {align-items: start;}
    .headline-termin-container .startseite-termin-spalten-headline a, .teaserboxen-headline a {text-align: right;}
    .absatz table {width: 100% !important;}  
    #footer .footer-2 {flex-direction: column;align-items: start;}
    #footer .footer-2 p, #footer .footer-2 .footer-rechts a {padding: 0.5em 0;}
}
@media only screen and (max-width: 400px) {
    .header-inner .header-top-container .kontakt-social .absatz {position: fixed;right: 0;top: 73px;background-color: var(--anthrazit);margin: 0;padding: 0.2em;transition: top 0.2s ease;}
    .header-inner .header-top-container .kontakt-social .absatz.placeTop {top: 54px;transition: top 0.2s ease;}
    .header-inner .header-top-container .kontakt-social .social {border-left: none;}
    .headline-termin-container .startseite-termin-date {min-width: 5em;margin: 0.9em 0.5em 0.5em 0;}
    .headline-termin-container .startseite-termin-wrapper {margin: 0.5em 0;padding-left: 0.5em;}
    .contentbild-breite-100px {float: none;clear: both;margin: 1em 2em 2em 0;}
    .contentbild-breite-100px figcaption {text-align: left !important;}  
}