/*
Theme Name: Gogon
Author: pithoe.com
Author URI: http://www.pithoe.com/
*/

* {
	margin: 0; padding: 0;
}
body {
	text-align: left;
	font: 12px Arial;
	color: #636363;
	background: url(images/background.gif) repeat-x 0 0;
}
a {
	color: #9d5904;
        text-decoration: none;
}
a:hover {
	text-decoration: none;
	color: #ff0000;
}
img {
	border: 0;
}

.break {
	font-size: 0;
	width: 0; height: 0;
	clear: both;
}
.alignleft {
	float: left;
	margin: 4px 10px 5px 0;
}
.alignright {
	float: right;
	margin: 4px 0 5px 10px;
}
.aligncenter {
	text-align: center;
}
.hidden {
	display: none;
}

/** BEGIN wrapper **/
#wrapper {
	width: 955px;
	margin: auto auto;
	text-align: left;

}
/** END wrapper **/

/** BEGIN header **/
#header {
height: 170px;
}


#header .isi {
width: 934px;
margin: 0px auto 0px auto;
}

#header .isi .atas {
height: 30px;
}

#header .isi .atas .searchheader{
float: right;
height: 20px;
padding-top: 5px;
padding-left: 10px;
width: 170px;
background: url(images/search.png) no-repeat;
}

#header .isi .atas .searchheader .search input {
			border: 0;
		}

#header .isi .atas .pages {
padding-top: 10px;
list-style-type: none;
float: left;
height: 15px;

}
		
#header .isi .atas .pages a {
margin-left: 5px;
color: #ffffff;
}


#header .isi .bawah {
height: 90px;
}
#header .isi .bawah h1 {
clear: both;
float: left;
font-size: 0;
padding: 0px 0 0px;
}

#header .isi .bawah h1 a {
display: block;
margin-top: 15px;
width: 320px; height: 70px;
padding: 0px 0 0 0px;
text-indent: -9999px;
outline: none;
background: url(images/logo.png) no-repeat 0 0;
}

#header .isi .headerads {
padding-top: 15px;
float: right;
height: 40px;
}




#header .isi .navbar {

float: left;
height: 50px;

background:  url(images/navbar.gif) no-repeat 0 0;

}


/* SubNavbar */
#subnav {
	margin-top: 5px;
	}

	

#subnav ul {

	float: left;
	list-style: none;
	margin: 0px;
	
	}

	

#subnav li {

	float: left;
        height: 38px;
        border-left: 1px solid #e6e6e6;
	list-style: none;

	margin: 0px;

	padding: 0px;

	}

#subnav li:hover {

	float: left;

	list-style: none;

	margin: 0px;

	padding: 0px;
        height: 38px;
        background: #f0f0f0;

	}	

#subnav li a, #subnav li a:link, #subnav li a:visited {
font-size: 11px;
        
	color: #1b1b1b;
	display: block;
        margin: 0px;
	padding: 9px 15px 9px 15px;
	text-decoration: none;
        font-weight: bold;
        text-transform: uppercase;
	}



#subnav li a:hover, #subnav li a:active {

	color: #125d87;

	display: block;

        margin: 0px;

	padding: 9px 15px 9px 15px;
        
	}

	

#subnav li li a, #subnav li li a:link, #subnav li li a:visited {
        height: 20px;
	background: #FFFFFF;
	width: 170px;

	color: #666666;

	float: none;

	margin-top: 10px;

	padding: 5px 10px 5px 5px;

	border-bottom: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;

	

	}

	

#subnav li li a:hover, #subnav li li a:active {
        margin-top: 10px;
        height: 20px;
	background: #999999;

	color: #FFFFFF;

	padding: 10px 10px 5px 5px;	

	}

	

#subnav li ul {

	z-index: 9999;
	position: absolute;
	left: -999em;
	 height: 38px;
	width: 160px;
	padding: 0px;

	}



#subnav li li { 

	}



#subnav li ul a { 

	width: 160px;

	}



#subnav li ul a:hover, #subnav li ul a:active { 
background: #f0f0f0;
color: #125d87;
	}



#subnav li ul ul {

	margin: -25px 0 0 191px;

	}



#subnav li:hover ul ul, #subnav li:hover ul ul ul, #subnav li.sfhover1 ul ul, #subnav li.sfhover1 ul ul ul {

	left: -999em;

	}



#subnav li:hover ul, #subnav li li:hover ul, #subnav li li li:hover ul, #subnav li.sfhover1 ul, #subnav li li.sfhover1 ul, #subnav li li li.sfhover1 ul {

	left: auto;

	}



#subnav li:hover, #subnav li.sfhover { 

	position: static;

	}


/** END header **/



/* Feature */

#feature {
background: #222222;
height: 250px;
padding-top: 10px;
padding-bottom: 20px;
}	


#feature .isi{
height: 255px;
width: 925px;
margin: 0 auto 0 auto;
background:url('images/feature-bg.png') repeat-y 0 0;
padding-left: 15px;padding-right: 15px;
}

#bottom{
height: 50px;width: 945px;
background:url('images/feature-bg-bawah.png') no-repeat 0 0;
margin-left: -6px;
}
#top{
height: 5px;
width: 945px;
background:url('images/feature-bg-atas.png') no-repeat 0 0;
margin-left: -6px;
}
/* script*/
#featured{ 
	width: 670px; 
	padding-left: 265px; 
	position: relative; 
	height: 250px; 
	
	}
	
#featured ul.ui-tabs-nav{ 
	position: absolute; 
	top: 0px; 
	left: 0px; 
	list-style: none; 
	padding: 0; 
	margin: 0; 
	width: 265px; 
	background: #333;
	color: #fff;
}

#featured ul.ui-tabs-nav li{ 
	margin: 0px;
	padding: 0px 0px 1px 0px; 
	font-size: 12px; 
	color: #666; 
	background: none;
	}
	
#featured ul.ui-tabs-nav li img{ 
	float: left; 
	margin: 2px 5px; 
	background: #fff; 
	padding: 2px; 
	border: 1px solid #eee;
	}
	
#featured ul.ui-tabs-nav li span{ 
	font-size: 12px;
	line-height: 16px; 
	}
	
#featured li.ui-tabs-nav-item a{ 
	display: block; 
	height: 72px; 
	padding: 10px 10px 0px 7px;
	color:#fff;  
	background:#444; 
	}
	
#featured li.ui-tabs-nav-item a:hover{ 
	background: #555; 
	color: #fff;
	}
	
#featured li.ui-tabs-selected{ 
/*	background:url('images/selected-item.gif') top left no-repeat;  */	
	padding: 0px 0px 1px 0px; 
	}

#featured ul.ui-tabs-nav li.ui-tabs-selected a{ 
	background: #333; 
	}
	
#featured .ui-tabs-panel{ 
	width: 665px; 
	height: 250px; 
	background: #000; 
	margin: 0px;
	padding: 0px;
	position: relative;
	}
	
#featured .ui-tabs-panel .info{ 
	position: absolute; 
	top: 0px; 
	left: 400px; 
	height: 245px; 
	background: #111; 
	opacity: .75;
	filter: alpha(opacity=75);
	padding: 3px 5px 0px 5px;
	margin: 0px;	
	}



	
#featured .info h2{ 
	font-size: 18px; 
	color: #fff; 
	padding: 5px; 
	overflow: hidden; 
}

#featured .info p{ 
	margin: 0px 5px; 
	font-size: 12px; 
	line-height: 15px; 
	color: #f0f0f0;
	padding: 0px;	
	}
	
#featured .info a{ 
	text-decoration: none; 
	color: #fff; 
	}
	
#featured .info a:hover{ 
	text-decoration: underline; 
	}
	
#featured .ui-tabs-hide{ 
	display: none; 
	}



/** BEGIN content **/
#content {
	clear: both;
	width: 625px;
	float: left;
	padding: 0 0 20px 8px;
        margin-top: 20px


}
	#content .categories {
		list-style-type: none;
		background-color: #454545;
		height: 40px;
		overflow: hidden;
	}
		#content .categories li {
			float: left;
			border-right: 1px solid #ffffff;
		}
		#content .categories li a {
			display: block;
			padding: 12px 6px 13px;
			color: #ffffff;
			text-decoration: none;
		}
	#content .post {
		width: 306px; height: 230px;
		float: left;
		padding: 10px 0 20px 5px;
               
	}
#content .article {
		width: 290px;
		float: left;
		
                
	}

#content .headerthumb {
width: 295px; 
height: 25px;
}

#content .headerthumb h2{


}
#content .headerthumb h2 a{
padding: 10px 0 5px 0px;
color: #125d87;
}



		#content .post h2 {
			
			font-size: 1.1em;
			font-family: Verdana;
			margin-bottom: 15px;
                     
		}
		#content .post p {
			padding: 5px 0;
			line-height: 1.4em;
			text-align: justify;
		}
		#content .post .details {
			padding: 0;
		}



		#content .post .thumb {
		margin: 0 5px 5px 0;
		overflow: hidden;
               	
		}

  
		#content .post .thumb a {width: 290px; height: 200px;
		overflow: hidden; position: relative;
                border: 4px solid #9dc5ed;
                background-color: #eeeeee;
                
                float: left;}

                #content .post .thumb a:hover {
               	border: 4px solid #DFF4FF;
		}



#content .post .thumb img {
		width: 290px;

		}


	#content .single {
		padding: 10px 20px 10px 10px;
	}


#content .single .thumb {
		margin: 0 5px 5px 0;
		overflow: hidden;
               	
		}

  
		#content .single .thumb a {width: 290px; height: 200px;
		overflow: hidden; position: relative;
                border: 4px solid #cccccc;
                background-color: #eeeeee;
                
                float: left;}

                #content .single .thumb a:hover {
               	border: 4px solid #cccccc;
		}



#content .single .thumb img {
		width: 290px;

		}






		#content .single h2 {
			margin-bottom: 10px;
			font-size: 2em;
			text-transform: none;
		}
		#content .single p {
			line-height: 1.5em;
			margin-bottom: 10px;
		}
		#content .single ul, #content .single ol {
			list-style-position: inside;
			margin-bottom: 10px;
		}
		#content .single li {
			line-height: 1.5em;
			padding: 2px 0;
		}
		#content .single blockquote {
			padding: 10px 10px 5px;
			margin-bottom: 10px;
			background-color: #eeeeee;
			border-width: 1px 0;
			border-style: solid;
			border-color: #e0e0e0;
		}
		#content .single h3, #content .single h4, #content .single h5, #content .single h6 {
			font-size: 1.2em;
			margin-bottom: 5px;
		}

#pagenavigation{
margin-top: 5px;
margin-bottom: 5px;
margin-left: 0px;
padding: 5px 5px 5px 5px;
}
/** END content **/

/** BEGIN sidebar **/
#sidebar {
	width: 310px;
	float: right;
	padding: 10px 10px 0 1px;
        margin-top: 20px
}







#sidebar .boxx {
		margin-bottom: 10px;
	}
		#sidebar .boxx h2 {
			
			font-weight: bold;
			font-size: 0.9em;
			font-family: Verdana;
			color: #ffffff;
			text-transform: uppercase;
			padding: 7px 5px 7px 10px;
                        background-color: #222222;
		}
		#sidebar .boxx ul {
			padding: 0px 0px 0px 0px;
			list-style-type: none;
		}

			#sidebar .boxx ul li {
				line-height: 1.4em;
                                background-color: #f2f2f2;
                                border-bottom: 1px solid #c7c5c5;
                        padding: 4px 0 4px 20px;
			

                                
			}

                        #sidebar .boxx ul li:hover {
			background-color: #e3e2e2;
			}

			#sidebar .boxx ul li a {
				color: #636363;
				text-decoration: none;
			}
			#sidebar .boxx ul li a:hover {
				color: #9AB21E;
				
			}








	#sidebar .box {
		margin-bottom: 10px;
	}
		#sidebar .box h2 {
			background-color: #222222;
			font-weight: bold;
			font-size: 0.9em;
			font-family: Verdana;
			color: #ffffff;
			text-transform: uppercase;
			padding: 7px 5px 7px 10px;
                        
		}
		#sidebar .box ul {
			padding: 0px 0px 0px 0px;
			list-style-type: none;
		}

			#sidebar .box ul li {
				line-height: 1.4em;
                                background-color: #f2f2f2;
                                border-bottom: 1px solid #c7c5c5;
                        padding: 4px 0 4px 20px;
			background: url(images/categories.gif) no-repeat 0 5px;

                                
			}

                        #sidebar .box ul li:hover {
			background-color: #e3e2e2;
			}

			#sidebar .box ul li a {
				color: #636363;
				text-decoration: none;
			}
			#sidebar .box ul li a:hover {
				color: #9AB21E;
				
			}
	#sidebar .ads {
		padding: 10px 3px 0 10px;
		border: 1px solid #EAEAEA;
	}
		#sidebar .ads img {
			margin: 6px;
		}
	
	#sidebar .popular {
		padding: 5px 10px;
		border: 1px solid #EAEAEA;
		list-style-type: none;
	}
		#sidebar .popular li {
			padding: 5px 0;
			line-height: 1.4em;
		}
		#sidebar .popular li a {
			font-weight: bold;
			color: #9d5904 !important;
			text-decoration: underline !important;
		}
		#sidebar .popular li p {
			padding-top: 5px;
		}
	#sidebar .flickr {
		padding: 5px 10px;
		border: 1px solid #EAEAEA;
	}
		#sidebar .flickr img {
			margin: 5px 8px;
		}
	#sidebar .video {
		padding: 5px 0 5px 3px;
		border: 1px solid #EAEAEA;
	}
	#sidebar .tags {
		padding: 5px 10px;
		border: 1px solid #EAEAEA;
	}
		#sidebar .tags a {
			color: #636363;
			text-decoration: none;
		}
		#sidebar .tags a:hover {
			color: #9AB21E;
			text-decoration: underline;
		}
	#sidebar .l {
		width: 145px;
		float: left;
	}
	#sidebar .r {
		width: 145px;
		float: right;
	}
/** END sidebar **/
/* comment */
#main_content .comment_list {
float: left;

display: inline;

padding: 15px 15px 0 20px;
}

.comment_list h4 {
float: left;
padding: 0 14px 0 10px;
margin: 0px 0px 5px 0px;
text-transform: uppercase;
color: #333333;
font-size: 11px;
letter-spacing: 1px;
}

.comment_list .comment_box {
float: left;
width: 590px;
margin-left: 10px;
padding: 10px 0px 10px 10px;
display: inline;
background: url(images/box-bg.gif) repeat-x top left !important;
}

.comment_box .comment_avatar {
float: left;
width: 60px;
display: inline;
margin-left: 10px;
}

.comment_box img {
width: 50px;
height: 50px;
padding: 3px;
background-color: #f1f1f1;
border: 1px solid #ccc;
}

.comment_box .comment_content {
float: right;
width: 450px;
display: inline;
line-height: 1.5;
}

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

.comment_content a:hover, .comment_content a:active, .comment_content a:focus {
text-decoration: underline;
}

.comment_content .comment_title {
float: left;
width: 550px;
display: inline;
font-weight: bold;
}

/* comment form */
#main_content .comment_form {
float: left;
width: 545px;
display: inline;

margin: 3px 5px 10px 10px;
padding: 15px 15px 15px 15px;
}
.comment_form a {
	color: #cc0000;
	text-decoration: none;
}
.comment_form a:hover, .comment_form a:active, .comment_form a:focus {
	text-decoration: underline;
}
.comment_form p {
	float: left;
	width: 545px;
	display: inline;
	margin: 0 0 0 10px;
	padding: 0px;
}
.comment_form .comment_item_full {
	float: left;
	width: 545px;
	display: inline;
	margin: 0 0 0 10px;
	padding: 5px 0px;
}
.comment_form .comment_item {
	float: left;
	width: 545px;
	display: inline;
	margin: 0px;
	padding: 5px 0px 10px 0px;
	overflow: hidden;
}
.comment_form .comment_control {
	float: left;
	width: 545px;
	display: inline;
	margin: 0px;
	padding: 5px 0px 0px 0px;
}
.comment_item .comment_item_title {
	float: left;
	display: inline;
	width: 70px;
	padding: 3px 0px 0px 0px;
	font-weight: bold;
}
.comment_item .comment_item_title2, .comment_item_full .comment_item_title2 {
	float: left;
	display: inline;
	width: 545px;
	padding: 3px 0px 3px 0px;
	font-weight: bold;
}
.comment_item .text_area_style {
	background: none;
	border: 1px solid #CCCCCC;
	margin: 0px 0px 0px 0px;
	padding: 2px 3px 0px 2px;
	width: 182px;
	height: 18px;
	outline: none;
	color:#666666;
	border-radius: 5px;
	font-size:12px;
}
.comment_item .text_area_style2, .comment_item_full .text_area_style2 {
	background: none;
	border: 1px solid #CCCCCC;
	margin: 0px 0px 0px 0px;
	padding: 2px 3px 0px 2px;
	width: 535px;
	height: 120px;
	outline: 0;
	color:#666666;
	border-radius: 5px;
	font-size:12px;
}
.comment_control .submit_btn {
	width:120px;
	height:30px;
	float: left;
	border:none;
	background: #2e3c48; 
	cursor:pointer;
	position:relative;
	display: inline;
	margin: 0px 10px 0px 15px;
	color: #ffffff;
	font-size: 10px;
	text-transform: uppercase;
}
.comment_control .reset_btn {
	width:120px;
	height:30px;
	float: left;
	border:none;
	background: #2e3c48; 
	cursor:pointer;
	position:relative;
	display: inline;
	margin: 0px 10px 0px 15px;
	color: #ffffff;
	font-size: 10px;
	text-transform: uppercase;
}



#footer{
height: 30px;
background: #111111 url(images/footer.gif) repeat-x;
color: #ffffff;
padding: 10px 0 0 0;
}

#footer p {
text-decoration: none;
color: #ffffff;
text-align: center;
}

#footer a {
text-decoration: none;
color: #fc6802;
text-align: center;
}

#block{
float:left;
width:570px;
height:21px;
background:#EEEEEE;
border:1px solid #CCCCCC;
margin-left: 10px;
margin-bottom: 15px;
padding-top:8px;
padding-left:11px;
padding-right:16px;
}

#downloaddemo{
width: 150px;
height: 30px;
}

#downloaddemo .download{
width: 50px;
float: left;
}


#downloaddemo .preview{
width: 50px;
float: right;
}