.header1 {
  margin-top: 6rem;
  text-align: left; }
.header2 {
  margin-left: 0.5%;
  margin-top: 3rem;
  align: center;
  text-align: left; }
.header3 {
  margin-left: 1%;
  margin-top: 3rem;
  align: right;
  text-align: right; }
.headerbottom {
  margin-top: 1rem;
  margin-bottom: 1rem; }
td.qwer {border: 0px solid #E1E1E1;
  vertical-align:middle;}
a.sfinx, a.sfinx:visited {color:white;}
a.sfinx:hover  {color:red;}

li.ex  {color:#777;}
a.ex, a.ex:visited {color:#777;}
a.ex:hover  {color:#69c;}

/* IDs  2. Kopfmenu */
		#nav2 {
			/*position:absolute;
			top:130px; 
			 left 110 statt 150 wegen Rechtsverschiebung der ul#nav...*/
			left:1px;
			width:960px; 
			
			margin:0 auto;
			margin-top:0px;
			/*padding:0px;
			/* border: red 1px solid; */
		}
  .has-docked-nav .nav2 {
    position: fixed;
    top: 0;
    left: 0; }
		ul#nav2igation {
			margin:0px auto;
			position:relative;
			float:left;
			border-left:1px solid #fff;
			border-right:1px solid #fff;
			border-bottom:1px solid #fff;
			color: #fff;
			text-decoration: none;

		}

		ul#nav2igation li {
			display:inline;
			font-weight:normal;
			margin:0;
			padding:0;
			float:left;
			position:relative;
			border-top:1px solid #fff;
			border-bottom:1px solid #fff;
			color: #fff;
			text-decoration: none;
			line-height: 1.3;
		}

		ul#nav2igation li a {
			/* 1. Wert bestimmt Höhe Menueleiste  */
			padding:2px 31px;
			color:#fff; /* #616161; */
			/* text-shadow:1px 1px 0px #fff; */
			text-decoration:none;
			display:inline-block; 
			border-top:1px solid #fff;
			border-right:1px solid #fff;
			/*border-left:1px solid #C2C2C2;
			border-bottom:1px solid #fff;*/
			background: #036;   /* #f5f5f5; */
		/*
			-webkit-transition:color 0.2s linear, background 0.2s linear;	
			-moz-transition:color 0.2s linear, background 0.2s linear;	
			-o-transition:color 0.2s linear, background 0.2s linear;	
			transition:color 0.2s linear, background 0.2s linear;	*/
		}

		ul#nav2igation li a:hover {
			background:  #036; 
			color:#fff; /* #616161; */
			
		}

		ul#nav2igation li:hover > a {
			background: #036; /*#fff; */
		}

		/* Drop-Down Navigation */
		ul#nav2igation li:hover > ul
		{
			visibility:visible;
			opacity:1;
		}

		ul#nav2igation ul, ul#nav2igation ul li ul {
			list-style: none;
				margin: 0;
				padding: 0;    
			visibility:hidden;
				position: absolute;
				z-index: 99999;
			width:180px;
			background: #036 ; /* #f8f8f8; */
		/*	box-shadow:1px 1px 3px #ccc;
			opacity:0;
			-webkit-transition:opacity 0.2s linear, visibility 0.2s linear; 
			-moz-transition:opacity 0.2s linear, visibility 0.2s linear; 
			-o-transition:opacity 0.2s linear, visibility 0.2s linear; 
			transition:opacity 0.2s linear, visibility 0.2s linear; 	*/
		}

		ul#nav2igation ul {
				/* 1. Wert bestimmt Abstand zu Menueleiste */
				top: 20px;
				left: 1px;
		}

		ul#nav2igation ul li ul {
				top: 0;
				left: 181px;
		}

		ul#nav2igation ul li {
			clear:both;
			width:100%;
			border:0 none;
			border-top:1px solid #c9c9c9;
		}

		ul#nav2igation ul li a {
			background:none;
			/* 1. Wert bestimmt Höhe Menueunterblock, 2. Zeilnrndabstd. */
			padding:3px 15px;
			color:#fff; /* #616161; */
			/* text-shadow:1px 1px 0px #fff; */
			text-decoration:none;
			display:inline-block;
			border:0 none;
			float:left;
			clear:both;
			width:150px;
		}

		ul#nav2igation li a.first {
			border-left: 0 none;
		}

		ul#nav2igation li a.last {
			border-right: 0 none;
		}

/*
Frontbild Beischrift
 */

 /*
 #wrapper {
	width: 480px;
	height: 290px;
 }
 */

 /*
 #wrapper .textinfo {
	position: relative;
	top: -250px;
	left: 3px;
 }
 */

@media screen and (max-width: 768px) {
	.button-container {
		flex-direction: column;
		align-items: center;
	}
}



/* NEU oder verbessert */
.banner {
	position: relative;
	width: 100%;
	height: 60vh;
	overflow: hidden;
   }
.banner img {
	width: 100%;
	height: auto;
	object-fit: cover;
	opacity: 0.7;
}
.button-container {
	position: absolute;
	bottom: 10px;
	left: 50%;
	width: 90%;
	transform: translateX(-50%); 
	text-align: center;
	z-index: 1;
}
.button-container button {
	padding: 10px 20px;
	background-color: #fff;
	color: #036;
	border: 1px solid #036;
	border-radius: 5px;
	margin: 5px;
	cursor: pointer;
	opacity: 1;
}

#wrapper:hover .textinfo {
	visibility:visible;
	}‚
	
	/*
	 * Infotip (Sponsor etc)
	 */
	
	a.infotip {
	  position: relative;
	  text-decoration: none;
	}
	a.infotip:after {
	  content: attr(data-infotip);
	  position: absolute;
	  bottom: 130%;
	  left: 20%;
	  background: #ffcb66;
	  padding: 5px 15px;
	  color: black;
	  -webkit-border-radius: 10px;
	  -moz-border-radius : 10px;
	  border-radius : 10px;
	  white-space: nowrap;
	  opacity: 0;
	  -webkit-transition: all 0.4s ease;
	  -moz-transition : all 0.4s ease;
	  transition : all 0.4s ease;
	}
	a.infotip:before {
	  content: "";
	  position: absolute;
	  width: 0;
	  height: 0;
	  border-top: 20px solid #ffcb66;
	  border-left: 20px solid transparent;
	  border-right: 20px solid transparent;
	  -webkit-transition: all 0.4s ease;
	  -moz-transition : all 0.4s ease;
	  transition : all 0.4s ease;
	  opacity: 0;
	  left: 30%;
	  bottom: 90%;
	}
	a.infotip:hover:after {
	  bottom: 100%;
	}
	a.infotip:hover:before {
	  bottom: 70%;
	}
	a.infotip:hover:after, a:hover:before {
	  opacity: 1;
	}

	.textinfo {
		position: absolute;
		top: 10px; /* Adjust distance from the top */
		right: 10px; /* Adjust distance from the right */
	  background-color: rgba(204,204,204,0.8);
	  width: 420px;
	  height: 230px;
	  padding: 6px 6px 5px 6px;
	  text-align: left;
	  font-size: 9pt;
	  line-height: 1.2em;
	  color: #036;
	visibility:hidden;
	}