body { /* voor in de editor */
	/* TODO: invullen */
	font-size: 12px;
	font-family: Arial;
	line-height: 17px;
}

.body { /* overschijft de @css body hierboven, deze .body wordt gebruikt voor de echte body in de pagina*/
	margin: 0px 0px 0px 0px;
	background-color: #D2BB9D;
	color: #868686;
	font-family: Arial;
	font-size: 8pt;
	font-weight: normal;
}

/* De wrapper class, zoals die vrije lanceerder van edmedia zou zeggen */
#boxMain
{
	margin: 0 auto;
	width: 859px;
	display: block;
	height: auto;
	background-image: url(../images/back.jpg);
	background-repeat: no-repeat;
	overflow: hidden;
}

	/* De top-box */
	#boxTop {
		position: relative; 
		width: 859px; 
		height: 269px;
	}
	
		/* Logo met 3 alternatieven, afhaneklijk van gekozen item */
		#boxTopLeft {
			float: left;
			clear: right;
			width: 160px;
			height: 160px;
			padding-left: 77px;
			padding-right: 56px;
			padding-top: 47px;
			padding-bottom: 62px;
		}
		
		#groenIE 
		{
			width: 160px;
			height: 160px;
			cursor: pointer;
			filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='templates/Cottagebread/images/logo_groen.png', sizingMethod='no-scale');
		}
		
		#boxTopLeft.groenM 
		{
			background-image: url(../images/logo_groen.png);
			background-repeat:no-repeat;
			background-position: 77px 47px;
		}
		
		#geelIE 
		{
			width: 160px;
			height: 160px;
			cursor: pointer;
			filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='templates/Cottagebread/images/logo_geel.png', sizingMethod='no-scale');
		}
		
		#boxTopLeft.geelM 
		{
			background-image: url(../images/logo_geel.png);
			background-repeat:no-repeat;
			background-position: 77px 47px;
		}
		
		#roodIE
		{
			width: 160px;
			height: 160px;
			cursor: pointer;
			filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='templates/Cottagebread/images/logo_rood.png', sizingMethod='no-scale');
		}
		
		#boxTopLeft.roodM
		{
			background-image: url(../images/logo_rood.png);
			background-repeat:no-repeat;
			background-position: 77px 47px;
		}
		
		#bruinIE
		{
			width: 160px;
			height: 160px;
			cursor: pointer;
			filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='templates/Cottagebread/images/logo_bruin.png', sizingMethod='no-scale');
		}
		
		#boxTopLeft.bruinM
		{
			background-image: url(../images/logo_bruin.png);
			background-repeat:no-repeat;
			background-position: 77px 47px;
		}
		
		/* Language, zoek venster, menu en plaatje / introtext startpagina */
		#boxTopRight {
			float: left;
			clear: right;
			width: 566px;
			height: 269px;
		}
		
			/* Taal */
			#boxTopLang 
			{
				float: left;
				clear: none;
				width: 296px;
				height: 75px;
			}
			
				.jflanguageselection
				{
					float:left;
					clear:right;
					display: block;
					font-weight: bold;
					color: #868686;
					padding-top: 15px;
					width: 206px;
					height: 20px;
				}
				
				.jflanguageselectionli, .jflanguageselectionliselected
				{
					float:left;
					clear:right;
					display:block;
					width: 30px;
					height: 20px;
				}
				
				.jflanguageselectionli a { color: #868686; }
				
				.jflanguageselectionliselected a { color: #9EBA4A; }
				
					.geel .jflanguageselectionliselected a { color: #E8B500; }
					.rood .jflanguageselectionliselected a { color: #D04B59; }
					.bruin .jflanguageselectionliselected a { color: #93744A; }
				
				
			
			/* Zoekvenster */
			#boxTopSearch
			{
				float: left;
				clear: none;
				padding-top: 11px;
				width: 270px;
				height: 64px;
			}
			
				.searchword
				{
					float: left;
					clear: right;
					display:block;
					font-size: 8pt;
					font-weight: bold;
					width: 70px;
					padding-top: 4px;
					height: 12px;
				}
			
				.searchinputbutton
				{
					float: left;
					clear: right;
					width: 102px;
					height: 12px;
					line-height: 12px;
					display:block;
				}
			
				#boxTopSearch input
				{
					line-height: 12px;
					height: 12px;
					width: 102px;
					font-size: 8pt;
				}
				
			/* Topmenu */
			#boxTopMenu
			{
				float: left;
				clear: none;
				width: 566px;
				height: 59px;
			}
			
				.knopHoofdmenu
				{
					float: left;
					clear: none;
					color: #8EB030;
					font-size: 16pt;
					font-weight: normal;
					font-family: Times New Roman;
					text-decoration: none;
					padding-left: 17px;
					padding-right: 18px;
					height: 36px;
					padding-top: 23px;
				}
				
				.geel .knopHoofdmenu { color: #E8B500; }
				.rood .knopHoofdmenu { color: #D04B59; }
				.bruin .knopHoofdmenu { color: #93744A; }
					
				.knopHoofdmenu_eerste
				{
					padding-left: 0px;
				}
				
				.knopHoofdmenu:hover
				{
					color: #AAAAAA;
				}
			
			/* Introductietext */
			#boxTopIntro
			{
				float: left;
				clear: none;
				width: 466px;
				height: 115px;
				padding-left: 1px; 
				padding-right: 100px;
			}
			
			#boxNieuwsberichten
			{
				float: left;
				clear: none;
				width: 366px;
				height: 20px;
				padding-left: 1px; 
				padding-right: 100px;
				overflow: hidden;
			}
			
				.NieuwsStijl
				{
					font-size: 12px;
				}
			
				#boxMain #boxTopIntro .componentheading, #boxMain #boxTopIntro .contentheading
				{
					display: none;
				}
			
			/* Producten textvak */	
			#boxTopProducten
			{
				float: left;
				clear: none;
				display: block;
				width: 540px;
				height: 135px;
				background-color: #9FBB4E;
				color: White;
			}
			
			#boxTopProductengroen
			{
				float: left;
				clear: none;
				display: block;
				width: 540px;
				height: 135px;
				background-color: #9FBB4E;
				color: White;
			}
			
			#boxTopProductengeel
			{
				float: left;
				clear: none;
				display: block;
				width: 540px;
				height: 135px;
				background-color: #E8B500;
				color: White;
			}
			
			#boxTopProductenrood
			{
				float: left;
				clear: none;
				display: block;
				width: 540px;
				height: 135px;
				background-color: #D04B59;
				color: White;
			}
			
			#boxTopProductenbruin
			{
				float: left;
				clear: none;
				display: block;
				width: 540px;
				height: 135px;
				background-color: #93744A;
				color: White;
			}
			
			/* Pathway */
			#pathway 
			{
				float: left;
				clear: right;
				padding-top: 2px; 
				padding-left: 8px; 
				height: 18px;
				width: 490px;
			}
			
			#pathway a { font-weight: normal; color: White; text-decoration: none; }
			#pathway a:hover { text-decoration: underline; }
			#pathway img 
			{
				padding-left: 10px;
				padding-right: 10px;
			}
			
			#back
			{
				float: left;
				clear: none;
				width: 40px;
			}
			
			#back a
			{
				color: White;
				font-weight: bold;
				text-decoration: none;
			}
			
			#back a:hover
			{
				text-decoration: underline;
			}
		
	/* Middelste stuk voor de startpagina */
	#boxStartMiddle
	{
		position: relative;
		width: 809px;
		height: 135px;
		padding-left: 24px;
		color: White;
		font-size: 12pt;
		font-weight: bold;
		font-style: italic;
	}
			
		/* Producten */
		#boxStartMiddleLeft
		{
			float: left;
			clear: right;
			width: 263px;
			height: 35px;
			border-right: solid 1px White;
			background-image: url(../images/product_assort.jpg);
			background-repeat: no-repeat;
			background-color: #9FBB4E;
			padding-top:100px;
			padding-left:5px;
		}
		
		/* Recepten */
		#boxStartMiddleCenter
		{
			float: left;
			clear: right;
			width: 265px;
			height: 35px;
			border-right: solid 1px White;
			background-image: url(../images/recepten_tips.jpg);
			background-repeat: no-repeat;
			background-color: #E8B500;
			padding-top:100px;
			padding-left:5px;
		}
		
		/* Forum */
		#boxStartMiddleRight
		{
			float: left;
			clear: right;
			width: 264px;
			height: 35px;
			background-image: url(../images/forum.jpg);
			background-repeat: no-repeat;
			background-color: #D04B59;
			padding-top:100px;
			padding-left:5px;
		}
		
	/* Linkjes naar producten, recepten en forum (startpagina) */
	#boxStartBottom
	{
		position: relative;
		width: 809px;
		height: auto;
		padding-left: 24px;
		padding-top: 20px;
		padding-bottom: 20px;
		color: #868686;
		font-size: 12pt;
		font-weight: bold;
		font-style: italic;
	}
			
		/* Linkjes naar producten (startpagina) */
		#boxStartBottomLeft
		{
			float: left;
			clear: right;
			width: 264px;
			height: auto;
			padding-left:5px;
		}
		
			.boxSubmenuProducten
			{
				float:left; 
				clear: none; 
				width: 264px;
				font-size: 8pt;
				font-weight: normal;
				font-style: normal;
			}
			
				.boxSubmenuProductenImg
				{
					float:left; 
					clear: right;
					width: 50px; 
					height: 60px;
				}
				
				.boxSubmenuProductenRight
				{
					float:left; 
					clear: right;
					padding-left: 20px;
					background-image: url(../images/pijltje_groen.gif);
					background-repeat: no-repeat;
					background-position: 5px 4px;
					padding-right: 50px;
					width: 140px; 
					height: 60px;
				}
			
					.boxSubmenuProductenTitelLink
					{
						color: #9FBB4E;
						text-decoration: none;
						font-weight: bold;
					}
					
					.boxSubmenuProductenTitelText
					{
						color: #898989;
						text-decoration: none;
					}
			
			.boxSubmenuProductenTitelLink:hover, .boxSubmenuProductenTitelText:hover { color: #AAAAAA; }
			
		/* Linkjes naar recepten (startpagina) */
		#boxStartBottomCenter
		{
			float: left;
			clear: right;
			width: 266px;
			height: auto;
			padding-left:5px;
		}
		
			.boxSubmenu
			{
				float:left; 
				clear: none; 
				width: 244px;
				padding-left: 20px;
				font-size: 8pt;
				font-weight: bold;
				font-style: normal;
				background-image: url(../images/pijltje_grijs.gif);
				background-repeat: no-repeat;
				background-position: 5px 5px;
			}
			
				.boxSubSubmenu
				{
					float:left; 
					clear: none; 
					width: 224px;
					padding-left: 20px;
					font-size: 8pt;
					font-weight: bold;
					font-style: normal;
					background-image: url(../images/pijltje_grijs.gif);
					background-repeat: no-repeat;
					background-position: 5px 5px;
				}
			
			.boxSubmenuGeel
			{
				color: #E8B500;
				background-image: url(../images/pijltje_geel.gif);
				background-position: 5px 4px;
			}
			
			.boxSubmenuRood
			{
				color: #D04B59;
				background-image: url(../images/pijltje_rood.gif);
				background-position: 5px 4px;
			}
			
				.boxSubmenuTitelLink
				{
					color: #898989;
					text-decoration: none;
					font-weight: bold;
				}
				
				.boxSubmenuGeel .boxSubmenuTitelLink { color: #E8B500; } 
				.boxSubmenuRood .boxSubmenuTitelLink { color: #D04B59; } 
				.boxSubSubmenu .boxSubmenuTitelLink { color: #898989; } 
				.boxSubmenuTitelLink:hover { text-decoration: underline; }
		
		/* Linkjes naar forum (startpagina) */
		#boxStartBottomRight
		{
			float: left;
			clear: right;
			width: 264px;
			height: auto;
			padding-left:5px;
		}
		
	/* Onderdeel productpagina (o.a.) */
	#boxBottom
	{
		float: left;
		clear: none;
		width: 809px;
		display: block;
		height: auto;
		padding-left: 24px;
		padding-top: 20px;
		color: #868686;
	}
			
		/* Linkjes naar andere producten, recepten en service-artikelen */
		#boxBottomLeft
		{
			float: left;
			clear: none;
			width: 264px;
			height: auto;
			padding-left:5px;
		}
		
		/* Body */
		#boxBottomRight
		{
			float: left;
			clear: none;
			display: block;
			width: 515px;
			padding-right: 20px;
			height: auto;
			padding-left:5px;
			margin-bottom: 50px;
		}
		
			.contentheading, .componentheading
			{
				color: #9FBB4E;
				font-size: 13pt;
				font-weight: bold;
				padding-bottom: 7px;
			}
			
				.componentheadingrood 
				{
					color: #D04B59; 
					font-size: 13pt;
					font-weight: bold;
					padding-bottom: 7px;
				}
				
				#boxBottomRight.geel .contentheading, #boxBottomRight.geel .componentheading { color: #E8B500; }
				#boxBottomRight.rood .contentheading, #boxBottomRight.rood .componentheading  { color: #D04B59; }
				#boxBottomRight.bruin .contentheading, #boxBottomRight.bruin .componentheading{ color: #93744A; }
				
	#boxBottomDisclaimer
	{
		float: left;
		clear: none;
		width: 159px;
		padding-left: 700px;
		background-color: #D2BB9D;
		display: block;
		padding-top: 3px;
		height: 20px;
		color: #898989;
		
	}
	
	#boxBottomDisclaimer a
	{
		background-image: url(../images/pijltje_wit.gif);
		background-repeat: no-repeat;
		background-position: 5px 3px;
		color: White;
		text-decoration: none;
		padding-left: 16px;
	}
	
	#boxBottomDisclaimer a:hover
	{
		text-decoration: underline;
	}
	
				
/* Product tabellen, links, teksten en titels */
.producttabel			
{
	line-height: 20px;
	font-weight: normal;
}

.producttabel .heading
{
	color: #9FBB4E;
	font-weight: bold;
	font-size: 10pt;
}

.producttabel .text
{
	font-size: 8pt;
}

.producttabel a
{
	text-decoration: none;
	color: #898989;
	font-weight: bold;
}
.producttabel a:hover { text-decoration: underline; }

.producttabel ul
{
	list-style-image: url(../images/bullet_groen.gif);
	line-height:16px;
	margin-left:10px;
	padding-left:10px;
}

.producttabel .blokje
{
	color:White;
	padding: 5px;
	background-color: #9FBB4E;
}


/* Recpeten tabellen, links, teksten en titels */
.recepttabel
{
    float: left;
    clear:none;
    display:block;
	line-height: 20px;
	font-weight: normal;
}

.recepttabel .heading
{
	color: #E8B500;
	font-weight: bold;
	font-size: 10pt;
}

.recepttabel .text
{
	font-size: 8pt;
}

.recepttabel a
{
	text-decoration: none;
	color: #898989;
	font-weight: bold;
}
.recepttabel a:hover { text-decoration: underline; }

.recepttabel ul
{
	list-style-image: url(../images/bullet_geel.gif);
	line-height:16px;
	margin-left:10px;
	padding-left:10px;
}

.recepttabel .blokje
{
	color:White;
	padding: 5px;
	background-color: #E8B500;
	width: 247px;
}

/* Inlogvenster */
.moduletable
{
	float: left;
	clear: none;
	width: 150px;
	padding-left: 7px;
	text-align: left;
	color: #D04B59;
	font-size: 10pt;
	height: 50px;
}


.login_text
{
	color: #898989;
	font-size: 8pt;
}

a
{
	color: #898989;
}

.button
{
	background-color: White;
	border: solid 1px #898989;
	color: #898989;
	cursor: pointer;
	margin-right: 18px;
}

input
{
	background-color: White;
	border: solid 1px #898989;
	color: #898989;
	margin-right: 1px;
}

.inputbox
{
	background-color: White;
	border: solid 1px #898989;
	color: #898989;
}

.inlog_account
{
	background-image: url(../images/pijltje_grijs.gif);
	background-repeat: no-repeat;
	background-position: 2px 3px;
	padding-left: 20px;
	height: 20px;
}

/* Kop voor simpleFAQ */
h1.componentheading, h2.category
{
	font-size: 13pt;
	color: #93744A;	
	font-weight: bold;
}

.postcodeheading
{
	font-size: 11pt;
	color: #93744A;	
	font-weight: bold;
}

/* Forum */
.sectiontableentry1
{
	height: 30px;
	vertical-align: middle;
	background-color: #F8EBE7;
}

.sectiontableentry1 a, .sectiontableentry2 a 
{
	color: White;
	text-decoration: none;
	font-size: 9pt;
}
	

.sectiontableentry1 .forumcat
{
	color: White;
	background-color: #D45C68;
}

.forumcat 
{
	color: White;
}
.sectiontableentry2
{
	height: 30px;
	vertical-align: middle;
	background-color: #F9F1EC;
}

.pagenavbar
{
	color: White;
}
.sectiontableentry2 .forumcat
{
	
	background-color: #D86D78;
}

.linkje
{
	font-size: 8pt;
	font-weight: bold;
	padding-left: 15px;
	text-decoration: none;
	background-image: url(../images/pijltje_grijs.gif);
	background-repeat: no-repeat;
	background-position: 0px 3px;
}

.linkje:hover
{
	text-decoration: underline;
}

/*mosForms*/
.mosFormGroupElement
{
	float: left;
	clear: none;
	width: 450px;
}

.mosFormLabel
{
	float: left;
	clear: right;
	width: 150px;
}

.mosFormElement
{
	float: left;
	clear: none;
	width: 300px;
}

.mosformerror
{
	color: Red;
	font-weight: bold;
}

@media print 
{
	#boxTopLeft, #boxBottomLeft
	{
		display: none;
	}
}

