.menubar {
	background: #66f linear-gradient(#55f, #88f, #55f);
	color: #fff;
	font-size: 15px;
	left: 0;
	margin: 0;
	padding: 0 5em;
	position: fixed;
	top: 0;
	width: calc(100% - 10em);
	z-index: 99;
}

.menubar * {
	margin: 0;
	padding: 0;
}

.dropmenu input[type='file'] {
	position: fixed;
	top: -100vh;
}

.dropmenu, .dropmenu ul {list-style: none;}

.dropmenu li {position: relative;}
.dropmenu li.disabled {
	opacity:0.33;
	pointer-events:none;
}
.dropmenu li span {
	float: right;
	font-weight: bold;
	margin-right: 0.25em;
}

.dropmenu a {
	color: #fff;
	cursor: pointer;
	display: block;
	padding: 0.25em 0.5em;
	text-decoration: none;
	user-select: none;
	white-space: nowrap;
}
.dropmenu a:hover {background-color: #006;}

.dropmenu a.sub::after {
	content: '›';
	float: right;
	font-weight: bold;
	margin-right: -0.25em;
}


.dropmenu .bull {padding-left: 1em;}
.dropmenu .bull.sel {
	display: list-item;
	list-style-position: inside;
	list-style-type: disclosure-closed;
	padding-left: 0;
}

/* Level 1 */
.dropmenu > li {
	display: inline-block;
	margin-left: -4px;
	text-shadow: 1px 1px 1px #000;
	vertical-align: top;
}
.dropmenu > li:first-child {margin-left: 0;}
.dropmenu > li:last-child {float: right;}
.dropmenu > li > a {padding-right: 1em;}


/* Level 2 */
.dropmenu li ul {
	background: #f8f8f8;
	border: 1px solid #999;
	display: none;
	position: absolute;
	text-align: left;
	z-index: 99;
}
.dropmenu li:hover > ul {display: block;}
.dropmenu li ul a {
	color: #666;
	min-width: 5em;
}
.dropmenu li ul a:hover {color: #fff;}

.dropmenu > li > ul {
	left: 0;
	top: 100%;
	text-shadow: none;
	width: auto;
}


/* Level 3 */
.dropmenu > li > ul > li > ul {
	left: 100%;
	top: 0;
}