/*************************************************/
/* this section is for styling the slide-in menu */
/*************************************************/

.hidden {display:none;}
.screen {/*width:320px;*/width:300px; background:#fff; position:fixed; /*left:-320px;*/right:-320px; top:0; bottom:0; overflow:hidden; overflow-y:auto;
		-webkit-transition:0.4s; -moz-transition:0.4s; -o-transition:0.4s; transition:0.4s;
		z-index:10;
		/*height:400px;*/
		background: rgb(266,266,266);/*Fallback for web browsers that doesn't support RGBa*/
		background: rgba(266,266,266,0);/*RGBa with "0" opacity*/
		}
.screen input {position:absolute; display:none;}

.m-open {width:60px; height:60px; position:fixed; top:0; right:0; /**/border-radius:0 0 0 10px; background:#fff;
		-webkit-transition:0.4s; -moz-transition:0.4s; -o-transition:0.4s; transition:0.4s;
		display:none; z-index:10;
		}
.m-open label {display:block; width:50px; height:50px; cursor:pointer; position:relative; left:5px; top:5px;}
.m-open label:before {content:""; display:block; width:30px; height:15px; border-top:5px solid #000; border-bottom:5px solid #000; position:absolute; left:10px; top:12px;}
.m-open label:after {content:""; display:block; width:30px; height:5px; background:#000; position:absolute; left:10px; top:22px;}

.menutablet li.m-close {position:relative; background:#fff; font:normal 14px/40px 'texgyreadventorbold', arial, sans-serif; color:#888; text-transform:uppercase;}
/*.menutablet li.m-close label {display:block; width:40px; height:40px; position:absolute; left:30px; top:9px; cursor:pointer;}
.menutablet li.m-close label:before {content:""; display:block; width:30px; height:14px; border-top:4px solid #000; border-bottom:4px solid #000;}
.menutablet li.m-close label:after {content:""; display:block; width:30px; height:4px; background:#000; position:absolute; left:0; top:9px;}*/
.menutablet li.m-close label {display:block; width:40px; height:40px; position:absolute; left:0; top:0; cursor:pointer; color:#000; border-right:1px solid #666; font-size:30px; font-weight:bold; text-align:center;}
.menutablet li.m-close label:after {content:" x ";}

.menutablet {position:absolute; left:0; top:0; width:320px; z-index:50;
			-webkit-transition: left 0.5s; -moz-transition: left 0.5s; -o-transition: left 0.5s; transition: left 0.5s;
			}
.menutablet ul {padding:0; margin:0; list-style:none; position:absolute; left:0; top:0; height:400px; background:#fff; width:300px;
			background: rgb(266,266,266);/*Fallback for web browsers that doesn't support RGBa*/
			background: rgba(266,266,266,0);/*RGBa with 0.6 opacity*/
			}
.menutablet ul li {display:block; width:300px; float:left; height:40px; line-height:40px; background:#fff; border-top:1px solid #666; border-bottom:1px solid #222;	border-left:1px solid #666;}
.menutablet ul li:last-child {border-radius:0 0 0 10px;}
.menutablet ul li a {display:block; color:#000; text-decoration:none; font:normal 14px/40px 'texgyreadventorbold', arial, sans-serif; text-transform:uppercase; padding-left:30px;
				white-space: nowrap; overflow: hidden; text-overflow:ellipsis;
				}
.menutablet ul li.fahnen a {float:left; margin:5px;}
#kopf .menutablet ul li a:link, .menutablet ul li a:visited, .menutablet ul li a:active {text-decoration:none; color:#000;}
#kopf .menutablet ul li a:hover, .menutablet ul li a:focus {text-decoration:none; font-weight:bold;}
.menutablet ul ul li a { text-transform:none; padding-left:15px; padding-right:5px; } /*Links in Submenus*/


.menutablet ul ul {left:-9999px; top:-9999px; z-index:100; opacity:0;
				-webkit-transform:scale(2); -moz-transform:scale(2); -o-transform:scale(2); transform:scale(2);
				-webkit-transform-origin: 50% 100%; -moz-transform-origin: 50% 100%; -o-transform-origin: 50% 100%; transform-origin: 50% 100%;
				-webkit-transition: opacity 0.5s, left 0s 0.5s, top 0s 0.5s, -webkit-transform 0.5s; -moz-transition: opacity 0.5s, left 0s 0.5s, top 0s 0.5s, -moz-transform 0.5s; -o-transition: opacity 0.5s, left 0s 0.5, top 0s 0.5s, -o-transform 0.5s; transition: opacity 0.5s, left 0s 0.5s, top 0s 0.5s, transform 0.5s;
				}
/*.menutablet div {width:40px; height:40px; position:relative; float:right; border-left:1px solid #666;}
.menutablet div label {display:block; cursor:pointer; font-size:30px; font-weight:bold; text-align:center;}*/
	/*** NEU: 5.9.2022 ***/
.menutablet label {display:block; cursor:pointer; font-size:30px; font-weight:bold; text-align:center;}
.menutablet label a { text-align:left; }
.menutablet div { width:40px; height:40px; position:relative; float:right; text-align:center; font-size:30px; font-weight:bold; }
.menutablet label.open a div { text-decoration:none; }
.menutablet label.open a div:after { content:" > "; }


.menutablet li.close {position:relative; font:normal 14px/40px 'texgyreadventorbold', arial, sans-serif; color:#888; text-align:center; text-transform:uppercase;}
/*.menutablet li.close span {padding-right:80px; padding-left:20px;}*/
.menutablet li.close span.closeall {float:left; margin-left:50px;}	/* "schließen" */
.menutablet li.close span.closethis {float:right; margin-right:50px;}	/* "zurück" */
/*.menutablet li.close label.closeSub {display:block; width:40px; height:40px; position:absolute; right:3px; top:0; cursor:pointer; background:#fff; border-left:1px solid #666;}
.menutablet li.close label.closeSub:before {content:""; display:block; width:20px; height:9px; border-top:3px solid #000; border-bottom:3px solid #000; position:absolute; left:10px; top:12px;}
.menutablet li.close label.closeSub:after {content:""; display:block; width:20px; height:3px; background:#000; position:absolute; left:10px; top:18px;}*/
.menutablet li.close label.closeSub {display:block; width:40px; height:40px; position:absolute; right:3px; top:0; cursor:pointer; color:#000; border-left:1px solid #666; font-size:30px; font-weight:bold; text-align:center;}
.menutablet li.close label.closeSub:after {content:" < ";}

/*.menutablet li.close label.closeMenu {display:block; width:40px; height:40px; position:absolute; left:5px; top:0; cursor:pointer; background:#fff;}
.menutablet li.close label.closeMenu:before {content:""; display:block; width:30px; height:14px; border-top:4px solid #000; border-bottom:4px solid #000; position:absolute; left:5px; top:9px;}
.menutablet li.close label.closeMenu:after {content:""; display:block; width:30px; height:4px; background:#000; position:absolute; left:5px; top:18px;}*/
.menutablet li.close label.closeMenu {display:block; width:40px; height:40px; position:absolute; left:0; top:0; cursor:pointer; color:#000; border-right:1px solid #666; font-size:30px; font-weight:bold; text-align:center;}
.menutablet li.close label.closeMenu:after {content:" x ";}


@media only screen and (max-width:969px) {
		/** Show Menu button **/
	.m-open {display:block;}
	
		/** Open menu: **/
	#menu-open:checked ~ .screen {right:0;}
	#menu-open:checked ~ .m-open {right:-320px;}

		/** Open submenu: **/
	#sub1a-open:checked ~ .menutablet ul.sub1a, 
	#sub1b-open:checked ~ .menutablet ul.sub1b,
	#sub1c-open:checked ~ .menutablet ul.sub1c,
	#sub1d-open:checked ~ .menutablet ul.sub1d,
	#sub1e-open:checked ~ .menutablet ul.sub1e,
	#sub1k-open:checked ~ .menutablet ul.sub1k 
		{left:0; top:0; opacity:1; 
		-webkit-transform:scale(1); -moz-transform:scale(1); -o-transform:scale(1); transform:scale(1);
		-webkit-transition: opacity 0.5s, left 0s, top 0s, -webkit-transform 0.5s; 
		-moz-transition: opacity 0.5s, left 0s, top 0s, -moz-transform 0.5s; 
		-o-transition: opacity 0.5s, left 0s, top 0s, -o-transform 0.5s; 
		transition: opacity 0.5s, left 0s, top 0s, transform 0.5s;
		}

		/** Hide main-menu when submenu is displayed: **/
			/*=> main-menu rows:*/
	#sub1a-open:checked ~ .menutablet ul li a.sub1, 
	#sub1b-open:checked ~ .menutablet ul li a.sub1, 
	#sub1c-open:checked ~ .menutablet ul li a.sub1, 
	#sub1d-open:checked ~ .menutablet ul li a.sub1, 
	#sub1e-open:checked ~ .menutablet ul li a.sub1, 
	#sub1k-open:checked ~ .menutablet ul li a.sub1, 
			/*=> submenu-buttons in main-menu:*/
	#sub1a-open:checked ~ .menutablet ul li label.open, 
	#sub1b-open:checked ~ .menutablet ul li label.open, 
	#sub1c-open:checked ~ .menutablet ul li label.open, 
	#sub1d-open:checked ~ .menutablet ul li label.open, 
	#sub1e-open:checked ~ .menutablet ul li label.open, 
	#sub1k-open:checked ~ .menutablet ul li label.open, 
			/*=> flags row:*/
	#sub1a-open:checked ~ .menutablet ul li.fahnen, 
	#sub1b-open:checked ~ .menutablet ul li.fahnen, 
	#sub1c-open:checked ~ .menutablet ul li.fahnen, 
	#sub1d-open:checked ~ .menutablet ul li.fahnen, 
	#sub1e-open:checked ~ .menutablet ul li.fahnen, 
	#sub1k-open:checked ~ .menutablet ul li.fahnen, 
			/*=> Künstlersuche:*/
	#sub1a-open:checked ~ .menutablet ul li.ksuche, #sub1a-open:checked ~ .menutablet ul li.ksuche *, 
	#sub1b-open:checked ~ .menutablet ul li.ksuche, #sub1b-open:checked ~ .menutablet ul li.ksuche *, 
	#sub1c-open:checked ~ .menutablet ul li.ksuche, #sub1c-open:checked ~ .menutablet ul li.ksuche *, 
	#sub1d-open:checked ~ .menutablet ul li.ksuche, #sub1d-open:checked ~ .menutablet ul li.ksuche *, 
	#sub1e-open:checked ~ .menutablet ul li.ksuche, #sub1e-open:checked ~ .menutablet ul li.ksuche *, 
	#sub1k-open:checked ~ .menutablet ul li.ksuche, #sub1k-open:checked ~ .menutablet ul li.ksuche * 
		{ background-color:#555; }
		/*=> flags:*/
	#sub1a-open:checked ~ .menutablet ul li.fahnen img, 
	#sub1b-open:checked ~ .menutablet ul li.fahnen img, 
	#sub1c-open:checked ~ .menutablet ul li.fahnen img, 
	#sub1d-open:checked ~ .menutablet ul li.fahnen img, 
	#sub1e-open:checked ~ .menutablet ul li.fahnen img, 
	#sub1k-open:checked ~ .menutablet ul li.fahnen img, 
		/*=> Künstlersuche:*/
	#sub1a-open:checked ~ .menutablet ul li.ksuche img, 
	#sub1b-open:checked ~ .menutablet ul li.ksuche img, 
	#sub1c-open:checked ~ .menutablet ul li.ksuche img, 
	#sub1d-open:checked ~ .menutablet ul li.ksuche img, 
	#sub1e-open:checked ~ .menutablet ul li.ksuche img, 
	#sub1k-open:checked ~ .menutablet ul li.ksuche img 
		{ visibility:hidden; }


	/*#menu-close:checked ~ .menutablet ul ul {left:-9999px; top:-9999px;}*/
	}