/* Getting the new tags to behave - always first priority!*/
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video{ display: block; }
mark, rp, rt, ruby, summary, time{ display: inline }

/* LETTERTYPES */
@font-face {
	font-family: HelveticaNeueLTPro-Th;
	src: url('../fonts/HelveticaNeueLTPro-Th.otf');
}
@font-face {
	font-family: HelveticaNeueLTPro-Cn;
	src: url('../fonts/HelveticaNeueLTPro-Cn.otf');
}
@font-face {
	font-family: GillSansMTPro-Light;
	src: url('../fonts/GillSansMTPro-Light.otf');
}

body {
    font-family: 	Arial, Helvetica, sans-serif;
	background-image: url("../images/bg.jpg");
	background-repeat: repeat;
    padding: 		0;
    margin: 			0;
    color: 				#222;
    font-size: 		62.5%;
}

#container {
	width: 870px;
	margin: 0 auto;
	padding: 0;
	border: 1px solid yellow;	
}


header {
	display: block;
    margin: 0px auto;
	padding: 	0;
	height: 	64px;
	background-image: url("../images/top.png");
	background-repeat: repeat-x;
}

	#headerTable {
		/*display: -webkit-box; */
		/*-webkit-box-orient: horizontal; */
		display: table;
		margin: 0 auto;
		padding: 0;
		width: 870px;
	}
   #logo {
	   display: table-cell;
	   margin: 0;
	   padding:	0 0 0 30px;
	   width:161px;
	   height: 159px;
    }
	#logo_tekst {
		display: table-cell;
		margin: 0;
		padding:	0 0 0 20px;
		vertical-align: top;
	}
		#logo_tekst h1 {
			font-family: HelveticaNeueLTPro-Cn, sans-serif; 
			font-size: 22px; 
			color: white;
			
		}
		#logo_tekst h2 {
			font-family: HelveticaNeueLTPro-Cn, sans-serif; 
			font-size: 12px; 
			color: #CCC;
		}
	
 
/* HEADERS */
h1 { font-family: HelveticaNeueLTPro-Cn, sans-serif; font-size: 22px; }
h2 { font-size: 18px; }
h3 { font-size: 16px; }
h4 { font-size: 14px; }
h5 { font-size: 12px; }
h6 { font-size: 11px; }
 
h1, h2, h3, h4, h5, h6 { line-height: 0.5em; }
 

/* A HREF STYLING */

a, a:visited, a:active {
	color: #000000;
	text-decoration: none;	
}
a:hover {
	text-decoration: underline;	
}
a img {
    border: 0;
} 
 
 /* NAVIGATIE  */
 

nav {
	list-style-type: none;
    width: 870px;
  	margin: 0 auto;
    /*overflow: hidden;*/
	font-size: 12px;
    padding: 0;
	display: block;
	height: 42px;
}
 
    nav ul {
		background-image: url("../images/topmenu_bg.png");
		background-repeat: repeat-x;
		margin: -58px 0 0 250px;
		height: 42px;
        padding: 0;
		width: 590px;
    } 
    nav ul li {
        list-style: none;
        float: left;
    }
    nav a {
        display: block;		
		color: #696969;
		height: 27px;
		padding: 15px 20px 0px 20px;
		text-decoration: none;
    }
    nav a:hover {
        background-color: #696969;
		color: #FFFFFF;
		text-decoration: none;
    }
 
 
 /* SCROLLER */
 #scrollerContainer {
	 width: 870px;
	 margin: 82px auto 0;
	 background-color: white;
	 padding: 0;
}
#scroller {
	padding: 20px 0 0 0;
	height: 223px;
}
#scroller_img {
	width:		810px;
	height: 	203px;
	margin:		auto;	
}

 
 
 /* CONTENT */
#content {
	background-color: #FFF;
    width: 870px;
	margin: 0 auto;
	padding: 0;
 	display: table;
	background-image: url("../images/content_holder_bg.png");	
	background-repeat: repeat-x;
}
	#mainContent {
		display: table-cell;
		padding: 0;
		margin: 0;
	}
	aside {  
   		display: table-cell;  
	    width: 180px;
		padding:0;
		margin: 10px 0 0 0;
	}  
	
	aside ul {
        margin: 0; 
		padding: 0; 
		list-style-type: none;
		width: 168px;
    }
 
    aside ul li {
		height: 31px;
		margin: 0;
		padding: 0; 
		text-transform: uppercase;
    }
    aside ul li a, aside ul li a:visited, aside ul li a:active {
        background-image: url("../images/nav_item_bg.png"); 
		background-repeat: no-repeat;
		display: block;
		color: #ADADAD;
		text-decoration: 	none;
		font-weight: bold;
		margin: 0;
		padding: 8px 0 0 25px;	
		height: 23px;
    }
    aside ul li a:hover,  aside ul li a.current {
		color: black;
		text-decoration: 	none;
		background-image: url("../images/nav_item_bg_hover.png"); 
		background-repeat: no-repeat;
	}
	
	/* ASIDE BLOCKS */
	.block_left {
		margin: 0;
		padding: 0 10px;
	}
		.block_left h2 {
			font-family: HelveticaNeueLTPro-Cn, sans-serif; 
			font-size: 18px;
		}
		.block_left p {
			font-size: 12px;	
		}
		
	.block_right {
		border: 1px solid red;
		padding: 0 10px;	
	}
		.block_right h2 {
			font-family: HelveticaNeueLTPro-Cn, sans-serif; 
			font-size: 18px;
		}
		.block_right p {
			font-size: 12px;	
		}


article {
    text-align: justify;
	font-size: 12px;
    line-height: 1.5em;
    color: #222;
	display: block;
	width: 650px;
	margin: 0 10px 20px 10px;
	padding: 0 10px 0 0;
}

	article h1 {
		font-family: HelveticaNeueLTPro-Cn, sans-serif; 
		font-size: 18px;
	}
	article h2 {
		font-family: HelveticaNeueLTPro-Cn, sans-serif; 
		font-size: 12px;
		color: #666;
	}
	article ul {
		margin: 0 0 0 10px;
	}
	article ul.vraagtekentje li {
		list-style-image: url("../images/vraagteken.png");
	}
	article ul.vinkjes li {
		list-style-image: url("../images/vink.png");
	}
	article ul.headlines {
		margin: 0;
		padding: 0;
		list-style: none;
	}
	article blockquote {
		margin: 10px 15px 10px 40px;
		padding: 0 0 0 15px;
		border-left: 3px solid #ccc;
	}	
	time {
		font-style: italic;	
	}
	.more {
		text-align: right;	
	}
	.table {
		display: table;
	}
	.tr {
		display: table-row;
	}
	.td {
		display: table-cell;
		padding: 0 10px 10px 0;
	}
	


 
footer {
    display: 		block;	
	width:			870px;
	margin: 		0 auto;
	height: 		40px;
	text-align: 	right;
	color: 			#CCC;
	padding: 	10px 0 0 0;	
	font-size: 	10px;
}
   
hr {
    border-bottom: 0px;
    border-left: 0px;
    border-right: 0px;
    border-top: 1px dotted #d9d9d9;
}
 
.floatleft {
    float: left;
}
 
.floatright {
    float: right;
}






/* PORTFOLIO SCROLLER */
.jqGSContainer {position:relative;width:500px;}
.jqGSContainer .jqGSImgContainer{padding:0;margin:0;}
ul.scroller {padding:0;margin:0;position:relative;list-style:none;}
.jqGSContainer .jqGSImgContainer ul.scroller li{padding:0;margin:0;position:relative;float:left;}
.jqGSContainer .jqGSImgContainer ul.scroller li .jqGSLoader{width:500px;height:100%;position:absolute;}
.jqGSContainer .jqGSImgContainer ul.scroller li img{border:1px solid #ccc;}
.jqGSContainer .jqGSImgContainer ul.scroller li .jqGSTitle{visibility: hidden;}


.jqGSContainer .jqGSPagination{position:relative;width:100%;height:20px;top:5px;padding: 5px 0;}
.jqGSContainer .jqGSPagination ul{padding:0;margin:0;list-style:none;position:relative;float:right;}
.jqGSContainer .jqGSPagination ul li{padding:0;margin-right:5px;float:left;padding-right:1px;text-align:center;padding-bottom:1px;}
.jqGSContainer .jqGSPagination ul li a{padding:2px 0px;background:#999;border:1px solid #000; color: #fff;text-decoration:none;display:block;width:20px;font:10px Verdana, Arial, Helvetica, sans-serif;}
.jqGSContainer .jqGSPagination ul li a.selected{background:#fff;color:#000;border: 1px solid #000;}
.jqGSContainer .jqGSPagination ul li a:hover{background:#ccc;color:#000;border:1px solid #999;}

.jqGSImgContainer{width:500px;}




/* FORMULIEREN */
fieldset {
	border: 0px;
	padding: 5px;
}

label {    
	display: block;  /* block float the labels to left column, set a width */
	float: left; 
	width: 200px; 
	margin: 5px 0 0; /* set top margin same as form input - textarea etc. elements */
	text-align: left;
	padding-bottom: 10px;
}
form br {
	clear:left;
}
input:focus {
	background: #ffffff none repeat scroll 0 0;
	border:		1px solid #696969;
	outline: 	none;
	color:		#619e2a;
}
input:hover {
	background: #FFFFFF none repeat scroll 0 0;
	border:		1px solid #000000;
	outline: 	none;
	color:		#000000;
}
input[type="checkbox"]{
	width: 20px;
}	
input	{
	width: 		320px;
	background-color: #FFFFFF;
	border: 	1px solid #CCCCCC;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	color: 		#696969;
	font-size: 	12px;
	padding: 	2px;
}
input.submit {
	width: 250px;
	margin: 0 0 0 200px;	
	height: 40px;
	border: 0px;
}
textarea {
	width: 		320px;
	height: 	80px;
	background-color: #FFFFFF;
	border: 1px solid #CCCCCC;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	color: 		#619e2a;
	padding:	2px;
	font-size: 	12px;
	color:		#000000;
	margin-bottom: 8px;
}

textarea:hover {
	background: #ffffff none repeat scroll 0 0;
	border:		1px solid #000000;
	outline: 	none;
	color:		#696969;
}
textarea:focus {
	background: #ffffff none repeat scroll 0 0;
	border:		1px solid #000000;
	outline: 	none;
	color:		#696969;
}