img.bg {
	position: absolute;
	height: 100%;
	width: 100%;
	z-index: 1;
}

body {
 /* These rules have no effect on the functionality */
 /* They are for styling only */
 margin: 0;
 padding: 0;
 overflow:hidden;
 height:100%;
 width:100%;
 z-index: 0;
}


div#content-wrap {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	height: 100%;
	position:absolute;
	top: 0;
	left: 0;
	z-index: 2;
}
	div#logo-wrap {
		position:center;
		width:630px;
		height: 85px;
		margin-left:auto;
		margin-right: auto;
		z-index: 3;
	}
		div#logo {
			position: absolute;
			background: url(../images/logo-gemeenteEnschede.png); 
			top:60px;
			width:205px;
			height: 25px;
			z-index: 4;
		}
		div#logo-regio-twente {
			position: absolute;
			background: url(../images/logo-regio-twente.png); 
			margin-left:580px;
			top:55px;
			width:125px;
			height: 67px;
			z-index: 4;
		}
	div#menu {
		/* This is the only important rule */
		/* We need our content to show up on top of the background */
		background: url(../images/menu.png);
		background-position: 0 0;
		background-repeat: repeat-x;                                                   
		position: absolute;
		/* These have no effect on the functionality */
		width: 100%;
		height:58px;
		margin-top: 20%;
		margin-bottom: auto;
		padding: 0;
		font-family: serif;
		font-size: 10pt;
		line-height: 16pt;
		bottom:40px;
		z-index: 5;
	}
		div#button-wrap {
			position:center;
			width:680px;
			margin-left:auto;
			margin-right: auto;
			z-index: 6;
		}
			.button-info-container-a {
				background: url(../images/txt-toezicht.png) no-repeat;
				background-position: 0 -7px;
				position:absolute;
				height:50px;
				width:180px;
				z-index: 7;
				cursor: pointer;
			}
			.button-info-container-b {
				background: url(../images/txt-toezichthouders.png) no-repeat;
				background-position: 0 -7px;
				position:absolute;
				height:50px;
				width:290px;
				margin-left:180px;
				z-index: 7;
				cursor: pointer;
			}

			.button-info-container-c {
				background: url(../images/txt-leerwerkbedrijf.png) no-repeat;
				background-position: 0 -7px;
				position:absolute;
				height:50px;
				width:280px;
				margin-left:480px;
				z-index: 7;
				cursor: pointer;
			}
				.hoekje {
					background: url(../images/driehoekje.png);
					background-position: 0 0;
					background-repeat: no-repeat;
					position:absolute;
					height:50px;
					width:50px;
					bottom:29px;
					left:26px;
					opacity: 1;
					-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; 
					filter: alpha(opacity=100);
					z-index: 8;
				}
					.closed .hoekje {
						visibility: hidden;
					}
					.open .hoekje {
						visibility: visible;
					}
				.info-container {
					position: relative;
					background-color: #e2001a;
					padding: 0px 10px 10px 25px;
					height: 280px;
					width: 300px;
					opacity: .80;
					-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; 
					filter: alpha(opacity=80);
					bottom: 328px;
					left: 0; 
				}
					.close-me {
						width:15px;
						position: absolute;
						top:10px;
						right:10px;
						text-align: right;
						line-height: 8px;
						font-size: 8px;
						height: 15px;
						margin: 0px;
						padding: 5px 0px 0px 0px;
					}
						.close-me img {
							margin: 0px;
							padding: 0px;
							border: 0px;
						}
						.close-me a {
							color: #ffffff;
							font-weight: bold;
							line-height: 8px;
							font-size: 8px;
							margin: 0px;
							padding: 0px;
						}
					.scroll-me {
						overflow: auto;
						height: 230px;
						font-style: normal;
						font-weight: normal;
						font-size: 12px;
						font-family: sans-serif, Helvetica, Verdana, Arial;
						position: relative;  
						color: white;
						padding-top: 9px;
					}
						.scroll-me a {
							color: #ffffff;
						}
						.closed .info-container {
							visibility: hidden;
						}
						.open .info-container {
							visibility: visible;
						}

ul {
	padding-left: 20px;
}
	li {
		padding: 0px;
	}
.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 10;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
}
.jScrollPaneDrag {
	position: absolute;
	background: #ffffff;
	cursor: pointer;
	overflow: hidden;
	
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 10;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
	background: url(./../images/basic_arrow_up.gif) no-repeat;
}
a.jScrollArrowUp:hover {
	/*background-color: #f60;*/
}

a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 10;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
	background: url(./../images/basic_arrow_down.gif) no-repeat;
}
a.jScrollArrowDown:hover {
	/*background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	/*background-color: #f00;*/
}


#head_toezicht {
width:125px;
height: 34px;
background-image: url(../images/head_toezicht.png);
background-repeat: no-repeat;
background-position: bottom left;
}
#head_toezichthouders {
width:242px;
height: 34px;
background-image: url(../images/head_toezichthouders.png);
background-repeat: no-repeat;
background-position: bottom left;
}

#head_leerwerkbedrijf {
width:242px;
height: 34px;
background-image: url(../images/head_leerwerkbedrijf.png);
background-repeat: no-repeat;
background-position: bottom left;
}

	div#adreswrap {
		/* This is the only important rule */
		/* We need our content to show up on top of the background */
		color: white;
		background-position: 0 0;
		background-repeat: repeat-x;                                                   
		position: absolute;
		/* These have no effect on the functionality */
		width: 100%;
		height:35px;
		margin-top: 20%;
		margin-bottom: auto;
		padding: 0;
		font-family: sans-serif, Helvetica, Verdana, Arial;
		font-size: 9pt;
		line-height: 16pt;
		bottom:10px;
		z-index: 5;
	}
		div#adreswrap2 {
			position:center;
			width:620px;
			margin-left:auto;
			margin-right: auto;
			z-index: 6;
		}
		
		#adres {
			position:absolute;
			width:780px;
			z-index: 7;
			}

.info-frame {
	padding: 0 5px 0 0;
}