/*----------BURGER MENÜ ----------*/
#mobile-suche:hover { background-image: url('/wp-content/uploads/images/lupe-hover.png');}
#mobile-suche a{text-decoration: none;
	display: block;
  height: 100%;
  width: 100%;}

#mobile-suche {
cursor: pointer;
  width: 35px;
  background-image: url('/wp-content/uploads/images/lupe.png');
  background-size: 100% 100%;
  height: 35px;
  display: none;
  position: absolute;
  right: 100px;
  top: 43px;
}

.menu-toggle {
  display: none;
 
  background: none;
  border: none;
  cursor: pointer;
  position: absolute;
  top: 2.2rem;
  right: 2rem;
  z-index: 1000; /* Damit es über dem Menü liegt */
	padding:7px 5px 0px 5px;
	transition: 0.2s;
}

.menu-toggle img {width: 40px;  height: 34px;}

.menu-toggle:hover {
  transform: scale(1.1) ;
  color: white;
 /* background-color: var(--wws-orange); */
	 
}

.burger-navigation .burgermenu {display:none}


@media (max-width: 991px) {
	#mobile-suche {display:block}
	.sub-navigation .menu-b, .main-navigation .menu-a{
    display: none;
	}	
	
  .menu-toggle {
    display: block;
  }

	
  .burger-navigation .burgermenu {
flex-direction: column;
    gap: 0.7rem;
    background: var(--wws-orange);
    padding: 0rem;
    padding-top: 0rem;
    position: absolute;
    top: 0rem;
    right: 0rem;
    z-index: 999;
    list-style: none;
    width: 100%;
    text-align: center;
    font-size: 7vw;
    font-family: Misrow;
    letter-spacing: 2px;
    height: 100vh;
	
	  
    padding-top: 100px;
	  line-height: 131%;
	    overflow-y: auto;
  overscroll-behavior: contain; /* Optional: verhindert Scrollen der Seite beim Scrollen im Menü */
  -webkit-overflow-scrolling: touch;
  }

 .burger-navigation .burgermenu a {
  text-decoration:none;
color: var(--wws-dunkelgruen);
    background-color: white;
    padding: 3px 20px;
}
	
.burger-navigation .burgermenu li:hover > a {


}		
	.burger-navigation .burgermenu li {transition:0.1s;}	
.burger-navigation .burgermenu li:hover {
 transform: scale(1.1);
	transition:0.3s;
}	
	
.burger-navigation .burgermenu.is-open {
    display: flex;
	padding-bottom: 40px;
  }
	
	
	.menu-toggle[aria-expanded="true"] img{transform:rotate(90deg)}


.burger-navigation .burgermenu li {
  transition: background-color 0.3s, color 0.3s;
}


.burger-navigation .burgermenu li:nth-child(6) {margin-bottom:20px;}
	
}

/*-----------HEADER------------*/

#masthead {
	top: 0px;
	z-index: 99 !important;
  height: 145px;
position: fixed;
  width: 100vw;
  background-color: white;
}

/*----MenuB----*/
#menu-item-267 a{
width: 100%;
  display: inline-block;
}
#menu-item-267 {
/*Such-Lupe*/
  cursor:pointer;
  width: 19px;
  background-image: url('/wp-content/uploads/images/lupe.png');
  background-size: 100% 100%;
  height: 19px;
}
#menu-item-267:hover { background-image: url('/wp-content/uploads/images/lupe-hover.png');}
#menu-item-267.current-menu-item {background-image: url('/wp-content/uploads/images/lupe-hover.png');}

.sub-navigation .current-menu-item a{color: var(--wws-orange);}

.sub-navigation {
  position: absolute;     /* oder fixed/relative, je nach Layout */
top: 20px;
  right: 1%;
  padding: 1rem;
  z-index: 1000; 
	transition:0.3s;
}

.menu-b {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 1.5rem;           
  justify-content: flex-end;
  align-items: center;
}

/* LI-Links */
.menu-b li a {
  text-decoration: none;
  color: var(--wws-dunkelgruen);            
  font-weight: 700;
  font-size: 15px;
  transition: color 0.1s ease;
}

.menu-b li a:hover {
  color:var(--wws-orange);           
}


/*----MenuA----*/


.main-navigation {
  position: absolute;    
  top: 75px;
  right: 1%;
  padding: 1rem;
  z-index: 1001;  
	transition:0.3s;
}

.menu-a {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 1vw; 
  justify-content: flex-end;
  align-items: baseline;
}

.menu-a li {
	text-align: center;


 
}


/* LI-Links */
.menu-a li a {
	font-family: 'Misrow';	
  text-decoration: none;
  color: var(--wws-dunkelgruen);            
  font-weight: 400;
  font-size: 1.4vw;
  transition: color 0.1s ease;
	letter-spacing: 2px;
	line-height: 32px;
padding: 11px 14px 5px 14px;
  
}

.menu-a li:nth-child(1) a:hover, .menu-a li:nth-child(1).current-menu-item a {color:white;background-image:url('/wp-content/uploads/images/Menue1.png');background-size:100% 100%;}
.menu-a li:nth-child(2) a:hover, .menu-a li:nth-child(2).current-menu-item a {color:white;background-image:url('/wp-content/uploads/images/Menue2.png');background-size:100% 100%;}
.menu-a li:nth-child(3) a:hover, .menu-a li:nth-child(3).current-menu-item a {color:white;background-image:url('/wp-content/uploads/images/Menue3.png');background-size:100% 100%;}
.menu-a li:nth-child(4) a:hover, .menu-a li:nth-child(4).current-menu-item a {color:white;background-image:url('/wp-content/uploads/images/Menue4.png');background-size:100% 100%;}
.menu-a li:nth-child(5) a:hover, .menu-a li:nth-child(5).current-menu-item a {color:white;background-image:url('/wp-content/uploads/images/Menue5.png');background-size:100% 100%;}
.menu-a li:nth-child(6) a:hover, .menu-a li:nth-child(6).current-menu-item a {color:white;background-image:url('/wp-content/uploads/images/Menue6.png');background-size:100% 100%;}


/*-----HEADER SCROLLED-----*/
.site-header.scrolled{
	height: 100px!important;
	transition:0.3s;
}

.site-header.scrolled .sub-navigation {
  top: -8px;
	
}

.site-header.scrolled .main-navigation {
  top: 36px;

}

/*----LOGO----*/

.logo {
 	width: 99px;
  left: 102px;
	top:0px;
	transition:0.3s;
	position: fixed;
	
}

body.home  .logo {
width: 16%;
  position: fixed;
  left: 11%;
  top: 80px;
  transition: 0.3s;
}

body.home .logo.scrolled{
 	width: 99px;
  left: 102px;
	top:0px;
	transition:0.3s;
}

/*----ANIM----*/

/* Hover für kleine Version */
.logo:hover {
  animation: wobble 0.6s ease-in-out ;
}

/* Hover für große Version auf Startseite */
body.home .logo:not(.scrolled):hover {
  animation: wobble 0.6s ease-in-out ;
}

/* Keyframes */
/*@keyframes wobble {
  0%   { transform: scale(1) rotate(0deg); }
  30%  { transform: scale(1.1) rotate(-2deg); }
  60%  { transform: scale(1.1) rotate(2deg); }
  100% { transform: scale(1) rotate(0deg); }
}
*/

@keyframes wobble-small {
  0%   { transform: scale(0.35) rotate(0deg); }
  30%  { transform: scale(0.36) rotate(-2deg); }
  60%  { transform: scale(0.36) rotate(2deg); }
  100% { transform: scale(0.35) rotate(0deg); }
}

@keyframes wobble {
  0%   { transform: translateX(0); }
  15%  { transform: translateX(-4px) rotate(-1deg); }
  30%  { transform: translateX(3px) rotate(1deg); }
  45%  { transform: translateX(-2px) rotate(-0.5deg); }
  60%  { transform: translateX(1px) rotate(0.5deg); }
  75%  { transform: translateX(-1px); }
  100% { transform: translateX(0) rotate(0); }
}




.menu-a li:hover {
  animation: pop-swing 0.4s ease-in-out;
 display:inline-block;
  transform-origin: bottom;
}


@keyframes pop-swing {
  0%   { transform: scale(1) rotate(0deg); }
  30%  { transform: scale(1.1) rotate(-2deg); }
  60%  { transform: scale(1.1) rotate(2deg); }
  100% { transform: scale(1) rotate(0deg); }
}



/*----------Responsiv MENÜ ----------*/


@media (max-width: 575.98px) {

	#masthead { max-height: 70px;}
	.menu-toggle img {width: 30px;  height: 25px;}
	.menu-toggle {top: 1.1rem;}
	#mobile-suche {  width: 30px;  height: 30px;  right: 96px; top: 24px;}
	
	
body.home .logo.scrolled,.logo.scrolled {width: 45px;    left: 30px;    top: -6px;}
	body.home .logo, .logo  {  width: 23%;   left: 9%;  top: 20px;  }
	header ul li:nth-child(n+7):nth-child(-n+11)  {  line-height: 110%;}
header ul li:nth-child(n+7):nth-child(-n+11) a {  color: var(--wws-dunkelrot);  font-size: 6vw;}
}


@media (min-width: 576px) and (max-width: 767.98px) {
#masthead { height: 100px;}
body.home .logo.scrolled,.logo.scrolled {width: 66px;    left: 42px;    top: -7px;}
	body.home .logo, .logo  {  width: 20%;   left: 9%;  top: 20px;  }
	.burger-navigation .burgermenu {font-size: 4.6vw;}
	ul li:nth-child(n+7):nth-child(-n+11)  {  line-height: 110%;}
ul li:nth-child(n+7):nth-child(-n+11) a {  color: var(--wws-dunkelrot);  font-size: 4vw;}

}
	
@media (min-width: 768px) and (max-width: 991.98px) {
	body.home .logo.scrolled,.logo.scrolled {width: 66px;    left: 42px;    top: -7px;}
	#masthead {  height:100px;}
	body.home .logo, .logo  {  width: 15%;   left: 9%;  top: 20px;  }
	.burger-navigation .burgermenu {font-size: 4.6vw;}
	header ul li:nth-child(n+7):nth-child(-n+11)  {  line-height: 110%;}
header ul li:nth-child(n+7):nth-child(-n+11) a {  color: var(--wws-dunkelrot);  font-size: 4vw;}
}


@media (min-width: 992px) and (max-width: 1199.98px) {
	body.home .logo { width: 14%;left:4%;}
	.menu-a li a {font-size: 1.7vw;}
	.menu-a { gap: 0.1vw;}
	body.home .logo.scrolled,.logo {width: 87px;    left: 27px;    top: 2px;}
}


@media (min-width: 1200px) and (max-width: 1399.98px) {
	body.home .logo { width: 15%;left:6%;}
	.menu-a li a {font-size: 1.7vw;}
	.menu-a { gap: 0.1vw;}
	body.home .logo.scrolled,.logo {left: 5%;}
	
}
 









