* {
	margin: 0;
	padding: 0;
}

body {
background: #fafafa;
/*font-family: Arial, Helvetica, sans-serif;*/
font-family: "Trebuchet MS", Helvetica, sans-serif;
font-size: 12px;
/*line-height: 17px;*/
color: #333;
}

h2{
	font-size: 14px;
	border-left: 4px solid #9FDFFF;
	padding-left: 5px;
	margin: 5px 0 10px 0;
}
h3{
	font-size: 14px;
	border-left: 4px solid #9FDFFF;
	padding-left: 10px;
	margin: 5px 0;
}

tr {
	padding: 0px;
	margin: 0px;
}

td {
	padding: 0px;
	margin: 0px;
}

/* 
	Adjust the odd behaviour that input and select element in Fx, Webkit use 
	different box model (which is similiar to IE quirk mode box model.
	INPUT element has 1px padding and 2px border by default. However it is 
	shown on browser like a 2px padding and 1px border. On the other hand
	SELECT element has 1px padding and 1px border, and its width is behave
	like quirk mode box model, that the actual width is the CSS width minus
	padding and border. This made SELECT element width 4px less than expected.
	However, I find no way to adjust the SELECT element correctly in terms
	of CSS. Therefore I adjust the input element to behave like the select
	element to make them appear consistently. 
	This hack does not work on IE6/7 and need a separate conditional CSS file
	for further site-specific adjustment.
*/

input,textarea
{
/* -ms-box-sizing is for IE8 only */
-ms-box-sizing:border-box;
/* Firefox */
-moz-box-sizing:border-box;
/* offical CSS3 declaration, Opera 9.63 get it */
box-sizing:border-box;
/* WebKit */
-webkit-box-sizing:border-box;
} 

input, select {
	padding: 1px;
}

input[type="radio"], input[type="checkbox"] {
	margin: 3px 8px 3px 0px ;
}

button, input[type='submit'], input[type='reset'],input[type='button']{ 
	cursor: pointer;
	font-size: 1em;
	font-family: "Trebuchet MS", Helvetica, sans-serif;
	/*height: 2em;*/
	background-color:#fff;
	color:#555;
	border: 1px #999 solid ;
	padding: 1px 10px;
	margin: 1px; 
}
button.hover, input[type='submit'].hover, input[type='reset'].hover,input[type='button'].hover{
	background-color:#DDDDFF;
}
button[disabled], input[type='submit'][disabled], input[type='reset'][disabled],input[type='button'][disabled]{
	border-color: #CCC;
	color: #CCC;
}
button.force-default, input[type='submit'].force-default, input[type='reset'].force-default, input[type='button'].force-default{ 
	cursor: pointer !important;
	font-size:1em !important;
	font-family: "Trebuchet MS", Helvetica, sans-serif !important;
	/*background-color:#fff !important;*//*it will change by the hover class*/
	color:#555 !important;
	border: 1px #999 solid !important;
	padding: 1px 10px !important;
	margin-top: 1px !important; 
	margin-bottom: 1px !important;
}

.clear {
	clear:both ;
}

#wrap {
margin: 0 auto;
width: 1024px;
background: #fff;
}

#wrap2 {
margin: 0 auto;
width: 1280px;
background: #fff;
}

#header {
height: 90px;
}

#content {
padding: 0 20px 20px 20px;
min-height: 500px;
height: auto !important;
height: 500px;
}

#searchForm {
	padding: 0.5em;
	background-color: #DDEEEE;
	width: 100%;
	margin-bottom: 1em;
}

#searchForm h2 {
	font-size: 10px;
	font-weight: bold;
	display: inline;
}

#searchForm label {
	padding-left: 10px;
}

#searchForm input {
	width: 80px;
}

table.list2{
	border: 0;
}

table.list2 tr {
}

table.list2 th {
	text-align: left;
	padding: 0.0em 0.5em;
	font-size: 10px;
}

table.list2 td {
	background-color: #F5F5DD;
	padding: 1em 0.5em;
	border-top : 1px solid #aa0;
}

table.fixed {
	table-layout: fixed;
}

table.list {
	border: 0;
	width: 100%;
}

table.list tr {
}

table.list th {
	text-align: left;
	padding: 0.5em;
	margin: 0 0 0.5em 0 ;
	font-size: 1em;
	vertical-align: middle;
	border: 1px solid #FFFFFF;
	background: url("../images/table-header-bg.png") repeat-x scroll 0 0 #FEFEEB;
}

table.list td {
	background-color: #F5F5DD;
	padding: 0.5em 0.5em;
	border: 1px solid #FFFFFF;
	vertical-align: middle;
	/*border-top : 1px solid #FFFFF;*/
	/*white-space:nowrap;*/
}
table.list.align-top td {
	vertical-align: top;
}
table.list tr.hover td {
	background-color: #F3F3C8;
}

table.list td.icon-cell {
	padding: 8px 0.5em ;
	border: 1px solid #FFFFFF;
	/*vertical-align: middle;*/
}
table.list th.action-list {
	width: 120px;
}

table.nowrap td {
	white-space:nowrap;
}

table.list tr.active td {
/*	background-color: #FFF; */
}


table.list th.column-serial {
	width: 200px;
}

table.list th.column-desc {
	width: 150px;
}

tr.warrantyline td {
	padding: 0;
	margin: 0;
	border-width: 0px;
	background-color: #F5F5DD;
	padding-left: 2em;
}

.warranty-rec {
	width: 100%;
	padding: 0.5em 1em;
	margin-top: 0px;
	margin-bottom: 1em;
	background-color: #dddd8c;
	border-width: 1px 1px 1px 1px;
	border-color: #8a8a2b;
	border-style: solid;
	caption-side: top;
/*	border-collapse: collapse;*/
}

table.warranty-rec thead th
{
	background-color: #dddd8c;
	margin: 0px;
	padding: 3px 0px 0px 5px;
	text-align: left;
}


table.warranty-rec tbody td
{
	background-color: #dddd8c;
	padding: 3px 0px 0px 5px;
}



.warranty-rec caption {
	font-weight: bold;
	font-size: 1.2em;
	text-align: left;
	margin: 0px 0px -1px 0px;
	padding: 2px 5px 2px 5px;
	border-width: 1px 1px 0px 1px;
	border-color: #8a8a28;
	border-style: solid;
	color: #008800;
	background-color: #dddd8c;
	width: 150px;

	border-top-right-radius: 0.5em;
	border-top-left-radius: 0.5em;
	-moz-border-radius-topright: 0.5em;
	-moz-border-radius-topleft: 0.5em;
	-webkit-border-top-right-radius: 0.5em;
	-webkit-border-top-left-radius: 0.5em;
	
}

table.warranty tr.active td {
	background-color: #f5f5dd;
}

ul.stblist {
	background-color:#F5F5DD;
}

ul.stblist li {
}

ul.stblist ul.header li {
	display: inline;
}

ul.stblist ul.list-item li{
	display: inline;
}

.farleft {
	position: absolute;
	left: -10000px;
}

.big, .serial-no, .username {
	/*font-size: 1.2em;*/
	font-weight: bold;
}
.not-bind {
	color: #bbb;
}
.cancel {
	border: 0
	padding: 3px;
	margin: 2px;
	float: right;
}

.topmenu{
	margin: 10px 0 10px 0
	width:100%;
	padding: 0 0 0 20px ;
	background-color:#F3FBFF;
}
.topmenu li{
	font-size:13px;
	list-style-type: none;
	padding: 7px 15px;
	margin: 1px 0 ;
	border-left: 2px solid #DDE6EE ;
	border-bottom: 1px solid #DDE6EE ;
	float:left ;
	font-weight: bold;
	white-space:nowrap;
	background-color:#E6EEDD;
	background-image: url(../images/topmenu-bg.png);
}
.topmenu li:hover{
	background-color:#DDE6EE;
	background-image: url(../images/topmenu-bg-hover.png);
}
.topmenu li a,
.topmenu li a:hover
{
	color: #444;
	text-decoration: none;
}
.topmenu li.current-tag a{
	color: #2060B7;
}
.topmenu li.current-tag {
	color: #004990;
	background-color:#FFF;
	background-image: none;
}
.ui-widget-content .ui-icon-alert {
	background-image: url(../images/warning_48.png);
	background-position: 0 0;
}

.dialog-icon {
	float:left; 
	margin:0 7px 20px 0; 
	padding: 20px
}

.admin-entry-form fieldset{

	border: 1px solid #eee;
	padding: 1.5em;
	font-size: 14px;

}

.admin-entry-form p {
	float: left;
	clear: left;
	width: 100%;
}

.admin-entry-form label{
	display: block;
	float: left;
	clear: left;
	width: 120px;
	margin: 3px 0px;
	padding: 3px 30px 3px 15px;
	border-bottom: 1px solid #eee;
	font-weight: bold;
}

.admin-entry-form span{
	display: block;
	margin: 6px 0px 0px 10px;
	padding: 3px 3px 3px 3px;
}

.admin-entry-form p.first label{
	border-top: 1px solid #eee;
	padding-top: 9px; /* 3px x 2 for padding + 3px for margin */
}

.admin-entry-form input, .admin-entry-form select, .admin-entry-form .readonly-field {
	display: block;
	float: left;
	/* width: 200px; */
	margin: 3px 12px 3px 0px;
	padding: 3px 3px 3px 0px;
	/* why does 'input' element not inherient the font size of ancestor elements? */
	font-size: 14px;
	
}

.admin-entry-form .field-error {
	margin-left: 165px;
	margin-bottom: 20px;
	display: block;
	color: red;
	font-weight: bold;
	clear: both;
}

.admin-entry-form select {
}	

.admin-entry-form p.first .readonly-field{
	padding-top: 9px;
}

.admin-entry-form input, .admin-entry-form select {
	padding: 1px; /* reduce two pixel to compensate the border width */
}

.admin-entry-form .hidden-field {
	border: 0px;
}

.admin-entry-form .button-list {
	padding-left: 130px; /* the total width of 'label' */
	padding-top: 20px;
	margin-right: -130px;
}

.admin-entry-form .button-list .button {
	width: 100px;
}

.admin-entry-form input.hidden-field {
	margin: 0;
	padding: 0;
	display: inline;
}
.admin-entry-form textarea {
	width: 400px;
	height: 70px;
}
#deletedialog p {
	margin-bottom: 1em;	
}
/* add by keith at 2011-01-27*/
#drop-content{
	float: left;
	width: 550px;
/*	padding: 15px 15px;	*/
	padding: 5px 5px 5px 5px;
	background-color: #eee;
}

#drop-sidebar{
	background: url("../images/topmenu-bg.png") repeat scroll 0 0 #F0F0F0;
	border: 3px solid #F0F0F0;
	display: block;
	position: fixed;
	float: right;
	height: 400px;
	width: 410px;
	overflow-x: hidden;
	overflow-y: scroll;
	margin: 0 0 0 48.5em;
	z-index: 100;
}

table.inner-table td{
	padding: 0.5em 0.2em;
	/*border-top : #333333;*/
	border: 0px solid #FFF;
	line-height: 0.5em;
	/*vertical-align: top;*/
}

.error{
	color:red;
}

div#flash-error-msg {
	padding: 10px 15px ;
	margin: 10px 0 ;
	color: #990000;
	background-color: #FFCCCC;
	border: 1px solid #990000 ;
}
div#flash-msg {
	padding: 10px 15px ;
	margin: 10px 0 ;
	color: #002EB8 ;
	background-color: #B8C9FF;
	border: 1px solid #002EB8 ; 
}


div.top_right_menu 
{
	float: right;
	margin-left: 1em;
	position: relative;
	top: -20px;
}
div.top_right_menu select
 {
	width: 150px;
}

div.paging2 {
	margin: 5px 0 ;
	padding: 2px 0;
	font-size: 14px;
}

div.table-form-context{
	padding:20px;border:1px solid #eee;
}
p.form-title {
	font-size:14px;
	font-weight: bold;
	margin-bottom: 20px;
}
table.table-form  {
	/*margin: 10px 20px;*/
	width: 100%;
	}
.table-form th {
	font-size: 1em;
	width:160px;
	font-weight: bold;
	background-color: #F3FBFF;
	padding:2px 0 2px 10px;
	text-align: left;
}
.table-form th.button-list {
	border-bottom: none;
	border:none;
}
.table-form td {
	font-size: 1em;
	padding:5px 10px 5px 5px;
}
.table-form textarea {
	width: 300px;
	heidht: 40px;
}

#uploading-banner{
	text-align: center ;
	color: blue;
}
ul.form-checkbox {
	display:block; 
	list-style-type: none;
}
ul.form-checkbox li {
	display: block;
	float: left;
	width: 150px;
	height: 20px;
	line-height: 20px;
	overflow: hidden;
	padding:0;
}
ul.form-checkbox input {
	margin: 0px 8px 0 5px;
	position:relative;
	top:3px;
}
ul.form-checkbox label {
	display: inline-block;
}

button.em-button {
	padding: .3em 1em;
	font-weight: bold;
	margin: 0;
	cursor: pointer ;
	font-size: 13px;
	background-color:#4DBCE9;
	border-color:#26ADE4;
	color: #FFFFFF;
}

a.paging2{ cursor: pointer; }

span.line-sep {
	display:inline-block;
	width:20px;
}


.icon24
{
width:24px;height:24px;
background-repeat:no-repeat;
/*cursor: pointer;*/
display: inline-block;
}
/* 0,24,48,72,96,120,144,168,192,216,240,264,288,312,336,360,384,408,432,456,480 */
span.icon24.add-doc		{background:url('icons/gloss_basic_full_24.png');	background-position: -48px -120px;}
span.icon24.delete		{background:url('icons/gloss_basic_full_24.png');	background-position: -240px -360px;}
span.icon24.up-setting	{background:url('icons/gnome_desktop_full_24.png');	background-position: -192px -432px;}
span.icon24.log			{background:url('icons/gloss_basic_full_24.png');	background-position: -360px -0px;}
span.icon24.up-log		{background:url('icons/gloss_basic_full_24.png');	background-position: -240px -384px;}
span.icon24.reset		{background:url('icons/gnome_desktop_full_24.png');	background-position: -48px -432px;}
span.icon24.up-list		{background:url('icons/gnome_desktop_full_24.png');	background-position: -168px -432px;}
span.icon24.detach		{background:url('icons/gnome_desktop_full_24.png');	background-position: -72px -432px;}
span.icon24.up-firmware	{background:url('icons/gnome_desktop_full_24.png');	background-position: -96px -432px;}
span.icon24.not-bind	{background:url('icons/gloss_basic_full_24.png');	background-position: -336px -96px;}
span.icon24.offline		{background:url('icons/gloss_basic_full_24.png');	background-position: -384px -168px;}
span.icon24.idle		{background:url('icons/gloss_basic_full_24.png');	background-position: -48px -0px;}
span.icon24.pause		{background:url('icons/gloss_basic_full_24.png');	background-position: -240px -336px;}
span.icon24.playing		{background:url('icons/gloss_basic_full_24.png');	background-position: -384px -360px;}
span.icon24.info		{background:url('icons/oxygen_full_24.png');		background-position: -24px -288px;}
span.icon24.schedule	{background:url('icons/gloss_basic_full_24.png');	background-position: -0px -264px;}
span.icon24.playlist	{background:url('icons/oxygen_full_24.png');		background-position: -264px -264px;}
span.icon24.hid			{background:url('icons/gnome_desktop_full_24.png');	background-position: -216px -432px;}
span.icon24.usbstorage	{background:url('icons/gnome_desktop_full_24.png');	background-position: -240px -432px;}
span.icon24.touch		{background:url('icons/gnome_desktop_full_24.png');	background-position: -0px -336px;}
span.icon24.setting-change		{background:url('icons/gnome_desktop_full_24.png');	background-position: -264px -432px;}
span.icon24.scheduled	{background:url('icons/oxygen_full_24.png');		background-position: -120px -48px;}
span.icon24.resolution	{background:url('icons/gnome_desktop_full_24.png');	background-position: -72px -192px;}
span.icon24.alert		{background:url('icons/oxygen_full_24.png');	background-position: -360px -168px;}
span.icon24.content-update	{background:url('icons/gnome_desktop_full_24.png');	background-position: -288px -432px;}
span.icon24.content-invalid	{background:url('icons/gnome_desktop_full_24.png');	background-position: -312px -432px;}
span.icon24.playlist-change {background:url('icons/gnome_desktop_full_24.png');	background-position: -336px -384px;}
span.icon24.playlist-downloaded {background:url('icons/gnome_desktop_full_24.png');	background-position: -192px -168px;}
span.icon24.download-aborteded {background:url('icons/gnome_desktop_full_24.png');	background-position: -216px -24px;}
span.icon24.network-retry {background:url('icons/gloss_basic_full_24.png');	background-position: -168px -216px;}
span.icon24.audio-swap {background:url('icons/gnome_desktop_full_24.png');	background-position: -336px -144px;}
.icon
{
display: inline-block;
}
span.icon.download-csv {width: 24px; height: 24px; background-size: 100%; background-image: url('icons/csv.png'); }
span.icon.tv-error {width: 24px; height: 24px; background-size: 100%; background-image: url('icons/tv_error.png'); }
span.icon.tv-off {width: 24px; height: 24px; background-size: 100%; background-image: url('icons/tv_off.png'); }