
	* {box-sizing: border-box; }
	
	.mandant {grid-area: left; background: #eee; padding-left: 0.5em; text-align: center; }
    .topmenu {grid-area: center; background: #eee;}
    .toolmenu {grid-area: right; background: #eee; display: flex; justify-content: flex-end;} 
    .toolmenu * {margin-right: 0.2em;} 
    
	.topmenu div, .topnav div, .hmenulight { background-color:#f9f9f9;  /* Green #4CAF50; (red: #f44336;) */
         border: 1px solid #008CBA; border-radius: 4px;
         min-width: 5rem; 
         text-align: center;
         text-decoration: none;
         display: inline-block;
         font-size: 0.67em; padding: 0.1em 0.4em; margin: 0 0.1em 0.2em 0.1em;
        }
	   .hmenulight:hover, .topnav div:hover, .topmenu div:hover  {background-color: #f1f1ff; color: #42c; box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);} 
	
	.brand {color: #111; font-weight: 600;}
	.brand:after {content: '\00a0\00a0\003a\003a\00a0\00a0'; color: lightgray; letter-spacing: -0.1em;} 
	
	.bannerbrand {display: none;}
	
	a {
     text-decoration: none;
     font-weight: 500; color: #42c;
    }

    a:visited {
     color: #42c; font-weight: 500;
    }
	.toolnav img {margin: 0 0.2em;}
    .topmenu {display: flex; flex-wrap: wrap; padding: 0 1em;
    }
	#topnavcontainer {margin-bottom: 0.2em; padding-bottom: 0.2em; border-bottom: 0px solid #eee; font-size: 0.83em; }
	
	.banner {border-bottom:  0px solid #ccc; text-align:  center; grid-area: center;}
    .bannerleft {border-bottom:  0px solid #ccc; text-align: right; grid-area: left; font-size: 1.5em;}
    .bannerright {border-bottom:  0px solid #ccc; text-align:  right; grid-area: right;}

    .maincontent {flex-shrink:  1; flex-grow:  1; display: grid;  flex-direction: column;
         
		 grid-template-areas:
        'left right'; 
         grid-template-columns: 180px 1fr;
		 
         grid-gap: 0px;
		 
         overflow:  hidden;
		 border-top: 2px solid #ddd;
  }
      header {flex: 0 0 auto; display: grid;  
         grid-template-areas:
        'left center right'; 
         grid-template-columns: 180px 1fr 180px;
	     grid-gap: 0px;
         overflow:  hidden;
		 padding: 0.5em; font-size: 1.0em;
		 background: #eee;
  }
  .topmenucontainer { 
  	 padding: 0;
  }
    
    .contentmenu { 
	grid-area: left;  
	border: 0px dotted dodgerblue; font-size:  0.9em;  padding:  0.5em; display: flex; flex-direction: column; overflow-y: hidden; overflow-x: visible;  background: #f9f9f9; }
	
	
	.innercontent { 
	 grid-area: right; 
	 border: 0px dotted red; 
	 display: flex; flex-direction: column;
	 overflow: auto;}

	
	
    footer {flex:  0 0 auto; text-align:  center; font-size:  0.9em; padding: 0.5em;  background: #eee; border-top: 1px solid #ddd;}

    @media screen and (min-width: 1040px) {

.maincontent { 
         grid-template-columns: 240px 1fr; 
		          grid-gap: 0px;
  }
  header { grid-template-columns: 240px 1fr 240px;
	     
  }
}	
    @media screen and (max-width: 960px) {


.maincontent { 
         grid-template-columns: 180px 1fr;
		 
         grid-gap: 2px;
  }
}	

@media screen and (max-width: 800px) {

.contentmenu { display: none;
  }
.maincontent { 
 grid-template-columns: 0px 1fr;
		 
         grid-gap: 0px; 
}	
.bannerleft {display: none;}
.bannerbrand {display: inline-block;}
}

.nomenu { 
 grid-template-columns: 0px 1fr;
 grid-gap: 0px; 
}

#mini {
	margin-top: 0.0em;
	padding: 1em 0;
	font-weight: 500;
}
@media screen and (max-width: 1024px) {
#mini {font-size: 0.83em;}

}
#mini ul {
  margin: 6px 0 12px 0;
  padding: 0 0 0 22px;
  border: 0;
  list-style: none;
}
#mini > ul > li {
  font-weight: normal;
}
#mini > ul > li.active, #mini > ul > li.active > ul {
  margin-top: 10px;
}
#mini > ul > li > ul li {
  margin-top: 4px;
  padding: 2px;
  font-weight: normal; font-size: 1.0em;
}
#mini a{
  text-decoration: none;  
}
#mini a:hover{
 box-shadow: 0 2px 6px 0 rgba(0,0,0,0.24);	
 display: block;
}
#mini .has_sub:before {
  content: "\25BA "; font-size: 0.67em;

	font-weight: bold; color: rgb(0, 93, 167);
	margin-right: 5px;
}
#mini .has_sub.active:before {
  content: "\25BC "; font-size: 0.67em; color: #000;
}
#mini a, #mini a:visited { 
	 color: #42c;

}

	