xcat-core/xCAT-UI/css/main.css

body {
	margin: 0px auto;
	text-align: center;
	width: 971px;
	font: .8em Verdana, Arial, Sans-Serif;
	font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
	background: #2e2e2e; 
}

#header{
	background: #2e2e2e url('../img/header5.jpg') no-repeat;
	color: #c0c0c0;
	width: 960px;	
	margin: 0px auto;
	height: 40px; 
	/* padding-left: 100px; */
}

#topper {
	background: #2e2e2e url('../img/topper.jpg') no-repeat;
	width: 960px;
	height: 11px;
	margin: 0px auto; 	
	margin-top: 10px;
}

#bopper {
	background: #2e2e2e url('../img/bopper.jpg') no-repeat;
	width: 960px;
	height: 11px;
	margin: 0px auto; 	
}

#footer {
	font: 8px Verdana, Arial, Sans-Serif;
	margin-top: 10px;
	color: #ddd;

}

#main {
	/* padding: 5px; */
	margin: 0px auto;
	width: 960px;
	background-color: #fff;
	overflow: auto;
}

#load {
	display: none;
	/* position: absolute; */
	right: 10px;
	top: 10px;
	background: url(../img/ajax-loader.gif);
	width: 43px;
	height: 11px;
	text-indent: -9999em;
}

#cmdForm {
	margin-left: 240px;		
	background: url(../img/cmd.png) no-repeat;
	width: 132px;
	width: 159px;
	height: 40px;
	float: left;
}

#cmdForm #cmd {
	border: 0;
	background: none;
	/* color: #d1d7F8; */
	color: #555;
	font-size: 12px;
	font-family: serif;
	padding-top: 10px;
	padding-left: 4px;
	float: left;
}

#cmdForm #go {
	float: right;
	padding-top: 8px;
	
}

a.button {
    background: transparent url('../img/bg_button_a.gif') no-repeat scroll top right;
    color: #444;
    display: inline-block;  /*block;*/
    /* float: left; */
    font: normal 12px arial, sans-serif;
    height: 24px;
    margin-right: 6px;
    padding-right: 18px; /* sliding doors padding */
    text-decoration: none;
    cursor: pointer;
}

a.button span {
    background: transparent url('../img/bg_button_span.gif') no-repeat;
    display: inline-block;  /*block;*/
    line-height: 14px;
    padding: 5px 0 5px 18px;
    color: #000;
}

a.button:active {
    background-position: bottom right;
    color: #000;
    outline: none; /* hide dotted outline in Firefox */
}

a.button:active span {
    background-position: bottom left;
    padding: 6px 0 4px 18px; /* push text down 1px */
}

#rangedisplay {
	float: left;
	text-align: left;
	width: auto;
}
#nrtree {
	float: left;
	width: auto;
	border-right: 1px dotted #555;
}

/* tables */
table.tablesorter {
	font-family:arial;
	background-color: #CDCDCD;
	margin:10px 0pt 15px;
	font-size: 8pt;
	width: 100%;
	text-align: left;
}
table.tablesorter thead tr th, table.tablesorter tfoot tr th {
	background-color: #e6EEEE;
	border: 1px solid #FFF;
	font-size: 8pt;
	padding: 4px;
}
table.tablesorter thead tr .header {
	background-image: url('../img/bg.gif');
	background-repeat: no-repeat;
	background-position: center right;
	cursor: pointer;
}
table.tablesorter tbody td {
	color: #3D3D3D;
	padding: 4px;
	background-color: #FFF; 
	vertical-align: top;
}
table.tablesorter tbody tr.odd td {
	background-color:#F0F0F6;
}
table.tablesorter thead tr .headerSortUp {
	background-image: url('../img/asc.gif');
}
table.tablesorter thead tr .headerSortDown {
	background-image: url('../img/desc.gif');
}
table.tablesorter thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp {
background-color: #8dbdd8;
}


.controlHeaders {
	margin: 0;
	padding: 0;
	background: #e6EEEE url(foo.jpg) 0 0 repeat-x;
	float: left;
	width: 100%;	
	border: 1px solid #2e2e2e;
	border-width: 1px 0;
	text-align: center;
}

.controlHeaders li {
	display: inline;
	padding: 0;
	margin: 0;
}

.controlHeaders a:link,
.controlHeaders a:visited {
	color: #000;
	background: #8dbdd8;
	padding: 10px 40px 4px 10px;
	float: left;
	width: auto;
	border-right: 1px solid #2e2e2e;
	text-decoration: none;
}

.controlHeaders a:hover {
	color: #fff;
	background: #2e2e2e;
}

.controlHeaders li:first-child a {
	border-left: 1px solid #2d2d2d;
}

.mapper {
	text-align: left;
	padding: 10px;
	margin: 10px;
	float: left;
	width: 916px;
	border-bottom: 1px dotted #555;
}

/* loading bar */
#wrapper { display: none; }

#loadingZone {
	margin: 0 auto;
	width: 410px;
	text-align: center;
 color:#6ea1fa;  
}

#loadingBar {
 border:1px solid #c2c2c2;  
 height:2px;  
 text-align:left;  
 line-height:0;  
 margin:0;  
 color:#6ea1fa;  
 padding:0;  
 overflow:hidden; /*fix for IE 6*/  
}  
#progressBar{  
 height:2px;  
 line-height:0;  
 margin:0;  
 padding:0;  
 background:#b3f83d;  
 width:0%;  
}  
#loadingSms{  
 color:#6ea1fa;  
 float:left;  
 padding:10px 2px;  
}  
#infoProgress{  
 color:#6ea1fa;  
 float:right;  
padding:10px 2px;  
}  
#infoLoading{  
 padding:10px;  
 color:#b9b9b9;  
 font-size:10px;  
}  

/* for display tables */
.tabMenu {
	text-align: left;
	padding: 10px;
}

/* for usernamed login */
#musername {
	float: right;
	margin-right: 10px;
	padding-right: 5px;
	text-align: right;
	font-size: .8em; 
}
#musername span {
	color: yellow;
}
#musername a {
	color: #ddd;
}
.mContent {
	padding: 10px;
	padding-top: 0px;
	margin: 10px;
	margin-top: 0px;
	text-align: left;
	color: #555;
}
.mContent h1 {
	font-size: 1.2em;
	color: #555;
}
.mContent h1 i {
	color: #5d90e9;
}

.mContent h2 {
	font-size: 1.1em;
	color: #555;
}
.mContent a, .mapper a {
 	color:#6ea1fa;  
}
.nrcmd {
	float: right;
	text-align: left;
}
.mapper span {
	float: left;
}
/* this is for the table editing in config */
.editme input {
	font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
	background: #FAF8CC;
	margin: 0;
	padding: 0;
        font-size: 8pt;
	padding-right: 0;

}

#ositree {
    float: left;
    width: auto;
    min-height: 255px;
    border-right: 1px dotted #555;
    min-width: 130px;
    /*display: none;*/
}

#rmc_tree {
    float: left;
    width: auto;
    min-height: 255px;
    border-right: 1px dotted #555;
    min-width: 130px;
    /*display: none;*/
}

#rmc_monshow {
    float: left;
    width: 701px;  /*need update*/
    margin: 10px;
    padding: 10px;
    display: block;
}

#mon_keys {
    float: left;
    width: 100%;
    display: block;
}

#monshow_opt {
    float: left;
    width: 100%;
    display: block;
}

#monshow_data {
    float: left;
    width: 100%;
    display: block;
}

.tips  {
    margin-right: 10px;
    margin-left: 10px;
    padding: 10px;
    width: 900px;
    text-align: left;
    display: block;
    border-bottom: 1px dotted #555;
    /*display: none;*/
}
.tips_head {
    color: #339933;
}

#monlist_table {
    margin-right: 30px;
    margin-left: 30px;
    width: 910px;
    padding: 10px;
    display: block;
}

#condresp {
    width: 770px;
    margin: 10px;
    padding: 10px;
    float: left;
    display: block;
    border-bottom: 1px dotted #555;
}

#assocaition {
    margin: 10px;
    padding: 10px;
    float:left;
    display: block;
    width: 720px;
    border-bottom: 1px dotted #555;
}
#avail_cond {
    width: 275px;
    margin: 5px;
    padding: 10px;
    float: left;
    background-color: #ffee33;
}

#avail_cond tbody {
    height: 640px;
    overflow-y: scroll;
    overflow-x: hide;
}

#condition .ui-selecting {background: #FECA40;}
#condition .ui-selected { background: #F39814; color: white; }
#condition {list-style-type: none; margin: 0; padding: 0;}

#avail_resp {
    width: 425px;
    margin: 5px;
    padding: 10px;
    float: left;
    background-color: #eeffee;
}

#avail_resp tbody {
    height: 640px;
    overflow-y: scroll;
    overflow-x: hide;
}

#monsetting_tips {
    width: 920px;
    margin: 5px;
    padding: 5px;
    float: left;
}

#rmcSrcList {
    width: 420px;
    margin: 5px;
    padding: 5px;
    float: left;
    background-color:silver;
    height: 480px;
    overflow-y: scroll;
}

#rmcScrAttr {
    width: 420px;
    margin: 5px;
    padding: 5px;
    float: left;
    background-color:silver;
}

#options {
    width: 880px;
    margin: 10px;
    padding: 10px;
}

#monconfig {
    width: 48%;
    float: left;
}

#monview {
    width: 48%;
    float: right;
}