/**********************************************
 *
 * Style created by Frederik Van Everbroeck 
 * Copyright since 2010 
 *
 **********************************************/
 
html, body{
	font-family: "Lucida Grande", "Lucida Sans Unicode", lucida, sans-serif; 
	background: #4f2316;
	background: #502416;
	background: #502416 url(../images/diagonalLines.png);
	font-size: 11px;
	color: #324832;
	margin: 0px;
	padding: 0px;
}

a{
	color: #335CB3;
	text-decoration: none;
}

a:hover{
	text-decoration: underline;
}

.error{
	color: #890000;
}

img{ border: none ;}

div#wrapper{
	width: 800px;
	margin: 0px;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 20px;
}

#logo a{
	color: #DBD8C5;			
}

#logo a:hover{
	text-decoration: none;
}

#logo h1{
	font-size: 26px;
}

#menu{
	background: url(/images/menuBackground.png);
	width: 100%;
	height: 50px;
	margin: 5px 0px;
	font-weight: bold;
}

#menu ul li{
	list-style-type: none;
	float: left;
	margin: 17px 0;
	padding: 0px 25px;
	border-left: #DBD8C5 solid 1px;
}

#menu ul li:first-child{
	border: none;
}

#menu ul li a{
	text-decoration: none;
	color: #DBD8C5;	
}

.current{
	font-size: 14px;
	/* background: url(../images/menuBackgroundSelected.png); */
}

#menu ul li a:hover{
	text-decoration: underline;	
}

#banner{
	height: 182px;
	background: url(/images/bannerBackground.png);
	width: 100%;
	margin: 0px;
	padding: 0px;
	color: #fff;
}

#banner div{
	float: left;
}

#bannerLogo{
	height: 182px;
	width: 180px;
	background: url(/images/bannerLogo.png);
}

#bannerContent{
	margin-top: 32px;
	margin-left: 0px;
	border-left: #BFC5C3 3px dotted;
	padding-left: 30px;
	padding-top: 5px;
}

#bannerContent h2{
	padding: 0px;
	margin: 0px;
	font-weight: bold;
	font-size: 28px;
}

#bannerContent p{
	width: 400px;
	height: 45px;
}

#bannerContent p span{
	/*color: #335cb3;*/
	font-weight: bold;
}

#content{
	clear: both;
	background: url(../images/ajax-loader.gif) #87a984 no-repeat center center ;
	margin: 0px;
	padding: 0px;
	height: 100%;
}

#sidebanner{
	background: url(../images/sidebannerBackground.png) #87a984;
	background-repeat: no-repeat;
	width: 160px;
	min-width: 160px;
	padding: 40px 10px;
	margin: 0px;
	height: 100%;
	min-height: 150px;
	float: left;
}

#sidebanner ul{
	list-style-type: none;
	padding: 0px;
}

#sidebanner ul li{
	padding: 5px 0px;
	border-bottom: dotted 1px #B2C9B1;
}

#sidebanner ul a{
	color: #fff;
	text-decoration: none;
}

#sidebanner h3{
	color: #fff;
	padding: 5px 0px;
	margin-top: 9px;
	border-bottom: dotted 1px #B2C9B1;
}

#page{
	float: left;
	width: 560px;
	margin: 0px;
	background: #dbd8c5 url("../images/contentBackground.png") repeat-x top;
	padding: 30px 30px;
}

#page h2, h3{
	color: #679366;
}

#page h2{
	clear: both;
	font-size: 18px;
	padding-bottom: 10px;
	border-bottom: #679366 dotted 1px;
}

#page table{
	width: 100%;
}

#page table td:first-child{
	width: 25%;
	vertical-align: top;
}

#page input[type="text"]{
	width: 400px;
}

#page input[type="submit"]{
	margin-right: 15px;
	margin-top: 10px;
	padding: 6px 9px;
	text-shadow: #333 0px 1px 0px;
	background-color: #87a984;
	border: solid 1px #87a984;
	color: #fff;
}

#page textarea{
	width: 400px;
	height: 100px;
}

div.twocolumn div{
	float: left;
	width: 50%;
	margin: 20px 0px;
}

.twocolumn div h2{
	font-size: 1em !important;
	margin-right: 15px;
}



/* Profiel */
#scholen td{
	padding-top: 10px;
}

.profielFoto{
	opacity: .75;
	filter:alpha(opacity=75);
	width: 60px;
	height: 60px;
}

/* Contact */
#facebookimage{
	width: 96px;
	height: 36px;
}

#linkedinimage{
	width: 96px;
	height: 36px;

}

#captchaimage{
	padding-top: 3px;
}

#message { width:300px;margin:30px 0 0 200px; }
#message h2 { font-size:150%; color:#71b826; border-bottom: none; padding-bottom: 0px; }
#message p { color:#71b826;font-weight:bold;margin:6px 0px; }
#checkmark { position:relative;top:-55px;left:-60px; }

/* Portfolio */

.boxgrid{ 
	width: 250px; 
	height: 160px; 
	margin:10px; 
	float:left; 
	background:#161613; 
	border: solid 2px #6A8A87; 
	overflow: hidden; 
	position: relative; 
}
	.boxgrid a{
		color: #fff;
	}

	.boxgrid img{ 
		position: absolute; 
		top: 0; 
		left: 0; 
		border: 0; 
		width: 250px; 
		height: 160px;
	}
	
	.boxgrid h3{
		margin: 0px;
		padding-top: 5px;
		padding-left: 5px;
		color: #FFF;
	}
	
	.boxgrid h3 span{
		font-weight: normal;
		margin-right: 5px;
		float: right;
		color: #D0DDD0;
	}
	
	.boxgrid p{ 
		padding: 5px; 
		color:#afafaf; 
		font-weight:bold; 
		font:10pt "Lucida Grande", Arial, sans-serif; 
	}
	
.boxcaption{ 
	float: left; 
	position: absolute; 
	background: #6A8A87; 
	height: 100px; 
	width: 100%; 
	opacity: .85; 
}

.caption .boxcaption {
	top: 135px;
	left: 0;
}

/* Gallery */
#gallery, #gallery img{
	width: 560px;
	height: 380px;
	min-height: 380px;
}

#gallery { margin-bottom: 50px; } 

#galleryNav{
	margin: 0px;
	padding: 0px;
}

#galleryNav li{
	list-style-type: none;
	float: right;
	font-weight: bold;
}

#galleryNav li a, #galleryFooter{
	padding: 5px;
	text-decoration: none;
	color: #A2BEA2;
	border-bottom: #A2BEA2 2px solid;
}

#galleryNav li a:hover, .selected{
	color: #679366 !important;	
	border-bottom: #679366 2px solid !important;
}

#galleryFooter{
	float: left;
}

.loading{
	background: url(../images/ajax-loader.gif) no-repeat center center;
}


.portfolioRight{
	float: left;
	width: 150px;
	padding-left: 10px;
}

/* Vaardigheden */

.skillBegin{
	border: solid 1px #699366;
	border-right: none;
	background-color: #87A984;
	height: 10px;
	margin-right: 0px;
	float: left;
}

.skillEnd{
	border: solid 1px #699366;
	border-left: none;
	background-color: #CDDBCC;
	height: 10px;
	margin-left: 0px;
	float: left;
}

#footer{
	 clear: both; 
	 height:20px; 
	 text-align:center;
	 padding-top: 3px;
}

#footer a{
	color: #324832;
}