/************************************************************************************
	@Project		Tobbedansen
	@Author			Jochen Vandendriessche <hello@joggink.be>
	@Design			Dieter Deweirdt <info@12pmstudios.be>
************************************************************************************/

/* easy reset */
*{
	margin: 0;
	padding: 0;
	font-size: 1em;
	font-weight: normal;
	list-style-type: none;
}

/* fix safari subpixel text rendering */
html{
	-webkit-font-smoothing: antialiased;
}

/* fix html5 displays */
header,footer,nav,section{
	display: block;
}
a img { border: solid 0 #fff;}
/* body style */
body{
	font: .8125em/1.4 arial, helvetica, sans-serif;
	color: #fff;
	background: #18358f url('../i/body.jpg') repeat-x 60% 228px;
	position: relative;
}

/* main header cloud animation */
@-webkit-keyframes CLOUD-MOVE {
	from {
		background-position:  50% 0, 90% 10px, 0% 0;
	}
	to {
		background-position: 50% 0, 90% 10px, 1300% 0;
	}
}

/* main header style */
#head{
	background: url('../i/skyline.png') repeat-x center top,
				url('../i/birds.png') no-repeat 90% 10px,
				url('../i/clouds.png') repeat-x center top;
	-webkit-animation-name: CLOUD-MOVE;
	-webkit-animation-duration: 300s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;
}

	#head header{
		width: 960px;
		margin: 0 auto;
		position: relative;
		min-height: 166px;
	}
	
		#head header .tagline{
			position: absolute;
			left: -9999em;
			text-indent: -9999em;
		}
		
		#head header h1{
			padding: 40px 0 0 260px;
		}
		
		#head header h1 a{
			display: block;
			text-indent: -9999em;
			width: 440px;
			height: 80px;
			background: url('../i/tobbedansen.png') no-repeat left top;
		}
	
	#head header .logo{
		position: absolute;
		right: 0;
		top: 27px;
		width: 172px;
		height: 172px;
		background: url('../i/grass.png') no-repeat center 97px;
		padding: 0 85px;
	}
	
/* navigation style */
nav{
	background: #eedb03 url('../i/nav-bottom.png') repeat-x center bottom;
	padding: 0 0 15px;
}

	nav ul{
		width: 960px;
		margin: 0 auto;
		overflow: hidden;
		text-transform: uppercase;
	}
	
		nav ul li{
			float: left;
			margin: 10px 5px;
		}

			nav ul li.current-menu-item a,
			nav ul li.current_page_item a{
				display: block;
				-webkit-border-radius: 3px;
				-moz-border-radius: 3px;
				border-radius: 3px;
				background: #fff;
				-webkit-box-shadow: inset 1px 1px 5px rgba(0,0,0,.35);
				-moz-box-shadow: inset 1px 1px 5px rgba(0,0,0,.35);
			}

			nav ul li a{
				display: block;
				padding: 5px 10px;
				color: #231f20;
				text-decoration: none;
				text-shadow: 1px 1px 1px rgba(255,255,255,.8);
				position: relative;
				z-index: 9999;
			}

/* wrapper style */
#wrapper{
	background: url('../i/reed.png') repeat-x 50% bottom,
				url('../i/boat.png') no-repeat 20% bottom,
				url('../i/bottom.png') repeat-x 30% bottom;
				
	overflow: hidden;
}
	
/* content style */
.content{
	width: 960px;
	margin: 30px auto 80px;
	position: relative;
	z-index: 9999;
	min-height: 400px;
	position: relative;
}

.content a { color: #eedb03;}
.content a:hover { color: #fff;}

.intro ol, .intro ul { margin: 0 0 20px 40px;}
.intro ol, .intro ol li { list-style-type: decimal;}
.intro li { margin: 0 0 5px 0;}

.content:after{
	display: block;
	content: '.';
	visibility: hidden;
	height: 0;
	float: none;
	clear: both;
}

	.content section{
		float: left;
		width: 622px;
		margin: 0 18px 18px 0;
	}

	.content header{
		font-family: 'helvetica neue', 'arial narrow', arial, helvetica, sans-serif;
		color: #fff;
		font-size: 1.53em;
	}
	
	.content header h2{
		text-shadow: 0 -1px 0px rgba(0,0,0,.5);
		font-size: 1.5em;
	}
	
	.content .intro h3{
		text-shadow: 0 1px 0px rgba(255,255,255,.5);
		font-family: 'helvetica neue', 'arial narrow', arial, helvetica, sans-serif;
		font-size: 1.5em;
		color: #193c94;
		margin-bottom: 1em;
	}
	
	.content .intro h4{
		text-shadow: 0 -1px 0px rgba(0,0,0,.5);
		font-family: 'helvetica neue', 'arial narrow', arial, helvetica, sans-serif;
		font-size: 1.5em;
		color: #eedb03;
		margin-bottom: 0.8em;
	}
	
	.content p,
	.content div#_mcePaste{
		margin-bottom: 1em;
	}
	
	.content article{
		overflow: hidden;
		margin: 10px 0;
		min-height: 120px;
	}
	
	.content article header{
		float: right;
		width: 490px;
	}
	
		.content article header a{
			color: #fff;
		}
		.content article header .datetime{
			font-size: .65em;
			color: #56a4d7;
			font-style: italic;
			margin: 0 0 .5em;
		}
	
	.content article .thumb{
		width: 100px;
		max-width: 100px;
		min-width: 100px;
		background: #fff;
		padding: 10px;
		-webkit-box-shadow: 0 2px 5px rgba(0,0,0,.75);
		float: left;
		margin: 0 10px 10px 0;
	}
	.content article .entry-content {
		margin: 0 0 0 130px;
	}

.cnt ul, .cnt ul li { list-style: disc;}
.cnt .imgLeft { float:left; margin: 0 10px 10px 0; -webkit-box-shadow: 0 2px 5px rgba(0,0,0,.75);}

.fotoAlbums a.fotos08 {display: block; float:left; margin: 0 10px 0 0; text-indent: -9999em; width: 155px; height: 152px; background: url('../i/fotos08.png') no-repeat left top;}
.fotoAlbums a.fotos09 {display: block; margin: 0 0 0 165px; text-indent: -9999em; width: 155px; height: 152px; background: url('../i/fotos09.png') no-repeat left top;}
.fotoAlbums a.fotos10 {
display: block;
float: left;
margin: 0 10px 0 0;
text-indent: -9999em;
width: 155px;
height: 152px;
background: url('http://www.tobbedansen.be/wp-content/uploads/2011/08/fotos10.png') no-repeat left top;
}

/* form */
.wpcf7-form label { display: block; float:left; width: 150px; clear:left;}
.wpcf7-form input,
.wpcf7-form textarea { margin: 0 0 5px 0; background-color: rgba(255,255,255,.5); border: solid 1px #fff; padding: 3px 5px; width: 350px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
.wpcf7-form input.wpcf7-acceptance { width: 20px; float:left;}
.wpcf7-form input#button { margin: 20px 0; width: 140px; height: 30px; font-size: 16px; font-weight: bold; background-color: #fff; color:#183991; -webkit-box-shadow: 0 2px 5px rgba(0,0,0,.75);}
.wpcf7-form input#button:disabled { background-color: rgba(255,255,255,.5);;}
.wpcf7-not-valid-tip { color: #333;}
/* first widget area */
#primary.widget-area{
	margin-top: 2.8em;
	width: 320px;
	float: right;
}

#primary.widget-area ul{
	list-style-type: none;
}
		/* programma widget */
		#primary.widget-area #text-6{
			margin: .5em 0;
		}
		
			.widget-area h3{
				font-family: 'arial narrow', 'helvetica neue', arial, helvetica, sans-serif;
				font-size: 2.3em;
				color: #fff;
				margin-bottom: .2em;
				text-shadow: 0 -1px 1px rgba(0,0,0,.5);
			}
			
		#primary.widget-area dl.programma{
			overflow: hidden;
		}
		
			dl.programma dt{
				float: left;
				width: 130px;
				color: #56a4d7;
				font-style: italic;
			}
			
			dl.programma dd{
				float: left;
				width: 190px;
			}
			
				dl.programma dd h4{
					font-weight: bold;
				}
				
				dl.fullProgramma { overflow: hidden; margin: 0 auto 25px auto; }
				dl.fullProgramma dt{
					float: left;
					width: 50px;
					font-style: italic;
					color: #56a4d7;
					font-weight: bold;
				}

				dl.fullProgramma dd{
					float: left;
					width: 570px;
				}

					dl.fullProgramma dd h4{
						font-weight: bold;
					}

		/* got to do it dirty... */
			#primary.widget-area #text-4{
				width: 184px;
				position: relative;
				left: -9px;
				background: url('../i/subscribe.png') no-repeat left top;
				padding: 20px 10px 30px 135px;
				color: #354754;
			}

			#text-4 h3{
				font-size: 1.53em !important;
				color: #193c93 !important;
			}
			#text-4 a { display:block; text-decoration:none; color: #354754;}
			#text-4 a:hover {color: #000 !important;}
		/* locatie */
		#primary.widget-area #text-7{
			padding: 0 200px 10px 0;
			background: url('../i/locatie.png') no-repeat right 2em;
		}

		/* vorige edities */
		#primary.widget-area #text-8{
			margin-top: 2em;
			height: 283px;
			background: url('../i/vorige-edities.png') no-repeat center top;
		}
		
			#primary.widget-area #text-8 h3{
				position: absolute;
				left: -9999em;
				text-indent: -9999em;
			}

/* footer style */
footer{
	display: block;
	position: relative;
	top: -12px;
	background: url('../i/footer-top.png') repeat-x center top;
}

	footer #colophon{
		background: url('../i/dino.png') no-repeat 90% 30%,
					#6b4527 url('../i/footer.png') repeat-x center top;
		padding: 10px 0 0;
		min-height: 230px;
		color: #d9bca0;
		position: relative;
		top: 12px;
	}

	footer #footer-widget-area{
		width: 978px;
		margin: 0 auto;
		overflow: hidden;
	}
	
		#colophon h3{
			margin-bottom: 18px;
		}
	
		#colophon ul{
			list-style-type: none;
		}
		
			#colophon .widget-area{
				float: left;
				width: 302px;
				margin: 9px;
			}
			
			#second ul.blogroll li{
				float: left;
				text-align: center;
				margin: 0 8px 18px 0;
			}
			
			#third ul.blogroll li{
				margin-bottom: 18px;
			}
			
#credits{
	background: #57371f;
}

.ccredits{
	width: 960px;
	margin: 0 auto;
	overflow: hidden;
	padding: 12px 0;
	color: #af773f;
	font-size: .9em;
	text-shadow: 0 -1px 1px rgba(0,0,0,.5);
}

.ccredits a{
	color: #af773f;
	text-decoration: none;
	border-bottom: 1px solid #af773f;
}

.ccredits a:hover{
	border-bottom-width: 0;
	-webkit-opacity: .8;
	-moz-opacity: .8;
	opacity: .8;
}

	#site-info{
		float: left;
	}
	
	#site-generator{
		float: right;
	}