/*╔════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════╗*/
/*║ HEADER I                                                                                                                                                                                                                                              ║*/
/*╚════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════╝*/
/***-------------------------------------------*** Body ***-------------------------------------------***/
body { padding-top: 179px; }

/***-------------------------------------------*** Header ***-------------------------------------------***/
header { position: fixed; height: 179px; z-index: 1000; left: 0; top: 0; right: 0; background: #FFFFFF; }
header a { text-decoration: none; }
header li { list-style: none; }
header .cms_container_wide_60 { position: relative; height: 179px; padding: 0 60px; }

/***-------------------------------------------*** Hamburger ***-------------------------------------------***/
#nav-icon4 {
	width: 40px;
	height: 30px;
	position: relative;
	display: inline-block;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	cursor: pointer;
}
#nav-icon4 span {
	display: block;
	position: absolute;
	height: 5px;
	width: 100%;
	background: #FFFFFF;
	opacity: 1;
	left: 0;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .25s ease-in-out;
	-moz-transition: .25s ease-in-out;
	-o-transition: .25s ease-in-out;
	transition: .25s ease-in-out;
}
#nav-icon4 span:nth-child(1),
#nav-icon4 span:nth-child(2),
#nav-icon4 span:nth-child(3) {
	-webkit-transform-origin: left center;
	-moz-transform-origin: left center;
	-o-transform-origin: left center;
	transform-origin: left center;
}
#nav-icon4 span:nth-child(1) { top: 0px; }
#nav-icon4 span:nth-child(2) { top: 12px; }
#nav-icon4 span:nth-child(3) { top: 25px; }
body.navi #nav-icon4 span:nth-child(1) {
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 0;
	left: 5px;
}
body.navi #nav-icon4 span:nth-child(2) { width: 0%; opacity: 0; }
body.navi #nav-icon4 span:nth-child(3) {
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	transform: rotate(-45deg);
	top: 29px;
	left: 5px;
}

/***-------------------------------------------*** Logo ***-------------------------------------------***/
body #logo_container {
	position: absolute;
	z-index: 1;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 279px;
	height: 142px;
	overflow: hidden;
}
body #logo_container > a {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    background: url(/pages/img/logo.svg) no-repeat center;
    background-size: contain;
}
body .cms_container_wide_60 > #logo_container { display: none; }

/***-------------------------------------------*** Language Navigation ***-------------------------------------------***/
.hLngMobileContainer { display: none; }
header #hLng { position: absolute; z-index: 12; top: 37.5px; right: 337px; }
header #hLng ul { display: flex; }
header #hLng > ul > li { padding: 0 15px 0 0; }
header #hLng > ul > li:last-of-type { padding: 0; }
header #hLng ul li a {
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 5px;
	font-family: 'Raleway', sans-serif;
	font-weight: 700;
	font-size: 18px;
	line-height: 24px;
	color: #095AA6;
	text-align: left;
	white-space: nowrap;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}
header #hLng ul li:hover a { color: #495057; }
header #hLng ul li.current a { color: #495057; }
header #hLng img { display: flex; width: 20px; height: 15px; }

/***-------------------------------------------*** Search ***-------------------------------------------***/
#hSearchMobile { display: none; }
#hSearch {
	position: absolute;
	z-index: 12;
	top: 35px;
	right: 60px;
	display: flex;
	max-width: 247px;
	width: 100%;
}
#hSearch > form {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	border: 1px solid #707070;
	border-radius: 5px;
	background: #FFFFFF;
	padding: 5px 31px;
}
#hSearch #search_input {
	display: block;
	width: 100%;
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 18px;
	color: #707070;
	text-align: right;
	background: transparent;
	padding: 0;
	height: auto;
	border: none;
	outline: 0;
}
#hSearch #search_input::placeholder {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 18px;
	color: rgba(112,112,112,0.8);
	text-align: right;
}
#hSearch #search_input:-ms-input-placeholder {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 18px;
	color: rgba(112,112,112,0.8);
	text-align: right;
}
#hSearch #search_input::-ms-input-placeholder {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 18px;
	color: rgba(112,112,112,0.8);
	text-align: right;
}
#hSearch #search_submit {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 31px;
	height: 28px;
	background: transparent;
	border: none;
	outline: 0;
	padding: 0;
	margin: 0;
	position: absolute;
	right: 0;
	top: 0;
}
#hSearch #search_submit:before {
	content: "";
	width: 19px;
	height: 19px;
	background: url("/pages/img/suche_icon.svg");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}

/************************************ Start: Navigation ************************************/
/*header #hService li a {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	display: block;
	color: #707070;
	font-size: 16px;
	line-height: 20px;
	text-align: left;
}
header #hService i { font-size: 16px; line-height: 20px; color: #707070; }
header #hService li:hover i, #hService li:hover a { color: #3EA2F7 !important; }
header #hNavigation ul li a {
	font-family: 'Raleway', sans-serif;
	font-weight: 600;
	font-size: 24px;
	line-height: 33px;
	color: #707070;
	text-align: left;
	white-space: nowrap;
}
@media screen and (max-width: 1200px) {
	header #hHamburger { font-size: 25px; }
	header #hNavigation > ul > li > a { font-size: 21px !important; line-height: 28px; font-weight: 600 !important; }
	header #hNavigation > ul > li > ul > li > a { font-size: 18px !important; line-height: 26px; font-weight: 400 !important; }
	header #hNavigation > ul > li > ul > li > ul > li > a { font-size: 18px !important; line-height: 26px; font-weight: 400 !important; padding: 5px 25px; }
	#hService li a { font-size: 18px !important; line-height: 26px; font-weight: 400 !important; }
	#hService i { font-size: 18px !important; line-height: 26px; }
}*/
/************************************ End: Navigation ************************************/

/***-------------------------------------------*** Service Navigation ***-------------------------------------------***/
/*header #hService { padding: 20px 0 0 0; display: flex; justify-content: flex-end; align-content: flex-end; align-items: flex-end; flex-wrap: nowrap; }
header #hService ul	{ display: flex; }
header #hService ul li { padding: 0 0 0 30px; list-style: none; }
header #hService ul li a i { margin-right: 10px; }
@media screen and (max-width: 959px) { header #hService ul li a i { margin-right: 0; } header #hService ul li a span { display: none; } }*/

/***-------------------------------------------*** Desktop ***-------------------------------------------***/
@media screen and (min-width: 1201px) {
	/* Start: Allgemein */
	header #hHamburger { display: none; }
	/* End: Allgemein */

	/* Start: First-Level */
	header #hNavigation > ul { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; width: 100%; padding: 22px 0 0 0; }
	header #hNavigation > ul > li { margin: 65px 0 0 0; }
	header #hNavigation > ul > li > a {
		display: block;
		font-family: 'Raleway', sans-serif;
		font-weight: 700;
		font-size: 26px;
		line-height: 32px;
		color: #095AA6;
		text-align: left;
		white-space: nowrap;
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out;
	}
	header #hNavigation > ul > li > a:after {
		content: "|";
		display: inline-flex;
		margin: 0 7px;
		font-family: 'Raleway', sans-serif;
		font-weight: 700;
		font-size: 26px;
		line-height: 32px;
	}
	header #hNavigation > ul > li.current > a, header #hNavigation > ul > li:hover > a { color: #495057 !important; }
	/* End: First-Level */

	/* Start: Scrolled */
	/*body,
	header,
	header .cms_container_wide_60,
	body #logo_container,
	header #hLng,
	#hSearch,
	header #hNavigation > ul > li,
	header #hNavigation > ul {
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out;
	}
	body.scrolled { padding-top: 120px; }
	body.scrolled header { height: 120px; }
	body.scrolled header .cms_container_wide_60 { height: 120px; }
	body.scrolled #logo_container { width: 150px; height: 76px; }
	body.scrolled header #hLng { top: -25px; }
	body.scrolled #hSearch { top: -30px; }
	body.scrolled header #hNavigation > ul { padding: 44px 0 0 0; }
	body.scrolled header #hNavigation > ul > li { margin: 0; }
	body.scrolled header #hNavigation > ul { align-items: center; }*/
	/* End: Scrolled */
}

@media screen and (max-width: 1748px) {
	header .cms_container_wide_60 { padding: 0 30px; }
	header #hLng { right: 307px; }
	#hSearch { right: 30px; }
}

@media screen and (min-width: 1201px) and (max-width: 1445px) {
	header #hNavigation > ul { justify-content: flex-start; padding: 120px 0 0 0; }
	header #hNavigation > ul > li { margin: 0; }
	body #logo_container { top: 22px; left: 30px; width: 150px; height: 76px; transform: none; }
	/* Start: Scrolled */
	/*body.scrolled { padding-top: 76px; }
	body.scrolled header { height: 76px; }
	body.scrolled header .cms_container_wide_60 { height: 76px; }
	body.scrolled #logo_container { top: -76px; }
	body.scrolled header #hLng { top: -25px; }
	body.scrolled #hSearch { top: -30px; }
	body.scrolled header #hNavigation > ul { align-items: flex-start; padding: 22px 0 0 0; }*/
	/* End: Scrolled */
}

/***-------------------------------------------*** Tablet ***-------------------------------------------***/
@media screen and (min-width: 960px) and (max-width: 1200px) {
	/* Start: Allgemein */
	header #hNavigation	{
		position: fixed;
		top: 179px;
		right: -100%;
		bottom: 0;
		overflow-y: auto;
		-webkit-transition: all .3s;
		-moz-transition: all .3s;
		-o-transition: all .3s;
		-ms-transition: all .3s;
		transition: all .3s;
	}
	body.navi header #hNavigation { right: 0; }
	header #hHamburger { position: absolute; right: 30px; bottom: 32px; width: 70px; height: 60px; padding: 15px; background: #095AA6; }
	body header #hNavigation #logo_container { display: none; }
	body .cms_container_wide_60 > #logo_container { display: block; position: relative; top: auto; left: auto; transform: none; }
	header .cms_container_wide_60 { padding: 22px 30px 0 30px; }
	/* End: Allgemein */
	
	/* Start: First-Level */
	header #hNavigation > ul { display: block; padding: 5px 0; background: #FFFFFF; border: 2px solid #095AA6; }
	header #hNavigation > ul > li { padding: 5px 10px; }
	header #hNavigation > ul > li > a {
		display: block;
		font-family: 'Raleway', sans-serif;
		font-weight: 700;
		font-size: 26px;
		line-height: 32px;
		color: #095AA6;
		text-align: left;
		white-space: nowrap;
		background: #FFFFFF;
		border: 2px solid #095AA6;
		padding: 5px;
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out;
	}
	header #hNavigation > ul > li.current > a, header #hNavigation > ul > li:hover > a { color: #FFFFFF !important; background: #095AA6; }
	/* End: First-Level */
	
	/* Start: Scrolled */
	/*body,
	header,
	header .cms_container_wide_60,
	body #logo_container,
	header #hHamburger,
	header #hNavigation,
	header #hLng,
	#hSearch {
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out;
	}
	body.scrolled { padding-top: 120px; }
	body.scrolled header { height: 120px; }
	body.scrolled header .cms_container_wide_60 { height: 120px; }
	body.scrolled #logo_container { width: 150px; height: 76px; }
	body.scrolled header #hLng { top: -25px; }
	body.scrolled #hSearch { top: -30px; }
	body.scrolled header #hHamburger { bottom: 22px; }
	body.scrolled header #hNavigation { top: 120px; }*/
	/* End: Scrolled */
}

/***-------------------------------------------*** Smartphone ***-------------------------------------------***/
@media screen and (max-width: 959px) {
	/* Start: Allgemein */
	header #hNavigation	{
		position: fixed;
		top: 179px;
		right: -100vW;
		bottom: 0;
		width: 100vW;
		overflow-y: auto;
		background: #FFFFFF;
		-webkit-transition: all .3s;
		-moz-transition: all .3s;
		-o-transition: all .3s;
		-ms-transition: all .3s;
		transition: all .3s;
	}
	body.navi header #hNavigation { right: 0; }
	header #hHamburger { position: absolute; right: 30px; bottom: 15px; width: 70px; height: 60px; padding: 15px; background: #095AA6; }
	body header #hNavigation #logo_container { display: none; }
	body .cms_container_wide_60 > #logo_container { display: block; position: relative; top: auto; left: auto; transform: none; }
	header .cms_container_wide_60 { padding: 22px 30px 0 30px; }
	/* End: Allgemein */

	/* Start: Language Navigation Mobile */
	header #hLng { display: none; }
	.hLngMobileContainer { display: block; width: 100%; padding: 25px 10px 5px 10px; }
	header #hLngMobile {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		align-items: center;
		width: 100%;
		border: 2px solid #095AA6;
		padding: 5px;
	}
	header #hLngMobile ul { display: flex; }
	header #hLngMobile > ul > li { padding: 0 15px 0 0; }
	header #hLngMobile > ul > li:last-of-type { padding: 0; }
	header #hLngMobile ul li a {
		cursor: pointer;
		display: flex;
		align-items: center;
		gap: 5px;
		font-family: 'Raleway', sans-serif;
		font-weight: 700;
		font-size: 18px;
		line-height: 24px;
		color: #095AA6;
		text-align: left;
		white-space: nowrap;
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out;
	}
	header #hLngMobile ul li:hover a { color: #495057; }
	header #hLngMobile ul li.current a { color: #495057; }
	header #hLngMobile img { display: flex; width: 20px; height: 15px; }
	/* End: Language Navigation Mobile */

	/* Start: Search Mobile */
	#hSearch { display: none; }
	#hSearchMobile {
		position: relative;
		z-index: 12;
		top: auto;
		right: auto;
		display: flex;
		max-width: none;
		width: 100%;
		padding: 25px 10px 5px 10px;
	}
	#hSearchMobile > form {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		border: 2px solid #095AA6;
		border-radius: 0px;
		background: #FFFFFF;
		padding: 5px 31px;
	}
	#hSearchMobile #search_input {
		display: block;
		width: 100%;
		font-family: 'Raleway', sans-serif;
		font-weight: 400;
		font-size: 16px;
		line-height: 18px;
		color: #707070;
		text-align: right;
		background: transparent;
		padding: 0;
		height: auto;
		border: none;
		outline: 0;
	}
	#hSearchMobile #search_input::placeholder {
		font-family: 'Raleway', sans-serif;
		font-weight: 400;
		font-size: 16px;
		line-height: 18px;
		color: rgba(112,112,112,0.8);
		text-align: right;
	}
	#hSearchMobile #search_input:-ms-input-placeholder {
		font-family: 'Raleway', sans-serif;
		font-weight: 400;
		font-size: 16px;
		line-height: 18px;
		color: rgba(112,112,112,0.8);
		text-align: right;
	}
	#hSearchMobile #search_input::-ms-input-placeholder {
		font-family: 'Raleway', sans-serif;
		font-weight: 400;
		font-size: 16px;
		line-height: 18px;
		color: rgba(112,112,112,0.8);
		text-align: right;
	}
	#hSearchMobile #search_submit {
		display: flex !important;
		align-items: center;
		justify-content: center;
		width: 31px;
		height: 28px;
		background: transparent;
		border: none;
		outline: 0;
		padding: 0;
		margin: 0;
		position: absolute;
		right: 0;
		top: 0;
	}
	#hSearchMobile #search_submit:before {
		content: "";
		width: 19px;
		height: 19px;
		background: url(/pages/img/suche_icon.svg);
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center;
	}
	/* End: Search Mobile */

	/* Start: First-Level */
	header #hNavigation > ul { display: block; padding: 5px 0; background: #FFFFFF; border: 2px solid #095AA6; }
	header #hNavigation > ul > li { padding: 5px 10px; }
	header #hNavigation > ul > li > a {
		display: block;
		font-family: 'Raleway', sans-serif;
		font-weight: 700;
		font-size: 26px;
		line-height: 32px;
		color: #095AA6;
		text-align: left;
		white-space: nowrap;
		background: #FFFFFF;
		border: 2px solid #095AA6;
		padding: 5px;
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out;
	}
	header #hNavigation > ul > li.current > a, header #hNavigation > ul > li:hover > a { color: #FFFFFF !important; background: #095AA6; }
	/* End: First-Level */
	
	/* Start: Scrolled */
	body,
	header,
	header .cms_container_wide_60,
	body #logo_container,
	header #hHamburger,
	header #hNavigation {
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out;
	}
	body.scrolled { padding-top: 120px; }
	body.scrolled header { height: 120px; }
	body.scrolled header .cms_container_wide_60 { height: 120px; }
	body.scrolled #logo_container { width: 150px; height: 76px; }
	body.scrolled header #hHamburger { bottom: 22px; }
	body.scrolled header #hNavigation { top: 120px; }
	/* End: Scrolled */
}

@media screen and (max-width: 540px) {
	body { padding-top: 202px; }
	header { height: 202px; }
	header .cms_container_wide_60 { height: 202px; }
	header #hNavigation { top: 202px; }
	body .cms_container_wide_60 > #logo_container { position: absolute; top: 22px; left: 50%; transform: translateX(-50%); width: 150px; height: 76px; }
	body.scrolled { padding-top: 104px; }
	body.scrolled header { height: 104px; }
	body.scrolled header .cms_container_wide_60 { height: 104px; }
	body.scrolled header #hNavigation { top: 104px; }
	body.scrolled #logo_container { top: -76px; }
	header #hHamburger { right: auto; bottom: 22px; left: calc(50% - 35px); }
}