@media(max-width:1440px){
	.contentsection {padding: 0 25px}
	
	.contentsection.layout_0 img.iconFlower {position: absolute; top: 0; left: 25px; height: 70px; width: 70px;}
	.contentsection.layout_0 img.iconFlower:nth-of-type(2) {top: 0; bottom:unset; left:unset; right: 25px;}
	.contentsection.layout_0 img.iconFlower:nth-of-type(3) {top: unset; bottom:0; left:25px; right: unset;}
	.contentsection.layout_0 img.iconFlower:nth-of-type(4) {top: unset; bottom:0; left:unset; right: 25px; }
}

@media (max-width:1024px) {
	
html {}
body {line-height: 150%}	
.mobileOnly {display: block}
	
h1, #start h1 {line-height: 50px; font-size: 44px; max-width: 100%}
#navOuter, .subnavOuter, .pink {display:none}
.contentAfterSubnav {margin-left:0px}
#mobileOpenerOuter {display:block}

#obenOuter {height: 80px; margin: 0 auto; text-align: center; top: 0px; padding: 0px 25px; color: #fff9f5 !important; display: flex; justify-content: space-between; align-items: center;}
#obenOuterBalken {width: 100%;  height:100px;background-color: #b40e32; display: flex; justify-content: center}
#balkenoben {z-index:1; max-width:100%; width:100%; margin:0px auto;height:100%; display: flex; align-items: center; justify-content: space-between; padding: 0; gap:unset}
#balkenoben .menu {display: none}
body.sticky #balkenoben {height: 80px}
#logolink { z-index:999;} 
#logo  { z-index:999; margin-left:0px; height: 100%}

	.phone.mobileOnly {width: 35px; height: 100%;}
	.phone.mobileOnly img {width: 100%; height: 100%;}
	
#name {position:relative; float:left; text-align:left; margin-left:120px; margin-top:38px; font-size:1.3em; line-height:1.1em}


#navMobile, #navMobile #navMobileMenu {background-color: var(--accent);/* position: absolute; */top: 0px;position: fixed;z-index: 99999;} 
#navMobile #navMobileMenu.visible {transform: translateX(0%);}
#navMobile #navMobileMenu .menuMobile ul {height: 70%; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; }

	
#navMobile #navMobileMenu .menuMobile ul li  {list-style-type:none; padding: 0px 25px; color: #fff; opacity: 0; transition: 1.4s ease-in-out} 
#navMobile #navMobileMenu.visible .menuMobile ul li {opacity: 1; padding-bottom: 40px; text-transform: uppercase}
#navMobile #navMobileMenu.visible .menuMobile ul li:nth-of-type(8n-7) {transition-delay: 100ms}
#navMobile #navMobileMenu.visible .menuMobile ul li:nth-of-type(8n-6) {transition-delay: 200ms}
#navMobile #navMobileMenu.visible .menuMobile ul li:nth-of-type(8n-5) {transition-delay: 300ms}
#navMobile #navMobileMenu.visible .menuMobile ul li:nth-of-type(8n-4) {transition-delay: 400ms}
#navMobile #navMobileMenu.visible .menuMobile ul li:nth-of-type(8n-3) {transition-delay: 500ms}
#navMobile #navMobileMenu.visible .menuMobile ul li:nth-of-type(8n-2) {transition-delay: 600ms}
#navMobile #navMobileMenu.visible .menuMobile ul li:nth-of-type(8n-1) {transition-delay: 700ms}
#navMobile #navMobileMenu .menuMobile ul li a { padding-left:5px; margin-bottom:5px; padding-top:5px; width:100%; display:block; color: #fff; font-size:32px}
#navMobile #navMobileMenu .menuMobile ul li.aktiv  {font-weight:bold}

#content .contentAfter {margin-top: 60px; padding: 0px 20px}
#contentOuter {background-image: none; margin-top: 80px}
#content, .content {margin: 0px 0px; padding-bottom: 0px; min-height: 0px}
 
.contentsection {padding: 0px 25px;}
.content#home .contentsection {padding: 0px 25px; margin: 75px 0}
.contentsection .inhalt {width: 100%}

	.contentsection.layout_1 {flex-direction: column}
	.contentsection.layout_1 .left, .contentsection.layout_1 .right {width: 100%}
	.contentsection.layout_1 .right{margin-top: 30px}
	
	.contentsection.layout_2 .haupttext {grid-template-columns: repeat(auto-fill, 350px); justify-content: center; gap: 50px}
	
	.contentsection.layout_4 {flex-direction: column; gap: 20px }
	.contentsection.layout_4 .left, .contentsection.layout_4 .right {width: 100%; gap: 25px }
	
	.contentsection.layout_5 {flex-direction: column; gap: 20px }
	.contentsection.layout_5 .left, .contentsection.layout_5 .right {width: 100%; gap: 25px}

	.slick-prev {left: -30px !important; background-image: none; width: 20px}
	.slick-next {right: -30px !important; background-image: none; width: 20px}
	.slick-prev::before {content: "←"; color: black}
	.slick-next::before {content: "→"; color: black}

.hr {margin: 20px 0px}
	
.kontakt {margin-bottom: 0px; padding: 40px 0px}
#adresse #adresseInnen {padding: 0px 25px;}
#adresse .normal {float:none}
#adresse a {text-decoration: none; color: #fff9f5}
	
#adresse #adresseInnen .center .logo {width: 70%}

#adresse {
    box-shadow:none;
    margin:0;
    padding-left: 0;
    padding-top: 20px
	
}

#adresse #adresseInnen .left, #adresse #adresseInnen .center {
    text-align: left;
    width: 50%;
	font-size: 1.3em;
}

#adresse #adresseInnen .right {margin-right:0px; padding-right:0px; padding-left: 0px; margin-top:0px; font-size:1.3em;}
    body[data-aos-duration="400"] #adresse[data-aos] {transition-duration: 0s}

.formtabelle {margin-top:20px}
.formtabelle tr td {clear:both; display:block}
input{ width:100%; border-radius:2px}
.anabmelden {float:left; margin-right:10px; border:0px }
#newslettersubmit {width:162px; text-align:center}
#password {width:123px; margin-top:5px; color:#87888a; font:100%  Helvetica, Arial, sans-serif;  padding-left:3px}
#commentsUser {width:100%}
#Senden {/*cursor:pointer; width:140px; float:left; color:#fff; position:relative; z-index:100000; height:40px; background-color:#9b015e; border:1px solid #9b015e; margin-top:10px; margin-bottom:20px*/ -webkit-appearance: none;} 
#anrede {width:150px;}
#formDanke {color:#333; display:none}

.contentAfter hr {width:auto !important}

}

@media(max-width:800px){
	
	.contentsection.layout_0 {padding-top: 40px; padding-bottom: 40px}
	.contentsection.layout_0 img.iconFlower {height: 35px; width: 35px;}
	
	.contentsection.layout_3 .gallery .galleryInner {display: flex; flex-direction: column}
	
	.contentsection.layout_3 .gallery .galleryInner .galleryImg img {position: relative}
	
	#adresse .footerNav {flex-direction: column; align-items: center; gap: 20px} 
	#adresse #adresseInnen .adresseLink {font-size: 38px; line-height: 38px; letter-spacing: 0.95px}
	
	.backgroundImage {width: 100%; height: auto}
	.headergal {width: 100%; height: auto; max-height: 200px; overflow:hidden; position: absolute; top: 0px;z-index: 0; opacity: 0.5; padding-top: 30px}
	.headergalimage {width:100%; height:auto;}	
	.headergalimage img {width: 100%;height: auto}
	.content ul.slicker li {margin-left: 0px !important}
	.startTop {padding-top: 100px}
}

@media (max-width:700px) {
	h1, .h1like {font-size: 38px; line-height: 39px; letter-spacing: 0.95px}
	
	#content, .content {font-size: 19px; line-height: 26.6px; letter-spacing: 0.47px}
	
	.contentsection {margin: 50px 0}
	
	.contentsection.layout_0 .haupttext p span[style] {font-size: 55px !important; line-height: 55px !important} 
	
	.contentsection.layout_1 .left h1 {font-size: 110px; line-height: 110px; top:-45px}
	.contentsection.layout_1 .left .headline-wrap .hauptbild {margin-left: 110px}
	.contentsection.layout_1 .left h2 {font-size: 38px; line-height: 38px; letter-spacing: 0.95px; margin-top: 20px}
	
	.contentsection.layout_2 .haupttext .info .infoInner .number {font-size: 90px; line-height: 90px;}
	.contentsection.layout_2 .haupttext .info .infoInner .infotext {font-size: 26px; line-height: 28px; letter-spacing: 0.65px}
	
	#formularOuter {flex-wrap: wrap; }
    
    #formularOuter #eform {width: 100%;}
    #formularOuter .kontaktDaten {padding-left: 0px;}

	.mt60 {margin-top: 30px}
	#adresse #adresseInnen {flex-wrap:wrap;}
	#adresse #adresseInnen .center {width: 100%; order: 1; padding-top: 40px; align-items: center; justify-content: center; margin-bottom: 10px}
	#adresse #adresseInnen .center .logo {width: 300px; max-width: 60%}
	#adresse #adresseInnen .left {width: 100%; order: 2;}
	#adresse #adresseInnen .right {width: 100%; order: 3; text-align: left; margin-top: 10px} 
	#adresse #adresseInnen .right .text {text-align:left;}
	#adresse #adresseInnen .right .socials {justify-content: flex-start;}
	#adresse .footerNav a {margin: 0}

	
	
	
}

@media (max-width: 567px) {
	
	.baustelleOuter .baustelleInner .coming {font-size: 75px; line-height: 85px;}
	.baustelleOuter .baustelleInner .apply {display: inline-block; margin-top: 30px; font-size: 45px; line-height: 45px; color: var(--accent)}
	
	
	.content#start .contentsection {height: calc(100vh + 120px);}   
}

@media (max-width: 450px) {
	#adresse #adresseInnen .right .text, #adresse #adresseInnen .left .text {font-size: 16px; line-height: 18px} 
	#adresse #adresseInnen .adresseLink {font-size: 26px; line-height: 28px}
}

@media (max-width: 370px) {
	.content#start .contentsection {padding-top: 40px}
	
	.slick-prev {left: -20px !important;}
	.slick-next {right: -20px !important;}
}

