@media all {

	/* reset
	--------------------------------------------------------------------------*/
	body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td{margin:0;padding:0}
	address, caption, cite, code, dfn, em, strong, th, var{font-style:normal;font-weight:normal}
	input, textarea, select, button{font-size:100%}
	ul{list-style:none}
	table{border-collapse:collapse}
	fieldset, img{border:0}
	caption, th{text-align:left}
	q:before, q:after{content:''}


	/* global
	--------------------------------------------------------------------------*/
	html, body {
		background: #f3f3f3;
		height: 100%;
	}

	div.container {
		font: normal 12px/16px arial, helvetica, sans-serif;
		color: #666;
		width: 928px;
		margin: 0 auto;
		padding: 0 0 40px;
		overflow: hidden;
	}

	h1 {
		height: 64px;
		overflow: hidden;
	}

	h1 a {
		display: block;
		margin: 10px 0 0 388px;
		width: 150px;
		height: 45px;
		background: url('../img/logo.png') no-repeat 50% 50%;
		font-size: 1px;
		text-indent: 5px;
		color: #f2f2f2;
	}

	h1 a:focus {
		outline: 1px dotted #333;
	}

	h2 {
		font: normal 20px/22px georgia, garamond, serif;
		color: #333;
		height: 79px;
	}

	p.intro,
	div.adres p {
		font: normal 15px/19px helvetica, arial, sans-serif;
	}

	li a img {
		display: block;
	}

	div div p {
		max-width: 400px;
	}

	p strong {
		color: #333;
	}

	a {
		color: #09c;
	}

	a:hover {
		text-decoration: none;
	}

	p.footer {
		clear: both;
		font-size: 11px;
		margin: 7px 20px 0;
	}

	p.footer a {
		color: #666;
		text-decoration: none;
	}

	p.footer a:hover {
		color: #333;
	}

	p.footer span.sep {
		padding: 0 .35em;
	}

	p.footer a.feed {
		background: url('../img/feed.png') no-repeat 100% 50%;
		padding: 0 13px 0 0;
	}


	/* lightbox
	--------------------------------------------------------------------------*/
	div.lightbox-overlay {
		background: #000;
		position: absolute;
		width: 100%;
		top: 0;
		left: 0;
		z-index: 9;
	}

	div.lightbox-container {
		width: 100%;
		height: 100%;
		position: fixed;
		_position: absolute;
		top: 0;
		left: 0;
		background: url('../img/throbbler.gif') no-repeat 50% 50%;
		z-index: 12;
	}

	div.lightbox-container img {
		position: absolute;
		left: 50%;
		top: 50%;
		cursor: pointer;
		max-width: 90%;
		max-height: 90%;
	}


	/* home
	--------------------------------------------------------------------------*/

	body.home div.container {
		background: url('../img/home-canvas.png') no-repeat 0 0;
	}

	body.home ul.projecten {
		margin: 20px 0 0 20px;
		height: 704px;
	}

	body.home ul.projecten li {
		float: left;
		position: relative;
	}

		ul.projecten li a {
			outline: none;
		}

		ul.projecten li a:hover strong,
		ul.projecten li a:focus strong {
			background: url('../img/ezelsoor.png') no-repeat 100% 100%;
			_background-image: url('../img/ezelsoor-ie6.png');
		}

		ul.projecten li strong {
			position: absolute;
			right: 0;
			bottom: 0;
			width: 30px;
			height: 30px;
			text-indent: -999em;
			overflow: hidden;
			z-index: 1;
		}

		ul.projecten li {
			margin: 0 8px 8px 0;
			background: #fff;
		}

		ul.projecten li img {
			display: block;
		}

		ul.projecten li.row1 img {
			width: 440px;
			height: 330px;
		}

		ul.projecten li.row2 img {
			width: 291px;
			height: 219px;
		}

		ul.projecten li.row3 img {
			width: 172px;
			height: 129px;
		}

		ul.projecten li.row2 strong,
		ul.projecten li.row3 strong {
			_bottom: -1px;
		}

		ul.projecten li.row2,
		ul.projecten li.row3 {
			margin-right: 7px;
		}

		ul.projecten li.project4,
		ul.projecten li.project4 img {
			width: 292px;
		}

	body.home div.over,
	body.home div.opdrachtgevers {
		margin: 52px 20px 0 20px;
		width: 408px;
		float: left;
		_display: inline;
	}

	body.home div.over p,
	body.home div.opdrachtgevers p {
		margin: 0 0 24px;
	}

	body.home div.opdrachtgevers ul li {
		width: 166px;
		float: left;
	}

	body.home div.contact {
		padding: 13px 0 0 20px;
		position: relative;
		clear: both;
		background: url('../img/contact-canvas.png') no-repeat 100% 100%;
		width: 892px;
		height: 314px;
	}

	body.home div.adres {
		margin: 35px 8px 0 0;
		float: left;
		width: 290px;
	}

	body.home div.contact div.map {
		float: left;
		position: relative;
		margin: 22px 0 0;
		width: 590px;
		height: 285px;
	}

	body.home div.adres p.route {
		position: absolute;
		bottom: 19px;
		left: 20px;
		font-size: 11px;
		color: #333;
	}


	/* project
	--------------------------------------------------------------------------*/

	body.project {}

	body.project ul.show {
		background: #ccc;
		padding: 16px;
		overflow: hidden;
	}

	body.project ul.show li {
		background: url('../img/project-shadow.png') no-repeat 0 0;
		width: 448px;
		height: 338px;
		float: left;
	}

	body.project ul.show li a {
		position: relative;
		display: block;
		margin: 4px;
		width: 440px;
		height: 330px;
		text-decoration: none;
		overflow: hidden;
	}

		ul.show li a:hover strong,
		ul.show li a:focus strong {
			background: url('../img/ezelsoor.png') no-repeat 100% 100%;
			_background-image: url('../img/ezelsoor-ie6.png');
		}

		ul.show li strong {
			position: absolute;
			right: 0;
			bottom: 0;
			width: 30px;
			height: 30px;
			text-indent: -999em;
			overflow: hidden;
			z-index: 1;
		}

	body.project div.info {
		background: url('../img/home-canvas.png') no-repeat -20px -816px;
		margin: 16px 0 13px 20px;
		width: 440px;
		float: left;
		border-bottom: 2px solid #cecece;
		_display: inline;
	}

	body.project div.info h2 {
		margin: 16px 0 0;
		width: 400px;
	}

	body.project div.info p {
		width: 400px;
		margin: 0 0 13px;
	}

	body.project div.sitemap {
		background: url('../img/sitemap.png') no-repeat 0 100%;
		float: left;
		height: 172px;
		width: 191px;
		margin: 16px 0 0 136px;
	}

	body.project div.sitemap p {
		height: 16px;
		line-height: 8px;
		font-size: 11px;
		overflow: hidden;
		text-align: center;
	}

	body.project div.sitemap ul {
		margin: 13px 0 0 13px;
	}

	body.project div.sitemap ul li {
		float: left;
		margin: 0 2px 2px 0;
		overflow: hidden;
	}

	body.project div.sitemap ul li.row1 {
		width: 82px;
		height: 62px;
	}

	body.project div.sitemap ul li.row2 {
		width: 53px;
		height: 39px;
	}

		body.project div.sitemap ul li.project3 {
			width: 55px;
		}

	body.project div.sitemap ul li.row3 {
		width: 31px;
		height: 25px;
	}

		body.project div.sitemap ul li.project6 {
			width: 33px;
		}

		body.project div.sitemap ul li.project9 {
			width: 30px;
		}

		body.project div.sitemap ul li.project10 {
			width: 32px;
		}

	body.project div.sitemap ul li a,
	body.project div.sitemap ul li strong {
		display: block;
		height: 100%;
		text-indent: -999px;
	}

	body.project div.sitemap ul li strong {
		background: #fff;
	}

	body.project div.sitemap ul li a:hover {
		background: url('../img/ezelsoor-klein.png') no-repeat 100% 100%;
	}


	/* copyright / colophon
	--------------------------------------------------------------------------*/

	body.copyright-colofon .container{
	}

	body.copyright-colofon .copyright,
	body.copyright-colofon .colofon {
		background: url('../img/home-canvas.png') no-repeat -20px -816px;
		width: 440px;
		float: left;
		margin: 0 8px 0 0;
		padding-top: 16px;
	}

	body.copyright-colofon .copyright {
		margin-left: 20px;
	}

	body.copyright-colofon .copyright p,
	body.copyright-colofon .colofon p{
		margin-bottom: 24px;
	}

	body.copyright-colofon p.footer {
		position: relative;
		top: -12px;
		width: 888px;
		background: url('../img/copyright-colofon-streep.png') no-repeat 0 0;
		padding: 15px 0 0;
	}
}

@media print {

	/* print fixes
	--------------------------------------------------------------------------*/

	h1 a {
		font-size: 50px;
		color: #000;
		text-decoration: none;
	}
}