html 
{
	margin: 0px;
	font-family: Arial, sans-serif;
	font-size: 75%; /* Resets 1em to 12px */
	height: 100%;
	color: #555;
	vertical-align: middle;
}

img { border: none; }

h1 { color: #fbb03b; margin: 0; margin-top: 10px; font-size: 1.1em; font-weight: bold;}

h2 { color: #fbb03b; margin: 0;  margin-top: 10px; font-size: 1.2em; font-weight: bold;}

a { text-decoration: none; color: #fbb03b; }

#wrapper { margin: auto auto; margin-left: 370px; width: 800px; height: 580px; position: absolute; top: 50%; margin-top: -290px;}

#content { float: left; width: 500px;}

#person { float: left; width: 261px; height: 574px; background: transparent url('menneke.jpg') no-repeat left bottom;}

#portfolio-person { float: left; width: 261px; height: 574px; background: transparent url('menneke2.jpg') no-repeat left bottom;}

#logo a{ display: block; width: 450px; height: 65px; margin: 0 auto; margin-right: 30px; background: #fff url('header.png') no-repeat;}

#logo h1{ margin: 0; }

/*--- Menu ---*/
#nav { list-style: none; margin-bottom: 0; margin-top: 15px; height: 53px;}

#nav a { text-decoration: none; color: #808080; background: #fff url('menu.png') no-repeat; display: block; height: 15px; padding-top: 35px;}

#nav li { float: left; margin: 0px 30px 0px 30px;}

#nav li a.home { background-position:-3px 0px; }

#nav li a.portfolio { background-position: -40px 0px; }

#nav li a.about { background-position:  -78px 0px;}

#nav li a.contact { background-position: -117px 0px; }

/* menu bottom line with nav arrow */
#line, #line-home, #line-portfolio, #line-about, #line-contact { height: 5px; border-bottom: solid 1px #ccc; }

#line-home { background: #fff url('nav_pijltje.gif') no-repeat 81px bottom; }

#line-portfolio { background: #fff url('nav_pijltje.gif') no-repeat 179px bottom; }

#line-about { background: #fff url('nav_pijltje.gif') no-repeat 284px bottom; }

#line-contact { background: #fff url('nav_pijltje.gif') no-repeat 387px bottom; }

/* Content */
#text { color: #555; margin-bottom: 10px; line-height: 17px; height: 335px; padding: 4px 10px 0px 10px;}

.clear { clear: both; }

/* bottom navigation */

#bottom-nav { list-style: none; margin: 0; margin-top: 5px; padding: 0;}

#bottom-nav li { display: block; float: left; width: 150px; height: 50px; padding: 15px 0px 15px 95px;}
#bottom-nav li.portfolio { background: transparent url('bottom_nav.png') no-repeat 5px 0px; }
#bottom-nav li.contact { background: transparent url('bottom_nav.png') no-repeat 8px -96px; }
#bottom-nav li.over { background: transparent url('bottom_nav.png') no-repeat 10px -192px; }

#bottom-nav p{ margin: 0; }



/* portfolio page */
#portfolio-line { height: 10px; border-bottom: solid 1px #ccc; margin-top: -10px;}

#portfolio-wrapper { display: block; width: 500px; height: 354px; overflow: hidden;}

#portfolio-inner-wrapper { display: block; width: 500px; height: 375px; overflow-x: auto; overflow-y: hidden;}

#portfolio-inner { display: block; width: 2500px; height: 375px;}

#portfolio-item1, #portfolio-item2, #portfolio-item3, #portfolio-item4, #portfolio-item5 { height: 289px; width: 500px; float: left; }

.portfolio-content { color: #555; margin: 10px 0px 25px 0px; line-height: 18px; width: 450px; height: 289px; padding: 0px 25px 0px 25px;}

#portfolio-links { display: block; height: 30px; padding: 0px 25px 0px 25px;}

.portfolio-content h4.title { color: #fbb03b; float: left; margin: 0; margin-bottom: 5px; padding: 0; font-size: 1.0em;}

.portfolio-content span.cat { color: #777; float: right;}

.portfolio-content p { margin-top: 2px; margin-bottom: 6px;}

#portfolio-left-cover { position: absolute; width: 400px; margin-left: -378px; height: 315px;}

#portfolio-right-cover { position: absolute; width: 400px; margin-left: 478px; height: 315px; }

.imagebox { width: 450px; height: 130px; border: solid 1px #ccc; background-color: #f4f4f4; margin: 0 auto; margin-bottom: 10px; }

.imagebox img { margin: 0; padding: 0; width: 450px; height: 130px;}

span.cat { font-size: 0.9em; }

a.next { font-size: 1em; font-weight: bold; float: right; padding-right: 10px; background: transparent url('link_pijltjes.gif') no-repeat right 3px;}
a.prev { font-size: 1em; font-weight: bold; float: left; padding-left: 10px; background: transparent url('link_pijltjes.gif') no-repeat left 3px;}

ul.technieken li {background-color: #aaa; list-style: none; float: right; margin: 0px 5px 0px 5px; padding: 0px 5px 0px 5px; color: white; font-weight: bold; font-size: 0.8em;}

/* contact page */

#contact-left, #contact-right {
float: left;
width: 50%;

}

#contact-left input, #contact-right textarea {
	padding: 5px;
	width: 220px;
	font-family: Arial, sans-serif;
	font-size: 1.0em;
	border: 1px solid #fbb03b;
	background: #fff7eb;
	color: #555;
}

#contact-right textarea {
	height: 110px;
}

#contact-right textarea:focus, #contact-right input:focus {
	border: 2px solid #900;
}

input.submit-button {
	border: 0px solid #006;
    background: none;
	float: right;
	font-weight: bold;
	color: #fbb03b;
	font-size: 1.2em;
	cursor: pointer;
	font-family: Arial, sans-serif;
}

label {
	text-align: right;
	margin-right: 15px;
	width: 100px;
}