@charset "utf-8";
/* CSS Document */
h1, h2, h3, h4, h5, .titleportfolio, #menu{
	font-family:Georgia, "Times New Roman", Times, serif;
	font-weight:normal;
}
h1{
	display:block;
	font-size:24px;
	text-transform:capitalize;
}
h2{
	display:block;
	padding:18px 14px;
	color:#33ff33;
	font-size:20px;
	text-transform:capitalize;
}
h3{
	display:block;
	padding:18px 14px;
	color:#33ff33;
	font-size:18px;
	text-transform:capitalize;
}
h4{
	display:block;
	padding:18px 14px;
	color:#33ff33;
	font-size:16px;
	text-transform:capitalize;
}
body{
	margin:0 auto;
	background:#000033 url(../images/bg-body.jpg) repeat-x top left;
	color:#ccccff;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 62.5%
}
#container{
	margin:0 auto;
	width:800px;
	display:block;
	background:transparent url(../images/bg-container.jpg) no-repeat top center;
	overflow:hidden;
}
#header{
	display:block;
	padding-bottom:73px;
	
}
	#search-rss-wrapper{
		display:block;
		height:85px;
	}
	#search{
		display:block;
		height:50px;
		width:395px;
		float:left;
		
	}
		#search form{
			margin:0;
			padding:0;
			display:block;
			padding-left:75px;
			padding-top:18px;
		}
		#search form input{
			width:140px;
			border:1px solid white;
		}
	#rss{
		display:block;
		height:50px;
		width:395px;
		float:right;
		
	}
	#moto{
		padding-top:55px;
		display:block;
		height:50px;
		text-align:center;
		
	}
		#moto h1{
			display:none;
		}
#menu{
	height:34px;
	width:800px;
	display:block;
	font-size:16px;
	color:#33ff33;
	font-weight:normal;
	
}
	#menu ul{
		padding:8px 70px;
	}
	#menu ul li{
		color:#33ff33;
		float:left;
		padding:0 25px 0 0;
	}
	#menu ul li a{
		display:block;
		text-decoration:none;
		color:#33ff33;
	}
	#menu ul li a:hover{
		color:#ccff66;
	}
	.active_page_item{
		display:block;
		background:transparent url(../images/bg-menuactive.jpg) bottom center no-repeat;
		padding-bottom:11px;
	}
#content-wrapper{
	margin-top:11px;
	overflow:hidden;
	padding:5px 55px 20px 55px;
}
	#simple-steps{
		display:block;
		width:347px;
		float:left;
	}
	#thestep{
		display:block;
		width:343px;
		float:right;
	}	
#portfolio{
	clear:both;
	display:block;
	padding:5px 6px;
	text-align:left;
	overflow:hidden;
}
	#portfolio ul li{
		float:left;
	}
	
	#portfolio h2{
		display:block;
		padding:10px 11px;
		color:#33ff33;
	}
	#portfolio h2 a,#brief h2 a,#testimonial h2 a,#content h2 a{
		text-decoration:none;
		color:#33ff33;
	}	
	#portfolio h2 a:hover,#brief h2 a:hover,#testimonial h2 a:hover,#content h2 a:hover{
		text-decoration:none;
		color:#ccff66;
	}	
	
	.titleportfolio{
		line-height:14px;
		display:block;
		margin:15px 9px;
		padding:5px;
		width:120px;
		color:white;
		font-size:12px;
		position:absolute;
		z-index:1000;
		background:transparent url(../images/bg-portfolio.png) 0 0;
	}
	.titleportfolio a{
		text-decoration:none;
		color:white;
	}
	.titleportfolio a:hover{
		text-decoration:none;
		color:#33ff33;
	}

#content ul#portfolio-detail li{
	float:left;
}

#content{
	margin:0 auto;
	display:block;
	padding:20px 5px 20px 5px;
	font-size:14px;
	overflow:hidden;
}
#content ul.list,#content ol.list{
	padding:5px 0 5px 30px;
	list-style-type:decimal;
}
#content li{
	padding:3px 0;
}
#testimonial,#brief{
	display:block;
	padding:20px 13px;
	font-size:14px;
}
#dirgahayu_indonesia{
	display:block;
	padding:20px 16px;
}
	#testimonial ul li,#brief ul li{
		display:block;
		width:330px;
		float:left;
	}
	#testimonial span,#brief span{
		display:block;
	}
.box-top{
	margin:0 auto;
	display:block;
	width:662px;
	height:56px;
	background:transparent url(../images/box-top.png) 0 0 repeat-y;
	overflow:hidden;
}
.box-content{
	margin:0 auto;
	display:block;
	width:662px;
	overflow:hidden;
	background:transparent url(../images/box-content.png) 0 0 repeat-y;
}
.box-bottom{
	margin:0 auto;
	display:block;
	width:662px;
	height:142px;
	background:transparent url(../images/box_bottom.png) 0 0 no-repeat;
}
.box-bottom-3{
	margin:0 auto;
	display:block;
	width:662px;
	height:13px;
	background:transparent url(../images/box_bottom3.png) 0 0 no-repeat;
}
/* footer */
#footer{
	display:block;
	margin-top:-55px;
	padding-bottom:30px;
	overflow:hidden;
}
#menu-footer{
	padding:0 75px 0 75px;
	font-size:12px;
}
#menu-footer li{
	float:left;
	padding:2px 4px;
	color:#666699;
}
#menu-footer li a{
	text-decoration:none;
	color:#003366;
}
#menu-footer li a:hover{
	text-decoration:none;
	color:#666699;
}
/* misc */
hr{
	display:none;
	margin:0;
	padding:0;
}
p, form{
	padding:10px 10px;
	line-height:18px;
}
p{
	padding:5px 10px;
}
p a{
	color:#66ff66;
	text-decoration:none;
}
p a:hover{
	color:#33ff33;
	text-decoration:underline;
}
input,textarea{
	color:#999999;
	font-size:13px;
}
.input{
	width:250px;
}
.button{
	text-align:center;
	padding:2px 10px;
	color:#333333;
}
label{
	display:block;
	padding:3px 0;
}
#pages{
	text-align:center;
	padding:5px;
	font-size:0.9em;
	display:block;
}
#pages a{
	text-decoration:none;
	color:white;
}
#pages a:hover{
	text-decoration:none;
	color:#33ff33;
}

/* DETAIL PROJECT */
#detail-portfolio{
	margin:0 auto;
	padding:5px 0;
	font-size:0.9em;
}
#detail-portfolio span{
	font-weight:bold;
	display:block;
	width:100px;
	float:left;
}
#detail-portfolio img{
	display:block;
	margin:0 auto;
	text-align:center;
	border:2px solid #ccccff;
}
#detail-portfolio ul{
	margin-top:10px;
	padding:0 8px;
}
#detail-portfolio li{
	padding:5px 5px;
	margin-bottom:4px;
	background-color:#003366;
}
#detail-portfolio li a{
	text-decoration:none;
	color:#ccccff;
	font-style:italic;
}
#detail-portfolio li a:hover{
	text-decoration:none;
	color:#666699;
}

/* DROP MENU */

#nav li { /* all list items */
}
#nav li ul { /* second-level lists */
	position: absolute;
	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}
#nav li ul ul { /* third-and-above-level lists */
	margin: -1em 0 0 10em;
}
#nav li li{
	padding:4px 2px;
	border-bottom:1px solid #666699;
	width:100px;
	display:block;
	font-size:13px;
}
#nav li ul ul { /* third-and-above-level lists */
	margin: -1em 0 0 10em;
}

#nav li:hover ul ul, #nav li.sfhover ul ul {
	left: -999em;
}

#nav li:hover ul, #nav li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul { /* lists nested under hovered list items */
	left: auto;
	padding:2px 5px;
	border:0 !important;
	border-top:1px solid white;
	width:107px;
}
#progress,#result{
	background-color:#00FFFF;
	color:red;
	padding:10px;
	display:none;
	margin:0 10px;
	font-size:11px;
	font-weight:bold;
}
#progress{
	background:white url(../images/loader.gif) no-repeat scroll 10px 8px ;
	padding-left:30px;
}
/* CONTENT SLIDER CSS PROPERTY */

.contentslide{
}
.contentslide .opacitylayer{ /*Do not edit this rule unless you're familiar with CSS opacity behavior*/
width: 100%;
height: 100%;
-moz-opacity: 1;
opacity: 1;
}
.contentslide .contentdiv{
display: none;
}
.pagination{

display:none;
}
* html .pagination{ /*Simplified box model hack to get IE5 to display width equal to that of Content Slider's*/

}
.pagination a{
}
.pagination a:hover, .pagination a.selected{
}

.clear{
	background: none;
	border: 0;
	clear: both;
	display: block;
	float: none;
	font-size: 0;
	list-style: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

.float_right{
	float:right;
}
.float_left{
	float:left;
}

.padding0{
	padding:0 !important;
}
.padding0_right{
	padding-right:0 !important;
}
.padding0_left{
	padding-left:0 !important;
}
.padding0_top{
	padding-top:0 !important;
}
.padding0_bottom{
	padding-bottom:0 !important;
}

.padding10{
	padding:10px !important;
}
.padding10_right{
	padding-right:10px !important;
}
.padding10_left{
	padding-left:10px !important;
}
.padding10_top{
	padding-top:10px !important;
}
.padding10_bottom{
	padding-bottom:10px !important;
}

.padding20{
	margin:20px !important;
}
.padding20_right{
	padding-right:20px !important;
}
.padding20_left{
	padding-left:20px !important;
}
.padding20_top{
	padding-top:20px !important;
}
.padding20_bottom{
	padding-bottom:20px !important;
}

.margin-5_top{
	margin-top:-5px !important;
}
.margin-10_top{
	margin-top:-10px !important;
}

.margin0{
	margin:0 !important;
}

.margin0_right{
	margin-right:0 !important;
}
.margin0_left{
	margin-left:0 !important;
}
.margin0_top{
	margin-top:0 !important;
}
.margin0_bottom{
	margin-bottom:0 !important;
}

.margin10{
	margin:10px !important;
}
.margin10_right{
	margin-right:10px !important;
}
.margin10_left{
	margin-left:10px !important;
}
.margin10_top{
	margin-top:10px !important;
}
.margin10_bottom{
	margin-bottom:10px !important;
}

.margin20{
	margin:20px !important;
}
.margin20_right{
	margin-right:20px !important;
}
.margin20_left{
	margin-left:20px !important;
}
.margin20_top{
	margin-top:20px !important;
}
.margin20_bottom{
	margin-bottom:20px !important;
}