body,td,a,p{
	font-family:arial,sans-serif;
	font-size:12px;
}
body{
	padding:0;
	margin:0;
}
table#wrapper{
	border-collapse:collapse;
}
table#wrapper td.wrapper{
	background:#000000 url(../images/bgcloud.gif);
	text-align:center;
	padding-top:10px;
	vertical-align:top;
}
#login{
	margin:0 auto;
	text-align:left;
	width:500px;
	//background-color:#c93a1c;
	padding:12px;
}
form{
	margin:0;
	padding:0;
}
#login form {
	margin:0;
	padding:20px 0 0 10px;
	height:180px;
/*
	background:#c93a1c url(../images/bgformlogin.jpg) repeat-x;
*/
}
#login form label{
	display:block;
}
#login form div{
	height:180px;
	width:450px;
	color:#fff;
	background:transparent url(../images/today.png) no-repeat;
}
#login form table{
	margin-left:270px;
}
#login input.txt{
	border:1px solid #db8844;
	background-color:#333333;
	color:#fff;
	padding:6px 3px;
	width:200px;
}
input[type="submit"],input[type="button"]{
	border-color:#D66A3B #D66A3B #8F1F08 #8F1F08;
	border-style:solid;
	background-color:#B7371C;
	border-width:1px;
	margin-top:4px;
	padding:3px 6px;
	color:#fff;
}
div.btn_pencil{
	background:transparent url(../images/edit_icon.gif) no-repeat;
	width:21px;
	height:21px;
	cursor:pointer;
}
td.btn_pencil{
	width:21px;
	height:21px;
}
div#user-wrapper{
	margin:0 auto;
}
div#user-wrapper table{
	border-collapse:collapse;
}
div#user-wrapper table.user-table tr td{
}
div#user-wrapper div.user-menu{
	height:48px;
	background-color:#c93a1c;
	text-align:left;
}
div#user-wrapper div.user-content{
	height:auto !important;
  min-height:300px;  
  height:300px;
  background-color:#fff;
}
div#user-wrapper div.user-menu ul{
	margin:0;
	padding:0;
	height:40px;
}
div#user-wrapper div.user-menu ul li{
	float:right;
	list-style:none;
	margin-top:20px;
}
div#user-wrapper div.user-menu ul li.time{
	color:#fff;
	line-height:25px;
	height:25px;
	padding:0 4px;
}
div#user-wrapper div.user-menu ul li a{
	display:block;
	line-height:25px;
	height:25px;
	margin:0 3px;
	background-color:#ac2204;
	color:#f5ba5c;
	padding:2px 5px 0 5px;
	font-weight:bold;
	text-decoration:none;
}
div#user-wrapper div.user-menu ul li a:hover{
	color:#fcfecc;
}
div#user-wrapper div.user-menu table tr td{
	padding:0;
	margin:0;
}
div.user-content{
	margin:10px;
	text-align:left;
}
td.user-content{
	background-color:#fff;
}
div.logo{
	position:absolute;
	width:113px;
	height:61px;
	background:transparent url(../images/todaysmall.png) no-repeat;
	display:none;
}
div#user-wrapper div.user-menu ul li a.active{
	background-color:#fff;
	color:#C93A1C;
}
div.todaytimer{
	float:right;
	width:249px;
	height:48px;
	text-align:right;
}
div#servertime{
	color:#ffffff;
	font-weight:bold;
	font-size:14px;
	margin:5px 5px 0 0;
}
div#myname{
	color:#ffffff;
	font-size:11px;
	margin-right:5px;
}
div.today_msg{
	text-align:center;
	background-color:#FCEEA8;
	padding:3px 0;
	margin:2px 0;
}
div#announcement{
	background-color:#000;
	color:#fff;
	margin:1px 0;
	padding:4px 0;
}
div#announcement a.baru{
	font-weight:bold;
	color:#fff;
	text-decoration:blink;
}
div#announcement a{
	color:#eee;
	text-decoration:underline;
}
div#announcement a:hover{
	text-decoration:none;
}
div#myscores{
	padding:5px 0;
}
div#myscores table{
	border-collapse:collapse;
}
td.myscoresn{
	font-size:10px;
}
td.myscoresv{
	font-size:24px;
	font-weight:bold;
	background-color:#EBEBEB;
	height:40px;
	margin:0 4px;
	border:1px solid #ffffff;
}

/** attendance **/
div.user-attendance{
	margin:5px 0;
}
div.user-attendance-tool{
	
}
div.user-attendance-tool ul{
	list-style-type:none;
	padding:0;
	margin:0;
	border-bottom:1px solid #C93A1C;
	height:24px;
}
div.user-attendance-tool ul li{
	float:left;
}
div.user-attendance-tool ul li a{
	margin:0px 4px;
	display:block;
	float:left;
	text-decoration:none;
	background-color:#FCEEA8;
	color:#C93A1C;
	height:24px;
	line-height:24px;
	padding:0 5px;
}
div.user-attendance-tool ul li a.active{
	background-color:#C93A1C;
	color:#fff;
}
div.user-attendance-tool ul li a:hover{
	
}
div.user-attendance-tool-form{
	border-width:0 1px 1px;
	border-color:#C93A1C;
	border-style:solid;
	padding:4px;
}
div.user-attendance-tool-form table{
	border-collapse:collapse;
}
div.user-attendance-tool-form table td{
	text-align:left;
}
div.user-attendance-tool-form table.tbl{
	width:100%;
	border-collapse:collapse;
	border-width:1px 0px 0px 1px;
	border-color:#BDBDBD;
	border-style:solid;
}
div.user-attendance-tool-form table.tbl tr th{
	text-align:center;
	background-color:#E6E6E6;
	padding:6px 8px;
}
div.user-attendance-tool-form table.tbl thead tr th,
div.user-attendance-tool-form table.tbl tbody tr td{
	border-width:0px 1px 1px 0px;
	border-color:#BDBDBD;
	border-style:solid;
}
div.user-attendance-tool-form table.tbl tbody tr td{
	padding:3px 8px;
}
div.user-attendance table{
	border-collapse:collapse;
	width:100%;
}
div.user-attendance-remarks-active{
	text-align:center;
	background-color:#45C0E7;
}
div.user-attendance-remarks-active div.rem{
	display:block;
	background-color:#2498bd;
	padding:5px 10px;
	font-weight:bold;
	color:#fff;
	height:20px;
	line-height:20px;
}
div.user-attendance-remarks-active div.timer{
	font-size:5em;
	color:#fff;
	line-height:100px;
}
div.user-attendance-remarks-active div.note{
	font-size:11px;
	color:#fff;
	line-height:17px;
}
div.user-attendance-remarks-inactive{
	background-color:#EEF0EE;
	text-align:center;
}
div.user-attendance-remarks-inactive div.rem{
	display:block;
	background-color:#ddd;
	padding:5px 10px;
	font-weight:bold;
	color:#ccc;
	height:20px;
	line-height:20px;
}
div.user-attendance-remarks-inactive div.timer{
	font-size:5em;
	color:#f5ba5c;
	line-height:100px;
}
div.user-attendance-remarks-inactive div.note{
	font-size:11px;
	color:#fff;
	line-height:17px;
}
div.user-attendance-remarks-late{
	background-color:#C93A1C;
	text-align:center;
}
div.user-attendance-remarks-late div.rem{
	display:block;
	background-color:#990011;
	padding:5px 10px;
	font-weight:bold;
	color:#fff;
	height:20px;
	line-height:20px;
}
div.user-attendance-remarks-late div.timer{
	font-size:5em;
	color:#fff;
	line-height:100px;
}
div.user-attendance-remarks-late div.note{
	font-size:11px;
	color:#fff;
	line-height:17px;
}
div.user-attendance-remarks-ontime{
	background-color:#36B52F;
	text-align:center;
}
div.user-attendance-remarks-ontime div.rem{
	display:block;
	background-color:#007700;
	padding:5px 10px;
	font-weight:bold;
	color:#fff;
	height:20px;
	line-height:20px;
}
div.user-attendance-remarks-ontime div.timer{
	font-size:5em;
	color:#fff;
	line-height:100px;
}
div.user-attendance-remarks-ontime div.note{
	font-size:11px;
	color:#fff;
	line-height:17px;
}
div.user-attendance-remarks-normal{
	background-color:#36B52F;
	text-align:center;
}
div.user-attendance-remarks-normal div.rem{
	display:block;
	background-color:#007700;
	padding:5px 10px;
	font-weight:bold;
	color:#fff;
	height:20px;
	line-height:20px;
}
div.user-attendance-remarks-normal div.timer{
	font-size:5em;
	color:#fff;
	line-height:100px;
}
div.user-attendance-remarks-normal div.note{
	font-size:11px;
	color:#fff;
	line-height:17px;
}
div.user-attendance-remarks-early{
	background-color:#36B52F;
	text-align:center;
}
div.user-attendance-remarks-early div.rem{
	display:block;
	background-color:#007700;
	padding:5px 10px;
	font-weight:bold;
	color:#fff;
	height:20px;
	line-height:20px;
}
div.user-attendance-remarks-early div.timer{
	font-size:5em;
	color:#fff;
	line-height:100px;
}
div.user-attendance-remarks-early div.note{
	font-size:11px;
	color:#fff;
	line-height:17px;
}
a.user-attendance-tick,
a.user-attendance-inactive,
a.user-attendance-active,
a.user-attendance-late,
a.user-attendance-ontime,
a.user-attendance-normal,
a.user-attendance-early{
	display:block;
	width:147px;
	height:147px;
}
a.user-attendance-active{
	background:transparent url(../images/tick5.png) no-repeat 0 0;
}
a.user-attendance-active:hover{
	background:transparent url(../images/tick5.png) no-repeat 0 -147px;
}
a.user-attendance-inactive{
	background:transparent url(../images/tick5.png) no-repeat 0 -294px;
}
a.user-attendance-late{
	background:transparent url(../images/tick5.png) no-repeat 0 -588px;
}
a.user-attendance-ontime{
	background:transparent url(../images/tick5.png) no-repeat 0 -441px;
}
a.user-attendance-normal{
	background:transparent url(../images/tick5.png) no-repeat 0 -441px;
}
a.user-attendance-early{
	background:transparent url(../images/tick5.png) no-repeat 0 -441px;
}
div.attendance-note{
	background-color:#ECEFF5;
	margin-bottom:1px;
}
div.attendance-note-nub{
	background:transparent url(../images/ext.png) no-repeat 0 0;
	height:5px;
	margin:0 0 0 17px;
	overflow:hidden;
	width:9px;
	text-align:left;
}
div.attendance-note div{
	text-align:left;
}
div.attendance-note div span{
	margin:4px;
}
div.attendance-note div span.datenote{
	font-size:10px;
	color:#aaa;
	margin-top:3px;
	display:block;
}
div.attendance-note div span.datenote a{
	text-decoration:none;
	font-size:10px;
	color:#aaa;
}
div.attendance-note div span.datenote a:hover{
	color:#00a;
	text-decoration:underline;
}
div.attendance-note input[type="text"]{
	color:#ccc;
	border:1px solid #ccc;
	padding:3px;
}
div.attendance-note textarea{
	border:1px solid #ccc;
	padding:3px;
}

/** timesheet **/
#suggestions{
	position:absolute;
	z-index:999;
	width:525px;
	background:#fff;
	border:1px solid #887A2E;
	color:#000;
	padding:5px 5px 5px 5px;
	display:none;
}
.suggestionList {
	margin: 0px;
	padding: 0px;
}
.suggestionList .listcom {
	margin: 0px 0px 3px 0px;
	padding: 3px;
	cursor: pointer;
}
.suggestionList .listcom:hover {
	background-color: #FFE763;
}
input#inputString {
	background-color:transparent;
	border:medium none;
	color:#887A2E;
	width:100%;
	padding:2px 0px 2px 10px;
}
div.timesheet_newbutton{
	background-color:#DBE4ED;
	cursor:pointer;
	height:21px;
	text-align:center;
	width:75px;
	padding:0 6px;
	z-index:101;
}
div.timesheet_newbutton a{
	color:#000;
	display:block;
	text-decoration:underline;
}
div.timesheet_print {
	left:392px;
}
div.timesheet_others {
	left:492px;
	margin:0px;
}
div.timesheet_opened{
	border-width:1px;
	border-color:#000 #000 #DBE4ED #000;
	border-style:solid;
	margin:0 -1px 1px;
}
div#timesheet_other_employee{
	width:200px;
	height:200px;
	position:absolute;
	left:300px;
	top:200px;
	background-color:#DBE4ED;
	z-index:3;
	overflow:auto;
	border:1px solid #000;
}
div#timesheet_other_employee div{
	margin:4px 0px 4px 4px;
}
div#timesheet_other_employee div table.tbl_timesheet_others{
	border-collapse:collapse;
	width:100%;
}
div#timesheet_other_employee div table.tbl_timesheet_others td a{
	display:block;
	text-decoration:none;
	padding:4px 0px 4px 3px;
	color:#000;
}
div#timesheet_other_employee div table.tbl_timesheet_others td a:hover{
	background-color:#C2D5FC;
}

/** change password **/
table.tblform {
	border-collapse:collapse;
}
table.tblform td {
	text-align:left;
	padding:2px;
}
#msg{
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	padding:5px 0;
}