/*
Originele kleur in RGB waarden:
Geel: 228 - 204 - 0
Blauw: 15 - 53 - 140
Lichtgrijze navibalk: 182 - 184 - 187
Donkergrijze vlak: 85 - 84 - 89
Achtergrond site: 56 - 49 - 49

lichtgroen/geel bovenbalk: #E1D700; -> E4CC00;
blauw logo: #2F4595; -> 0F358C
lichtgeel: #FEFEFE; 
grijs tussenbalk: #C1C1C1; -> B6B8BB
grijs onderbalk: #636363; -> 555459
grijs achtergrond: #473F3F; -> 383131

schermafmeting: 1024 x 768
ontwerp van Johan: 843 x 597
lettertype ontwerp is : verdana (normal en bold)

ORIGINEEL:
site-afmeting: 844 x 598
	over horizontaal: 180 (2 x 90)
	over verticaal: 170 (2 x 85) -> boven 60
header: 843 x 107 -> site: 844 x 108 -> 114 (anders plaatje te klein)
maincontent: 843 x 344 -> site: 844 x 346 -> hoogte 355
menubalk: 843 x 19 -> 844 x 20
footer: 843 x 127 -> 844 x 126
tuinen voor het goede leven: 410 x 85

FULL SCREEN (114 %):
site-afmeting: 962 x 682
	over horizontaal: 62 (2 x 31)
	over verticaal: 62 (2 x 31)
header + overlap: 962 x 122
overlap: 22 px
logo is 62 x 109, 40 px van de rechterkant af -> 860
maincontent: 962 x 440
menubalk: 962 x 23
footer: 962 x 100
tuinen voor het goede leven: 962 x 97



*/
body {
	background: #383131;
	color: #383131;
	margin: 0;
	padding: 0;
	border: 0;
	text-align: left;
	font-family: verdana, arial bold, sans-serif;
	padding-bottom: 20px;
	}
	
html, body, #nav ul { 
    width: 100%;
    margin: 0;
    padding: 0;
	}

img	{
	border: 0;
	}
	
/*  header - topimage */
#header {
    position: absolute;
	/*top: 41px;*/
	top:0px; 
	left:31px; 
    height: 112px;
	width:962px;
	background: #E4CC00;
	color: #0F358C;
	letter-spacing: 3;
  	font-size: 18px;
	border: 0;
	margin: 0;
	padding: 0;
}
	
#header img.tekst	{
	position: absolute;
	top:10px;
	left:0px;
	margin: 0;
	padding: 0;
	border: 0;
}

#header img.logo	{
	position: absolute;
	top:4px;
	left:870px;
	margin: 0;
	padding: 0;
	border: 0;
}

#header a, a:link, a:visited,a:hover, a:active {
	font-weight : normal; 
	text-decoration : none;
	color: #0F358C;
	background: none; 
}

#overlap {
    position: absolute;
	top:100px;
	left:0px;
    height: 22px;
	width:962px;
	background: #B6B8BB;
	color: #B6B8BB;
	border: 0;
	margin: 0;
	padding: 0;
}

/*  wrapper */
#wrapper	{
    background: #FEFEFE;
	color: #555459;
	/*margin: 122px 31px;*/
	margin: 81px 31px;
	padding: 0px;
	width: 962px;
}

/*  pagebody */
#pagebody	{
	padding: 0;
	margin-top: 0px;
	border: 0;
	text-align: left;
	color: #383131;
	background: none;
	clear: both;
}

/* maincontent */
#maincontent	{
	/*float: left; */
	margin: 0;
	padding: 0;
	width: 962px; /* box model hack */	
	height:400px;
	/* hieronder alleen gebruiken, als je mogelijkheid van scrollbalk wilt geven */
	/*max-height:390px;
	overflow: auto; */
	}

#maincontent ol, #maincontent ul	{
	margin: .5em 0;
	padding-left: 10px;
	margin-left: 10px;
	display: block;
	}
	
#maincontent li	{
	line-height: 1.4;
	margin-bottom: 0px;
	padding-left: 5px;
	margin-left: 5px;
	list-style: disc url(/i/listblack.gif);
	vertical-align: middle;
	}
	
#maincontent ul ul li {
	margin-top: 10px;
	list-style: disc url(/i/innerlistblack.gif) inside;
	vertical-align: top;
	}

#maincontent ul.inlinelist	{
	padding: 0;
	margin: 0;
	}

#maincontent .inlinelist li	{
	display: inline;
	padding: 0 5px 0 0;
	margin: 0;
	border: 0;
	}

/* tekst-vlakken */
#tekstonder	{
	position:absolute;
    background: #FEFEFE;
	left: 31px;
	/*top: 163px;*/
	top: 122px;
	width: 345px;
	height: 161px;
	z-index: 20;
	}
#tekstonderontwerp	{
	position:absolute;
    background: #FEFEFE;
	left: 31px;
	/*top: 163px;*/
	top: 122px;
	width: 349px;
	height: 161px;
	z-index: 20;
	}
#tekstondercolumn	{
	position:absolute;
    background: #FEFEFE;
	left: 376px;
	/*top: 163px;*/
	top: 122px;
	width: 249px;
	height: 386px;
	z-index: 20;
	}
#lijnontwerp {
	position:absolute;
    background: #555459;
	left: 379px;
	/*top: 163px;*/
	top: 122px;
	width: 2px;
	height: 163px;
	z-index: 35;
	}
#tekst	{
	position:absolute;
    background: #FEFEFE;
	left: 67px;
	/*top: 163px;*/
	top: 122px;
	width: 280px;
	height: 159px;
	z-index: 30;
	}
#teksttuinmeesters	{
	position:absolute;
    background: #FEFEFE;
	left: 55px;
	/*top: 163px;*/
	top: 122px;
	width: 280px;
	height: 300px;
	z-index: 30;
	}
#tekstcolumn	{
	position:absolute;
    background: #FEFEFE;
	left: 407px;
	/*top: 163px;*/
	top: 122px;
	width: 280px;
	height: 350px;
	z-index: 30;
	}

#terug	{
	position:absolute;
    background: #FEFEFE;
	left: 135px;
	/*top: 302px;*/
	top: 261px;
	width: 170px;
	height: 15px;
	z-index: 31;
	}

/* foto-vlakken */
#gallery	{
	position:absolute;
	left: 31px;
	/*top: 163px;*/
	top: 122px;
	width: 962px;
	height: 388px;
	padding: 0;
	z-index: 10;
	}
#gallerytuinen	{
	position:absolute;
	left: 29px;
	/*top: 161px;*/
	top: 120px;
	width: 962px;
	height: 390px;
	padding: 0;
	z-index: 10;
	}
#bijdrage_detailonder	{
	position:absolute;
    background: #FEFEFE;
	left: 20px;
	top: 20px;
	width: 655px;
	height: 550px;
	z-index: 20;
	}
#bijdrage_detail {
	position:absolute;
    background: #FEFEFE;
	left: 30px;
	top: 30px;
	width: 635px;
	height: 530px;
	line-height: 2
	/* hieronder alleen gebruiken, als je mogelijkheid van scrollbalk wilt geven */
	max-height: 530px;
	overflow: auto;
	z-index: 30;
	}
	
/* Marlon's uitklapmenu, hier geplaatst op de menubalk*/
#hoofdmenu {
	position:absolute;
	left: 65px;
	/*top: 554px;*/
	top: 513px;
	width: 962px;
	z-index: 100;
}
 
#hoofdmenu ul {
	padding: 0;
	margin: 0;
	list-style:none;
}
 
#hoofdmenu ul li ul {
	background:none url(../images/trans.gif) repeat-x;
}
 
#hoofdmenu li { /* all list items */
  float: left;
  position: relative;
  margin: 0;
  padding: 0;
  width: 102px;
  height:22px;
  background: #B6B8BB;
  color: #383131;
  font-size: 10px;

}
 
html>body #hoofdmenu li, html>body #hoofdmenu ul li ul li {
  	height:18px;
	width: 102px;
}
 
#hoofdmenu li a  {
  	display: block;
  	text-align:center;
  	padding-top : 4px;
  	margin-right : 0px;
	width: 102px;
  	height:22px;
	font-weight: bold;
    font-size: 10px;
  	color: #383131;
  	background: #B6B8BB;
  	text-decoration: none;
}

#hoofdmenu #nav1 li#leeg {
	width: 100px;
}

html>body #hoofdmenu ul li ul a  {
	letter-spacing:0;
  	width: 102px;
	height:18px;
}
 
#hoofdmenu ul li ul a {
  	background:#B6B8BB;
  	color: #FFFFFF;
  	width: 102px;
  	height:22px;
  	font-weight : bold;
  	padding-top : 2px;
  	/*border-bottom: 1px solid #FFF ; */
}

body#home #hoofdmenu #nav1 li#een a, 
body#tuinmeesters #hoofdmenu #nav1 li#twee a, 
body#tuinen #hoofdmenu #nav1 li#drie a, 
body#ontwerp #hoofdmenu #nav1 li#vier a, 
body#aanleg #hoofdmenu #nav1 li#vijf a, 
body#onderhoud #hoofdmenu #nav1 li#zes a, 
body#nieuws #hoofdmenu #nav1 li#zeven a, 
body#contact #hoofdmenu #nav1 li#acht a 
{
	background: #B6B8BB;
	color: #555459;
}

body#home #hoofdmenu #nav1 li#een ul li a, 
body#tuinmeesters #hoofdmenu #nav1 li#twee ul li a, 
body#tuinen #hoofdmenu #nav1 li#drie ul li a, 
body#ontwerp #hoofdmenu #nav1 li#vier ul li a, 
body#aanleg #hoofdmenu #nav1 li#vijf ul li a, 
body#onderhoud #hoofdmenu #nav1 li#zes ul li a, 
body#nieuws #hoofdmenu #nav1 li#zeven ul li a, 
body#contact #hoofdmenu #nav1 li#acht ul li a 
{
	background:#555459;
	color:#FEFEFE;
}
 
/* dit zorgt ervoor dat de submenu's toch een hover hebben*/
body#home #hoofdmenu #nav1 li#een ul li a:hover, 
body#tuinmeesters #hoofdmenu #nav1 li#twee ul li a:hover, 
body#tuinen #hoofdmenu #nav1 li#drie ul li a:hover, 
body#ontwerp #hoofdmenu #nav1 li#vier ul li a:hover, 
body#aanleg #hoofdmenu #nav1 li#vijf ul li a:hover, 
body#onderhoud #hoofdmenu #nav1 li#zes ul li a:hover, 
body#nieuws #hoofdmenu #nav1 li#zeven ul li a:hover, 
body#contact #hoofdmenu #nav1 li#acht ul li a:hover 
{
	background: #555459;
	color: #FEFEFE;
}
 
/* dit zorgt ervoor dat de submenu's een statuskleur hebben*/
body#tuinmeesters #hoofdmenu #nav1 li#tweea a, 
body#tuinmeesters #hoofdmenu #nav1 li#tweeb a,
body#contact #hoofdmenu #nav1 li#achta a, 
body#contact #hoofdmenu #nav1 li#achtb a 
{
	background: #B6B8BB;
	color: #FEFEFE;
}
 
/* hoofdmenu's - algemeen */ 
#hoofdmenu a:hover, #hoofdmenu a:active, #hoofdmenu a.actief {
	background: #E4CC00;
	color: #555459;
 }
/* hoofdmenu's - leeg */
#hoofdmenu li#leeg a:hover, #hoofdmenu li#leeg a:active, #hoofdmenu li#leeg a.actief {
	background: #B6B8BB;
	color: #555459;
 }

/* hoofdmenu's - classes */
#hoofdmenu a.actief2 {
	background: #555459;
	color: #FEFEFE;
 }

/* submenu's */ 
#hoofdmenu ul li ul a:hover {
	background: #555459;
	color: #FEFEFE;
} 

 /* dit zorgt ervoor dat de boel uitklapt*/
li ul { /* second-level lists */
  display: none;
  left: 0;
}
 

li>ul { /* to override top and left in browsers other than IE, which will position to the top right of the containing li, rather than bottom left */
  top: auto;
  left: auto;
}
 
li:hover ul, li.over ul { /* lists nested under hovered list items */
  display: block;
}
/* einde uitklapmenu Marlon */

/* menubalk */
#menubalk {
    position: absolute;
	/*top:554px;*/
	top:513px;
	left:31px;
    height: 22px;
	width:962px;
	background: #B6B8BB;
	color: #383131;
	border: 0;
	margin: 0;
	padding: 0;
	z-index: 90;
}

/* footer */
#footer {
	border: 0;
	color: #FEFEFE;
	background: #555459;
	height:100px;
	padding: 5px 7px 7px 10px;
	text-align: left;
	clear: both;
}
#footerbekroond {
	border: 0;
	color: #FEFEFE;
	background: #0F358C;
	height:100px;
	padding: 0;
	text-align: left;
	clear: both;
}

#footer img.tuinen	{
	position: absolute;
	/*top:575px;*/
	top:534px;
	left:31px;
	margin: 0;
	padding: 0;
	border: 0;
	}
	
#footerbekroond img.tuinjaar	{
	position: absolute;
	/*top:585px;*/
	top:544px;
	left:31px;
	margin: 0;
	padding: 0;
	border: 0;
	}

#footer p	{
	margin: 10px 0;
	padding: 0;
	}

#footer ul	{
	margin: 10px 0 0 0;
	padding: 0;
	}
	
#footer li	{
	display: inline;
	margin: 0;
	padding: 0 15px 0 0;
	text-align: left;
	border: 0;
	}

/* submenu in maincontent */
#submenutuinmeesters {
	position:absolute;
	left: 65px;
	/*top: 142px;*/
	top: 101px;
	height: 30px;
	z-index: 120;
}
#submenutuinen {
	position:absolute;
	left: 65px;
	/*top: 142px;*/
	top: 101px;
	height: 30px;
	z-index: 120;
}

#submenucontact {
	position:absolute;
	left: 65px;
	/*top: 142px;*/
	top: 101px;
	height: 30px;
	z-index: 120;
}

#submenunieuws {
	position:absolute;
	left: 65px;
	/*top: 142px;*/
	top: 101px;
	height: 30px;
	z-index: 120;
}

table.submenu {
	background: #B6B8BB;
	font-size: 10px;
	color: #555459;
	font-weight: bold;
	text-align: center; 
}

a.submenu, a.submenu:link,
a.submenu:visited,a.submenu:hover, a.submenu:active {
	color: #555459;
	font-weight: bold;
	text-decoration: none;
}

a.submenuactief, a.submenuactief:link, a.submenuactief:hover,
a.submenuactief:visited, a.submenuactief:active {
	color: #000000;
	font-weight: bold;
	text-decoration: none;
}
/* einde submenu */
	

code, pre	{
	font-weight: normal;
	background: inherit;
	color: #333;
	}

/*  Typography */
h1, h2, h3, h4, h5	{
	font-weight: normal;
	margin-top: 25px;
	margin-bottom: 2px;
	letter-spacing: 1px;
	}
	
#pagebody h1	{
    margin-top: 0;
    font-size: medium;      
    voice-family: "\"}\"";   
    voice-family: inherit;   
    font-size:  large;       
    }

#pagebody h2	{
    margin-top: 15px; 
    font-size: medium;     
    }

p {
	/*line-height: 90%;*/
	margin-top: 0;
	margin-bottom: 1em;
	}
	
#pagebody, #pagebody div, #pagebody p, #pagebody th, #pagebody li,
#pagebody dd, #pagebody dt    {
    font-size: 10px;   
    }

html>#pagebody, html>#pagebody div, html>#pagebody p, html>#pagebody th, 
html>#pagebody td, html>#pagebody li, html>#pagebody dd, html>#pagebody dt    {
    font-size:  small;
    }

#pagebody p.fineprint	{
	font-size: 10px;
	}

#pagebody .trans		{
	margin: 25px 0;
	padding-top: 0;
	}
	
#pagebody .trans dt  {
	font-weight: normal;
	font-style: italic;
	margin-bottom: 5px;
	padding-bottom: 0;
	font-size:  medium;      
	}

html>#pagebody .trans dt  {
	font-size: large;
	} 

#maincontent dl	{
	line-height: 1.4em;
	margin-top: 0;
	padding-top: 0;
	}

#maincontent dd	{
	margin-bottom: 5px;
	padding-left: 0;
	margin-left: 5px;
	}

.trans	{
	margin-top: 75px;
	padding-top: 0;
	}
	
.trans dt  {
	font-weight: normal;
	font-style: italic;
	font-size:  large;      
	}
	
html>.trans dt  {
	font-size:  x-large;  
	} 

/* General linkology */
	
a:link, a:visited {
	font-weight: bold; 
	text-decoration: none;
	color: #0F358C;
	background: none; 
	}

a:hover {
	font-weight : bold; 
	text-decoration : underline;
	color: #0F358C;
	background: none; 
	}

a:active {
	font-weight: bold; 
	text-decoration: none;
	color: #0F358C;
	background: none;  
}
	
A:active.streep,a:link.streep,a:visited.streep,a:hover.streep,a.streep {
	text-decoration: underline;
}
.hide {
	height: 0;
	width: 0;
	overflow: hidden;
	}

.linewrap {
	font-weight: bold; 
	color: #c60; 
	font-size: 13px;
	}
	
.floatleft	{
	float: left;
	padding: 0;
	margin: 0 15px 0 0;
	}

.form {
	color: #000;
	border: 1px solid #666;
	padding: 1px;
	margin: 0;
	font-size: xx-small;
	}

.form-button {
	color: #000;
	background-color: #fff;
	border: 1px solid #666;
	font-weight: bold;
	padding-left: 1px;
	padding-right: 1px;
	margin: 0;
	font-size: xx-small;
	}

INPUT {
	color: #000;
	background-color: #fff;
	border: 1px solid #666;
	font-weight: bold;
	padding-left: 1px;
	padding-right: 1px;
	margin: 0;
	font-size: xx-small;
	}

/* algemene extra's */
table {
	padding: 0;
	border: 0;
}

table td {
	text-align: left;
	font-family: verdana, arial bold, sans-serif;
	font-size: 10px;
	letter-spacing: 0.8;
	color: #000000;
	text-align:justify;
	padding: 0;
	border: 0;
}

th	{
	font-weight: bold;
}

td.titel {
	font-weight: bold;
	font-size: 11px;
	color: #0F358C;
}	
td.uitnodiging {
	font-weight: bold;
	font-size: 12px;
	letter-spacing: 0.8;
	line-height: 30px;
	color: #0F358C;
}	
td.subtitel {
	font-weight: bold;
	font-size: 10px;
}	
td.body {
	font-weight: normal;
	font-size: 10px;
}	
td.gallery {
	border: 0;
}
	
table.galleryontwerp {
	background: #555459;
}

td.titelcolumn {
	text-align:center;
	font-weight: bold;
	font-size: 14px;
	color: #0F358C;
}
td.bodycolumn {
}


