/***************************************************
Layout Horizontales Menü
 ****************************************************/

#top-nav {	

width: 100%;
margin-top: -20px;
padding-right: 15px
}

.horizontal {
	float: right;
	padding-right: 5%;
}

.horizontal a {
  padding: 20px 0;
  font-size:1.2vmax;
  color: white;
}

.horizontal li {
  position:relative;
  padding:0 1.9rem;
  display: inline-block;
}
.horizontal li:hover {
  background-color: #0074d9;
}

.horizontal li:hover > a {
  color: #fff;
}




.horizontal  ul {
  border:1px solid #b0a66b;
  visibility:hidden;
  opacity:0; 
  position:absolute;
  left:0;
  transition:all 0.5s ease-out;
  box-shadow:5px 5px 10px #666;
  background-color: #193f86;
}


.horizontal  ul li {
   width: 100%;
   padding: 0;
}

.horizontal ul a {
  padding:5px 10px;
  font-size:1vmax;
  display: block;
}

.horizontal ul ul {
  top:90%;
  left:10%;
  z-index:1100
}

.horizontal li:hover > ul {
  visibility:visible;
  opacity:1
}


/*
.horizontal li > a:after { content: ' \25bc'; color: #b0a66b } /* Dreieck nach unten, wenn gewünscht*/
/*
.horizontal li > a:only-child:after { content: ''; }
*/



/***************************************************
Layout Vertikales Menü
 ****************************************************/
.mainNav {
			background: #fff;
			width: 100%;
			margin: 0;
			margin-top:32px;
		}
			/* First Level */
			.mainNav ul {
				margin: 0;
				padding: 0;
				list-style: none;
				border-bottom: 1px solid #444
			}
			.mainNav ul li {
				border-top: 1px solid #444;
			}
			.mainNav ul li a {
				color: #0074d9;
				display: block;
				font-size: 1.1em;
				line-height: normal;
				padding:12px 20px;
				text-decoration:none;
			}
			.mainNav ul li a:hover {
				background: #0074d9;
				text-decoration: none;
				color:#fff;
			}
				/* Second Level */
				.mainNav ul ul {
					border-bottom: none;
				}
				.mainNav ul ul li {
					background: #fff;
					color:#0074d9;
				}
				.mainNav ul ul li a {
					color: #0074d9;
					display: block;
					font-size: 1em;
					line-height: normal;
					padding: 0.5em 1em 0.5em 2.5em;
				}
				.mainNav ul ul li a:hover {
					background: #0074d9;
				}
						/* Third Level */
				.mainNav ul ul ul {
					border-top:1px solid #222;
				}
				.mainNav ul ul ul li {
					border:none;
				}
				.mainNav ul ul ul li a {
					padding-left:3.5em; 
					padding-top:0.25em; 
					padding-bottom:0.25em;
				}
			/* Accordion Button */
			ul li.has-subnav .accordion-btn {
				color:#fff; 
				background:rgba(0,116,217,0.5); font-size:16px;
			}
		
		@media screen and (min-width: 900px) {
			.mainNav {display: none;}
		}
		@media screen and (max-width: 900px) {
			.mainNav {width: 100%;}
		}
		
/**********************************************
		kleines Menü
**********************************************/

.sidenav {
	 padding: 1rem 0;
  
}
.sidenav li {
	display: inline; 
}
.sidenav li a {
	padding: 2px 10px;
	margin-left: 0.5vw;
	text-decoration: none;
	color:#fff;
	font-size: 0.9vmax;	
}
.sidenav li a:hover {
  padding-bottom:4px; 
  border-bottom: 2px solid #0074d9;
}

/************************************************
		Search
************************************************/

.textbox{
	
	width: 100%;
	height:4vh;
	border: 1px solid #b0a66b;
	border-radius: 20px 0 0 0;
}

/************************************
		Edit page
*************************************/

.editthispage {
	position: absolute; 
	bottom:0; 
	right:0; 
	z-index: 1; 
	border: none; 
	border-radius:10px 0 0 0;

	background: rgba(255,255,255,.5);
	}

.editthispage a{
	color: #fff;
	text-decoration:none;
		padding: 3px 10px;
	}
	
.editthispage a:hover{
	color: #0074d9;
	}

/************************************************
		BackToTop-Button
************************************************/
#backtop {
	position: fixed;
	bottom: 10px;
	right: 0;
	color: #f00;
	width: 50px;
	text-align: center;
	font: 150% Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	text-decoration: none;
	color: #bbb;
	/* background color transition */
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;

}
#backtop:hover {
	color: #000;
	cursor: pointer;
}
/* arrow icon (span tag) */
.back-top span {
	width: 108px;
	height: 108px;
	display: block;
	margin-bottom: 7px;
	background: #ddd url(up-arrow.png) no-repeat center center;
	/* rounded corners */
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	/* background color transition */
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
}
.back-top:hover span {
	background-color: #777;
}


/*****************************************************
		Marquee-Laufband
*****************************************************/
	.marquee {
		position: fixed;
		bottom: 3vh;
		width: 50%;
		max-width: 100vw; /* iOS braucht das */
		white-space: nowrap;
		overflow: hidden;
		font-size: 1.3em;
		color: #f00;
		float:right;
		z-index: 2;
		
		/*background:transparent; #b0a66b;*/
		font-weight:bold;
		line-height: 1.5em;
		/* hier evtl. noch font-size, color usw. */
	}

	.marquee span {
		display: inline-block;
		padding-left: 101%; /* die zusätzlichen 5% erzeugen einen verzögerten Start und vermeiden so ein Ruckeln auf langsamen Seiten */
		animation: marquee 20s linear infinite;
		/*background: #b0a66b;*/
	}
	
	.marquee span:empty {display:none;}

	/* Optional: mouseover (oder Tipp auf dem Touchscreen) pausiert die Laufschrift */
	.marquee span:hover {
		animation-play-state: paused 
	}
	
	.marquee-container:empty {display:none}

	/* Es soll laufen! */
	@keyframes marquee {
		0%   { transform: translateX(0); }
		100% { transform: translateX(-100%); }
	}
	
	
	@media (min-width:900px) {
		.marquee{
			width: 50%;
			margin:0 25vw;
		}
	}
	
	@media (max-width:900px) {
		
		.marquee{
			width: 95%;
			margin: 0 2%;
		}
	}
	
/*****************************************************
		Cookie prmission
*****************************************************/

#dialog-cookies{}

#dialog-cookies .dc-outer{
	border-radius: 40px 0 0 0;
	opacity:1;
	position:fixed;
	bottom:4vh;
	right:3vw;
	width:20%;
	text-align:left;
	padding:0;
	background-color:#193f86;
	color:#fff;
	border:1px solid #fff;
	z-index:999;
	min-width: 300px;
	box-shadow: 11px 11px 9px 1px rgba(27,27,27,0.3);
}
	
#dialog-cookies .dc-inner{
	float:left;
	padding: 15px;
}

#dialog-cookies .dc-inner a{
	color:#fff;
	border-bottom:1px dotted #fff;
	text-decoration:none;
}

#dialog-cookies .dc-inner a:hover{
		border-bottom:1px solid #fff;
}
	
#dialog-cookies .dc-button{
	float:right;
	width: 100%;
	height: 100%;
	padding: 0;
}

#dialog-cookies .dc-button button{
	width: 100%;
	border: none;
	border-radius:	0 0 2px 2px;
	padding:5px 20px;
	background:#fff;
	color:#999;
	cursor:pointer;
	margin-top:8px;
	margin-bottom: -1px;
	font-size: 110%;
}

#dialog-cookies .dc-button button:hover{
		color:#000;
}



