@font-face {
	font-family: 'UC';
	src: url('uc.eot?#iefix') format('embedded-opentype'), 
	     url('uc.ttf')  format('truetype'),
	     url('fonts/uc.svg#uc') format('svg');
}
*{
	margin:		0px;
	padding:	0px;
	
}
body{
	text-align:center;
	background-color: #000;
	font: normal 20px Tahoma;
	color: #333;
	word-wrap: word-break;
}
#wrapper{	
	background-color:white;
	border-left-color:white;
	border-left-width:1px;
	border-left-style:solid;
	width: 800px;
	margin: 0px auto;
	text-align:left;
}
nav {
  background: #000;
  border: 0px solid gray;
  text-align: center;
}
nav li {
	display: inline-block;
	list-style: none;
	padding: 5px;
	font: normal 10px Tahoma;
	width: 70px;
	color: #00ff00;
}
nav li a {
	color: #00ff00;
}
.title{
	font: normal 70px UC;
	color: #000;
	border-left:solid 30px #0F0;
	border-bottom:solid thick #0F0;
}
.subtitle{
	font: normal 35px UC;
	color: #000;
	border-left:solid 20px #000;
	border-bottom:solid medium #000;
	margin:1px;
	margin-top:10px;
	margin-bottom:10px;
}
.subsubtitle{
	font: normal 25px UC;
	color: #000;
	margin-left:20px;
	border-left:solid 10px #0F0;
	border-bottom:solid thin #0F0;
}

.contents{
	margin-left:21px;
	margin-right:10px;
	margin-bottom:20px;
}

.subcontents{
	margin-left:31px;
	margin-bottom:20px;
}

.host{
	margin:21px;
	display:inline-block;
	cursor:pointer;
	border-style:solid;
	width:200px;
	box-shadow: 3px 3px;
}

.miniscreenshot{
	float:right;
	border-bottom-style:solid;
	border-left-style:solid;
}

.button{
	color: #333333;
	padding: 2px 6px 2px 6px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #333333;
	border-bottom: 1px solid #333333;
	border-left: 1px solid #CCCCCC;
	cursor: pointer;
}

/* CONTROL*/
#basicinfo{
	width:100%;
	text-align: center;
}

.basicinfoitem{
	border:1px thin;
	background-color:#eee;
	color:#000;
	display:inline-block;
	margin-bottom:5px;
	box-shadow: 1px 1px 0px #cccccc;
	padding:1px;
	border-radius: 3px;
}

.basicinfoite span{
	max-width:20px;
}

#shell{
	display:inline-block;
}

.titlebar{
	background-color:#0f0;
	
}

#monitor{
	overflow:auto;
	background-color:#000;
	color:#ccc;
	border:1px thin #000;
	width:430px;
	height:300px;
	font-size:8px;
	word-wrap: break-word;
	padding:1px;
}

#command{
	color:#fff;
	font-size:1em;
	background: #000 url(image_prompt.png) no-repeat 4px 4px; 
    border-bottom-right-radius: 30px;
	border:0px solid #000;
    outline:0px;
    height: 30px;
    width: 392px;
    padding-left: 20px;
    padding-right: 20px;
}

#screen{
	width:330px;
	height:250px;
	display:inline-block;
	float:right;
}

#lastscreencaptcha{
	border-style:none;
    width:330px;
    height: auto;
}

#screen button{
	width:100%;
	height:50px;
	border-radius: 30px;
	outline:0;
}

#jobhistory table{
	table-layout:fixed;	
}

#jobhistory tr:nth-child(odd){
	background:#cfc;
}

#jobhistory tr:nth-child(even){
	background:#eee;
}

#jobhistory th{
	background-color:#333;
	color:#fff;
	text-align:center;
	font-size:10px;
}

#jobhistory .result{
	width:680px;
	word-wrap: break-word;
	resize: both;
	height:100px;
	overflow:auto;
	background-color:#eee;
	font-size: 12px;
	
}

.jobcommand{
	word-wrap: break-word;
	resize: both;
	overflow:auto;
	background-color:#eee;
}

.generated::after{
	content: "NOT SENT";
	color:#000;
}

.sent::after{
	content: "SENT";
	color:#070;
}

.done::after{
	content: "DONE";
	color:#0e0;
}

#setjoblv0{
	display:none;
}

#setjoblv1{
	display:none;
}

#setjoblv2{
	display:none;
}

#setjoblv3{
	display:none;
}


.jobcategory{
	display:inline-block;
	border: 1px solid #000;
	min-width: 140px;
	padding:2px;
	cursor:pointer;
}

.job{
	display:block;
	border: 1px solid #000;
	cursor:pointer;
}
.job:hover{
	background-color:#cfc;
}

.jobtitle{
	background-color:#000;
	color:#fff;
}

#parameter{
	outline:0px;
	width:100%;
	font-size:1.2em;	
}

#setjoblv3 button{
	width:100%;
	height:50px;
	border-radius: 30px;
	outline:0;
	font-size:1.2em;
}

/* JOB */
.header{
	background-color:#000;
	color:#fff;
}

.rowheader{
	background-color:#333;
	color:#fff;
}

.childrow{
	background-color:#eee;
	color:#000;
}

a:link, a:visited{
	color:#00cc00;
}

small{
	font: normal 10px Tahoma;
}

ol li{
	margin-left:21px;
}

ul li{
	margin-left:21px;
}

dt {
	text-indent: -1em;
	font-weight: bold;
}
dd {
	padding-left: 30px;
	text-indent: -1em;
	margin-bottom:10px;
}

ul.dl li{
	font-weight:bold;
	margin-top:10px;
}

ul:not(.dl) li{
	margin-left:40px;
	font-weight:normal;
}

ul#news li{
	list-style:none;
	margin-left:20px;
	margin-top:8px;
}

span.date{
	font-family:'Lucida Console', monospace;
}

#bottom_footer{
	font: normal 10px Tahoma;
	clear:		both;
	text-align:	center;
	padding: 15px;
	color: white;
}


/*Read More Css Only*/
.read-more-state {
  display: none;
}

.read-more-target {
  opacity: 0;
  max-height: 0;
  font-size: 0;
  transition: .25s ease;
}

.read-more-state:checked ~ .read-more-wrap .read-more-target {
  opacity: 1;
  font-size: inherit;
  max-height: 999em;
}

.read-more-state ~ .read-more-trigger:before {
	content: 'SHOW MORE';
}

.read-more-state:checked ~ .read-more-trigger:before {
	content: 'SHOW LESS';
}

.read-more-trigger {
  cursor: pointer;
  display: inline-block;
  padding: 0 .5em;
  color: #333;
  font-size: .9em;
  line-height: 2;
  border: 1px solid #666;
  background-color:#ccc;
  border-radius: .25em;
}
