#tabmenue { 
	margin: 0 auto; 
	padding:0px;
	background: transparent;
	top:0px;
	margin-top:0px;
	z-index:99991;
	height:30px;
	transition: all 1s;

	/*box-shadow: rgba(0, 0, 0, 0.44) 0px 10px 10px;	*/
	}



.tabs {


}

@media(min-width: 901px)
{
	.tabs {	 	display: flex; flex-wrap:wrap; align-items:center; justify-content:center;}
	#tabmenue {	position:sticky;}
	.tabby-tab label, .tabby-tab a {font-size:clamp(13px, 1.5vw, 20px);}
}

@media(max-width: 900px)
{
		.tabby-tab label, .tabby-tab a {font-size:clamp(13px, 1.5vw, 20px);}
}

.tabby-tab {

	flex-flow: row wrap; 



}







.tabby-tab label {

	display: flex;
	
	justify-content: center;
	align-items: center;
	position:relative;
	padding: 1px 5px 1px 5px;
	cursor: pointer;
		color:#323232;
		text-decoration:none;

}

.tabby-tab a {
	  font-family: 'Montserrat';

	display: flex;
	justify-content: center;
	align-items: center;
	color:#323232;
	padding: 1px 5px 1px 5px;
	 
		text-decoration:none;

}


.tabby-tab label:hover, .tabby-tab a:hover {


	text-shadow: #000 1px 2px 4px;
}

.tabby-content {

display: inline-block;
	max-width:500px;
	min-width:150px;
	position: absolute;

	margin-left:0px;
	max-height:calc(100vh - 100px);
	overflow-y:auto;
z-index:99998;
	padding: 3px;
	padding-right:20px; padding-bottom:20px;
	

	box-shadow: 0 0 6px #333;
	border-radius: 0px 0px 10px 10px;
	background: rgba(220,220,220,0.9);
		opacity: 0;
		scale:1 0;
		transform-origin: top center;
		transition: all 0.8s;
	
}

.tabby-content img {
	float: left;
	margin-right: 20px;
	border-radius: 8px;
	mix-blend-mode:darken;
}


/* MAKE IT WORK ----- */
label {text-decoration:none; font-weight: normal;}
.tabby-tab [type=radio] { display: none; }
[type=radio]:checked ~ label {
		background: rgba(220,220,220,0.9);
	color:#000000;
	text-shadow: #fff 1px 2px 4px;


}

[type=radio]:checked ~ label ~ .tabby-content {

	
	/* show/hide */
		opacity: 1;
		scale:1;
		transition: all 1.2s;;

display: inline-block; max-width:500px;

	position: absolute;
		overflow-x:hidden;
		overflow-y:auto;
}



.tabzu {position:absolute; bottom:0px; right:0px; z-index:99999; cursor:pointer;  padding: 0px; mix-blend-mode: darken !important;}
.tabzu label {border-radius:50%;  height:24px; font-size:20px;z-index:99999;}
.tabzu label:hover {z-index:99999;}
/* label[for="tab-zu9"] {width:100%; border-radius:0px; } */



.zwischentab {width:10px; border-bottom:1px solid black; height: 39px; }

.tabsymbol{border: 1px solid black; border-radius:20px; height:20px; width:20px;  background:orange; display:block; margin-right:7px; margin-bottom:-3px;}
.tabby-content a {text-decoration:none; display:block; padding:5px; height:auto; margin-bottom:2px; border-bottom: 1px solid silver; color:#111; transition: all 1s; font-size:16px; text-shadow: #fff 1px 2px 4px; }
.tabby-content a:hover {background:#111; color:#eee; justify-content:flex-end; transition: all 2s;}
.tabby-content a:last-child { border-bottom: 1px solid transparent;}

.lastchild {right:12px;}

#unteraktuell {background:#23972a; color:#fff; text-shadow: #000 1px 2px 4px;}
#oberaktuell {	background:#23972a; color:#fff; text-shadow: #000 1px 2px 4px;}



	#tabmenue {display:block;}


@media(max-width: 900px)
{

	nav {

		
		
		}
		.tabby-tab a,.tabby-tab label {			background: rgba(220,220,220,1);}
		.tabby-content a {margin-top:2px;}

		.tabs {display:block; width:90vw;}
		.tabby-content {top:auto; max-height:calc(90vh - 100px);}

		.lastchild {top:0px; left:12px; }
/*
.tabby-content img {mix-blend-mode: unset;}
label[for="tab-9"] {position:fixed; top: 4px; right:10px;}
.tabs {flex-direction:column;}
.tabby-content {position:relative; top:0px; margin:0; padding:0px; width:calc(100vw - 20px); height:0px; box-sizing:border-box;}
[type=radio]:checked ~ label ~ .tabby-content {   height:auto; font-size:13px;}
*/
}




/* ~~~~~~~~~~~~~~~ Hamburger - Menü ~~~~~~~ */


@media (width >= 900px) {
	#hamburger, #hamburgerback {display:none;}
	
	nav {position:relative;  display:flex; justify-content:center; align-items:center; transition: all 1s;}
nav a {color:#fff; font-size:26px; text-decoration:none; margin: 0 14px 0 14px; transition:all 1s; padding:6px;}
nav a:hover {background:#ececec; border-radius:8px;  transition:all 1s;}
	
	
	
}

@media (width < 900px )  {
nav {  position: fixed; width:100vw; top:52px; right:-100vw; transition: all 2s; flex-direction:column; display:flex; align-items:stretch; justify-content:center; height:auto; z-index:9999999;}
nav a {color:#fff; font-size:26px; text-decoration:none; margin: 0 14px 0 14px; transition:all 1s; padding:6px; margin:2px 0 2px 0;}
nav a:hover {background:#ececec; border-radius:8px;  transition:all 1s;}


#hamburgerback {
	position:fixed; top:2px; right:2px; width:40px; height:40px; overflow:hidden; z-index:10; background:#464956;border: thin solid white;
}


#hamburger {

	margin:6px -8px 0 0;
  --s: 30px; /* control the size */
  --c: #fff; /* the color */

  z-index:101;
  height: var(--s);
  width:30px;
  aspect-ratio: 1;
  border: none;
  padding: 0;
  border-inline: calc(var(--s)/2) solid #0000; 
  box-sizing: content-box;
  --_g1: linear-gradient(var(--c) 20%,#0000 0 80%,var(--c) 0) 
         no-repeat content-box border-box;
  --_g2: radial-gradient(circle closest-side at 50% 12.5%,var(--c) 95%,#0000) 
         repeat-y content-box border-box;
  background: 
    var(--_g2) left  var(--_p,0px) top,
    var(--_g1) left  calc(var(--s)/10 + var(--_p,0px)) top,
    var(--_g2) right var(--_p,0px) top,
    var(--_g1) right calc(var(--s)/10 + var(--_p,0px)) top;
  background-size: 
    20% 81%,
    41% 100%;

  clip-path: inset(0 25%);
  -webkit-mask: linear-gradient(90deg,#0000,#000 25% 75%,#0000);
  cursor: pointer;

  transition: 
    background-position .3s var(--_s,.3s), 
    clip-path 0s var(--_s,.6s);
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
    
}
#hamburger:before,
#hamburger:after {
  content:"";
  position: absolute;
  border-radius: var(--s);
  inset: 40% 0;
  background: var(--c);
  transition: transform .3s calc(.3s - var(--_s,.3s));

}


#hamburger:checked {

  clip-path: inset(0);
  --_p: calc(-1*var(--s));
  --_s: 0s; 
}








#hamburger:checked + nav {
  transition: all 1s; top:52px; right:0vw;
}


#hamburger:checked:before {
  transform: rotate(45deg);
}
#hamburger:checked:after {
  transform: rotate(-45deg);
}
#hamburger:focus-visible {
  clip-path: none;
  -webkit-mask: none;
  border: none;
  outline: 2px solid var(--c);
  outline-offset: 5px;
 
}




}