#header {
	position: fixed;
		position: static;
	top:0;
	left:0;
	right:0;
	background-color: var(--color-white);
	border-bottom: 1px solid var(--color-black);
	z-index: 10;
	transition:none;
}
html.mainmenuopen #header {
	position: fixed;
}

.menufixed #header {
	position: fixed;
	transform:translateY(-100%);
}
.menuvisible #header {
	transition:transform 0.2s ease;
	transform:translateY(0%);
}

#header a {
	color:inherit;
	text-decoration: none;
}

.header-wrapper {
	margin:0 auto;
}

.header-toolbar {
	display: flex;
	max-width: 1920px;
	margin-left: auto;
	margin-right: auto;
}

@media (min-width:1922px) {    
	.header-toolbar {
	    border-right: 1px solid var(--color-black);
	    border-left: 1px solid var(--color-white);
	}
}


.header-logo {
	flex: 1 1 auto;
	border-right: 1px solid var(--color-black);
	padding:20px 28px;
	box-sizing: border-box;
}

.header-logo a {
	color: inherit;
	text-decoration: none;
	height: 100%;
	display: inline-block;
}

.header-logo img {
	width: auto;
	height: 100%;
	vertical-align: middle;
}


.header-loginlucid {
	border-right: 1px solid var(--color-black);

}

.header-loginlucid a {
	display: flex;
	height: 100%;
	justify-content: center;
	align-items: center;
	padding: 0 var(--default-padding-right);
	font-weight: 600;

	background:url(../Icons/Arrows/Desktop/Login_LUCID/ZSVR_UI_Desktop_Login_LUCID_Default.svg) right var(--default-padding-right)  center no-repeat;
	background-size: 24px auto;
	padding-right: 62px;

	white-space: nowrap;
}


@media (hover: hover) {
	.header-loginlucid a:hover {
		background:url(../Icons/Arrows/Desktop/Login_LUCID/ZSVR_UI_Desktop_Login_LUCID_Hover.svg) right var(--default-padding-right)  center no-repeat;
		background-size: 24px auto;
	}
}

.header-search {
	border-right: 1px solid var(--color-black);
}

.header-search a {
	display: flex;
	height: 100%;
	justify-content: center;
	align-items: center;
	padding: 0 var(--default-padding-right);
	font-weight: 600;

	background:url(../Icons/icon-search.svg) right var(--default-padding-right)  center no-repeat;
	background-size: 19px auto;
	padding-right: 59px;

	white-space: nowrap;
}

@media (hover: hover) {
	.header-search a:hover {
		background:url(../Icons/icon-search-active.svg) right var(--default-padding-right) center no-repeat;
		background-size: 18px auto;
	}
}

.header-langhelp {
	display: flex;
	flex-direction: column;
	border-right: 1px solid var(--color-black);

}

.header-langhelp-languagemenu {
	border-bottom: 1px solid var(--color-black);	
	flex:0 0 50%;
}

.header-langhelp-languagemenu ul {
	display: flex;
	list-style-type: none;
	margin:0;
	padding:0;
	height: 100%;
	min-width: 108px;
}

.header-langhelp-languagemenu ul li {
	display: flex;
	justify-content: center;
	align-items: center;
}

.header-langhelp-languagemenu ul li span span,
.header-langhelp-languagemenu ul li a span {
	display: flex;
	height: 100%;
	justify-content: center;
	align-items: center;
}

.header-langhelp-languagemenu ul li > a,
.header-langhelp-languagemenu ul li > span {
	display: block;
	padding: 0 16px;
	height: 100%;
	vertical-align: middle;
}

.header-langhelp-languagemenu ul li > a:hover,
.header-langhelp-languagemenu ul li.active > a {
	font-weight: 600;
}

.header-langhelp-languagemenu ul li:first-child {
	border-right: 1px solid var(--color-black);	
}

.header-langhelp-helplink {
	flex:0 0 50%;
}

.header-langhelp-helplink a {
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: 600;

	padding: 0 var(--default-padding-right);
	height: 100%;
}



.header-menuopener > a, .header-menuopener > button {
    display: flex;
    height: 100%;
    justify-content: center;
    align-items: center;
    padding: 0 var(--default-padding-right);
    font-weight: 600;
    cursor: pointer;
    pointer-events: all;
    white-space: nowrap;
    appearance: none;
    background: none;
    border: 0;
    font-size: inherit;
}

.header-menuopener > button span.closed,
.header-menuopener > a span.closed {
	background:url(../Icons/icon-menu.svg) right center no-repeat;
	background-size: 20px auto;
	padding-right: 30px;
}

@media (hover: hover) {
	.header-menuopener > button:hover span.closed,
	.header-menuopener > a:hover span.closed {
		background:url(../Icons/icon-menu-active.svg) right center no-repeat;
		background-size: 20px auto;
	}
}


html.mainmenuopen .header-menuopener > button span.closed,
html.mainmenuopen .header-menuopener > a span.closed {
	visibility: hidden;
}

html.mainmenuopen .header-menuopener > button,
html.mainmenuopen .header-menuopener > a {
	background:url(../Icons/icon-close.svg) center center no-repeat;
	background-size: 42px auto;
}

@media (hover: hover) {
	html.mainmenuopen .header-menuopener > button:hover,
	html.mainmenuopen .header-menuopener > a:hover {
		background:url(../Icons/icon-close-active.svg) center center no-repeat;
		background-size: 42px auto;
	}
}
.header-menu {
	position: absolute;
	left: 0;
	margin-top: 1px;
	right: 0;
	background-color: var(--color-white);
	height: 0;
	overflow-y: hidden;
	transition:height 0.5s ease;
}

@media (min-width:855px) {
	.header-menu-tools {
		display: none;
	}
}


html.mainmenuopen .header-menu {
	display: block;
	height:calc(100vh - var(--header-top-height));
	height:calc(100vh - var(--header-menu-height));
	transition:height 0.5s ease;
	border-bottom: 1px solid var(--color-black);
	overflow-y: auto;
}


.header-menu ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

/*.header-menu-menuarea > nav > ul {
	max-height: calc(100vh - var(--header-top-height) - var(--header-bottom-height));
	max-height: calc(100vh - var(--header-menu-height) - var(--header-bottom-height));
	overflow-y: auto;
}
*/
.header-menu-item {
	border-bottom: 1px solid var(--color-black);
	color:var(--color-black);
	padding-top:40px;
	padding-bottom: 48px;
	background-color: var(--color-white);
	transition: background-color 0.05s ease-out, color 0.05s ease-out, border-bottom 0.05s ease-out;
}

.header-menu-item:last-child {
	margin-bottom: 60px;
}

@media (hover: hover) {
	.header-menu-item:hover {
		background-color: var(--color-green1);
		color:var(--color-white);
		border-bottom: 1px solid var(--color-white);
		transition: background-color 0.05s ease-out, color 0.05s ease-out, border-bottom 0.05s ease-out;
	}
}

.menuitem-content {
	display: none;
}

.header-menu-item.open {
    background-color: var(--color-green1);
    color: var(--color-white);
    border-bottom: 1px solid var(--color-white);
    border-top: 1px solid var(--color-green1);
}

.header-menu-item + .header-menu-item.open {
    border-top: 1px solid #fff;
    margin-top: -1px;
}

*[data-cmd=open-menuitemcontent] {
    cursor: pointer;
    pointer-events: all;
    appearance: none;
    font-style: inherit;
    font-weight: inherit;
    font-size: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    border: 0;
    padding-left:0;
    text-align: left;
    color:inherit;
    background-color: transparent;
}

*[data-cmd=open-menuitemcontent] span {
    background: url(../Icons/icon-more.svg) right calc(50%) no-repeat;
    background-size: 42px auto;
    padding-right: 54px;
    padding-bottom: 4px;
}

@media (hover: hover) {
	*[data-cmd=open-menuitemcontent]:hover span {
		background:url(../Icons/icon-more-active.svg) right center no-repeat;
		background-size: 42px auto;
	}
}


@media (hover: hover) {
	.header-menu-item:hover *[data-cmd=open-menuitemcontent]  span{
		background:url(../Icons/icon-more-white.svg) right center no-repeat;
		background-size: 42px auto;
		color:var(--color-white);
	}

	.header-menu-item:hover *[data-cmd=open-menuitemcontent]:hover span {
		background:url(../Icons/icon-more-white-active.svg) right center no-repeat;
		background-size: 42px auto;
		color:var(--color-white);
	}
}


.header-menu-item.open *[data-cmd=open-menuitemcontent] span {
	background:url(../Icons/icon-less-white.svg) right center no-repeat;
	background-size: 42px auto;
	color:var(--color-white);
}


@media (hover: hover) {
	.header-menu-item.open *[data-cmd=open-menuitemcontent]:hover span {
		background:url(../Icons/icon-less-white-active.svg) right center no-repeat;
		background-size: 42px auto;
		color:var(--color-white);
	}
}

.menutem-title {
	margin-bottom: 20px;
}

.menuitem-content ul li {
	margin-bottom: 12px;
}

.menuitem-content a {
	position: relative;
	color:inherit;
	font-weight: 600;

 	text-decoration: none;
    background-image: linear-gradient(currentColor, currentColor);
    background-position: 0% 100%;
    background-repeat: no-repeat;
    background-size: 0% 1px;
    transition: background-size .15s;	
}


.menuitem-content a::after
{
  content: "";
/*  width: 18px;
  height: 18px;*/
  width: 1.125rem;
  height: 1.125rem;
  margin-left: 4px;
  background-image: url(../Icons/arrow-link-white.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  display: inline-block;
  font-weight: 600;
}


@media (hover: hover) {
	.menuitem-content a:hover {
		background-size: 100% 1px;
	}

	.menuitem-content a:hover::after
	{
	  background-image: url(../Icons/arrow-link-white-active.svg);
	}

}



@media (max-width:854px) {

	.header-logo img {
		height: 41px;
	}


	.header-toolbar > .header-loginlucid,
	.header-toolbar > .header-search,
	.header-toolbar > .header-langhelp {
		display: none;
	}

	.header-logo {
		border-right: none;
		padding: 20px 16px;
	}

	.header-menu-tools {
		display: flex;
		height: 96px;
		justify-content: flex-end;
		border-bottom: 1px solid var(--color-black);
	}

	.header-loginlucid a {
		padding-right: 44px;
	}

	.header-search a {
		padding-right: 41px;
	}

	.header-loginlucid {
		border-left: 1px solid var(--color-black);
	}


	.header-langhelp {
		border-right: none;
	}

	.header-menuopener > a span.closed {
		visibility: hidden;
	}

	.header-menuopener > a {
		background:url(../Icons/icon-menu.svg) right 16px center no-repeat;
		background-size: 30px auto;
	}

	@media (hover: hover) {
		.header-menuopener > a:hover {
			background:url(../Icons/icon-menu-active.svg) right 16px center no-repeat;
			background-size: 30px auto;
		}
	}
	html.mainmenuopen .header-menuopener > a {
		background:url(../Icons/icon-close.svg) right 16px center no-repeat;
		background-size: 28px auto;
	}

	@media (hover: hover) {
		html.mainmenuopen .header-menuopener > a:hover {
			background:url(../Icons/icon-close-active.svg) right 16px center no-repeat;
			background-size: 28px auto;
		}
	}

	*[data-cmd=open-menuitemcontent] {
		background-size: 28px auto;
		padding-right: 36px;
	}

	*[data-cmd=open-menuitemcontent]:hover,
	.header-menu-item:hover *[data-cmd=open-menuitemcontent],
	.header-menu-item:hover *[data-cmd=open-menuitemcontent]:hover,
	.header-menu-item.open *[data-cmd=open-menuitemcontent],
	.header-menu-item.open *[data-cmd=open-menuitemcontent]:hover {
		background-size: 28px auto;
	}

	.menuitem-content a::after {
	  width: 16px;
	  height: 16px;
	}
}