html { 
padding:0px;
margin:0px;
}

body {
font-size: 12px;
font-family: Arial, Tahoma, Verdana, SunSans-Regular, Sans-Serif; 
height: 100%;
padding:0px;
margin:0px;
color: #5A5A5A;

scrollbar-base-color:		#CCCCCC;
scrollbar-arrow-color:		#999999;
scrollbar-3dlight-color:	#EEEEEE;
scrollbar-darkshadow-color:	#CCCCCC;
scrollbar-face-color:		#EEEEEE;
scrollbar-highlight-color:	#EEEEEE;
scrollbar-shadow-color:		#999999;
scrollbar-track-color:		#FFFFFF
}

a { 
font-size: 12px;
color: #994300;
text-decoration: underline; 
}

a:hover{ 
font-size: 12px;
color: #000000;
text-decoration: underline; 
}

h1 {
height: 2em;
padding:5px 15px;
margin:0px
}

h2 {
padding: 0px 0px 20px 0px;
margin:0px;
font-size:15px;
font-weight: bold;
color: #7C471D;
}

h3 {
padding: 5px 12px 5px 0px;
margin:0px;
font-size:12px;
font-weight: bold;
color: #C85700;
}

h4 {
padding: 5px 12px 5px 0px;
margin:0px;
font-size:12px;
font-weight: bold;
text-decoration: underline;
color: #C85700;
}

h5 {
padding: 0px 0px 0px 0px;
margin: 0px;
* margin: 10px 0px 10px 0px;
font-size: 15px;
font-weight: bold;
color: #7C471D;
}

.banner {
left: 450px;
position: absolute;
top: 50px;
width:800px;
}
.banner IMG {
margin-right: 15px;
}

.clear{
clear:both;
font-size: 1px;
height: 0px;
overflow: hidden;
}

hr {
border-top:1px solid #C85700;
border-right: none;
border-bottom: none;
border-left: none;
height:1px;
*margin:5px 0px 5px 0px;
margin:15px 0px 15px 0px;
}

.opties td {
	padding: 10px 10px 10px 15px;
}

.opties P {
	font-weight: bold;
	margin: 8px 0px 0px 2px;
}

/* voorpagina classes */

.vp_photobar {
position: absolute;
background-image: url('../gfx/vpheader_bg.gif');
background-repeat: repeat-x;
top: 172px;
left: 0px;
height: 100px;
width: 100%;
margin: 0px; 
padding: 0px;
z-index: 4;
}

.english {
position: absolute;
margin: 115px 0px 0px 373px;
width: 72px;
height: 12px;
}
.english:hover {
background-image: url('../gfx/vp_welcome_hover.gif');
} 

.vp_content {
position: absolute;
top: 273px;
left: 364px;
}

.vp_content p, .vp_content form {
padding: 1.1em 3.5em 0em 1.5em;
text-align: justify;
}

#vp_tablist{
position: absolute;
font-family: Tahoma, Verdana, Arial, SunSans-Regular, Sans-Serif; 
top: 282px;
left: 235px;
padding: 1px 0;
margin-left: 0px;
height: 12px;
margin-bottom: 0.4em;
margin-top: 0em;
z-index: 7;
}

#vp_tablistenglish {
font-family:Tahoma,Verdana,Arial,SunSans-Regular,Sans-Serif;
height:12px;
left:320px;
margin-bottom:0.4em;
margin-left:0;
margin-top:0;
padding:1px 0;
position:absolute;
top:295px;
z-index:7;
}

#vp_tablist li, #vp_tablistenglish li{
list-style: none;
text-align: right;
line-height: 12pt;
margin: 0;
}

#vp_tablist li a:link, #vp_tablist li a:visited, #vp_tablistenglish li a:link, #vp_tablistenglish li a:visited{
font-size: 10px;
font-weight: bold;
text-decoration: none;
color: #994300;
}

#vp_tablist li a:hover, #vp_tablist li a:active, #vp_tablistenglish li a:hover, #vp_tablistenglish li a:active{
font-size: 10px;
font-weight: bold;
text-decoration: underline;
color: #994300;
}

/* begin header, logo en sfeervisual */

.header {
position: absolute;
top: 62px;
left: 0px;
width: 100%;
margin: 0px; 
padding: 0px;
}

.photolarge {
position: absolute;
width: 100%;
height: 127px;
margin-top: 27px;
background-image: url('../gfx/photo_header_01.jpg');
background-repeat: no-repeat;
background-position: top right;
z-index: 1;
}

.headernav {
position: absolute;
top: 20px;
left: 250px;
height: 70px;
margin: 0px; 
padding: 0px;
border-left: 1px solid #55678C;
z-index: 6;
}

.headernav a {
font-weight: bold;
color: #C45510;
font-size: 11px;
padding-left: 10px;
text-decoration: none;
}
.headernav a:hover {
font-weight: bold;
color: #C45510;
font-size: 11px;
padding-left: 10px;
text-decoration: underline;
}

.photobar {
position: absolute;
background-image: url('../gfx/header_bg.gif');
background-repeat: repeat-x;
top: 127px;
left: 0px;
height: 60px;
width: 100%;
margin: 0px; 
padding: 0px;
z-index: 4;
}

.slogan {
position: absolute; 
right: 0em;
z-index: 5;
}

/* content */

.contentframe {
height: 50%;
position: relative;
margin-right: 2em;
padding: 20em 0em 1.5em 4.5em;
}

.photocolumn {
padding: 40px 0px 0px 30px;
}

.photonavcolumn {
width: 350px;
padding: 0px 0px 0px 30px;
}
.photonavcolumn IMG {
border: 1px solid #eb6900;
}

.photogallery {
width: 350px;
padding: 0px 0px 10px 0px;
}
.photogallery IMG {
border: 1px solid #eb6900;
}

.inclphoto IMG {
border: 1px solid #eb6900;
}

.photonavcolumn .border{
border: 1px solid #000;
}

.greybackground {
background-color: #f6f6f6;
}

.tablecolumnleft {
padding: 6px 15px 6px 6px;
}
.tablecolumnright {
padding: 6px 15px 6px 6px;
width: 550px;
}

.quoteOUD {
font-size: 10px;
color: #6b6b6b;
margin-right: 2em;
padding: 0em 0em 1.5em 5.5em;
}

.quote {
font-size: 11px;
color: #434343;
font-weight: bold;
margin-top: 10px;
padding: 1em 3em 1em 5em;
background-color: #d9e2b3;
}

.terrasboxkader {
color: #994300;
border: 1px solid #994300;
padding: 15px 15px 0px 15px;
}

/* tabs */

#tablist{
position: absolute;
font-family: Tahoma, Verdana, Arial, SunSans-Regular, Sans-Serif; 
top: 192px;
left: 54px;
padding: 1px 0;
margin-left: 0px;
height: 12px;
margin-bottom: 0.4em;
margin-top: 0em;
z-index: 7;
}

#tablist li{
list-style: none;
display: inline;
margin: 0;
}

#tablist li a {
font-size: 10px;
text-decoration: none;
padding: 1px 0.2em 1px 0.6em;
margin-left: 0px;
border-bottom: none;
background: white;
}

#tablist li a.current {
text-decoration: underline;
}

#tabcontentcontainer {
position: absolute;
font-family: Tahoma, Verdana, Arial, SunSans-Regular, Sans-Serif; 
left: 54px;
top: 210px;
border-top: 1px solid #313131;
background-color: #FFF;
height:17px;
padding: 3px 0px 0px 0px;
z-index: 8;
}

.tabcontent {
display:none;
}

.dakterrasbouwers {
padding-left: 5px
}
.navdaktoegang {
padding-left: 199px
}
.navtrap {
padding-left: 273px
}
.navvloer {
padding-left: 309px
}
.navhek {
padding-left: 350px
}
.navafwerking {
padding-left: 459px
}
.navinrichting {
padding-left: 460px
}
.navaanbiedingen {
padding-left: 463px
}

#tablist li a:link, #tablist li a:visited {
font-size: 10px;
font-weight: bold;
color: #C45510;
border-left: 1px dotted #313131;
}

#tablist li a:hover, #tablist li a:active {
font-size: 10px;
font-weight: bold;
color: #7C471D;
border-left: 1px dotted #313131;
}

.tabseperate:link { font-size: 10px; text-decoration: none; font-weight: bold; color: #C45510; padding: 1px 0.6em 1px 0.4em; border-right: 1px dotted #313131; }
.tabseperate:visited { font-size: 10px; text-decoration: none; font-weight: bold; color: #7C471D; padding: 1px 0.6em 1px 0.4em; border-right: 1px dotted #313131; }
.tabseperate:hover { font-size: 10px; text-decoration: underline; font-weight: bold; color: #7C471D; padding: 1px 0.6em 1px 0.4em; border-right: 1px dotted #313131; }
.tabseperate:active { font-size: 10px; text-decoration: none; font-weight: bold; color: #7C471D; padding: 1px 0.6em 1px 0.4em; border-right: 1px dotted #313131; }

.link:link { font-size: 10px; text-decoration: none; font-weight: bold; color: #C45510; padding: 1px 0.6em 1px 0.4em;}
.link:visited { font-size: 10px; text-decoration: none; font-weight: bold; color: #7C471D; padding: 1px 0.6em 1px 0.4em;}
.link:hover { font-size: 10px; text-decoration: underline; font-weight: bold; color: #7C471D; padding: 1px 0.6em 1px 0.4em;}
.link:active { font-size: 10px; text-decoration: none; font-weight: bold; color: #7C471D; padding: 1px 0.6em 1px 0.4em;}

#vacature {
margin: 0;
padding-left: 0;
list-style: none;
}

#vacature li {
padding-left: 10px;
background-image: url(../gfx/arrow.gif);
background-repeat: no-repeat;
background-position: 0 .5em;
}

/* ###### forms layout ###### */

.inputField {
	height:14px;
	width:170pt;
	margin-bottom: 0.2em;
	padding-top: 1px;
	font-size: 1em;
	font-family: Arial, Tahoma, Helvetica, SunSans-Regular, sans-serif;
	border: 1px solid;
	border-color: #666 #ccc #ccc #666; 
}

.inputFieldsmall {
	height:14px;
	width:50pt;
	margin-bottom: 0.2em;
	padding-top: 1px;
	font-size: 1em;
	font-family: Arial, Tahoma, Helvetica, SunSans-Regular, sans-serif;
	border: 1px solid;
	border-color: #666 #ccc #ccc #666; 
}

.textArea {
	height:7.5em;
	width:170pt;
	margin-bottom: 0em;
	padding: 1px;
	font-size: 1em;
	font-family: Arial, Tahoma, Helvetica, SunSans-Regular, sans-serif;
	border: 1px solid;
	border-color: #666 #ccc #ccc #666; 
}

textArea:focus, input:focus {
	background-color: #EAEBEE; 
}
	
input.button {
	width: 100px;
	height: 22px;
	padding-bottom: 4px;
	margin: 0.5em 0em 1.5em 0em;
	font-size: 1em;
	font-weight: bold;
	color: #FFF;
	background-color: #C95700;
	border: 1px solid;
	border-color: #ccc #666 #666 #ccc;
	cursor: pointer; 
}

/* foto pagina rijen en kaders */
	
#row {
	height: 100px;
	width: 850px;
	}
	
.galleryimage {
	float:left;
	}
	
.galleryimage img {
	width: 80px;
	height: 80px;
	padding:2px;
	margin-top: 0px;
	margin-right: 15px;
	border: 1px solid #eb6900;
	display:block;
	text-align:center;
	}

.galleryimage span {
	padding:0px 5px 5px 5px;
	text-align:left;
	display:block;
	width: 80px;
	font-size:80%;
	}
	
/* rotator in-page placement */ 
div#rotator1, div#rotator2, div#rotator3, div#rotator4 { 
	float:left;
	width:175px;
} 
div#rotator1 ul li, div#rotator2 ul li, div#rotator3 ul li, div#rotator4 ul li { 
	float:left; 
	position:absolute; 
	list-style:none; 
} 
div#rotator1 ul li.show, div#rotator2 ul li.show, div#rotator3 ul li.show, div#rotator4 ul li.show { 
	z-index:500 
} 
	
/* Popup lightbox */

#lightbox{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: auto;
	}

#imageContainer{
	padding: 10px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(../gfx/lightbox/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../gfx/lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../gfx/lightbox/nextlabel.gif) right 15% no-repeat; }


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%	
	}

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	}