/*	CSS 
	www.modulpark.ch, www.infofactory.ch
  	Funktion 1:Gestaltung der Menu-Ausgabe in individuellen Layouts
	Funktion 2:Moeglichkeit ind. Classes zu definieren (siehe Handbuch Modulpark)
*/

/*===Calibrierung===*/
*{
	padding:0;
	margin:0;
	outline:0;
}

html#mp_htmlFront
 {
    -webkit-text-size-adjust: none;
}


img{
	border:0;}
	
/*HTML und Body*/
html#mp_htmlFront, #mp_htmlFront body {
	height:100%;
	min-height:100%;
	background:#006FBA;}
	

#mp_htmlBackend #mp_content {
	padding-left:20px}
	 
/*===Nav===
===MenuA===========================*/

.mainNav ul{
	list-style-type:none;
	margin:0;
	padding:0;
	display:inline-block;}
	
.mainNav ul li {
	position:relative;
	float:left;
	margin-top:20px;
	padding-bottom: 25px;}
	
.mainNav ul li a{
	display: block;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  padding: 8px 20px 6px 20px;
  margin: 0 10px;
  font: 23px/25px 'Unica One', cursive, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  color: #fff;}

.mainNav ul li:hover>a,
.mainNav ul li a.active{
	background:#2B2826;}


.mainNav ul li:hover>ul{
	visibility:visible;
  opacity:1;
  transition-delay:0s;}

.mainNav ul li #logo a {
	padding:0;}
	
/*Ebene 2 */
.mainNav ul ul{
	visibility:hidden;
  	opacity:0;
  	transition:visibility 0s linear 0.3s,opacity 0.4s linear;
	position:absolute;
  	top:60px;
	left:10px;
	z-index:1000;
	background:#2B2826;
	border-radius:5px;}

.mainNav ul ul li{
	padding-bottom:0;
	margin-top:0;}
  
.mainNav ul ul li a {
	width:140px;
	padding:10px 5px;
	color:#7f7f7f;
	text-align:left;
	margin:0 13px;
	font:normal 15px/17px Arial;
	text-transform:none;}

.mainNav ul li ul li a:hover,
.mainNav ul li ul li a.active { color:#FFF;}

.mainNav ul ul li:first-child a{
	border-top:0;}
	
.mainNav ul ul li a.ifsub:before {
	content:'\f105 ';
  	float:right;}
	
/*Ebene 3 */
.mainNav ul ul ul{
	left:177px;
  	top:0;}	

.mainNav ul ul ul li a {
	font-size:14px;}

/*===================== # # # ===================*/
#closer{
	height:20px;
	width:20px;
	position:absolute;
	right:0;
	top:0;
	cursor:pointer;
	background:#f00;}
	
.mainNav .contactButton{
	display:block;
	background:rgba(255,255,255,.2);
	height:36px;
	width:36px;
	position:relative;
	float:left;
	top:0;
	z-index:2;}
	
.mainNav .contactButton.active{background:#ffdd00;}

.mainNav .contactButton>.mtbArrow {
	background:url(navLvl1.png) no-repeat center center;
	background-size:20px 7px;
	height:36px;
	width:36px;
	display:block;}


/* # # # Mobile Nav # # # */

#mobileNav ul.lvl1 li,
#mobilePagesNav ul.lvl1 li {
	position:relative;}
	
#mobileNav>ul.lvl1>li a,
#mobilePagesNav>ul.lvl1>li a {
	display:block;
	background:#0071BB;
	color:#FFF;
	border-bottom:1px solid #3c3c3c;
	padding:10px 50px 10px 18px;
	font-size:16px;
	font-weight:normal;
	line-height:20px;}
	
#mobileNav>ul.lvl1>li.current>a,
#mobilePagesNav>ul.lvl1>li.current>a {
	border-bottom:1px solid #3c3c3c;}
	
#mobileNav>ul.lvl1>li>.lvl2>li a,
#mobilePagesNav>ul.lvl1>li>.lvl2>li a {
	background:#dcdcdc;
	border-bottom:1px solid #3c3c3c;}
	
	
#mobileNav>ul.lvl1>li>.lvl2>li>.lvl3>li>a,
#mobilePagesNav>ul.lvl1>li>.lvl2>li>.lvl3>li>a {
	background:#c8c8c8;
	padding-left:11%;
	font-weight:normal;}
	
#mobilePagesNav ul.lvl2 a.active {color:#000 !important;}

#mobileNav .lvl2, 
#mobileNav .lvl3,
#mobilePagesNav .lvl2,
#mobilePagesNav .lvl3 {
	display:none;}

#mobilePagesNav>ul>li.ifsub.active>ul.lvl2 { display:block;}
#mobilePagesNav>ul>li.ifsub.active>ul>li.ifsub.active>ul.lvl3 { display:block;}

/* */
		
.contactButton{
	  display:block;
  position:absolute;
  right:0;
  top:0;
  z-index:2;
  background:#f0f0f0;
  width:40px;
  height:40px;
  text-align:center;
  padding-top:0px;}

	
.contactButton>.mtbArrow:before{
	display:block;
	color:#3c3c3c;
	font-size:24px;
	content:'\f107';
	position:relative;
	top:8px;}

.contactButton.active>.mtbArrow:before{content:'\f106';}

.lvl2 .contactButton {background:#bcbcbd;}	

.lvl2 .contactButton>.mtbArrow:before{color:#4e5053;}


/*Mobile Pages / Folgeseite*/
#mobilePagesNavOpener{
	position:absolute;
	right:0;
	top:28px;
	z-index: 100;}

#mobilePagesNavOpener:before {
  content: "\f039";
  color: #333;
  font-size: 25px;}

#mobilePagesNavOpener.open:before {
	content: "\f03b";
	color:#fff;
	font-size: 25px;}

/*#mobilePagesNavOpener .fa-bars {
	background:#0071BB;
 	padding:14px;
	border-radius:50px;
  	color:#fff;
  	font-size:22px;}*/
	
#mobilePagesNav {
	display:none;
	position:absolute;
	left:-100%;
	width:100%;
	height:100%;
	top:0;
	z-index:70;
	background:rgba(0,0,0,.8);
  	padding: 85px 5% 0 5%;
  	box-sizing: border-box;}

@media (max-width:1040px){
.mainNav ul li a {
    border-radius: 4px;
    color: #fff;
    display: block;
    font: 21px/23px "Unica One",cursive,Arial,Helvetica,sans-serif;
    margin: 0 4px;
    padding: 8px 14px 6px;
    text-transform: uppercase;
}

.mainNav ul ul { left:0px;}
}