/* normalise basic styles, to get all browsers similar */
html, body {height:100%; margin: 0; padding:0; background: #fff;}
h1, h2, h3 {margin: 0.75em 0; padding: 0; letter-spacing: normal;}
h4, h5, h6, p {margin: 1em 0; padding: 0;}
form, dl, dt, dd {margin: 0; padding:0;}
ul, ol {margin-left: 0; padding-left: 1em;}
fieldset {border: none; margin: 1em 0; padding: 0;}
textarea {font-size: 1em;}    
/* equalise font-size with <input elements> */
pre {font: 100% Monaco,'Courier New',courier, monospace;}
/* turn off default image border */
a img {border: 0;}
/* image preloader */
img.preload {display: none;}

/*basic font style*/
body {
  font: normal normal normal 10px Verdana, Helvetica, sans-serif; 
}

/*cascading bull sheet*/
#container {
	width: 1000px;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	float: left;
	margin-bottom: -20px;
	background: #fff url('img/bg.body.jpg') no-repeat top left; 
}

#header {
	height: 241px;
	background: transparent url('img/head.logo.gif') no-repeat 64px 76px; 
}

ul#topnav {
	width: 200px;
	float: left;
	margin: 0;
	padding: 55px 0 0 43px;
	list-style-type: none;
	vertical-align: top;
}
	ul#topnav li, ul#topnav li a {
		width: 150px;
		margin: 0;
		padding: 6px 0;
		font: normal normal normal 15px Arial, sans-serif; 
		color: #999;
	}
	ul#topnav li a {
		padding-left: 23px;
		border-left: solid #ddd 2px;
		
		text-decoration: none;
	}
	ul#topnav li a:hover, ul#topnav li a.crnt:hover {
		border-left: solid #1b710d 2px;
	}
	ul#topnav li a.crnt {
		border-left: solid #56eb43 2px;
	}

#topc {
	width: 751px;
	min-height: 249px;
	height: auto !important;
	height: 249px;
	margin-left: -1px;
	padding: 0;
	float: left;
	background: #f5f4ed url('img/bg.topc.jpg') no-repeat 653px 0; 
	position: relative;
}
	#topc p#leftsect {
		width: 350px;
		height: 150px;
		margin: 30px 0 0 45px;
		padding: 30px 0 0 12px;
		position: absolute;
		z-index: 5;

		color: #999;
		font-size: 10px;
		line-height: 13px;
		text-align: justify;
	}
	#topc p#leftsect a {
		color: #777;
	}
	#topc p.welkom {
		background: transparent url('img/topc.welkom.gif') no-repeat top left; 
	}
	#topc p.intro {
		background: transparent url('img/topc.intro.gif') no-repeat top left; 
	}
	#topc p.portfolio {
		background: transparent url('img/topc.portfolio.gif') no-repeat top left; 
	}
	#topc p.cv {
		background: transparent url('img/topc.cv.gif') no-repeat top left; 
	}
	#topc p.contact {
		background: transparent url('img/topc.contact.gif') no-repeat top left; 
	}
	#topc b.title {
		margin-left: 2px;
		text-align: center;
		font: oblique small-caps bold 15px/18px Arial, Helvetica, sans-serif; 
		letter-spacing: 2px;
		color: #888;
	}
	#topc p#fout {
		width: 650px;
		margin: 30px 0 0 45px;
		padding: 30px 0 0 12px;
		background: transparent url('img/topc.fout.gif') no-repeat top left; 

		color: #e77;
		font-size: 10px;
		line-height: 13px;
	}

	#topc ul.clinks {
		width: 285px;
		height: 150px;
		margin: 40px 5px 0 15px;
		padding: 45px 0 0 0;
		float: right;
		vertical-align: middle;
		list-style-type: none;
		
		color: #129d2e;
	}
	#topc ul.clinks li {
		margin: 0;
		float: left;
		
		font: normal normal bold 13px/15px Arial, Helvetica, sans-serif; 
	}
	#topc ul.clinks li a {
		width: 90px;
		display: block;
		margin: 3px 35px 3px 0;
		padding-left: 15px;
		background: transparent url('img/bullet.daq.gif') no-repeat left center; 
		
		color: #777;
		line-height: 20px;
		text-decoration: none;
		letter-spacing: 1px;
	}
	#topc ul.clinks li a:hover {
		background: transparent url('img/bullet.daq.gif') no-repeat 2px center; 
		text-decoration: underline;	
	}
	#topc img.fullview {
		width: 730px;
		margin: 1px 1px 0 0;
		border: solid white 10px; 
		border-bottom: solid white 15px; 
	}
	#topc p.pictitle{
		width: 700px;
		margin: -12px 0 0 0;
		padding: 0 15px;
		float: right;	
		position: absolute;
		z-index: 15;
		
		text-align: center;
		font: normal normal normal 9px Arial, Helvetica, sans-serif; 
		letter-spacing: 2px;
		color: #777;
	}
	#topc img.bgtopc {
		height: 249px;
		margin-right: 1px;
		float: right;
	}
	#topc #flashbox {
		width: 374px;
		height: 339px;
		margin-right: 1px;
		float: right;
	}

#ctnt {
	width: 750px;
	padding-bottom: 60px;
	float: left;
	clear: left;
	background: transparent url('img/bg.ctnt.jpg') no-repeat 0 0; 
}
	a.mlink {
		margin-left: 8px;
		padding-right: 10px;
		background: transparent url('img/bullet.daq.gif') no-repeat right center; 
		
		color: #555;
		font-size: 11px;
		font-weight: bold;
		text-decoration: none;
	}
	a.mlink:hover {
		padding-right: 12px;
	}
	#ctnt p, #ctnt a p {
		margin: 3px 0 10px 20px;

		color: #777;
		text-decoration: none;
	}
	#ctnt p a {
		color: #555;
		text-decoration: underline;
	}
	#ctnt p a:hover {
		color: #222;
		text-decoration: none;
	}	
	#ctnt p.photo {
		padding-top: 10px; 
		padding-bottom: 28px;
	}
	#ctnt ul {
		margin-left: 40px;
		list-style: none;
	}
	#ctnt h1 {
		margin: 3px 0 0 27px;

		font: normal normal normal 20px Verdana, Helvetica, sans-serif; 
		letter-spacing: 2px;
	}
	#ctnt h3, #ctnt a h3  {
		margin: 3px 0 0 27px;

		color: #129d2e;
		font-size: 13px;
		text-decoration: none;
	}

#leftc {
	width: 300px;
	margin: 31px 0 0 60px;
	padding: 30px 10px 10px 2px;
	float: left;
	display: inline;
	border-right: dotted #ddd 1px;
	
	color: #aaa;
	background: transparent url('img/h1.introductie.gif') no-repeat 27px 0px; 
}
	
#rightc {
	width: 350px;
	padding: 30px 0 10px 0;
	margin: 30px 0 0 10px;
	float: left;
	background: transparent url('img/h1.uitgelicht.gif') no-repeat 20px 0px; 
}

#fullc {
	width: 700px;
	margin: 31px 0 0 40px;
	padding: 30px 0 10px 2px;
	float: left;
	display: inline;
	
	color: #aaa;
}
#ctnt .intro {
	background: transparent url('img/h1.evenvoorstellen.gif') no-repeat 27px 0px; 
}
#ctnt .portfolio {
	background: transparent url('img/h1.overportfolio.gif') no-repeat 27px 0px; 
}
#ctnt .cv {
	background: transparent url('img/h1.downloaden.gif') no-repeat 27px 0px; 
}
#ctnt .contact {
	background: transparent url('img/h1.bereikbaarheid.gif') no-repeat 27px 0px; 
}
#ctnt .fotografie {
	background: transparent url('img/h1.fotografie.gif') no-repeat 27px 0px; 
}
#ctnt .webdesign {
	background: transparent url('img/h1.webdesign.gif') no-repeat 27px 0px; 
}
#ctnt .threedesign {
	background: transparent url('img/h1.3Ddesign.gif') no-repeat 27px 0px; 
}
#ctnt .kunst {
	background: transparent url('img/h1.kunst.gif') no-repeat 27px 0px; 
}
#ctnt .publishing {
	background: transparent url('img/h1.publishing.gif') no-repeat 27px 0px; 
}
#ctnt .php {
	background: transparent url('img/h1.php.gif') no-repeat 27px 0px; 
}

#ctnt #featbox {
	width: 347px;
	height: 97px;
	margin: 5px 0 38px 0;
	background: transparent url('img/bg.featbox.gif') no-repeat 0 0; 
	text-align: center;
}
#ctnt #featbox img {
	width: 343px;
	height: 93px;
	margin: 2px;
}
#ctnt div.pfdesc {
	width: 338px;
	height: 110px;
	margin: 5px;
	float: left;
	overflow: hidden;
}
#ctnt div.pfdesc a:hover h3 {
	color: #0f7723;
	text-decoration: underline;
}
#ctnt div.pfdesc a:hover p {
	color: #777;
	text-decoration: underline;
}
#ctnt div.pfimg {
	width: 130px;
	min-height: 104px;
	height: auto !important;
	height: 104px;
	margin: 4px;
	float: left;
	background: transparent url('img/bg.pfimg.gif') no-repeat 0 0; 
	
	text-align: center;
}
#ctnt div.pfimg img {
	width: 126px;
	height: 100px;
	margin: 2px;
}
#ctnt div.pfimg a {
	color: #333;
	text-decoration: none;
}
#ctnt div.tiles {
	margin: 0 30px;
	float: left; 
}
#ctnt abbr, #ctnt acronym, #ctnt .help {
  border-bottom: 1px dotted #aaa;
  cursor: help;
 }


#footer {
	width: 750px;
	height: 20px;
	float: left;
	clear: left;
	text-align: center;
	
	color: silver;
	letter-spacing: 2px;
	font: normal normal normal 9px/16px Arial, Helvetica, sans-serif; 
}
#footer span {
	color: #75c767
}

/* Google Chrome link underline fix */
a {
	text-decoration: none;
}