/* Meta-Navigation */
.naviMeta ul, .mod_changelanguage ul {
    display: flex;
}
.naviMeta li, .mod_changelanguage li {
    display: flex;
    align-items: center;
}
.naviMeta li::after {
    color: var(--ci400);
    content: '|';
}

.naviMeta a, 
.naviMeta strong {
    font-weight: bold;
    display: block;
    padding-left: 1rem;
    padding-right: 1rem;
    line-height: 3.5rem;
}

.naviMeta a {
    color: var(--ci400);

}

.naviMeta a:hover, 
.naviMeta strong {
    color: var(--ci100);

}

.naviMeta li:last-child::after {
    content: '';  
}

.mod_changelanguage li {
    padding-left: 1rem;
    padding-right: 1rem;
    height: 3.5rem;
}

.mod_changelanguage a.lang-en,
.mod_changelanguage strong.lang-en,
.mod_changelanguage a.lang-de,
.mod_changelanguage strong.lang-de {
    width: 30px;
    height: 20px;
    overflow: hidden;
    display: block;
    background-position: center center;
    background-repeat: no-repeat;
}


.mod_changelanguage a.lang-en,
.mod_changelanguage strong.lang-en {
    background-image: url("../icons/en.svg");
}
.mod_changelanguage a.lang-de,
.mod_changelanguage strong.lang-de {
        background-image: url("../icons/de.svg");
}





/* Haupt-Navigation */

:root {
	--naviMain-MainFontsize: var(--font_size05);
	--naviMain-MainLinkColor: var(--ci400);
	--naviMain-MainHoverColor: var(--ci110);
	--naviMain-MainActiveColor: var(--white100);
	--naviMain-MainBackgroundMainColor: var(--ci100);
	--naviMain-MainBackgroundHoverColor: var(--ci100);
	--naviMain-MainBackgroundActiveColor: var(--ci100);
	--naviMain-MainPaddingBlock: 2.25rem;
	--naviMain-MainPaddingInline: 1.5rem;
    --naviMain-ArrowSize1: -0.375em;
    --naviMain-ArrowSize2: 0.375em;

	--naviMain-SubFontsize: var(--font_size04);
	--naviMain-SubLinkColor: var(--ci400);
	--naviMain-SubHoverColor: var(--ci110);
	--naviMain-SubActiveColor: var(--ci200);
	--naviMain-SubBackgroundMainColor: var(--white060);
	--naviMain-SubBackgroundHoverColor: var(--ci106);
	--naviMain-SubBackgroundActiveColor: var(--white060);
	--naviMain-SubPaddingBlock: 1rem;
	--naviMain-SubPaddingInline: 1rem;

	--naviMain-SubMenuWidth: 20em;
}

.naviMain {
    position: relative;
    align-self: flex-end;
    z-index: 200;
}
.naviMain ul {
	position: relative;
}
.naviMain .level_1 {
	display: flex;
    text-transform: uppercase;
}
.naviMain li {
	position: relative;
	list-style: none;

}
.naviMain a, .naviMain strong {
	color: var(--naviMain-MainLinkColor);
    font-family: var(--font_semibold);
    font-weight: normal;
	font-size: var(--naviMain-MainFontsize);
	padding: var(--naviMain-MainPaddingBlock) var(--naviMain-MainPaddingInline);
	text-decoration: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
    hyphens: none;
}
.naviMain a.active, 
.naviMain strong.active,
.naviMain a.trail, 
.naviMain strong.trail {
    color: var(--naviMain-MainActiveColor);
    background-color: var(--naviMain-MainBackgroundMainColor);
    border: 0 solid transparent;
}
.naviMain .level_1 a.active, 
.naviMain .level_1 strong.active,
.naviMain .level_1 a.trail, 
.naviMain .level_1 strong.trail {
    border-radius: var(--radius_half) var(--radius_half) 0 0;
}
.naviMain .level_1 a:hover {
    color: var(--naviMain-MainHoverColor);
}
.naviMain .level_1 a.trail:hover {
    color: var(--naviMain-MainLinkColor);
}

.naviMain .level_2 {
	position: absolute;
	left: 0;
	width: var(--naviMain-SubMenuWidth);
	text-transform: none;
    border: 0px solid transparent;
    border-radius: 0 0 var(--radius_standard) var(--radius_standard);
    transform:scale(0);
    transition: all 0.5s, ease-in-out 0.2s;
    backdrop-filter: blur(15px);
    box-shadow: var(--black025) 0px 1px 6px;
}

.naviMain .level_2 li  {
	position: relative;
	width: 100%;
    border-bottom: 1px solid var(--ci500);
}

.naviMain .level_2 a {
    background: var(--naviMain-SubBackgroundMainColor);;
    color: var(--naviMain-MainLinkColor);
}


.naviMain .level_2 a:hover {
    background: var(--naviMain-SubBackgroundHoverColor);
    color: var(--naviMain-MainActiveColor);
}

.naviMain .level_2 a.active, 
.naviMain .level_2 strong.active,
.naviMain .level_2 a.trail, 
.naviMain .level_2 strong.trail {
    border-radius: 0;
}

.naviMain .level_2 li.last,
.naviMain .level_2 li.last a.active, 
.naviMain .level_2 li.last strong.active,
.naviMain .level_2 li.last a.trail, 
.naviMain .level_2 li.last strong.trail {
    border: 0px solid transparent;
    border-radius: 0 0 var(--radius_standard) var(--radius_standard);
}

.naviMain .level_2 a, .naviMain .level_2 strong {
    font-size: var(--naviMain-SubFontsize);
    padding: var(--naviMain-SubPaddingBlock) var(--naviMain-SubPaddingInline);
}

.naviMain .level_3 {
	/*display: none;*/
	width: var(--naviMain-SubMenuWidth);
	position: absolute;
	top: 0;
	left: var(--naviMain-SubMenuWidth);
    transform:scale(0);
    transition: all 0.5s, ease-in-out 0.2s;
}
.naviMain .level_1 li:hover .level_2, 
.naviMain .level_2 li:hover .level_3 {
    transform:scale(1);
    transition: all 0.5s, ease-in-out 0.2s;
}
.naviMain .level_1 li.last:hover .level_2 {
    left: auto;
    right: 0;
}

.naviMain a.submenu::after, .naviMain strong.submenu::after {
    width: 1rem;
    height: 1rem;
    margin-top: 0.25rem;
    margin-left: 0.25rem;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    content: '';
    background-image: url(../icons/nav-down_ci.svg);
}
.naviMain a.trail.submenu::after, .naviMain strong.trail.submenu::after, .naviMain strong.active.submenu::after {
    background-image: url(../icons/nav-down_ws.svg);

}   




/* Breadcrumb-Navigation */

#navipath {
    background: var(--gradient-grey-07);
    z-index: 10;
    padding: 1rem 0;
    margin-bottom: 0;
}


.mod_breadcrumb {
    padding: 0 2rem;
}


.mod_breadcrumb ul {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    margin:0 auto;
}

.mod_breadcrumb li {
    display: flex;
    align-items: center;
    padding: 0.25rem 0.5rem 0.25rem 0;
    font: var(--font_size04) var(--font_medium);
    font-weight: bolder;
    color: var(--col06);
}

.mod_breadcrumb li::after {
    padding-left:.5rem;
    content:'»';
}

.mod_breadcrumb li:last-child::after {
    content:'';
}

.mod_breadcrumb a {
    display: flex;
    color: var(--ci100);
}

.mod_breadcrumb a:hover {
    color: var(--ci110);
}

.mod_breadcrumb li:first-child span {
    width: 0px;
    height: 0px;
    overflow: hidden;
}
.mod_breadcrumb li:first-child a::after {
    display: block;
    content:'';
    background-image: url(../../theme/icons/home_noon.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 2rem;
    width: 2rem;
    height: 2rem;
}

/* Footer-Navigation */

footer a  {
    color: var(--white100);
}
footer a:hover {
    color: var(--ci100);
}
footer nav strong, footer a:active {
    color: var(--ci120);
    font-weight: normal;
    font-style: normal;
}

.naviFoot {
    font-family: var(--font_semibold);
    font-size: var(--font_size05);
}
.naviFoot li {
    padding-block: .75em;
    border-bottom: 1px solid var(--ci110);
  }
  .naviFoot li:last-child {
    border-bottom: none;
  }



/* Sitemap */
.mod_sitemap {
    padding: 1rem;
}
.mod_sitemap ul {
    padding-left: 2rem;
}
.mod_sitemap ul.level_1 a {
    font-family: var(--font_bold);
    font-size: var(--font_size06);
}
.mod_sitemap ul.level_2 a {
    font-family: var(--standard);
    font-size: var(--font_size04);
}
.mod_sitemap li {
    padding: 0.5rem 0;
}

/* MMenu */

.hamburger {
    display: none;
    align-self: center;
}



body.mm-wrapper--opened- #wrapper {
    width: 100%;
    height: 100vh;
    position: fixed;
    overflow: hidden;
    display: block;
    cursor: pointer;
}

.mm-menu--theme-light, .mm-menu--theme-light-contrast, .mm-menu--theme-dark, .mm-menu--theme-dark-contrast, .mm-menu--theme-white, .mm-menu--theme-white-contrast, .mm-menu--theme-black, .mm-menu--theme-black-contrast {
    --mm-color-background: var(--ci600);
    --mm-color-border: var(--gry200);
    --mm-color-icon: var(--ci400);
    --mm-color-text: var(--ci400);
    --mm-color-text-dimmed: rgb(0 0 0 / 0.4);
    --mm-color-background-highlight: var(--ci900);
    --mm-color-background-emphasis: var(--ci100);
    --mm-color-focusring: var(--ci300);
  }


.mm-panels, .mm-panel {
    background-color: var(--ci600);
}

.mm-listitem.trail a.mm-btn--next,
.mm-listitem.trail a.trail {
    background-color: var(--ci100);
    color: var(--white100);
}
.mm-listitem.trail.submenu.mm-listitem--opened .mm-listitem__btn::after {
    border-color: var(--white100);
}