/* LAYOUT-GRID TUINSTIJL */

/* ALGEMEEN */
html {height: 100%;}
body {height: 100%; background: url(../images/bg.gif) repeat-x top left; margin: 0; padding: 0; border: 0; font-family: "Trebuchet MS", Arial, Helvetica; font-size: 10pt; color: #205F84;}

#page {border: 1px none #F00; width: 937px;}
#header {position: relative; height: 156px; background: url(../images/bg_header.gif) no-repeat top left;}
#content {position: relative; background: url(../images/bg_content.gif) no-repeat top left; padding-left: 232px;}
#closepage {clear: both; line-height: 1px; font-size: 1px; display: block;}
#footer {position: relative; display: block; height: 26px; background: transparent url(../images/bg_footer.gif) repeat-x 0px 0px; margin-left: 232px; overflow: hidden; z-index: 2;}
#footer2	{position: absolute; width:100%; display: block; height: 26px; background: transparent url(../images/bg_footer.gif) repeat-x 0px 0px; margin-left: 0px; overflow: hidden; z-index: 2;}

#groenkeur {position: absolute; top: 404px; left: 26px; z-index: 2;}
#mask {position: absolute; top: 156px; left: 0; z-index: 1; width: 355px; height: 237px;}
html>body #mask {background: url(../images/photo_mask.png) no-repeat left top;}
* html #mask {filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/photo_mask.png');}

a {color:#205F84;}
a:hover {color:#75B63F; text-decoration:none;}
h1 {font-size: 16pt; margin-bottom:0px;}
h1#kop {height: 22px;}
h2 {font-size: 10pt; margin: 0; padding: 0 0 0 2px;}
h3 { margin:0px 0px 20px 2px; padding:0px; color:#74B53E; font-size:13px;  }
h4 { margin:0px;padding:0px;font-size:13px;  }
h5 {font-weight: bold; margin: 15px 0 0 0;}
p {padding: 0; margin: 0 0 15px 0; }
hr {color: #daebd1; background-color: #FFF; line-height: 1px; height: 1px; }
td {vertical-align:top;}
ul {margin: 0px; padding: 0px 18px;}
img {border:0;}
form {width: 480px; margin: 0;}

.hide {display:none;}
.show {display:block;}
.alt {display:none;}
.vet {font-weight:bold;}
.right {float:right;}
.tright {text-align: right;}
.logo {margin: 10px 0 0 320px;}
.panorama {position: relative; left: -20px; }
.placeholder {width: 240px; height: 160px;}

a.more {background: url(../images/icon_more.gif) no-repeat 0px 6px; padding: 0 10px; clear: left; font-weight: bold; color: #75b63f;}
a.back {background: url(../images/icon_back.gif) no-repeat 0px 6px; padding: 0 10px; font-weight: bold; color: #75b63f;}

/* NAVIGATIE */
/*
div#globalnav	{height: 25px; width: 521px; margin: 60px 0 0 12px; padding: 0; border: 0;	background: #eed;}
*/
div#globalnav ul#menu {position: absolute; top: 130px; left: 12px; height: 25px; width: 738px; background: transparent url(../images/menu.gif) top left no-repeat; margin: 0; padding: 0;}
div#globalnav ul#menu li {margin: 0; padding: 0; list-style: none; position: absolute; top: 0;}
ul#menu li, ul#menu a {height: 25px; display: block;}
div#globalnav ul#menu li a {text-indent: -9999px; text-decoration: none;}

div#subnav ul {height: 26px; width: 291px; background: transparent url(../images/submenu.gif) top left no-repeat; margin: 0; padding: 0; position: absolute; top: 155px; left: 89px; z-index: 2;}
div#subnav ul li {margin: 0; padding: 0; list-style: none; position: absolute; top: 0;}
div#subnav ul li a {text-indent: -9999px; text-decoration: none;}
div#subnav ul li, div#subnav ul a {height: 25px; display: block;}

div#pagetools {position: absolute; width:173px; right: 0; padding: 5px 10px 5px 0; z-index: 2; background-color: #FFF;}
div#pagetools a {font-size: 8pt; font-weight: bold; text-decoration: none; padding-left: 24px; display:inline-block; line-height: 22px;}
div#pagetools a#mail {background: transparent url(../images/icon_email.gif) 0 50% no-repeat;}
div#pagetools a#print {background: transparent url(../images/icon_print.gif) 0 50% no-repeat;}
div#pagetools a#voorwaarden {background: transparent url(../images/icon_pdf.gif)  no-repeat left top;}

/* Normal */
#home	{left: 0; width: 78px;}
#diensten	{left: 77px; width: 95px;}
#projecten	{left: 171px; width: 106px;}
#evenementen {left: 276px; width: 128px;}
#vestigingen {left: 403px; width: 118px;}
#vacatures {left: 520px; width: 101px;}
#nieuwsbrief {left: 621px; width: 117px;}

#dienst1	{left: 0; width: 139px;}
#dienst2	{left: 141px; width: 65px;}
#dienst3	{left: 206px; width: 84px;}

/* Mouse-over */
#home a:hover	{background: transparent url(../images/menu.gif) 0 -25px no-repeat;}
#diensten a:hover {background: transparent url(../images/menu.gif) -77px -25px no-repeat;}
#projecten a:hover {background: transparent url(../images/menu.gif) -171px -25px no-repeat;}
#evenementen a:hover {background: transparent url(../images/menu.gif) -276px -25px no-repeat;}
#vestigingen a:hover {background: transparent url(../images/menu.gif) -403px -25px no-repeat;}
#vacatures a:hover {background: transparent url(../images/menu.gif) -520px -25px no-repeat;}
#nieuwsbrief a:hover {background: transparent url(../images/menu.gif) -623px -25px no-repeat;}

#dienst1 a:hover {background: transparent url(../images/submenu.gif) 0px -26px no-repeat;}
#dienst2 a:hover {background: transparent url(../images/submenu.gif) -141px -26px no-repeat;}
#dienst3 a:hover {background: transparent url(../images/submenu.gif) -206px -26px no-repeat;}


/* Active */
#home a.active {background: transparent url(../images/menu.gif) 0 -25px no-repeat;}
#diensten a.active {background: transparent url(../images/menu.gif) -77px -25px no-repeat;}
#projecten a.active {background: transparent url(../images/menu.gif) -171px -25px no-repeat;}
#evenementen a.active {background: transparent url(../images/menu.gif) -276px -25px no-repeat;}
#vestigingen a.active {background: transparent url(../images/menu.gif) -403px -25px no-repeat;}
#vacatures a.active {background: transparent url(../images/menu.gif) -520px -25px no-repeat;}
#nieuwsbrief a.active {background: transparent url(../images/menu.gif) -623px -25px no-repeat;}


#dienst1 a.active {background: transparent url(../images/submenu.gif) 0px -26px no-repeat;}
#dienst2 a.active {background: transparent url(../images/submenu.gif) -141px -26px no-repeat;}
#dienst3 a.active {background: transparent url(../images/submenu.gif) -206px -26px no-repeat;}


/* Rechterkolom */
/* home */
#ontwerpdag {float:right; display: block; background-color: #75b63f; width: 172px; margin: 0 6px 0 10px;}
#ontwerpdag p {color: #FFF; font-size: 8pt; padding: 4px 12px; margin: 0 0 5px 0;}

/* diensten */
.zoom {float: right; position: relative; z-index: 1; margin-right: 10px;}
.zoom img.spyglass {position: absolute; top: 114px; left: 0; z-index: 2;}

/* projecten */
.gallery {float: right; width: 170px;}
.gallery img.foto {float: left; margin-bottom: 4px;}
.gallery img.ontwerp {float: right; border: none 1px #CECECE;}
.zoom_project {position: static; z-index: 1;}
.zoom_project img.spyglass {position:static; margin-left: -170px; z-index:2;}


/* project */
#projectlijst{float:right; width: 184px; background-color: #e7f7ef; margin-left: 10px;}
#projectlijst h5 {padding: 0 10px;}
#projectlijst ul, #index ul {margin: 0; padding: 0px 10px;}
#projectlijst li, #index li {list-style-type: none; line-height: normal;}

#projectlijst li a, #index li a {text-decoration: none; background: url(../images/icon_project.gif) no-repeat 0 8px; padding: 2px 0 2px 10px; display: block; height: auto !important;}
#projectlijst li a:hover, #index li a:hover {color: #73b542; background-image: url(../images/icon_vestover.gif)}
/*
#project {display: inline;}
*/

/* evenementen */
#events {}
.slideshow {float: right; width:240px; text-align: right; margin-right: 5px;}
.clear {font-size: 1px; line-height: 1px; background-color: #daebd1; clear:both; display: block;}

/* #events {display:block;float:left;}
.eventrepeater {display:block; border-bottom:1px solid #e7f7ef;}

.txt	{display:block;float:left; width:200px; }

.slidenav {margin-right: -1px; background-color: #deefd6;}
.slidenav img {vertical-align: bottom;}
.slidenav a {font-size: 8pt; margin-right:1px; padding: 1px 5px 3px 5px; text-decoration: none; background: #FFF;}
.slidenav a.active {color: #FFF; background: #205f84;}
*/
/*
#events {display:block;position:absolute; }
*/


.txt	{float:left;}
.slideshow {float:right; display:block; text-align: right; margin:5px 0px 0 0;}
.slidenav {margin-right: -1px; background-color: #deefd6;}
.slidenav img {vertical-align: bottom;}
.slidenav a {font-size: 8pt; margin-right:1px; padding: 1px 5px 3px 5px; text-decoration: none; background: #FFF;}
.slidenav a.active {color: #FFF; background: #205f84;}

.rule{ margin-top:5px;line-height:1px; width:100%; background: #daebd1;}


/* CONTACT */
input:focus, select:focus, textarea:focus {background-color:#DAEBD1; color:#000; border-style: inset;}
fieldset {width:506px; padding:4px 8px; border:1px solid #DAEBD1;}
legend {margin:2px; color:#75B63F;}
.formlabel {width:230px; height:24px;}
.formvraag {height:24px;}
input, select, textarea {font-family: Arial, Helvetica; font-size:8pt; color:#000; margin:0px 4px;}
input.btn {width:230px; height:24px; color:#fff; font-weight:bold; background-color:#75B63F; margin:10px 40px; border:2px outset #fff;}
optgroup {font-style: normal;	font-size:8pt;}
.veldbreed {width:230px;}
.verplicht {width:20px; font-family: Verdana, Arial, Helvetica; font-weight:bold; font-size:8pt; text-align:center;	color:#F00;	padding-top:4px;}
table.formulier {width:100%; border:1px none #000; margin:2px 8px;}


/* VESTIGINGEN */
#vestholder {float:right; background-color: #e7f7ef;position:relative;padding:0;margin:0;}
#vestholder ul {margin: 0;padding:10px;}
#vestholder li {list-style-type: none;}

#vestholder li a {text-decoration: none; background: url(../images/icon_project.gif) no-repeat 0 8px; padding: 0px 0px 0px 10px;}
#vestholder li a:hover {color: #73b542; background-image: url(../images/icon_vestover.gif)}


#map{background-image:url(../images/kaart.gif);background-repeat: no-repeat;height:200px;width:184px;padding:0;margin:0;}
#vestigingoverzicht {width: 500px;}
#vestigingoverzicht h5 {margin: 0;}
.vestigingfoto {float: right; margin-right: 10px;}
.vestover {color: #73b542; background-image: url(../images/icon_vestover.gif) !important;}
.groen {color:#75B63F;}
.dagen {width: 150px;}
.contactaanvraag a {float: right; background: url(../images/icon_vestover.gif) no-repeat 0 60%; color:#75B63F; font-weight:bold; text-decoration:none; padding:0 4px 0 10px; margin:0;}
.contactaanvraag a:hover {text-decoration:underline;}

/* vacatures */
#backVacatures { float:right; margin-top:-38px;}
#backVacatures a.back { text-decoration:none; }
#backVacatures a.back:hover { text-decoration:underline;}
#vacatureContainer { width: 500px;}
#vacatureLijst { list-style-type:none; list-style-position:outside;margin:0px;padding:0px; }
#vacatureLijst li { background: url(../images/icon_more.gif) no-repeat 0px 8px; padding: 2px 10px; clear: left; }
#vacatureLijst li a {font-weight: bold; color: #75b63f; text-decoration:none;  }
#vacatureLijst li a:hover { text-decoration:underline;  }

.vacaturecontent { margin:0 0 15px; padding:0px;}
.vacaturecontent p,
.vacaturecontent ul { margin:3px 0px 0px 0px;}