/*
Header styles
*/
#header {
	position:fixed;
	width:100%;
	top:0;
	left:0;
	height:123px;
	z-index:100;
	-webkit-transform: translateZ(0);
}

#headerInternal {
	position:absolute;
	margin:auto;
	left:0;
	right:0;
	
	width:1000px;
	height:100%;
	
	transition:all 1s ease;
}

#headerShadow {
	position:absolute;
	width:100%;
	height:64px;
	top:77px;
	left:0;
}

#headerBackground {
	position:absolute;
	width:100%;
	height:100%;
	background-color:white;
}

#headerTitle {
	color:#009EE2;
	font-weight:600;
	position:absolute;
	right:20px;
	bottom:50px;	
}

#headerLogo {
	position:absolute;
	left:20px;
	top:19px;
	width:210px;
	height:90px;
}

#headerLogoImage {
	max-width:100%;
	max-height:100%;
	margin:auto;
	left:auto;
	right:0;
	top:auto;
	bottom:0;	
}

#headerLogoSmall {
	position:absolute;
	left:22px;
	top:19px;
	width:207px;
	height:90px;
	display:none;
}

#headerLogoImageSmall {
	max-width:100%;
	max-height:100%;
	margin:auto;
	left:auto;
	right:0;
	top:auto;
	bottom:0;	
}

#headerLogoBackground {
	background-color: #E2097D;
	position:absolute;
	height:27px;
	width:122px;
	left:94px;
	bottom:14px;
}

#headerLogoBayern {
	position:absolute;
	width:112px;
	height:20px;
	right:0;
	top:3.5px;	
}

.headerMenuBackgroundColor {
	position:absolute;
	height:27px;
	bottom:14px;
	background-color:#E2097D;
}

#headerMenu {
	width:633px;
	right:126px;
	cursor:initial;
	white-space:nowrap;
	transition:all 1s ease;
	z-index:2000;
}

#headerMenuContact {
	width:45px;
	right:73px;
	cursor:pointer;
	transition:all 1s ease;
}

#headerMenuSearch {
	width:45px;
	right:20px;
	cursor:pointer;
	transition:all 1s ease;
}

#headerMenuContact:hover {
	background-color:#009DE1;
}

#headerMenuSearch:hover {
	background-color:#009DE1;
}

#headerMenu:hover {
	background-color:#E2097D;
}

#headerMenuContactIcon {
	position:absolute;
	width:28px;
	height:20px;
	left:8px;
	top:3px;
}

#headerMenuSearchIcon {
	position:absolute;
	width:20px;
	height:20px;
	left:13px;
	top:3px;
}

#headerMenuMobileIcon {
	position:absolute;
	width:40px;
	height:20px;
	left:2px;
	top:3px;
	transition:all 1s ease;
	opacity:0;
	visibility:hidden;	
	z-index:101;
}

#headerMenu .headerMenuSelected {
	color:#ffeb00;
}

.headerMenuContainer {
	display:inline-block;
	text-align:center;
	text-decoration:none;
	font-size:1rem;
	font-weight:600;
	height:27px;
	color:white;
	cursor:pointer;
	transition:all 1s ease;
}

.headerMenuHoverHelper {
	position:absolute;
	width:123px;
	top:0px;
	height:27px;
	display:none;
	z-index:100;
}

.headerMenuSubMenuContainer {
	background: #ffffff none repeat scroll 0 0;
	box-shadow: -10px 18px 30px rgba(0, 0, 0, 0.1);
	width:220px;
	position:absolute;
	top:27px;
	height:0px;
	border-style:outset;
	border-width:0px;
	transition:opacity 1s ease;
	overflow:hidden;
	opacity:0;
}

.headerMenuSubMenu {
    background-color: #ffffff;
    height: 40px;
    left: 0px;
	text-indent: 10px;
    position: relative;
    top: 0;
    transition: all 1s ease 0s;
    width: 220px;
}

.headerMenuText {
	text-align:center;
	height:27px;
	margin:0;
	margin-top:0.0em;
	padding-top:4px;
	padding-bottom:4px;
	top:0px;
	text-decoration:none;
	font-size:0.9em;
	font-weight:600;
	color:white;
	cursor:pointer;
	transition:all 1s ease;
	opacity:1;
	visibility:visible;
}

.headerMenuSubMenuText {
	position:absolute;
	top:0;
	left:10px;
	width:190px;
	text-align:left;
	margin:0;
	margin-top:0.75em;
	text-decoration:none;
	font-size:0.9em;
	color: #888888;
	cursor:pointer;
	transition:all 1s ease;
	opacity:1;
	visibility:visible;
}

.headerMenuSubMenuText:hover {
	color:#E2097D;
}

/*
Header Menu Mobile
*/
#headerMenuMobileLeave {
	position:fixed;
	width:100%;
	height:100%;
	left:0;
	right:0;
	display:none;
	z-index:999;
}

#headerMenuMobileContainer {
	opacity:0;
	visibility:hidden;
	transition:visibility 0s ease 0s, opacity 1s ease;
	z-index:1010;
}

#headerMenuMobile {
	position:absolute;
	right:126px;
	width:200px;	
	height:auto;
	top:109px;
	background-color:#E2097D;
	visibility:inherit;
	z-index:1000;
}

.headerMenuContainerMobile {
	max-height:40px;
	overflow:hidden;
	transition:max-height 1s ease;
	height:auto;	
	visibility:inherit;
}

.headerMenuOpenMobileContainer {
	width:44px;
	right:0px;
	padding-top:0px;
	padding-bottom:0;
	height:40px;
	margin-left:0;
	position:absolute;
	margin-top:-40px;
	color:white;
	visibility:inherit;
	cursor:pointer;
}

.headerMenuOpenMobile {
	width:20px;
	right:12px;
	top:10px;
	padding-top:0px;
	padding-bottom:0;
	text-align:center;
	line-height:20px;
	height:20px;
	margin-left:0;
	position:absolute;
	border-style:solid;
	border-width:1px;
	border-color:white;
	color:white;
	visibility:inherit;
	cursor:pointer;
	background-color:#E2097D;
	transition:background-color 0.5s ease;
}

.headerMenuOpenMobile:hover {
	background-color:#009DE1;	
}

.headerMenuContainerMobile:hover {
	max-height:320px;
}

.headerMenuText:hover {
	color:#ffeb00;
}

.headerMenuHoverHelper.Mobile {
	height:40px;
	width:200px;
	top:auto;
	left:0;
	z-index:100;
	display:none;
}

.headerMenuText.Mobile {
	width:100%;
	left:0px;
	padding-top:0px;
	padding-bottom:0;
	text-align:left;
	text-indent:10px;
	line-height:40px;
	height:40px;
	margin-left:0;
	margin-right:0;
	visibility:inherit;	
	display:block;
}

.headerMenuSubMenuContainerMobile {
	margin-top:0;
	visibility:inherit;
}

.headerMenuSubMenu.Mobile {
	width:200px;
	visibility:inherit;
}

.headerMenuSubMenuText.Mobile {
	width:100%;
	text-align:left;
	visibility:inherit;
	text-indent:15px;
	margin-top:0;
	height:40px;
	left:0;
	line-height:40px;
}

.headerMenuSubMenu.Mobile {
	left:0;
	text-indent:0;
}

/*
Search Panel
*/
#searchPanel {
	position:absolute;
	top:55px;
	margin-top:0;
	height:60px;
	width:100%;
	background-color:#E2097D;
	transition:margin-top 1s ease;
}

#searchPanelForm {
	position:absolute;
	width:1000px;
	height:100%;
	margin:auto;
	left:0;
	top:0;
	right:0;
	bottom:0;
	transition:all 1s ease;
}

#searchPanelQueryContainer {
	margin:0;
	padding:0;
	position:absolute;
	right:285px;
	height:27px;
	left:100px;
	width:auto;
	top:16px;
	
	transition:all 1s ease;
}

#searchPanelQuery {
	position:absolute;
	width:100%;
	left:0;
	top:0;
	height:27px;
	
	font-size:0.8em;
	font-weight:normal;
	background-color:white;
	border-style:none;
	-webkit-appearance:none;
	border-radius:0;
	
	text-indent:0.6em;
	padding:0;
}

#searchPanelSelect {
	position:absolute;
	height:27px;
	right:178px;
	width:100px;	
	top:16px;
	background-color:white;
	border-style:none;
	color:#333333;
	font-weight:600;
	font-size:0.7rem;
	-webkit-appearance:none;
	-moz-appearance:none;
	text-indent:0.15rem;
	border-radius:0;
}

#searchPanelAccept{
	position:absolute;
	width:151px;
	height:27px;
	right:20px;
	top:16px;
	font-size:0.9rem;
	font-weight:600;
	color:#333333;
	background-color:white;
	border-style:none;
	-webkit-appearance:none;
	border-radius:0;
	
	transition:all 1s ease;
}

#headerMessageMobileLeave {
	position:fixed;
	top:0px;
	height:100vh;
	width:100%;
	opacity:0;
	visibility:hidden;
	left:0;
	right:0;
	z-index:0;
	
	background-color:rgba(0,0,0,0.8);	
	transition:opacity 1s ease;
}

#messagePanel {
	position:fixed;
	top:183px;
	width:700px;
	height:calc(100vh - 243px);
	margin:auto;
	left:0;
	right:0;
	opacity:0;
	visibility:hidden;
	overflow:auto;
	z-index:1000;
}

#messagePanelContent {
	position:relative;
	padding-top:10px;
	padding-bottom:10px;
	width:700px;
	margin:auto;
	left:0;
	right:0;
	background-color:#ffffff;
	z-index:1000;
	transition:opacity 1s ease;
}

#messagePanelForm {
	position:relative;
	width:90%;
	left:5%;
}

#messagePanelForm h2 {
	font-size:1.2em;	
	margin-left:0.5em;
	margin-top:1em;
}

.messagePanelInput {
	background-color:#CBCBCB;
	border:none;	
	width:calc(100% - 1em);
	margin-top:10px;
	margin-bottom:10px;
	position: relative;
	padding-left: 1em;	
}

textarea.messagePanelInput {
	padding-top:12px;	
	width:calc(100% - 1.2em);
}

#messagePanelCheck {
	display:inline-block;
	vertical-align:bottom;
	margin-right:10px;
}

#messagePanelAccept {
	float:right;
	width:150px;
	height:40px;
	border:none;
	font-size:1em;
	font-weight:600;
	color:white;
	background-color:#009EE2;
}

#messagePanelInfo {
	margin:2em;	
}

#messagePanelInfoText p {
	margin:0;	
}

/*
Mitmachen styles
*/
#mitmachen {
	position:fixed;
	width:90px;
	min-height:72px;
	max-width:274px;
	left:0;
	top:255px;
	background-color:#E2097D;
	transition:all 0s ease;
	z-index:10;
	-webkit-transform: translateZ(0);
}

#mitmachenIcon {
	width:100%;
	height:100%;
	margin:auto;
	left:0;
	top:0;
	right:0;
	bottom:0;
	transition:all 1s ease;
}

.mitmachenLink {
	display:block;
	width:100%;
	left:0;
	height:55px;
	transition:all 0.75s ease;
	overflow:hidden;
	background-color:#E2097D;
	cursor:pointer;
}

.mitmachenLink:hover {
	background-color:#009DE1;
}

.mitmachenLinkImage {
	height:100%;
	margin:auto;	
}

#mitmachenLinks {
	display:none;
}

#mitmachenLinksText {
	width:100%;
	height:100%;
	margin:auto;
	left:0;
	top:0;
	right:0;
	bottom:0;
}

#mitmachenText {
	position:absolute;
	left:0;
	bottom:0;	
	width:90px;
	height:72px;
	text-align:center;
	transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	transform-origin: left bottom 0;
	-webkit-transform-origin: left bottom 0;
}

#mitmachenTextMit {
	position:relative;
	color:white;
	margin:0;
	padding:0;
	font-weight:900;
	font-size:40px;
	line-height:40px;
	top:6px;
}

#mitmachenTextBreak {
	font-size:0px;	
	line-height:0;
	display:block;
}

#mitmachenTextMachen {
	position:relative;
	color:white;
	margin:0;
	padding:0;
	font-weight:400;
	font-size:16px;
	line-height:16px;
	top:3px;
}

.socialIconsMobile {
	width:45px;
	height:45px;
	left:0;
	top:0;
	transition:all 1s ease;
}

.socialIconsMobile:hover {
	background-color:#009DE1;
}

/*
Social styles
*/
#mitmachenSocialButtons {
	display:none;
	text-align:center;
	margin-top:10px;
	margin-bottom:10px;
}

#socialButtons {
	position:fixed;
	right:0;
	top:165px;
	width:45px;
	z-index:10;
}

.socialButton {
	position:relative;
	display:block;
	float:right;
	width:45px;
	height:45px;
	margin-bottom:5px;
	background-color:#E2097D;
	transition:all 1s ease;
	cursor:pointer;
	z-index:10;
}

.socialButton:hover {
	background-color:#009DE1;
	padding-right:15px;
}

.socialIcons {
	position:absolute;
	width:45px;
	height:45px;
	left:0;
	top:0;
}

@media (max-width: 1150px) {
/* 
	Mitmachen
*/
	#mitmachen {
		width:45px;
		min-height:158px;	
		top:227px;
	}
	
	#mitmachenText {
		width:158px;
		height:45px;	
		left:45px;
		transform: rotate(-90deg);
		-webkit-transform: rotate(-90deg);
	}
	
	#mitmachenTextMit {
		font-size:22px;	
		top:0px;
		font-weight:400;
	}
	
	#mitmachenTextBreak {
		display:none;	
	}
	
	#mitmachenTextMachen {
		font-size:22px;	
		top:0px;
	}
}

@media (max-width: 1000px) {
	#headerInternal {
		width:100%;
	}
	
	#headerMenu a, #headerMenu div {
		opacity:0;
		visibility:hidden;	
	}
	
	#headerMenu {
		width:45px;
		cursor:pointer;
		overflow:hidden;
	}

	#headerMenu:hover {
		background-color:#009DE1;
	}
	
	#headerMenuMobileIcon {
		opacity:1;
		visibility:visible;	
	}

/*
	Header Search
*/
	#searchPanelForm {
		width:100%;
	}
	
	#searchPanelQueryContainer {
		left:20px;	
	}
}

@media (max-width:700px) {
	#messagePanel {
		width:100%;	
	}
	
	#messagePanelContent {
		width:100%;
	}
	
	#messagePanelForm {
		width:100%;
		left:0%;
	}
	
	#messagePanelForm h2 {
		margin-left:0.0em;
	}
	
	#messagePanelAccept {
		width: 90%;
		margin-right: 5%;
		margin-left:5%;
		margin-bottom:1em;
	}
	
	#messagePanelInfo {
		margin:2em;	
		text-align:center;
	}
	
	#messagePanelInfoText p {
		margin:0;	
	}
	
	.messagePanelInput {
		width: calc(90% - 1em);
		left: 5%;
	}
	
	textarea.messagePanelInput {		
		width:calc(90% - 1.2em);	
	}
}

@media (max-width:580px) , (max-height:420px) {
	#header {
		height:89px !important;	
	}
	
	#headerLogo {
		width:120px !important;	
		height:55px !important;
		display:block !important;
	}
	
	#headerLogoSmall {
		display:none !important;
	}
	
	#searchPanel {
		top:65px !important;	
	}
	
	#headerShadow {
		top:45px;
	}
	
	#messagePanel {
		top:89px !important;
		height:calc(100vh - 89px) !important;
		width:100%;
	}
	
	#mitmachen {
		width:100%;
		min-height:40px;	
		max-width:100%;
		top:89px;
	}
	
	#mitmachenLinks {
		margin-top:40px;	
	}
	
	#mitmachenText {
		width:100%;
		height:40px;	
		left:0px;
		transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
	}
	
	#mitmachenTextMit {
		font-size:1em;	
		font-weight:400;
	}
	
	#mitmachenSocialButtons {
		display:block;
	}	
	
	#mitmachenTextMachen {
		font-size:1em;	
	}
	
	#socialButtons {
		display:none;	
	}
	
	#headerMenuMobileContainer {
		position:absolute;
		overflow:auto;
		top:89px;
		height:calc(100vh - 89px);
		left:0px;
		width:100%;	
	}
	
	#headerMenuMobile {
		right:0px;
		width:100%;	
		top:0px !important;
	}
	
	#headerMessageMobileLeave {
		top:89px;
	}
	
	.headerMenuHoverHelper.Mobile {
		width:100%;
		left:0;
	}
	
	.headerMenuSubMenu.Mobile {
		width:100%;
		left:0;
	}
	
	.headerMenuSubMenuText.Mobile {
		width:100%;
		text-align:left;
		left:1em;
	}
}

@media (max-height:420px) {
	#header {
		height:59px !important;	
	}
	
	#headerLogo {
		width:90px !important;
		top:10px !important;	
		height:40px !important;
	}
	
	#headerTitle {
		display:none;	
	}
	
	#searchPanel {
		top:35px !important;	
	}
	
	#headerShadow {
		top:15px;
	}
	
	#messagePanel {
		top:59px !important;
		height:calc(100vh - 59px) !important;
		width:100%;
	}
	
	#messagePanelContent {
		width:100%;
	}
	
	#messagePanelForm {
		width:100%;
		left:0%;
	}
	
	#messagePanelForm h2 {
		margin-left:0.0em;
	}
	
	#messagePanelAccept {
		width: 90%;
		margin-left:5%;
		margin-right: 5%;
		margin-bottom:1em;
	}
	
	#messagePanelInfo {
		margin:2em;	
		text-align:center;
	}
	
	#messagePanelInfoText p {
		margin:0;	
	}
	
	.messagePanelInput {
		width: calc(90% - 1em);
		left: 5%;
	}
	
	textarea.messagePanelInput {		
		width:calc(90% - 1.2em);	
	}
	
	#mitmachen {
		width:100%;
		min-height:40px;	
		top:59px;
	}
	
	#mitmachenTextMit {
		top:0px;
	}
	
	#mitmachenTextBreak {
		display:none;	
	}
	
	#mitmachenTextMachen {
		top:0px;	
	}

	#headerMenuMobileContainer {
		position:absolute;
		overflow:auto;
		top:59px;
		height:calc(100vh - 59px);
		left:0px;
		width:100%;	
	}
	
	#headerMessageMobileLeave {
		top:59px;
	}
}