/**************************************************************
	DE GLOBALE RESET VOLGT NU
 **************************************************************/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend { 
margin: 0; 
padding: 0; 
border: 0; 
outline: 0; 
font-weight: inherit; 
font-style: inherit; 
font-size: 100%; 
font-family: inherit; 
vertical-align: baseline; 
}
/********************************************************************/
/*Reset table elements apart om tiny mce de mogelijkheid te geven,  */
/*wel een border te gebruiken									    */
/********************************************************************/
table, caption, tbody, tfoot, thead, tr, th, td 
{
margin: 0; 
padding: 0; 
outline: 0; 
font-weight: inherit; 
font-style: inherit; 
font-size: 100%; 
font-family: inherit; 
vertical-align: baseline; 	
}
tbody tr td
{
	text-align:left;
	vertical-align:top;
}
span h3 p
{
	height:45px!important;
	overflow:hidden;
}
strong
{
	font-weight:bold;
}
em
{
	font-style:italic;
}
sup 	
{
    font-size: smaller;
    vertical-align: baseline;
    position: relative;
    bottom: 0.33em;	
	 }
sub 	
{
	font-size: smaller;
    vertical-align: baseline;
    position: relative;
    bottom: -0.25em;
	 }

div /* BELANGRIJK ! */
{
	font-size:12px;
	color:#555;
}
.clear
{
	clear:both;
	display:block;
	height:10px;

}
/*************************************************************
	V A L I - D totha A totha T totha IONAAAAAH biatch !!
  *************************************************************/

.validation-failed, .validation-advice
{
	float:left;
	color:#FF0000;
}
input[type='text'].validation-failed{
	background:#fffabf;
	border:1px solid red;
}


/**************************************************************
   All page content except for footer
 **************************************************************/

#content 
{
  position:relative;
  height: auto !important;
  height: 100%;
  min-height: 100%;
  margin-top:28px;
}
#contentVlak
{
	margin-left:11px;
	/* margin-top:25px; */
	width:880px;
}
.alert
{
	border:1px solid #C14A46;
	background:#F1F1F1;
	color:#666;
	text-align:center;
	height:25px;
	display:block;
	padding-bottom:5px;
	width:302px;
}
.info
{
	border:1px solid #118BE1;
	background:#F1F1F1;
	color:#666;
	text-align:center;
	height:auto;
	display:block;
	padding-bottom:5px;
	width:302px;
	float:left;
}

.lijntjeLinks
{
	float:left; 
	display:block; 
	width:315px; 
	min-height:160px;
	padding-left:25px;
	border-left: solid 1px #EAEAEA;
}
/**************************************************************
   Top menu and logo
 **************************************************************/

#content #header {
	position: relative;
	height: 28px;
	margin: 0 auto;
	background : url("/Content/Images/headerBg.jpg"); 
	text-align:right;
}

/************************************ BLA 2 */
	ul {
	list-style-position:inside;
	list-style-type:disc;
	}
	ul.modulecontent {
	list-style-type:none;
	margin:0px;
	padding:0px;
	width: 300px;
	}
	ul.modulecontent li {
	display:inline;
	float:left;
	height:35px;
	margin:15px 0px 0px;
	padding-top: 5px;
	position:relative;
	}
	ul.modulecontent li a {
	background:#E7F3FC none repeat scroll 0%;
	border:1px solid #000000;
	color:white;
	display:block;
	font-family:Verdana;
	font-size:15px;
	/*
    font-size-adjust:none;
	font-stretch:normal;
	font-style:normal; */
	font-variant:normal;
	font-weight:bold;
	height:35px;
	line-height:normal;
	padding:5px;
	text-decoration:none;
	width:275px;
	}
	ul.modulecontent li a:hover {
	background:#dbe9f3 none repeat scroll 0%;
	}
	ul.modulecontent img, span img {
	border:medium none;
	}
	ul.modulecontent span.picture {
	display:block;
	float:left;
	height:30px;
	margin-right:3px;
	width:35px;
	}

	ul.modulecontent .h3 {
	border-bottom:1px solid #FFFFFF;
	margin-bottom:2px;
	margin-left:63px;
	}


/************************************ BLA */

#horizontalcssmenu{
	padding-right:15px;
}
.horizontalcssmenu{
	text-align:center;
	width:920px;
	height:28px;
	
}
.horizontalcssmenu ul{
margin: 0;
padding: 0;
list-style-type: none;
float:right;
height:27px;
margin-top:1px;
margin-bottom:1px;
}

/*Top level list items*/
.horizontalcssmenu ul li{
margin:0;
padding:0;
position: relative;
display: inline;
height:26px;
float:left;
background:#94C3E9;
}


/*Top level menu link items style*/
.horizontalcssmenu ul li a{
display: block;
width: 83px; /*Width of top level menu link items*/
padding: 3px 0 4px 0;
border-right: 0px solid white;
 background : url("/Content/Images/submenu1.gif"); 
text-decoration: none;
color: white;
font: bold 12px Verdana;
float:left;
border-right:1px solid #FFF;
text-transform: uppercase;
}

.horizontalcssmenu ul li a.last
{
	border-right:0;
}
.horizontalcssmenu ul li a:hover{
	padding: 3px 0 4px 0;
	margin:0;
	height:19px;
    background:url("/Content/Images/submenu2.gif");
	background-repeat:repeat-x;
	background-position:center 0px;
}
.horizontalcssmenu ul li.current a{
	padding: 4px 0 4px 0;
	margin:0;
	height:20px;
    background:url("/Content/Images/submenu2.gif");
	background-repeat:no-repeat;
	background-position:center 0px;
}

/******************************************** BUTTONBAR */
.horizontalcssmenuBalk{
	text-align:center;
	width:920px;
	height:28px;
	
}
.horizontalcssmenuBalk ul{
margin: 0;
padding: 0;
list-style-type: none;
float:right;
height:178px;
margin-top:1px;
margin-bottom:1px;
}

/*Top level list items*/
.horizontalcssmenuBalk ul li{
	margin:0;
	padding:0;
	position: relative;
	display: inline;
	height:178px;
	width:205px;
	float:left;
	margin-right:20px;
}


/*Top level menu link items style*/
.horizontalcssmenuBalk ul li a{
	display: block;
	width: 85px; /*Width of top level menu link items*/
	padding: 3px 0 4px 0;
	text-decoration: none;
	color: white;
	font: bold 15px Verdana;
	float:left;
}
.horizontalcssmenuBalk ul li a.last
{
	border-right:0;
}
.horizontalcssmenuBalk ul li a:hover{
	padding: 3px 0 4px 0;
	margin:0;
	height:19px;
}
.horizontalcssmenuBalk ul li.current a{
	padding: 4px 0 4px 0;
	margin:0;
	height:20px;
    background:url("/Content/Images/submenu2.gif");
	background-repeat:no-repeat;
	background-position:center 0px;
}


/*** END **************/


#header img {
  position: absolute;
  top: 5%;
  left: 10px;
}

/**************************************************************
   KNOPPEN 
 **************************************************************/

#knoppen{
    height:190px;
    width:920px;
    float:left;
    background:#FFF;
    margin-left:3px;
}
#lijntje
{
	display:block;
	height:1px;
	width:880px;
	float:left;
	margin-left:10px;
	background:#EAEAEA;	
}
#knoppen a
{
	width:220px;
	background:#FFF;
}
#knoppen a:hover
{
	background:#FFF;
	width:220px;
	
}
#knop{
    width:230px;
    height:220px;
    float:left;
    cursor:pointer;
}
.buttonBar
{
	width:205px;
    height:178px;
}
.modules{
    background:url("/Content/Images/index_08.jpg");
}
.mediatheek{
    background:url("/Content/Images/index_09.jpg");
}
.nieuws{
    background:url("/Content/Images/index_10.jpg");
}
.zoeken{
    background:url("/Content/Images/index_11.jpg");
}
.login{
    background:url("/Content/Images/index_12.jpg");
}

/**************************************************************
   Header Image/Flash Movie
 **************************************************************/

#headerImg {
  clear:both;
  margin: 0 auto;
  height: 240px;
  cursor:pointer;
}
#header1{
  display:block;
  width:218px;
  height: 240px;
  background: url("/Content/Images/header1.jpg") no-repeat top left;
  float:left;
  cursor:pointer;
}
#header2{
  display:block;
  height: 240px;
  width: 352px;
  background: url("/Content/Images/header2.jpg") no-repeat top left;
  float:left;
}
#header3{
  display:block;
  background:yellow;
  height: 240px;
  width:340px;
  background: url("/Content/Images/header3.jpg") no-repeat top left;
  float:left;
}


/**************************************************************
   Page Content
 **************************************************************/

	/**************************************************************
	   Page HOME Content -- onder de buttonbar
	 **************************************************************/
	#leftHome
	{
		display:block;
		width:415px;
		height:146px;
		float:left;
		padding-right:20px;
		overflow:hidden;
	}
	#seperatorHome
	{
		display:block;
		float:left;
		width:10px;
		height:146px;
		background:url('/Content/images/between.jpg');
		background-repeat:repeat-y;
	}
	#rightHome
	{
		display:block;
		width:415px;
		height:146px;
		float:left;
		padding-left:20px;
		overflow:hidden;
	}
	
	/***************************************************************
		Page MODULES
	****************************************************************/
	ul.modulesoverzicht {
		list-style-type:none;
		margin:0;
		padding:0;
		height:60px !important;

	}
	ul.modulesoverzicht li {
		display:inline;
		float:left;
		height:60px !important;
		margin:0px;
		padding:0px 4px 10px 0;
		position:relative;
		overflow:hidden;
	}
	ul.modulesoverzicht li a {
		background:#6692A2 none repeat scroll 0%;
		border:1px solid #000000;
		color:#FFF;
		display:block;
		font-family:Verdana;
		font-size:14px;
		font-weight:bold;
		height:60px;
		line-height:normal;
		padding:2px;
		text-decoration:none;
		width:283px;
		overflow:hidden;		/* dit is nodig !! */
		line-height:11.6px;		/* dit is nodig !! */
	}
	
	ul.modulesoverzicht li a:hover {
	background:#CCDBE0 none repeat scroll 0%;
	color:#FFF;
	}
	ul.modulesoverzicht img, span img {
	border:medium none;
	}
	ul.modulesoverzicht span.picture {
	display:block;
	float:left;
	height:60px;
	margin-right:3px;
	width:60px;
	}
	ul.modulesoverzicht p {
	font-size:9px;
	}

	ul.modulesoverzicht h3 {
	border-bottom:1px solid #FFFFFF;
	margin-bottom:2px;
	margin-left:63px;
	color:#FFF;
	}

.printah
{
	margin:0;
	padding:0;
	width:880px;
	text-align:right;
	display:inline;
	float:right;
}

	h1.paginaHeaderModule{
	font-variant:small-caps;
	color:#4AA6EC;
	font-weight:bold;
	padding:0;
	margin:0;
	}
	

#loadingOverlay
{
position: absolute;
z-index: 10000;
margin:0pt auto;
min-width:999px;
width:999px;
height: 100%;
cursor: progress;
display: none;
overflow:hidden;
}
.nextVraag, .backOverzicht
{
	display:inline;
	margin:20px 10px 10px 0;
	border:1px #CCC solid;
	height:20px;
	background:#EAEAEA;
	padding:3px;
	float:left; 
}
.correct{
	display:block;
	margin:5px 0px 10px 0;
	border:1px #4FC026 solid;
	height:45px;
	background:#c0ffb8;
	padding:3px;
	padding-bottom:0;
	font-weight:bold;
	height:auto;
}
.incorrect{
	display:block;
	margin:5px 0px 10px 0;
	border:1px #FF0000 solid;
	height:45px;
	background:#ffb4b4;
	padding:3px;
	padding-bottom:0;
	font-weight:bold;
	color:#FFF;
	height:auto;
}

.toelichting
{
	display:block;
	margin-top:5px;
	height:20px;
	background:transparent;
	padding-top:0;
	height:auto;
}
.completed
{
	display:block; 
	height:20px; 
	margin:10px 10px 10px 0;
	border:1px solid #CCC; 
	background:#f8ffcb;
	padding:3px;
}
#page {
 position:absolute;
 top:280px;
 right:0;	
 clear: both;
 float: left;
 width: 100%;
 text-align: left;
 display:block;
 padding:0;
 padding-bottom:30px;
}

#adminmenu
{
	float:left;
	width:236px;
	display:block;
	margin-top:25px;
	/* border-right:1px #666 solid; */
	height:400px;
	margin-right:10px;

}
#adminmenu ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
	float:left;
	height:27px;
	margin-top:1px;
	margin-bottom:1px;
	margin-left:20px;
}
#adminmenu ul li{
	display: block;
	width:200px;
	background:url(/Content/Images/folder_edit.png);
	background-repeat:no-repeat;
	padding-left:20px;
}

#columns,#knoppenItems {
  margin: 0 auto;
  display:block;
}

/* Column widths */
.width {
  width: 920px;
  height:240px;
}
.widthKnoppen {
  width: 920px;
  height:200px;
}
.widthMenu {
  width: 920px;
  height:28px !important;
}

.widthPad {
  width: 920px;
  min-height:150px;
  height:auto;
  display:block;
}
.widthPadFooter {
  width: 920px;
  min-height:68px;
  height:auto;
  display:block;
}

.width10 {
  width: 17%;
}

.width25 {
  width: 20%;
}

.width50 {
  width: 60%;
}

.width73 {
  width: 73%;
}

.width75 {
  width: 75%;
}

.width100 {
  width: 100%;
}


	/**************************************************************
	   Footer
	 **************************************************************/


	#footer 
	{
		position:fixed;
		bottom:0;
		width:880px;
		height:38px;			/* Height of the footer */
		background:#FFF; /* hier moet nog de juiste kleur etc voor bedacht worden */
		background:url("/Content/images/bgfooter.jpg");
		background-repeat:repeat-x;
		text-align:center;
		color:#777;
		margin-left:11px;
		font-family:Verdana;
		font-size:11px;
		padding-top:30px;
		display:block;
	}
	#footer a
	{
		color:#4aa6ec;
		text-decoration:underline;
		font-weight:normal;
	}


/**************************************************************
   Icons specific to the colour theme
 **************************************************************/

a.lightTheme img,
a.darkTheme img,
a.submitButton img {
  width: 20px;
  height: 20px;
  vertical-align: middle;
}

a.lightTheme img {
  background: url(../images/icons/light_light_theme.gif) no-repeat center center;
}

a.darkTheme img {
  background: url(../images/icons/light_dark_theme.gif) no-repeat center center;
}

a.submitButton img {
  background: url(../images/icons/light_submit.gif) no-repeat center center;
}


/**************************************************************
   Posts
 **************************************************************/
#post{
    width:100%;
    height:100%;
    font-family:Tahoma;
    font-size:12px;
    color:#777;
    line-height: 130%;
}
#post1{
    float:left;
    width:425px;
    padding:0px 20px 0px 20px;

}
#post2{
    float:left;
    width:415px;
    padding:0px 20px 0px 10px;    
}

.post {
  float: left;
  width: 100% !important;
  width: 99%;
  position: relative;
  margin-top:15px;
  margin-bottom: 1.0em;

  /* border-bottom: 1px solid #CCCCCC; */
}

.post .date {
  position: absolute;
  top: 0;
  left: 5px;

  width: 2.3em;
  text-align: left;
}

.post .date .month {
  text-transform: uppercase;
  font: 700 1.0em arial, sans-serif;
  color: #888;
}

.post .date .day {
  display: block;
  margin-top: -5px;
  font: 700 2.1em arial, sans-serif;
  color: #888;
}

.post .title {
  display: block;
  padding: 0 0 5px 0;

  font-size: 1.2em;
  font-weight: bold;
  color: #586B7A;
}

.post p {
  margin: 0 0 0 3.5em;
  padding:  0 0 1em 1.2em;
  border-left: 1px solid #CCCCCC;
}



/**************************************************************
   Thumbnail Lists
 **************************************************************/

ul.thumbs,
ul.thumbs li {
  margin: 0;
  padding: 0;
}

ul.thumbs li {
  margin: 0 0 15px 0 !important;
  margin: 0;
  padding: 0px;
  list-style: none;
}

a.thumb img {
  
  border: 5px solid #ccc;
}

a:hover.thumb img {
  background: #8EB4C6;
  border: 5px solid #668FA3;
}

a:hover.thumb {
  background: none;
}

a.thumb span {
  display: block;
  margin-top: -5px !important;
  margin-top: -2px;
}



/**************************************************************
   Submenu Styles
 **************************************************************/

ul.submenu1,
ul.submenu2 {
  margin: 0 0 20px 0;
  padding: 0;
}

ul.submenu1 li,
ul.submenu2 li{
  margin: 0;
  padding: 0;
  list-style: none;
  list-style-image: url(foo.gif); /* because IE is balls */
}

ul.submenu1 li a,
ul.submenu2 li a {
  display: block;
  height: auto !important;

  /* Start hide from IE Mac \*/
  height: 1%;
  /* End hide from IE Mac */

  padding: 1px 5px 1px 20px;
}

ul.submenu1 li a {
  background: url("/Content/Images/submenu1.gif") no-repeat 5px 50%;
}

ul.submenu1 a:hover {
  color: #426F85;
  background: #B3C6C4 url("/Content/Images/submenu1.gif") no-repeat 5px 50%;
}

ul.submenu2 li a {
  color: #426F85;
  background: url(../images/bg/submenu2.gif) no-repeat 3px 50%;
}

ul.submenu2 a:hover {
  color: #426F85;
  background: #B3C6C4 url(../images/bg/submenu2.gif) no-repeat 3px 50%;
}






/**************************************************************
   Generic Display 
 **************************************************************/


.block {
  display: block;
}

.clear {
  clear: both;
}

.marginRight {
  margin-right: 15px;
}

.paddingLeft {
  padding-left: 5px;
}

.paddingRight {
  padding-right: 5px;
}

.floatLeft {
  float: left;
}

.floatRight {
  float: right;
}

.alignLeft {
  text-align: left;
}

.alignRight {
  text-align: right;
}

.alignTop {
  vertical-align: top;
}

.alignMiddle {
  vertical-align: middle;
}

.alignBottom {
  vertical-align: bottom;
}

.lightBlueBg {
  background-color: #EAF2F5;
}

.dark {
  color: #353E47;
}