/* CSS Document */

html,body {
	height:100%;
}

body,ul,li,header,nav,aside,section,article,p {
	padding:0;
	margin:0;
	border:0;
}

body {
	font-size:12px;
	-webkit-user-select:none;
    -webkit-text-size-adjust:none;
	font-family:helvetica;
	background:#232323;
}

p {
	margin-bottom:1.5em;
	line-height:150%;
}

header,nav,aside,section,article {
	display:block;
}

#page {
	width:100%; height:100%;
	position:relative;
	display:-webkit-box;
	display:-moz-box;
	display:-o-box;
	display:box;
	-webkit-box-orient:horizontal;
	-moz-box-orient:horizontal;
	-o-box-orient:horizontal;
	box-orient:horizontal;
	background:#232323;
}

#sidebar {
	width:300px;
	margin-right:1px;
	background-color:#232323;
}

#content {
	-webkit-box-flex:1;
	-moz-box-flex:1;
	-o-box-flex:1;
	box-flex:1;
	border-left:2px solid #000;
}

#sidebar, #content {
	position:relative;
	height:100%;
}

header {
	height:43px; line-height:43px;
	border-bottom:3px solid #000;
	background-color:#444;
	background-image:-webkit-gradient(linear, 0 0, 0 100, from(#1b1c20), to(#000));
	background-image:-moz-linear-gradient(top, #1b1c20, #000);
	background-image:-o-linear-gradient(top, #1b1c20, #000);
	
	color:#FFF;
	font-size:18px; font-weight:bold;
	text-align:center;
	-webkit-border-top-left-radius:0px;
	-moz-border-top-left-radius:0px;
	-o-border-top-left-radius:0px;
	border-top-left-radius:0px;
	
	-webkit-border-top-right-radius:0px;
	-moz-border-top-right-radius:0px;
	-o-border-top-right-radius:0px;
	border-top-right-radius:0px;
}

#navScroller > li {
	padding:0 10px;
	border-bottom:1px solid #000;
	height:80px; line-height:40px;
	background:#232323;
}

#contentScroller {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-o-box-sizing:border-box;
	box-sizing:border-box;
	padding:20px;
}

nav {
	position:absolute;
	top:44px; bottom:0; left:0; right:0;
	font-size:15px;
}

article {
	position:absolute;
	top:44px; bottom:0; left:0; right:0;
	font-size:15px;
	background-image:url(bg.jpg);
	background-position:center;
}

a {
	color:#0799af;
	text-decoration: none;
	font-weight: bold;
}
a:link {
	text-decoration: none;
	color:#0799af;
}
a:visited {
	color:#0799af;
}
a:hover {
	text-decoration: underline;
	color:#0799af;
}
a:active {
	text-decoration: underline;
	color:#0799af;
}
a img{
	border:0;
}

#inhoud {
	width:567px;
	height:370px;
	position:absolute;
	left: 54px;
	top: 44px;
	background-image:url(contentbg.png);
}

#inhoudtext {
	width:520px;
	height:260px;
	padding-top:80px;
	padding-left:20px;
	font-size:16px;
	color:#FFF;
}

#inhoud1 {
	width:567px;
	height:480px;
	position:absolute;
	left: 54px;
	top: 44px;
	background-image:url(aboutme.png);
}

#inhoudtext1 {
	width:520px;
	height:380px;
	padding-top:80px;
	padding-left:20px;
	font-size:16px;
	color:#FFF;
}

#inhoud2 {
	width:567px;
	height:370px;
	position:absolute;
	left: 57px;
	top: 543px;
	background-image:url(howitworks.png);
}

#inhoudtext2 {
	width:520px;
	height:260px;
	padding-top:80px;
	padding-left:20px;
	font-size:16px;
	color:#FFF;
}

#interactionvak {
	width:567px;
	height:210px;
	position:absolute;
	left: 57px;
	top: 443px;
	background-image:url(interactionbg.png);
}

#interactionvaktext {
	width:520px;
	height:210px;
	padding-top:80px;
	padding-left:20px;
	font-size:16px;
	color:#FFF;
}

#webdesignvak {
	width:567px;
	height:210px;
	position:absolute;
	left: 57px;
	top: 443px;
	background-image:url(webdesignbg.png);
}

#webdesignvaktext {
	width:520px;
	height:210px;
	padding-top:80px;
	padding-left:20px;
	font-size:16px;
	color:#FFF;
}

#photographyvak {
	width:567px;
	height:210px;
	position:absolute;
	left: 57px;
	top: 443px;
	background-image:url(photographybg.png);
}

#photographyvaktext {
	width:520px;
	height:210px;
	padding-top:80px;
	padding-left:20px;
	font-size:16px;
	color:#FFF;
}

#labyrinthvak {
	width:567px;
	height:210px;
	position:absolute;
	left: 57px;
	top: 43px;
	background-image:url(labyrinthbg.png);
}

#labyrinthvaktext {
	width:520px;
	height:410px;
	padding-top:80px;
	padding-left:20px;
	font-size:16px;
	color:#FFF;
}

#witteomlijsting {
	width:567px;
	position:absolute;
	left: 57px;
	top: 443px;
	background-image:url(witteomlijsting.png);
}

.plaatje {
	margin-left:-20px;
}


#fliesvak {
	width:567px;
	height:240px;
	position:absolute;
	left: 57px;
	top: 43px;
	background-image:url(fliesbg.png);
}

#fliesvaktext {
	width:520px;
	height:440px;
	padding-top:80px;
	padding-left:20px;
	font-size:16px;
	color:#FFF;
}

#reminderboxvak {
	width:567px;
	height:225px;
	position:absolute;
	left: 57px;
	top: 43px;
	background-image:url(reminderboxbg.png);
}

#reminderboxvaktext {
	width:520px;
	height:425px;
	padding-top:80px;
	padding-left:20px;
	font-size:16px;
	color:#FFF;
}

#zwnvak {
	width:567px;
	height:225px;
	position:absolute;
	left: 57px;
	top: 43px;
	background-image:url(zwnbg.png);
}

#zwnvaktext {
	width:520px;
	height:425px;
	padding-top:80px;
	padding-left:20px;
	font-size:16px;
	color:#FFF;
}

#jaapgelukvak {
	width:567px;
	height:225px;
	position:absolute;
	left: 57px;
	top: 43px;
	background-image:url(jaapgelukbg.png);
}

#jaapgelukvaktext {
	width:520px;
	height:425px;
	padding-top:80px;
	padding-left:20px;
	font-size:16px;
	color:#FFF;
}

#interimonderwijsvak {
	width:567px;
	height:225px;
	position:absolute;
	left: 57px;
	top: 43px;
	background-image:url(interimonderwijsbg.png);
}

#interimonderwijsvaktext {
	width:520px;
	height:425px;
	padding-top:80px;
	padding-left:20px;
	font-size:16px;
	color:#FFF;
}

#vdreevak {
	width:567px;
	height:225px;
	position:absolute;
	left: 57px;
	top: 43px;
	background-image:url(vdreebg.png);
}

#vdreevaktext {
	width:520px;
	height:425px;
	padding-top:80px;
	padding-left:20px;
	font-size:16px;
	color:#FFF;
}

#photographyvakmacro {
	width:567px;
	height:225px;
	position:absolute;
	left: 57px;
	top: 43px;
	background-image:url(photographybg.png);
}

#photographyvaktextmacro {
	width:520px;
	height:425px;
	padding-top:80px;
	padding-left:20px;
	font-size:16px;
	color:#FFF;
}