#navigation{text-align:right;}
#menuhead { display:none; }

nav#menu {
    display: flex;
    align-items: center;
}
nav.uk-navbar-container.uk-container.ds-main-header.parent.uk-navbar {
    display: flex;
    justify-content: space-between;
}

ul#nav a {
	display:block;
	font-size:1.2rem;
	line-height: 1.25em;
	color: hsl(var(--color-link));
	margin:0;
	padding:5px 15px;
}
ul#nav a:hover, ul#nav .current-page-ancestor>a, ul#nav .current-menu-ancestor>a, ul#nav .current_page_item>a{color: hsl(var(--color-link-hover));}

ul#nav {
	position: relative;
/*	width:100%;*/
	list-style: none;
	margin: 0;
	padding: 0;
}
ul#nav ul{text-align: left;}
ul#nav li {
	display:inline-block;
	min-height: 1px;
	list-style: none;
	margin: 0;
	padding: 0;
}

ul#nav li:hover {
	position: relative;
	z-index:auto;
	cursor: default;
}
ul#nav li::before { position:absolute; content: ""; display:none;}
ul#nav ul {
	position: absolute;
	max-height:0;
	overflow:hidden;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;

	top: 100%;
	/*left: 0;*/
	z-index:155;
	background:#fff;
	padding:0;
	margin:0 0 0 0;

}
ul#nav ul a {
	display:block;
	white-space:nowrap;
}
ul#nav ul li { display:block; float: none; padding:0; }
ul#nav ul li a{
	margin:0;
	padding:6px 15px;
}
ul#nav ul ul {
	top: -10px;
	left: 99%;
	min-width:150px;
}
ul#nav li:hover > ul/*, ul#nav li:focus-within > ul */{
	padding:10px 0;
	max-height:800px;
	overflow:visible;
}

@media (max-width: 960px){
	.uk-navbar-left {
	    position: absolute;
	    left: 30px;
	    top: 10px;
	}
	nav.uk-navbar-container.uk-container.ds-main-header.parent.uk-navbar {
		display: block;
		padding: 0;
	}
	#menuhead {
		position:absolute;
		top:25px;
		right: 30px;
		width: 30px;
		background: none;
		/*outline: none;*/
		display:block;
		cursor:pointer;
		min-height:30px;
		font-size: 0;
		text-indent: -9999px;
		z-index: 5;
		border: none;
	}
	#menuhead span, #menuhead span:before, #menuhead span:after{
		content:' '; display:block; width:30px; height:4px; background-color:#FF4D00; position:absolute;
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-ms-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
		-webkit-transform-origin:center;
		transform-origin:center;}
	#menuhead span{top:13px; right:0;}
	#menuhead span:before{top:-10px; right:0;}
	#menuhead span:after{bottom:-10px; right:0;}
	#menuhead:hover span:before{top:-12px;}
	#menuhead:hover span:after{bottom:-12px;}
	#menuhead[aria-expanded="true"] span{ height:0;}
	#menuhead[aria-expanded="true"] span:before {-webkit-transform:rotate(45deg); transform:rotate(45deg); top:-2px;}
	#menuhead[aria-expanded="true"] span:after {-webkit-transform:rotate(-45deg); transform:rotate(-45deg); bottom:-2px;}

	#navigation {
        position: relative;
        width: 100vw;
        background-color: #fff;
        height: auto;
        top: 70px;
        right: 0;
        padding: 0;
    }

	#navigation {max-height: 0; overflow: hidden;
		-webkit-transition: all 0.8s cubic-bezier(0,1,0,1);
		-moz-transition: all 0.8s cubic-bezier(0,1,0,1);
		-ms-transition: all 0.8s cubic-bezier(0,1,0,1);
		-o-transition: all 0.8s cubic-bezier(0,1,0,1);
		transition: all 0.8s cubic-bezier(0,1,0,1);
		}
	.HoJS:hover #navigation, #navigation.act {
		max-height: 1500px;
		-webkit-transition: all 0.8s cubic-bezier(1,0,1,0);
		-moz-transition: all 0.8s cubic-bezier(1,0,1,0);
		-ms-transition: all 0.8s cubic-bezier(1,0,1,0);
		-o-transition: all 0.8s cubic-bezier(1,0,1,0);
		transition: all 0.8s cubic-bezier(1,0,1,0);
		}


	ul#nav {
		position:relative;
		float:none;
		width:auto;
		height:auto;
		padding:2em;
	}
	ul#nav li {display:block; border-top:1px solid #CCC; padding:0;}
	ul#nav>li:first-child {border:none;}
	ul#nav a {
		display:block;
		font-weight:normal;
		padding:7px 20px;
		text-align:left;
		border-bottom:none;
	}

	ul#nav ul a {white-space: normal;}
	ul#nav li a{
		padding:7px 0;
		margin:0;
	}
	ul#nav li.act > a, ul#nav li:hover > a{border-bottom:none;}
	ul#nav ul li {}
	ul#nav ul li a{ padding:7px 0 7px 20px; }
	ul#nav ul ul li {padding-right:20px; }
	ul#nav ul ul li a{padding:7px 0 7px 40px;}
	ul#nav ul ul ul li a{padding:7px 0 7px 60px;}

	ul#nav, ul#nav li, ul#nav ul li{position: relative;}
	ul#nav li:hover > ul, ul#nav li.current-page-ancestor > ul, ul#nav li.current-menu-parent > ul, ul#nav li.current-menu-item > ul {display:block; max-height:1000px; overflow: visible; padding:0;}

	ul#nav ul {
		/*display:none;*/
		
		visibility: visible;
		position: relative;
		width:100%;
		background:none;
		padding:0;
		left:0;
	}
	ul#nav ul ul {
		top: auto;
		left: auto;
		min-width:0;
	}
}