
body {
	text-align: center;
	background-color:#3b444c ;
}


#frame {
	width: 958px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 10px;
	text-align: left;
	background-image:url(../pics/shadowright.gif);
  	background-position: right center;
  	background-repeat: repeat-y;
  /*background-color: #3f3f3f;*/
  	background-color: #000000;
}
#homebutton{
	position:relative; width:260px; height:70px;left:20px; top:25px;float:left;
}
#header {
	height: 159px;
	width:958px;
	background-color: #000;
	background-image: url(../pics/header_back.jpg);	
	text-align:left;
	background-repeat:no-repeat;
	margin: 0px;
}
#intro_werk {
	position: relative;
  	width: 950px;
  	height:273px;
  	background-color: #000 ;
  	background-image:url(../pics/back_werk.jpg);
  	background-repeat: no-repeat;
  /*background-image:url(../pics/back_02_blue.gif);*/
  /*background-repeat: repeat-x;*/
  	margin: 0 0 0 0;
  	padding: 0 0 0 0;
}
#intro_contact {
	position: relative;
  	width: 950px;
  	height:273px;
  	background-color: #cccccc ;
  	background-image:url(../pics/back_contact02.jpg);
  	background-repeat: no-repeat;
  	margin: 0 0 0 0;
  	padding: 0 0 0 0;
}
#home_kader01 {
	position: relative;
  	width: 950px;
  	height:273px;
  	background-color: #000 ;
  	background-image:url(../pics/back_home.jpg);
  	margin: 0 0 0 0;
  	padding: 0 0 0 0;
}
#home_kader02 {
	position: relative;
  	width: 950px;
  	height:273px;
 /* background-color: #cccccc ;  */
 /*  background-image:url(../pics/back_01_blue.gif);*/
  /* background-repeat: repeat-x;*/
  	margin: 0 0 0 0;
  	padding: 0 0 0 0;
  	font-size:12px;
  	font-weight: normal;
	font-family: "Trebuchet MS";
	color: #ffffff;
	
	background-color: #000000;
	margin-top:6px;
}
#home_kader03 {
	position: relative;
	height:133px;
 /* background-color: #37404a ;*/
   /* background-image:url(../pics/back_01_grey.gif);*/
  /*  background-repeat: repeat-x;*/
  	margin: 0px 0px 0px 0px;
  	padding: 0px 0px 0px 0px;
}

#enverder {
	
	margin-left:360px;
	height:273px;
	
}

#home_kader01 p.intro,#home_kader01 p,#home_kader02 p.intro, #intro_werk p.intro, #intro_contact p.intro {
	width: 850px;
	margin-left: 50px;
	line-height:26px;
	font-size:16px;
	font-weight: bold;
	font-family: "Trebuchet MS";
	color: #ffffff;
}

#home_kader01 p.intro,#intro_werk p,#intro_contact p {
	margin-top:30px;
}

#content p, #home_kader01 p, #home_kader02 p, #home_kader03 p, #intro_werk p, #intro_contact p {
	font-size:12px;
	font-weight: normal;
	font-family: "Trebuchet MS";
	color: #ffffff;
	margin-left: 50px;
	line-height:20px;
	padding-right:20px;
}

#home_kader03 table td p {
	font-size:12px;
	font-weight: normal;
	font-family: "Trebuchet MS";
	color: #ffffff;
	line-height:20px;
	padding-left:50px;
	margin:0px;
}

table td p {
	font-size:12px;
	font-weight: normal;
	font-family: "Trebuchet MS";
	color: #ffffff;
	line-height:20px;
	margin:0px;
}

p {
	font-size:12px;
	font-weight: normal;
	font-family: "Trebuchet MS";
	color: #ffffff;
	line-height:20px;
	margin-top:10px;
}

#content table td p.bold {
	font-weight: bold;
}

#content table td p {
	font-size:12px;
	font-weight: normal;
	font-family: "Trebuchet MS";
	color: #b2b2b2;
	line-height:20px;
	margin:0px;
	font-weight:normal;
}

span.sub {
	font-size:12px;
	font-weight: normal;
	font-family: "Trebuchet MS";
	color: #b2b2b2;
	line-height:20px;
	margin:0px;
	font-weight:bold;	
}

#projecten_afbeelding {
	position: relative;
	float:left;
	width: 255px;
	margin-left: 50px;
}

#contact {
	margin-left: 0px;
}

#contact p {
	margin-left:50px;	
}

#projecten01 {
	float:left;
	margin-left: 0px;
}

#projecten ul li {
	list-style-image: url(../pics/arrow_home.gif);
	list-style-position: inside;
	margin: 0px;
	padding:0px;
	color: #fff;
}

#googlemap {
	margin-top:6px;	
	margin-left:20px;
margin-bottom:10px;
}


#content_contact {
	margin-top:6px;	
}

#content_contact ul {
	margin-top:10px;
	margin-left:-25px;
}

#content_contact li {
	font-size:12px;
	font-weight: normal;
	font-family: "Trebuchet MS";
	color: #b2b2b2;
	margin:0px;
	font-weight:normal;
	list-style-image: url(../pics/li_element02.gif);
	list-style-position: inside;
	line-height: 15px;
	margin:0 0 0 40px;
}

#content_contact li a {
	font-size:12px;
	font-weight: normal;
	font-family: "Trebuchet MS";
	color: #b2b2b2;
	text-decoration:underline;
}

ul#navlist {
	text-align:right;
	margin-left: 172px;
	padding-top:115px;
	padding-right: 14px;;
	white-space: nowrap;
}

#navlist li {
	display: inline;
	list-style-type: none;
}

#navlist a { 
	padding: 0px 10px; 
}

#navlist a:link, #navlist a:visited {
	font-family: "Trebuchet MS";
	font-size:20px;
	font-weight:normal;
	color: #c2c2c2;
	text-decoration: none;
	letter-spacing:1px;
}

#navlist a:hover {
	color: #fff;
	text-decoration: none;
}

#navlist a.huidig {
	font-size: 20px;
	color: #5d3007;
	text-decoration: none;
}

/* for Internet Explorer */
/*\*/
* html #frame {
min-height: 605px;
}
/**/

img {
border:0;	
}

p a {
	font-family: "Trebuchet MS";
	font-size:12px;
	font-weight:bold;
	color: #e87712;
	text-decoration: none;
}

p a:hover {
	text-decoration: underline;
}

span.header02 {
	font-size:20px;
	font-weight: normal;
	font-family: "Trebuchet MS";
	color: #e87712;	
	margin-top: 0px;
	margin-left:20px;
	padding-left:28px;
	background-image: url(../pics/header_ornament.gif);
 	background-repeat:no-repeat;
	height:28px;
}

h1 {
	font-size:20px;
	font-weight: normal;
	font-family: "Trebuchet MS";
	color: #e87712;	
	margin-top: 0px;
	margin-left:20px;
	padding-left:28px;
	background-image: url(../pics/header_ornament.gif);
	background-repeat:no-repeat;
	height:28px;
}

h1.sec {
 border-top:dotted #683300 1px;width:870px;
}
h2.sec {
 border-top:dotted #683300 1px;width:870px;
}


h2 {
	font-size:20px;
	font-weight: normal;
	font-family: "Trebuchet MS";
	color: #e87712;	
	margin-top: 0px;
	margin-left:20px;
	padding-left:28px;
	background-image: url(../pics/header_ornament.gif);
	background-repeat:no-repeat;
	height:28px;
}
h3 {
	font-size:20px;
	font-weight: normal;
	font-family: "Trebuchet MS";
 	color: #e87712;	
	margin-top: 0px;
	margin-bottom:0px;
}

#footer {
    text-align:center;
    position:relative;     
    color: #fff;
    font-family: "Trebuchet MS";
    font-size:11px;
    letter-spacing:1px;
    width:958px;
    margin-top:0px;
    padding-top:5px;
	background-image: url(../pics/footer_back.gif);
	background-repeat: no-repeat;
	height:34px;
}

/* SLIDER HOMEPAGE*/ 

#slider{}	

#slider ul, #slider li {
	padding:0px 0px 0px 0px;
	margin: 25px 25px 25px 25px;
	float: left;
	list-style:none;
}

#slider li { 
/* 
define width and height of list item (slide)
entire slider area will adjust according to the parameters provided here
*/ 
	width:900px;
	height:450px;
	overflow:hidden; 
}
	
#prevBtn, #nextBtn { 
	display:block;
	width:30px;
	height:77px;
	position:relative;
}

#prevBtn { 
	top: -170px;
	left:0px;
}		
	
#nextBtn { 
	top: -250px;
	left:510px;
}		
												
#prevBtn a, #nextBtn a {  
	display:block;
	width:30px;
	height:77px;
	background:url(../images/btn_prev.gif) no-repeat 0 0;	
}	

#nextBtn a { 
	background:url(../images/btn_next.gif) no-repeat 0 0;	
}	

.panel img {
margin-right:15px;	
float:left;
}	

#klantenlijst {
	height:300px;
}									

.kolom01,.kolom02,.kolom03 {
float:left;
margin-left:32px;
width:280px;
}
.adres,.info {
	width:380px;
	float:left	
}

#info {
	width:940px;
	height:215px;	
}
#info p {
	margin-left:48px;
margin-right:42px;
width:473px;
}
#klantenlijst p {
		margin-left:48px;
}
/* // Easy Slider */	


	#slider{ height: 179px;position:absolute;left:40px;}	
	#slider ul, #slider li{
		margin:0;
		padding:0;
		list-style:none;
		}
	#slider li{ 
		/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ 
		width:312px;
		height:186px;
		overflow:hidden; 
		}	
		
		
		
		

		* { margin: 0; padding: 0 }
		/* I've used a hard CSS reset above, but you should consider a more sophisticated reset, such as this one: http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ */
		
		#slider1 p, #slider2 p, #slider3 p {color:#c5c5c5;}
		#slider1 p.bold, #slider2 p.bold, #slider3 p.bold {font-weight: bold;}
		
		p#cross-links { text-align: center }
		
		p#cross-links { border-bottom: 1px solid #ccc; margin-bottom: 30px; padding-bottom: 30px }
		
		noscript p, noscript ol { color: #a00; font-size: 13px; line-height: 1.4em; text-align: left }
		noscript a { color: #a00; text-decoration: underline }
		noscript ol { margin-left: 25px; }
		
		a:focus { outline:none }
		
		img { border: 0;margin-top:3px; }
		
		
		

		
		.stripViewer .panelContainer .panel ul {
			text-align: left;
			margin: 0 15px 0 30px;
		}
		
		.slider-wrap01 { /* This div isn't entirely necessary but good for getting the side arrows vertically centered */
			margin: 6px 0;
			position: relative;
			width: 100%;
			height:462px;
		}
		.slider-wrap02 { /* This div isn't entirely necessary but good for getting the side arrows vertically centered */
			margin: 6px 0;
			position: relative;
			width: 100%;
			height:480px;
		}
		.slider-wrap03 { /* This div isn't entirely necessary but good for getting the side arrows vertically centered */
			margin: 6px 0;
			position: relative;
			width: 100%;
			height:480px;
		}

		/* These 2 lines specify style applied while slider is loading */
		.csw {width: 100%; height: 460px; background: #000; overflow: scroll;}
		.csw .loading {margin: 200px 0 300px 0; text-align: center}

		.stripViewer { /* This is the viewing window */
			position: relative;
			overflow: hidden; 
			/*border: 1px dotted #464646; /* this is the border. should have the same value for the links */
			margin: auto;
			width: 700px; /* Also specified in  .stripViewer .panelContainer .panel  below */
			height: 420px;
			clear: both;
			background: #000;
		}
		
		.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */
			position: relative;
			left: 0; top: 0;
			width: 100%;
			list-style-type: none;
			height:420px;
			/* -moz-user-select: none; // This breaks CSS validation but stops accidental (and intentional - beware) panel highlighting in Firefox. Some people might find this useful, crazy fools. */
		}
		
		.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
			float:left;
			height: 100%;
			position: relative;
			width: 700px; /* Also specified in  .stripViewer  above */
			height:420px;
		}
		
		
		.stripViewer .panelContainer .panel .wrapper { /* Wrapper to give some padding in the panels, without messing with existing panel width */
			padding: 10px;
						

		}
		
		.stripNav { /* This is the div to hold your nav (the UL generated at run time) */
			margin: auto;
		}
		
		.stripNav ul { /* The auto-generated set of links */
			list-style: none;
		}
		
		.stripNav ul li {
			float: left;
			margin-right: 2px; /* If you change this, be sure to adjust the initial value of navWidth in coda-slider.1.1.1.js */
		}
		
		.stripNav a { /* The nav links */
			font-size: 10px;
			font-weight: bold;
			text-align: center;
			line-height: 32px;
			background: #c6e3ff;
			color: #fff;
			text-decoration: none;
			display: block;
			padding: 0 10px;
		}
		
		.stripNav li.tab1 a { background: #000; font-size:11px;width:120px;font-family: "Trebuchet MS";}
		.stripNav li.tab2 a { background: #000; font-size:11px;width:130px;font-family: "Trebuchet MS";}
		.stripNav li.tab3 a { background: #000; font-size:11px;width:120px;font-family: "Trebuchet MS";}
		.stripNav li.tab4 a { background: #000; font-size:11px;width:120px;font-family: "Trebuchet MS";}
		.stripNav li.tab5 a { background: #000; font-size:11px;width:120px;font-family: "Trebuchet MS";}
		
		.stripNav li a:hover {
			background: #333;
		}
		
		.stripNav li a.current {
			background: #000;
			color: #fff;
		}
		
		.stripNavL, .stripNavR { /* The left and right arrows */
			position: absolute;
			top: 50px;
			
			text-indent: -9000em;
		}
		
		.stripNavL a, .stripNavR a {
			display: block;
			height: 70px;
			width: 70px;
		}
		
		.stripNavL {
			left: 50px;
		}
		
		.stripNavR {
			right: 50px;
		}
		
		.stripNavL {
			background: url("../pics/arrow_left.gif");
			background-position: center;
  			background-repeat: no-repeat;

		}
		.stripNavL:hover {
			background: url("../pics/arrow_left-over.gif");
			background-position: center;
  			background-repeat: no-repeat;
		}
		
		.stripNavR {
			background: url("../pics/arrow_right.gif");
			background-position: center;
  			background-repeat: no-repeat;
		}
		.stripNavR:hover {
			background: url("../pics/arrow_right-over.gif");
			background-position: center;
  			background-repeat: no-repeat;
		}
