/* Header */

#header {
	background: #fff;
	padding: 0;
	margin-top: 0;
}

#header a,
#header .logo-1 a:hover{
	color: #000;
	text-decoration: none;
}

#header .header-top {
	height: 133px;

}

#header .header-info{
	position: absolute;
	margin: 0;
	padding: 0;
	left: 0;
	top:0;
	height: 105px;
	width: 100%;
	pointer-events: none;
}

#header .header-info #topnavi,
#header .header-info #search{
	pointer-events: all;
}

@media only screen and (min-width: 769px) {
	#header #logo .logo-1 .logo_xl,
	#header.group #logo .logo-2 .logo_xl{
        max-height: 60px;
		max-width: 237px;
	}

	#header #logo .logo_xs {
		display: none;
	}

	#header #logo .logo-2 a{
		max-height: 90px;
		width: auto;
	}
}

@media only screen and (max-width: 768px) {
	#header #logo .logo_xl {
		display: none;
	}
	#header #logo .logo_xs {
		display: block;
		max-width: 180px;
		/*width: auto;*/
		min-width:0;
	}
	#header #logo .logo-2 .logo_xs {
		float:right;
	}
}


#header .ym-wbox {
	position: relative;
}

#header #logo{
	position: relative;
	padding-top: 0px;
	top: 55px;
	width: 100%;
	height: 44px;
}


/* Sonderfälle: Gruppe, Stiftung, Webmanager Version 1 + Webmanager Version 2 (smallStage)*/

#header.group #logo {
	height: 60px;
	top: 55px;

}
#header.group #logo .logo-1,
.wm #header #logo .logo-1{
	position: absolute;
	left:0;
}
#header.group #logo .logo-1,
.wm #header #logo span.logo-text{
	font-family: 'CLAASCultivaWeb', sans-serif, arial;
	font-size: 27px;
  font-weight: 400;
  top: 3px;

}
.cl-stiftung #header.group #logo .logo-1{
	top: 15px;
}

#header.group #logo .logo-2,
.wm #header #logo .logo-2{
	position: absolute;
	right:0;
}
.cl-stiftung #header.group #logo .logo-2,
.wm #header #logo .logo-2{
	top: -15px;
}

#header.group #search,
.wm #header #search{
	top:6px;
}
#header.group #topnavi,
.wm #header #topnavi{
	right: 220px;
}

@media only screen and (max-width: 1100px) and (min-width: 769px) {
	#header.group #search,
	.wm #header #search{
		right: 25px;
	}
	#header.group #topnavi,
	.wm #header #topnavi{
		right: 245px;
	}
}

.wm #header #logo .logo-1,
.wm #header #logo .logo-2{
	bottom: 3px;
	top: auto;
}
.wm #header #logo .logo-2 .cmpicture{   /* Webmanager Variante 1 */
	position: absolute;
	bottom: 0;
	right:0;
	max-height: 60px;
	width: auto;
}
/*Webmanager Variante 2*/
.wm.smallStage #header #logo .logo-1 .cmpicture{
	max-height: 60px;
}
.wm.smallStage #header #logo .logo-2 .cmpicture{
	max-width:237px;
}

@media only screen and (max-width: 768px) {
	.wm #header #logo .logo-1,
	.wm #header #logo .logo-2{      /* Webmanager Variante 1 + 2 */
		width: 37%;
	}
	.wm #header #logo .logo-2{
		bottom: 0;
		top: auto;
	}

	.wm #header #logo .logo-2 .cmpicture{
		position: absolute;
		bottom: 0;
		right:0;
		max-height: 40px;
		width: auto;
	}

	/* Webmanager Variante 2 */
	.wm.smallStage #header #logo .logo-1 .cmpicture{
		max-height: 40px;
		width: auto;
		width: 100%;
	}
	.wm.smallStage #header #logo .logo-2 .cmpicture{
		max-width: 180px;
		width: 100%;
	}
}

/* Sonderfälle Ende*/


#topnavi {
	position: absolute;
	float: none;
	height: 25px;
	width: auto;
	background: none;
	overflow: visible;
	top: 8px;
	right: 0;
}
@media only screen and (max-width: 1100px) and (min-width: 769px) {
	#header #search,
	#header #topnavi{
		right: 25px;
	}
}

#topnavi ul {
	padding: 0;
	float: right;
}

#topnavi li.link-youtube,
#topnavi li.link-googleplus,
#topnavi li.link-twitter {
	margin-left: 2px;
}

#topnavi ul li.divider {
	border-left: 1px solid #000000;
	width: 1px;
	height: 15px;
	margin: 3px 0 5px 10px;
}

#topnavi li,
#topnavi li.link-facebook {
	margin: 0 0 0 9px;
	font-size: 11px;
	position: relative;
}

.ym-hlist ul li a, .ym-hlist ul li strong {
	color: #000;
	text-shadow: none;
	font-family: 'CLAASCultivaWeb', arial;
  font-weight: 400;
  padding: 0;
}
#topnavi ul.langSelector {
	position: absolute;
	display: block;
	top: 25px;
	list-style-type: none;
	left: 0;
	background-color: #fff;
	border: 1px solid #d8d7d7;
	z-index: 1;
	padding: 0 5px 0;
	width:100px;
}

#topnavi ul.langSelector li {
	margin: 0;
	float: none;
}
.js-no-touch #topnavi ul.langSelector li a:hover{
	color: #fff;
	color: #b3c618;
}

a.sf-with-ul {
	background: url(../images/arrow-black-down.png) no-repeat right 6px transparent !important;
	padding: 0 15px 0 0 !important;
}
a.sf-with-ul.active{
	background: url(../images/arrow-black-up.png) no-repeat right 6px transparent !important;
}


#search{
	font-size: 11px;
	position: absolute;
	top: 62px;
	right: 0;
	width: 200px;
}


.ym-searchform {
	background: url(../images/bg-search-input.gif) no-repeat 0 0;
	padding: 0;
	text-align: left;
	width: 63%;

}

@media screen and (min-width: 769px) {
  .ym-searchform {
    width: 100% !important;
  }
}

#search .ym-searchform{
	width: 100%;
}

.ym-searchform-left {
	margin: 0 35px 0 0;
	position: relative;
}

#search .search-cat {
	float: left;
	margin: 2px 0 0 0;
}

.ym-searchform .ym-searchfield {
	background: transparent;
	border: 0;
	box-shadow: none;
	margin: 0 0 0 5px;
	position: relative;
	display: block;
	padding: 6px 0 0 0;
	width: 97%;
}

.ym-searchform input[type="search"] {
	width: 57%;
	height: 24px;
}

.ym-searchform .ym-searchbutton {
	background: url(../images/button_search.png) no-repeat 8px 2px;
	width: 35px;
	height: 24px;
	padding: 0;
	float: right;
	margin: 0 -1px 0 0;
	border: 0;
}

.js-no-touch .ym-searchform .ym-searchbutton:hover {
	background: url("../images/button_search.png") no-repeat scroll 8px -18px transparent;
}

/* Retina Icon Suche*/
@media (-webkit-min-device-pixel-ratio: 1.1) {
	.ym-searchform .ym-searchbutton {
		background: url(../images/button_search-2x.png) no-repeat 8px 2px;
		background-size: 20px;
	}
}

/* --------------  Breakpoint 1024 Header ---------------- */
@media only screen and (max-width: 1100px) and (min-width: 769px) {
	#header{
		overflow: hidden;
	}
	.header-top,
	#nav{
		padding: 0 25px;
	}
}
/* --------------  Breakpoint 768 Header ---------------- */

@media only screen and (max-width: 768px) {
	#header {
		height: auto;
		position: relative;
		z-index: 500;
		min-height: 126px;
	}

	#header .header-top,
	#header.group .header-top {
		height: 110px;
		height: 80px;
	}

	#header #logo {
		margin: 0;
		/*padding: 20px 0;*/
		top: 25px;
	}
	.wm #header #logo{
		top: 15px;
	}

	#header.group #logo {
		margin: 0;
		padding: 0;
		top: 25px;
		z-index: 50;
	}

	#header #logo .logo-1,
	.wm #header #logo .logo-1 {
		position: absolute;
		left: 25px;
	}

	#header.group #logo .logo-1,
	.cl-stiftung #header.group #logo .logo-1{
		right: 25px;
		top: 56px;
		width: 50%;
		left: auto;
		height: 44px;
		font-size: 1.2em;
	}

	#header.group #logo .logo-1 a{
		position: absolute;
		right: 0;
		top: 10px;
		max-height: 44px;
		/*max-width: 768px;
		max-width: 120px;*/
		color: #ffffff;
	}

	.wm #header #logo .logo-2 span.logo-text{
		position: absolute;
		right: 0;
		top: 30px;
		color: #ffffff;
		height: 44px;
		font-size: 1.2em;
		z-index: 2000;
	}

	.wm #header #logo .logo-1-text{
		width: 100%;
		right: 25px;
		left: auto;
		bottom:0;
	}
	.wm #header #logo .logo-1 span.logo-text{
		position: absolute;
		right: 0;
		top: 30px;
		color: #ffffff;
		height: 44px;
		font-size: 1.2em;
		z-index: 2000;
	}

	#header.group #logo .logo-2,
	.wm #header #logo .logo-2 {
		right: 25px;
	}

	#header .header-info {
		width: auto;
		float: none;
		margin: 0;
		padding: 20px 50px 0;
	}

	#header #topnavi {
		display: none;
	}

	#header .header-info #search {
		/*margin: 0 0 0 300px;*/
		top: 85px;
		left: 73px;
		z-index: 51;
		width: 35px;
	}

	/* CLAASPRO-337 */
	.header-info #search.select-country-available {
		left: 25px !important;
	}

	.open-nav.select-country {
		padding-left: 60px !important;
	}

	#search .ym-searchform {
		background: url(../images/bg-search-input-mobile.gif) no-repeat top right;
		background-image: none;
		background-color: #ffffff;
		height: 35px;
		width: 35px;
		width: 100%;
		display: block;
		float: none;
	}

	.ym-searchform .ym-searchfield {
		margin: 0 5px 0 5px;
		font-size: 22px;
		width: 90%;
	}

	.ym-searchform .ym-searchbutton {
		margin: 0;
		top: -5px;
		position: relative;

	}

	#search .ym-searchform-left {
		margin: 0 35px 0 0;
	}

	.ym-searchform input[type="search"] {
		width: 90%;
		height: 34px;
		padding: 0 0 0 10px;
	}

	.ym-searchform .ym-searchbutton,
	.js-no-touch .ym-searchform .ym-searchbutton:hover,
	.js-no-touch .ym-searchform .ym-searchbutton:focus {
		/*float: left;*/
		background: url(../images/btn-search-input-mobile.png) no-repeat 0 0;
		background: url(../images/menue-search.png) no-repeat 0 0;
		background-size: 44px 44px;
		width: 44px;
		height: 44px;
		border-radius: 0;
		outline: none;
	}

	#search .search-cat {
		display: none;
	}
}

@media only screen and (max-width: 440px) {
	#header.group #logo .logo-1,
	.cl-stiftung #header.group #logo .logo-1{
		width: 35%;
		left: auto;
		height: 44px;
		font-size: 0.8em;
		top:59.5px;
	}

	#header.group #logo .logo-1 a,
	.cl-stiftung #header.group #logo .logo-1 a {
		font-size: .8em;
	}
}

@media only screen and (max-width: 768px) {
	#header.group #logo .logo-1 a,
	.cl-stiftung #header.group #logo .logo-1 a {
		font-size: .8em;
	}
}

/* --------------  Breakpoint 320 ---------------- */

@media only screen and (max-width: 320px) {
	#header .header-info {
		right: 20px;
	}

	#header.group #logo {
		/*margin: 15px 20px;*/
	}

	/* CLAASCM-308 */
	span.logo-text {
		font-size: .8em !important;
	}
}

/* ####################################################################### */
#nav .open-nav,
#nav .open-breadcrumb,
#nav ul li.overview {
	display: none;
}

#nav {
	margin-bottom: 11px;
	min-height: 34px;
}

#nav,
.ym-hlist {
	background: none;
}

#nav .mobileMenuContainer {
	display: none;
}

#nav .ym-hlist {
	display: block;
}

#nav .ym-hlist ul {
	margin: 0;
	padding: 0;
	font-size: 15px;
	position: relative;
}

#nav .ym-hlist ul li {
	margin: 0 2.5em 0 0;
}
@media only screen and (max-width: 1100px) and (min-width: 769px) {
	#nav .ym-hlist ul li {
		margin: 0 1.5em 0 0;
	}
}

#nav .ym-hlist ul li a,
#nav .ym-hlist ul li strong {
	color: #000;
	padding: 0;
}

.js-no-touch #nav .ym-hlist ul li > a:hover,
#nav .ym-hlist li.active > a,
#nav .ym-hlist li.open > a {
	color: #b3c618;
}

#nav .ym-hlist ul li.active strong {
	font-family: 'CLAASCultivaWeb', arial;
  font-weight: 700;
}

#nav .ym-hlist .mobileMenuContainer ul ul {
	position: absolute;
	left: 100%;
	top: 0;
	z-index: 100;
	display: none;
}


/* --------------  Breakpoint 768 Menü ---------------- */
@media only screen and (max-width: 768px) {
	#nav .mobileMenuContainer {
		display: block;
	}

	#nav {
		background: #4a4a43;
		position: relative;
		z-index: 20;
		min-height: 45px;
	}

	#nav .open-nav,
	#nav .open-breadcrumb {
		display: block;
		color: #fff;
		padding: 0 50px;
		line-height: 45px;
		background: url(../images/icon-plus-white.png) no-repeat 90% center;
	}

	#nav .open-nav {
		font-family: 'CLAASCultivaWeb';
    font-weight: 700;
  }

	#nav .open-breadcrumb {
		display: none;
		background-color: #666666;
	}

	#nav .open-breadcrumb.active {
		display: block;
	}

	#nav .open-nav.active {
		background: url(../images/icon-minus-white.png) no-repeat 90% center;
	}

	#nav .open-nav.active + .breadcrumb + .ym-hlist {
		display: block;
	}

	#nav .open-nav.loading {
		background: url(../images/loading_small.gif) no-repeat 20px center;
	}

	#nav .ym-hlist {
		display: none;
		position: absolute;
		top: 45px;
		z-index: 500;
		width: 374px;
		overflow: hidden;
	}

	#nav .ym-hlist > ul {
		display: none;
	}

	#nav .mobileMenuContainer {
		width: 2000px;
	}

	#nav .mobileMenuContainer ul {
		width: 374px;
		float: left;
	}

    #nav .ym-hlist ul li {
        float: none;
        border-bottom: 1px solid #cccccc;
        background: #fff !important;
        display: block;
        margin: 0;
        padding: 13px 50px 14px 50px;
    }
    #nav .ym-hlist ul li.metaNav a {
        color: #999;
        line-height: inherit;
    }

	#nav ul li.breadcrumb,
	#nav ul li.main {
		display: block;
		background-color: #999999 !important;
		color: #fff;
		font-family: 'CLAASCultivaWeb', arial;
    font-weight: 700;
  }

	.ym-hlist ul li.active {
		background: #fff;
		color: #b3c618;
	}

	#nav .ym-hlist ul li.hassub,
	.js-no-touch #nav .ym-hlist ul li.hassub:hover,
	.js-no-touch #nav .ym-hlist ul li.hassub strong:hover {
		background: url(../images/arrow-black-right-big.png) no-repeat 90% center !important;
		background-color: #fff !important;
		color: #000;

	}

	#nav .ym-hlist ul li.hassub {
		cursor: pointer;
	}

	#nav .ym-hlist ul.last li a,
	.js-no-touch #nav .ym-hlist ul.last li a:hover,
	.js-no-touch #nav .ym-hlist ul.last li strong a:hover {
		background: none !important;
	}

	#nav .ym-hlist ul li.breadcrumb,
	.js-no-touch #nav .ym-hlist ul li.breadcrumb:hover,
	.js-no-touch #nav .ym-hlist ul li.breadcrumb strong:hover {
		background: #999 url(../images/arrow-white-left-big.png) no-repeat 90% center !important;
		color: #fff;
	}

	#nav .ym-hlist ul li.main,
	.js-no-touch #nav .ym-hlist ul li.main:hover,
	.js-no-touch #nav .ym-hlist ul li.main strong:hover {
		color: #fff;
		cursor: default;
		background-color: #999 !important;
	}

	#nav .ym-hlist ul li.active ul {
		/* display:block; */
	}
}



/* --------------  Breakpoint 320 Menü ---------------- */
@media only screen and (max-width: 320px) {
	#nav {
		background: #4a4a43;
	}

	#nav .open-nav,
	#nav .open-breadcrumb {
		padding-left: 20px;
		padding-right: 20px;
	}

	#nav .ym-hlist {
		width: 100%;
	}

	#nav .ym-hlist .mobileMenuContainer ul li {
		padding: 13px 20px 14px;
		width: auto;
	}
}

#nav{
	position: relative;
}
@media screen and (min-width: 769px){
	#nav .menue-main,
	#nav .menue-search,
	#nav .menue-language{
		display: none;
	}
}
#nav .open-nav{
	background-image: none;
}
#nav .menue-main.active{
	background: url(../images/menue-main-hover.png) no-repeat 0 0;
	-webkit-background-size: 45px 45px ;
	background-size: 45px 45px;
}
#nav .menue-main{
	width: 45px;
	height: 45px;
	background: url(../images/menue-main.png) no-repeat 0 0;
	-webkit-background-size: 45px 45px ;
	background-size: 45px 45px;
	position: absolute;
	left: 20px;
	top:0px;

}
#nav .menue-search{
	width: 44px;
	height: 44px;
	background: url(../images/menue-search.png) no-repeat 0 0;
	-webkit-background-size: 44px 44px ;
	background-size: 44px 44px;
	/*background-color: #cc0000;*/
	position: absolute;
	left: 80px;
	top:0px;

}
#nav .menue-language{
	font-family: 'CLAASCultivaWeb';
  font-weight: 700;
  position: absolute;
	left: 110px;
	top:0px;

}
#nav .menue-language-icon{
	width: 44px;
	height: 44px;
	cursor: pointer;
}
#nav .menue-language-content{
 	border: 1px solid #ededed;
	background-color: #ffffff;
	padding: 20px;
	position: relative;
	display: none;
	left: -9px;
}
#nav .menue-language-content.active{
	display: block;
}

#nav .menue-language a{
	color: #999999;
}

#nav .menue-language a,
#nav .menue-language span {
	width: 20px;
	height: 20px;
	display: block;
}

#nav .menue-language .active{
	color:#ededed;
}

#nav .menue-language .divider{
	width: 20px;
	height: 1px;
	border-bottom: 1px solid #ededed;
	margin: 15px 0;
	display: inline-block;
	position: relative;
	top: 2px;
}

#nav .ym-searchform .ym-searchbutton{
	float: left;
}

.nav-home{
	width: 25px;
	height: 25px;
	background: url(../images/menue-home.png) no-repeat 0 0;
	position: relative;
	top: 3px;
	margin-right:0.8em !important;
}
.nav-home a{
	width: 25px;
	height: 25px;
}

/* Sonderfall: Eventpage */

@media only screen and (min-width: 769px) {
	body.ci-eventpage #header {
		margin-bottom: 30px;
	}
}