﻿/* CSS Document */
body{
	background-color:#000;
	color:#FFFFFF;
	margin:10px;
		font-family:Arial, Helvetica, sans-serif;
	font-size:smaller;
}
.content{
	width:987px;
	height:800px;
	margin-left:auto;
	margin-right:auto;
	background-color:#333;
	 border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;

    border-bottom:1px solid #666;
	border-top:2px solid #222;


}

.header{
	margin-top:5px;
	margin-left:5px;
	position:inherit;
	width:100%;
	height:45px;	
	display:block;
	
}

.moduleName{
	position:relative;
	display:inline-block;
	top:-20px;
}

.bodyContainer{
	width:100%;
	min-height:400px;
	position:inherit;
	display:block;
	overflow:hidden;	
}

.logindetail{
	display:inline-block;
	float:right;
	margin-right:10px;	
	top:0px;	
	font-size:small;
}

.controls{
	position:inherit;
	margin-top:10px;
	max-height:100px;
	width:825px;
	display:block;
	float:right;	
}

.footer{
	bottom:10px;
	position:fixed;	
	width:100%;
	left:0px;
	font-size:small;
	color:#999;
}

.loginTop{
	margin-top:200px;
	background-color:gray;
		-moz-border-radius: 10px 10px 0px 0px;
 	border-radius: 10px 10px 0px 0px;
 	width:230px;
	height:15px;
		border-top:1px solid #222;
}

.loginMiddle{
	 	width:230px;
	 	border-left:1px solid grey;
	 	border-right:1px solid grey;
	 	padding:5px;
}

.loginBottom{
	background-color:gray;
		-moz-border-radius: 0px 0px 10px 10px;
 	border-radius: 0px 0px 10px 10px;
 	width:230px;
 	height:15px;
 	border-bottom:1px solid #666;
}

.infotable{
	background-color:#1D241E;
	-moz-border-radius: 10px;
 	border-radius: 10px;
	padding:2px;
	border-bottom:1px solid #666;
	border-top:1px solid #222;
	padding-left:5px;
	padding-bottom:5px;	
}

.infotable2{

	-moz-border-radius: 10px;
 	border-radius: 10px;
	padding:2px;
	border-bottom:1px solid #666;
	padding-left:5px;
	padding-bottom:5px;			
}

.infotable1{
		padding-left:5px;
	padding-bottom:5px;	
}



.mainframe{
	position:inherit;
	display:inline-block;
	min-height:638px;
	border-top:1px solid #666;
	width:770px;
	float:left;
	left:260px;
	padding:5px;
}

.navigation{
	position:inherit;
	float:left;
	display:inline-block;
	height:638px;
	width:200px;
	border-top:1px solid #666;
	border-right:1px solid #666;
	padding:1px;
	font-size:small;
}

.button:hover{
	display:block;
	background-image:url(images/buttons_hover.gif);
	background-position:7px -36px;
	background-repeat:no-repeat;
	cursor:pointer;
	width:200px;
	height:36px;
	text-align:center;
	padding-top:10px;
		text-shadow: #353535 1px 1px 2px;
}

.button:active{
	display:block;
	background-image:url(images/buttons_hover.gif);
	background-position:7px -36px;
	background-repeat:no-repeat;
	cursor:pointer;
	width:200px;
	height:36px;
	text-align:center;
	padding-top:10px;
		text-shadow: #353535 1px 1px 2px;
}



.button{
	display:block;
	background-image:url(images/buttons.gif);
	background-position:7px -36px;
	background-repeat:no-repeat;
	cursor:pointer;
	width:200px;
	height:36px;
	text-align:center;
	padding-top:10px;
		text-shadow: #353535 1px 1px 2px;
}

.moduleState{
	display:block;
	position:inherit;
	width:200px;	
}

.moduleDetail{
	display:block;
	position:inherit;
	width:190px;	
	margin:5px;
	padding-bottom:10px;
}

.buttons{
	display:block;
	position:inherit;
	width:200px;	
}

.indent{
	padding-left:15px;
	font-weight:bold;
}

.lable{
	min-width:100px;
	display:inline-block;	
}

td.lable{
		color:#0CF;
		display:table-cell;	
		min-width:0px;
}

.moduleState{
	margin:5px;
	width:190px;
	padding-bottom:10px;
}

.blockA{
	margin:5px;
	width:190px;
	padding-bottom:10px;
}

.state{
	float:left;
	font-weight:bold;
	padding-left:10px;
}

.tableinfo{
	border:1px solid;	
}

.tableinfo tr{
	border:1px solid;
}

.alarmLevel{
	text-align:center;
	width:82px;
	padding-left:4px;
	padding-right:4px;
	display:inline-block;
}

.alarmLevelShutdown{
	background-color:#FF0000;
	text-align:center;
	width:82px;
	padding-left:4px;
	padding-right:4px;
	display:inline-block;
}

.alarmLevelWarning{
	background-color:#FFFF00;
	text-align:center;
	width:82px;
	padding-left:4px;
	padding-right:4px;
	color:#000;
	display:inline-block;
}

.alarmLevelEngine{
	background-color:#0000FF;
	text-align:center;
	width:82px;
	padding-left:4px;
	padding-right:4px;
	display:inline-block;
}

.alarmLevelElectricalTrip{
	background-color:#9900CC;
	text-align:center;
	width:82px;
	padding-left:4px;
	padding-right:4px;
	display:inline-block;
}



.LEDLable{
	display:inline-block;	
	color:#CCC;
	font-size:small;
	position:relative;
	height:15px;
}

.applyButton{
	background-image:url(images/apply.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	display:inline-block;
	cursor:pointer;
}

.autoStrButton{
	background-image:url(images/Auto_str.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	display:inline-block;
	cursor:pointer;
}

.manualStrButton{
	background-image:url(images/Manual_str.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	display:inline-block;
	cursor:pointer;
}

.modeStrButton{
	background-image:url(images/Mode.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	display:inline-block;
	cursor:pointer;
}

.prohibitReturnButton{
	background-image:url(images/Prohibit_Return.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	display:inline-block;
	cursor:pointer;
}

.S1Button{
	background-image:url(images/S1.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	display:inline-block;
	cursor:pointer;
}

.S2Button{
	background-image:url(images/S2.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	display:inline-block;
	cursor:pointer;
}

.modeButton
{
    background-image:url(images/Mode.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	display:inline-block;
	cursor:pointer;
}

.testOnLoadButton{
	background-image:url(images/Test_On_Load.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	display:inline-block;
	cursor:pointer;
}


.stopButton{
	background-image:url(images/stop.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	display:inline-block;
	cursor:pointer;
}

.manualButton{
	background-image:url(images/manual.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	display:inline-block;
	cursor:pointer;

}

.testButton{
	background-image:url(images/test.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	display:inline-block;
	cursor:pointer;

}

.autoButton{
	background-image:url(images/auto.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	display:inline-block;
	cursor:pointer;
}

.goButton{
	background-image:url(images/go.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	display:inline-block;
	cursor:pointer;
}

.tranMainsButton{
	background-image:url(images/tran_mains.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	display:inline-block;
	cursor:pointer;
}

.tranGenButton{
	background-image:url(images/tran_gen.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	display:inline-block;
	cursor:pointer;
}

.mainsButton{
	background-image:url(images/mains.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	cursor:pointer;
	display:inline-block;
}

.closeBusButton{
	background-image:url(images/close_bus.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	cursor:pointer;
	display:inline-block;
}

.muteButton{
	background-image:url(images/mute.png);
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	position:relative;
	display:inline-block;
	cursor:pointer;
}


.LEDOn{
	background-image:url(images/led.png);
	background-repeat:no-repeat;
	background-position:0px -10px;
	width:45px;
	height:10px;
	position:relative;
	display:inline-block;
}

.LEDOff{
	background-image:url(images/led.png);
	background-repeat:no-repeat;
	background-position:0px 0px;
	width:45px;
	height:10px;
	position:relative;
	display:inline-block;
}

.LEDSmallOn{
	background-image:url(images/small_led.png);
	background-repeat:no-repeat;
	background-position:0px -12px;
	width:12px;
	height:11px;
	display:inline-block;
}

.LEDSmallOff{
	background-image:url(images/small_led.png);
	background-repeat:no-repeat;
	background-position:0px 0px;
	width:12px;
	height:11px;
	display:inline-block;
}

.dhtmlgoodies_tabView1{
	left:0px;
	top:-20px;
	position:relative;
	display:inline-block;
}

INPUT[type=submit] {
	display:block;
	background-image:url(images/buttons.gif);
	background-position:-50px 0px;
	background-repeat:no-repeat;
	cursor:pointer;
	width:85px;
	height:36px;
	text-align:center;
	padding-top:5px;
	background-color:transparent;
	border:0px;
	color:#FFF;
		text-shadow: #353535 1px 1px 2px;
}

INPUT[type=submit]:hover {
	display:block;
	background-image:url(images/buttons_hover.gif);
	background-position:-50px 0px;
	background-repeat:no-repeat;
	cursor:pointer;
	width:85px;
	height:36px;
	text-align:center;
	padding-top:5px;
	background-color:transparent;
	border:0px;
	color:#FFF;
		text-shadow: #353535 1px 1px 2px;
}

INPUT[type=submit]:active {
	display:block;
	background-image:url(images/buttons_hover.gif);
	background-position:-50px 0px;
	background-repeat:no-repeat;
	cursor:pointer;
	width:85px;
	height:36px;
	text-align:center;
	padding-top:5px;
	background-color:transparent;
	border:0px;
	color:#FFF;
		text-shadow: #353535 1px 1px 2px;
}



INPUT[type=reset] {
	display:block;
	background-image:url(images/buttons.gif);
	background-position:-50px 0px;
	background-repeat:no-repeat;
	cursor:pointer;
	width:85px;
	height:36px;
	text-align:center;
	padding-top:5px;
	background-color:transparent;
	border:0px;
	color:#FFF;
		text-shadow: #353535 1px 1px 2px;
}

INPUT[type=reset]:hover {
	display:block;
	background-image:url(images/buttons_hover.gif);
	background-position:-50px 0px;
	background-repeat:no-repeat;
	cursor:pointer;
	width:85px;
	height:36px;
	text-align:center;
	padding-top:5px;
	background-color:transparent;
	border:0px;
	color:#FFF;
		text-shadow: #353535 1px 1px 2px;
}

INPUT[type=reset]:active {
	display:block;
	background-image:url(images/buttons_hover.gif);
	background-position:-50px 0px;
	background-repeat:no-repeat;
	cursor:pointer;
	width:85px;
	height:36px;
	text-align:center;
	padding-top:5px;
	background-color:transparent;
	border:0px;
	color:#FFF;
		text-shadow: #353535 1px 1px 2px;
}



INPUT[type=button] {
	display:block;
	background-image:url(images/buttons.gif);
	background-position:-50px 0px;
	background-repeat:no-repeat;
	cursor:pointer;
	width:85px;
	height:36px;
	text-align:center;
	padding-top:5px;
	background-color:transparent;
	border:0px;
	color:#FFF;
		text-shadow: #353535 1px 1px 2px;
}

INPUT[type=button]:hover {
	display:block;
	background-image:url(images/buttons_hover.gif);
	background-position:-50px 0px;
	background-repeat:no-repeat;
	cursor:pointer;
	width:85px;
	height:36px;
	text-align:center;
	padding-top:5px;
	background-color:transparent;
	border:0px;
	color:#FFF;
		text-shadow: #353535 1px 1px 2px;
}



INPUT[type=password] {
	width:100px;
	display: inline-block;
     border-radius: 2px 2px 2px 2px;
    -moz-border-radius: 2px 2px 2px 2px;
    border:1px solid #999999;
   height:20px;
   background-color:#333333;
      color:#FFF;

}

INPUT[type=text]{
	width:100px;
	display: inline-block;
     border-radius: 2px 2px 2px 2px;
    -moz-border-radius: 2px 2px 2px 2px;
    border:1px solid #999999;
   height:20px;
   background-color:#333333;
      color:#FFF;

}

INPUT[type=text]:focus{
    border:1px solid #51FF00;
}

INPUT[type=password]:focus{
    border:1px solid #51FF00;
}

SELECT:focus{
    border:1px solid #51FF00;
}


INPUT[type=file]{
	width:85px;
	display: inline-block;
     border-radius: 2px 2px 2px 2px;
    -moz-border-radius: 2px 2px 2px 2px;
    border:1px solid #999999;
   height:36px;
background-color:#333333;
   color:#FFF;
}

INPUT[type=checkbox]{
	width:10px;
	display: inline-block;
     border-radius: 2px 2px 2px 2px;
    -moz-border-radius: 2px 2px 2px 2px;
    border:1px solid #999999;
   height:10px;
background-color:#333333;
   color:#FFF;
}

INPUT[type=radio]{
	width:10px;
	display: inline-block;
     border-radius: 2px 2px 2px 2px;
    -moz-border-radius: 2px 2px 2px 2px;
    border:1px solid #999999;
   height:10px;
background-color:#333333;
   color:#FFF;
}



SELECT {
width:100px;
	display: inline-block;
     border-radius: 2px 2px 2px 2px;
    -moz-border-radius: 2px 2px 2px 2px;
    border:1px solid #999999;
   height:24px;
   background-color:#333333;
   color:#FFF;
}

.file-upload {
	overflow: hidden;
	display: inline-block;
	position: relative;	
	vertical-align: middle;
	text-align: center;

	background-image:url(images/buttons.gif);
	background-position:-50px 0px;
	background-repeat:no-repeat;
	cursor:pointer;
	width:85px;
	height:36px;
	background-color:transparent;
	border:0px;
	color:#FFF;

	text-shadow: #353535 1px 1px 2px;
}

.file-upload:hover {
	overflow: hidden;
	display: inline-block;
	position: relative;	
	vertical-align: middle;
	text-align: center;

	background-image:url(images/buttons_hover.gif);
	background-position:-50px 0px;
	background-repeat:no-repeat;
	cursor:pointer;
	width:85px;
	height:36px;
	background-color:transparent;
	border:0px;
	color:#FFF;

	text-shadow: #353535 1px 1px 2px;
}


.file-upload input {
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	/* Loses tab index in webkit if width is set to 0 */
	opacity: 0;
	filter: alpha(opacity=0);
}
	
.file-upload span {
	position: absolute;
	top: 0;
	left: 0;
	display: inline-block;
	padding-top:10px;
}

/* Adjust the button size */	
.file-upload { height: 36px; }
.file-upload,
.file-upload span {	width: 85px; }	


.infoBox{
	padding:10px;
	margin:10px;
	border:1px dashed #999999;
	background-color:#F0F799;
	color:black;
}

.infoBoxIcon{
	background-image:url('images/user.png');
	width:16px;
	height:16px;
	display:block;
	margin-top:-15px;
	margin-left:-15px;	
}

.tip{
	
}

/*---------- bubble tooltip -----------*/
a.tt{
    position:relative;
    z-index:24;
    color:#3CA3FF;
	font-weight:bold;
    text-decoration:none;
}
a.tt span{ display: none;}

/*background:; ie hack, something must be changed in a for ie to execute it*/
a.tt:hover{ z-index:25; color: #aaaaff; background:;}
a.tt:hover span.tooltip{
    display:block;
    position:absolute;
    top:-15px; left:-30px;
	padding: 15px 0 0 0;
	width:200px;
	color: #636363;
    text-align: left;
    font-size:x-small;
}
a.tt:hover span.top{
	display: block;
	padding: 30px 8px 0;
    background: url(images/bubble.png) no-repeat top;
}
a.tt:hover span.middle{ /* different middle bg for stretch */
	display: block;
	padding: 0 8px; 
	background: url(images/bubble_filler.png) repeat bottom; 
}
a.tt:hover span.bottom{
	display: block;
	padding:3px 8px 10px;
	color: #548912;
    background: url(images/bubble.png) no-repeat bottom;
}

.btndisabled{
	opacity:0.5;
 	filter:alpha(opacity=50); /* For IE8 and earlier */
}

.fieldError{
	width:16px;
	height:16px;
	margin-left:-20px;
	margin-bottom:-4px;
	background-image:url('images/exclaim.png');
	background-position:center;
	background-repeat:no-repeat;
	display:inline-block;
}

.progress {
    width: 200px;
    border: 1px solid #999;
    background-color: #333333;
    padding: 0;
    text-align:center;
    color:black;
    margin-left:25px;
    margin-top:15px;
    -moz-border-radius: 5px 5px 5px 5px;
 	border-radius: 5px 5px 5px 5px;

}
.progress span {
    display: block;
    width: 0px;
    height: 20px;
    background-image:url('images/bar.gif');
    background-position:center -60px;
    background-repeat:no-repeat;
    padding-top:7px;
    color:#FFF;
    font-weight:bold;
    -moz-border-radius: 5px 5px 5px 5px;
 	border-radius: 5px 5px 5px 5px;
}

.progressContainer{
	top:40%;
    right:40%;
    bottom:40%;
    left:40%;
    width:250px;
    height:100px;
	position:absolute;
	background-color:black;
	display:inline;
	background-color:gray;
	-moz-border-radius: 10px 10px 10px 10px;
 	border-radius: 10px 10px 10px 10px;
	border-top:1px solid #222;
	padding:10px;
	z-index:9999999;
}

.loadingContainer{
	top:40%;
    right:40%;
    bottom:40%;
    left:40%;
    width:250px;
    height:100px;
	position:absolute;
	background-color:black;
	display:inline;
	background-color:gray;
	-moz-border-radius: 10px 10px 10px 10px;
 	border-radius: 10px 10px 10px 10px;
	border-top:1px solid #222;
	padding:10px;
	background-image:url('images/loading.gif');
	background-position:center center;
	z-index:9999999;
}


.loading{

}

.cellValue{
	display:inline;
}

.cellUnitValue{
	display:inline;
	margin-left:3px;
	font-size:small;
}
