body { background-color: #eee; margin: 0; padding: 0; }
body, th, td { font-family: Tahoma; font-size: 12px; color: #555; }
table { border-collapse: collapse; }
input,select,textarea { font-family: Tahoma; font-size: 12px; color: #555 }
a { color: #000; text-decoration: none; }
a:hover { text-decoration: underline; }
h1 { color: #039; font-weight: bold; font-size: 140%; margin: 8px 0; text-align: left; }
h2 { color: #333; font-weight: normal; font-size: 125%; margin: 0; padding: 5px 3px; text-align: left; }
hr { border: 0; width: 100%; color: #555; background-color: #555; height: 1px; margin: 5px 0; }

fieldset { border: 0; }
fieldset h2 { background-color: #ddd; }
fieldset input[type="submit"] { float: right; font-size: 120%; font-weight: bold; }
div.formarea { padding: 0; margin-bottom: 15px; border: 0; }
div.formarea table { width: 100%; border-style: solid none; border-width: 1px; border-color: #ccc; }
div.formarea table td { padding: 3px; text-align: left; vertical-align: top; }
div.formarea table td:first-child { width: 165px; text-align: right; color: #999; font-style: italic; }

div.listmessage { padding: 5px 0;  }
textarea#shoutconf { width: 99%; height: 400px; }
textarea#shoutconf[disabled="disabled"] { background-color: #eee; }
table.list { width: 100%; border: none; }
table.list th { padding: 5px; text-align: center; vertical-align: middle; font-weight: bold; font-size: 110%; background-color: #555; color: #aaa; }
table.list tr:nth-child(2n+1) { background-color: #eee; }
table.list td { padding: 2px; }
table.list td.checkbox { width: 20px; }
table.list td.name { width: 50%; }
table.list td.right { text-align: right; }

/* login.tpl */
div#loginform { margin: 20px auto; width: 300px; text-align: center; padding: 5px; border: 1px dotted #aaa; background-color: white; }
div#loginform h3 { margin: 2px 0 10px 0; text-align: left; font-size: 12px; }
div#loginform table { width: 100%; border: none; }
div#loginform table td { text-align: left; padding: 2px; vertical-align: middle; }
div#loginform input { padding: 2px; width: 160px; background-color: white; }
div#loginform input, div#loginform td { font-size: 120%; }
div#loginform input[type="submit"] { background-color: #ccc; }
div#loginnotice { color: red; padding: 5px; border: 1px solid red; background-color: #fcc; margin-bottom: 6px; }
div#loginnotice span { font-weight: bold; }

/* header.tpl */
div#headbar { border-bottom: 1px solid #333; background-color: #ccc; padding: 5px; }
div#headbar div#copyright { float: right; padding: 5px; width: 200px; text-align: right; }
div#headbar div#loginout { float: right; padding: 5px; width: 250px; text-align: right; }
div#wrapper { margin: 0 auto; width: 990px; border-style: none solid; border-width: 1px; border-color: #aaa; background-color: white; }

/* navigate.tpl */
div#navigate { position: absolute; width: 200px; background-color: #eee; border-right: 790px solid white; vertical-align: top; }
div#navigate div { padding: 5px; }
div#navigate div h2 { text-align: center; font-size: 120%; }
div#navigate div ul { list-style: square; }
div#navigate div ul li { margin: 2px; padding: 2px; }
div#navigate div ul li:hover { background-color: white; }
div#main { position: absolute; margin-left: 200px; width: 790px; vertical-align: top; background-color: white; border-style: none solid; border-width: 1px; border-color: #555; }
div#main div.content { padding: 5px; }
div#breadcrumb { padding: 5px; background-color: #ddf; }
div#breadcrumb ul { list-style-type: square; padding: 0; margin: 0; }
div#breadcrumb ul li { float: left; margin: 0 4px 0 18px; padding: 2px; }
div#notice { padding: 5px; background-color: #fdd; }
form#sethostname div { text-align: center; }

/* home.*.tpl */
div#homestatus { border: 1px solid #88f; margin: 10px; padding: 5px; }
div#homestatus table.splitter { width: 100%; border: none; }
div#homestatus table.splitter td { padding: 3px; text-align: center; vertical-align: top; width: 50%; }
div#homestatus table.info { width: 95%; }
div#homestatus table.info td { width:auto; padding: 3px; text-align: left; vertical-align: top; }
div#homestatus table.info td:first-child { text-align: right; color: #999; font-style: italic; }
div#homestatus table.info td.split ul { list-style: none; margin: 0; padding: 0; }
div#homestatus table.info td.split li { margin: 0 0 0 7px; padding: 0 7px 0 0; float: left; border-right: 1px solid #ccc; }
div#homestatus table.info td.split li:first-child { width: 60px; }
a.pcontrol-up { background-color: red; color: white; font-weight: bold; font-size: 75%; padding: 1px; }
a.pcontrol-down { background-color: blue; color: white; font-weight: bold; font-size: 75%; padding: 1px; }

div.toolsArea fieldset { margin: 0; padding: 10px 0 0; border-color: #999 -moz-use-text-color -moz-use-text-color; border-style: solid none none; border-width: 1px 0 0; }
div.toolsArea fieldset legend { margin: 0 0 5px -7px; padding: 3px 9px 0 13px; vertical-align: middle; color: #C33; font-weight: bold; white-space: nowrap; }
div.toolsArea fieldset a { text-decoration: none; }
div.toolsArea fieldset ul { list-style: none; margin: 0; }
div.toolsArea fieldset ul li { float: left; text-align: center; width: 110px; height: 65px; margin: 1px; padding: 2px 5px; }
div.toolsArea fieldset ul li img { border: 0; width: 32px; height: 32px; text-decoration: none; }
div.toolsArea fieldset ul div { clear: both; }

/* account.chinfo.tpl */
input[disabled="disabled"] { border: none; background-color: #eee; }
select[disabled="disabled"] { border: none; background-color: #eee; }

/* library.tpl */
div#lib-nav { height: 150px; padding: 0; margin: 0; }
div#lib-nav ul { list-style: none; margin: 0; padding: 0; }
div#lib-nav ul li { cursor: pointer; margin: 1px 0; padding: 4px; color: #000; }
div#lib-nav ul li:hover { background-color: #ddd; text-decoration: underline; }
div#lib-nav ul li.selectActive { background-color: #ccf; }
div#lib-admin { float: left; width: 388px; height: 100%; border: 1px solid blue; overflow: auto; }
div#lib-client { float: left; height: 100%; border: 1px solid green; overflow: auto; }
div.lib-client { width: 100%; }
div.lib-admin { width: 388px; }

div#lib-admin div { padding: 5px; }
div#lib-client div { padding: 5px; }

div#port-uploader { border: 1px solid black; padding: 5px; text-align: left;  }
div#port-uploader div.uploader { text-align: center; }
div#lib-files { margin-top: 15px; height: 400px; overflow: auto;}
div#quotaStatus { text-align: center; color: black; margin-bottom: 10px; }
div#lib-files ul { list-style: none; margin: 0; padding: 0; }
div#lib-files ul li { cursor: pointer; margin: 1px 0; padding: 4px; color: #000; border-bottom: 1px dotted #ddd; }
div#lib-files ul li:hover { background-color: #ddd; }
div#lib-files ul li.selectActive { background-color: #ccf; }
div#lib-files span.command { float: right; }
div#lib-files span.size { float: right; width: 70px; margin: 0 4px 0 0; text-align: right; color: #666; }
div#lib-files span.fileindex { float: left; width: 35px; margin: 0 4px 0 0; text-align: right; color: #666; }
div#lib-player { text-align: center; margin-top: 10px; }
div#lib-usage { margin-top: 20px; background-color: #ddd; padding: 5px; }
div#lib-usage ul { list-style: square; }
div#lib-usage ul li { margin: 2px; padding: 2px; }
div#fsUploadProgress { margin-top: 5px; }
.progressContainer { border-bottom: 1px dotted #ddd; padding: 2px; }
.progressName { float: right; text-align: left; width: 600px; margin-left: 10px; color: black; }
.progressBarStatus { color: #666; text-align: right; margin: 0 4px 0 0; }
.red { border: solid 1px #B50000; background-color: #FFEBEB; }
.green { border: solid 1px #DDF0DD; background-color: #EBFFEB; }
.blue { border: solid 1px #CEE2F2; background-color: #F0F5FF; }
.progressBarInProgress, .progressBarComplete,.progressBarError {
	clear: both;
	font-size: 0;
	width: 0%;
	height: 2px;
	background-color: blue;
	margin-top: 2px;
}
.progressBarComplete { width: 100%; background-color: green; visibility: hidden; }
.progressBarError { width: 100%; background-color: red; visibility: hidden; }