@import url("menuStyle.css");


/* ----RESET---- */
html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, blockquote, pre, form, fieldset, table, th, td {
margin: 0;
padding: 0;
}

/* ------------------------------------------------------------------------------------------------------------------ */

/* ----BASIS DEFINITIES---- */
body.website {
background: url(/img/bg.gif)  center repeat-y;
font-family: Arial, Helvetica, Verdana, sans-serif;
font-size: 12px;
}

body.homeBlauw {
background: url(/img/bg_blauw.gif)  center repeat-y;
font-family: Arial, Helvetica, Verdana, sans-serif;
font-size: 12px;
}


h1 {
margin: 0;
padding: 0;
color: #ff9900;
font-size: 12px;
font-weight: bold;
}

/*ul, li {
margin: 0;
padding: 0;
list-style: none;
}*/

a, img {
border: 0;
text-decoration: none;
}

#wrapper {
margin: 0 auto;
padding: 0;
width: 799px;
height: 100%;
/*background: #ffcc66;*/
overflow: hidden;
}

#wrapperBlauw {
margin: 0 auto;
padding: 0;
width: 798px;
height: 100%;
background: #0099cc;
overflow: hidden;
}

/* ------------------------------------------------------------------------------------------------------------------ */

/* ----HEADER---- */
#header {
width: 799px;
height: 120px;
background: url(/img/visual_beko.jpg) no-repeat;
}

#datum {
margin: 20px 20px 0 0;
color: #FFFFFF;
float: right;
display: inline;
font-size: 11px;
}
/* ------------------------------------------------------------------------------------------------------------------ */

/* ----MENU---- */
#menu {
width: 799px;
height: 30px;
background: #ffcc66;
}

#menuOptions ul li {
	list-style-image: none;
	list-style-type: none;
}
		/* ----MENU BUTTONS---- */
		#organisatie{
		background: url(/img/menu.jpg) 0 0;
		float:left;
		width:133px;
		height:30px;
		}
		
		#organisatie:hover{
		background:url(/img/menu.jpg) 0 -30px;
		}
		
		#organisatieAC{
		background: url(/img/menu.jpg) 0 -30px;
		float:left;
		width:133px;
		height:30px;
		}
		
		#producten{
		background: url(/img/menu.jpg) -133px 0;
		float:left;
		width:133px;
		height:30px;
		}
		
		#producten:hover{
		background:url(/img/menu.jpg) -133px -30px;
		}
		
		#productenAC{
		background: url(/img/menu.jpg) -133px -30px;
		float:left;
		width:133px;
		height:30px;
		}
		
		#acties{
		background:url(/img/menu.jpg) -266px 0;
		float:left;
		width:133px;
		height:30px;
		}
		
		#acties:hover{
			background:url(/img/menu.jpg) -266px -30px;
		}
		
		#actiesAC{
		background:url(/img/menu.jpg) -266px -30px;
		float:left;
		width:133px;
		height:30px;
		}

		#actueel{
		background:url(/img/menu.jpg) -399px 0;
		float:left;
		width:133px;
		height:30px;
		}
		
		#actueel:hover{
		background:url(/img/menu.jpg) -399px -30px;
		}
		
		#actueelAC{
		background:url(/img/menu.jpg) -399px -30px;
		float:left;
		width:133px;
		height:30px;
		}
		
		#links{
		background:url(/img/menu.jpg) -532px 0;
		float:left;
		width:133px;
		height:30px;
		}
		
		#links:hover{
		background:url(/img/menu.jpg) -532px -30px;
		}
		
		#linksAC{
		background:url(/img/menu.jpg) -532px -30px;
		float:left;
		width:133px;
		height:30px;
		}

		#contact{
		background:url(/img/menu.jpg) -665px 0;
		float:left;
		width:133px;
		height:30px;
		}
		
		#contact:hover{
		background:url(/img/menu.jpg) -665px -30px;
		}
		
		#contactAC{
		background:url(/img/menu.jpg) -665px -30px;
		float:left;
		width:133px;
		height:30px;
		}
		/* ------------------------------------------------ */
		
		/* ----DROP-DOWN MENU---- */
		#menuOptions ul .item {
		display: none;
		position: absolute;
		}
		
		#menuOptions ul:hover .item {
		display: inline;
		}
		
		.item {
		background: #00CCFF;
		width: 133px;
		}
		
		.item a {
		color: #fff;
		text-decoration: none;
		}
		
		#item1 .item {
		margin: 30px 0 0 -133px;
		float: left;
		}
		
		#item2 .item {
		margin: 30px 0 0 -133px;
		float: left;
		}
		
		#item2 .item li{
		float: left;
		}
		
		.list2 {
			width: 131px;
			border-bottom: 1px solid #fff;
			height: 25px;
		}

		.list2 a {
		padding: 9px;
		display: block;
		}
		
		#item3 .item {
		margin: 30px 0 0 -133px;
		float: left;
		}
		
		#item3 .item li{
		float: left;
		}
		
		#item5 .item {
		margin: 30px 0 0 -133px;
		float: left;
		}
		
		#item5 .item li{
		float: left;
		}
		
		#item6 .item {
		margin: 30px 0 0 -133px;
		float: left;
		}
		
		#item6 .item li{
		float: left;
		}
		
		.sub {
			margin: -20px 0 0 131px;
			float: left;
			background: #00CCFF;
		}
		
		.sub li {
			
		}
		
		#item2 ul .sub {
			display: none;
		}
		
		#item2 ul li:hover .sub {
			display: inline;
		}
		/* ------------------------------------------------ */
		
.list {
	width: 131px;
	border-top-width: 0px!important;
	border-right-width: 0px!important;
	border-bottom-width: 1px!important;
	border-left-width: 0px!important;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: solid;
	border-left-style: none;
	border-bottom-color: #fff;
}

.list a{
padding: 9px;
display: block;
}

.list a:hover {
	color: #000066!important;
	}
/* ------------------------------------------------------------------------------------------------------------------ */

/* ----LINKER SIDEBAR---- */
#sidebarLeft {
width: 133px;
height: 500px;
background: url(/img/sidebar_left.jpg) no-repeat;
float: left;
display: inline;
}

#sidebarLeft a.home {
margin: 20px 0 0 0;
display: block;
width: 133px;
height: 30px;
background: url(/img/button_home.jpg) top left;
}

#sidebarLeft a.home:hover {
display: block;
width: 133px;
height: 30px;
background: url(/img/button_home.jpg) top right;
}

#sidebarLeftBlauw {
width: 133px;
height: 500px;
background: url(/img/sidebar_left_blauw.jpg) no-repeat;
float: left;
display: inline;
}

#sidebarLeftBlauw a {
margin: 20px 0 0 0;
display: block;
width: 131px;
height: 30px;
background: url(/img/button_home_blauw.jpg) top left;
}

#sidebarLeftBlauw a:hover {
display: block;
width: 133px;
height: 30px;
background: url(/img/button_home_blauw.jpg) top right;
}

/* ------------------------------------------------------------------------------------------------------------------ */

/* ----CONTENT---- */
#content {
width: 665px;
height: 100%;
float: left;
display: inline;
}

#mainContent {
	width: 530px;
	background: #ffffcc;
	float: left;
	display: inline;
}

#mainContentBlauw {
	width: 530px;
	background: #0099cc;
	float: left;
	display: inline;
}

/*#mainContent p {
padding: 0 10px 20px 10px;
}*/

#mainContent h1{
padding: 0 10px;;
}

.content_list{
margin: 0 0 20px 50px;
}

.content_list li{
list-style: disc;
}

#space {
height: 20px;
width: 530px;
background: #ffcc66;
}

#title_bar_blauw {
height: 30px;
width: 530px;
background: #0099cb;
color: #FFFFFF;
}

#title_bar_oranje {
height: 30px;
width: 530px;
background: #ff9900;
color: #FFFFFF;
}

.title_left {
font-size: 16px;
padding: 4px 0 0 10px;
font-style: italic;
font-weight: bold;
float: left;
}

.title_right {
font-size: 16px;
padding: 4px 10px 0 0 ;
font-style: italic;
font-weight: bold;
float: right;
}
/* ------------------------------------------------------------------------------------------------------------------ */

/* ----RECHTER SIDEBAR---- */
#sidebarRight {
width: 133px;
height: 500px;
background: url(/img/sidebar_right.jpg) no-repeat;
float: right;
display: inline;
}

#sidebarRightBlauw {
width: 133px;
height: 500px;
background: url(/img/sidebar_right_blauw.jpg) no-repeat;
float: right;
display: inline;
}

#direct {
margin: 20px 0 0 0;
display: block;
width: 133px;
height: 30px;
background: url(/img/button_direct.jpg) top left;
}

#directBlauw:hover {
display: block;
width: 133px;
height: 30px;
background: url(/img/button_direct_blauw.jpg) top right;
}

#directBlauw {
margin: 20px 0 0 0;
display: block;
width: 133px;
height: 30px;
background: url(/img/button_direct_blauw.jpg) top left;
}

#direct:hover {
display: block;
width: 133px;
height: 30px;
background: url(/img/button_direct.jpg) top right;
}


#bekoshop {
margin: 20px 0 0 0;
display: block;
width: 133px;
height: 30px;
background: url(/img/button_bekoshop.jpg) top left;
}

#bekoshop:hover {
margin: 20px 0 0 0;
display: block;
width: 133px;
height: 30px;
background: url(/img/button_bekoshop.jpg) top right;
}

#bekoshopBlauw {
margin: 20px 0 0 0;
display: block;
width: 133px;
height: 30px;
background: url(/img/button_bekoshop_blauw.jpg) top left;
}

#bekoshopBlauw:hover {
margin: 20px 0 0 0;
display: block;
width: 133px;
height: 30px;
background: url(/img/button_bekoshop_blauw.jpg) top right;
}

#bekoVacature {
margin: 20px 0 0 0;
display: block;
width: 133px;
height: 30px;
background: url(/img/btn_right_vacature.gif) top left;
}

#bekoVacature:hover {
margin: 20px 0 0 0;
display: block;
width: 133px;
height: 30px;
background: url(/img/btn_right_vacature_roll.gif) top left;
}

		/* ----DROP-DOWN MENU---- */
		#menuRight ul .item {
		display: none;
		position: absolute;
		}
		
		#menuRight ul:hover .item {
		display: inline;
		}
		
		#item7 .item {
		margin: 0 0 0 0;
		float: left;
		}
		
		#item7 .item li{
		float: left;
		}
		/* ------------------------------------------------ */

/* ------------------------------------------------------------------------------------------------------------------ */

/* ----------------Artikelen templates---------------- */

.articleWrapper {
	clear: both;
	width: 533px;
	}

.articleTitleHolder {
	background-color: #ffcc66;
	width: 533px;
	height: 50px;
	clear: both;
	}
	
.articleTitleHolderBlauw {
	background-color: #0099cc;
	width: 533px;
	height: 50px;
	clear: both;
	}
	
.articleTitleHolder img {
	margin-top: 20px;
	}
	
.articleHolder {
	clear: both;
	width: 533px;
	margin-top: 19px;
}

.articleImage {
	float: left;
	width: 133px;
	min-height: 130px;
	display: block;
	overflow: hidden;
	}
	
.articleText {
	float: left;
	width: 390px;
	display: block;
	text-align: left;
	vertical-align: top;
}

.articleText ul {
	margin-top: 15px;
	margin-left: 25px;
	margin-bottom: 15px;
	padding: inherit;
	}
	
.articleText ul li {
	margin: auto;
	padding: 0px;
	}

.articleImage2 {
	float: left;
	width: 266px;
	min-height: 130px;
	display: block;
	overflow: hidden;
	}
	
.articleImage4 {
	float: left;
	width: 532px;
	min-height: 130px;
	display: block;
	overflow: hidden;
	}
	
.articleImage4 table {
	padding: 7px;
}
	
.articleImage4 table td {
	vertical-align: top;
	text-align: left;
	}
.articleText2 {
	float: left;
	width: 266px;
	display: block;
	text-align: left;
	vertical-align: top;
}

.boxed {
	padding: 5px;
	}

/* --------------------------------------------------- */

/* PRODUCTOVERZICHT */

.productWrapper {
	clear: both;
	height: 215px;
	margin-top: 15px;
	}
	
.productHolder {
	width: 132px;
	height: 215px;
	float: left;
	}
	
.productPhoto {
	width: 130px;
	width: 130px;
	overflow: hidden;
	clear: both;
	}

.productText {
	padding: 5px;
	clear: both;
	}
	
/* --------------------------------------------------- */

/* FORMULIEREN */

.formRow {
	clear: both;
	height: auto;
	width: 500px;
	float: left;
	margin-bottom: 10px;
	}
	
.formRow label {
	width: 130px;
	float: left;
	}
	
.formRow input {
	float: left;
	}

input.inputRadio {
	float: none;
	width: auto;
}

.formRow input.standaard {	width:270px!important; }
.formRow input.tussenvoegsel {	width: 50px!important; }
.formRow input.straat {	width: 217px!important; }
.formRow input.huisnummer {	width: 50px!important; }
.formRow input.postcode { width: 75px!important; }
.formRow input.woonplaats { width: 192px!important; }
.formRow input.geboortedag { width: 25px!important; float: none!important; }
.formRow input.geboortemaand { width: 25px!important; float: none!important; }
.formRow input.geboortejaar { width: 60px!important; float: none!important; }
.formRow textarea { width: 270px; height: 150px; }


.formRow .divRadio {
	float: left;
	width: 300px;
	}

span.required {
	color: #FF0000;
	}

/* --------------------------------------------------- */
#leveranciers { list-style:none; }
#leveranciers li h3 { font-weight:normal; font-size:12px; }
#leveranciers li { width:256px; float: left; height:90px; margin: 5px; list-style:none; }