/*  
Description: Template Hoe-Waar
Versie: 1.0

*/


/* Body Style */
body { font-size: 12px;	color: #333; margin: 0px;	text-align: center;	background: url(images/hoofd_bg.gif) repeat-x top;}
body, p, h1,h2,h3,h4,h5,h6,div,ol,li,td,th,a,form,input,select,textarea,option,label {	font-family: Arial, sans-serif;}
td, th, div{font-size: 12px;line-height: 130%;}
td, th{	padding: 4px;}
h1, h2, h3, h4, h5, h6, h7{	line-height: 150%;}
h1{	font-size: 20px !important;	font-weight: normal !important;}
h2{	font-size: 12px;margin: 4px 0px;}
h3{ font-size: 1.1em; margin: 0px;}
p {	text-align:left;margin: 8px 0px !important;	line-height: 150%;}
.mypost li{line-height: 180%;}

/* standard Hyperlink */
a {	text-decoration: none; color: #AF0000;}
a:hover { text-decoration: none; color: #333;}

/* standard Form */
form { margin: 0px;	padding: 0px;}
input,select,textarea,option,label { font-size: 12px;}
input.text { background-color: #fff; border: 1px solid #ccc;}
input.button{background-color: #f80;border: 1px solid #f80;	text-transform:capitalize; color: #fff;	padding: 4px 10px;}
select{	background-color: #FFFFFF;	border: 1px solid #ccc;	padding: 2px;}
textarea { background-color: #fff; border: 1px solid #ccc; padding: 4px;}

/* standard cell */
td, th {vertical-align: top;line-height: 150%;}
td.text, td.form {padding: 4px;}


.floatRight{ float: right; margin: 0px 5px 5px 10px;}
.floatLeft{ float: left;margin: 0px 10px 5px 0px;}
.center{text-align: center;}
.left{text-align:left;}
.right{ text-align: right;}
.justify{text-align:justify;}
.clear{	clear: both;}


.buttonLink{padding: 4px 10px;background: #669C19;color: #fff;font-weight: bold;}
.buttonLink:hover{padding: 4px 10px;background: #333;color: #fff;text-decoration: none;}
.image-border{	padding: 4px; border: 1px solid #ccc;background: #fff;}
.hr{ background: url(images/it-item.gif) repeat-x bottom #fff;clear:both; padding: 10px 0;}

a img{	border: none;}
strong{color: #af0000;}


/* layout start here */

.logo{ width: 245px; float:left;}
.logo a{ display: block; padding: 21px 0 0 0;}


/* adsense */
.google_ads_item{padding: 10px;}
.google_ads_item span{display: block; padding: 10px;}
.header-ads{width: 749px; float: right; padding-top: 21px;}
.header_google_ads{background: url(images/aller_01.gif) top left no-repeat #B0DD29; height:102px; text-align:center;}
.header_google_ads .google_ads_item{padding: 8px 10px 0 10px;}
.header_google_link_ads{text-align: right;}
.header_google_link_ads .google_ads_item{padding: 10px 10px 0 0;}
.sideber_google_ads{text-align: center;}
.top_google_link_ads{width: 528px; float: left; padding-top: 14px;}
.top_google_link_ads .google_ads_item{background: url(images/piek-01.gif) no-repeat left #333; height: 37px; padding: 0px; text-align: right}
.main_google_link_ads{background: #333;}
.bottom_google_ads{ background:#fff; padding:0 0 10px 0; text-align: center;}
.bottom_google_ads .google_ads_item{padding: 0px;}

/* menu kategori */
.top_menu{background: url(images/piek-02.gif) no-repeat; width: 476px; float: right; height: 51px;}
.nav-container{	height: 51px; overflow: hidden;}
.nav{ list-style: none;	margin:0px !important; padding: 28px 20px 0 30px;}
.nav li{ float:left; padding: 0 10px !important; font-weight: bold;}
.nav li.first{ border: none !important;}
.nav li a{ color: #E6FBD6;}
.nav li a:hover{ color: #fc0; text-decoration: none;}


/* spacer */
.top_spacer{height: 30px;}
.top_2_main{clear: both; background:url(images/piek-03.gif) no-repeat top; height: 6px; font-size: 1px;}
.bottom_spacer{ clear:both; background: url(images/gat.gif) no-repeat #fff; height:35px}


/* main layout */
.body{ width: 1004px; margin: auto; text-align: left;}
.header{ background: #3A3A3A;height: 158px;}
.main_wrap{background: url(images/vnl-bg.gif) repeat-y; width: 1004px;}
.main{ width: 579px; float: right;}
.main-content{ padding: 5px 20px; }
.bottom-wrap{ background: url(images/gat-bg.gif) repeat-x top #111; padding: 10px 0;}

/*sidebar*/
.sidebar{ width: 214px;	float: left;}
.sidebar2{ width:211px; float:left}


/* menu */
.menu{	padding: 0px 0px 10px 15px;}
.menu h3 { font-size: 1.3em; color: #fff; padding: 6px 0px 10px 0px; margin: 0px; text-align: center;}
.menu ul { list-style-type: none; margin: 0px; padding:0px;}
.menu ul li a{ display: block; width: 176px; padding: 6px 8px; color: #fff; font-weight: bold; background: #9DC81C; border-bottom: 1px solid #C7F14B;}
.menu ul li a:hover{ background: #333; color: #fff; text-decoration: none;}
ul.children li a{ font-weight: normal; width: 162px; padding: 6px 15px;	background: #9DC81C;}
ul.children li a:hover{ background: #333; color: #fff; text-decoration: none;}


/* bottom */
.footer{ text-align:center; padding:10px 10px 5px 10px; color: #fff}
.footer a{ color: #fff; }
.footer a strong{ color: #fc0 !important; }
.footer a:hover{ color: #fc0; }

/* search */
.search{padding: 10px 20px;}
.search h3{color: #fff; padding: 4px 0; text-transform: uppercase;}
.search form{ text-align: right; color: #fff; font-weight: bold;}
.search .text{ border: 1px solid #fff; background: #fff; width: 130px; color: #333; padding: 2px 4px;	font-weight: normal;}
.search .button{ background: #333 !important; border: 1px solid #333 !important; padding: 1px 1px;}

/* standard post */
.myTitle{padding-bottom: 0px; margin-bottom: 0px}
.post{ background: #fff;}
.post-content{ padding: 0;}
.post-category-main{ padding: 10px 0; text-transform: uppercase; font-size: 14px; font-weight: bold}
.post-item{	clear:both; padding: 10px 0 5px 0; background: url(images/it-item.gif) bottom repeat-x;}
.post-item h2{	font-size: 18px; font-weight: normal; padding: 4px 0; margin: 0}
.post-item-info{ font-size: 11px;}
.post-item-info a{color: #f80;}
.post-item-info a:hover{color: #333;}
.post-item-content{ padding: 4px;}
.post-item-content img{padding: 2px; border: 1px solid #ccc; background: #fff;}
.feature p{	width: 165px;float: left;display: block; margin: 0px !important;padding: 0px !important;}

/*latest-post*/
#latest-post{ clear: both; padding:10px 0}
#latest-post .post-item a.buttonLink{display:none;}
#latest-article{ padding: 10px 0px 10px 25px; background: #fff;}
#latest-article .post-item{clear: none; width: 305px; float: left; margin-right: 20px;}
#latest-article .post-item h2{font-size: 12px; font-weight: bold;}

/* archive post */
#archive .post-item a.buttonLink{display:none;}

/* banner */
.banner{
	text-align: center;
}
.banner-content{
	padding: 10px 0 0 0;
}

.banner-item{
	padding: 0 0 8px 0;
}

.banner-info{
	display: none;
	font-size: 11px;
	color: #f80;
}

.banner-item a img{
	border: 1px solid #fff !important;
	padding: 3px;
	background: #fff;
}

.banner-item a:hover img{
	background: #ECE4B5;
}


#banner-1{
	padding: 0;
}

#banner-1 .banner-content .banner-item a img{
	background: #efefef !important;
}

#banner-1 .banner-content .banner-item a:hover img{
	background: #ECE4B5 !important;
}

#banner-3{
	width: 220px;
	float:right;
	border: 1px solid #fff;
	margin: 30px 0 20px 20px;
	background: #E6FBD6;
}

#banner-3 .banner-info{
	display: block;
	text-align: right;
	padding: 10px 10px 0 10px;
	color: #ccc;
}


/* comment */
.mycomment{padding: 10px 0;}
.commentlist{margin: 0px; padding: 0px;}
.commentlist li{list-style: none; background: #E4F9C1; padding: 10px; margin-top: 10px;	margin-bottom: 10px;}
.commentlist li span{font-weight: bold;}
#commentform{padding: 10px;}
#author, #email, #url, #comment{border: 1px solid #ccc;}
#comment{width: 50%;}
#submit, .btn{ background-color: #f80;	border: 1px solid #f80;	text-transform:capitalize;color: #fff;padding: 4px 10px;}
#respond{padding-top: 20px;}


.prevNext a{ margin-top: 20px; padding: 10px 20px; background: #f90; color: #fff; display: block; text-align:center}
.prevNext a:hover{ padding: 10px 20px; background: #fc0; color: #fff;}
.prevLink{ float: left; width:160px;}
.nextLink{float: right; width: 160px;}


/* top-author */
.recent{padding: 10px 10px 8px 10px;}
.recent a{ color: #333; font-size: 11px}
.recent a:hover{ color: #fff;}
.recent ul{	margin: 0px;padding: 5px 10px;list-style: none;}
.recent ul li{ padding: 4px; border-bottom: 1px solid #fe0;}
.recent h3{ text-transform: uppercase; padding: 10px 10px 4px 10px; color: #fff}


/* wp calender */
.wp-calendar-wrap{padding: 0 0 0 10px}
.wp-calendar-wrap h3{ color: #fff; text-transform: uppercase; padding: 10px; text-align: center}
#wp-calendar{ width:184px;color: #fff;}
#wp-calendar td, #wp-calendar th{ padding: 4px; text-align: center;}
#wp-calendar caption{ font-weight: bold; text-transform:uppercase; text-align: center; padding: 4px; background: #89B30D; color: #fff;}
#wp-calendar td a{ color: #fff;	font-weight: bold; background: #89B30D;	display: block;	padding: 2px;}
#wp-calendar td a:hover{ color: #fff;background: #333;}



#preview_div{background: #efefef;text-align: center;}
#loader_bg {	FONT-SIZE: 1px; LEFT: 8px; WIDTH: 113px; POSITION: relative; TOP: 8px; HEIGHT: 7px; BACKGROUND-COLOR: #ebebe4}
.title_h2 {	PADDING-RIGHT: 0px; PADDING-LEFT: 18px; PADDING-BOTTOM: 0px; PADDING-TOP: 12px	text-align: center;text-transform: uppercase;}
.border_preview {BORDER-RIGHT: #444 1px solid; BORDER-TOP: #444 1px solid; Z-INDEX: 100; BACKGROUND: #fff; BORDER-LEFT: #444 1px solid; BORDER-BOTTOM: #444 1px solid; POSITION: absolute}
.preview_temp_load {	PADDING-RIGHT: 10px; PADDING-LEFT: 10px; PADDING-BOTTOM: 10px; VERTICAL-ALIGN: middle; PADDING-TOP: 10px; TEXT-ALIGN: center}
.preview_temp_load IMG {	VERTICAL-ALIGN: middle; TEXT-ALIGN: center}

pre code, .code{
	clear: both;
	padding: 6px;
	background: url(code_broom.gif) #efefef scroll;
	border: 1px solid #ccc;
	margin: 4px;
	display: block;
	font-family: arial;
	font-size: 10px;
	width: 500px;
	overflow: auto;
	line-height: 25px;
	color: #333;
}