/* ///////////////////////////  DROPDOWN-MENU   /////////////////////////// */
    #mainnavigation {
        margin: 0px;
    }

	#mainnavigation ul,
	#mainnavigation li {
		padding: 0;
        position: relative;
		margin: 0;
        display: block;
        float: none;
        font-size: 1em;
		list-style: none;
        font-weight: 400;
        font-style: normal;
        white-space: nowrap;
	}
    
    #mainnavigation a {
        display: block;	
        text-transform: none;
  		white-space: normal;
		outline: none;
		line-height: 125%;
    }
	
	#mainnavigation ul.level1>li>ul.level2,
    #mainnavigation ul.level1>li>ul.level2>li>ul.level3,
    #mainnavigation ul.level1>li>ul.level2>li>ul.level3>li>ul.level4 {
		display: none;
        min-width: 150px;
	}
    
    
    #mainnavigation ul.level1>li>ul.level2>li.full {
        position: fixed;
        height: 100%;
        max-height: 455px;
        left: 0;
    }
	
	/* ///////////////////////////////// LEVEL 1 ///////////////////////////////// */

	body #mainnavigation>ul.level1>li:first-child {
		display: none;
	}

    #mainnavigation ul.level1>li {
		margin: 0 0 0 0;
		padding: 0 30px;
        float: left;
	}
	
	
	#mainnavigation ul.level1>li.last {
		padding-right: 0;
	}
	
    #mainnavigation ul.level1.full,
    #mainnavigation ul.level1.full>li {
		position: static;
	}
	
	#mainnavigation ul.level1.full>li.haschildren:hover {
		background: rgba(0, 0, 0, 0) url("/_local/images/ul-level1-top.svg") no-repeat scroll 45px 27px;	
	}
    
	#mainnavigation ul.level1>li>a {
        color: #000000;
		padding: 3px 6px;
        height: 33px;
        font-size: 1.125em;
        text-transform: uppercase;		
	}	

	/*
	#mainnavigation ul.level1>li>a:hover,
	#mainnavigation ul.level1>li>a.open,
	#mainnavigation ul.level1>li:hover>a {
		color: #e3000b;	
	}
	*/
	/* ///////////////////////////////// LEVEL 2 ///////////////////////////////// */
    
    #mainnavigation ul.level1>li:hover>ul.level2{
		display: flex;
		flex-direction: row wrap;
		flex-wrap: wrap;
		align-content: flex-start;
		position: absolute;
        width: 100%;
        top: 39px;
        left: 0;
        padding: 0 1.5%;
	}

    #mainnavigation ul.level1>li>ul.level2>li {
        z-index: 2;
        flex: 0 1 auto;
        width: 22%;
    }

    #mainnavigation ul.level1>li>ul.level2>li.full {
        height: 390px;
        width: 100%;
        background: #fff;
        margin: 0px !important;
        border-top: 2px solid #00833e;
        width: 100% !important;
    }
    
    
    /* li in fullLayer */
    #mainnavigation ul.level1.full>li>ul.level2>li {
        margin-top: 30px;
        margin-right: 2.4%;
        float: left;
    }
	
	#mainnavigation ul.level1>li>ul.level2>li>a {
		font-size: 1.125em;
		font-weight: 700;
		color: #000;
        min-width: 150px;
        border-bottom: 0;
        padding: 5px 10px;
        white-space: normal !important;
        line-height: 130%;
	}
    
    #mainnavigation ul.level1>li>ul.level2>li>a.last {
        
	}
    
    #mainnavigation ul.level1.full>li>ul.level2>li>a {
		padding: 0px;
        margin-bottom: 0px;
	}
    
	
	#mainnavigation ul.level1>li>ul.level2>li>a.open, 
	#mainnavigation ul.level1>li>ul.level2>li>a:hover {
		color: #000;
	}
	/* ///////////////////////////////// LEVEL 3 ///////////////////////////////// */
	
    
    body #mainnavigation ul.level1 li:hover ul.level2 li ul.level3  {
        margin-top: 15px !important;
        display: block;
        position: relative;
        z-index: 2;
    }
    
    body #mainnavigation ul.level1>li>ul.level2>li>ul.level3>li {
        position: relative;
        z-index: 2;
        width: 100%;
    }

	body #mainnavigation ul.level1 li ul.level2 li ul.level3 > li > a {
		color: #000;
		padding: 2px 0 2px;
		margin-bottom: 5px;
		font-size: 1em;
		font-weight: 400;
		border: 0;
        -moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;	
	}
	
	body #mainnavigation ul.level1>li>ul.level2>li>ul.level3>li>a.first {
		border-left: 0;
		border-bottom: 0;
	}
	
	body #mainnavigation ul.level1>li>ul.level2>li>ul.level3>li>a.last {
		border-left: 0;
		border-top: 0;
	}

	#mainnavigation ul.level1 li ul.level2 li ul.level3 li.open > a, 
	#mainnavigation ul.level1 li ul.level2 li ul.level3 li > a:hover {
        color: #00833e; 
	}
	
	/* ///////////////////////////////// CLEARFIX ///////////////////////////////// */
	
	#mainnavigation:after {
		content: ".";
		display: block;
		visibility: hidden;
		line-height: 0;
		height: 0;
	}
	
	#mainnavigation {
		display: inline-block;
	} 
	
	html[xmlns] #mainnavigation {
		display: block;
	}
	 
	* html #mainnavigation {
		height: 1%;
	}


/* Auflösung unterhalb 970px / responsive Navigation wird eingeblendet  */

@media only screen and (max-width: 970px) {


	#navigation {
		position: fixed;
		width: 320px;
        padding: 0 !important;
		margin: 0;
		top: 0 !important; 
        display: block;
		right: auto;
        right: -320px;
		height: 100%;
		overflow: hidden;
		z-index: 13 !important;
        transition: right 0.5s ease-in-out;
        border-left: 0px solid whitesmoke;
	}
	
	#mainnavigation a {
		white-space: normal !important;
		line-height: 130%;
	}
    
    body.menu #navigation {
        background: transparent;
        right: 0; 
        top: 0;
        margin-top: 0;
        transition: right 0.5s ease-in-out;
	}

	body #navigation>div.centered {
		padding: 0;
        margin: 0;
		width: 100%;
        height: 100%;
        background: #ebebeb;
        overflow: auto;
	}

    body.menu #mainnavigation {
		margin: 0;
        float: none;
        min-width: 0;		
	}
    
    

    body.menu #innerpage{
        left: -320px;
        transition: all 0.6s ease-in-out;
    }
    
    body.menu #opac,
    body.menu #cboxOverlay {
        opacity: 0.6 !important;
        display: block !important;
        z-index: 12 !important;
        transition: opacity 0.3s ease-in-out;
    }

	#menu-toggle {
		z-index: 2000;
		display: block;
		position: fixed;
		right: 15px;
		top: 13px;
        border: 0px solid white;
		height: 35px;
		width: 35px;
		cursor: pointer;
        transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
		color: #333;
	}
    
    #menu-toggle #line1{
		display: block;
		position: absolute;
		right: 0px;
		top: 10px;
		height: 5px;
		width: 33px;
		cursor: pointer;
        background-color: #00843e;
	}
    
    #menu-toggle #line2 {
		display: block;
		position: absolute;
		right: 0px;
		top: 22px;
		height: 5px;
		width: 33px;
		cursor: pointer;
        background-color: #00843e;
        transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
	}
    #menu-toggle #line3 {
		display: block;
		position: absolute;
		right: 0px;
		top: 34px;
		height: 5px;
		width: 33px;
		cursor: pointer;
        background-color: #00843e;
        transform:  rotate(0deg);
        -moz-transform:  rotate(0deg);
         -webkit-transform:  rotate(0deg);
        transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -webkit-transition: all 0.3s ease-in-out;
	}

    body.menu #menu-toggle {
        right: 15px;
        top: 13px;
        transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
        display: block;
        opacity: 1.0 !important;
        -moz-opacity: 1.0 !important;
        -webkit-opacity: 1.0 !important;
    }
    
    body.menu #menu-toggle #line2 {
        height: 0px;
        width: 0px;
        background-color: #154f90;
        transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
    }
   
    body.menu #menu-toggle #line1 {
        top: 15px;
        width: 32px;
        right: 1px;
        background-color: #154f90;
        transform:  rotate(45deg);
        -moz-transform:  rotate(45deg);
         -webkit-transform:  rotate(45deg);
        transition: all 0.3s ease-in-out 0.3s;
        -moz-transition: all 0.3s ease-in-out 0.3s;
        -webkit-transition: all 0.3s ease-in-out 0.3s;
    }
    
    body.menu #menu-toggle #line3 {
        top: 15px;
        right: 1px;
        width: 32px;
        background-color: #154f90;
        transform:  rotate(135deg);
        -moz-transform:  rotate(135deg);
         -webkit-transform:  rotate(135deg);
        transition: all 0.3s ease-in-out 0.1s;
        -moz-transition: all 0.3s ease-in-out 0.1s;
        -webkit-transition: all 0.3s ease-in-out 0.1s;
    }
	
	#wrapper.menu {
		overflow: hidden;
        height: 100px;
		
	}
    
    #mainnavigation ul.level1 > li {
        height: auto;
    }
	


	body #mainnavigation>ul.level1 li>a,
	body.menu #mainnavigation>ul.level1 li.open>a,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>a,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li.open>a,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>a,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li.open>a,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>ul.level4>li>a,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>ul.level4>li.open>a,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>ul.level4>li.open>a:hover
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>ul.level4>li>a:hover,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li.open>a:hover,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>a:hover,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li.open>a:hover,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>a:hover,
	body.menu #mainnavigation>ul.level1 li.open>a:hover,
	body #mainnavigation>ul.level1 li>a:hover {
		float: none !important;
        text-decoration: none;	
		text-transform: none;
        display: block !important;
		background: transparent;
		border: 0 !important;
        height: auto !important;
        width: auto !important;
        margin: 0;
        font-weight: inherit;
	}

	body.menu #mainnavigation>ul.level1>li>ul.level2,
    body.menu #mainnavigation>ul.level1>li:hover>ul.level2,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3,
    body.menu #mainnavigation>ul.level1>li>ul.level2>li:hover>ul.level3,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>ul.level4,
    body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li:hover>ul.level4 {
		display: none;
		float: none;
		position: relative !important;
		margin: 0 !important;
		padding: 0 !important;
		left: 0 !important;
		top: 0 !important;
        background: transparent !important;  
	}
	
	body.menu #mainnavigation>ul.level1>li>ul.level2,
    body.menu #mainnavigation>ul.level1>li:hover>ul.level2 {
    	display: block !important;
    }
	
	body.menu #mainnavigation>ul.level1>li.open>ul.level2,
	body.menu #mainnavigation>ul.level1>li.open>ul.level2>li.open ul.level3,
	body.menu #mainnavigation>ul.level1>li.open>ul.level2>li.open ul.level3 li.open ul.level4 {
		float: none;
		position: relative;
		margin: 0 !important;
		padding: 0 !important;
		left: 0 !important;
        display: block;
        padding: 0;
        font-size: 1em;
        transition: background 0.6s ease-in-out;
		height: auto;
        
	}
	
	body.menu #mainnavigation>ul.level1,
	body.menu #mainnavigation ul.level2,
	body.menu #mainnavigation ul.level3,
    body.menu #mainnavigation ul.level4 {
		padding-top: 0px;
		width: 100% !important;
        min-width: 100% !important;
        left: 0 !important;
	}
    
    
    
    /********************** Span more ************************/
    
    
    /* plus sign if child nodes (created using jquery) */
	body.menu #mainnavigation li>span.more,
	body.menu #mainnavigation li.quick.last>span {
		position:absolute;
		width: 50px;
		text-align: center;
		top: 0;
		margin-top: 0.6em;
		right: 5px;
		font-weight: 100;
		cursor: pointer;
		opacity: 1;
		transition: all 0.1s ease-out 0s;
		z-index: 2000;
	}
	
	body.menu #mainnavigation li.first>span.more {
		margin-top: 1em;
	}
	
	body.menu #mainnavigation li>span.more:before,
	body.menu #mainnavigation li.quick.last>span:before {
		position:absolute;
		content: '\f067';
		right: 0px;
		font-family: 'fontAweSome',sans-serif;
		color: #000;
		font-size: 15px;
		-ms-transform: rotate(0deg); /* IE 9 */
    	-webkit-transform: rotate(0deg); /* Safari */
    	transform: rotate(0deg); /* Standard syntax */
    	transition: all 0.1s ease-out 0s;
    	z-index: 2000;
	}
	
	body.menu #mainnavigation ul.level1 > li>span.more:before,
	body.menu #mainnavigation ul.level1 > li.quick.last>span:before {
		display: none;
	}

	body.menu #mainnavigation>ul.level1>li.open>span.more:before,
	body.menu #mainnavigation>ul.level1>li.open.quick.last>span:before,
    body.menu #mainnavigation>ul.level1>li>ul.level2>li.open>span.more:before,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li.open.quick.last>span:before,
    body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li.open>span.more:before,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li.open.quick.last>span:before,
    body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>ul.level4>li.open>span.more:before,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>ul.level4>li.open.quick.last>span:before     {
		-ms-transform: rotate(180deg); /* IE 9 */
    	-webkit-transform: rotate(180deg); /* Safari */
    	transform: rotate(180deg); /* Standard syntax */
    	transition: all 0.2s ease-out 0s;
    	z-index: 2000;
        color: #154f90;
        content: '\f068';
	}
    

	/* ///////////////////////////////// LEVEL 1 ///////////////////////////////// */
	
	
	body #mainnavigation>ul.level1,
    body #mainnavigation>ul.level1.full {
		padding: 155px 1.25em 0px 1.25em !important;
        box-sizing: border-box;
		font-size: 1.125em !important;
		position: relative !important;
		background: none !important;
		height: auto !important;
	}
	/*
    body #mainnavigation>ul.level1>li.first,
    body #mainnavigation>ul.level1.full>li.first {		
        border-top: 1px dotted #000 !important;
	}
    */
    body #mainnavigation>ul.level1>li.first.quick {		
        border-top: 0px solid #000 !important;
	}
    
    body #mainnavigation>ul.level1>li.notext,
    body #mainnavigation>ul.level1 li:first-child {
        display: none !important;
    }
    
    body #mainnavigation>ul.level1>li,
    body #mainnavigation>ul.level1.full>li,
    body #mainnavigation>ul.level1>li.last,
    body #mainnavigation ul.level1>li.minor,
    body #mainnavigation ul.level1>li.givespaceleft,
	body.menu #mainnavigation>ul.level1>li,
    body.menu #mainnavigation>ul.level1.full>li,
    body.menu #mainnavigation ul.level1>li.minor {
		position: relative !important;
        /*border-bottom: 1px dashed #283c4d !important;*/	
		margin: 0 0 25px 0 !important;
        float: left !important;
        text-align: left !important;
		padding: 0 !important;
		width: 100% !important;
	}
		
	body #mainnavigation>ul.level1>li>a,
    body #mainnavigation>ul.level1.full>li>a,
   	body #mainnavigation ul.level1>li:hover>a,
	body #mainnavigation ul.level1>li>a:hover {
        text-transform: uppercase !important;
		padding: 0.6em 0.3em 0.6em 0em !important;
        margin: 0 !important;
        font-weight: 700;
	} 

	body #mainnavigation ul.level1>li:hover>a,
    body #mainnavigation ul.level1>li.open>a,
	body #mainnavigation ul.level1>li>a.open,
    body #mainnavigation ul.level1.full>li>a.open {
		color: #000;
		font-weight: 700;   
	}


	/* ///////////////////////////////// LEVEL 2 ///////////////////////////////// */

    body.menu #mainnavigation>ul.level1>li.open>ul.level2 {
		background: transparent !important;
		display: block;
        position: relative !important;
        border: 0 !important;
	}
	
	body.menu #mainnavigation>ul.level1>li>ul.level2>li.first{
		position: relative;	
		margin: 0;
		padding: 7px 0 0 0;
        border-top: 1px dashed #283c4d !important;
	}
	

	body.menu #mainnavigation>ul.level1>li>ul.level2>li{
		position: relative !important;	
        /*border-bottom: 1px dotted #000;*/
        text-align: left;	
		margin: 0;
        height: auto !important;
		padding: 0;
        text-transform: uppercase;
        float: none !important;
        width: 100%;
	}
        
    body.menu #mainnavigation>ul.level1>li>ul.level2>li.last{
		border: 0;
	}

		
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>a {
		text-decoration: none;	
		color: #000;
		display: block;
        text-align: left;
		font-size: 1em;
		font-weight: 400;
        padding: 0.3em 0 0.3em 0 !important;
        margin-right: 2em !important;
	} 

	body.menu #mainnavigation>ul.level1>li>ul.level2>li:hover>a,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>a:hover,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li.open>a,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>a.open {
		color: #154f90;
	}



	/* ///////////////////////////////// LEVEL 3 ///////////////////////////////// */

	body.menu #mainnavigation>ul.level1>li>ul.level2>li.open>ul.level3  {
		background: rgba(255, 255, 255, 0.7) none repeat scroll 0% 0% !important;
		position: relative !important;
        display: block !important;
        transition: all 0.5s ease-in-out;
	}
	

	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li {
        position: relative !important;	
        background: none;
        text-align: left;	
		margin: 0;
        height: auto !important;
		padding: 0;
        text-transform: uppercase;
	}
	
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li.last {
		padding-bottom: 5px;
		margin-bottom: 10px;
	}
	
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li.first {
		padding-top: 5px;
		margin-top: 5px !important;
	}

		
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>a {
        text-decoration: none;	
		color: #000;
		display: block;
        text-align: left;
		font-size: 1em;
        padding: 0.4em 1em 0.4em 1em !important;
	} 


	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li:hover>a,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>a:hover,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li.open>a,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>a.open {
	
        color: #154f90 !important;
	}

	/* ///////////////////////////////// LEVEL 4 ///////////////////////////////// */

	body.menu #mainnavigation>ul.level1>li.open>ul.level2>li.open>ul.level3>li.open>ul.level4  {
		background: transparent !important;
		height: auto;
	}
	

	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>ul.level4>li {
		position: relative;	
        border-bottom: 0;	
		margin: 0;
		padding: 0;
		width: 100%;
	}
    
    body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>ul.level4>li.last {
		padding-bottom: 10px;
	}

		
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>ul.level4>li>a {
		color: #000;
		display: block;
		font-size: 0.85em;
		padding: 0.3em 0.3em 0.3em 3.5em !important;
	} 
    
    body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>ul.level4>li>a:before {
        content: '- ';
    }


	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>ul.level4>li:hover a,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>ul.level4>li>a:hover,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>ul.level4>li.open>a,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>ul.level4>li>a.open {

	}
	
}

li.nodisplay {
    visibility: hidden;
}


@media only screen and (max-width: 990px) {
    
    #mainnavigation ul.level1>li.last>ul.level2 {
        left: -100%;
        
    }
}


@media only screen and (min-width: 970px) {

	#mainnavigation ul li.quick {
	    display: none;
	}

}