/* css zu home */

/* header.big.CSS  */
#bannerPic { padding-top: 34.7%; }

#bannerText { bottom: 4rem; }



@media screen and (max-width: 1024px) {
	#bannerPic { padding-top: 40%; }
}


@media screen and (max-width: 850px) {
	#bannerText { bottom: 3rem; }
}


@media screen and (max-width: 768px) {
	#bannerPic { padding-top: 50%; }

	#bannerText { bottom: 2rem; }
}


@media screen and (max-width: 320px) {
	#bannerText { bottom: 1rem; }
}
/* --- --- */
/* header.CSS  */
#bannerOverlay {
	background-image: linear-gradient(to top right, #3f7957 0%, transparent 60%);
	z-index: 1;
}

#bannerText {
	left: 2rem;
	z-index: 2;
}



#bannerText h1 { font-size: 360%; }

.hideOverlay #bannerOverlay { display: none; }



@media screen and (max-width: 850px) {
	#bannerText h1 { font-size: 300%; }
}


@media screen and (max-width: 768px) {
	#bannerText h1 { font-size: 250%; }
}


@media screen and (max-width: 520px) {
	#bannerText h1 { font-size: 210%; }
	
	#bannerText h3 { font-size: 150%; }
}



@media screen and (max-width: 320px) {
	#bannerText h1 { font-size: 185%; }
	
	#bannerText h3 { font-size: 130%; }
}
/* --- --- */
#loginTeaserWrapper { 
	width: calc(100% - 400px);
	max-width: 422px; 
}


@media screen and (max-width: 768px) {
	section.bigIncludeTo { flex-wrap: wrap; }
	
	#loginTeaserWrapper {
		width: 100%;
		max-width: 100%;
	}
}
/* --- --- */
#loginWrapper { 
	width: calc(100% - 422px); 
	min-width: 400px;
}



@media screen and (max-width: 768px) {
	#loginWrapper {
		width: 100%;
		min-width: 0px;
	}
}
/* --- --- */