/* *****************************************************************************
	UiTM
***************************************************************************** */



/*	Common attributes -- These need not to be bothered.
============================================================================= */
.txtl	{ text-align:  left; }	.vat	{ vertical-align:   top; }
.txtc	{ text-align:center; }	.vam	{ vertical-align:middle; }
.txtr	{ text-align: right; }	.vab	{ vertical-align:bottom; }

.wauto	{ width:auto; }
.w5		{ width:  5%; }	.w10	{ width: 10%; }	.mw5	{ min-width:  5%; }	.mw10	{ min-width: 10%; }
.w15	{ width: 15%; }	.w20	{ width: 20%; }	.mw15	{ min-width: 15%; }	.mw20	{ min-width: 20%; }
.w25	{ width: 25%; }	.w30	{ width: 30%; }	.mw25	{ min-width: 25%; }	.mw30	{ min-width: 30%; }
.w35	{ width: 35%; }	.w40	{ width: 40%; }	.mw35	{ min-width: 35%; }	.mw40	{ min-width: 40%; }
.w45	{ width: 45%; }	.w50	{ width: 50%; }	.mw45	{ min-width: 45%; }	.mw50	{ min-width: 50%; }
.w55	{ width: 55%; }	.w60	{ width: 60%; }	.mw55	{ min-width: 55%; }	.mw60	{ min-width: 60%; }
.w65	{ width: 65%; }	.w70	{ width: 70%; }	.mw65	{ min-width: 65%; }	.mw70	{ min-width: 70%; }
.w75	{ width: 75%; }	.w80	{ width: 80%; }	.mw75	{ min-width: 75%; }	.mw80	{ min-width: 80%; }
.w85	{ width: 85%; }	.w90	{ width: 90%; }	.mw85	{ min-width: 85%; }	.mw90	{ min-width: 90%; }
.w95	{ width: 95%; }	.w100	{ width:100%; }	.mw95	{ min-width: 95%; }

.scrollable		{ overflow:auto;	}
.scrollable-x	{ overflow-x:auto;	}
.scrollable-y	{ overflow-y:auto;	}

*[onclick]:not(button):hover	{ background-color:#ffffff; cursor:pointer;	}

.non			{ display:none }



/*	Designs
============================================================================= */

html
{
	overflow:auto;
	margin:0;
	padding:0;
}

body
{
	font		:normal 10px Verdana, sans-serif, Tahoma, Helvetica, Arial;
	background	:#f8f8ff url(img/tabc.png) top left repeat-x;
	color		:#808080;
	margin		:0;
	padding		:0;
}

#headerWrapper	{ height:auto; background:url(img/bg.jpg)   center left  repeat-x; padding:1em 2em; border-bottom:1px #000 solid; color:#fff; }
	#logo				{ height:130px; background:url(img/logo.png) top    left no-repeat; width:320px; }
	.head				{ display:block; margin:0; padding:0; position:absolute; margin-left:350px; top:40px; color:#f5f5f5; text-align:center;}
	.head-title			{ font-size: 36px; }
	.head-subtitle		{ font-size: 18px; }
	.menu				{ display:block; margin:0; padding:0; position:absolute; margin-left:350px; top:40px; color:#f5f5f5; }
	.menu li			{ border:0; list-style:none; float:left; width:64px; height:64px; margin:0; padding:4px; cursor:pointer; font-size:12px; text-align:center; vertical-align:top; }
	/*.menu li:hover		{ border:0; background:url(img/menu.png) top left repeat; color:#ffffff; }*/
	.menu li:hover		{ border:0; background:#acacac top left repeat; color:#ffffff; }
		.ico-wr-home		{ background:url(img/icons.png)    0px   0px no-repeat; width:32px; height:32px; display:inline-block; }
		.ico-wr-list		{ background:url(img/icons.png)  -32px   0px no-repeat; width:32px; height:32px; display:inline-block; }
		.ico-wr-new			{ background:url(img/icons.png)  -32px -32px no-repeat; width:32px; height:32px; display:inline-block; }
		.ico-log-out		{ background:url(img/icons.png)    0px -32px no-repeat; width:32px; height:32px; display:inline-block; }
	#languageSelector	{ position:absolute; top:1em; right:2em; color:#fff; }
	#title				{ position:absolute; top:1.5em; left:350px; color:#fff; font-size:35px; }

#contentWrapper		{ margin:0; border-top:1px #aaa solid; }
	#siteList			{ margin:2em 2em 0 2em; }
	.tabs				{ margin:2em 2em 0 2em; }
	.buttonSet			{ margin:2em; text-align:right; }

	.result				{ border:1px #000000 solid; border-bottom:0; }
	.result table		{ border:0; border-collapse:collapse; }
	.result th			{ border:1px #696969 solid; font-size:10px; padding:3px; height:3em; vertical-align:middle; background: #8b0000 url(img/ui-bg_diagonals-small_15_8b0000_40x40.png) 50% 50% repeat; color: #ffffff; }
	.result td			{ border:1px #cccccc solid; font-size:10px; padding:3px; }
	.result td					{ background:#f8f8f8 url(img/td1.png) bottom left repeat-x; }
	.result td:nth-child(even)	{ background:#f5f5f5 url(img/td2.png) bottom left repeat-x; }
	.result tr:hover td	{ background:#ffffff; }
	.resultNav			{ border:1px #000000 solid; font-size:10px; padding:4px; background:#eeeeee; border-top:0; text-align:right; }
	.resultNav a		{ font-weight:bold; text-decoration:none; }

	.tbl2				{ border:0px #cccccc solid; margin:0.5em 0 1em 0; border-collapse:collapse; }
	.tbl2 td.lbl		{ border:0px #cccccc solid; font-size:9px; margin:3px; }
	.tbl2 td.val		{ border:0px #cccccc solid; font-size:9px; margin:3px; }

.err			{ color:#cc0000; margin:1em; display:block; }
.note			{ color:#0033cc; margin:1em; display:block; text-decoration:italic; }

form		{ margin:0; }
.lbl, label	{ font-size:11px;	color:#696969;	}
. hier		{ padding-right: 5px;}
.val		{ font-size:11px;	color:#a52a2a;	font-weight:bold;	}
button		{ font-size:11px;	color:#000000;	font-weight:bold;	}
input		{ font-size:10px; } input:focus		{ border:2px #0000ff solid; }
select		{ font-size:10px; } select:focus	{ border:2px #0000ff solid; }
textarea	{ font-size:10px; } textarea:focus	{ border:2px #0000ff solid; }
option		{ font-size:10px; }
input, select, textarea		{ background:#fff url(img/input.png) top left repeat-x; }