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

::placeholder { color: red; }

html, body { height: 100%; margin: 0; }

a { text-decoration-line: none; }
a:link { color: black; }
a:visited { color: black; }

div, table, img {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}

area { cursor: pointer; }

select { padding: 5px; }

input[type='text'], input[type='password'] { padding: 5px; }

input[type='button'], button {
    line-height: 2.2em;
    padding: 0 0.75em;
    border: 1px solid #666;
    border-radius: 0.25em;
    background-image: linear-gradient(to bottom, #fff, #ccc );
    box-shadow: inset 0 0 0.1em #fff, 0.2em 0.2em 0.2em rgba( 0, 0, 0, 0.3 );
	cursor: pointer;
}
input[type='button']:hover, button:hover {
	border-color: #3c7fb1;
	background-image: linear-gradient(to bottom, #fff, #a9dbf6 );
}

input[type="file"] {
	position: absolute;
	width: 1px; height: 1px; padding: 0; margin: -1px; border: 0;
	overflow: hidden; clip: rect(0,0,0,0);
}

.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'; color: var(--tm-color); }

.dbgrid { text-align: center; border-collapse: collapse; }
.dbgrid tr { height: 36px; }
.dbgrid th { padding: 3px; font-weight: normal; }
.dbgrid td { padding: 3px; }
.dbgrid thead { font-size: 0.9em; }
.dbgrid thead th, .dbgrid thead i { cursor: pointer; }

.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; }

.helpline {
	position: fixed; left: 0; bottom: 0; right: 0; min-height: 28px;
	background: black; color: #d0d0d0; border-top: thin solid gray;
	text-align: center; padding: 15px;
}
.helpline span { cursor: pointer; }

.fullscreen-ifr {
	position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: hidden;
}
.fullscreen-ifr	iframe { width: 100%; height: 100%; }

.label-button label {
    display: inline-block;
    line-height: 2.1em;
    padding: 0 0.62em;
    border: 1px solid #666;
    border-radius: 0.25em;
    background-image: linear-gradient(to bottom, #fff, #ccc );
    box-shadow: inset 0 0 0.1em #fff, 0.2em 0.2em 0.2em rgba( 0, 0, 0, 0.3 );
    font-family: arial, sans-serif;
    font-size: 0.9em;
	cursor: pointer;
}
.label-button label:hover {
	border-color: #3c7fb1;
	background-image: linear-gradient(to bottom, #fff, #a9dbf6 );
}
.label-button label:focus { padding: 0  0.56em 0 0.68em; }

.li-menu { margin: 4px 8px 4px 8px; }
.li-menu li { padding-right: 10px; display: inline-block; list-style: none; cursor: pointer; }

.li-selo-menu { list-style: none; padding-left: 5px; }
.li-selo-menu li { margin: 10px; }

.msg-line {
	background: linear-gradient(to bottom, #409fff, #0064c8);
	border-top: thin solid #cce6ff;
	padding: 10px; color: white; text-align: center;
}

.no-display { display: none; }

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

.popup-board {
	position: absolute; display: none;
	border: thin solid #c0c0c0; background: white; color: black; font-size: 0.9em; 
}
.popup-board > table { width: 100%; background: #555555; color: white; }
.popup-board th { padding: 5px; text-align: right; }
.popup-board td { padding: 5px; }
.popup-board > section { padding: 10px; }

.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; }	

.pos-center { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

.span-menu { background: #008080; white-space: nowrap; height: 36px; }
.span-menu span { cursor: pointer; margin-right: 10px; }
.span-menu span:hover { color: var(--tm-ho-color); }

.selected { background: #ffe6e6; }

.td-button {  width: 100%; height: 100%; }
.td-button td {
	font-size: 1.2em;
	text-align: center;
	background-color: #dddddd;
	border: 2px solid #cecece;
	border-bottom-color: gray;
	border-right-color: gray;
	border-radius: .5em;
}

.top_btn {
	position: fixed; bottom: 20px; right: 20px;
	width: 50px; height: 50px;
	border: 2px solid #333; color:#333;
	font-size: 15px;
	background: rgba(255,255,255,0.5);
	display: none;
    z-index: 100;
}
.top_btn:hover { border-color: #3059c7; background: #3059c7; color: #fff }