/* CSS_MAIN.CFM +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+- */
/* Primaire elementen */
	
	@media print 
	{
	   body {font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;}
	}
	
	body	{margin: 10px 0px;
			
				background:  url(backgr.jpg) top left scroll repeat;
				;} 
	form	{display: inline; margin: 0; padding: 0;}
	
	body, table, p, ol, ul, input
			{font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;}
	body
			{font-size: 80%;}
	table, p, ol, ul, div
			{font-size: 100%;}
	
	body, html	{height: 100%}	
	.maintable	{height: 100%; width: 80%; border: 1px solid black;}
	
/* Header */

	.header, .headerfill
		{background-color: #7d2bbb;}
	td.header
		{color: #000000; vertical-align: middle;
		/* padding-left: 20px; */}
	.header .titel
		{font-size: 200%; font-weight: bold; margin-bottom: 2px;}
	.header .ondertitel
		{font-size: 100%; margin-top: 2px;}
	.header img
		{padding: 0; margin: 0; border: none;}
		
/* Menu onder de header */
		
	.menutop, .menutopfill
		{background-color: #000000;}
	.menutop
		{font-size: 90%; padding: 4px 0px 0px 0px;
		color: #FFFFFF;}
	.menutop ul				{margin: 0; padding: 0}
	.menutop ul li			{list-style-type: none; display: inline; margin-right: 4px;}
	.menutop ul li.contact	{margin-right: 14px;}
	.menutop a	{color: #FFFFFF; font-weight: bold;}
	
	
	.menutop li.home a	{background: url(../../../img/home.gif) no-repeat 2px; padding-left: 20px;}
	.menutop li.wagen a	{background: url(../../../img/bestellen2.gif) no-repeat 2px; padding-left: 23px;}
	.menutop li.zoek a	{background: url(../../../img/zoeken.gif) no-repeat 2px; padding-left: 20px;}
	.menutop li.contact a	{background: url(../../../img/contact.gif) no-repeat 2px; padding-left: 20px;}
	
	
/* Main menu gedeelte */
		
	.menu, .menufill
		{background-color: #e52600;}
	.menu	
		{font-size: 90%; padding: 0 0 10px 0;
		color: #ffffff;}
	
/* Content waar feitelijke tekst staat */
	
	.content, .contentfill, .footer, .content table
		{background-color: #fbf6ff;
		color: #3c1f52;}

/* De footer */
		
	.footer	{padding: 0px 5px 2px 0px; font-size: 85%;}
	.footer .eigen	{text-align: center;} 
/* CSS_SUCKERFISH.CFM (= uitklapmenu) +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+- */
/* Son of suckerfish (=uitklap) menu
zie: http://www.htmldog.com/articles/suckerfish/dropdowns/ */

	ul#nav	
		{padding-left: 5px;}
	ul#nav, #nav ul 
		{margin: 0; list-style: none;}
	ul#nav li 
		{float: left; width: 150px;}
	ul#nav li ul 
		{position: absolute; width: 150px; left: -999em; margin: -2em 0 0 5em; z-index: 10;}

	ul#nav li:hover ul, ul#nav li.sfhover ul
		{left: auto;}

	.links2 ul#nav li:hover ul, .links2 ul#nav li.sfhover ul,
	.kols3 ul#nav li:hover ul, .kols3 ul#nav li.sfhover ul
		{*left: 170px;} /* ie7 only correctie */
		
	ul#nav li ul a	{z-index: 12; width: 150px;} /* anders kun je in ie6 niet bij sommige opties  */
	
	/* bij het menu aan de rechterzijde wil je het uitklapmenu links van het eerste niveau. */
	.rechts2 ul#nav li ul {margin: -2em 0 0 -150px;}
	
	/* ivm ongewenst plakken in IE7 */
	#nav li:hover, #nav li.hover {position: static;} 
	

/* CSS_MODS.CSS +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+- */
/* In de tekst (in het contentdeel) te gebruiken */	

	a			{text-decoration: none;}
	a:hover		{text-decoration: underline;}
	a img		{border: none;}
	a.subtiel	{text-decoration: none;}
	
	.content a, #content a	{text-decoration: underline;}
	.content a:hover, #content a:hover {text-decoration: none;}
	
	h1         {font-size: 120%;}
	h2         {font-size: 104%;}
	h3         {font-size: 96%;}
	h4         {font-size: 88%;} 

	h2.krap	{margin-bottom: 0;}
	p.krap	{margin-top: 0;}
	ul.invis	{margin: 0; padding: 0;}
	ul.invis li	{list-style-type: none; list-style-image: none; margin-bottom: 4px}
	
	.klein	{font-size: 0.8em;}
	.feedback	{color: red; font-size: 85%}
	.oud	{text-decoration: line-through}
	.clear	{clear: both; }

	.hidden, .verborgen	{display: none;}
	
	td, th	{vertical-align: top;}
	th		{text-align: left;}
	
	.product			{clear: both;}
	img.left, .decolinks	{float: left; margin: 0 15px 15px 0;}
	img.right, .decorechts	{float: right; margin: 0 0 15px 15px;}
		
	.fotoselect		{text-align: right; margin: 0 0 4px 0}
	.fotoselect a	{text-decoration: none}
		
	table#galerie a	{border: none;}

	.gboek	{margin: 5px 0; padding: 5px;}
	.gboek .bron	{font-style: italic; font-size: 90%;}
		
	hr	{border: none; height: 1px; clear: both}
		
	fieldset	{padding: 10px; width: 94%}
	legend		{font-weight: bold; padding-bottom: 6px;}
	label:hover	{text-decoration: underline; cursor: pointer}
	
	form#rhmofferte	fieldset	{width:100%;} /* uitzondering klant 131 */
	#content form.nwsbrfabo	fieldset {width: 200px; float: right;}
	#sidebar fieldset	{width: 150px;}
	
	fieldset dl, dl.naastelkaar 	{overflow: auto;}
	fieldset dl dt, dl.naastelkaar dt {clear:both; width:140px; float:left; text-align:left;}
	fieldset dl dd, dl.naastelkaar dd {float:left; width:66%; margin:0 0 0.5em 0.25em;}
	fieldset dl.krap dt	{width: 50px;}
	fieldset dl.vinkje dt	{width:24px;}
	fieldset dl.vinkje dd	{width:84%;}
	
	fieldset .verplicht, fieldset .toelichting {color: gray} 
	fieldset .toelichting	{margin-left: 20px; font-size: 0.9em} 
	
	form input.tekst	{width: 300px} /* titels */
	form input.tekstje	{width: 65px} /* postcode, telnr, kleurcodes */
	form input.datum	{width: 80px}
	form input.mini		{width: 30px} /* volgorde */
	form input.upload	{width: 250px;}
	form textarea		{width: 250px;}
	
	form .controleveld	{display: none} /* controle op spam */
	
	.block	{display: block}
	
	.cols	{}
	.col	{float: left; width: 32%}
	
	td.rechts, th.rechts, td.bedrag	{text-align: right}

	.ico	{background-repeat: no-repeat; background-position: left 2px; padding-left: 18px;}
	.rss	{background-image: url(../../../img/feed-icon16x16.png)}
	
/* Homepage +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+ */
	body#circhome #includes	{margin-top: 20px; clear: both}
	body#circhome #includes div	{width: 80%; clear: both}
	body#circhome #includes	dt	{color: black}
	body#circhome #includes	dt span.datum	{font-size: 0.9em}
	body#circhome #includes	dd	{font-size: 0.9em; margin-left: 0; color: gray}
	body#circhome #includes	dd a	{text-decoration: none; color: gray; font-size: 0.8em; text-transform: lowercase;}
	
	form#tickertape	{margin-bottom: 15px; width: 90%;}
	form#tickertape input {background-color: transparent; width: 90%; font-weight: bold; border: none;}
	
	#banners	{float: right; margin: 0 0 10px 10px;}
	
/* Nieuwe homepage, met blokken +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+ */

	#homeblok .homerij	{overflow: hidden; margin-bottom: 10px;}
	#homeblok .homeblok	{float: left;}
	#homeblok .modincl dd	{margin: 0 0 5px 0; padding: 0;}
	#homeblok .modincl dt span.datum	{font-size: 0.8em}
	
/* Inline inloggen +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+- */

	form#inlinelogin {display: block; clear: both; padding: 30px 20px 20px 20px}
	form#inlinelogin fieldset	{margin: 0; padding: 0; border:none}
	form#inlinelogin fieldset legend	{margin: 0; padding: 0;}
	
/* Demo aanvraag form +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+  */
	#demotoel	{float: right; width: 250px; margin-right: 30px;}	
	form#demoaanvraag	{float: left; width: 550px;}
	form#demoaanvraag fieldset	{border: 1px solid gainsboro; margin-top: 10px}
	form#demoaanvraag fieldset legend	{color: gray}
	form#demoaanvraag .nr	{color: white; background-color: whitesmoke; padding: 10px; margin-left: 20px;
		float: right; font-size: 3.5em; font-family: "Lucida Sans Unicode"; }
	form#demoaanvraag p, form#demoaanvraag dl	{margin: 5px auto;}
	
/* Galerie +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+- */
	ul#fotoablbums	{margin: 0; padding: 0;}
	ul#fotoablbums li	{list-style-type: none; float: left; /* width: 150px; */ margin: 10px;}
	ul#fotoablbums li a	{text-transform: capitalize; text-decoration: none;}
	
/* Nieuws +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+ */
	.nieuwsitem	{clear: both}

/* Agenda +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+ */
	dl#event dt {font-weight: bold;}
	dl#event dd {margin: 0px; padding: 0px;}
	dl#event dd#toelichting {margin: 1em 0;}
	
/* Adressenlijst +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+- */
	dl.adressenlijst	{float: left; margin-right: 15px; width: 30%}
	dl.adressenlijst dt	{font-size: 2em;}
	dl.adressenlijst dd	{margin-left: 0;}
	
/* Nieuwsbrief +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+- */		
	.nieuwsbrief		{border: 1px solid silver; padding: 10px; /* width: 65%; */ overflow:auto}
	.nieuwsbrief img	{float: right; border: 1px solid black; padding: 5px; margin: 0 0 10px 10px}
	
/* Forum & Ledenlijst +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+ */
	table.lijst	{border: 1px solid gainsboro; border-collapse: collapse;}
	table.lijst tr td, table.lijst tr th {border: 1px solid gainsboro; border-width: 1px 0 0 1px; padding: 3px;}
	table.lijst tr th	{font-weight: bold}
	
/* Productenmodule +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+- */		
	#winkeldetails	{padding: 5px; float: right; margin: 5px 0 5px 10px;}
	#winkeldetails form	{margin: 0}
	
	#prodcatsimg, #prods .item, #proddetail	{background-color: white; color: black}
	#prodcatsimg a, #prods a, #proddetail a	{color: black}
	
	#prodcatsimg a	{padding: 5px; display: block; float: left; 
		margin: 5px; text-align: center; text-decoration: none;}
	#prodcatsimg a:hover	{text-decoration: underline;}
	
	#prods	{font-size: 80%;}
	#prods .item	{width: 150px; padding: 5px; display: block; float: left; margin: 5px; height: 240px;}
	#prods .item p	{margin: 0 auto;}
	/* #prods .item .plaatje	{width: 150px; height: 100px; background-color:#ddd; text-align: center;} */
	#prods .item h2	{margin-bottom:0px;}
	#prods .item .meer	{font-weight: bold; margin-top: 8px;}
	#prods .item .meer a	{text-decoration: none;}
	#prods .item .meer a:hover	{text-transform: uppercase}
	
	#proddetail	{padding: 2%;}
	#proddetail #detailimg	{text-align: center; background-color: #eee; margin-top: 0;}
	#proddetail table	 	{border-collapse: collapse; color: black;}
	#proddetail table th	{width: 15%; font-weight: normal;}
	#proddetail table td, #proddetail table th {background-color: #eee; padding: 3px; border-bottom: 3px solid white}
	
	/* ivm conflict padding #proddetail en table width 100% moet ik voor IE een hack gebruiken  */
	#proddetail table {width: 100%;}
	* html #proddetail table {width: 96%;}
	
	#prodblader 	{display: inline;float: right;}
	#prodnav		{padding-top: 10px; margin: 0;}
	#prodcatsterug 	{clear: both; margin-top: 40px;}
	#prodcatsterug a, #prodnav a		{text-decoration: none;}
	#prodcatsterug a:hover, #prodnav a:hover	{font-weight: bold;}
	
/* Winkel +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+ */
	
	ul#winkelstappen	{text-align: right; margin: 10px 0; padding: 0;}
	ul#winkelstappen li	{display: inline; list-style-type: none; list-style-image: none;}
	ul#winkelstappen li.curr span	{border-bottom: 2px solid gainsboro;}
	
	table.tussenlijnen	{border-bottom: 1px solid gainsboro; border-collapse: collapse; width: 100%; margin: 5px 0;}
	table.tussenlijnen tr td, table.tussenlijnen tr th 
		{border: 1px solid gainsboro; border-width: 1px 0 0 0; padding: 3px;}	
	
	table#winkelwagen	{border: 1px solid gainsboro; border-collapse: collapse;}
	table#winkelwagen tr td, table#winkelwagen tr th 
		{border: 1px solid gainsboro; border-width: 1px 0 0 1px; padding: 3px;}
		
	form#coupon p	{margin: 20px auto 25px auto;}
	
/* Boomstructuur +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+- */
	#boommetpic		{margin: 0; padding: 0;}
	#boommetpic li	{float: left; margin: 0 10px 10px 0; list-style-type: none}
	#boomsanspic li	{margin-bottom: 12px;}
	
/* Fotogallery - met Lightbox +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+ */
	#gallery 		{text-align: left;}
	#gallery ul 	{list-style: none; padding: 0; margin: 0;}
	#gallery ul li 	{display: inline; list-style-type: none}
	/* #gallery ul img 	{width: 150px; height: 100px;} */
	#gallery ul li a, #gallery ul a:hover, #gallery ul a:hover img {text-decoration: none}

/* Medewerkers & Disciplines +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+- */
	.medewitem	{width: 45%; float: left; padding: 10px; margin: 0 20px 10px 0;}

/* Oude bestellingen, via Profiel */
	table.vorigeorders	{width: 100%; border: 1px solid gainsboro; border-collapse: collapse;}
	table.vorigeorders tr td, table.vorigeorders tr th 
		{border: 1px solid gainsboro; border-width: 1px 0 0 1px; padding: 3px;}
	table.vorigeorders td.subtiel	{font-size: 0.8em}
	
/* Blog +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+ */
	#blogcurrent	{float: left; width: 75%;}
	#blogsidebar	{float: right; padding: 10px; width: 19%;}

	#blogcurrent p	{margin-bottom: 0}
	
	table#kalender	{background-color: transparent; border-collapse: collapse;}
	table#kalender tr td, table#kalender tr th {border-width: 1px 0 0 1px; padding: 2px; font-size: 0.8em}
	table#kalender th	{text-transform: capitalize;}
	/* table#kalender tr.subhead td	{font-size: 0.8em} */
	table#kalender a	{text-decoration: none; font-weight: bold}
	table#kalender a:hover	{text-decoration: underline}
	
	ul.blogside	{margin: 0; padding: 0; font-size: 0.9em}
	ul.blogside li	{list-style-type: none; margin: 0; padding: 0;}
	ul.blogside ul	{padding-left: 0;}
	
	.blogfoot		{font-size: 0.75em; margin-bottom: 30px; padding-top:6px}
	.blogfoot a		{text-decoration: none;}
	.blogfoot a:hover		{text-decoration: underline;}
	
	#commentform, #comments {width: 90%; margin: 10px 0;}
	#commentform		{display: none; font-size: 0.8em; line-height: 1.6;}
	#commentform form	{margin: 0;}
	#commentform form * 	{font-size: 100%}
	#commentform dl dt 	{clear:left; width:50px; float:left; text-align:left;}
	#commentform dl dd 	{float:left; width:66%; margin:0 0 0.5em 0.25em;}
	
	#comments			{font-size: 0.8em; line-height: 1.6; margin: 0;}
	#comments div		{padding: 10px; margin: 0;}
	#comments blockquote	{margin: 4px 0 0 0; padding-left: 10px;}

/* CSS_MODS_KLEUR.CFM +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+- */
/* In de tekst (in het contentdeel) te gebruiken */	
	h1	{color: #;}
	a	{color: #7d2bbb;}
	img.galerie		{border: 1px solid #3c1f52}
	.gboek	{border: 1px solid #7d2bbb;}
	
	.button, button
		{background-color: #fbf6ff;
		color: #7d2bbb;}
		
	hr	{color: #7d2bbb; background: #7d2bbb;}
	
	.block	{background-color: #000000;}
	
	.lijst th	{background-color: #f08671;}
	th.subtiel	{background-color: #f9cec6;}
	
	.content .oneven	{background-color: #fce6e2;}
	.content .even	{background-color: #fbf6ff;}

	#sidebar fieldset	{border: 1px solid #f08671;}
	
/* Productenmodule */
	/* #prodcatsimg a, #prods .item, #proddetail
		{border: 1px solid #7d2bbb;} */
	
	#winkeldetails	{border: 1px solid #7d2bbb;}
		
/* blog */
	#blogsidebar
		{background-color: #fce6e2; 
		border: 1px solid #f39e8d}

	#blogsidebar table, #blogsidebar table tr td, #blogsidebar table tr th
		{border: 1px solid #f6b6aa;}
		
	#comments blockquote	{border-left: 3px solid #f08671;}
	#comments .oneven	{background-color: #fce6e2;}

/* Tickertape op de homepage */
	form#tickertape input {color: #3c1f52;}
	
/* Gallery */
	#gallery ul img 	{border: 2px solid #f08671;}
	
/* Medewerkers & Disciplines */
	.medewitem	{border: 1px solid #ed6e55;} /* TABLE/CSS_MENU.CFM +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+- */


/* basis opzetten */
ul#nav, ul#nav ul	{margin: 0; padding: 0;}
ul#nav 		{margin: 10px;} /* WAS width: 175px; margin: 10px;*/
ul#nav li 	{list-style-type: none; margin: 0; padding: 0; width: 100%}
ul#nav a	{color: #ffffff; font-weight: bold;
			display: block; padding: 5px 0; text-decoration: none;}
ul#nav li a	{text-align: left; padding-left: 10px;}
ul#nav li a:hover	{text-decoration: underline;}

/* uitzondering voor liggend menu, layout 5 */
#liggendmenu ul#nav	{width: auto;}
#liggendmenu ul#nav	li	{float: left; width: auto;}
#liggendmenu ul#nav	ul, #liggendmenu ul#nav	ul li	{width: 13em;}


	/* styling uitklapmenu - voorheen uit css_suckerfish.cfm */
	ul#nav li ul a	{line-height: 1; background-image: none;
		border: 1px solid #7d2bbb; 
		color: #ffffff; 
		background-color: #e52600;}
	ul#nav li ul a:hover	
		{text-decoration: none; color: #e52600; 
		background-color: #ffffff;}


/* gekozen menustyle: 0 */
/* CSS_LAYOUT.CFM +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+- */
/* Onderstaande is afhankelijk van de gekozen lay-out
veelal uitzonderingen op eerdere definities, vandaar later geinclude */


	.menutop	{padding-right: 20px;}
	.content	{padding: 15px 20px 10px 20px;}