body {
    font-family: 'Roboto', 'Open Sans', sans-serif;
	background-color: #ffffff;
	font-size: 17px;
	line-height: 20px;
	color: #000000;
	margin:0;
}

td,th {
    font-family: 'Roboto', 'Open Sans', sans-serif;
	font-size: 17px;
	line-height: 20px;
	color: #000000;
}

.font12 {
	font-size: 12px;
	line-height: 15px;	
}
.font13 {
	font-size: 13px;
	line-height: 15px;	
}
.font14 {
	font-size: 14px;
	line-height: 15px;	
}
.font15 {
	font-size: 15px;
	line-height: 15px;	
}

.border-left {
	border-left:1px solid #333333;
}
.border-both {
	border:1px solid #333333;
}
.border-right {
	border-right:1px solid #333333;
}
.border-bottom {
	border-bottom:1px solid #333333;		
}
.border-top {
	border-top:1px solid #333333;		
}

.tabel {
	display:block;
	border-spacing: 0px;
	width:100%; margin:0; padding:0;
}
	.tabel .head-column {
		background-color:#dddddd;
		display:table;
		border-spacing: 0px;
		width:100%; margin:0; padding:0;	
	}

	.tabel .content-column {
		display:table;
		border-spacing: 0px;
		width:100%; margin:0; padding:0;	
		cursor:pointer;
		clear:both;
	}
		.tabel .content-column:hover {
			background-color:#eeeeee;
		}

	.tabel5 {
		width:5%;
		display:table-cell;
	}
	.tabel10 {
		width:10%;
		display:table-cell;
	}
	.tabel15 {
		width:15%;
		display:table-cell;
	}
	.tabel20 {
		width:20%;
		display:table-cell;
	}
	.tabel25 {
		width:25%;
		display:table-cell;
	}
	.tabel30 {
		width:30%;
		display:table-cell;
	}
	.tabel35 {
		width:35%;
		display:table-cell;
	}
	.tabel40 {
		width:40%;
		display:table-cell;
	}
	.tabel45 {
		width:45%;
		display:table-cell;
	}
	.tabel50 {
		width:50%;
		display:table-cell;
	}
	.tabel55 {
		width:55%;
		display:table-cell;
	}
	.tabel60 {
		width:60%;
		display:table-cell;
	}
	.tabel65 {
		width:65%;
		display:table-cell;
	}
	.tabel70 {
		width:70%;
		display:table-cell;
	}
	.tabel75 {
		width:75%;
		display:table-cell;
	}
	.tabel80 {
		width:80%;
		display:table-cell;
	}
	.tabel85 {
		width:85%;
		display:table-cell;
	}
	.tabel90 {
		width:90%;
		display:table-cell;
	}
	.tabel95 {
		width:95%;
		display:table-cell;
	}
	.tabel100 {
		width:100%;
		display:table-cell;
	}

.nopointer, .nopointer:hover {
	cursor:default;
}

.padding0 {
	padding:0px;
}

.padding5 {
	padding:5px;
}

.padding10 {
	padding:10px;
}

.padding15 {
	padding:15px;
}


.alignLeft {
	text-align:left;
}
.alignCenter {
	text-align:center;
}
.alignRight {
	text-align:right;
}

.bg { background: #fff url(../images/left.jpg) repeat-x; margin: 0 0 0 0; }

#spasi1 {padding: 16px 0px 0px 0px;}
#spasi1a {padding: 120px 0px 0px 0px;}
#spasi1c {padding: 3px 0px 0px 0px;}
#spasi1d {padding: 6px 0px 0px 0px;}


#footer { color: #666666; font-size: 11px; }
#footer a { color: #999999; text-decoration: none; }
#footer a:hover { color: #FF3300; text-decoration: none; }

.menu5:hover, .menu5#active {
	cursor:pointer;
	color:#FFFF00;
}
	.menu5a {
		display:block;
		padding: 8px 2px 4px 15px;
		margin: 0px 0px 0px 20px;
		background-image:url(images/panah-kanan.png);
		background-repeat:no-repeat;
		background-position:0px 10px;
	}


a:link {
	color: #000000;
	text-decoration: none;
}

a:visited {
	color: #000000;
	text-decoration: none;
}

a:hover {
	color: #e93618;
	text-decoration: none;
}

a#active {
	color: #CC0000;
	text-decoration: none;
}

.judul {
	font-size: 12px; 
	margin: 0 0 0 0; 
	padding: 0; 
	color: #CCC; 
}

.subjudul {
	font-size: 12px;
	color: #333333;	
}

.subjudul1 {
	font-size: 12px;
	color: #333333;	
}

.small {
	font-size: 10px;
	color: #666666;	
}

.agenda {
	font-size: 9px;
	color: #000000;	
}

.submenu {	
	font-size: 11px;
	font-style: normal;
	color: #AA0E12;
}

.yellow {	color: #EAFF00;
}

#abu{
	color: #999999;
	text-decoration: none;
}
#abu a:link {
	color: #999999;
	text-decoration: none;
}
#abu a:visited {
	color: #999999;
	text-decoration: none;
}
#abu a:hover {
	color: #e93618;
	text-decoration: none;
}
#abu a#active {
	color: #FF6600;
	text-decoration: none;
}

#hitam{
	color: #9c9c9c;
	text-decoration: none;
}
#hitam a:link {
	color: #9c9c9c;
	text-decoration: none;
}
#hitam a:visited {
	color: #9c9c9c;
	text-decoration: none;
}
#hitam a:hover {
	color: #FFFFFF;
	text-decoration: none;
}
#hitam a:active {
	color: #9c9c9c;
	text-decoration: none;
}

#putih{
	color: #b2afaf;
	text-decoration: none;
}
#putih a:link {
	color: #b2afaf;
	text-decoration: none;
}
#putih a:visited {
	color: #b2afaf;
	text-decoration: none;
}
#putih a:hover {
	color: #FFFFFF;
	text-decoration: none;
}
#putih a#active {
	color: #FFFFFF;
	text-decoration: none;
}

.thumbnail a { border: 1px solid #666; width: 90px; height: 85px; background-position: center; background-repeat: no-repeat; display: block; float: left; margin: 0 11px 11px 0; }
.thumbnail a:hover { border: 1px solid #FFF; }

.thumbnail2 a { border: 1px solid #666; width: 100px; height: 85px; background-position: center; background-repeat: no-repeat; display: block; float: left; margin: 0 11px 11px 0; }
.thumbnail2 a:hover { border: 1px solid #FFF; }

.menu-item {
	text-align:right;
	padding:0px 0px 3px 0px;
	margin:0px 18px 10px 0px;
	border-bottom:1px solid #CCCCCC;
}

#grs-lurus {
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 0px;
	border-bottom:1px solid #CCCCCC;
}

#box {
	display:block;
	background-color:#CC3300;
	color:#FFFFFF;
	
	font-size:12px;
	line-height:15px;
	font-weight:bold;
	text-align:center;
	padding:7px 0px;
	margin-bottom:6px;

	/*--Bottom right rounded corner--*/
	border-radius: 10px;
	-webkit-border-radius: 10px;
	border:1px solid #c34213;
}
	#box:hover {
		cursor:pointer;
	}
	

.button {
    background-color: #666666; /* Green */
    border: none;
    color: white;
    padding: 10px 25px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;	
	cursor:pointer;

	/* Safari 3-4, iOS 1-3.2, Android 1.6- */
	-webkit-border-radius: 12px; 
	/* Firefox 1-3.6 */
	-moz-border-radius: 12px; 
	/* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
	border-radius: 12px; 
  	
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}
	.button1 {
		background-color: #666666; /* Green */
		border: none;
		color: white;
		padding: 4px 15px;
		text-align: center;
		text-decoration: none;
		display: inline-block;
		font-size: 16px;	
		cursor:pointer;
	
		/* Safari 3-4, iOS 1-3.2, Android 1.6- */
		-webkit-border-radius: 12px; 
		/* Firefox 1-3.6 */
		-moz-border-radius: 12px; 
		/* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
		border-radius: 12px; 
		
		-webkit-transition-duration: 0.4s; /* Safari */
		transition-duration: 0.4s;
	}

	.button:hover {
		background-color: #C00; /* Green */
		color:#ffffff;
		box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);	
	}

#nav {
	width:100%;
	float: left; 
	text-align:left;
	margin:0px 0px 0px 5px; 
	padding:0;
	font-size:14px;
	line-height:17px;
}
#nav li  {
	display: block; 
	padding: 0px; 
	text-decoration: none; 
}
#nav li a {
	display: block; 
	padding: 7px 0px 7px 20px; 
	margin: 0px 5px 0px 5px;
	text-decoration: none; 
	border-bottom:1px solid #CCC;
	background: url('icons/special.png') center left no-repeat;
	background-size: 10px 10px; 
}
#nav li a:hover, #nav li a.active {
	color: #b8201f;
	background-color:#fbecec;
}
#nav li ul {display: none;}
#nav li ul li a {
	padding:7px 0px 7px 20px;
	margin: 0px 5px 0px 0px;
	border-bottom:1px solid #CCC;
}

/* Paste this css to your style sheet file or under head tag */
/* This only works with JavaScript, 
if it's not present, don't show loader */
.no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url(../images/loader/Preloader_2.gif) center no-repeat #fff;
}

#container {
	margin:15px 0px;
	display:block;
}

.menu-box{
	display:block;
	background-color:#CC3300;
	color:#FFFFFF;
	
	font-weight:bold;
	text-align:center;
	padding:7px 0px;
	margin-bottom:6px;

	/*--Bottom right rounded corner--*/
	border-radius: 10px;
	-webkit-border-radius: 10px;
	border:1px solid #c34213;
}
	.menu-box:hover {
		cursor:pointer;
		background-color:#666666;
		color:#FFFFFF;
	}
 

ul.list {
	padding:0;
	margin: 0px 0px 0px 15px;
}
	ul.list li {
		padding:5px;
	}
 
.button-image {
	background-color:#F30;
	color:#FFF;
	margin:0;
	border:0;
	cursor:pointer;
}

.align-center {
	text-align:center;
}