﻿					/* FROMM CSS*/

/*----------------------------------------------------------------
STANDAARD KLASSEN
----------------------------------------------------------------*/
html, body, form
{
	height: 100%;
}
body
{
	margin: 0px;
	padding: 0px;
	background: url("Images/body_back.gif") center top repeat-y;
}
html, body, table, select, input, textarea
{
    font-family: Arial, Verdana, Tahoma;
	font-size: 12px;
	color: #3C3C3C;
	text-align: justify;
}
form
{
	margin: 0px;
	padding: 0px;
}
hr
{
	border-top: solid 1px #B0DDB0;
	background: none;
}
p
{
	padding: 5px 0;
	margin: 5px 0;
}
ul
{
    list-style-type: square;
    margin: 0px;
    padding: 10px;
    padding-left: 20px;
}
h1
{
	padding: 5px 0px 5px 23px;
	margin: 0px 0px 10px 0px;
	font-size: 20px;
	font-weight: bold;
	color: #D20000;
	background: url("Images/h1_back.gif") left 13px no-repeat;
}
	.bodyBeheer h1
	{
		padding: 5px 0px 5px 0px;
		background: none;
	}
h2
{
	padding: 7px 0px 10px 23px;
	margin: 0px;
	font-size: 18px;
	font-weight: bold;
	color: #D20000;
	background: url("Images/h1_back.gif") left 13px no-repeat;
}
	.bodyBeheer h2
	{
		padding: 7px 0px 10px 0px;
		background: none;
	}
h3
{
	padding: 5px 0px 5px 0px;
	margin: 0px;
	font-size: 15px;
	font-weight: bold;
}
h4
{
	padding: 5px 10px 5px 10px;
	margin: 0px;
	font-size: 15px;
	text-align: right;
}
img
{
    margin: 0px;
    padding: 0px;
    vertical-align: middle;
}
select
{
}
	select:disabled
	{
		background-color: #FFFFFF;
		color: #A7A5A5;
	}
input.textbox,
textarea
{
	width: 220px;
	height: 18px;
	padding-left: 4px;
	border: solid 1px #C6C6C6;
	background: url("Images/textbox_back.gif") left top repeat-x;
}
	input.textbox:disabled,
	textarea:disabled
	{
		color: #A7A5A5;
	}
input.button
{
	cursor: pointer;
	height: 23px;
	padding: 0 20px 0 20px;
	border: solid 1px #973838;
	background: url("Images/button_back.gif") left top repeat-x;
	font-weight: bold;
	color: #FFFFFF;
	text-align: center;
}
a
{
	color: #3C3C3C;
	text-decoration: none;
	outline: none;
}
	a:hover
	{
		text-decoration: underline;
	}

/*----------------------------------------------------------------
LAYOUT KLASSEN
----------------------------------------------------------------*/
#siteOverlay
{
	position: absolute;
	width: 100%;
	height: 119px;
	top: 20px;
	left: 0px;
	z-index: 0;
	background: url("Images/overlay_back.gif") center top repeat-y;
}

/* WEBSITE */
#siteContainer
{
	position: relative;
	width: 996px;
	min-height: 100%; /*IE6*/_height: 100%;
	margin: 0px auto;
}
	/* HEADER */
	#siteContainer #headerContainer
	{
		width: 996px;
		height: 119px;
		margin-top: 20px;
		background: url("Images/header_back.jpg") left top no-repeat;
	}
		#siteContainer #headerContainer #userContainer
		{
			position: absolute;
			top: -18px; #top: 2px;
			right: 10px;
		}
			#siteContainer #headerContainer #userContainer span.separator
			{
				padding-left: 5px;
				padding-right: 5px;
				font-weight: bold;
				color: #D2171F;
			}
	
	/* MENU */
	#siteContainer #menuContainer
	{
		float: left;
		width: 180px;
		min-height: 700px;/*IE6*/_height: auto !important;_height: 700px;
		margin-top: -139px;
		padding-left: 20px;
		background: url("Images/menu_back.gif") left top no-repeat;
	}
		/* MENU - TOP */
		#siteContainer #menuContainer #menuTop
		{
			width: 178px;
			height: 78px;
			margin-bottom: 1px;
			background: url("Images/menu_top.jpg") center top no-repeat;
		}
		/* MENU - LEVEL 1 */
		#siteContainer #menuContainer ul.ulMenu
		{
			margin: 0px;
			padding: 0px;
			border-left: solid 1px #FFFFFF;
			border-right: solid 1px #EEEFF1;
		}
			#siteContainer #menuContainer ul.ulMenu > li
			{
				list-style-type: none;
				background: url("Images/menuitem_back.gif") left top repeat-x;
			}
				#siteContainer #menuContainer ul.ulMenu li > a
				{
					display: block;
					width: 168px;
					height: 19px;
					padding: 4px 0px 0px 10px;
					margin-bottom: 1px;
					font-weight: bold;
					color: #FFFFFF;
				}
				/* MENU - LEVEL 2 */
				#siteContainer #menuContainer ul li ul.ulSubmenu
				{
					margin: 0px;
					padding: 0px;
					background: url("Images/submenu_back.gif") left top repeat-y;
				}
					#siteContainer #menuContainer ul li ul.ulSubmenu > li,
					#siteContainer #menuContainer ul li ul.ulSubmenu > li.highlight
					{
					    clear: both;
						display: block;
						list-style-type: none;
						min-height: 17px;
						margin: 0px 0px 1px 0px;
						padding: 0px;
						background: url("Images/submenuitem_back.gif") left top repeat-x;
					}
					#siteContainer #menuContainer ul li ul.ulSubmenu > li.highlight
					{
						background-image: url("Images/submenuitem_back_highlight.gif");
					}
					    #siteContainer #menuContainer ul li ul.ulSubmenu li > span.btnExpand,
					    #siteContainer #menuContainer ul li ul.ulSubmenu li > span.btnNoExpand
					    {
						    float: left;
						    display: block;
					        width: 20px;
					        height: 17px;
					        background: url("Images/menuitem_expand_back.gif") center 4px no-repeat;
					        z-index: 123;
					        text-decoration: none;
					        cursor: pointer;
					    }
					    #siteContainer #menuContainer ul li ul.ulSubmenu li > span.btnNoExpand
					    {
					        background: none;
					        cursor: default;
					    }
						#siteContainer #menuContainer ul li ul.ulSubmenu li > a.btnProduct
						{
						    float: left;
							width: 121px;
							height: 15px;
							padding: 2px 0px 0px 5px;
							margin: 0px;
							font-size: 11px;
							font-weight: bold;
							color: #FFFFFF;
							white-space: nowrap;
						}
						/* MENU - LEVEL 3 */
						#siteContainer #menuContainer ul li ul.ulSubmenu li ul
						{
						    clear: both;
							margin: 0px;
							padding: 0px;
						}
							#siteContainer #menuContainer ul li ul.ulSubmenu li ul li
							{
								list-style-type: none;
								display: block;
								height: 16px;
								padding: 1px 0px 1px 0px;
							}
								#siteContainer #menuContainer ul li ul.ulSubmenu li ul li a
								{
									display: block;
									padding: 1px 0px 0px 30px;
									font-weight: normal;
									color: #625D5D;
								}
									#siteContainer #menuContainer ul li ul.ulSubmenu li ul li a:hover
									{
										background: url("Images/submenuitem_selected.gif") 20px 5px no-repeat;
										font-weight: bold;
										color: #D41010;
										text-decoration: none;
									}
					
		/* MENU - BOTTOM */
		#siteContainer #menuContainer #menuBottom
		{
			width: 179px;
			height: 75px;
			background: url("Images/menu_bottom.gif") center top no-repeat;
		}
	
	/* CONTENT */
	#siteContainer #contentContainer
	{
		float: right;
		position: relative;
		width: 756px;
		padding: 20px 20px 40px 20px;
	}
	    /* SEARCH CONTAINER */
	    #siteContainer #contentContainer .searchContainer
	    {
	        margin: -20px -20px 10px -20px;
	        padding: 6px 10px 5px 0px;
	        border-bottom: solid 1px #C9C9C9;
	        background: url("Images/searchcontainer_back.gif") left top repeat-x;
	        text-align: right;
	    }	    
	    
		/* CONTENT - LEFT */
		#siteContainer #contentContainer #contentLeft
		{
			float: left;
			width: 435px;
		}
		/* CONTENT - RIGHT */
		#siteContainer #contentContainer #contentRight
		{
			float: right;
			width: 316px;
			margin-top: -10px;
			margin-right: -20px; _margin-right: -11px;
			padding-left: 9px;
			/*background: url("Images/contentright_back.gif") left top repeat-y #FFFFFF;*/
		}
	
	/* FOOTER */
	#siteContainer #footerContainer
	{
		position: absolute;
		left: 0px;
		bottom: 0px;
		width: 996px;
		height: 18px;
		background: url("Images/footer_back.gif") left top repeat-x;
	}

/*----------------------------------------------------------------
LAYOUT KLASSEN - BEHEER
----------------------------------------------------------------*/
#beheerSiteContainer
{
	position: relative;
	width: 994px;
	min-height: 100%; /*IE6*/_height: 100%;
	margin: 0px auto;
	border-left: solid 1px #3C3C3C;
	border-right: solid 1px #3C3C3C;
}
	#beheerSiteContainer #beheerHeaderContainer
	{
		width: 100%;
		height: 65px;
	}
		/* LOGO */
		#beheerSiteContainer #beheerHeaderContainer #beheerHeaderLeft
		{
			float: left;
			position: relative;
			width: 260px;
		}
			#beheerSiteContainer #beheerHeaderContainer #beheerHeaderLeft img.logo
			{
				position: absolute;
				top: 12px;
				left: 23px;
			}
		
		/* MENU */
		#beheerSiteContainer #beheerHeaderContainer #beheerHeaderRight
		{
			float: right;
			position: relative;
			padding-right: 25px;
			text-align: right;
		}
			/* MENU - LINKS */
			#beheerSiteContainer #beheerHeaderContainer #beheerHeaderRight ul
			{
				display: inline;
				float: right;
				padding: 5px 0px 5px 0px;
			}
				#beheerSiteContainer #beheerHeaderContainer #beheerHeaderRight ul li
				{
					float: left;
					list-style-type: none;
					font-size: 13px;
					padding-left: 5px;
					color: #3C3C3C;
				}
				#beheerSiteContainer #beheerHeaderContainer #beheerHeaderRight ul li a
				{
					font-weight: bold;
					color: #D20000;
				}
			
			/* MENU - LOGINNAME */
			#beheerSiteContainer #beheerHeaderContainer #beheerHeaderRight p
			{
				clear: both;
				padding: 0px;
				text-align: right;
			}
				#beheerSiteContainer #beheerHeaderContainer #beheerHeaderRight p a
				{
					color: #3C3C3C;
				}
				#beheerSiteContainer #beheerHeaderContainer #beheerHeaderRight p span.separator
				{
					color: #B41422;
				}
	
	/* HEADER EN TABS */
	#beheerMenuContainer
	{
		width: 994px;
		border-top: solid 1px #D61717;
		border-bottom: solid 1px #D61717;
		background-color: #484D52;
	}
		#beheerMenuContainer #beheerMenuLeft
		{
			float: left;
			width: 472px;
			height: 33px;
			padding-left: 25px;
			padding-top: 18px;
		}
		#beheerMenuContainer #beheerMenuRight
		{
			float: left;
			width: 467px;
			height: 50px;
			padding-right: 30px;
			padding-top: 5px;
			text-align: right;
		}
			#beheerMenuContainer #beheerMenuRight h1
			{
				background: none;
				font-size: 20px;
				color: #FFFFFF;
			}
			#beheerMenuContainer #beheerMenuRight .beheerObjectNaam
			{
				display: block;
				margin-top: -8px;
				font-size: 18px;
				font-weight: bold;
				color: #DBDBDA;
			}
				/* HELP */
				#beheerMenuContainer #beheerMenuHelp
				{
					width: 100%;
					margin: 0px auto;
					text-align: center;
				}
					#beheerMenuContainer #beheerMenuHelp #spanHelp
					{
						cursor: pointer;
						font-size: 11px;
						font-weight: bold;
						color: #FFFFFF;
					}
					#beheerMenuContainer #beheerMenuHelp #divHelpContent
					{
						display: none;
						width: 974px;
						min-height: 100px;
						padding: 10px;
						border-top: dotted 1px #B25D5D;
						background: url("Images/helpcontent_back.gif") left top repeat-x #FFFFFF;
						text-align: left;
					}
	
	/* CONTENT */
	#beheerSiteContainer #beheerContentContainer
	{
		position: relative;
		width: 934px;
		margin: 25px;
		border: solid 1px #CCC9C6;
	}
		#beheerSiteContainer #beheerContentContainer #beheerContentInhoud
		{
			padding: 20px;
		}

/*----------------------------------------------------------------
LOSSE KLASSEN
----------------------------------------------------------------*/
.clearer
{
	clear: both;
	height: 0px;
	visibility: hidden;
}
span.validator
{
	font-size: 16px;
	font-weight: bold;
}
p.inleiding
{
	font-weight: bold;
}