/*	TRES INTERNET 
	-------------
	CSS bestand vrijgegeven onder C.C. licentie:
	http://creativecommons.org/licenses/by-sa/3.0/nl/
*/

@import url("reset.css");
@import url("menu.css");
@import url("content.css");

/*----------------------------
	LAYOUT
----------------------------*/
body,html{overflow-x: hidden;}

*, body{
	margin: 0;
	padding: 0;
	position: static;
	}

body{
	background: #fff url("../img/bgBody.jpg") 50% top repeat-x;
	}

body#lightbox{
	background: #fff;
	overflow: hidden;
	}

div#wrapper{
	display: block;
	position: absolute;
	min-height: 100%;
	width:100%;
	}

	div#site{
		display: block;
		margin: 0 auto 100px;
		width: 940px;
		}

		div#navigatie{
			margin: 0 20px;
			height: 70px;
			background: transparent url("../img/bgNavigatie.png") left top no-repeat;
			position: relative;
			z-index: 2;
			}

		body#home div#header{
			height: 307px;
			}

		body#pagina div#header{
			height: 147px;
			}

		div#header{
			position: relative;
			z-index: 1;
			overflow:hidden;
			}
		
			div#header img{
				float: left;
				display: inline;
				}

			div#shadow1,
			div#shadow2{
				position: absolute;
				z-index: 2;
				left: 0;
				width: 940px;
				overflow: hidden;
				}

			div#shadow1{
				top: 0;
				height: 15px;
				background: transparent url("../img/shadow1.png") left top no-repeat;
				}

			div#shadow2{
				bottom: 0;
				height: 10px;
				background: transparent url("../img/shadow2.png") left top no-repeat;
				}

			div#calltoaction{
				position: absolute;
				z-index: 3;
				bottom: 0;
				right: 20px;
				width: 190px;
				height: 70px;
				}

				div#calltoaction a:link,
				div#calltoaction a:visited{
					float: left;
					display: block;
					overflow: hidden;
					height: 70px;
					width: 190px;
					text-decoration: none;
					text-indent: -9999px;
					background: transparent url("../img/CallToAction.png") left top no-repeat;
					}

				div#calltoaction a:hover,
				div#calltoaction a:active{
					background-position: left -70px;
					}

		div#container{
			background: transparent url("../img/bgContainer.png") left top no-repeat;
			min-height:350px;
			height:auto !important;
			height:350px;
			position: relative;
			}

			div#content{
				float: left;
				display: inline;
				width: 520px;
				margin: 20px 20px 0 20px;
				padding: 0 20px;
				}

			div#sidebar{
				float: right;
				display: inline;
				width: 290px;
				margin: 20px 20px 125px 0;
				padding: 0 15px;
				}

/*LOGO
----------------------------*/
div#logo{
	position: absolute;
	z-index: 3;
	top: 3px;
	left: 10px;
	width: 136px;
	height: 64px;
	background: transparent url("../img/logoWoonaccent.jpg") left top no-repeat;
	}

	div#logo img{
		float: left;
		display: inline;
		}

	img#Woonaccent{
		width: 104px;
		height: 56px;
		}

	img#NVM{
		margin: 15px 0 0 12px;
		width: 20px;
		height: 26px;
		}

/*FOOTER
----------------------------*/
div#footer{
	position: absolute;
	display: block;
	bottom: 0;
	display: block;
	background: #ccc;
	height: 74px;
	width: 100%;
	background: transparent url("../img/bgFooter.gif") left bottom repeat-x;
	}

	div#woonaccentBord{
		position: absolute;
		z-index: 3;
		bottom: 76px;
		left: 50%;
		margin-left: 320px;
		width: 100px;
		height: 125px;
		background: transparent url("../img/WoonaccentBord.png") left bottom no-repeat;
		}

	div#footerLinks{
		width: 940px;
		margin: 0 auto;
		height: 24px;
		text-align: center;
		font-size: 11px;
		line-height: 24px;
		color: #ccc;
		}

		div#footerLinks a,
		div#footerLinks a:link,
		div#footerLinks a:visited{
			color: #fff;
			text-decoration: none;
			}

		div#footerLinks a:hover,
		div#footerLinks a:active{
			color: #ccc;
			}

/*DOCK
--------------------------*/
div#dock{
	height: 50px; 
	text-align: center;
	bottom: 24px;
	left: 0px;
	width: 100%;
	z-index: 10;
	}

	div.dock-container{
		position: absolute;
		z-index: 10;
		height: 50px;
		}

		a.dock-item{
			display: block; 
			font: bold 12px Arial, Helvetica, sans-serif;
			width: 50px; 
			color: #000; 
			bottom: 0px; 
			position: absolute;
			text-align: center;
			text-decoration: none;
			}

			a.dock-item span{
				position: absolute;
				z-index: 99;
				top: -60px;
				left: -45px;
				display: none;
				padding: 20px;
				width: 120px;
				height: 50px;
				text-align: left;
				background: transparent url("../img/dockBalloon.png") left top no-repeat;
				font: bold italic 10px/12px "Trebuchet MS", "Segoe UI", trebuchet, helvetica, arial, geneva, sans-serif;
				color: #042e6f;
				}

			a.dock-item img{
				float: left;
				display: inline;
				border: none; 
				margin: 0px; 
				width: 100%;
				}