/*----------------------------------------------------------------------------------------------------------------------------------------------------------------
MENU'S
De hoofdnavigatie van deze site bevinden zich binnen de <nav> tag
We gebruiken de <dl> tag zodat er extra informatie omtrend de functionalieit kan gegeven worden
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

	/*----------------------------------------------------------------------------
	mainnav
	----------------------------------------------------------------------------*/
		dl.mainnav{}
		dl.mainnav dt{display:none; }
		dl.mainnav dt strong{}
		
		dl.mainnav dd{}
		dl.mainnav dd ol{}
		dl.mainnav dd ol li{float:left; padding:0px 20px; }
		dl.mainnav dd ol li a{font-size:109.1%; color:white; line-height:34px;   }
		dl.mainnav dd ol li.on a{color:black; }
		dl.mainnav dd ol li p{position:absolute; display:none;  top:36px; left:60px; height:30px; background:url(../images/mainnavsub.png) repeat-x top left;  -moz-border-radius-bottomleft:10px; -webkit-border-bottom-left-radius:10px;  border-bottom-left-radius:10px; -moz-border-radius-bottomright:10px; -webkit-border-bottom-right-radius:10px; border-bottom-right-radius:10px; -moz-box-shadow:3px 0px 1px rgba(0,0,0,0.7); -webkit-box-shadow:3px 0px 1px rgba(0,0,0,0.7); box-shadow:3px 0px 1px rgba(0,0,0,0.7);}
		dl.mainnav dd ol li p a{float:left; display:block; padding:0px 20px; line-height:30px;   }
		
		dl.mainnav dd ol li.on p{display:block; }
		dl.mainnav dd ol li.on p a{color:white; }

		dl.mainnav.right{float:right; }
		dl.mainnav.right dd ol li{float:right; }
		dl.mainnav.right dd ol li a{color:white; }
		dl.mainnav.right dd ol li p{position:absolute; top:36px; right:20px; left:auto;}
		dl.mainnav.right dd ol li p a{}
		
		dl.mainnav a.ico-account{padding-right:30px; background: url(../images/ico-on.png) no-repeat top right; }

/*----------------------------------------------------------------------------------------------------------------------------------------------------------------
LISTS
Opsommigen en lijsten in diverse maten en vormen
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

	/*----------------------------------------------------------------------------
	iconlist
	----------------------------------------------------------------------------*/
		.iconlist{padding:0px 0px 0px 10px; }
		.iconlist li{padding:3px 0px;}
		.iconlist li a{color:white;}
		.iconlist li a img{margin:0px 0px 0px 10px; display:inline-block; vertical-align:middle; }

	/*----------------------------------------------------------------------------
	bulletlist
	----------------------------------------------------------------------------*/
		.bulletlist{list-style:outside disc; padding:0px 0px 0px 13px; }
		.bulletlist li a{color:black;}

	/*----------------------------------------------------------------------------
	checklist
	----------------------------------------------------------------------------*/
		.checklist{}
		.checklist li{padding:5px 0px 5px 55px; position:relative; }
		.checklist li.on{background-color:#e6e6e6;  }
		.checklist li label{display:block; }
		.checklist li .label_check{position:absolute; top:5px; left:5px; }
		.checklist li em{font-size:127.3%; position:absolute; top:3px; left:30px; text-transform:uppercase; font-style:normal; }
		.checklist li span{}

/*----------------------------------------------------------------------------------------------------------------------------------------------------------------
BUTTONS
Declaratie van buttons en speciaal gestijlde links
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

	/*----------------------------------------------------------------------------
	button1
	----------------------------------------------------------------------------*/
		.button1{background-color:#606060; padding:3px 10px; border:0px; color:white; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }


	/*----------------------------------------------------------------------------
	link1
	----------------------------------------------------------------------------*/
		

/*----------------------------------------------------------------------------------------------------------------------------------------------------------------
FORM ELEMENTS
Vormgeving van form elementen zoals <input> en <textarea>
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

	/*----------------------------------------------------------------------------
	standard elements
	----------------------------------------------------------------------------*/
		textarea{width:96%; padding:10px; height:140px;  }
		.inputtext{border:1px solid #abadb3; padding:3px; }

	/*----------------------------------------------------------------------------
	checkbox
	----------------------------------------------------------------------------*/
	.label_check{ display: inline-block; cursor: pointer; height:15px; width:15px; }
	.label_check input, .label_radio input  { margin-right: 5px; }
	
	.has-js .label_check, .has-js .label_radio{}
	.has-js .label_radio{ background: url(../images/radio-off.png) no-repeat; }
	.has-js .label_check{ background: url(../images/check-off.png) no-repeat; }
	.has-js label.c_on{ background: url(../images/check-on.png) no-repeat; }
	.has-js label.r_on{ background: url(../images/radio-on.png) no-repeat; }
	.has-js .label_check input, .has-js .label_radio input { position: absolute; left: -9999px; }


/*----------------------------------------------------------------------------------------------------------------------------------------------------------------
BOXES
Gestijlde boxen die veelal hergebruikt worden en waarin zich andere objecten bevinden
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

	/*----------------------------------------------------------------------------
	aboutbox
	----------------------------------------------------------------------------*/
		.aboutbox{font-family: 'Consolas'; text-align:right; }
		.aboutbox span.punten{font-size:109.1%; margin:-3px 0px 0px 0px; display:block; }
		.aboutbox h3{font-size:163.6%; }
		.aboutbox p{font-size:145.5%; }
		
	/*----------------------------------------------------------------------------
	contentbox
	----------------------------------------------------------------------------*/
		.contentbox{color:black; overflow:hidden;  padding:17px;  background-color:#ffffff; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; }
		.contentbox.alt{background-color:#cccccc; }

		.contentbox.clickable{padding:5px 10px; margin:0px 0px 3px 0px; }
		.contentbox.clickable .content{display:none; padding:10px 15px; }
		.contentbox.clickable.on .content{display:block; }
		
		.contentbox.clickable h1{padding:0px 0px 0px 0px; }
		.contentbox.clickable h1 a{padding:0px 0px 0px 15px; color:black; display:block; background: url(../images/ico-contentbox.png) no-repeat center left; }
		.contentbox.clickable.on h1 a{background: url(../images/ico-contentbox-on.png) no-repeat center left; }
		
	/*----------------------------------------------------------------------------
	extrabox
	----------------------------------------------------------------------------*/
		.extrabox{background-color:#303030; padding:15px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; -moz-box-shadow:3px 0px 1px rgba(0,0,0,0.7); -webkit-box-shadow:3px 0px 1px rgba(0,0,0,0.7); box-shadow:3px 0px 1px rgba(0,0,0,0.7);}

		.extrabox.examenvragen{width:170px; padding:35px; font-size:127.3%; position:absolute; top:360px; left:200px;  }
		.extrabox.examenvragen .arrow{width:152px; height:190px; position:absolute; top:-200px; right:-120px; background: url(../images/extrabox-arrow.png) no-repeat top left;  }
		
		.extrabox.login{width:300px; position:absolute; top:90px; right:100px;  }

/*----------------------------------------------------------------------------------------------------------------------------------------------------------------
OBJECTS
Objecten die meestal uit een verzameling van diverse tags bestaan en 1 object vormen (vb. tagcloud)
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

	/*----------------------------------------------------------------------------
	bimg
	----------------------------------------------------------------------------*/
		.bimg{height:auto; min-height:100%; min-width:1024px; position:fixed; top:0px; width:100%;}
		
	/*----------------------------------------------------------------------------
	formnav
	----------------------------------------------------------------------------*/
		.formnav{background-color:#cccccc; height:27px; margin:17px -17px -17px -17px; position:relative;  -moz-border-radius-bottomleft:10px; -webkit-border-bottom-left-radius:10px;  border-bottom-left-radius:10px; -moz-border-radius-bottomright:10px; -webkit-border-bottom-right-radius:10px; border-bottom-right-radius:10px; }
		
		.formnav .prev{position:absolute; top:0px; left:0px; width:50%; display:inline-block; height:27px; line-height:27px; border-right:1px solid #ffffff; }
		.formnav a{color:black;}
		.formnav .prev a{display:block; padding:0px 0px 0px 20px; margin:0px 0px 0px 15px;  background: url(../images/ico-arrow-white-left-on.png) no-repeat center left; }
		.formnav .prev.off a{filter:alpha(opacity=20); opacity:0.2; }
		
		.formnav .next{position:absolute; top:0px; right:0px; width:50%; text-align:right;  display:inline-block; height:27px; line-height:27px; }
		.formnav .next a{display:block; padding:0px 20px 0px 0px; margin:0px 15px 0px 0px;  background: url(../images/ico-arrow-white-right-on.png) no-repeat center right; }
		.formnav .next.off a{filter:alpha(opacity=20); opacity:0.2; }

		.formnav .check{display:block; text-align:center; }
		.formnav .check a{display:inline-block; padding:0px 130px; z-index:100; position:relative;  background-color:#cccccc;  border-right:1px solid #ffffff; border-left:1px solid #ffffff; height:27px; line-height:27px;}

	/*----------------------------------------------------------------------------
	pages
	----------------------------------------------------------------------------*/
		.pages{position:relative; height:35px; }
		.pages div{width:620px; height:35px; overflow:hidden; position:absolute; top:0px; left:25px; }
		.pages p{position:absolute; top:0px; left:0px; width:100%; font-family: 'Consolas'; overflow:hidden;  }
		.pages p a{font-size:163.6%; display:block; float:left; padding:0px 8px; color:white; background: url(../images/pages.png) repeat top left; }
		.pages p span{display:inline-block;  margin:0px 5px 0px 0px; }
		.pages p span a:first-child{-moz-border-radius-topleft:10px; -webkit-border-top-left-radius:10px;  border-top-left-radius:10px; -moz-border-radius-bottomleft:10px; -webkit-border-bottom-left-radius:10px;  border-bottom-left-radius:10px;}
		.pages p span a:last-child{-moz-border-radius-topright:10px; -webkit-border-top-right-radius:10px;  border-top-right-radius:10px; -moz-border-radius-bottomright:10px; -webkit-border-bottom-right-radius:10px;  border-bottom-right-radius:10px;}
		.pages p a.reading{background-color:black; }
		.pages p a.answered{color:#5a7387; }
		
		.pages .prev{position:absolute; top:3px; left:0px; width:16px; height:14px; display:block; text-indent:-4000px; overflow:hidden; background: url(../images/pages-prev.png) no-repeat top left;  }
		.pages .next{position:absolute; top:3px; right:0px; width:16px; height:14px; display:block; text-indent:-4000px; overflow:hidden; background: url(../images/pages-next.png) no-repeat top left;  }
		.pages .off{filter:alpha(opacity=20); opacity:0.2;}

	/*----------------------------------------------------------------------------
	progress
	----------------------------------------------------------------------------*/
		.progress{text-align:center; }
		.progress .time{}
		.progress .questions{}
		
		.progress time{display:block; margin:0px 0px -4px 0px; }
		.progress time img{ vertical-align:middle;}
		
		.progress .bar{display:block; text-align:left; height:1px; width:100%; background-color:#cbcbcb; margin:7px 0px;  }
		.progress .bar em{display:block; height:1px; width:100%; background-color:#656565; }
		
		
	/*----------------------------------------------------------------------------
	hr
	----------------------------------------------------------------------------*/
		.hr{border-bottom:1px solid #d9d9d9; margin:0px 0px 15px 0px; padding:15px 0px 0px 0px; position:relative; }
		.hr.text{border-bottom:1px solid #989898; }
		.hr.text span{display:block; text-align:center; position:absolute; top:8px; left:0px; width:100%;}
		.hr.text span em{background-color:#303030; display:inline-block; text-align:center; padding:0px 10px; color:#989898; }

/*----------------------------------------------------------------------------------------------------------------------------------------------------------------
TABLES
De tabellen gebruikt in deze site
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

	/*----------------------------------------------------------------------------
	table1
	----------------------------------------------------------------------------*/
		.table1{}
		.table1 th{text-align:right; padding:3px 10px;}
		.table1 td{padding:3px 10px;}