/************************************************************************************
MOBILE TOP NAVI
*************************************************************************************/
@media screen and (max-width: 1023px) {
    /* nav-wrap */
         
    /* main nav */
    .sf-menu {
        clear: both;
        position: absolute;
        width:100%;
        z-index: 10000;
        padding:0;
        background-color:#ffffff;
        display: none; /* visibility will be toggled with jquery */
    }
    .sf-menu li {
        clear: both;
        float: none !important;
        margin:0;
        padding:0;
    }

    .sf-menu a, .sf-menu ul a {
        background: none;
        display: block;
        padding: 0.8em 0;
        color: #666;
        border: none;
    }



/*** arrows (for all except IE7) **/
.sf-arrows .sf-with-ul {
  padding-right: 0/*2.5em*/;
  *padding-right: 0/*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: 6px solid transparent;
  border-top-color: #83f121/*#dFeEFF*/; /* 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: white; /* IE8 fallback colour */
  margin-right:10px;
}


	
.sf-arrows ul .sf-with-ul:after {
  content: '';
    border-color: transparent transparent transparent rgba(36, 242, 118, 0.8);
  /*  margin-right: 35px;*/
/*    margin-top: 4px;*/
	top:13px;
	  right: -20px;
  height: 0;
  width: 0;
	position:relative;
	  border: 6px solid transparent;
  border-top-color: #83f121/*#dFeEFF*/; /* edit this to suit design (no rgba in IE8) */
  border-top-color: rgba(20,20,80,.5);

}
.sf-arrows .sf-with-ul {
  /*  padding-right: 0em;*/
}

	
	
	
	
	
    .sf-menu a:hover, .sf-menu ul a:hover {
        background: none;
        color: #000;
    }
    ul.sf-menu li {
        width: 100%;
    }
         
    /* dropdown */
	.nav-h {
		padding-left:0;
	}
	.nav-h ul, .nav-g ul {
		list-style: none outside none;
		margin: 13px 0 10px;
	}
	.nav-h ul li ul, .nav-g ul li ul {
		margin-bottom:20px;
		padding-bottom:10px;
	}
	.nav-h ul li ul li, .nav-h ul li:hover {
        border-bottom: 0px;
    }

	/* fuer alle ul innerhalb sf-menu */
    .sf-menu ul {
        width: auto;
        position: static;
        display: block;
        border: none;
        background: inherit;
    }
    .sf-menu ul li ul {
/*		background-color:#b23834;*/
	}
	
	.sf-menu > li > a {
        border-left: 0px;
	}


	/* fuer jedes einzelne ul innerhalb sf-menu */
    ul.sf-menu {
		padding: 10px 0 !important;
	}
	ul.sf-menu li {
       margin: 3px 10px;
       width:auto;
	   text-align:center;
    }
	ul.sf-menu li.sfHover {
		margin-bottom:20px;
		padding-top:0;
		padding-bottom:10px;
	}
	ul.sf-menu li ul {
		max-width:90%;
		margin:0 auto !important;
		padding: 0 !important;
	}
    ul.sf-menu li ul li {
       margin: 0 0px;
       width:90%;
    }
	
	.sf-menu ul {
	    min-width: 90%;
	}
}