/*
TITLE:	AssetTracker Stylesheet
AUTHOR:	Khaled Maiwand, HighCo Technology
*/
* { margin:0; padding:0; outline:none;}

body{ font-family:'Montserrat', serif; background:#fff;}

#banner, #banner a{
	padding:4px 10px 6px 0;
	line-height:20px;
	text-align:right;
	font-size:16px;
	color:#ffce94; background-color:#29528c;	
	text-decoration:none;
	}

/* --------------------------------------- Main --------------------------------------- */
#main{ padding:0 10px;	}
	#main ul, ol{ margin:2px 0 8px 17px; padding-left:2em;}
	#main li{
		margin:0 0 0 0; 
		padding:0 0 4px 5px;	
		}
	#main ul li{ list-style-type:circle;	}
	#main p{ margin:10px 4px; }
	#main p.heading{ margin-bottom:0; font-size:110%; font-weight:bold; }
	#main h1, h2{
		margin-top:10px;
		padding:5px;
		font-size:18px;
		color:#666; 
		}
		#main h2{ padding-bottom:0; font-size:16px;}
	#main a{ text-decoration:underline; color:#000;	}
		#main a:hover{ text-decoration:none; }
		#main a img{ border:none;}
	#react{ padding:10px;}

/* --------------------------------------- Table styles --------------------------------------- */
table{ margin:10px;}
	table th{ 
		margin:0;
		padding:13px 10px;
		color:#fff; background:#084e7e; 
		}
	table td{ 
		padding:10px 10px;
		text-align:left;
		color:#656565;
		}
	table tr.selectable{ cursor:pointer; }
	table tr.hover{ background-color:#fce4ba;}
	tr:nth-child(even){ background:#e8e8e8}
	tr:nth-child(odd){ background:#FFF}
	table.tablesorter thead tr .header{		/* for table sort */
		background-image:url( 'icon_Sort.gif');
		background-repeat:no-repeat;
		background-position:center right;
		cursor:pointer;
		padding-right:17px
	}
	table td.alt{ background-color:#ffc; }	/* for table filter */
table, th, tr, td{ border:none; border-collapse:collapse;}
table th:hover{ color:#ffce94; cursor:help;}
input[type='submit']{ padding:10px 20px; color:#fff; background:#7898ba; }

/* --------------------------------------- Form styles --------------------------------------- */
#form1 .form-line{ margin:16px 0;}
#form1 label{ display:inline-block; vertical-align:top; width:10em;
	text-align:right; font-weight:bold; margin-right:1em;}
#form1 label:hover{ color:#ef3b3b; cursor:help;}
#form1 input, select { border:thin solid #CCC; padding: 2px;}
#form1 input[type='radio']{ margin:0 10px;}
#form1 input[type='checkbox']{ margin:5px 10px 0 0;}
#form1 input[type='button']{ padding:1px 5px;}
#form1 input[type='file']{ border:none; }
#form1 div.checkboxes{ display:inline-block; margin-top:0; padding:2px 3px; border:thin solid #CCC; overflow:scroll;}
#form1 img.req{ vertical-align:top; cursor:help; }
#form1 .locked:hover{ cursor:help;}
#form1 .fileActions{ display:inline-block; margin-left:10px; }
#form1 .fileActions button{	padding:3px 8px;}
#form1 .long_outer{ display:inline-block; margin-top:2px;}
#form1 .long_locked{ padding:0 5px; border:thin solid #ccc; border-radius:5px;}
#form1 .form-submit input{ margin:5px; padding:5px 10px; color:#fff; background:#7898ba; letter-spacing:1px;}

/* ------------------------------------ General styles ------------------------------------ */
fieldset{ width:40em; margin-top:1.5em; border-radius:8px; }
legend{ margin-left:1.5em; padding:2px 5px; border:solid thin #999; border-radius:4px; color:#fff; background-color:#9c9c9c; }
input[type='radio']{ margin:0 10px;} /* for #config */
.button{ padding:3px;}
.center{ margin:auto; text-align:center; }
.left{ margin:auto; text-align:left; }	
.bold{ font-weight:bold; }

/* -------------------------------------- Responsive 991px -------------------------------------- */
@media screen and (max-width:768px) {
	#form1 label{ width:4em;}
	#form1 .sn{ margin:0; } 
}