body {
	margin:0;
	padding:0;
	font-size:75%;
	color:#636466;
	font-family:arial, helvetica, sans-serif;
	letter-spacing:1px;
	line-height:1.2em;
	background: #e1e4e4 url(images/bodybg.jpg) bottom left fixed repeat-x;
	background:#BFBBB4;}

#main {
	position:absolute;
	width:960px;
	height:580px;
	top:50%;
	left:50%;
	padding:0;
	margin:-290px 0 0 -480px;	
	background:#fff;}

/*============== navigatie ==============*/	
#navigatie{
	position: absolute;
	top:0;
	height:40px;
	left:0;
	right:0;
	padding:20px 0 0 23px;
	background:#fff url(images/verloopboven.jpg) repeat-x bottom left;}
	
#navigatie ul, #navigatie li{
	margin:0;
	padding:0;
	list-style:none;}
	
#navigatie li{
	list-style:none;
	float:left;}	
	
a.active{
	color:#825227;
	background:#edeeef;}
	
#navigatie a{
	display:block;
	height:26px;
	width:85px;
	padding-top:10px;
	margin:0 0 0 -1px;
	text-align:center;
	font-size:12px;
	color:#636466;
	font-variant:small-caps;
	font-weight:bold;
	letter-spacing:1px;
	text-decoration:none;
	border:1px solid #E2E2E2;}

#navigatie a:hover{ 
	background:#edeeef;}

#navigatie a#nav-home{
	display:block;
	width: 60px;
	height: 35px;
	padding:0;	
	margin:0 5px 0 0;
	line-height:200px;
	overflow:hidden;
	background:url(images/home.gif);}	
	
#navigatie a#nav-home.active, 
#navigatie a#nav-home:hover{
	background:url(images/home_over.gif);}	

/*============== subnavigatie ==============*/	
#subnavigatie{
	position:absolute;
	overflow:auto;
	height:106px;
	right:0;
	bottom:0;
	left:0;
	padding:4px 10px 0 15px;
	background:#fff url(images/verlooponder.jpg) repeat-x top left;}

#content.projecten #subnavigatie{
	bottom : auto;
	top:409px;
}	
#subnavigatie td{
	padding:0 5px;}

#subnavigatie a img{
	-moz-opacity:0.5;
	opacity:0.5;
	border:1px solid #E2E2E2;}
	
#subnavigatie a:hover img{
	-moz-opacity:1;
	opacity:1;}
	
#subnavigatie a{
	text-decoration:none;
	font-size:80%;
	color:#000;}
	
/*============== accent balk &logo ==============*/
#accentbalk{	
	position:absolute;	
	width:150px;
	height:580px;
	top:0;
	right:0;
	padding:0;
	margin:0;
	background:#e37d24;}
	
#logo{	
	position:absolute;	
	width:191px;
	height:60px;
	top:24px;
	right:30px;
	padding:0;
	margin:0;
	background:url(images/logo.gif) no-repeat;}
			
/*============== content ==============*/
#content {
	position:absolute;
	width:960px;
	height:485px;
	top:60px;
	left:0;
	margin:0;
	padding:0;
	background:#edeeef;
	border-top:1px solid #A8A8A8;
	border-bottom:1px solid #A8A8A8;}
	
#bedrijven #content, #particulieren #content {
	height:409px;
	border-bottom:none;}
	
#tekst, #foto{
	position:absolute;
	overflow:auto;
	width:429px;
	height:421px;
	top:23px;
	left:515px;
	margin:0;
	padding:15px 15px 0 0;}
	
#foto{
	overflow:hidden;
	width:400px;
	height:409px;
	left:23px;
	padding:15px;
	
	background:#bfbfbf;}
	
#foto ul{
	padding:0;
	margin:0;
	list-style:none;}
	
#foto li{
	padding:0;
	top:0;
	left:0;
	margin:0;
	list-style:none;}
	

	
 #tekst.project{
	height:330px;}
	
#foto.project{
	height:335px;}
	
.prevnext{
	position:absolute;
	height:20px;
	top:365px;
	left:740px;
	margin:0;
	padding:0;
	line-height:0;}
	
.prevnext a{
	padding:0 16px;
	color:#636466;
	font-variant:small-caps;
	font-weight:bold;
	letter-spacing:1px;
	text-decoration:none;
	border:1px solid #bfbfbf;
	background:url(images/verlooponder.jpg) repeat-x top left;}

.prevnext a:hover{
	text-decoration:none;
	background:#edeeef;}
	
/*============== extra ==============*/

h1, h2, dt b, dt strong, h3, dd b, dd strong {
	font-weight:normal;
	color:#636466;	
	font-size: 1.4em;
	letter-spacing:2px;
	font-variant:small-caps;}

h2, dt b, dt strong {
	font-size:1.1em;
	font-variant:normal;}

h3, dd b, dd strong{
    font-size:1.0em;
    color:#4d4d4d;}
	
dt{
	margin-bottom:0;}

dt.toggle{
	cursor:hand;
	cursor:pointer;
}

dd{
	margin:0;
	padding:0 10px;
	border-top:1px solid #e37d24;
	border-bottom:1px solid #e37d24;
	background:#d6d7d8;
	z-index:10}
	
dt p, dd p{
	display:inline;
}

ul, ol{
	padding:0 0 0 20px;}

#content a, #content a:visited, dt span, dd span{
	font-weight:normal;
	color:#57340D;
	text-decoration:none}

dt.expanded span.read-more{
	display:none;}
	
#content a:hover{
	text-decoration:none;
	color:#e37d24;}

img{
	border:none;}
	
img.rechts{
	float:right;
	margin:0 0 0 20px;}
	
img.links{
	float:left;
	margin:0 20px 0 0;}
	
.rechts{
	text-align:right;
	font-weight:bold;}

/*============== formulier ==============*/
form span{
	font-size:150%;
	color:#b05a19;}
		
input:focus, textarea:focus {
 	background:#bfbfbf;
	color:#fff;}
		
.inputkort, .inputmidden, .inputlang, textarea{
	border: 1px solid #636466;
	margin:2px 0px;
	padding-left:3px;
	background:none;}
	
.inputkort{
	width:60px;}
	
.inputlang{
	width:280px;}
	
textarea{
	width:344px;
	height:200px;
	overflow:auto;}

input.knop{
	border:1px solid #edeeef;
	width:80px;
	margin:5px 30px 0 0;
	background:#636466;
	color:#fff;}

input.knop:hover{
	background:#fff;
	color:#636466;}



/*Preview*/

#mask{
	position:absolute;
	overflow:hidden;
	top:0;
	left:0;
	bottom:0;
	right:0;
	margin:0;
	padding:0;
	background:#fff;
	-moz-opacity:0.85;
	opacity:0.85;}

#preview{
	position:absolute;
	overflow:hidden;
	top:45%;
	left:50%;
	background:#E5E5E1;
	border:1px solid #c2c2c2;
	z-index:15;}
	
#preview img{
	margin:10px;
	border:1px solid #000;	
	cursor:pointer;}

#preview p{
	margin:0;
	padding:5px 100px 5px 10px;
	color:#fff;
	font-size:90%;
	line-height:1.1em;
	background:#e37d24;}
	
#preview div.controls{
	position:absolute;
	width:auto;
	right:14px;
	bottom:5px;
	padding:0;	
	text-align:right; }
	
#preview span{
	padding:0 5px;
	color:#636466;
	font-variant:small-caps;
	font-weight:bold;
	letter-spacing:1px;
	text-decoration:none;
	border:1px solid #bfbfbf;
	background:url(images/verlooponder.jpg) repeat-x top left;}