/* Set some sane CSS defaults */
*		{ box-sizing:border-box; margin:0; padding:0 }

body.full	{ width:100%; height:100% }
.save		{
		background-color:#000;
		color:#fff;
		border:1px solid #f00;
		position:absolute;
		}
.frame		{ border-style:dashed; border-width:0 0 1px 0 }
.bg-blk		{ color:#fff; background-color:#000 }
.bg-gr1		{ color:#fff; background-color:#444  }
.red		{ color:#f00 }
.border		{ border:1px solid #000 }
.minwidth	{ min-width:1px; width:1px }
.maxwidth	{ min-width:auto; width:100% }

.nw		{ white-space:nowrap }
.debug		{ border:30px solid #f00 }
.m		{ max-width:100%; border:1px solid #00f; padding:10px }
.f		{ width:100% }
.l		{ text-align:left }
.r		{ text-align:right }
.c		{ text-align:center }

.stick		{ position: sticky; top:0px }

.editable	{ padding:1px; margin:1px; border:1px solid #00f }
.editable:hover	{ padding:1px; margin:1px; border:1px solid #f00 }

.edited		{ background-color:#fcc; }

div.bot		{ position:fixed; clear:both; bottom:0; right:0; left:0; z-index:99 }
div.dummy	{ clear:both; opacity:0; z-index:-99 }

div.hi * div	{ padding:0.2em; color:#000; font-family:arial, sans-serif }
div.hi * span	{ font-weight:bold }
div.hi * span:after	{ content:": " }
div.inf		{ background-color:#8f8; border:4px solid #0f0 }
div.warn	{ background-color:#ff8; border:4px solid #ee0 }
div.err		{ background-color:#f88; border:4px solid #00f }

div.bk		{ background-color:#000; color:#fff }
div.bk *	{ background-color:#000; color:#fff }
div.bk a:hover	{ color:#f44 }

div.wh		{ background-color:#fff; color:#000 }
div.wh *	{ background-color:#fff; color:#000 }
div.wh a:hover	{ color:#e00 }

div.be		{ background-color:#f5f5dc; color:#000 }
div.be *	{ background-color:#f5f5dc; color:#000 }
div.be a:hover	{ color:#f00 }

table		{ border:0; border-collapse:collapse }
th		{ padding:2px }
th:hover	{ filter:invert(100%) }
tr:hover	{ filter:invert(100%) }
tr.r0		{ background-color:#fff }
tr.r1		{ background-color:#ddd }
tr.rm		{ background-color:#ccf }
tr.re		{ background-color:#fcc }
pre.rm		{ background-color:#ccf }
.rm td		{ border:0 }
td		{ border:1px solid #000; padding:3px }
td.nb		{ border:0 }

.fl		{ float:left }
.fr		{ float:right }
.fe		{ clear:both }
.pad3		{ padding:3px }

ul		{ padding-left:1em }
.nav		{ display:flex; align-items:center; justify-content:space-between; background-color:#333 }
.nav *		{ display:flex; align-items:center; color:#fff; height:100% }
.nav>div	{ height:39px }
.nav ul		{ list-style-type:none; margin:0; padding:0; height:100% }
.nav li		{ margin:0; padding:0; align-items:center; height:100% }
.nav li a	{ text-decoration:none; border:1px solid red; height:100% }
.nav li a:hover	{ background-color:#08f }
.act		{ background-color:#4A5 }

iframe			{ border:0 }
div.tabs		{ white-space:nowrap; width:100%; height:2em;  overflow:hidden; overflow-x:scroll }
.tabs button:hover	{ background-color:#08f; color:white }
div.tiles		{ white-space:nowrap; width:100%; height:47vh; overflow:hidden; margin-bottom:-2em }
div.tiles *		{ display:inline-block; height:calc(100% - 2em) }
div.tiles iframe.one	{ width:100% }
div.tiles iframe.two	{ width:calc(50% - 3px) }
div.tiles > div		{ padding:2px; width:6px; vertical-align:top }
//div.tiles > div:hover 	{ padding:0px; border:2px dashed black }
div.tiles > div div	{ margin-left:1px; width:1px; background:linear-gradient(yellow, blue, yellow) }

.navbg		{ background-color:#000; color:#fff; height:38px }
.down		{ vertical-align:bottom }
.mark		{ border:1px solid #f00 }

.dd		{ position:relative; display:inline-block; min-height:12px }
.dd .ddd	{ position:absolute; display:none; min-width:40px; box-shadow:5px 5px 5px rgba(0,0,0,0.5); z-index:1;
		  padding:2px 10px; white-space:nowrap }
.ddd a		{ text-decoration:none }
.dd:hover .ddd	{ display:block }
.dd:hover	{ background-color:#08f }
.ddd a:hover	{ background-color:#fff }

input:focus	{ background-color:#fff !important; color:#000 !important }

.tt:hover .ttt	{ visibility:visible }
.ttt		{ visibility:hidden;
		  position:fixed;
		  z-index:-1;
		  background:yellow;
		  color:black;
		  bottom:0;
		  right:0;
		}
.flex		{
		display:flex;
		flex-direction:row;
		flex-grow:0;
		align-items:baseline;
		}
.max		{ flex-grow:1 }

.ml8		{ margin-left:8px }
.mr8		{ margin-right:8px }