@charset "utf-8";
/* CSS Document */

/* ****************************************************
	GENERAL LAYOUT
   **************************************************** */
   
   body 
   {
   		font-size: 62.5%;
		font-family: Arial, Helvetica, sans-serif;
		background: #f5f5f5;
		background: url(../images/background/body_gradient.jpg) repeat-x top left;
   }
   

   
   ul, ol { margin-left: 25px; }
   
   ul li
   {
		list-style-image: url(../images/objects/li.gif);
   }
   
   ul.lvl2 li 
   {
   		list-style: none;
		padding-left: 10px;
		font-size: 1em;
   		background: url(../images/objects/li2.gif) no-repeat 0 50%;
   }
   
   .padding { padding: 20px 25px; }
   
   .center { margin: 0 auto; }
   .left { float: left; }
   .right { float: right; }
   
   .clear:after
   {
   		content: ".";
		display: block;
		clear: both;
		height: 0;
		visibility: hidden;
   }
   
   * html .clear { height: 1%; } /* IE5 + IE6 hack */
   *:first-child+html .clear { min-height: 1px; } /* IE7 hack */
   
   

   
   
   /* links opmaak */
   a { color: #940806; }
   a:hover { text-decoration: none; }
   
   strong { font-weight: bold; font-style: normal; }
   em { font-weight: normal; font-style: italic; }
   
   p { margin: 10px 0;}
   
   
   /* font sizes */
   p, li { font-size:  1.1em; }
   h2 { font-size: 1.5em; font-weight: bold; font-family: "Myriad Pro", Verdana, Arial, Sans-serif; }
   .red { color: #a60a09; }
   

   h2 
   {
   		margin-bottom: 15px;
		padding-bottom: 5px;
		color: #202020;
		border-bottom: #202020 1px solid;
   }
   

/* ****************************************************
	HEADER
   **************************************************** */

	#header,
	#page, 
	#container,
	#drop
	{
		position: relative;
		height: 219px;
		width: 860px;
	}
	
	#container 
	{
		padding: 0 15px;
		height: auto;
		background: url(../images/background/drop_top.jpg) no-repeat top left;
	}
	
	#drop
	{
		padding: 0;
		margin: 0 auto;
		height: auto;
		width: 890px;
		background: url(../images/background/drop.jpg) repeat-y top left;
	}
	
	#header
	{
		background: url(../images/background/header_1.jpg) no-repeat top center;
	}
	
	#logo
	{
		width: 239px;
		height: 59px;
		position: absolute;
		text-indent: -5000px;
		background: url(../images/objects/logo.gif) no-repeat; 
		top: 30px;
		left: 170px;
	}
	
	#menu 
	{
		position: absolute;
		top: 127px;
		left: 170px;
	}
	
	#menu li,
	#menu li a
	{
		display: block;
		float: left;
		color: white;
		text-decoration: none;
		font-size: 1.2em;
		font-weight: bold;
		height: 30px;
	}
	
	#menu li
	{
		
		background: url(../images/objects/corner.gif) no-repeat bottom center;
		margin-right: 30px;
	}

	#menu li a:hover
	{
		text-decoration: underline;
	}

/* ****************************************************
	BODY BACKGROUND
   **************************************************** */
   
   /*body
   {
   		background: url(../images/background/wall.jpg) repeat-x top left;
   }
   
   #wall_left
   {
   		width: 50%;
		height: 100%;
		background: url(../images/background/wall_left.gif) repeat-x top left;
		position: absolute;
		left: 0;
		top: -1px;
   }
   
   #wall_right
   {
   		width: 50%;
		height: 100%;
		background: url(../images/background/wall_right.gif) repeat-x top left;
		position: absolute;
		right: 0;
		top: -3px;
   }*/
   

/* ****************************************************
	PAGE
   **************************************************** */
   
   	#page
	{
		background: #696969 url(../images/background/header_2.jpg) no-repeat top center;
		padding-top: 160px;
		height: auto;
	}
	
	#content
	{
		width: 840px;
	}
	
	.fotos { width: 430px; }
	.fotos_home { width: 840px; clear: both; }
	
	.bedrijfsinfo,
	.specialisaties,
	.contactform,
	.full
	{
		border: 2px solid white;
	}
	
	.bedrijfsinfo
	{
		width: 395px;
		background: white url(../images/background/bedrijfsinfo_grad.jpg) no-repeat top left;
		border: 2px solid white;
		margin-bottom: 20px;
	}

	
	.realisaties
	{
		width: 395px;
		color: white;
		background: white url(../images/background/gradient_rood.jpg) repeat-x top left;
		voice-family: "\"}\"";
		voice-family: inherit;
		width: 399px;
	}
	
	.realisaties h2 
	{ 
		color: white; 
		border-bottom: none;
		background: url(../images/background/lijn_rood.jpg) repeat-x bottom left;
	}
	
	.specialisaties
	{
		width: 414px;
		margin-bottom: 20px;
		background: white url(../images/background/specialisaties_grad.jpg) no-repeat top right;
		voice-family: "\"}\"";
		voice-family: inherit;
		width: 418px;
	}
	
	.contactform,
	.full
	{
		margin: 0 20px 20px 20px;
		background: white url(../images/background/specialisaties.jpg) no-repeat top right;
	}
	
	ul
	{
		margin-left: 15px;
	}
	
	.fotokader
	{
		background-color: white;
		padding: 5px;
		margin-right: 7px;
		margin-bottom: 7px;
	}
	
	.fotos_home .fotokader
	{
		margin-right: 15px;
		padding: 8px;
	}
	
	.fotos .last
	{
		margin-right: 0;
	}
	
	.fotos a img
	{
		filter:alpha(opacity=60);
		-moz-opacity:0.6;
		-khtml-opacity: 0.6;
		opacity: 0.6;
	}
	
	.fotos a:hover img 
	{
		filter:alpha(opacity=100);
		-moz-opacity:1.0;
		-khtml-opacity: 1.0;
		opacity: 1.0;
	}
	
	#footer_gradient 
	{
		background: url(../images/background/gradient_footer.jpg) repeat-x bottom left;
	}
   

/* ****************************************************
	FOOTER
   **************************************************** */
	
	#contact
	{
		padding: 184px 0 0 0;
		margin-top: 10px 0 50px 0;
		position: relative;
	}
	
	#contact_img
	{
		background: url(../images/background/footer.jpg) no-repeat top left;
		position: absolute;
		width: 320px;
		height: 184px;
		top: 0;
		left: 0;
		z-index: 2;
	}
	
	#line
	{
		position: absolute; 
		top: 173px;
		border-top: 1px solid #717070;
		height: 1px;
		width: 800px;
		margin: 0 20px;
		z-index: 1;
	}
	
	#contact .gegevens
	{
		position: absolute;
		top: 35px;
		left: 100px;
		z-index: 3;
	}
	
	#contact .gegevens,
	#contact .gegevens a,
	#contact .gegevens h2
	{
		color: #e6e5e5;
		border-bottom: none;
	}
	
	#contact .gegevens a:hover { text-decoration: none; }
	
	#telefoon { margin-left: 20px; }
	
	#contact .menu { margin-top: 20px; }
	
	#contact .copyright { margin-bottom: 100px; margin-top: 5px; }
	
	#contact .menu,
	#contact .copyright
	{ text-align: center; }
	
	#contact .menu,
	#contact .menu a,
	#contact .copyright,
	#contact .copyright a
	{
		color: #b6b6b6;
	}
	
	#contact .menu a { margin: 0 6px; }


/* ****************************************************
	WERKWIJZEN PAGINA
   **************************************************** */
	ul.werkwijze_menu
	{
		margin-bottom: 20px;
		width: 100%;
		list-style-type: none;
		display: block;
	}
	
	ul.werkwijze_menu li
	{
		list-style: none;
		display: inline;
		
		
		height: 30px;
		line-height: 30px;
	}
		
	ul.werkwijze_menu li a
	{
		color: #494949;
		display: block;
		height: 30px;
		line-height: 30px;
		text-decoration: none;
		padding-left: 20px;
		background: #E0DDD7 url(../images/background/li3.jpg) no-repeat top left;
		border-bottom: 1px solid #cdcdcd;
		border-top: 1px solid #f5f5f5;
	}
	
	ul.werkwijze_menu li a:hover
	{
		text-decoration: underline;
	}
	
	ul.werkwijze_menu li.first a
	{
		border-top: none;
	}
	
	ul.werkwijze_menu li.last a
	{
		border-bottom: none;
	}
	
	ul.werkwijze_menu .title span
	{
		display: block;
		background: url(../images/background/red_title.jpg) repeat-x top left;
		height: 30px;
		line-height: 30px;
		color: white;
		font-size: 1.2em;
		padding: 0 8px;
		font-weight: bold;
		border: none;
	}
	
	div.werkwijze_menu
	{
		width: 220px;
	}
	
	div.werkwijze_page
	{
		width: 560px;
		margin-left: 30px;
		margin-right: 10px;
		background: white url(../images/background/specialisaties.jpg) no-repeat top right;
	}
	

	
	div.werkwijze_fotos
	{
		margin: 30px;
		margin-right: 10px;
		width: 560px;
		z-index: 10;
	}
	

