* { padding:0; margin:0;}

/* ============ */
/* 	   FORM     */
/* ============ */

.myform { width:510px; padding: 0 10px 20px 10px; margin: 0 10px; }
.mybook { width:380px; height: 580px; padding: 0 10px 20px 10px; margin: 10px auto; background-color:#FFF; }
.myholiday { width:380px; padding: 0 10px 20px 10px; margin: 0 10px; }
.myplan { width:918px; padding: 10px 10px 20px 10px; margin: 0 10px; }
.mylist { width:920px; padding: 0 10px 20px 10px; margin: 0 10px; }
.myreport { width:920px; padding: 0 10px 20px 10px; margin: 0 10px; }

.myform h2, .mybook h2, .myplan h2, .mylist h2, .myreport h2, .myholiday h2 {
	/*border-bottom:solid 1px #b7ddf2;*/
	border-bottom:1px dotted #DFDFDF;
	color:#3363A1;	
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:bold;
	margin:10px 0;
	text-transform:uppercase;	
	}
	

/* =========== */
/* FORM LAYOUT */
/* =========== */

.formLayout {
	/*background-color: #f3f3f3;
	border: solid 1px #a1a1a1;*/
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	margin:auto;
	padding:5px;
	width:480px;
	}
.formLayout label {
	display:block;
	float:left;
	font-weight:bold;
	margin-left:10px;
	margin-right:5px;
	text-align:left;
	width:160px;
	}
.formLayout label#mylabel {
	display:block;
	float:left;
	font-weight:normal;
	margin-left:0px;
	text-align:left;
	width:300px;
	}


/* ========== */
/* DIV LAYOUT */
/* ========== */

#leftcol {
	clear:left;
	display:block;
	float:left;	
	text-align:left;
	width:45%;
	}
#rightcol {
	clear:right;
	display:block;
	float:right;
	text-align:right;
	width:45%;
	}	
#main-left {	
	clear:left;
	display:inline;
	float:left;	
	margin:0;
	padding-right:10px;
	text-align:justify;
	width:520px;
	}
#main-right {	
	clear:right;	
	display:inline;
	float:right;
	margin:0;
	padding-right:20px;
	text-align:justify;
	width:350px;
	}

#rightdiv {
	clear:left;
	display:block;
	float:right;	
	text-align:right;
	width:100%;
}

/* =============================== */
/* INPUT, SELECT, TEXTAREA, BUTTON */
/* =============================== */

input, select, textarea, 
.txtL, .txtM, .txtS, .cmbL, .cmbM, .cmbS, .cmbX {
	color:#333333;
	background:#F7F7F7;
	border:1px solid #CCCCCC;
	display:inline-block;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	padding:6px 4px; 
	}
textarea { width:280px; height:50px; resize:none; }

.txtL { width:280px; } 
.txtM { width:200px; }  
.txtS { width:80px;  } 
.cmbL { width:290px; } 
.cmbM { width:180px; }   
.cmbS { width:90px;  } 
.cmbX { width:50px;  } 

input:focus, select:focus, textarea:focus {
	color:#333333;
	background:#fff;
	border:1px solid #b7ddf2; 
	}
input#mybutton, input#othertbutton, input#checkbutton, input#logbutton {
	clear:both;	
	color:#3C3C46;
	cursor:pointer;
	background-color:white;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:bold;
	outline:none;
	padding:8px 4px;
	text-align:center;
	width:90px;
	}
input#mybutton { float:left; margin-left:190px;	}
input#othertbutton { float:left; margin-left:120px; }
input#checkbutton { float:left; margin-top:10px; }
input#logbutton { float:left; margin-left:170px; }
input#findbutton { 
	clear:both;
	color:#3C3C46;
	cursor:pointer;
	background-color:white;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:bold;
	outline:none;
	padding:6px 4px;
	text-align:center;
	width:90px;
	}
input#mybutton:hover, input#othertbutton:hover, 
input#checkbutton:hover, input#findbutton:hover, 
input#logbutton:hover {
	background-color: #3363A1;
	border:1px solid #b7ddf2;
	color: white;
	}
	

/* ========== */
/* VALIDATION */
/* ========== */

.error, .success {	
	margin:0;
	padding:3px 5px 5px 30px;
	background-position:0px 0;
	background-repeat:no-repeat;
	}
.error { background-image:url('../images/ic-error.png'); color:#d93e39; }
.success { background-image:url('../images/ic-success.png'); color:#488e1b; }

.attention_orgbox {	
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	border:1px solid #f2c779;
	margin:5px 0px;
	padding:15px 15px 15px 50px;
	color:#ed7c18;
	background-color:#fff8c4;
	background-repeat:no-repeat;
	background-position:10px center;	
	background-image:url('../images/org-attention.png');
	text-align:justify;
	}
	
.attention_redbox {	
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	border:1px solid #f7b3b1;
	margin:5px 0;
	padding:10px 15px 10px 50px;
	color:#d93e39;
	background-color: #fff1f1;
	background-repeat: no-repeat;
	background-position: 10px center;	
	background-image: url('../images/red-attention.png');
	text-align:justify;
	}

.checkpost { 
	padding:0 10px 10px 30px;
	color:#555;
	background-repeat: no-repeat;
	background-position: 0px 3px;	
	background-image: url('../images/ic-info.png');
	text-align:justify;
 	}
	
/* ============ */
/* LABEL STATUS */
/* ============ */

.red { color: #d93e39; }
.green { color: #4F8A10; }
.blue { color: #0099FF; }
.bluehighlight { color: #0099FF; background-color:#FFFF99; }
.orange { color:#FF6600; }

.bold {
	display:block;
	float:left;
	font-weight:bold;
	text-align:justify;
	width:120px;
	}
	
/*a:link, a:visited { color:#3363A1; text-decoration:none; }
a:hover { color: #EF8116; text-decoration:none; }*/

/* ========== */
/* TABLE BOOK */
/* ========== */

#table {
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	border: 1px solid #DFDFDF;
	border-radius: 0px;
	border-spacing: 0px;
  	border-collapse:collapse;
	background-color: #F9F9F9;
	float:left;	
	margin-bottom:5px;
	width:100%; 	
	}
#table th {
	color:#FFF;
	background-color:#3363A1;
	border:none;
	font-weight:bold;
	padding:5px 10px;
	text-align:left;	
	}
#table td {
	color:#555;
	background-color:#F9F9F9;
	font-weight:normal;
	padding:5px 8px 5px;
	vertical-align:top; 
	}
#table td#mywhite {
	color:#555;
	background-color:#fff;
	border: 1px solid #fff;
	font-weight:normal;
	padding:5px 8px 5px;
	vertical-align:top; 
	}
#table tr:hover td#mytd { background: #fff; }
#table td#mytd { 
	color:#555;
	background-color:#F9F9F9;
	border-bottom: 1px solid #DFDFDF;
	font-weight:normal;
	padding:5px 8px 5px;
	vertical-align:top; 
	}


/* ============== */
/* PLANNER LAYOUT */
/* ============== */

#column-1 {
	/*background:#fff;*/
    float:left;    
    padding:0 10px;
	margin-top:10px;
	margin-bottom:10px;    
	width:100px;
	}
#column-2 {
	/*background:#fff;*/
	/*border-top:2px solid #3363A1;*/
    float:left;
    width:355px;
    padding:0 10px;
	margin-top:10px;    
	}
#column-3 {
	/*background:#fff;*/
	/*border-top:2px solid #3363A1;*/
    float:left;
    padding:0 10px;
	margin-top:10px;    
	width:355px;
	}
	
#todaytitle {
    float:left;
    width:300px;
	padding-right:5px;
	/*text-align:left;*/
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:bold;
	}
	
#prev { float:left; width:20px; }
#prevtitle {
    float:left;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:bold;
	padding-right:5px;
	text-align:center;
	width:150px;
	}
	
#next { float:right; width:20px; }
#nexttitle {
    float:right;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:bold;
	padding-right:5px;
	text-align:center;
	width:150px;
	}
	
#off { 
	float:left; 
	filter:alpha(opacity=20);
	-moz-opacity:0.2;
	-khtml-opacity: 0.2;
	opacity: 0.2;
	width:20px; 
	}	

	
		
.alldate {		
	clear:both;	
	background: url(../images/day_grey_100.png) top no-repeat; 
	/*border:1px solid #c8c9cb;*/
	width: 100px; 
	height: 100px; 

	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
 
    -moz-box-shadow: 2px 2px 2px #cccccc;
    -webkit-box-shadow: 2px 2px 2px #cccccc;
    box-shadow: 2px 2px 2px #cccccc;
	}
.dayname {
	color:#FFF;
	display:block;
	/*font-weight:bold;*/
	font:12px Arial, Helvetica, sans-serif; 
	text-align:center;	 
	padding:6px;
	height:15px; 
	}
.day { 
	color: #2b2b2b;
	display:block;
	font:50px Arial, Helvetica, sans-serif;
	font-weight:bold; 
	text-align:center;
	width:100px; 
	height:50px;
	z-index:999;
	clear:left; 
	}
.month { 
	color: #2b2b2b;
	display:block;
	font:11px Arial, Helvetica, sans-serif;
	padding-top:2px;
	text-align:center;
	text-transform:uppercase;
	width:100px; 
	height:20px;
	}
.today { color:#0081cb; }	
	
.event-box {
	border:1px solid #bae2f0;
	background:#EAF4F5;
	padding:10px 10px 10px 10px;
	margin-bottom:10px;
	
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	}
.holiday-box {
	border:1px solid #c8c9cb;
	/*background:#F9F9F9;*/
	background:#ecedef;
	padding:10px 10px 10px 10px;
	margin-bottom:10px;
	
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	}

/* ============= */
/* PLANNER TABLE */
/* ============= */

#tblplanner {
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	border-radius:0px;
	border-spacing:0px;
  	border-collapse:collapse;
	padding-top:10px;
	width:100%; 	
	}
#tblplanner th {
	color:#fff;
	background-color:#3363A1;
	/*font-family:Verdana, Arial, Helvetica, sans-serif;*/
	/*font-size:1.0em;*/
	/*font-weight:bold;*/
	padding:5px 8px 5px;
	text-align:left;
	line-height:1.3em;
	}
#tblplanner td {
	color:#555;
	background-color:#F9F9F9;
	border-bottom: 1px solid #DFDFDF;
	/*font-size:1.0em;*/
	font-weight:normal;
	padding:5px 8px 5px;
	vertical-align:top; 
	}
#tblplanner tr:nth-child(even) td { background-color:#f9f8f4; }
#tblplanner tr:nth-of-type(odd) td { background-color:#F9F9F9; }
/*#tblplanner tr:hover td { background: #FFF; }*/
#scrolling { 
	width: 915px; 
	/*height:580px; 
	overflow-y:scroll;*/ 
	border:1px solid #DFDFDF; 
	}


/* ========== */
/* TABLE LIST */
/* ========== */

#tbllist {
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	border: 1px solid #DFDFDF;
	border-radius: 0px;
	border-spacing: 0px;
  	border-collapse:collapse;
	background-color: #F9F9F9;
	padding-top:10px;
	width: 100%; 
	}
#tbllist th {	
	color:#fff;
	border:none;
	background-color:#3363A1;
	font-weight:bold;
	font-size:11px;
	padding:5px 8px 5px;
	text-align:left;
	line-height:1.3em;
	vertical-align:top;
	}
#tbllist td {	
	color:#555;
	background-color:#F9F9F9;
	border-bottom: 1px solid #DFDFDF;
	font-weight:normal;
	font-size:11px;
	padding:4px 8px 4px;
	text-align:left;
	vertical-align:top;
	}	
#tbllist tr:hover td { background: #fff; }
#tbllist tr:hover td#blue { background:#EAF4F5; }
#tbllist img { padding-top:4px; vertical-align:middle; }

/* =============== */
/* PAGE PAGINATION */
/* =============== */

ul { border:0; margin:0; padding:0; }
#pagination-flickr li {
	border:0; margin:0; padding:0;
	font-size:11px;
	list-style:none;
	}
#pagination-flickr a { border:solid 1px #DFDFDF; margin-right:2px; }
#pagination-flickr .previous-off, 
#pagination-flickr .next-off {
	color:#666666;
	display:block;
	float:left;
	/*font-weight:bold;*/
	padding:3px 4px;
	}
#pagination-flickr .next a, 
#pagination-flickr .previous a {
	/*font-weight:bold;*/
	border:solid 1px #DFDFDF;
	}
#pagination-flickr .active {
	color:#ff0084;
	border-top:solid 1px #ff0084;
	border-bottom:solid 1px #ff0084;
	font-weight:bold;
	display:block;
	float:left;
	margin-right:2px;
	padding:3px 6px;
	}
#pagination-flickr a:link, 
#pagination-flickr a:visited {
	color:#0063e3;
	display:block;
	float:left;
	padding:3px 6px;
	text-decoration:none;
	}
#pagination-flickr a:hover { border:solid 1px #666666; }
#pagination-flickr .totpages {
	color:#666666;
	display:block;
	float:right;
	font-weight:normal;
	padding:4px 4px;
	}


/* ========== */
/* SCROLL HOZ */
/* ========== */

#scrollhoz {
	width:850px;
	overflow:auto;
	overflow-y:hidden;
	/*border-right:1px solid #DFDFDF;*/
	float:left;
}

/* ============== */
/* TABLE REPORT 1 */
/* ============== */

#tblreport {
	color: #333;
	background-color: #F9F9F9;
	border-top: 1px solid #DFDFDF;
	border-bottom: 1px solid #DFDFDF;
	border-right: 1px solid #DFDFDF;
	border-left:none;
	border-spacing: 0px;
  	border-collapse: collapse;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	float:left;
	margin:0 auto;
	width:850px; 
}

#tblreport td, #tblreport th {
	border-bottom: 1px solid #DFDFDF;
}
#tblreport th {
	color: #fff;
	background-color:#3363A1;
	border-bottom: 1px solid #DFDFDF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
	padding: 5px;
	text-align: center;
	line-height: 1.3em;	
}
#tblreport th.total {
	color: #fff;
	background-color:#4a4a63;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
	padding: 5px;
	text-align: center;
	line-height: 1.3em;	
}
#tblreport td {
	color: #333;
	background-color: #F9F9F9;/*#ebf4fb;*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 11px;
	padding: 5px;
	text-align:center;
	vertical-align: top;
}
#tblreport td.total1 {
	color: #333;
	background-color: #ebf4fb;/*#d6e9ed;*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
	padding: 5px;
	text-align:center;
	vertical-align: top;	
}
#tblreport td.total2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
	padding: 5px;
	vertical-align: top;
	color: #333;
	background-color: /*#a6cac9;*/#dbedfb;/*#d6e9ed;*/
	text-align:center;
}

#tblreport td.total3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
	padding: 5px;
	vertical-align: top;
	color: #333;
	background-color: #a6cac9;
	text-align:center;
}

#tblreport td, th {
	border-left: 1px solid #DFDFDF;
	border-right: 1px solid #DFDFDF;
}
#tblreport td:first-child, th:first-child { border-left: none; }
#tblreport td:last-child, th:last-child { border-right: none; }
/*#tblreport td:hover { background: #e3c44f; }*/


/* ============== */
/* TABLE REPORT 2 */
/* ============== */

#tblrptAll {
	color: #333;
	background-color: #F9F9F9;
	border-top: 1px solid #DFDFDF;
	border-bottom: 1px solid #DFDFDF;
	border-right: 1px solid #DFDFDF;
	border-left:none;
	border-spacing: 0px;
  	border-collapse: collapse;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	float:left;
	margin:0 auto;
	width:1500px; 
}

#tblrptAll td, #tblrptAll th {
	border-bottom: 1px solid #DFDFDF;
}
#tblrptAll th {
	color: #fff;
	background-color:#3363A1;
	border-bottom: 1px solid #DFDFDF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
	padding: 5px;
	text-align: center;
	line-height: 1.3em;	
}
#tblrptAll th.total {
	color: #fff;
	background-color:#4a4a63;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
	padding: 5px;
	text-align: center;
	line-height: 1.3em;	
}
#tblrptAll td {
	color: #333;
	background-color: #F9F9F9;/*#ebf4fb;*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 11px;
	padding: 5px;
	text-align:center;
	vertical-align: top;
}
#tblrptAll td.total1 {
	color: #333;
	background-color: #ebf4fb;/*#d6e9ed;*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/*font-weight: bold;*/
	font-size: 11px;
	padding: 5px;
	text-align:center;
	vertical-align: top;	
}
#tblrptAll td.total2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
	padding: 5px;
	vertical-align: top;
	color: #333;
	background-color: /*#a6cac9;*/#dbedfb;/*#d6e9ed;*/
	text-align:center;
}
#tblrptAll td.total3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
	padding: 5px;
	vertical-align: top;
	color: #333;
	background-color: #a6cac9;
	text-align:center;
}
#tblrptAll td, th { border-left: 1px solid #DFDFDF; border-right: 1px solid #DFDFDF; }
#tblrptAll td:first-child, th:first-child { border-left: none; }
#tblrptAll td:last-child, th:last-child { border-right: none; }


/* ====================== */
/* TABLE REPORT-FIXED COL */
/* ====================== */

#tblfixedcol {
	width:70px; 
	border-left: 1px solid #DFDFDF;
	border: 1px solid #DFDFDF;
	border-spacing: 0px;
  	border-collapse: collapse;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #333;
	background-color: #F9F9F9;
	margin:0 auto;
	float:left;
	}
#tblfixedcol td, #tblfixedcol th {
	border-top-color: white;
	border-bottom: 1px solid #DFDFDF;
	}
#tblfixedcol th {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
	padding: 5px;
	text-align: center;
	line-height: 1.3em;
	color: #fff;
	background-color:#3363A1;
	}
#tblfixedcol th.tahun {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
	padding: 5px;
	text-align: center;
	line-height: 1.3em;
	color: #fff;
	background-color:#939aab;
	}
#tblfixedcol td {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
	padding: 5px;
	vertical-align: top;
	color: #fff;
	background-color:#3363A1;
	text-align:center;
	}
#tblfixedcol td.total {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
	padding: 5px;
	vertical-align: top;
	color: #fff;
	background-color:#4a4a63;
	text-align:center;
	}

/* ================== */
/* TABLE REPORT-TITLE */
/* ================== */

#tbltitle {
	width:920px; 
	border-top: 1px solid #DFDFDF;
	border-left: 1px solid #DFDFDF;
	border-right: 1px solid #DFDFDF;
	border-bottom:none;
	border-spacing: 0px;
  	border-collapse: collapse;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #333;
	background-color: #F9F9F9;
	margin:0 auto;
	float:left;
	}

#tbltitle td {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
	padding: 5px;
	vertical-align: top;
	color: #fff;
	background-color:#5a5a5c; /*#4a4a63;*/
	text-align:center;
	}