/*.hassubpages, .active.hassubpages{
	position: relative;
}*/
.hassubpages ul, .active.hassubpages ul {
	display: none;
}



/**********************************************/
@media only screen and (min-width: 1480px)  {


.hassubpages.open ul, .active.hassubpages.open ul {
	display:block;
	width:auto;
	text-align:left;
	position:absolute;
	list-style-type:none;
	margin:4px -13px;
	padding:13px;
	background:#fff;
	z-index:1000;
	}
.hassubpages.open ul li {
	color: #000;
	margin:8px 0;
	padding:0;
	}
.hassubpages.open ul li a {
	color: #000;
	margin:0;
	padding:0;
	white-space: nowrap;
	}
.hassubpages.open ul li a[href^="http"], .hassubpages.open ul li a[href^="/project"] {
	background:none !important;
	}
.hassubpages.open ul li a:hover, .hassubpages.open ul li.active a {
	color:#9cbb3e;
	margin:0;
	padding:0;
	}
.hassubpages.open ul li a::before, .active.hassubpages.open ul li a::before {
  	content: '';
  	position: absolute;
  	top: 0;
  	left: 0
  	width: 0;
 	height:0;
 	opacity: 0;
	}
.overlay-nav-menu {
   position: absolute;
   z-index: 1000;
   top: 180px;
   left: auto;
   bottom: 0;
   right: 30px;
   width: 100%;
   margin:0;
   height:50px;
   opacity: 1;
   text-align: right;
 }
ul.overlay-nav-menu {
	list-style: none; 
    display:flex;
    flex-direction:row;
    justify-content:flex-end;
}
.overlay-nav-menu li {
   	text-transform: uppercase;
    padding:0 15px;
    position: relative;
}
.overlay-nav-menu a {
  	color: #000;
  	font-weight: 500;
   	font-size: 1.2rem !important;
  	line-height: 130%;
  	text-decoration: none;
  	position: relative;
	cursor: pointer;
}
.overlay-nav-menu a::before {
  	content: '';
  	position: absolute;
  	top: -14px;
  	padding-bottom: 14px;
  	left: 50%;
  	width: 100%;
 	/*height: 4px;*/
 	opacity: 0;
 	border-top: 4px solid #9cbb3e;
 	transform-origin: center;
  	transform: translate(-50%, 0) scaleX(0);
  	transition: all 0.3s ease-in-out;
}
.overlay-nav-menu li.active a {
	background:none;
	color:#9cbb3e;
}
.overlay-nav-menu li a:hover::before, .overlay-nav-menu li.active a::before {
  	transform: translate(-50%, 0) scaleX(1);
  	opacity: 1;
}
.gescrollt .overlay-nav-menu {
  	position: fixed;
  	z-index: 1000;
  	top: 90px;
  	left: auto;
    bottom: 0;
    right: 30px;
    width: 100%;
    margin:0;
    height:50px;
    opacity: 1;
    text-align: right;

}




}

/**********************************************/
@media only screen and (max-width: 1480px)  {

.hassubpages.opensubmenu ul {
	display: block;
	padding:20px 0;
	margin:0;
	list-style-type:none;
	background:rgba(255,255,255,1);
	}
.hassubpages.opensubmenu ul li a { 
	background:none !important;
   	font-size: 0.9rem !important;
	color:#9cbb3e !important;
  	padding:10px 0;
	line-height:100%;
    cursor: pointer;
	}
.hassubpages.opensubmenu ul li a:hover, .overlay-nav-menu.is-open li.active.hassubpages ul li.active a  { 
	color:#000 !important;
	}
.hassubpages.opensubmenu ul li a[href^="http"], .hassubpages.opensubmenu ul li a[href^="/project"]{
	background:none !important;
	}
.hassubpages span.down {
	width:1.7em;
	height:1.5em;
	display: inline-block;
	background: url('https://www.spp2100.de/typo3conf/ext/spp2100/Resources/Public/Icons/down.svg');
	position: absolute;
	margin-top: 9px;
	left: calc(50% + 120px);
	cursor: pointer;

}
	
	
.overlay-nav-menu-toggle {
  position: absolute;
  z-index: 5000;
  width: 70px;
  height:70px;
  display:block;
  top: 148px;
  right: 2rem;
  transition: all 0.4s ease-in-out;
  background-image: url("../Images/burger2025.png");
  background-repeat: no-repeat;
  background-size: 100%;
}

.gescrollt .overlay-nav-menu-toggle {
  position: fixed;
  z-index: 5000;
  top: 32px;
  transition: all 0.4s ease-in-out;
}
.overlay-nav-menu-toggle:hover {
  	transition: all 0.4s ease-in-out;
  	color: #575757;
}

.overlay-nav-menu {
  	position: absolute;
  	z-index: 0;
  	top: 0 !important;
  	left: 0;
  	bottom: 0;
  	right: 0;
  	width: 100%;
  	margin: 0;
	padding:20vh 0 !important;
	width: calc(100%);
	height:100v;
  	/*display: -webkit-flex;
  	display: -ms-flexbox;
  	display: flex;
  	-webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  	-webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;*/
  	opacity: 0;
  	list-style: none;
    background: #AFCB08;
    background: linear-gradient(90deg,rgba(175, 203, 8, 1) 0%, rgba(124, 161, 102, 1) 54%, rgba(66, 118, 134, 1) 100%);
  	text-align: center;

}
.overlay-nav-menu.is-open {
  	position: fixed;
  	z-index: 3000;
	overflow:scroll;
    opacity: 1;
}
.overlay-nav-menu.is-open li {
  	font-size: 2rem;
    text-transform: uppercase;
   	float:none;
}
.overlay-nav-menu a {
   	pointer-events: none;
    cursor: default;
	
}
.overlay-nav-menu.is-open a {
  	display: block;
  	color: #fff;
    font-weight: bold;
font-size:20px;
  	padding:15px 0;
	line-height:100%;
  	border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  	text-decoration: none;
	pointer-events: auto;
    cursor: pointer;
}

.overlay-nav-menu.is-open a:hover, .overlay-nav-menu.is-open li.active a{
  background-color: rgba(255, 255, 255, 0.6);
  color: #0a0a0a;
}


.overlay-nav-menu.is-open ~ .overlay-nav-menu-toggle {
   position: fixed;
  z-index: 5000;
  top: 52px;
  transition: all 0.4s ease-in-out;
  background-image: url("https://www.spp2100.de/typo3conf/ext/spp2100/Resources/Public/Images/close.png");
  background-repeat: no-repeat;
  background-size: 100%;
}
}


/**********************************************/
@media only screen and (max-width: 40em) {

.overlay-nav-menu-toggle {
  	top: 135px;
  	right: 1.5rem;
	}

}

/**********************************************/

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


.overlay-nav-menu.is-open ~ .overlay-nav-menu-toggle {
  	top: 5px;
  	right: 0.8rem;
	}
.overlay-nav-menu {
  	top: 30px;
	}
.overlay-nav-menu.is-open a {
  	padding:20px 0;
	}
.hassubpages span.down {
	width:2em;
	height:2em;
	top: 10px;
	}
.hassubpages.opensubmenu ul li a { 
  	height: 2.25rem;
  	line-height: 2.25rem;
	}
}
