/* FOUNDATION TOPBAR */
/* TWEAKS CSS TOPNAV FOUNDATION */

/* DYN TOPBAR GRÖßE TYPO */
@media only screen and (min-width: 940px) {

	.top-bar-section ul li > a{
	font-size: 1em;
}

}

.cdslogan {   padding: .5em 1em 0 1em ;   font-weight: bold; }
.top-bar-section .has-dropdown.not-click:hover > .dropdown {
    display: block; width: auto;   height: auto;
    overflow: visible;    clip: auto;
    position: absolute !important;
}

/* Menu-Button mit Hamburger-Icon soll auch bei Medium-Grössen sichtbar sein */
@media only screen and (min-width: 40.063em) and (max-width: 64em) { 
  .top-bar .toggle-topbar {    position: relative;  text-align:  right;  }
  .top-bar .toggle-topbar.menu-icon {    margin: 0px;  }
  .top-bar .toggle-topbar.menu-icon a { height: 2.8125rem; line-height: 2.8125rem;  }
}
@media only screen and (min-width: 64.063em) {
    /* Zur Zeit nur ein FadeIn und nur auf breiten Bildschirmen */
  .top-bar-section .dropdown {
    opacity: 0; width: 0; height: 0;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
  }
  .hover, .not-click:hover > .dropdown, 
  .top-bar-section .has-dropdown:hover > .dropdown,
  .top-bar-section .has-dropdown.not-click:hover > .dropdown {
    zoom: 1; opacity: 1;
    filter: alpha(opacity=100);
  }
}

/* ============ TopBar: Generelle Farben setzen ==================== */
.contain-to-grid, .top-bar  {  color: #fff;  }
.top-bar-section ul li, .top-bar.expanded .title-area  {  color: #494949;  }

.contain-to-grid  {  background: rgba(79,79,79,1);  }
.contain-to-grid.sticky.fixed	{  background: rgba(61,61,61,0.9);  }
.top-bar, .top-bar-section ul li, .top-bar.expanded .title-area  {    background: rgba(79,79,79,0); }
.top-bar-section .dropdown li:not(.has-form) a:not(.button) {   background: rgba(255,255,255,1); }

/* 1ste EBENE */
.top-bar-section li:not(.has-form) a:not(.button) {   background: transparent;   color: #fff; }
.top-bar-section .dropdown li:not(.has-form) a:not(.button),
.top-bar-section .dropdown li:not(.has-form):not(.active) > a:hover:not(.button)  {  color: #494949;  }

.top-bar.expanded .toggle-topbar a {     color: #fff; }

/* 1ste EBENE HOVER */
.top-bar-section .has-dropdown:hover  {   background: rgba(255,255,255,1);   /*color: #494949; */ color:#013686; }
.top-bar-section .dropdown li:hover:not(.has-form) > a:not(.button),
.top-bar-section ul li:hover:not(.has-form) > a {	  background: rgba(79,79,79,0);   color: #494949;	}
.top-bar-section li:not(.has-form) a:not(.button):hover, 
.top-bar-section .dropdown li:not(.has-form):not(.active) > a:not(.button):hover { color: #494949; background: rgba(247,247,247,1);   }

.top-bar-section .dropdown li:last-child,
.top-bar-section .dropdown li:last-child a,
.top-bar-section .dropdown li:last-child a:hover    {   border-bottom: 0px; }

.top-bar-section li.lasthmenu {    background: #658500;  }
.top-bar-section .dropdown li.title.back h5 a:hover  {  background: #f4f4f4 !important;  }


/* am 14.08.2015 eingefügt > Anzeige des Parent-Links bei schmalen und Medium-Bildschirmen */
/* Schaltet den Link des übergeordneten Kapitels (1. Ebene in der Navi) auch auf Medium-Bildschirmen sichtbar, sobald die Navigation auf mobile in  Mediumgrössen umspringt >
	user könnte sonst nicht die Navigationsebene darüber erreichen */

.top-bar-section .dropdown li.parent-link	{		padding: 0.4em 0;	}
.top-bar-section .dropdown li.parent-link a:link	{
	line-height: 1.4em !important;
	padding: 0.3rem 0.8rem !important;
	background-color: #ffffff;
	color: #494949;		font-weight: bold;
}
.top-bar-section .dropdown li.parent-link:hover,
.top-bar-section .dropdown li.parent-link a.parent-link:hover	{
	color: #013686 !important; background-color: #f4f4f4 !important;
}
 .top-bar-section .not-click.mega-menu.moved .parent-link	{ 
	display: block !important;	height: auto !important;
}

/* !!!! ======== Mega Menu - 1. Generell =========== !!! */

  .top-bar-section .dropdown.mega-menu-content {
	border-radius: 0; position: absolute; 
	min-width: 100%;  max-width: 1920px; 
	margin: 0 auto;  padding: 0em;
	background: none rgba(255,255,255,1);
	box-shadow: 0em 0.1em 0.2em 0em rgba(0, 0, 0, 0.2); 
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}

li.item, .mega-menu-grid-list li.item  { color: #494949;  border: none !important;   background: transparent !important;  padding: 0; }

/*.top-bar-section .dropdown .mega-menu-grid-content h4,*/
.top-bar-section .dropdown.mega-menu-content .mega-menu-grid-content h4 { 
	font-weight: bold !important;
	border: none !important; 
	background: transparent !important; 
	font-size: 1em;  margin: 0; padding: 0;
}

li.item a,
.top-bar-section .mega-menu-content .mega-menu-grid-list > li a, 
.top-bar-section .mega-menu-content .mega-menu-grid-list > li:not(.has-form) a:not(.button),
.top-bar-section .dropdown.mega-menu-content .mega-menu-grid-content h4 a  	{
	font-size: 0.8em !important;
	font-weight: bold !important;
	color: #494949  !important;
	margin: 0; padding: 0.2em 0.8em !important;
	background: transparent !important;
	line-height: 1.5em !important;
	display: block !important; 
	white-space: normal !important;
}

.top-bar-section .dropdown.mega-menu-content .mega-menu-grid-content h4 a  	{ 	
	/* background: rgba(244,244,244,1) !important; */
	padding: 0.4em 0.8em !important; 
	line-height: 1.6em !important;
}

li.item, li.item a, .top-bar-section .mega-menu-content .mega-menu-grid-list > li:not(.has-form) a:not(.button)	{	font-weight: normal !important; }


/* Hintergrund für aktivierte einzelne Links in der 3. Ebene */
li.item a:hover,  
.top-bar-section .dropdown.mega-menu-content .mega-menu-grid-content li a:hover {
	color: #013686 !important; 
	/* background: rgba(224,224,224,0.2) !important; */
}

.top-bar-section .dropdown.mega-menu-content .mega-menu-grid-content h4 a:hover {
	color: #013686 !important; 
	/* background: rgba(238,238,238,1) !important; */
}

@media only screen and (max-width: 40em) {
  .title h5  {      margin: 0; padding: 0;   }
	li.item a, .top-bar-section .mega-menu-content .mega-menu-grid-list > li a, 
	.top-bar-section .mega-menu-content .mega-menu-grid-list > li:not(.has-form) a:not(.button),
	.top-bar-section .dropdown.mega-menu-content .mega-menu-grid-content h4 a {   
		padding: 0.5em 0.8em !important; 
		line-height: 1.5em !important;
	}
  /*li.item:hover, .top-bar-section .dropdown.mega-menu-content .mega-menu-grid-content h4:hover{  background: #f4f4f4;	}*/
} 
/* ENDE TWEAKS TOPNAV */



/* ======== 2: Die Blockgrids in der Mega-Menu-Klasse ======= */

.mega-menu-content li > ul[class*="block-grid-"] {  
  display: block;  padding: 0;  margin: 0;
}
.mega-menu-content li > ul[class*="block-grid-"]:before, [class*="block-grid-"]:after {    content: " ";    display: table; box-sizing: border-box; }
.mega-menu-content li > ul[class*="block-grid-"]:after {    clear: both; }
.mega-menu-content li > ul[class*="block-grid-"] > li {    display: block;    height: auto;    float: left;    padding: 0 }

.mega-menu-content:after,
.mega-menu-content li > ul[class*="block-grid-"]:after,
.mega-menu-grid-list:after  {  content: "";  display: table;  clear: both; }

.mega-menu-content li > ul[class*="block-grid-"] > li {
  display: block;  height: auto; float: left;
  list-style: outside none none;  padding: 0;
}

@media only screen {
  .mega-menu-content li > .small-block-grid-1 > li { width: 100%; list-style: none; }
  .mega-menu-content li > .small-block-grid-1 > li:nth-of-type(1n) { clear: none; }
  .mega-menu-content li > .small-block-grid-1 > li:nth-of-type(1n+1) { clear: both; }
}

@media only screen and (min-width: 40.063em) {
  .mega-menu-content li > .medium-block-grid-1 > li { width: 100%; list-style: none; }
  .mega-menu-content li > .medium-block-grid-1 > li:nth-of-type(1n) { clear: none; }
  .mega-menu-content li > .medium-block-grid-1 > li:nth-of-type(1n+1) { clear: both; }
  .mega-menu-content li > .medium-block-grid-2 > li { width: 50%; list-style: none; }
  .mega-menu-content li > .medium-block-grid-2 > li:nth-of-type(1n) { clear: none; }
  .mega-menu-content li > .medium-block-grid-2 > li:nth-of-type(2n+1) { clear: both; }
  .mega-menu-content li > .medium-block-grid-3 > li { width: 33.33333%; list-style: none; }
  .mega-menu-content li > .medium-block-grid-3 > li:nth-of-type(1n) { clear: none; }
  .mega-menu-content li > .medium-block-grid-3 > li:nth-of-type(3n+1) { clear: both; }
  .mega-menu-content li > .medium-block-grid-4 > li { width: 25%; list-style: none; }
  .mega-menu-content li > .medium-block-grid-4 > li:nth-of-type(1n) { clear: none; }
  .mega-menu-content li > .medium-block-grid-4 > li:nth-of-type(4n+1) { clear: both; }
  .mega-menu-content li > .medium-block-grid-5 > li { width: 20%; list-style: none; }
  .mega-menu-content li > .medium-block-grid-5 > li:nth-of-type(1n) { clear: none; }
  .mega-menu-content li > .medium-block-grid-5 > li:nth-of-type(5n+1) { clear: both; }
}
@media only screen and (min-width: 64.063em) {
  .mega-menu-content li > .large-block-grid-1 > li { width: 100%; list-style: none; }
  .mega-menu-content li > .large-block-grid-1 > li:nth-of-type(1n) { clear: none; }
  .mega-menu-content li > .large-block-grid-1 > li:nth-of-type(1n+1) { clear: both; }
  .mega-menu-content li > .large-block-grid-2 > li { width: 50%; list-style: none; }
  .mega-menu-content li > .large-block-grid-2 > li:nth-of-type(1n) { clear: none; }
  .mega-menu-content li > .large-block-grid-2 > li:nth-of-type(2n+1) { clear: both; }
  .mega-menu-content li > .large-block-grid-3 > li { width: 33.33333%; list-style: none; }
  .mega-menu-content li > .large-block-grid-3 > li:nth-of-type(1n) { clear: none; }
  .mega-menu-content li > .large-block-grid-3 > li:nth-of-type(3n+1) { clear: both; }
  .mega-menu-content li > .large-block-grid-4 > li { width: 25%; list-style: none; }
  .mega-menu-content li > .large-block-grid-4 > li:nth-of-type(1n) { clear: none; }
  .mega-menu-content li > .large-block-grid-4 > li:nth-of-type(4n+1) { clear: both; }
  .mega-menu-content li > .large-block-grid-5 > li { width: 20%; list-style: none; }
  .mega-menu-content li > .large-block-grid-5 > li:nth-of-type(1n) { clear: none; }
  .mega-menu-content li > .large-block-grid-5 > li:nth-of-type(5n+1) { clear: both; }
}

/* ========= 3. Farben der Mega Menu ============= */

.mega-menu-content li > ul[class*="block-grid-"] .mega-menu-grid-content {  margin: 0 0 1px 0; }
/*
.mega-menu-content li > .medium-block-grid-5 > li:nth-of-type(4n+1)  
.mega-menu-content li > ul[class*="block-grid-"] .mega-menu-grid-content:nth-of-type(4n+1)	{   border-right: 0px solid #efefef; }
.mega-menu-content li > ul[class*="block-grid-"] .mega-menu-grid-content,
.mega-menu-content li > ul[class*="block-grid-"] .mega-menu-grid-content:first-child,
.mega-menu-content li > ul[class*="block-grid-"] .mega-menu-grid-content:nth-of-type(2n+1) 	{   border-right: 1px solid #efefef;	}
.mega-menu-content li > ul[class*="block-grid-"] .mega-menu-grid-content:nth-of-type(5),
.mega-menu-content li > ul[class*="block-grid-"] .mega-menu-grid-content:nth-of-type(10)		{   border-right: 0px solid #efefef; }
*/


/*
.top-bar-section .mega-menu .mega-menu-content a,
.top-bar-section .mega-menu .mega-menu-content li > ul[class*="block-grid-"] > li,
.top-bar-section .mega-menu-content .mega-menu-grid-list > li a, 
.top-bar-section .mega-menu-content .mega-menu-grid-list > li:not(.has-form) a:not(.button) {
  color: #494949 !important;
}

.top-bar-section .mega-menu .mega-menu-content a:hover,
.top-bar-section .mega-menu-content .mega-menu-grid-list > li:hover:not(.has-form) a:not(.button) {
  color: #013686 !important; /* border: 0px solid #494949; 
}
*/
/*================ 3. MegaMenu-Einstellungen für spezielle Grössen ============== */

@media only screen and (max-width: 40em) {
  .mega-menu-content  {
	padding: 0;	position: relative;  min-width: 100%;
  }
	.mega-menu-content li > ul[class*="block-grid-"] .mega-menu-grid-content,
	.mega-menu-content li > ul[class*="block-grid-"] .mega-menu-grid-content:first-child  {  margin: 0em !important; }
	.mega-menu-content li ul li h4 { padding: 0.4em 0;}
} 

@media only screen and (min-width: 40.063em) {
  .top-bar-section .has-dropdown.mega-menu {
    position: static !important;
  }
  .top-bar-section .has-dropdown.mega-menu a {
    position: relative;  display: block;
  }
}

@media only screen and (max-width: 64em) {
	.top-bar-section .divider, .top-bar-section [role="separator"]	{	border: 0px solid #4E4E4E; }
	.top-bar-section .divider:last-child, .top-bar-section [role="separator"]:last-child	{	display: none;	height: 0px; }
}

/* reagiert bei cdc.de zu spät, wenn der User den Screen resized, bevor die Seite neu geladen wird
	JavaScript läßt .mega-menu.moved im Quellcode stehen
@media only screen and (min-width: 64.063em) {
	stattdessen wird Link schon bei 940 Pixeln versteckt
	*/
@media only screen and (min-width: 58.750em) {
	.top-bar-section .not-click.mega-menu.moved .parent-link,
	.top-bar-section .dropdown li.parent-link.hide-for-medium-up,
	.top-bar-section .dropdown li.parent-link a:link	{
		display: none !important;
	}
}

/* verhindert in Chrome, daß ausgeblendete Menu-Ebenen über der sichtbaren Ebene liegen */
@media only screen and (max-width: 64em) {
	.top-bar-section .mega-menu	{	position: relative; z-index: 0 !important; }
	.top-bar-section .mega-menu.moved	{			z-index: 999 !important;	}
}
/* schaltet den Hintergrund auf breiteren Bildschirmen halbtransparent, sobald die mobile Ansicht abgeschaltet wird */
@media only screen and (min-width: 58.750em) {
  .top-bar-section .dropdown.mega-menu-content {
    background: none rgba(255,255,255,0.95) !important;
  }
}

@media only screen and (min-width: 40.063em)	and (max-width: 64em){

	.top-bar-section li.has-dropdown.mega-menu.moved ul.dropdown.mega-menu-content {
		border-bottom: 1px solid #efefef !important;
	}

	.mega-menu-content li > ul[class*="block-grid-"] .mega-menu-grid-content {	margin-bottom: 1px;	}

/* Das schaltet den unseligen 1px MouseOver-Bug in Chrome in der mittleren Größe ab:	*/
	.top-bar-section .mega-menu.moved .mega-menu-content	{	z-index: 999 !important; margin-top: -1px; }
}