#menu_burger {
	line-height: 1;
	font-size: 150%;
	color: var(--head-text);
}
#menu_holder {
	display:flex;
/* 	align-self: center; */
	overflow:hidden;
	height:0px;
	width:0px;
	right:0px;
	position:absolute;
	margin-top:-1em;		/* Container overwrite */
	flex-direction:row;
	justify-content:flex-end;
	z-index:4;
	-webkit-transition: width 0.2s linear 0s;
	-o-transition: width 0.2s linear 0s;
	transition: width 0.2s linear 0s;
}
#menu_holder.active {
	height:auto;
	width:100%;
/* 	background-color:rgba(255, 255, 255, 0.8); */
}
#menu_holder.active aside.main_menu {
	margin:0px 0px 15px 0px;
	border-radius: 0px 0px 0px 6px;
	-moz-box-shadow: -4px 4px 15px #000000;
	-webkit-box-shadow: -4px 4px 15px #000000;
	box-shadow: -4px 4px 15px #000000;
}
aside.main_menu {
	position:relative;
	left:0px;
	top:0px;
	font-family: var(--panel-font);
	border-radius: 6px;
	background-color: var(--panel-back, "#016B45");
	display: table-cell;
	float: left;
	max-width: 500px;
	min-width: 322px;
	margin: 0px 2em 1em 0px;
	padding: 0px;
	-moz-box-shadow: 0px 4px 15px #dfdfdf;
	-webkit-box-shadow: 0px 4px 15px #dfdfdf;
	box-shadow: 0px 4px 15px #dfdfdf;
}

#user_logo {
	background-color: var(--panel-text);
	background-repeat: no-repeat;
	background-position:center;
	background-size:cover;
	margin: 1em auto 15px auto;
	width: 124px;
	height: 124px;
	border-radius: 50%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-direction:column;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-webkit-box-align: end;
	-ms-flex-align: end;
	align-items: flex-end;
}

#user_logo img.icon_tool {
	width:32px;
	height:32px;
	margin-right:-8px;
	margin-bottom:-8px;
}

#logo_editor {
	display:inline-block;
	min-width: 300px;
	max-width: 600px;
	margin:80px auto auto;
	color: var(--panel-text, "#ffffff");
	background-color: var(--panel-back-lt, "#016B45");
	border-radius: 6px;
	-moz-box-shadow: 0px 3px 8px 0px #333333;
	-webkit-box-shadow: 0px 3px 8px 0px #333333;
	box-shadow: 0px 3px 8px 0px #333333;
	line-height: 1.5;
	text-align: center;
	text-align-last: center;
}
#logo_editor >h4 {
	background-color:transparent;
	font-weight:bold;
	font-size:130%;
	margin: 0.5em;
}

.logo_box {
	display:flex;
	flex-direction:row;
	justify-content: space-around;
	margin:1em;
}
.logo_box >*:nth-of-type(odd) {
	margin-right:0.5em;
}
.logo_img {
	display:flex;
	align-items:center;
	justify-content:center;
	min-width:200px;
	min-height:200px;
	overflow:hidden;
	border:inset medium;
	background-color:var(--panel-back-md,'#005234');
	box-sizing: content-box;
}
.logo_pad {
	width:60px;
	text-align:left;
	text-align-last:left;
}

.chip_ctrl {
	width: 1.25em;
	height: 1.25em;
	margin: 0.25em;
	color: var(--body-text-lt);
	background-color: var(--body-back-dk);
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 0.75em;
	font-weight: bold;
	cursor:pointer;
}
.chip_ctrl::after {
	content:'\2715';
}
.chip_ctrl:hover {
	background-color: var(--body-back-alt);
}

.pad_btn {
	width: 48px;
	height: 48px;
	background: var(--bg-grad-v);
	border-radius: 24px;
	border: outset medium;
	display: inline-block;
	margin-bottom:0.5em;
	text-align-last:center;
}

.pad_btn:disabled,
.pad_btn:active {
	border: solid thin var(--body-gray-dk);
}
.pad_btn >img {
	width: 24px;
	filter: brightness(0.7);
}
.pad_btn:disabled >img,
.pad_btn:active >img {
	margin: 2px 0px 0px 2px;
	filter: opacity(0.7);
}

@media screen and (max-height:700px) {
	#logo_editor {
		margin-top:20px;
	}
}
@media screen and (max-width:500px) {
	#logo_editor {
		max-width: 300px;
	}
	.logo_box {
		flex-direction:column-reverse !important;
	}
	.logo_img {
	}
	.logo_box >*:nth-of-type(odd) {
		margin-right:0px;
	}
	.pad_zoom input[type="range"] {
		transform:none;
	}
	.logo_pad {
		width:100%;
		display:flex;
		flex-direction:row;
	}
	.pad_btn {
		margin-right:1em;
		text-align-last:center;
	}
}

.logo_title {
	color: var(--body-back);
	text-align: center;
/* 	text-transform:capitalize; */
	font-weight:500;
	font-size:120%;
	line-height:1.5;
	margin: 0px 0px 10px 0px;
}
.logo_name {
	color: var(--head-back-lt);
	text-align: center;
	margin: 0px 0px 10px 0px;
}
.navbar_list {
	margin: 3em 0px 0px 0px;
}
.navbar_list li {
	border-top: 1px solid var(--panel-back-md);
	display: block;
}
.navbar_sublist {
	display:none;
}
.show .navbar_sublist {
	display:block;
}
.navbar_sublist li {
	background-color:var(--panel-back-alt);
}
.navbar_sublist li div {
	background-color:var(--panel-back-dk);
}
.navbar_sublist li div:before {
	content: '\25CF';
	margin-right:1em;
	color: var(--body-back);
}
.navbar_sublist li a:before {
	content: '\25CF';
	color:transparent;
	margin-right:1em;
}
.navbar_sublist a,
.navbar_sublist div {
	text-transform: normal !important;
}
.navbar_list a,
.navbar_list div {
	color: var(--panel-text);
	display:list-item;
	padding: 0.5em 1.5em;
	font-weight: 400;
	font-size: 14px;
	line-height: 2.5;
	text-transform: uppercase;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}
.navbar_item:not(.sublist) div {
	background: var(--panel-back-md);
}
.navbar_item:last-of-type div,
.navbar_item:last-of-type a:hover {
	border-radius:0px 0px 6px 6px;
}
.navbar_item.sublist >div:after {
/* 	content:'\2304'; */
	content:url('data:image/svg+xml;utf8,<svg width="16" height="9" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.293 8.707a1 1 0 001.414 0l6.364-6.364A1 1 0 0013.657.93L8 6.586 2.343.929A1 1 0 00.93 2.343l6.364 6.364zM7 7v1h2V7H7z" fill="%23fff"/></svg>');
	float:right;
	line-height:2.5;
	-webkit-transition: transform 0.2s ease 0s;
	-o-transition: transform 0.2s ease 0s;
	transition: transform 0.2s ease 0s;
}
.navbar_item.sublist.show >div:after {
	transform: rotate(180deg);
}
.navbar_item a:hover,
.navbar_item.sublist:not(.show) >div:hover {
	background-color: var(--panel-back-md);
}
.navbar_sublist a:hover {
	background-color: var(--panel-back-sel);
}
#umode_sw {
	display:block;
	border:inset thin;
	background:var(--btn-bg-green-alt);
	height:1.8em;
	margin:1em auto;
	border-radius:0.3em;
	text-align:center;
	width:10em;
}
#umode_sw >div {
	display:inline-block;
	margin:0.25em 0.25em 0.25em -1.5em;
	line-height:1.5;
	color:var(--panel-back-md);
}
#umode_sw[data-state="1"] >div {
	margin:0.25em -1.5em 0.25em 0.25em;
}
#umode_sw >div {
	cursor:pointer;
	display:inline-block;
	border:outset medium;
	height:1.5em;
	width:1.5em;
	margin:0.15em 0.2em;
	border-radius:0.25em;
	color:var(--head-text);
	background: var(--btn-bg-alt);
	text-align:center;
	float:left;
	-webkit-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
}
#umode_sw[data-state="1"] >div {
	float:right;
}

/* Draggable panel support */
.floatbar {
	position:absolute;
	margin:unset;
}
.floatbar.drag {
	opacity:0.8;
	filter:alpha(opacity=80);
}
.floatbar .dragbar {
	background-color:var(--balloon-h-back,'#996600');
	color:var(--balloon-h-text,'#ffffff');
	cursor:grab;
	cursor:-webkit-grab;
	min-width:10em;
	padding:0.3em 0px;
	border-radius:4px 4px 0px 0px;
}
.floatbar.drag .dragbar {
	cursor:grabbing;
	cursor:-webkit-grabbing;
}
/* Draggable panel support END */
