@charset "utf-8";
/* CSS Document */

body {
	background:#EEE;
	font-family:Tahoma, Geneva, sans-serif;
	font-size:12px;
	padding:0;
	margin:0;
}

input[type="text"], input[type="password"], select, textarea {
	font-family:Tahoma, Geneva, sans-serif;
	font-size:12px;
	padding:5px;
	border:1px solid #CCC;
}
	
	input[type="text"]:hover, input[type="password"]:hover, select:hover, textarea:hover {
		border:1px solid #333;
	}
	
	input[type="text"]:focus, input[type="password"]:focus, select:focus, textarea:focus {
		border:1px solid #333;
		box-shadow:0px 0px 3px #666666 inset;
	}

input[type="submit"] {
	background:#426CFF url(images/button-save.png) 5px 5px no-repeat;
	border:1px solid #03F;
	padding:5px 10px 5px 23px;
	font-weight:bold;
	color:#FFF;
	cursor:pointer;
}

	input[type="submit"]:hover {
		background:#09F url(images/button-save.png) 5px 5px no-repeat;
	}
	
	input[type="submit"]:active {
		background:#03F url(images/button-save.png) 5px 5px no-repeat;
		box-shadow:0px 0px 3px #555;
	}

#container {
	margin:0 auto;
}

#header {
	background-color:#300505;
	padding:10px 20px;
	color:#FFF;
}

	#header #logo {
		float:left;
	}
	
	#header #info {
		float:right;
		background-color:#000;
		padding:10px 5px;
		width:230px;
		border-radius:10px;
		box-shadow:0px 0px 10px #9DB4FF inset;
		line-height:16px;
	}

		#header #info img {
			float:left;
			border:none;
			margin:0px 5px;
			width:46px;
			height:46px;
			border-radius:46px;
			border:2px solid #000;
			box-shadow:0px 0px 2px #999999;
		}
	
	#header a {
		color:#CCC;
	}

#menu {
	background:url(images/bg-menu.png) repeat-x;
	text-align:center;
	margin-bottom:20px;
}

	#menu img {
		margin:0 5px -3px -2px;
	}

	#menu a {
		background:url(images/bg-menu-link.png) repeat-x;
		display:inline-block;
		padding:9px 20px;
		color:#000;
		font-weight:bold;
		text-decoration:none;
		margin-left:-2px;
		margin-right:-2px;
	}
	
		#menu a.left {
			border-top:1px solid #999;
			border-bottom:1px solid #999;
			border-left:1px solid #999;
			border-top-left-radius:15px;
			border-bottom-left-radius:15px;
		}
		
		#menu a.center {
			border-top:1px solid #999;
			border-bottom:1px solid #999;
			border-left:2px groove #CCC;
		}
		
		#menu a.right {
			border-top:1px solid #999;
			border-bottom:1px solid #999;
			border-right:1px solid #999;
			border-left:2px groove #CCC;
			border-top-right-radius:15px;
			border-bottom-right-radius:15px;
		}
		
		#menu a:hover {
			background:url(images/bg-menu-link-hover.png) repeat-x;
		}
		
		#menu a.selected {
			background:url(images/bg-menu-link-hover.png) repeat-x;
		}

#shortcut {
	text-align:center;
}

	#shortcut a {
		background:#FFF;
		display:inline-block;
		border:1px solid #999;
		height:85px;
		width:85px;
		text-align:center;
		color:#444;
		text-decoration:none;
		padding:5px;
		margin:0px 5px;
		box-shadow:1px 1px 3px #CCC;
	}
	
		#shortcut a:hover {
			box-shadow:0px 0px 5px #555;
		}

#content {
	margin:20px;
	color:#555;
}

	#content #body {
		background:#FFF;
		margin-bottom:20px;
		border:1px solid #CCCCCC;
		box-shadow:0px 0px 3px #CCC;
	}
		
		#content #body .title {
			background:url(images/bg-body-title.png) repeat-x;
			padding:7px 10px;
			font-size:14px;
			font-weight:bold;
			text-shadow:1px 1px 2px #DDD;
			color:#000;
		}
		
		#content #body .body {
			padding:7px 10px;
		}
		
			#content #body .body a.submenu {
				display:block;
				font-weight:bold;
				text-decoration:none;
				color:#555;
				font-size:14px;
				padding:7px 10px;
				border-bottom:1px dotted #555;
			}
			
				#content #body .body a.submenu img {
					margin:0 5px -4px 0;
				}
				
				#content #body .body a.submenu:hover {
					color:#000;
					border-bottom:1px dotted #000;
					text-shadow:1px 1px 2px #CCC;
				}
				
				#content #body .body #stat {
					font-size:14px;
					font-weight:bold;
					padding:7px 5px;
					border-bottom:1px dotted #555;
				}
				
					#content #body .body #stat .value {
						float:right;
					}

#footer {
	background-color:#300505;
	padding:10px 20px;
	color:#FFF;
	text-align:center;
}

.table {
	border-collapse:collapse;
	box-shadow:0px 0px 3px #CCC;
	margin-bottom:10px;
}

	.table, .table th, .table td {
		border:1px solid #CCC;
		padding:2px 2px;
	}
	
	.table .th {
		background:url(images/bg-body-title.png) repeat-x;
		font-size:14px;
		font-weight:bold;
		color:#000000;
 	}
		
		.table td img {
			margin:0 5px -3px 5px;
		}
		
		.table tr.td:hover {
			background:#AFD7FE;
			color:#000000;
			text-transform:1px 1px 2px #777;
		}
	
a.red {
	display:inline-block;
	background:#F74F4F;
	color:#FFF;
	font-weight:bold;
	padding:6px 10px;
	text-decoration:none;
	border:1px solid #900;
	margin:5px;
}

	a.red img {
		margin:0 5px -4px 0;
	}

a.orange {
	display:inline-block;
	background:#F90;
	color:#FFF;
	font-weight:bold;
	padding:6px 10px;
	text-decoration:none;
	border:1px solid #F63;
	margin:5px;
}

	a.orange img {
		margin:0 5px -4px 0;
	}

a.green {
	display:inline-block;
	background:#72FF6F;
	color:#FFF;
	font-weight:bold;
	padding:6px 10px;
	text-decoration:none;
	border:1px solid #090;
	margin:5px;
}

	a.green img {
		margin:0 5px -4px 0;
	}
	
a.blue {
	display:inline-block;
	background:#426CFF;
	color:#FFF;
	font-weight:bold;
	padding:6px 10px;
	text-decoration:none;
	border:1px solid #03F;
	margin:5px;
}

	a.blue img {
		margin:0 5px -4px 0;
	}

.mgs-blue {
	border:1px solid #03F;
	background:#7D9AFF;
	padding:5px 10px;
	color:#FFF;
	margin:5px;
}

	.mgs-blue img {
		float:left;
		padding-right:10px;
	}

.mgs-red {
	border:1px solid #F53434;
	background:#F97777;
	padding:5px 10px;
	color:#FFF;
	margin:5px;
}

	.mgs-red img {
		float:left;
		padding-right:10px;
	}

.mgs-green {
	border:1px solid #090;
	background:#39E146;
	padding:5px 10px;
	color:#FFF;
	margin:5px;
}

	.mgs-green img {
		float:left;
		padding-right:10px;
	}
	
.desc {
	font-size:10px;
	color:#999;
}

.clear {
	clear:both;
}
.title
 {
	    font-family: Arial;
	 	font-size: 12px;
 		text-align:justify;
 		line-height: 1.5em;
	 	margin-top: 0px;
  		text-align:center;
  }

  .title1
 {
	    font-family: Arial;
	 	font-size: 12px;
 		text-align:justify;
 	 	margin-top: 0px;
		 
		 
  		text-align:center;
  }

  .title2
 {
	    font-family: Arial;
	 	font-size: 12px;
 		text-align:justify;
 		line-height: 1.5em;
	 	margin-top: 0px;
  		text-align:center;
  }

#atas
{
   margin:10px;
	color:#555;
	height:600px;

	background: #fff;

}

#atas1
{
   margin:10px;
	color:#555;
	 

	background: #fff;

}

	 
 }

 #kiri
{
    float: left;
    width: 960px;
	 
	background: #ccc;
 	 
 }

#kanan
{
    float: right;
    width: 400px;
	background: #FFFFFF;
	 
 }

 th
 {
	    font-family: Arial;
	 	font-size: 12px;
  		text-align:justify;
 		line-height: 1.5em;
	 	margin-top: 0px;
  		text-align:center;
   }

  .isi1
 {
	    font-family: Arial;
	 	font-size: 12px;
 		text-align:justify;
 	 	margin-top: 0px;
		 
		 
   }
    .isi2
 {
	    font-family: Arial;
	 	font-size: 20px;
 		text-align:justify;
 	 	margin-top: 0px;
		 
		 
   }

   .input
 {
	    font-family: Arial;
	 	font-size: 14px;
 		text-align:justify;
 	 	margin-top: 0px;
		 
		 
   }
  


#left 
{
        float: left;
        width: 370px;
		background: #FFFFF;
		height:400px;
}

#left1 
{
        float: left;
        width: 500px;
 		background: #FFFFFF;
}

#right 
{
        float: left;
        width: 600px;
		background: #FFFFFF;
}

#right1 
{
        float: right;
        width: 570px;
		padding-right:1px;
		background: #FFFFFF;
}

#right2
{
        float: right;
        width: 200px;
		background: #FFFFFF;
}


#faktur1
{
        float: left;
        width: 200px;
		height:50px;
		padding-left:10px;
		background: #FFFFFF;
}
#faktur2
{
        float: right;
        width: 400px;
		height:50px;
		background: #FFFFFF;
}


#sj
{
        float: center;
        width: 900px;
		height:80px;
		background: #FFFFFF;
		border:1px solid #000;
}

#sj1
{
        float: left;
        width: 400px;
		color:black;
 		background: #FFFFFF;
		padding-top:5px;
		 
}

#sj2
{
        float: right;
        width: 200px;
		color:black;
 		background: #FFFFFF;
		padding-top:5px;
		 
}

#sj3
{
        float: center;
        width: 900px;
		height:40px;
		background: #FFFFFF;
		border-top:0px solid #000;
		border-left:1px solid #000;
        border-right:1px solid #000;
		border-bottom:1px solid #000;


}

#sj4
{
        float: center;
        width: 900px;
		height:120px;
		background: #FFFFFF;
		border-top:0px solid #000;
		border-left:1px solid #000;
        border-right:1px solid #000;
		border-bottom:0px solid #000;


}
#sj5
{
        float: left;
         padding-left:10px;
 		background: #FFFFFF;
		 

}

#sj6
{
        float: center;
        width: 900px;
		height:140px;
		border-top:0px solid #000;
		border-left:1px solid #000;
        border-right:1px solid #000;
		border-bottom:1px solid #000;
		background: #FFFFFF;
		 
		 

}


#sj7
{
        float: center;
		padding-right:10px;
 		background: #CCC;
		 

}

#kotak1
{
        float: left;
		width:200px; 
		 
		padding-left:10px;
 		background: #FFFFFF;
		 
		 

}
#kotak2
{
        float: left;
		width:200px; 
		padding-left:10px;
 		background: #FFFFFF;
		 

}
#kotak3
{
        float: left;
		width:200px; 
		padding-top:10px;
		padding-right:10px;
 		background: #FFFFFF;
		 

}

    .huruf1
 {
	    font-family: Arial;
	 	font-size: 16px;
 		text-align:justify;
 	 	margin-top: 0px;
		 
		 
   }

     .huruf2
 {
	    font-family: Arial;
	 	font-size: 16px;
 		text-align:center;
		color:black;
		 
 		padding-top:5px;
		display:block;
		 
		 
   }

       .huruf3
 {
	    font-family: Arial;
	 	font-size: 14px;
 		text-align:justify;
		color:black;
  		padding-top:5px;
		display:block;
		 
		 
   }