/*
	CLI 2.0 Stylesheet  	Now dynamic to support changing colours in the configuration. 
*/

a, a:visited, .linky {
	color:#FFF;
	cursor:pointer;
	font-weight:bold;
	text-decoration:none;
	
}
a:hover, span.linky:hover, td.linky:hover {
	background-color:#FFF;
	color:#000;
	
} /* you poor IE-using bastards */
	
body {
	background-color:#000;
	font-family:"Glass TTY VT220",Courier,monospace;
	margin:0 2;
	overflow:hidden;
	padding:0;
}
	
code, p, span, td, th {
	font-size:1em;
}

#cursor {
	font-weight:normal;
	background-color:#00FFFF;
	color:#000;
	/* 
	text-decoration:underline; 
	*/
}

div, table {
	margin-bottom:1em;
	margin-top:0em;
}


div#bottomline {
	margin: 0px;
	margin-left:2px;
}

div.browser {
	margin:5px 2px;
	outline:2px solid gray;
	
}

div#credit a {
	font-size:xx-small;
	text-decoration:underline;
}

div#credit:hover {
	opacity:.75;
}

div#credit {
	position:absolute;
	bottom:0;
	color:#FFF;
	font-size:xx-small;
	opacity:.25;
}

div#desktop {
	height:99%;
	margin:2px;
	padding:0;
}

div#ebarA { position: absolute; left: 5px;   background: #dda027; width: 50px; height: 10px; border-radius: 10px; margin: 2px; bottom: 60px; }
div#ebarB { position: absolute; left: 60px;  background: #be2026; width: 50px; height: 10px; border-radius: 10px; margin: 2px; bottom: 60px; }
div#ebarC { position: absolute; left: 115px; background: #dc4627; width: 50px; height: 10px; border-radius: 10px; margin: 2px; bottom: 60px; }
div#ebarD { position: absolute; left: 170px; background: #dc4627; width: 50px; height: 10px; border-radius: 10px; margin: 2px; bottom: 60px; }
div#ebarE { position: absolute; left: 225px; background: #dda027; width: 50px; height: 10px; border-radius: 10px; margin: 2px; bottom: 60px; }
div#ebarF { position: absolute; left: 5px;   background: #be2026; width: 50px; height: 10px; border-radius: 10px; margin: 2px;    top: 112px; } 
div#elogo {
	bottom: 5px;
	right: 5px;
	position: absolute;
	color: #00FFFF;
	border: 12px #a1a1a1;
	border-style: double;
	padding: 10px 10px;
	background: #000000;
	width: 265px;
	height: 150px;
	border-radius: 20px;
	border-color: #00FFFF #00FFFF;
	cursor: move;
}

div#eol {
	font-size: 5em;
	color: #dda027;
	text-align: center;
	position: absolute;
	top: 40%;
	width: 100%;
	display: none
}

div#indicators {
	bottom:0px;
	bottom:2px;
	left:2px;
	margin:0;
	padding:0;
	position:absolute;
	text-align:center;
}

div#indicators span {
	background-color:#FFF;
	color:#000;
	display:none;
}

div#jlogo {
	position: absolute;
	left: 130px;
	right: 8px;
	bottom: 5px;
	font-size:2.5em;
	margin: 0px;
	padding:2px;
	border-radius: 10px;
	border: 2px;
	border-style: solid;
}

div#laserAperture {
	bottom: 2px;
	top: 20px;
	right: 2px;
	left: 2px;
	margin: 0px;
	border: 2px;
	border-style: ridge;
	border-color: #00ffff;
	background-color: #dda027;
	text-align: center;
	color: #000000;
	position: absolute;
}

div#laserTitle {
	border: 3px;
	border-color: #00ffff;
	border-style: ridge;
	display: inline ;
	height: 19px;
	top: 0px ;
	left: 0px ;
	right: 0px;
	position: absolute;
	margin: 0px;
	padding: 0px;
	color:#000000;
}

div#laserWin {
	width:235px;
	height:100px;
	top:40%;
	left:45%;
	position: absolute;
	/*
	max-height:502px;
	max-width:642;
	*/
	background-color:#00FFFF;
	color:#000000;
	text-align: center;
	display: none
}

div#apertureNo  { position: absolute; bottom: 0px; right: 50px; color: #000000; cursor: pointer }
div#apertureYes { position: absolute; bottom: 0px;  left: 50px; color: #000000; cursor: pointer }

div#mapClose {
	position: absolute;
	top: 3px;
	right:3px;
	bottom: 5px;
	width:9px;
	border: 2px;
	border-style: ridge;
	border-radius: 2px;
	border-color: #00ffff;
	margin:0px;
	color: #000000;
	cursor: pointer;
	padding:0px ;
	text-align: center;
}

div#map {
	position: absolute;
	top: 20px;
	left: 2px;
	right: 2px;
	bottom: -14px;
}

div#mapTitle {
	border: 3px;
	border-color: #00ffff;
	border-style: ridge;
	display: inline ;
	height: 19px;
	top: 0px ;
	left: 0px ;
	right: 0px;
	position: absolute;
	margin: 0px;
	padding: 0px;
	color:#000000;
}

div#pagealert {
	background-color:#FFF;
	bottom:0px;
	bottom:2px;
	color:#000;
	left:2px;
	margin:0;
	padding:0;
	position:absolute;
	text-align:center;
	visibility:hidden;
	width:auto;
}

div#screen li {
	list-style:none;
}

div#screen p, div#screen span, div#screen a {
	white-space:pre-wrap;
}

div#screen p.error {
	color:red;
}

div#screen {
	right: 2px;
	/* width:99%; */
	/* height:90%; */
	bottom:2px;
	top:20px;
	left:2px;
	position:absolute;
	margin:0px;
	overflow-x:hidden;
	overflow-y:scroll;
	padding:0;
	/* max-height:480px ; */
	/* max-width:640px; */
	background-color:#000000;
	text-align:left;
}

div#systemmap {
	width:50%;
	height:60%;
	top:5%;
	left: 5%;
	position: absolute;
	/* max-height:502px; */
	/* max-width:642px; */
	background-color:#00FFFF;
	color:#000000;
	text-align: center;
	display: none;
	margin: 0px;
}

div#titleBar {
	border: 3px;
	border-color: #00ffff;
	border-style: ridge;
	display: inline ;
	height 19px;
	top: 0px ;
	left: 0px ;
	right: 0px;
	position: absolute;
	margin: 0px;
	padding: 0px;
	color:#000000;
	min-height: 19px;
	cursor: move;
}

div#welcome {
	display:none;
}

div#window {
	width:48%;
	height:50%;
	top:10%;
	left:15%;
	position: absolute;
	/* max-height:502px; */
	/* max-width:642; */
	background-color:#00FFFF;
	color:#000000;
	text-align: center;
}

@font-face {
	font-family: "Glass TTY VT220";
	src: url(Glass_TTY_VT220.ttf);
	
}

h1, h2 {
	background-color:#00FFFF;
	color:#000;
}

h3 {
	color:#FFF;
	text-decoration:underline;
	margin:5px 0;
	
}

h4, h5, h6 {
	text-decoration:none;
	margin:0;
}

h3, h4, h2, p, div#display, ul {
	margin: 0px;
	margin-left:1px;
	
}

html, body {
	height:99%;
}

/* https://github.com/arscan/encom-boardroom/blob/master/css/light-table-styles.css */
#keyboard {
	position: absolute;
	bottom: 15px;
	left: 30%;
	width: 470px;
	height: 231px;
	border: 4px;
	border-style: double;
	border-radius: 10px;
	border-color: #00FFFF;
	max-width: 470px;
	max-height: 231px;
	cursor: move;
}
	
#lt-keyboard div{
	background-color: rgba(255,255,255,0);
	border-radius: 5px;
	border-style: solid;
	border: 4px;
	bottom: 5px;
	left: 40px;
	float: left;
	width: 35px;
	text-align:center;
	padding-top: 10px;
	margin-top: 5px;
	height: 20px;
	font-size: 12px;
	text-transform: uppercase;
	color: #00eeee;
	cursor: pointer;
	z-index: 20;
}

#lt-keyboard #k-16{
	clear: both;
	margin-left:5px;
}

#lt-keyboard #k-32 {
	clear: both;
	width: 300px;
	height: 5px;
	border: 1px solid #00eeee;
	border-radius: 3px;
	margin-top: 10px;
	margin-left: 80px;
}

#lt-keyboard #k-500{
	clear: both;
	margin-left:20px;
}

#lt-keyboard #k-9{
	clear: both;
	margin-left:10px;
}

pre, td, p {
	background-color:transparent;
}

pre, td, th, p, div {
	color:#00FFFF;
	font-family:"Glass TTY VT220",Courier,monospace;
	font-size:1em;
}

#spinner {
	margin-left:1em;
	padding:0;
	display:none;
	font-weight:bold;
	line-height:0px;
}

.ui-resizable-handle {
	width: 10px;
	height: 10px;
	background: #757575;
	position: absolute;
}

.ui-resizable-se {
	bottom: -16px;
	right: 0px;
	cursor: se-resize;
}

.ui-resizable-sw {
	bottom: -16px;
	left: 0px;
	cursor: sw-resize;
}

/* Let's get this party started */
::-webkit-scrollbar {
	width: 12px;
	border: 1px;
	border-color: #00ffff;
}

/* Handle */
::-webkit-scrollbar-thumb {
	background: #00ffff;
}

/* Track */
::-webkit-scrollbar-track {
	background-color: #000000;
	border-color: #00ffff;
	border: 1px;
	border-style: solid;
}

