@CHARSET "ISO-8859-1";

/* Grote opmaakelementen */

		html, body {
			height: 100%;
		}
		
		body {
			background: #fff url(/img/body_bg.png) repeat-y fixed 50% 0;
			background-position: center;
			margin: 0px;
			padding: 0px;
			font-family : Arial, sans-serif;
			color: black;
			text-align: center;
			font-size: 13px;
			line-height: 150%;
		}
		
		#container {
			height: auto !important;
			margin: 0 auto;
			min-height: 100%;
			position: relative;
			text-align: left;
			width: 950px;
			background: #2399c0;
		}
		
		#content {
			height: 490px;
			width: 830px;
			margin-left: 70px;
			position: relative;
		}
		
		#logobalk {
			height: 75px;
			width: 950px;
		}
		
		#menubalk {
			height: 113px;
			width: 827px;
			background: url(/img/menu_bg.png);
		}
		
		#lijndiv {
			height: 56px;
			width: 830px;
			padding: 13px;
		}
		
		#textbg {
			background: url(/img/textbg.png) repeat-y;
			width: 489px;
			margin-left: 335px;
			position: relative;
		}
		
		#textdiv {
			width: 482px;
			border-top: 1px solid white;
			border-bottom: 1px solid white;
			background: white;
			position: relative;
			min-height: 5px;
			display: none;
		}
		
		#enddiv {
			width: 489px;
			background: url(/img/enddiv.png) no-repeat;
			height: 24px;
			margin-left: 335px;
			position: relative;
		}
		
		#recent {
			width: 138px;
			height: 29px;
			background: url(/img/recent.png);
			margin-left: 598px;
			padding-top: 8px;
			padding-left: 20px;
		}
		
		.contentdiv {
			display: none;
		}
		.contentdiv img {
			margin-right: 15px;
		}
		#contentMain {
			display: inline;
		}
		
		#loader {
			background: url(/img/home.png);
			background: url(/img/homehover.png);
			background: url(/img/homecurrent.png);
			background: url(/img/projecten.png);
			background: url(/img/projectenhover.png);
			background: url(/img/projectencurrent.png);
			background: url(/img/werkwijze.png);
			background: url(/img/werkwijzehover.png);
			background: url(/img/werkwijzecurrent.png);
			background: url(/img/contact.png);
			background: url(/img/contacthover.png);
			background: url(/img/contactcurrent.png);
			background: url(/img/uptodate.png);
			background: url(/img/uptodatehover.png);
			background: url(/img/uptodatecurrent.png);
			background: url(/img/buttonuit.png);
			background: url(/img/buttonaan.png);
			background: url(/img/arrowup.png);
			background: url(/img/arrowuphover.png);
			background: url(/img/arrowdown.png);
			background: url(/img/arrowdownhover.png);
			height: 0px;
			width: 0px;
		}
		
		#projectbuttons {
			position: absolute;
			top: 300px;
			left: 115px;
			z-index: 99;
		}

/* Kleine opmaakelementen */

		#logoimg {
			margin-left: 93px;
			margin-top: 27px;
		}
		
		#menubalk a {
			float: left;
			display: block;
			margin-bottom: -2px;
			margin-left: 22px;
		}
		
		#lijndiv.home {
			background: url(/img/homelijn.png);
			/*background: url(/img/uptodatelijn.png);*/
		}
		
		#lijndiv.projecten {
			background: url(/img/projectenlijn.png);
		}
		
		#lijndiv.werkwijze {
			background: url(/img/werkwijzelijn.png);
		}
		
		#lijndiv.contact {
			background: url(/img/contactlijn.png);
		}
		
		#lijndiv.uptodate {
			background: url(/img/uptodatelijn.png);
			/*background: url(/img/homelijn.png);*/
		}
		
		#content.home {
			background: url(/img/homefoto.jpg) no-repeat;
			background-position: bottom left;
		}
		
		#content.projecten {
			background: url(/img/projectenfoto.jpg) no-repeat;
			background-position: bottom left;
		}
		
		#content.werkwijze {
			background: url(/img/werkwijzefoto.jpg) no-repeat;
			background-position: bottom left;
		}
		
		#content.contact {
			background: url(/img/contactfoto.jpg) no-repeat;
			background-position: bottom left;
		}
		
		#content.uptodate {
			background: url(/img/uptodatefoto.jpg) no-repeat;
			background-position: bottom left;
		}
		
		.button {
			background: url(/img/buttonuit.png);
			display: block;
			width: 137px;
			height: 38px;
			z-index: 99;
			padding-top: 10px;
			padding-left: 25px;
			color: #9f2d20;
		}
		
		.button:hover {
			background: url(/img/buttonaan.png);
		}
		
		#button1 {
			position: absolute;
			top: 380px;
			left: 115px;
			color: #9f2d20;
		}
			
		#button2 {
			position: absolute;
			top: 440px;
			left: 50px;
			color: #9f2d20;
		}
		
		#button3 {
			position: absolute;
			top: 500px;
			left: 155px;
			color: #9f2d20;
		}	

/* MenuID's */

	/* Home */

		a#homeknop {
			background: url(/img/home.png);
			width: 129px;
			height: 113px;
		}
		
		a#homeknop.current {
			background: url(/img/homecurrent.png);
		}
		
		a#homeknop.current:hover {
			background: url(/img/homehover.png);
			height: 113px;
		}
		
		a#homeknop:hover {
			background: url(/img/homehover.png);
			height: 99px;
		}
		
	/* Projecten */

		a#projectenknop {
			background: url(/img/projecten.png);
			width: 132px;
			height: 113px;
		}
		
		a#projectenknop.current {
			background: url(/img/projectencurrent.png);
		}
		
		a#projectenknop.current:hover {
			background: url(/img/projectenhover.png);
			height: 113px;
		}
		
		a#projectenknop:hover {
			background: url(/img/projectenhover.png);
			height: 99px;
		}
		
	/* Werkwijze */
		
		a#werkwijzeknop {
			background: url(/img/werkwijze.png);
			width: 132px;
			height: 113px;
		}
		
		a#werkwijzeknop.current {
			background: url(/img/werkwijzecurrent.png);
		}
		
		a#werkwijzeknop.current:hover {
			background: url(/img/werkwijzehover.png);
			height: 113px;
		}
		
		a#werkwijzeknop:hover {
			background: url(/img/werkwijzehover.png);
			height: 99px;
		}
		
	/* Contact */
		
		a#contactknop {
			background: url(/img/contact.png);
			width: 134px;
			height: 113px;
		}
		
		a#contactknop.current {
			background: url(/img/contactcurrent.png);
		}
		
		a#contactknop.current:hover {
			background: url(/img/contacthover.png);
			height: 113px;
		}
		
		a#contactknop:hover {
			background: url(/img/contacthover.png);
			height: 99px;
		}

	/* Up to date */
		
		a#uptodateknop {
			background: url(/img/uptodate.png);
			width: 135px;
			height: 113px;
		}
		
		a#uptodateknop.current {
			background: url(/img/uptodatecurrent.png);
		}
		
		a#uptodateknop.current:hover {
			background: url(/img/uptodatehover.png);
			height: 113px;
		}
		
		a#uptodateknop:hover {
			background: url(/img/uptodatehover.png);
			height: 99px;
		}

/* Algemene opmaak */

		img {
			border: 0;
		}

		p {
			padding: 0px 30px 10px 30px;
			margin:0px;
			font-size: 12px;
		}
		
		h1 {
			color: #9f2d20;
			font-weight: bold;
			padding-top: 10px;
			padding-left: 30px;
			padding-right: 30px;
			padding-bottom:0px;
			font-size: 14px;
		}
		h2 {
			color: #000000;
			font-weight: bold;
			padding: 0px 30px 0px 30px;
			font-size: 12px;
			margin:0px;
		}		
		a, a:hover, a:active, a:visited {
			color: black;
			text-decoration: underline;
			outline: none;
		}
		
		a.white:hover, a.white:visited, a.white:active {
			color: white;
		}
		
		.white {
			color: white;
		}
		
/* Carousel */

		.projectencarousel {  
			width: 172px;  
			height: 230px;
			position: relative;
		}
		
		.projectencarousel .wrapper {  
			width: 172px; 
			height: 230px;
			overflow: auto;  
			min-height: 10em;   
			position: absolute;  
			top: 0;
		}
		
		.projectencarousel .wrapper ul {  
			width: 9999px;  
			list-style-image: none;  
			list-style-position: outside;  
			list-style-type: none;  
			margin: 0;  
			padding: 0;  
			position: absolute; 
			top: 0;
		}
		
		.projectencarousel ul li {  
			display: block;  
			padding: 10px;  
			height: 38px;  
			width: 137px;
		}
		
		a.button:link,
		a.button:visited,
		.projectencarousel ul li a:link,
		.projectencarousel ul li a:visited		{
			text-decoration: none;
			color: #9f2d20;
		}	
		a.button:hover,
		a.button:active,
		.projectencarousel ul li a:hover,
		.projectencarousel ul li a:active		{
			text-decoration: none;
			color: #000000;
		}		
		
		.projectencarousel ul li a img {
			display: block;
		}
		
		.projectencarousel .arrow {  
			display: block;  
			height: 26px;  
			width: 26px;  
			text-indent: -999px;  
			cursor: pointer;
		}
		
		.projectencarousel .back {  
			position: absolute;  
			background: url(/img/arrowup.png) no-repeat 0 0;  
			left: 75px; 
			top: -30px;  
		}
		
		.projectencarousel .back:hover {  
			background: url(/img/arrowuphover.png) no-repeat 0 0;   
		}
		
		.projectencarousel .forward {  
			position: absolute;
			background: url(/img/arrowdown.png) no-repeat 0 0;    
			left: 75px;
			top: 237px;  
		}
		
		.projectencarousel .forward:hover {  
			background: url(/img/arrowdownhover.png) no-repeat 0 0;     
		}
		
