#containertop {
	height: 110px;
	background-color: #272727;
}
#divtop {
	height: 110px;
	width: 860px;
	margin-right: auto;
	margin-left: auto;
}
#divtoplogo {
	height: 110px;
	width: 350px;
	float: left;
}
#divtopmain {
	float: left;
	height: 110px;
	width: 425px;
}


#divtopfiller {
	float: left;
	height: 70px;
	width: 425px;
}
#divtopmenu {
	float: left;
	height: 40px;
	width: 425px;
}
#divtopkeurmerk {
	float: right;
	height: 110px;
	width: 85px;
	text-align: center;
	vertical-align: middle;
	clear: none;
}
#containerbanner {
	height: 110px;
	clear: both;
	background-image: url(../afbeeldingen/algemeen/banner-kleurschakering-lang.png);
	background-repeat: no-repeat;
	background-position: center;
	padding-top: 10px;
	padding-bottom: 10px;
}
#divbanner {
	background-repeat: no-repeat;
	height: 110px;
	width: 860px;
	margin-right: auto;
	margin-left: auto;
}
#divbannertekst {
	background-color: #272727;
	float: left;
	height: 102px;
	width: 220px;
	text-align: center;
	padding-top: 8px;
}
#divbannerbutton {
	background-color: #F7AF1B;
	height: 23px;
	width: 80px;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	vertical-align: middle;
	padding-top: 4px;
	font-size: 15px;
	margin-top: 10px;
	margin-bottom: 10px;
}
#divbannerfoto {
	background-color: #272727;
	height: 110px;
	width: 640px;
	float: left;
}
#containermain {
	height: 500px;
}
#divmain {
	height: 500px;
	width: 860px;
	margin-right: auto;
	margin-left: auto;
}
#divmainlinks {
	float: left;
	height: 485px;
	width: 180px;
	background-image: url(../afbeeldingen/algemeen/background-categorieen.png);
	background-repeat: no-repeat;
	text-align: center;
	padding-top: 15px;
	background-position: 0px 4px;
}
#divmaincontent {
	float: left;
	height: 485px;
	width: 496px;
	text-align: center;
	padding-top: 15px;
	padding-right: 2px;
	padding-left: 2px;
}
.accent-geel {
	color: #F7AF1B;
}

#divmainrechts {
	height: 485px;
	width: 180px;
	clear: right;
	float: left;
	background-image: url(../afbeeldingen/algemeen/background-categorieen.png);
	background-repeat: no-repeat;
	background-position: 0px 4px;
	text-align: center;
	padding-top: 15px;
}





/*****************************************************************************************************************************************************/
/* Hieronder staan de css stijlen voor het menu, eigenlijk de beginselen van een dropdown menu maar dat is nu nog niet nodig en dan moet je wat scripting voor de nested unordered list toevoegen */


/* Hieronder definieer je wat basic settings van de div navMenu */
/* Margin: Dit doe je om al de default margins weg te halen in het hele menu, vanuit andere stylesheets */
/* Padding: Dit doe je om al de default paddings weg te halen in het hele menu, vanuit andere stylesheets */
#navMenu {
	padding:0;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
	float: none;
	border-right: 0px ;
}

/* Hieronder definieer je wat basic settings van de unordered list */
/* Margin: Dit doe je om al de default margins van de unordered list weg te halen */
/* Padding: Dit doe je om al de default paddings van de unordered list weg te halen */
/* Line height: hier zet je dus eigenlijk de regelhoogte van alles wat in de unordered list staat. In dit voorbeeld op 30px omdat het blok bij #navMenu ul li a ook op 30px hoogte is gezet. */
#navMenu ul {
	margin:0; 
	padding:0; 
	line-height:40px;
	
}


/* Hieronder definieer je wat basic settings van de listitems */
/* Margin: Dit doe je om al de default margins van de listitems weg te halen */
/* Paddding: Dit doe je om al de default paddings van de listitems weg te halen */
/* List-style: Dit doe je om eventuele bullets van de listitems weg te halen */
/* Float: Dit om het listitems links te laten zweven zoals een div */
/* Position: Dit geeft een relatieve positie aan t.o.v. de div waar ie in geplaatst is */
/* Background: Hiermee stel je de background van de listitems in, binnen het block */
#navMenu li {
	margin:0;
	padding:0;
	list-style:none;
	float:left;
	position:relative;
	background:none;
}

/* Hierin zet je styling van de links van de listitems (dus niet het hover-effect maar we hebben van de listitems middels href al links gemaakt en die styl je dus)in de bovenste unordered list. Als je verder niets aanpast geldt dit ook voor de listitems in de nested unordered list */
/* Text-align: centreren van de tekst  van de listitems */
/* Font-family: font van de listitems */
/* text-decoration: weghalen van de underline van links want het zijn intussen wel allemaal links geworden. */
/* height / width: afmeting van de link */
/* display : hoe moet het gezien worden. Als je dus de links als een omkadert blokje wilt zien zoals in een dropdownmenu dan moet je dit als block zetten, anders blijft ie dit zien als een tekst. Op deze manier hoef je dus ook met je pijltje niet over de tekst te gaan maar kun je gewoon in de box klikken. */
/* color: hiermee bepaal je de kleur van de teksten, zonder hover */
/* border: hier stel je de border in qua vorm, kleur en dikte. Let op dat je door de 1px een probleempje hebt met het dropdown menu. Je moet dat dan ook 2px groter maken bij #navMenu ul ul hieronder. Als je #fff wit instelt dan lijkt het alsof je afstand creeert tussen de blocks. */
/* text-shadow: een schaduw toekennen aan alle teksten in de list-items. Zonder verdere detaillering zal dit dus zowel in de top als dropdown als zonder en met hover toegepast worden */
#navMenu ul li a {
	text-align:center;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	height:40px;
	width:85px;
	margin:0;
	
	display: block;
	color:#fff;
	border-left: ;
	border-top: ;
	border-bottom: ;
	font-size:16px;
}

/* Hieronder stel je de hover effecten in ***************************************************************************************/


/* Hieronder stel je de hover-effecten in van de listitems. Zonder verdere detaillering geldt dit voor alle listitems, dus ook die in de nested unordered list */ 
#navMenu li:hover {
	background:#F7AF1B;
}

/* Hieronder stel je het hover-effect als je over de link gaat van het 1e level */
/* color: kleur van de tekst bij hover */
#navMenu a:hover {
	color:#fff;
}

/* Hiermee zorg je ervoor dat het hele menu echt in de div wrapper zit. Anders zit ie er net onder om je eerder de float op left hebt gezet. Tevens margin en padding van de wrapper op 0 gezet. */
.clearFloat {
	clear:both;
	margin:0;
	padding:0;
}

/* HIeronder vindt je verdere classes */

body {
	margin: 0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	background-image: none;
	background-repeat: repeat;
	background-color: #272727;
	color: #FFF;
}

p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
}
h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 30px;
	font-weight: bold;
	color: #FFFFFF;
	text-align: center;
	text-decoration: blink;
	font-variant: normal;
}

h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 24px;
	font-weight: bold;
	color: #002e7e;
}

a:link {
	color: #F7AF1B;
}
a:visited {
	color: #F7AF1B;
}
a:hover {
	color: #F7AF1B;
}

td {
	margin: 0px;
	height: auto;
}
table {
	margin: 0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
}