/******* Do not edit this file *******
Woody Code Snippets CSS and JS
Saved: Jun 10 2026 | 13:37:43 */
/* ----------------------- desktop menu styling ----------------------- */

@media (min-width:992px) {

	.main-desktop {
		font-size:18px!important;
		height:100px;
		background-color:#2A503E;
		display:flex;
		justify-content: center;
		align-items:center !important;
		flex: 1 1 0!important;
		margin-top: 0px !important;
		width:auto;
		transition: height 0.3s ease, background-color 0.3s ease;
	}

	.main-desktop:hover {
		background-color:#5eb135;
	}
	
	.mega-menu.main-desktop.menu-cta {
		background-color:#63ba38!important;
	}

	body #page-container header .et_pb_menu .nav li.menu-cta:hover {
		background-color:#74de40!important;
	}
	
	.et_pb_sticky .main-desktop,
	.et_pb_sticky--top .main-desktop {
		height: 50px !important;
	}

	.et-menu-nav,
	.et-menu,
	.et_pb_menu__menu  {
		width:100%;
		margin: 0px !important;
	}

	.nav ul li a:hover {
		background-color:transparent;
	}

	.et-menu-nav li.mega-menu>ul>li>a:first-child:hover {
		background-color:transparent!important;
	}

	.nav li li a {
		font-size:18px!important;
	}

	.et-menu-nav li.mega-menu>ul>li>a:first-child {
		border-bottom:none !important;
	}

	.main-desktop > a:hover {
		opacity:1!important;
		color:white!important;
	}

	/* Desktop: 2. und 3. Ebene im Submenu auf Hover grün halten */
	body #page-container header .et_pb_menu .nav li ul.sub-menu li:hover > a,
	body #page-container header .et_pb_menu .nav li ul.sub-menu li > a:hover,
	body #page-container header .et_pb_menu .nav li ul.sub-menu li > a:focus {
		color: #5eb135 !important;
		opacity: 1 !important;
		background-color: transparent !important;
	}

	/* Falls Divi den Linktext in span o.ä. verschachtelt */
	body #page-container header .et_pb_menu .nav li ul.sub-menu li:hover > a *,
	body #page-container header .et_pb_menu .nav li ul.sub-menu li > a:hover *,
	body #page-container header .et_pb_menu .nav li ul.sub-menu li > a:focus * {
		color: #5eb135 !important;
		opacity: 1 !important;
	}

	/* Bullet der 3. Ebene soll Hover-Farbe mitnehmen */
	body #page-container header .et_pb_menu .nav li ul.sub-menu li > a:hover::before,
	body #page-container header .et_pb_menu .nav li ul.sub-menu li:hover > a::before,
	body #page-container header .et_pb_menu .nav li ul.sub-menu li > a:focus::before {
		background: currentColor !important;
		color: #5eb135 !important;
	}

	/* Desktop Mega-Menü: Layout der 2. Ebene ohne Kinder untereinander, Helfen ausgeschlossen */
	body #page-container header .et_pb_menu .nav li.mega-menu:not(.menu-cta) > ul.sub-menu {
		display: grid !important;
		grid-template-columns: repeat(3, 1fr) !important;
		grid-template-rows: min-content min-content !important;
		grid-auto-flow: column !important;
		gap: 10px 40px !important;
		align-content: start !important;
		justify-content: center !important;
	}

	body #page-container header .et_pb_menu .nav li.mega-menu:not(.menu-cta) > ul.sub-menu > li {
		width: auto !important;
		float: none !important;
		clear: none !important;
		padding-left: 5px !important;
		margin: 0 !important;
		align-self: start !important;
	}

	body #page-container header .et_pb_menu .nav li.mega-menu:not(.menu-cta) > ul.sub-menu > li.menu-item-has-children {
		grid-row: 1 / span 2 !important;
		align-self: start !important;
	}
	
	/* 2. Ebene Bold */
	body #page-container header .et_pb_menu .nav li.mega-menu > ul.sub-menu > li > a {
	font-weight: 900 !important;
	}
	
		/* Einzelpunkt nach Broschüren enger darunter setzen */
	body #page-container header .et_pb_menu .nav li.mega-menu:not(.menu-cta) > ul.sub-menu > li.menu-single + li:not(.menu-item-has-children) {
		margin-top: -100px !important;
	}

	/* 3. Ebene: Abstand zurücksetzen, damit Bullet auf Parent-Achse startet */
	body #page-container header .et_pb_menu .nav li.mega-menu:not(.menu-cta) > ul.sub-menu > li > ul.sub-menu {
		padding-left: 22px !important;
		margin-left: 0 !important;
	}

	/* 3. Ebene: kleine Bulletpoints in Schriftfarbe */
	body #page-container header .et_pb_menu .nav li.mega-menu:not(.menu-cta) > ul.sub-menu > li > ul.sub-menu > li > a {
		display: flex !important;
		align-items: center !important;
		gap: 10px !important;
		position: relative;
		padding-left: 0 !important;
	}

	body #page-container header .et_pb_menu .nav li.mega-menu:not(.menu-cta) > ul.sub-menu > li > ul.sub-menu > li > a::before {
		content: "";
		position: static;
		display: inline-block;
		width: 4px;
		height: 4px;
		min-width: 4px;
		background: currentColor;
		border-radius: 50%;
		transform: none;
	}

	/* Desktop: "Helfen" Submenu nur so breit wie der Menüpunkt selbst */
	body #page-container header .et_pb_menu .nav li.menu-cta {
		position: relative !important;
	}

	body #page-container header .et_pb_menu .nav li.menu-cta > ul.sub-menu {
		position: absolute !important;
		left: 0 !important;
		right: auto !important;
		top: 100% !important;
		width: 100% !important;
		min-width: 100% !important;
		max-width: 100% !important;
		display: block !important;
		padding: 16px 0 !important;
		transform: none !important;
	}

	body #page-container header .et_pb_menu .nav li.menu-cta > ul.sub-menu > li {
		width: 100% !important;
		display: block !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	body #page-container header .et_pb_menu .nav li.menu-cta > ul.sub-menu > li > a {
		width: 100% !important;
		display: block !important;
		text-align: left !important;
		padding: 10px 12px !important;
		margin-left:10px!important;
	}

	.wpgb-main .wpgb-area button {
	    background: #5ABD31 !important;
	    width: 32px !important;
	    height: 32px !important;
	    color: #fff !important;
	    position: relative;
	    border-radius: 50%;
	    margin-right: 9px;
	}

	.wpgb-area {
	    margin-left: 0 !important;
	}

	.wpgb-main .wpgb-area .wpgb-prev-button svg {
	    margin-left: -1px;
	}

}