

	html, body
	{
		height: 100%;
	}

	body
	{
		margin: 0px;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 13px;
		line-height: 19px;
		letter-spacing: 0.01em;
		color: #4a4a4a;
		background: url(images/patroon.gif) 50% 50%;
		overflow: hidden; /* in firefox, for the overlay not to bring scrollbars */
	}

	#center
	{
		position: absolute;
		left: 50%;
		top: 50%;
		width: 0px;
		height: 0px;
	}

	#backgroundImage
	{
		position: absolute;
		display: block;
	}
	img#backgroundImage.ranonkels
	{
		top: -241px;
		left: 322px;
	}
	img.gitaar
	{
		left: 304px;
		top: -198px;
	}
	.steen
	{
		left: 304px;
		top: 142px;
	}
	img.fotokader
	{
		left: 59px;
		top: -159px;
	}

	#panel
	{
		position: absolute;
		left: -403px;
		top: -310px;
		width: 807px;
		height: 620px;
	}
	#panelBackground /* separate container for the png background as IE6 renders all element inside a png container unclickable */
	{
		position: absolute;
		left: -403px;
		top: -310px;
		width: 807px;
		height: 620px;
		background: url(images/paneel.png);
	}

	#socialmedia
	{
		position: absolute;
		color: white;
		cursor: default;
		z-index: 1;
	}

	#menu
	{
		position: absolute;
		right: 30px;
		top: 68px;
		color: white;
		cursor: default;
	}
	#menu a
	{
		color: white;
		text-decoration: none;
	}
	#menu a.active
	{
		font-weight: bold;
	}

	fieldset
	{
		border: 0px;
		margin: 0px;
		padding: 0px;
	}
	label
	{
		display: block;
		float: left;
		width: 96px;
		margin-right: 11px;
		text-align: right;
	}
	input.text
	{
		font-family: Arial, Verdana, Helvetica, sans-serif;
		float: left;
		border: 1px solid #b0b0b0;
		border-width: 0px 0px 1px 1px;
		padding: 1px 2px 2px 2px;
		width: 273px;
		color: #4c4c4c;
		font-size: 13px;
		background: transparent;
		margin-bottom: 20px;
	}
	textarea
	{
		font-family: Arial, Verdana, Helvetica, sans-serif;
		float: left;
		border: 1px solid #b0b0b0;
		border-width: 0px 0px 1px 1px;
		padding: 1px 2px 2px 2px;
		width: 273px;
		height: 99px;
		color: #4c4c4c;
		font-size: 13px;
		background: transparent;
		overflow: auto;
	}
	input.image
	{
		margin: 12px 0px 0px 307px;
	}

	#content
	{
		position: absolute;
		left: 61px;
		top: 129px;
		width: 699px;
		height: 381px;
	}
	#content.guestbook
	{
		width: 719px;
		height: 381px;
		overflow: auto;
	}

	#content .block
	{
		float: left;
	}

	#content .separatorVertical
	{
		height: 100%;
		width: 1px;
		background: #bdbdbd;
		float: left;
	}

	#content .separatorHorizontal
	{
		height: 1px;
		overflow: hidden;
		width: 100%;
		background: #bdbdbd;
		float: left;
	}

	#content h1
	{
		font-size: 22px;
		font-weight: normal;
		color: #646464;
		margin: 10px 0px 36px 0px;
	}

	#content h2, #content .illumination
	{
		font-size: 15px;
		font-weight: bold;
		color: #646464;
		margin: 0px;
	}

	#content a
	{
		text-decoration: none;
/*		border-bottom: 1px solid #acacac;*/
		color: #4a4a4a;
	}
	#content a.line
	{
		border-bottom: 1px solid #acacac !important;
	}
	#content a.noline
	{
		border-bottom: 0px;
	}
	#content a.hemelsblauw
	{
		font-size: 14px;
		color: #245590;
	}
	#contentKinderen
	{
		position: absolute;
		top: 236px;
		left: 0px; /* for IE6 */
	}
	.sterKinderen
	{
		position: absolute;
		left: -53px;
		top: -31px;
		width: 53px;
		height: 63px;
		background: url(images/ster.gif);
	}
	#sterKinderenGuestbook
	{
		top: 343px;
		left: 9px;
	}
	#sterKinderenMusic
	{
		top: 253px;
	}

	#uil
	{
		position: absolute;
		left: 151px;
		top: 327px;
		width: 62px;
		height: 97px;
		background: url(images/uil.gif);
		z-index: 1;
	}
	#contentDuo
	{
		position: absolute;
		top: 330px;
		left: 310px;
		width: 365px;
		height: 35px;
		line-height: normal;
		z-index: 2;
	}
	#contentDuo .block
	{
		width: 175px;
	}
	#contentDuo a
	{
		color: #878787;
		border: 0px;
	}

	#guestbookPosts
	{
		width: 653px;
		margin: 50px 0px 0px 0px;
padding-bottom: 40px;
		cursor: default;
		clear: both;
	}
	#guestbookPosts div.message
	{
		padding: 0px 4px;
	}
	#guestbookPosts div.hover
	{
		background: url(images/bgHover.png);
	}
	#guestbookPosts div div
	{
		font-size: 12px;
		font-style: italic;
		margin-bottom: 18px;
	}
	#guestbookPosts div div span
	{
		font-size: 11px;
	}
	#guestbookPosts a
	{
		border: 0px !important;
	}
	#guestbookFeedbackMessage
	{
		float: left;
		width: 320px;
		height: 170px;
		margin: 50px 0px 0px 50px;
	}

	#content.contact
	{
		top: 119px;
	}
	#content.contact h1
	{
		margin-top: 0px;
		margin-bottom: 20px;
	}
	#content.contact label
	{
		width: 90px;
	}
	#content.contact form
	{
		float: left;
		width: 414px;
		margin-top: 30px;
		margin-left: -20px;
	}
	#content.contact textarea
	{
		height: 64px;
	}
	#contactFeedbackMessage
	{
		float: left;
		width: 414px;
		margin-top: 60px;
	}

	#content.music a
	{
		border: 0px;
		cursor: pointer;
	}
	div.track
	{
		padding: 1px 5px;
		cursor: default;
	}
	div.track.hover, div.track.active
	{
		background: url(images/bgHover.png);
	}
	div.track div
	{
		display: block;
		width: 172px;
		float: right;
		font-size: 11px;
		letter-spacing: normal;
	}
	div.track div span
	{
		font-size: 9px;
		display: inline;
	}

	#credits
	{
		color: #ababab;
		font-size: 10px;
		text-align: right;
		letter-spacing: normal;
		position: absolute;
		left: -403px;
		top: 302px;
		width: 788px;
	}
	#credits a
	{
		color: #ababab;
		text-decoration: none;
	}


.scrollControlsY{
	display:block;
	position: absolute;
	top:0;
	right:0;
	height:100%;
	width:12px;
}

.upBtn{
	display:block;
	position:absolute;
	top:0;
	right:0;
	width:12px;
	height:16px;
	background: url(images/scrollbarArrowUp.png) no-repeat 0 0;
	cursor:pointer;
}
.downBtn{
	display:block;
	position:absolute;
	bottom:0;
	right:0;
	width:12px;
	height:16px;
	background: url(images/scrollbarArrowDown.png) no-repeat;
	cursor:pointer;
}
.scrollBar{
	display:block;
	position: absolute;
	top:19px;
	right:0;
	bottom:19px;
	width:12px;
	background: url(images/scrollbarTrack.png) no-repeat;
}

.scrollHandle{
	display:block;
	position:absolute;
	top:0px;
	right:0;
	width:12px;
	height:35px;
	min-height:13px;
	cursor: pointer;
	padding:3px 1px;
}

.scrollHandleBG{
	display:block;
	position: relative;
	height:100%;
	width:10px;
	background: url(images/scrollbarUnitBg.png) repeat-y;
}
.scrollHandleMiddle{
	display:block;
	position: absolute;
	width:10px;
	height:9px;
	background: url(images/scrollbarUnitMiddle.png) no-repeat 2px 0;
	top:50%;
	margin:-4px 0 0 0;
}
.scrollHandleTop{
	display:block;
	position:absolute;
	width:10px;
	height:3px;
	background: url(images/scrollbarUnitTop.png) no-repeat 0px bottom;
	top:0;
	margin: 0 0 0 0;
}
.scrollHandleBottom{
	display:block;
	position:absolute;
	width:10px;
	height:3px;
	background: url(images/scrollbarUnitBottom.png) no-repeat;
	bottom:0;
	margin:0 0 0 0;
}

