/******************************************************************************************************
	HTML TAGS: STANDAARD
******************************************************************************************************/
html, body {
   margin: 0;
   padding: 0;
   border: none;
   height: 100%;
}

img, fieldset {
   border: 0;
}

p, h1, h2, h3, h4, h5, h6, fieldset, form, input, select, table, tr, td {
   margin: 0;
   padding: 0;
}

ul {
	margin: 0;
	padding: 0;
	padding-left: 1em;
}

li {
	margin-left: 1em;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

td {
	vertical-align: top;
}

/******************************************************************************************************
	HTML TAGS: PROJECT-SPECIFIEK
******************************************************************************************************/
* {
	font-family: Tahoma, Arial, sans-serif;
	color: #9A9A9A;
}

body {
	background: #E1EAF5 url(../images/body_bg.png) repeat-x;
	overflow: -moz-scrollbars-vertical;
}

p, li {
	font-size: 11px;
	line-height: 15px;
}

/******************************************************************************************************
	PROJECT
******************************************************************************************************/
div#container {
	width: 1028px;
	height: 100%;
	margin: 0 auto;
}

	div#left-bg {
		height: 100%;
		background: url(../images/left_bg.png) no-repeat 3px top;
	}

		div#right-bg {
			height: 100%;
			background: url(../images/right_bg.png) no-repeat right top;
		}

			div#main {
				height: 100%;
				width: 704px;
				margin: 0 auto;
			}

				div#header {
					height: 197px;
					background: url(../images/header_bg.png) no-repeat left top;
				}

					div#header-thema {
						height: 197px;
						background-repeat: no-repeat;
						background-position: 247px top;
					}

						div#header-hoekje {
							height: 197px;
							background-repeat: no-repeat;
							background-position: right top;							
						}

				div#columns {
					min-height: 554px; height: auto !important; height: 554px;
					background: url(../images/columns_bg.png) repeat-x left top;
				}
					div#columns-overlay-left {
						min-height: 554px; height: auto !important; height: 554px;
						background: url(../images/columns_bg_left.png) repeat-y left top;
					}
				
						div#columns-overlay-left-gradient {
							min-height: 554px; height: auto !important; height: 554px;
							background: url(../images/columns_bg_left_gradient.png) no-repeat left top;
						}
					
							div#columns-overlay-right {
								min-height: 554px; height: auto !important; height: 554px;
								background: url(../images/columns_bg_right.png) repeat-y right top;
							}
				
								div#columns-overlay-right-gradient {
									min-height: 554px; height: auto !important; height: 554px;
									background: url(../images/columns_bg_right_gradient.png) no-repeat right top;
								}
								
								div#menu {
									min-height: 168px; height: auto !important; height: 168px;
									background: #F7FAFD url(../images/menu_bg.png) repeat-y top;
								}
									div#menu-gradient {
										min-height: 168px; height: auto !important; height: 168px;
										background: url(../images/menu_bg_gradient.png) no-repeat top;
									}
									
										ul#menu-items {
											margin: 0;
											padding: 0 24px 16px 14px;	
										}
										
										ul#menu-items li {
											list-style-type: none;
											font-size: 0px; /* IE fix */
											height: 20px;
										}
										
									div#menu-thema {
										height: 235px;
										background-repeat: no-repeat;
										background-position: 0 40px;
									}

								div#content {
									min-height: 515px; height: auto !important; height: 515px;
									background: #EEF4FA url(../images/content_bg.png) repeat-y top;
								}
									div#content-gradient {
										min-height: 515px; height: auto !important; height: 515px;
										background: url(../images/content_bg_gradient.png) no-repeat top;
									}
									
									div#content-main {
										padding: 0 22px 23px 33px;
									}
									
									div#content-main p {
										padding: 0 20px 0 13px;								
									}									

									div.product-top {
										min-height: 110px; height: auto !important; height: 110px;
										background: url(../images/product_top.gif) no-repeat left top;	
									}
									
									div.product-container {
										padding-top: 11px;
										min-height: 99px; height: auto !important; height: 99px;
									}
									
										div.product-hoekje {
											width: 123px;
											height: 32px;
											margin-top: -11px;
											position: absolute;
											text-align: right;
											z-index: 1;
										}
	
										div.product-fill {
											min-height: 99px; height: auto !important; height: 99px;
											background: url(../images/product_fill.gif) repeat-y left top;
										}
										
											div.product-top-fill {												
												min-height: 99px; height: auto !important; height: 99px;
												background: url(../images/product_top_fill.gif) no-repeat left 11px;
											}
									
												div.product-content {
													padding: 6px 15px 0 12px;
												}
	
												div#content-main div.product-content p {												
													font-size: 10px;
													line-height: 12px;
													color: #9A9A9A;
													padding: 0;
												}									
									
									div.product-image {
										height: 98px;
										background-repeat: no-repeat;
										background-position: left top;
										background-image: url(../images/product_bottom.gif);
									}		
				div#footer {
					height: 140px;
					background: url(../images/footer_bg.gif) no-repeat left top;
				}
				
				div#footer ul {
				   margin: 0;      
				   padding: 0;   					
				   padding-top: 51px;
					padding-left: 569px;
				}
				
				div#footer li {
				   width: 32px;
				   float: left;
				   list-style-type: none;
				   font-size: 0px; /* IE fix */   				
				   margin-left: 0;
				}
				
div.hr {
	height: 24px;
	background: url(../images/hr.gif) no-repeat right top;
	padding: 2px 0 2px 0;
}

/******************************************************************************************************
	POPUP
******************************************************************************************************/
div.popup-container {
	position: absolute;
	width: 316px;
	height: 444px;	
	left: 50%;
	top: 50%;
	margin-left: -156px;
	margin-top: -222px;
	display: none;
	z-index: 2;
	cursor: pointer;
}

td.popup-top, td.popup-right, td.popup-bottom, td.popup-left, td.popup-center {
	 background-color: #FAFCFE;
}

td.popup-top img {
	border-top: 1px solid #C3D5E9;
}

td.popup-bottom img {
	border-bottom: 1px solid #C3D5E9;
}

td.popup-left img {
	border-left: 1px solid #C3D5E9;
}

td.popup-right img {
	border-right: 1px solid #C3D5E9;
}

div.popup-hoekje {
	width: 92px;
	height: 70px;
	top: 0;
	right: 0;
	position: absolute;
	text-align: right;
}

div.popup-content {
	height: 378px;
	padding: 3px;
	background-repeat: no-repeat;
	background-position: center bottom;
}

div.popup-close {
	height: 14px;
	text-align: right;
}

div.popup-close a {
	font-size: 11px;
	color: #9A9A9A;	
	text-decoration: none;
	padding-right: 10px;
}

div.popup-image {
	height: 222px;
	vertical-align: middle;
	text-align: center;
}

div#content-main div.popup-container p {
	padding: 0;
}