/* CSS */

/*Farben

Schrift:            #555555
Schrift rot:        #CE1126
Schrift gelb:       #FCD117
grün:               rgba(0,122,93,.90) #007A5D
*/


.topnavi { border-bottom: 0px solid transparent; } 												/*Border unter der Navi Desktop ganze Breite*/
#toggle-menu {
	background-color:#fafafa;
	border-bottom: 1px solid #666;} 															/*Hintergrundfarbe Navigation oben für Symbol nur mobil*/
.topnavi__lvl--first { background-color:#fafafa; } 												/*Hintergrundfarbe hinter den Button  für mobil*/
.topnavi__link--first { background-color:rgba(0,122,93,.90);} 								/*normal Hintergrund 1. Ebene nur mobil*/
.topnavi__link--sub { background-color: rgba(0,122,93,.90);} 								    /*normal Hintergrund ab 2. Ebene*/
.topnavi__link--first:hover { background-color:rgba(0,122,93,.50);} 							/*hover 1. Ebene mobil*/
.topnavi__link--sub:hover { background-color:rgba(0,122,93,.50);} 							/*hover 2. Ebene*/
.topnavi__link--active { background-color:rgba(200,200,200,0.94);} 								/*Aktiv Hintergrund nur mobil*/
.topnavi__lvl--first > .topnavi__item { border-bottom: 1px solid #fff; } 						/*Border unten 1. Ebene mobil*/
.topnavi__lvl--first .topnavi__item li { border-bottom: 1px solid #fff; } 					    /*Border unten 2. Ebene */
  
@media only screen and (min-width: 768px) {
.topnavi {background-color:#007A5D; } 															/*Hintergrund ganze Breite*/
.topnavi__lvl--first {background-color: transparent; } 											/*Hintergrund ganze Breite*/
.topnavi__link--first { background-color: transparent;} 										/*Hintergrundfarbe Navi 1. Ebene nur Desktop*/
.topnavi__link--first:hover { background-color:transparent;} 									/*hover 1. Ebene nur Desktop */
.topnavi__link--active { background-color:#007A5D;} 										/*Aktiv Hintergrund nur Desktop */

.topnavi { border-bottom: 0px solid #ddd; } 													/*Border unter der Navi Desktop ganze Breite*/
#toggle-menu { border-bottom: 0px solid transparent; } 											/*ist ausgeblendet für Desktop*/	
.topnavi__lvl--sub { border-top: 1px solid #666;} 												/*Border oben bei Sub-Navigation*/
.topnavi__lvl--first > .topnavi__item { border-bottom: 1px solid transparent; } 				/*Border unten 1. Ebene Desktop*/
}


/*Symbol Navigation mobil*/

.topnavi .bar1, .topnavi .bar2, .topnavi .bar3 { background: #666; } 							/*x für Navi Mobil*/
.topnavi .change .bar1, .topnavi .change .bar3 { background: #333; } 							/*x für Navi Mobil wenn geöffnet*/



/*Schriftfarben*/
.topnavi {text-shadow: rgba(50,50,50,0.45) 1px 1px 3px;}
.topnavi__link--first, .topnavi__link--sub,
.topnavi__link--sub, .topnavi__item  {color:#fff;} 												/*Schrift normal*/
.topnavi__link--active {color:#FCD117;} 											            /*Schrift activ*/
.topnavi__link--first:hover, .topnavi__link--sub:hover {color:#FCD117;}							/*Schrift hover*/




/*MENU ARROWS*/
.topnavi__label {
	background-color:#fcbf02;
	transition: all .125s ease-in-out;
  	-webkit-transition: all .125s ease-in-out; }
.topnavi__label:hover { background-color:transparent; } 										/*Box für Pfeil bei sub-Navigation Desktop + mobil*/

.topnavi__arrow {border-top: 6px solid #fff;}
.topnavi__arrow:hover {border-top: 6px solid #fcbf02;}
.topnavi__arrow--sub {border-top: 6px solid #fff;}
@media (min-width: 768px) {
    .topnavi__arrow--sub {
		border-left: 6px solid #fff;
		border-top: 6px solid transparent;}
	.topnavi__label {background-color:transparent;}
	
}

/*ausblenden 1. Box für mobil*/
.topnavi label .topnavi__label { background-color: transparent;}
.container .topnavi__arrow {border-top: 6px solid transparent;}
.container .topnavi__arrow--sub {border-top: 6px solid transparent;}


/*korrektur position höhe 3. Ebene für Desktop*/
.topnavi__lvl--sub li ul {margin-top: -1px; }


@media (min-width: 768px) {
.topnavi {
	/*border-bottom: solid 1px #aaa;*/
	display:flex;
	align-items: center;
	justify-content: center;
}
.topnavi__lvl--sub {margin-top: 1px;}
}