/* Übergröße HD Bildschirme */
@media all {


/*** ESSENTIAL STYLES ***/
.sf-menu {
  position: relative;
  margin: 0 auto;
  padding: 0;
  list-style: none;
  list-style-type: none;
  background: #006781;
  border: solid 0px #f90;
  margin-left: -100px;
}
@media screen and (max-width:1500px){.sf-menu {margin-left: -80px;}}
@media screen and (max-width:1200px){.sf-menu {margin-left: -20px;}}
@media screen and (max-width:1024px){.sf-menu {margin-left: 0px;}}



.sf-menu .sf-mega {
  position: absolute;
  display: none;
  top: 100%;
  z-index: 99;
}

.sf-menu > li {
  float: left;
  margin: 0 auto;
  padding: 0;
  
}


.sf-menu li:hover > .sf-mega,
.sf-menu li.sfHover > .sf-mega {
  display: block;
}


.sf-menu > li > a {
  display: block;
  position: relative;
  text-transform: uppercase;
  font-size: 1em;
  padding: 2.05em 1.0em;
  text-decoration: none;
  zoom: 1;
  color: #fff;	// Farbe Link

}


/*** DEMO SKIN ***/
.sf-menu {
  float: left;
  margin-bottom: 1em;
  width: 100%;
}
.sf-menu .sf-mega {
  box-shadow: 2px 3px 6px rgba(0,0,0,.2);
  /*width: 100%;  allow long menu items to determine submenu width */
  width: 250px;
}

.sf-menu > li > a:hover {color:#000000;}
.sf-menu li.current a {color:#406a64; 	font-weight:700;
}
.sf-menu li a.current {background: #fff; color:#000;}



.sf-menu > li {
  background: #406a64; /* Ist der Background der oberen Hauptnavigationszeile*/
 /* -webkit-transition: background .2s;
  transition: background .2s;*/
}

.sf-menu > li:first-child:hover {
  background: none;
}

.sf-menu > li:hover,
.sf-menu > li.sfHover {
  background: #fff; /* OVER IN DER OBERENZEILE */
  /* only transition out, not in */
  -webkit-transition: none;
  transition: none;
 }




/*** mega menu dropdown Das was runterklappt ***/
.sf-mega h3{font-size: 1.5em; font-weight:normal; color:#998d4e; text-align:left; margin:10px 0 10px 0;}

.sf-mega {
	background: #eeeeee;
	padding: 1em 1em 1em 0;
	margin: 0;
	box-sizing: border-box;
	width: 100%;
	border: solid 0px #f90;
	text-align: left;
	}

.sf-mega.current {
	background-color: #D2C792;
	padding: 1em;
	box-sizing: border-box;
	}



.hnavlist li {
	border: solid 0px #f90;
	padding: 0;
	margin: 0;
	display: block;
	list-style-type: none;
	text-align: left;
}


.sf-menu ul li a {
	line-height:2.7em;
	font-size:1.0em;
	text-align: left;
	border: solid 0px #f90;
	color: #999; /* Farbe der horizontalen Links im Untermenü */
}

.sf-menu ul li a:hover {
	color: #000; /* Farbe der horizontalen Links im Untermenü bei MAUSOVER*/
}

.hnavlist li ul li {
	border: solid 0px #f90;
	padding: 0 25px;
	display: inline;
	list-style-type: none;
	text-align: left;
}

.sf-menu ul li ul li a {
	margin-top:15px; line-height:1.7em; font-size:1.0em;
	color: #333; /* Farbe der horizontalen Links im Untermenü */
}
.sf-menu ul li ul li a:hover {
	color: #333; /* Farbe der horizontalen Links im Untermenü bei MAUSOVER*/
}


/*** arrows (for all except IE7) **/
.sf-arrows .sf-with-ul {
  padding-right: 2.5em;
  *padding-right: 1em; /* no CSS arrows for IE7 (lack pseudo-elements) */
}
/* styling for both css and generated arrows */
.sf-arrows .sf-with-ul:after {
  content: '';
  position: absolute;
  top: 50%;
  right: 1em;
  margin-top: -3px;
  height: 0;
  width: 0;
  /* order of following 3 rules important for fallbacks to work */
  border: 5px solid transparent;
  border-top-color: #b55f9d; /* edit this to suit design (no rgba in IE8) */
  border-top-color: rgba(255,255,255,.5);
}
.sf-arrows > li > .sf-with-ul:focus:after,
.sf-arrows > li:hover > .sf-with-ul:after,
.sf-arrows > .sfHover > .sf-with-ul:after {
  border-top-color: #b55f9d; /* IE8 fallback colour */
}


}

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

.sf-menu > li > a {
  padding: 2.1em 1em;
  text-decoration: none;
  zoom: 1;
  color: #fff;	// Farbe Link

}

}


@media screen and (max-width:1320px){
.sf-menu > li > a {
  padding: 2.1em 0.85em;
  text-decoration: none;
  zoom: 1;
  color: #fff;	// Farbe Link

}

}


@media screen and (max-width:1280px){
.sf-menu > li {
  margin:0;}
.sf-menu > li > a {letter-spacing: -0.02em; padding: 2.1em 0.9em;}

}

@media screen and (max-width:1150px){
.sf-menu > li > a {
  padding: 2.1em 0.8em;
}
}


@media screen and (max-width:990px){
.sf-menu > li > a {
  padding: 2.1em 0.7em;
}
}