/*04_header.css*/

#header_left_div, #header_nav_div, header, #header_right_div{
	align-items:center;
	display:flex;
	font-family:var(--04_header_font_family);	
	justify-content:center;
	z-index:1000;
}

#header_left_div{
	background-color:var(--04_header_div_left_bgColor,var(--04_header_banner_bgColor));
}

#header_nav_div{
	background-color:var(--04_header_div_nav_bgColor);
	border-top-left-radius:10px;
}

header{
	background-color:var(--04_header_bgColor,var(--04_header_banner_bgColor));
	border-top-right-radius:10px;

	align-items:center;
	display:flex;
	flex-direction:column;
	gap:var(--04_header_title_subtitle_gap,0.3rem);
	justify-content:center;

	min-width:0;
	width:100%;
}

#header_right_div{
	background-color:var(--04_header_div_right_bgColor,var(--04_header_banner_bgColor));
}


/* Titel + Untertitel */

#banner_header{
	container-type:inline-size;
	min-width:0;
	text-align:center;
	width:100%;
}

#banner_text_div{
	align-content:center;
	box-sizing:border-box;
	display:grid;
	flex:0 0 100%;
	grid-template-rows:auto auto;
	justify-items:center;
	max-width:none;
	min-width:0;
	width:100%;

	opacity:0;
	visibility:hidden;
	transition:opacity 1.2s ease;
}



#banner_text_div.banner_ready{
	opacity:1;
	visibility:visible;
}

#header_bannertitle_h1,
#header_bannertitle_hdy_h1{
	color:var(--04_header_title_color);	
	justify-self:center;
	letter-spacing:var(--04_header_title_letter_spacing,0.3rem);
	line-height:1.05;
	margin:0;
	margin-top:7px;
	max-width:100%;
	padding-top:var(--04_header_title_padding-top,0px);
	text-align:center;
	white-space:nowrap;
}

#header_bannertitle_hdy_h1, #header_subtitle_hdy_h2{
	display:none;
}

#header_subtitle_h2,
#header_subtitle_hdy_h2{
	color:var(--04_header_subtitle_color,var(--04_header_title_color));
	font-weight:var(--04_header_subtitle_font_weight);
	font-style:var(--04_header_subtitle_font_style);
	justify-self:center;
	letter-spacing:var(--04_header_subtitle_letter_spacing);
	line-height:1.2;
	margin:0;
	margin-top:7px;
	margin-bottom:7px;
	max-width:100%;
	text-align:center;
	white-space:nowrap;
}


/* Banner */

div#banner_navigation_wrapper{
	position:sticky;
	top:0;
	z-index:1000;

	transition:box-shadow 0.25s ease;
}

.is_scrolled{
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
	border-top-left-radius:10px;
	overflow:hidden;

	box-shadow:
		0 0.4rem 1rem rgba(0,0,0,0.18),
		0 2rem 2rem -1rem var(--04_header_bgColor);
}


/* Handy-Titel standardm?g ausblenden */

#header_bannertitle_hdy_h1,
#header_subtitle_hdy_h2{
	display:none;
}


/* Tablet */

@media (min-width:769px) and (max-width:1199px){

	#banner_navigation_wrapper{
		grid-column:1 / -1;
		grid-template-columns:minmax(0,1fr);
		grid-template-areas:"header";
	}

	#banner_header{
		grid-column:1;
		min-width:0;
		width:100%;
	}

	#banner_text_div{
		min-width:0;
		width:100%;
	}

	#header_left_div,
	#header_nav_div,
	#header_right_div{
		display:none;
	}
}

/* Handy */

@media (max-width:768px){

	header{
		grid-column:1 / -1;
		min-width:0;
		width:100%;
	}

	#banner_navigation_wrapper{
		grid-column:1 / -1;

		grid-template-columns:
			minmax(0,1fr);

		grid-template-areas:
			"header";
	}

	#header_left_div,
	#header_nav_div,
	#header_right_div{
		display:none;
	}

	#header_bannertitle_h1,
	#header_subtitle_h2{
		display:none;
	}	
	
	#header_bannertitle_hdy_h1,
	#header_subtitle_hdy_h2{
		display:block;
	}	
}