@charset "utf-8";

* {
padding: 0;
margin: 0;
}

body {
font-family: "century gothic", arial, sans-serif;
border-top: 15px solid black;
background: url("pic/top.png") repeat-x 0px 15px white;
}

#contain {
width: 700px;
margin: 0 auto;
}

/* - Hier wordt de kop gedefinieerd  - */

#head {
width: 100%;
margin: 0 auto;
padding-top: 0px;
height: 275px;
border-bottom: 3px solid #333;
border-left: 1px solid black;
border-right: 1px solid black;
background: url("pic/voorloper_logo.png") no-repeat top right white;
}

#head img {
float: left;
border: 0px solid green;
margin: 0;
padding-top: 40px;
padding-left: 75px;
}

#head h1 {
float: right;
margin-right: 90px;
color: #0099FF;
padding: 0;
margin-top: 90px;
}

#head h1 img {
padding: 0;
}

#head h2 {
float: right;
margin-right: 120px;
margin-top: 102px;
color: #666;
}

#head h2 img {
padding: 0;
}

/*  ---------- Hier wordt het menu gedefineerd ---------- */

ul.navigatie {
list-style: none;
padding-top: 3px;
padding-left: 15px;
height: 1.4em;
background: white;
}

ul.navigatie li {
float: left;
margin-right: 1.4em;
}

/*  ---------- Hier staat alle structurele informatie over de bovenkant van de pagina ("boven de vouw")  ---------- */

#contain_top {
width: 700px;
margin: 0 auto 0 auto;
padding: 25px 0 50px 0;
background: white;
}

#left_top {
padding-left: 125px;
float: left;
display: block;
background: url("pic/voorloper.gif") no-repeat 35px 25px white;

}

/* H, P en A bovenkant pagina */

#left_top h2 {
color: #8AB8FF;
}

#left_top a {
color: #B34C01;
text-decoration: none;
border-bottom: dashed 1px #B34C01;
}

#left_top a:hover {
color: #B34C01;
text-decoration: none;
border-bottom: solid 1px #B34C01;
}

#left_top a.screenshot, #left_top a.screenshot:hover {
border: 0;
}

ul.portfolio_thumbs {
list-style: none;
float: right;
}

ul.portfolio_thumbs li {
margin-bottom: 1em;
}

ul.portfolio_thumbs li h2, #right_top h2{
color: #B34C01;
}

ul.portfolio_thumbs li a {
width: 180px;
border: 0;
}

ul.portfolio_thumbs li a.txt {
font-size: 0.85em;
color: #B34C01;
text-decoration: none;
border-bottom: dashed 1px #B34C01;
}

ul.portfolio_thumbs li a.txt:hover {
font-size: 0.85em;
color: #B34C01;
text-decoration: none;
border-bottom: solid 1px #B34C01;
}

ul.portfolio_thumbs li a.portfolio1, ul.portfolio_thumbs li a.portfolio2, ul.portfolio_thumbs li a.portfolio3 {
width: 180px;
height: 135px;
display: block;
overflow: hidden;
}

ul.portfolio_thumbs li a.portfolio1 {
background: url("pic/7.png") 0px 0px no-repeat;
}

ul.portfolio_thumbs li a.portfolio1:hover {
background:url("pic/7.png") -180px 0px no-repeat;
}

ul.portfolio_thumbs li a.portfolio2 {
background: url("pic/6.png") 0px 0px no-repeat;
}

ul.portfolio_thumbs li a.portfolio2:hover {
background: url("pic/6.png") -180px 0px no-repeat;
}

ul.portfolio_thumbs li a.portfolio3 {
background: url("pic/5.jpg") 0px 0px no-repeat;
}

ul.portfolio_thumbs li a.portfolio3:hover {
background: url("pic/5.jpg") -180px 0px no-repeat;
overflow: hidden;
}

h1 {
font-weight: normal;
font-size: 2em;
color: #FFCD16;
padding-top: 75px;
}

h2 {
font-weight: normal;
text-align: left;
font-size: 1.4em;
}

h3 {
font-weight: normal;
text-align: left;
font-size: 1.25em;
}

p {
color: #271105;
font-size: 1rem;
padding-right: 8px;
line-height: 1.5rem;
}

ol {
	color: #271105;
font-size: 0.85em;
}

ol {
	list-style: none;
}

img {
border: 0;
}

img.img_rechts {
	float: right;
	padding-left: 25px;
}

img.site3 {
width: 420px;
height: 260px;
}

img.site2 {
width: 420px;
height: 262px;
}

img.site1 {
width: 420px;
height: 233px;
}

div.kader {
	border: 1px solid black;
	padding: 15px 25px;
	background: #F9F9F9;
	margin-bottom: 25px;
}
	
ul.tekst {
	padding-left: 20px;
	list-style: circle;
	padding-bottom: 5px;
}

ul.tekst li {
	padding-top: 5px;
}


#bottom {
float: left;
width: 100%;
padding-bottom: 25px;
background: black;
}

#contain_b {
	width: 700px;
	margin: 0 auto;
}
	
#left_bottom {
float: left;
background: url("pic/logo_btn.gif") no-repeat 50px 50px black;
padding-top: 50px;
padding-left: 175px;
padding-right: 60px;
}

#left_bottom h2 {
color: #D97900;
font-size: 1.6em;
font-weight: normal;
}

#right_bottom {
float: right;
padding-top: 50px;
padding-right: 20px;
}

#right_bottom h3 {
color: #D97900;
font-size: 1.6em;
font-weight: normal;
}

#left_bottom p, #right_bottom p {
color: #ccc;
line-height: 1.1rem;
}

#right_bottom ul.referenties {

color: white;
list-style: none;
}

#right_bottom ul.referenties li {
	padding-bottom: 2px;	
}

#contain_b a:link, #contain_b a:visited {
color: #ccc;
text-decoration: none;
border-bottom: 0px dashed #ccc;
}

#contain_b a:hover, #contain_b a:active {
color: white;
text-decoration: none;
border-bottom: 1px solid white;
}

.voorloper {
color: #FBAF02;
font-size: 1.1em;
}


/* ---------- Foot ---------- */

#foot {
clear: both;
background: #292929;
border-top: 1px solid #333;
padding: 5px;
padding-left: 50px;
}

#foot p {
color: #999;
}

#foot ul {
list-style: none;
}

#foot ul li {
display: inline;
}

#foot a, #map ul li a {
color: white;
text-decoration: none;
border-bottom: 1px dashed white;
}

#foot a:hover, #map ul li a:hover {
color: white;
text-decoration: none;
border-bottom: 1px solid white;
}

#map {
clear: both;
padding: 5px;
background: #292929;
border-bottom: 1px solid #333;
}

#map ul {
list-style: none;
padding-left: 1.5em;
font-size: small;
}

#map ul li {
display: inline;
padding-bottom: 0.6em;
margin-right: 5px;
color: #999;
}

#map ul li a.active {
cursor: default;
}