
:root {
	--bg-color: #005555;
	--bo-color: #e4e4e4;
	--tm-color: #AABBFF;
	--tm-ho-color: #99FFFF;
}

a { text-decoration-line: none; }

html, body { margin: 0; padding: 0; background: ghostwhite; }

select, input { padding: 3px; }
input[type="number"] { width: 32px; }

.bbb-font-32 { font-size: 3.2em; }
.bbb-font-28 { font-size: 2.8em; }
.bbb-font-24 { font-size: 2.4em; }
.bbb-font-20 { font-size: 2.0em; }
.bbb-font-18 { font-size: 1.8em; }
.bbb-font-16 { font-size: 1.6em; }
.bbb-font-14 { font-size: 1.4em; }
.bbb-font-12 { font-size: 1.2em; }
.bbb-font-* { font-family: 'Blippo Blk BT'; }

.dtree { font-family: sans-serif; white-space: nowrap; margin: 1em; }
.dtree img { border: 0px; vertical-align: middle; }
.dtree a { text-decoration: none; cursor: pointer; }
.dtree a.node, .dtree a.nodeSel { white-space: nowrap; padding: 1px 2px 1px 2px; }
.dtree a.nodeSel { color: #FFC0C0; }
.dtree .clip { overflow: hidden; }
.dtree .title { white-space: nowrap; font-weight: bold; border-bottom: thin solid #c0c0c0; }

.li-menu { margin: 4px 8px 4px 8px; }
.li-menu li { padding-right: 10px; display: inline-block; list-style: none; cursor: pointer; }
.li-menu li:hover { color: #eaeaff; }
.li-menu li a { color: white; }

.page-top-bg {
	display: flex;
	height: 60px;
	background: linear-gradient(to bottom, #004488, #409fff);
	border-bottom: 3px solid #88ca00;
	color: #eaf4ff;
}
.page-top-bg a { color: #eaf4ff; font-weight: bold; }

.popup-menu {
	position: absolute;
	border: thin solid white;
	padding: 2px;
	background: #c0c0c0;
	color: black;
	display: none;
	z-index: 999;
}
.popup-menu ul { margin: 0; padding: 3px; list-style: none; }
.popup-menu li { margin-bottom: 3px; padding: 5px 10px 5px; background: #f4f4f4; cursor: pointer; }
.popup-menu li:hover { background: white; }	

/*
.span-menu span { cursor: pointer; }
.span-menu span:hover { color: var(--tm-ho-color); }
*/

.TAB-menu ul { border-bottom: 1px solid gray; margin: 5px;}
.TAB-menu li {
	padding: 8px; width: 100px; text-align: center;
	display: inline-block; list-style: none; cursor: pointer;
	border-left: thin solid gray; border-top: thin solid gray; border-radius: 8px 0 0 0;
}
