@charset "utf-8";

/* CSS Document */



/* reset css */

html, body, div, span, applet, object, iframe,

h1, h2, h3, h4, h5, h6, p, blockquote, pre,

a, abbr, acronym, address, big, cite, code,

del, dfn, em, img, ins, kbd, q, s, samp,

small, strike, strong, sub, sup, tt, var,

b, u, i, center,

dl, dt, dd, ol, ul, li,

fieldset, form, label, legend,

table, caption, tbody, tfoot, thead, tr, th, td,

article, aside, canvas, details, embed, 

figure, figcaption, footer, header, hgroup, 

menu, nav, output, ruby, section, summary,

time, mark, audio, video {

	margin: 0;

	padding: 0;

	border: 0;

	font-size: 100%;

	font: inherit;

	vertical-align: baseline;

}

/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure, 

footer, header, hgroup, menu, nav, section {

	display: block;

}

body {

	line-height: 1;

}

ol, ul {

	list-style: none;

}

blockquote, q {

	quotes: none;

}

blockquote:before, blockquote:after,

q:before, q:after {

	content: '';

	content: none;

}

table {

	border-collapse: collapse;

	border-spacing: 0;

}



/* common app style */

body{

	font-family: "lucida grande", Tahoma, verdana, arial, sans-serif;

	font-size: 12px;

	color: #464646;

	line-height: 1.52em;

}



a{

	color: #1D95D4;

	text-decoration: none;

}



a:hover{

	/*color: #8F8F01;*/

	text-decoration:underline;

}



img a {

	border-style:none;

}



h1, h2, h3, h4, h5{

	font-weight:normal;

	line-height:1em;

	margin:5px 0;

	letter-spacing:-1px;

	font-weight:bold;

}



h1{

	font-size:24px;

}



h2{

	font-size:16px;

}



h3{

	font-size:14px;

}



h4{

	font-size:12px;

}



h5{

	font-size:10px;

}



h1,

h2,

h3,

h4,

h5,

h6,

ol,

table

{

	margin: 5px 0;

}



p {

	margin: 0 0 10px;	

}



ul {

	margin: 0 0 20px 18px;

	list-style:square;

}



ol {

	margin: 0 0 20px 24px;

	list-style-type: decimal;

}



ol ol {

	list-style:upper-alpha;

}



ol ol ol {

	list-style:lower-roman;

}



ol ol ol ol {

	list-style:lower-alpha;

}



ul ul, ol ol, ul ol, ol ul {

	margin-bottom:0;

}



/* useful class */

.alignleft{

	float:left;

}



.alignright{

	float:right;

}



.aligncenter{

	display: block;

	margin-left: auto;

	margin-right: auto;

}



img.alignright{

	margin:0 0 0 1px; 

	width: auto;

}



img.alignleft {

	margin:-2px 5px 0 0; 

	width: auto;

}



img.aligncenter {

	display: block; 

	margin-left: auto; 

	margin-right: auto;

}



img.logout{

	margin:-6px auto;	

}

img.logout:hover{

	cursor:pointer;	

}



.half{

	width:50%;

}



.clear {

	clear:both; 

}







/* let define structure layout */

#head{

	height:66px;

	background:#2d2d2d;

	color:#FFF;

	border-bottom:1px solid #000000;

}



#head h1{

	margin:10px 0 0 0;

	padding:0;

	font-family:arial;	

	clear:both;	

}



#head .description{

	font-size:11px;

	clear:both;

	line-height:normal;

}



/* nama aplikasi dan informasi pendung, kalau dari lagu ... akulah pendukungmu*/



#headline{

	height:38px;

	color:#260F22;

	background:#f1f1f1;	

	border-bottom:1px solid #d1d1d1;

}





#sidebar{

	float:left;

	width:200px;

	margin-right:30px;

	padding:0 12px;

	background:#f1f1f1;		

}



/* list menu d bagian sidebar */

#sidebar h2{

	margin-top:15px;

}



#sidebar ul, #sidebar ol{

	margin:0;

	padding:0;

}



#sidebar ul li{

	list-style-type:none;

	list-style-image:none;

	border-bottom:1px solid #dedede;

	padding:5px 0;

}



#sidebar p{

	margin: 10px 0;

	padding:0;

}

	



#foot{

	width:860px;

	color:#CCC;

	margin:10px auto;

	padding:5px 0;

	border-top: 1px dotted #DEDEDE;

	line-height:1.3em;

	text-align:right;

	clear:both;

}



/* form input */

input[type=text], input[type=password], input[type=file], textarea{	

	color: #464646;

	border:1px solid #B4CED9;

	padding:3px;

	margin: auto;

	font-family: "lucida grande", Tahoma, verdana, arial, sans-serif;			

}



textarea{

	font-size:12px;

}



input[type=text]:focus, input[type=password]:focus, input[type=file]:focus, textarea:focus, select:focus{	

	border: 1px solid #4D90FE; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) inset; outline: medium none;	

}



input[type=button], input[type=submit], input[type=reset]{

	background:#3b9000;

	color:#FFF;

	border:1px solid #3b9000;

	text-decoration:none;

	padding:3px 10px !important;

	cursor:pointer;	

	font-family: "lucida grande", Tahoma, verdana, arial, sans-serif;

}



input[type=checkbox]{

	margin:2px auto 0 auto;

}	



select{

	color: #464646;

	padding:2px;

	border:1px solid #B4CED9;

	font-family: "lucida grande", Tahoma, verdana, arial, sans-serif;	

}



input[type=text][disabled=disabled], select[disabled=disabled]{

	background:#dedede;

}



/* table class */

.tableform{

	width:100%;

	clear:both;

}



.tableform th{

	border-bottom:1px solid #dedede;

	font-weight:bold;

	text-align:center;

	padding:3px 0;

}



.tableform td{

	border-bottom:1px solid #dedede;	

	padding:3px 0;	

}



.tablelist{

	width:100%;

	clear:both;

}



.tablelist th{

	border-bottom:1px dotted #dedede;

	font-weight:bold;

	text-align:center;

	padding:3px 0;

	background:#EFEFEF;	

}



.tablelist td{

	border-bottom:1px dotted #dedede;	

	padding:3px 0;	

}



.tablelist tr:hover{

	background:#EFEFEF;

}



.tableview{

	border:1px solid #dedede;

	border-collapse:collapse;

	clear:both;

}



.tableview th{

	background:#efefef;

}



.tableview th, .tableview td{

	border: 1px solid #dedede;

	padding:3px;

}



.tableview td{

	vertical-align:top;

	word-spacing:normal;

}



/* notification */	

#message{

	overflow: hidden;

	width: 100%;

	text-align: center;

	position: absolute;

	top: 0;

	left: 0;

	padding: 3px 0;	

	height: 0;	

	opacity: .9;

}



.success {

	background:#d4f684;

	border-bottom:1px solid #739f1d;	

}



/* load data */

/**********************************************

	box to load data 

***********************************************/



#box2{

	margin:5px 0px;

	height:400px; 

	border:1px solid #dedede; 

	overflow:auto; 

	clear:both

}



.box2inside{

	margin:5px

}



.dataload{

	width:100%; 

	background:url(../../images/loading_large.gif) no-repeat center bottom; 

	height:32px; 

	margin-top:135px;

}



.error{	

	float: left !important;

	clear: both;

	color:red;		

}