/* HEADER NAVIGATION MAIN beginn*/
.nav-box-hover-active { padding:0 0 3.7% 0;}
.nav-box-hover-active { width:auto;background: url(../images/line-w.jpg) no-repeat; background-size: 40% 1px; background-position:center bottom;}

.nav-box-hover {border-bottom:#d5d1cc 0px solid;}
.nav-box-hover:hover {padding:0 0 3.7% 0;}
.nav-box-hover:hover { width:auto;background: url(../images/line-w.jpg) no-repeat; background-size: 40% 1px; background-position:center bottom;}

#privat-nav-box { float:left;color:#FFF;font-family:proximanova-bold; width:25%; text-align:left; padding:3% 0 0 0%;cursor:pointer}
#privat-nav-box { float:left;color:#FFF;font-family:proximanova-bold; width:25%; text-align:left; padding:3% 0 0 0%;cursor:pointer; }
#business-nav-box { float:right;color:#FFF;font-family:proximanova-bold;width:25%;text-align:right;padding:3% 0% 0 0%;cursor:pointer}
#menu-panel-privat{position: absolute; z-index:999999; top:0; left:0;width:50%; height: 100%; padding:12% 0 0 0;background: rgba(255, 255, 255, 1); display: none;}

#menu-panel-business{position: absolute; z-index:99999; top:0; right:0;width:50%; height: 100%; padding:12% 0 0 0;background: rgba(255, 255, 255, 1); display: none;}
#menu-panel-close{position: absolute; z-index:9999; top:0; left:0;width:100%; height: 100%; background: rgba(255, 255, 255, 0.2); display: none; cursor: url(../images/close.png), auto;}

#menu-panel-close-1{position: fixed; z-index:9999; top:0; left:0;width:100%; height: 100%; background: rgba(255, 255, 255, 0.2); display: none; cursor: url(../images/close.png), auto;}

#privat-nav-box-2 { float:left;color:#FFF;font-family:proximanova-bold; width:25%; text-align:left; padding:3% 0 0 0%;cursor:pointer; }

#business-nav-box-2 { float:right;color:#FFF;font-family:proximanova-bold;width:25%;text-align:right;padding:3% 0% 0 0%;cursor:pointer}


#menu-panel-privat-2{position: fixed; z-index:999999; top:0; left:0;width:50%; height: 100%; padding:8% 0 0 0;background: rgba(255, 255, 255, 1); display: none;}

#menu-panel-business-2{position: fixed; z-index:99999; top:0; right:0;width:50%; height: 100%; padding:8% 0 0 0;background: rgba(255, 255, 255, 1); display: none;}

#menu-panel-close-2{position: fixed; z-index:9999; top:0; left:0;width:100%; height: 100%; background: rgba(255, 255, 255, 0.2); display: none; cursor: url(../images/close.png), auto;}

#menu-panel-close-1-2{position: fixed; z-index:9999; top:0; left:0;width:100%; height: 100%; background: rgba(255, 255, 255, 0.2); display: none; cursor: url(../images/close.png), auto;}

.content-menu-panel { position:relative; margin:0 auto;width:70%;height:100%;}
/*##### mobile menu ######*/
.mobile-box { position: fixed;z-index:99999;width:100%; height:60px;}
.content-menu-panel-mobile { position:relative; margin:0 auto;width:80%;height:100%;}
.content-menu-panel-mobile { font-size: 5.2vw; line-height:7.2vw;}

#menu-panel{position: fixed;z-index:99999; top:0; right:0;width:100%; height:100%; padding:10% 0 0% 0; overflow: auto;display: none; background:#FFF}
.menu-main li{list-style:none; display:block;padding:8% 0 2% 0%; margin:0% auto; text-align:left;text-transform:uppercase;   }
.menu-main a{color:#4d4d4d;font-family:proximanova-bold;}
.menu-main a:hover{ }
.menu-main .act {text-transform:uppercase;border-bottom:#ccc solid 0px}
.menu-main .act a{color:#4d4d4d;}


.menu-main-2 li{list-style:none; display:block;padding:1% 0 1% 0%; margin:0% auto; text-align:left;text-transform:uppercase;   }
.menu-main-2 a{color:#4d4d4d;font-family:proximanova-bold;}
.menu-main-2 a:hover{ }
.menu-main-2 .act {text-transform:uppercase;border-bottom:#ccc solid 0px}
.menu-main-2 .act a{color:#4d4d4d;}


.menu-main-sub-1{ background: url(../images/steuerung.png) no-repeat; background-size:8% auto; background-position:left center;}	
.menu-main-sub-1{text-transform:uppercase;}
.menu-main-sub-1 a{color:#4d4d4d;font-family:proximanova-light;padding:0% 0 0% 16%;}
.menu-main-sub-2{ background: url(../images/audio.png) no-repeat; background-size:8% auto; background-position:left center;}
.menu-main-sub-2{text-transform:uppercase;}
.menu-main-sub-2 a{color:#4d4d4d;font-family:proximanova-light;padding:0% 0 0% 16%;}
.menu-main-sub-3{ background: url(../images/High-end-audio.png) no-repeat; background-size:8% auto; background-position:left center;}
.menu-main-sub-3{text-transform:uppercase;}
.menu-main-sub-3 a{color:#4d4d4d;font-family:proximanova-light;padding:0% 0 0% 16%;}
.menu-main-sub-4{ background: url(../images/heimkino.png) no-repeat; background-size:8% auto; background-position:left center;}
.menu-main-sub-4{text-transform:uppercase;}
.menu-main-sub-4 a{color:#4d4d4d;font-family:proximanova-light;padding:0% 0 0% 16%;}
.menu-main-sub-5{ background: url(../images/services.png) no-repeat; background-size:8% auto; background-position:left center;}
.menu-main-sub-5{text-transform:uppercase;}
.menu-main-sub-5 a{color:#4d4d4d;font-family:proximanova-light;padding:0% 0 0% 16%;}
.menu-main-sub-6{ background: url(../images/team.png) no-repeat; background-size:8% auto; background-position:left center;}
.menu-main-sub-6{text-transform:uppercase;}
.menu-main-sub-6 a{color:#4d4d4d;font-family:proximanova-light;padding:0% 0 0% 16%;}
.menu-main-sub-7{ background: url(../images/contact.png) no-repeat; background-size:8% auto; background-position:left center;}
.menu-main-sub-7{text-transform:uppercase;}
.menu-main-sub-7 a{color:#4d4d4d;font-family:proximanova-light;padding:0% 0 0% 16%;}


.sub-2 a{font-family:proximanova-light;padding:0% 0 0% 14%;}
.act-sub a{opacity:0.5;}




/* HEADER NAVIGATION MAIN end*/

	
	.privat-box { float:left;width:50%; padding:1% 0 8% 0%;font-family:proximanova-bold;font-size: 1.2vw; line-height:1.0vw;
				  text-transform:uppercase}
				  	
	.business-box { float:left;width:50%; padding:1% 0 8% 0%;font-family:proximanova-bold;font-size: 1.2vw; line-height:1.0vw;
					text-transform:uppercase}
					
	#menu-main {font-size: 1.2vw; line-height:1.0vw;}
			
			#menu-main > ul {
				margin:0px;
				padding:0; display: block;text-transform:uppercase;
				
			}
			
			
			
			.icon-1 { float:left;background: url(../images/steuerung.png) no-repeat; background-size: 6% auto; background-position:left 17%; padding:2% 0 8% 5% }
			.icon-2 { float:left;background: url(../images/audio.png) no-repeat; background-size: 6% auto;  background-position:left 17%; padding:2% 0 8% 5% }
			.icon-3 { float:left;background: url(../images/High-end-audio.png) no-repeat; background-size: 6% auto; background-position:left 17%; padding:2% 0 8% 5% }
			.icon-4 { float:left;background: url(../images/heimkino.png) no-repeat; background-size: 6% auto; background-position:left 17%; padding:2% 0 8% 5% }
			.icon-5 { float:left;background: url(../images/services.png) no-repeat; background-size: 6% auto; background-position:left 17%; padding:2% 0 8% 5% }
			.icon-6 { float:left;background: url(../images/team.png) no-repeat; background-size: 6% auto; background-position:left 17%; padding:2% 0 8% 5% }
			.icon-1:hover, .icon-2:hover, .icon-3:hover, .icon-4:hover, .icon-5:hover, .icon-6:hover{opacity:0.6; }
			
			.first{ list-style:none;width:100%; width:50%;cursor:pointer; }
			.nav-active {color:#a8a8a8} 
			.aktexall {opacity:0.7; }
				
			.second{ list-style:none;width:100%; width: auto;padding:8% 0% 1.2em 0%; cursor:pointer;}
			.second a{ color:#000}
			.second a:hover{color:#999}
			.second a.nav-active {color:#aea497;font-family:proximanova-bold;}
			
			.business .second a.nav-active {color:#494954;font-family:proximanova-bold;}
	
			
			#menu-main > ul > li:hover
				{
					
				}
				
			/* Second Level */
			
			
			#menu-main > ul > li > ul {
				opacity:0; 
				position:absolute; 
				top:4.1vw; 
				left:50%;
				width: auto;
				white-space:nowrap ; 
				visibility:hidden;
				padding:0 0 100% 0;
			}
			
			#menu-main > ul > .aktexall > ul {
				opacity:1; 
				position:absolute; 
				top:4.1vw; 
				left:50%;
				width: auto;
				white-space:nowrap ; 
				visibility: visible;
				padding:0 0 100% 0;
			}
			
			
		
			#menu-main > ul > li:hover > ul {
				opacity:1; 
				-o-transition: all 0.6s ease-in-out;
    			-webkit-transition: all 0.6s ease-in-out;
    			-moz-transition: all 0.6s ease-in-out;
    			-ms-transition: all 0.6s ease-in-out;
    			transition: all 0.6s ease-in-out;
				visibility:visible
			}
			
			
			#menu-main > ul > li > ul > li > a:hover {
				opacity:1; 
    			-o-transition: all 0.3s ease-in-out;
    			-webkit-transition: all 0.3s ease-in-out;
    			-moz-transition: all 0.3s ease-in-out;
    			-ms-transition: all 0.3s ease-in-out;
    			transition: all 0.3s ease-in-out;  
			}
			#menu-main > ul > li > ul > li > a.active {
				
    			-o-transition: all 0.3s ease-in-out;
    			-webkit-transition: all 0.3s ease-in-out;
    			-moz-transition: all 0.3s ease-in-out;
    			-ms-transition: all 0.3s ease-in-out;
    			transition: all 0.3s ease-in-out;  
			}
			
			@media screen and (max-width:1280px) {
			
				
			.privat-box { float:left;width:50%; padding:1% 0 8% 0%;font-family:proximanova-bold;font-size: 1.6vw; line-height:1.4vw;
				  text-transform:uppercase}
				  	
			.business-box { float:left;width:50%; padding:1% 0 8% 0%;font-family:proximanova-bold;font-size: 1.6vw; line-height:1.4vw;
					text-transform:uppercase}
					
			#menu-main {font-size: 1.6vw; line-height:1.4vw;}
	
				#menu-main > ul > li > ul {left:55%;}
				#menu-main > ul > .aktexall > ul {left:55%;}
	
			.icon-1 { background-size: 8% auto; background-position:left 17%; padding:2% 0 8% 7% }
			.icon-2 { background-size: 8% auto;  background-position:left 17%; padding:2% 0 8% 7% }
			.icon-3 { background-size: 8% auto; background-position:left 17%; padding:2% 0 8% 7% }
			.icon-4 { background-size: 8% auto; background-position:left 17%; padding:2% 0 8% 7% }
			.icon-5 { background-size: 8% auto; background-position:left 17%; padding:2% 0 8% 7% }
			.icon-6 { background-size: 8% auto; background-position:left 17%; padding:2% 0 8% 7% }
			}
			
/*#################################################################*/

		/* first level */
		
			.sub-menu a{ background:none;  color:#666;}
			.sub-menu a:hover{ background:none;  color:#b5a99b}
			.sub-menu-active a{background:none; color:#b5a99b}
	
	         #main_nav {margin:-1% 0 0 0; padding:0;}
			 
			 
			 /* Second Level */		
		
	#main_nav > ul > li > ul.sub-navigation{
				float:left;background: url(../images/steuerung-sub.png) no-repeat; background-size:1.7% auto; background-position:1.1% 47%; 
				background-color: rgba(255, 255, 255, 1);padding:1% 0% 1% 2%;
				}
			  
			#main_nav > ul > li > ul {
				text-align:center;
				float:inherit; 
				opacity:0; 
				visibility:hidden;
				position:absolute; 
				left:20.6%;
				top:100%;
				width:59%; 
				margin:0% 0px 0px 0%;
				padding:0px 0% 0px 0%;
				font-size: 0.9vw; line-height:0.9vw;
				background-color: rgba(255, 255, 255, 1);		
			}
			
	
			#main_nav  > ul > li:hover > ul {
				
				opacity:1; 
				visibility:visible;
    			-webkit-transition: 0.6s;
    			-moz-transition: 0.6s;
    			-ms-transition:  0.6s;
    			transition:  0.6s;  
			}
			#main_nav > ul > li > ul > li{
					display:inline; 
							
			}
			#main_nav > ul > li > ul > li a{
					padding:0% 1%; 			
			}
			

/*###############################################################*/