/* //////////////////////////////////////// MEDIA QUERIES ///////////////////////////////////// */

	/* ///////////////////////////  DROPDOWN-MENU   /////////////////////////// */


	#mainnavigation ul,
	#mainnavigation li {
		padding: 0;
		margin: 0;
		list-style: none;
	}
	
	
	
	/* ///////////////////////////////// LEVEL 1 ///////////////////////////////// */
	
	#mainnavigation ul.level1>li {
		margin: 0;
		padding: 0 0 0 0;
		float: left;
		position: relative;
		z-index: 2;
		list-style: none;
		white-space: nowrap;
		margin: 0 0 0px 0px;
		padding-bottom: 0px;
		margin-right: 40px;
		height: auto;
		border-left: 6px solid white;
		
	}
	
	
	#mainnavigation ul.level1>li>a {
	    font-family: 'FFFagoWebProBold';
        font-size: 140%;	
		line-height: 0.7em;
        color: #000000;
		text-transform: uppercase;
		text-decoration: none;
		letter-spacing: 0.03em;
		float: left;
		padding: 3px 0 0px 6px;
		height: auto;
		white-space: nowrap;
		display: block;	
		outline: none;	
        	
	}
	
	#mainnavigation ul.level1>li:hover{
	   
	}
	
	#mainnavigation ul.level1>li.last>a {
		
	}	
	
	#mainnavigation ul.level1>li>a:hover,
	#mainnavigation ul.level1>li>a.open,
	#mainnavigation ul.level1>li:hover>a {
		color: #000;	
	}
    
    #mainnavigation ul.level1>li:hover,
    #mainnavigation ul.level1>li.open {
	   border-left: 6px solid #a4042f;
    }
	
	/* ///////////////////////////////// LEVEL 2 ///////////////////////////////// */
	
	/* dropdown */

	
	#mainnavigation ul.level1>li:hover>ul.level2{
		display: block;
        padding-top: 17px;
		
	}
	
	
	#mainnavigation ul.level1>li>ul.level2 {
		display: none;
		padding: 5px 0 5px 0px;
		position: absolute;
		top: 20px;
		
	}
	
	#mainnavigation ul.level1>li>ul.level2>li {
		min-width: 190px;
        background: #A4042F;
	}
	
	#mainnavigation ul.level1>li>ul.level2>li>a {
		display: block;
		font-size: 95%;
		color: #fff;
		font-weight: 100;
		padding: 7px 10px;
		margin: 0 0 0 0;
		white-space: normal;	
	}
	
	#mainnavigation ul.level1>li>div>div>ul.level2>li.open>a, 
	#mainnavigation ul.level1>li>div>div>ul.level2>li>a:hover {
		color: #fff;
	
	}
	
	/* ///////////////////////////////// LEVEL 3 ///////////////////////////////// */
	
	/* dropdown */
	
	#mainnavigation ul.level1>li>div>div>ul.level2>li:hover>ul.level3 {
		display: block;
	}
	
	#mainnavigation ul.level1>li>div>div>ul.level2>li>ul.level3 {
		display: block;
		margin: 0;
		padding: 0.5em 0 0 0;
		z-index: 100;
		min-width: 190px;
	}
	
	#mainnavigation ul.level1>li.last>div>div>ul.level2>li>ul.level3 {
		
	}
	
	#mainnavigation ul.level1>li>div>div>ul.level2>li>ul.level3>li {
		float: none;
	}
	
	#mainnavigation ul.level1>li>div>div>ul.level2>li>ul.level3>li>a {
		display: block;
		font-size: 95%;
		line-height: 2em;
		color: #000;
		padding: 0px 0px 0px 0px;
		margin: 0;
		white-space: normal;	
	}
	
	#mainnavigation ul.level1>li>div>div>ul.level2>li>ul.level3>li>a.last {
	
	}
	
	#mainnavigation ul.level1>li>div>div>ul.level2>li>ul.level3>li.open>a, 
	#mainnavigation ul.level1>li>div>div>ul.level2>li>ul.level3>li>a:hover {
		color: #fff;
	}
	
	/* ///////////////////////////////// LEVEL 4 ///////////////////////////////// */
	
	/* dropdown */
	
	#mainnavigation ul.level1>li>div>div>ul.level2>li:hover>ul.level3>li:hover>ul.level4 {
		display: block;
	}
	
	#mainnavigation ul.level1>li>div>div>ul.level2>li>ul.level3>li>ul.level4 {
		display: block;
		margin: 0;
		padding: 0.5em 0 0 0;
		z-index: 100;
		min-width: 190px;
	}
	
	#mainnavigation ul.level1>li.last>div>div>ul.level2>li>ul.level3>li>ul.level4 {
		
	}
	
	#mainnavigation ul.level1>li>div>div>ul.level2>li>ul.level3>li>ul.level4>li {
		float: none;
	}
	
	#mainnavigation ul.level1>li>div>div>ul.level2>li>ul.level3>li>ul.level4>li>a {
		display: block;
		font-size: 95%;
		line-height: 2em;
		color: #000;
		padding: 0px 0px 0px 0px;
		margin: 0;
		white-space: normal;	
	}
	
	#mainnavigation ul.level1>li>div>div>ul.level2>li>ul.level3>li>ul.level4>li>a.last {
	
	}
	
	#mainnavigation ul.level1>li>div>div>ul.level2>li>ul.level3>li>ul.level4>li.open>a, 
	#mainnavigation ul.level1>li>div>div>ul.level2>li>ul.level3>li>ul.level4>li>a:hover {
		color: #fff;
	}
	
	/* ///////////////////////////////// CLEARFIX ///////////////////////////////// */
	
	#mainnavigation:after {
		content: ".";
		display: block;
		clear: both;
		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: 870px) {


	#navigation {
		position:absolute;
		width: 100%;
		margin: 0;
		top: -100%; 
		right: auto;
		height: 100%;
        padding: 0;
		overflow: hidden;
		z-index: 200;
        transition: all 0.3s ease-in-out;
		
	}
	
	#navigation div {
		position: relative;
		padding: 0;
        margin: 0;
		width: 100%;
	}
    
    body.naviFixed #navigation {
        position: fixed;
        display: block;
        background-color: transparent;
        z-index: 4;
        border-bottom: 0;
        width: 100%;
    }

	#mainnavigation li {
		width: inherit !important;
		float: none;
		
	}

	.fullLayer {
		display: none;
	}
	
	#close {
		z-index: 3;
		width: 100%;
		height: 30px;
		right: 2%;
		margin-top: 10px;
		width: 30px;
		position: absolute;
		cursor: pointer;
		background: url(/_local/images/close.png) no-repeat;
		background-size: contain;
	}


	#menu-toggle {
		z-index: 105;
		display: block;
		position: absolute;
		right: 10px;
		top: 5px;
		height: 40px;
		width: 40px;
		background: transparent url("/_local/images/menu-toggle_white.svg") no-repeat scroll center center;
		transition: all 0.2s ease-out 0s;
		cursor: pointer;
		color: #333;
	}
	
	#menu-toggle:after {
		content: '';
		position: absolute;
		margin: 13px 0 0 -60px;
		color: #333;
		
	}

	body.menu #navigation {
        background: transparent;
        top: 0; 
	}
	
	#wrapper.menu {
		overflow: hidden;
		
	}
	

	body #mainnavigation>ul.level1 li>a,
	body.menu #mainnavigation>ul.level1 li>a:hover,
	body.menu #mainnavigation>ul.level1 li.open>a,
	body.menu #mainnavigation>ul.level1 li.open>a:hover,
	body.menu #mainnavigation>ul.level2 li>a,
	body.menu #mainnavigation>ul.level2 li>a:hover,
	body.menu #mainnavigation>ul.level2 li.open>a,
	body.menu #mainnavigation>ul.level2 li.open>a:hover,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3 li>a,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level1 ul.level3 li>a:hover,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level1 ul.level3 li.open>a,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level1 ul.level3 li.open>a:hover  {
		float: none;
		background: transparent;
		border: 0 !important;
	}

	body.menu #mainnavigation>ul.level1>li>ul.level2,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3,
	body.menu #mainnavigation>ul.level1>li>ul.level2>li>ul.level3>li>ul.level4 {
		display: none;
		float: left;
		float: none;
		position: relative;
		margin: 0 !important;
		padding: 0 !important;
		left: 0 !important;
		top: 0;
	}
	
	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: left;
		position: relative;
		margin: 0 !important;
		padding: 0 !important;
		left: 0 !important;
		background: #000;
		transition: background 0.3s ease-in-out;

	}
	
	ul.language {
		display:none;
		float: left;
	}
    
	#mainnavigation ul.level3.language > li.last{
		margin-bottom: 0px;
	}
	
	#mainnavigation>ul.level1,
	#mainnavigation ul.level2,
	#mainnavigation ul.level3 {
		padding-top: 0px;
		width: 100%;
	}

	/* ///////////////////////////////// NAVIGATION ///////////////////////////////// */
	
	
	#mainnavigation>ul.level1 {
		padding: 30px 0 30px 0;
		font-size: 1em;
		position: relative;
		background: #A4042F;
		float: left;
		height: auto;
	}
	

	#mainnavigation>ul.level1>li,
    #mainnavigation>ul.level1>li.open {
		position: relative;		
        border: 0;

		margin:0;
		padding:0;

		width: 100%;
		text-align: center;
	}
	
	#mainnavigation>ul.level1>li:hover {
		background: none;
        border: 0;
        margin: 0;
	}
		
	#mainnavigation>ul.level1>li>a {
		display: inline-block;
		text-align: center;

		text-decoration: none;	
		text-transform: uppercase;
		color: #fff;
		font-weight: 400;
		padding: 0.6em 0.3em 0.6em 1em;
		background-color: transparent; /* fallback background color
		background: -webkit-linear-gradient(top, #F1A055 0, #e37e21 100%);
		background:      -o-linear-gradient(top, #F1A055 0, #e37e21 100%);
		background:     -ms-linear-gradient(top, #F1A055 0, #e37e21 100%);
		background:   linear-gradient(to bottom, #F1A055 0, #e37e21 100%);;*/
	} 
	
	
	#mainnavigation>ul.level1>li>a.last{
	
	}
	
	.nodisplay {
		visibility: hidden;
	}

	/* plus sign if child nodes (created using jquery) */
	#mainnavigation ul.level1>li>span.more,
	#mainnavigation ul.level1>li.quick.last>span {
		position:absolute;
		width: 50px;
		height: 2em;
		text-align: center;
		top: 0;
		line-height: 30px;
		right: 15%;
		font-weight: 100;
		cursor: pointer;
		opacity: 0.8;
		transition: all 0.1s ease-out 0s;
		z-index: 2000;
	}
	
	#mainnavigation ul.level1>li>span.more:before,
	#mainnavigation ul.level1>li.quick.last>span:before {
		position:absolute;
		right: 15%;
		content: '\f107';
		font-family: 'fontAweSome',sans-serif;
		color: white;
		font-size: 200%;
		-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;
	}

	#mainnavigation ul.level1>li.open>span.more:before,
	#mainnavigation ul.level1>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;
	}


	#mainnavigation ul.level1>li:hover a,
	#mainnavigation ul.level1>li>a:hover,
	#mainnavigation ul.level1>li.open>a,
	#mainnavigation ul.level1>li>a.open {
		color: white ;

	}
	body.menu #mainnavigation ul.level1 > li > ul.level2, 
	body #mainnavigation > ul.level1 > li.open ul.level2 {
		 border-top: 1px solid white;
		 border-bottom: 1px solid white;
		 background: #000000;
	}
	
	body #mainnavigation > ul.level1 > li.open ul.level2 li.last {
		
	}

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


	#mainnavigation ul.level2{
		position: relative !important;
		width: 100%;
		margin:0;
		padding:0;
		float:left;
		font-size: 1.2em;
		background: #777 !important;
		
	}
	
	#mainnavigation ul.level2>li.last{
	
	}

	#mainnavigation ul.level1>li>ul.level2>li>a {
		text-decoration: none;	
		color: #fff;
		display: block;
		padding: 0.6em 0.3em 0.6em 1em;
		text-transform: normal;
		
	}
	
	#mainnavigation ul.level2 li>span.more {
		position: absolute;
		width: 25px;
		height: 2em;
		text-align: center;
		top: 0;
		line-height: 30px;
		right: 5%;
		font-weight: 100;
		cursor: pointer;
		opacity: 0.8;
		transition: all 0.1s ease-out 0s;
	}
	#mainnavigation ul.level2>li>a.more {
		cursor: pointer;
	}
	
	
	#mainnavigation ul.level2>li>span.more:before {
		position:absolute;
		right: 7%;
		content: '\f107';
		font-family: 'fontAweSome',sans-serif;
		color: white;
		font-size: 220%;
		-ms-transform: rotate(0deg); /* IE 9 */
    	-webkit-transform: rotate(0deg); /* Safari */
    	transform: rotate(0deg); /* Standard syntax */
    	transition: all 0.1s ease-out 0s;
	}

	#mainnavigation ul.level2>li.open>span.more:before {	
		-ms-transform: rotate(180deg); /* IE 9 */
    	-webkit-transform: rotate(180deg); /* Safari */
    	transform: rotate(180deg); /* Standard syntax */
    	transition: all 0.1s ease-out 0s;
	}

	#mainnavigation ul.level2 li a:hover, 
	#mainnavigation ul.level2 li.open>a, 	
	#mainnavigation ul.level2 li.active>a {
		background-color: #959595;

	}

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

	#mainnavigation ul.level3>li {
		position: relative;
		width: 100%;
		margin:0;
		padding:0;
		float:left;
		border-top: 1px dotted #fff;
	}

	#mainnavigation ul.level3>li>a {
		text-decoration: none;	
		color: #fff;
		display: block;
		padding: 0.4em 2em 0.4em 3em;
		width: inherit;
		background-color: #b5b5b5 ; /* fallback background color */
		
	}

	/* plus sign if child nodes (created using jquery) */
	#mainnavigation ul.level3>li>span.more {
		position: absolute;
		width: 25px;
		height: 2em;
		text-align: center;
		top: 0;
		line-height: 30px;
		right: 5%;
		font-weight: 100;
		cursor: pointer;
		opacity: 0.8;
		transition: all 0.1s ease-out 0s;
	}
	
	#mainnavigation ul.level3>li>span.more:before {
		position:absolute;
		right: 7%;
		content: '\f107';
		font-family: 'fontAweSome',sans-serif;
		color: white;
		font-size: 220%;
		-ms-transform: rotate(0deg); /* IE 9 */
    	-webkit-transform: rotate(0deg); /* Safari */
    	transform: rotate(0deg); /* Standard syntax */
    	transition: all 0.1s ease-out 0s;
	}

	#mainnavigation ul.level3>li.open>span.more:before {	
		-ms-transform: rotate(180deg); /* IE 9 */
    	-webkit-transform: rotate(180deg); /* Safari */
    	transform: rotate(180deg); /* Standard syntax */
    	transition: all 0.2s ease-out 0s;
	}

	#mainnavigation ul.level3 li a:hover, 
	#mainnavigation ul.level3 li.open>a, 	
	#mainnavigation ul.level3 li.active>a {
		background-color: #959595;
	}
	
}



@media only screen and (min-width: 870px) {
	#mainnavigation ul li.quick {
	    display: none;
	}
}



