input.hidden, .mobilnavi {display:none;}

@media screen and (max-width: 960px) {
/* Schalter für die Toggleleiste */
div.mobilnavi {display:block; top: 0px; overflow: auto;}                    
#toggle, #toggle2 {
  position:absolute;
  appearance:none;
  cursor:pointer;
  left:-100%;
  top:-100%;
}
#toggle + label, #toggle2 + label {
  	position: fixed !important;
  	cursor:pointer;
  	padding:10px;
  	background: url("/fileadmin/Resources/Public/img/icons/icon_menue_38.gif") no-repeat transparent;
  	z-index: 2000;
	color: #FFF;
	line-height:20px;
	font-size: 9px;
	text-align:center;
	-webkit-font-smoothing: antialiased;
	cursor: pointer;
  	margin: 15px 0 0 0;
  	transition:all 500ms ease;
  	width: 38px;
  	height: 16px;
  	padding: 22px 0 0 0;
}

#toggle2 + label {
margin: 58px 0 0 0;
background: url("/fileadmin/Resources/Public/img/icons/icon_info_38.gif") no-repeat transparent;}

#toggle:checked ~ div.mobilnavi, #toggle:checked ~ div.mobilnavi ul, #toggle2:checked ~ table#servicepanel {left: 0px !important;
top: 0 !important; position: fixed !important; width: 250px;
}
#toggle:checked ~ .layoutwrapper {margin: 0 -260px 0 260px;}
#toggle2:checked ~ .layoutwrapper {margin: 0 -315px 0 315px;}
#toggle:checked + label  {left: 259px;}
#toggle2:checked + label  {left: 259px; margin: 15px 0 0 0 !important;}
/*
#c1 {left: -260px;}
*/
#toggle:checked ~ #c1 {
display: block; z-index: 2013 !important; left: 0 !important;
}

#toggle:checked ~ #c1:not(:target) {z-index: 2014 !important; display: none important; width: auto !important; height: auto; max-height: 99.9%;  background: transparent;}




/* Layoutcontainer */

.layoutwrapper {
	transition: margin 300ms cubic-bezier(0.17, 0.04, 0.03, 0.94);
	padding: 0; background: transparent;
}

/* Navigationsleiste
.mobilnavi {position: fixed !important;}
*/

.mobilnavi {
	top: 0px !important;
	left: -260px !important;
	width: 260px !important;
	height: 100% !important;
	padding: 5px 0px !important;
	transition: left 300ms cubic-bezier(0.17, 0.04, 0.03, 0.94) !important; 
	overflow: hidden;
	box-sizing: border-box;
	color: #FFF;
	background:#333;
	color: #CECFC7
	}

.mobilnavi ul, .mobilnavi li {list-style: none; margin: 0; padding: 0; }
.mobilnavi ul {
	position:absolute; left: -250px; top:0; padding:0 0 0 10px; margin:0; list-style:none; opacity:0.25;
	-webkit-transition:0.5s;-o-transition:0.5s; transition:0.5s;
	height: 100%; min-height: 100%;}

.mobilnavi ul {opacity:1; padding-top: 18px;}

.mobilnavi a.do {

    font: bold 14px/40px verdana,arial,sans-serif;
    /*
    display: block;
    margin-right: 40px;
    padding: 0;
    position: relative; */
    text-decoration: none;
    z-index: 10;
}
/*
.mobilnavi li {border-bottom: 1px solid #CECFC7; padding: 8px; }
.mobilnavi a.it {

float: right !important; border-left: 1px solid #CECFC7; padding: 8px 0; font-weight: bold; width: 40px; z-index: 3000; 

    background: url("../img/icons/pfeil_icon_menu_right_10.png") no-repeat scroll center center transparent;
    border-left: 1px solid #666;
    cursor: default;
    display: block;
    float: right;
    height: 40px;
    margin-top: -40px;
    position: relative;
    transition: all 0s ease 0s;
    width: 40px;
    z-index: 100;
}
*/
.mobilnavi a {color: #CECFC7; padding: 8px 0; font-weight: bold;}
.mobilnavi a:hover, .mobilnavi a:active, .mobilnavi a:focus {color: #FFF !important;}

/*
table#servicepanel {
        position: absolute !important;
	top: 0px !important;
	left: -335px;
	width: 230px !important;
	height: auto;
	/* border-top: 80px solid #F6F6F6 !important; */ 
        border-bottom: 800px solid #F6F6F6 !important;
	padding: 20px !important;
	transition: left 300ms cubic-bezier(0.17, 0.04, 0.03, 0.94) !important; 
	overflow: auto;
	box-sizing: border-box;
	color: #FFF;
	background:#333;
	z-index: 3000 !important;
	}
*/

}