body {
		margin: 0; margin-top: 10px;
		font: 12px Trebuchet MS, sans-serif;
		text-align: center;
		color: #fff;
		background: #abcfe7;
		}		

table {
			font: 12px Trebuchet MS, sans-serif;
			}

div.error {
	color: Red;
	font-size: 80%;
	font-weight: bold
}
/*** style for common elements ***/

a {
	color: #fff;
	}
	
		a:hover {
				text-decoration: none;
				}
	
input, select, textarea {
		font: 12px Trebuchet MS, sans-serif;
		color: #cc0000; 
		}

col {
		background: none;
		}

acronym {
		cursor: help;
		}								

.submit {
		padding-right: 40px;
		text-align: right;
		}

.button {
		width: 120px;
		color: #cc0000;
		font-weight: bold;
		border-top: white 1px solid;
		border-right: gray 1px solid;
		border-left: white 1px solid;		
		border-bottom: gray 1px solid;		
		background: white;
		}

.cv {
	width: 80px;
	}

.scrollbar_white {
		scrollbar-3dlight-color: #d52820;
		scrollbar-arrow-color: #d52820;
		scrollbar-base-color: #fff;
		scrollbar-darkshadow-color: #fff;
		scrollbar-face-color: #fff;
		scrollbar-highlight-color: #fff;
		scrollbar-track-color: #fff;
		scrollbar-shadow-color: #fff;
		}

.clsinvalid {
		background: #ece8e8;
		}

.png {
		position: absolute; 
		right: 0; top: 0;		
		behavior: url(iepngfix.htc);
		}				

.videobutton {
	border: none;
}

/* make content scrollable */
.scroll {
		max-height: 580px;
		overflow-y: auto;
}

	/* set max-height for IE6 */
	* html .scroll {
			height:expression(this.scrollHeight > 580? "580px" : "auto");	
			}

/*** style for headers ***/

h1 {
		font-size: 14px;
		}

h2 {
		margin: 0; padding-left: 15px;
		font-family: Impact, sans-serif;
		font-size: 25px;
		text-transform: uppercase;
		letter-spacing: 1px;
		}

h3 {
		margin: 0;
		font-size: 14px;
		}		

/*** style for main table ***/

#main {
		position: relative;
		overflow: hidden;
		margin: 0 auto; padding: 0;
		width: 976px; height: 600px;
		text-align: left;
		border: solid 1px #fff;
		}
		
/*** style for page ***/

.afaf8c {
		background: #afaf8c;
		}

.d7d764 {
		background: #d7d764;
		}		

#page {
		position: relative;
		overflow: hidden;
		margin: 0 auto; margin-top: 20px; padding: 0;
		width: 976px; height: 710px;
		text-align: left;
		font: 13px Trebuchet MS, sans-serif;
		border: solid 1px #fff;
		}

		#pagebg {
				width: 933px; height: 658px;
				behavior: url(iepngfix.htc);
				z-index: 1;
				background: url('../Webmasters/Images/bg_template01.png') no-repeat;
				}

		#page h1 {
				margin-bottom: 5px;
				font-family: Impact, sans-serif;
				font-size: 36px;
				text-transform: uppercase;
				letter-spacing: 1px;
				}						

#text {
		position: absolute;
		left: 10px; top: 57px;
		z-index: 998;
		overflow: auto;
		width: 545px; height: 238px;
		}

		#text p {
				margin: 0;
				}

.buttons {
	position: absolute;
	bottom: 12px;
	right: 10px;
	width: 250px;
	text-align: right;
}

	.buttons a {
		margin-left: 10px;
	}
	
/*** style for homemenu ***/

#homemenu {
		position: absolute;
		left: 10px; top: 300px;
		z-index: 999;
		margin: 0; padding: 0;
		width: 191px!important; width: 365px; height: 234px!important; height: 238px;
		font-family: Impact, sans-serif;
		font-size: 24px;
		text-transform: uppercase;
		letter-spacing: 1px;		
		list-style: none;
		}

		#homemenu a {
				text-decoration: none;
				}

				#homemenu a:hover {
						color: #ece537;
						}						
		
/*** style for contentmenu ***/

#contentmenu {
		position: absolute;
		right: 45px; top: 0;
		z-index: 998;
		overflow: auto;
		width: 365px; height: 292px;
		list-style: none;
		}

		#contentmenu h1 {
				margin-left: 10px; margin-bottom: 0;
				font-size: 22px;
				}

		#contentmenu ul {
				width: 280px;
				margin: 0; padding: 0;
				font-weight: bold;
				font-size: 16px;
				list-style: none;
				}

				#contentmenu li a {
						display: block;
						padding-left: 30px;
						height: 19px;
						text-decoration: none;
						background: url('../Webmasters/Images/bullet_min.gif') no-repeat;
						}

						#contentmenu li a:hover {
								color: #ece537;
								}					

						#contentmenu li a.plus {
								background: url('../Webmasters/Images/bullet_plus.gif') no-repeat;
								}

						#contentmenu li a.active {
								background: url('../Webmasters/Images/bullet_arrow.gif') no-repeat;
								}

						#contentmenu li a img {
								margin-left: 3px;
								border: none;
								}								

				#contentmenu li ul {
						margin-left: 30px;
						width: auto;
						}

						#contentmenu li ul li a {
								display: block;
								padding-left: 14px;
								height: 19px;
								text-decoration: none;
								background: url('../Webmasters/Images/bullet_min.gif') -16px no-repeat;
								}

						#contentmenu li ul li a.active {
								background: url('../Webmasters/Images/bullet_dot.gif') -14px no-repeat;
								}																															

/*** style for back and forward ***/

.back, .forward {
		position: absolute;
		left: 452px; top: 2px;
		display: block;
		width: 30px; height: 30px;
		background: url('../Webmasters/Images/back.gif') no-repeat #abcfe7;
		}

		.forward {
				left: 484px;
				background: url('../Webmasters/Images/forward.gif') no-repeat #abcfe7;
				}		
		
		.back span, .forward span {
				display: none;
				}

/*** style for pagecontainer ***/

#pagecontainer {
		position: absolute;
		left: 48px; top: 388px;
		overflow: hidden;
		width: 882px; height: 268px;
		}
				
/*** style for pagemenu ***/

#pagemenu {
		margin: 0; padding: 0;
		width: 516px; height: 30px;
		font-size: 20px;
		list-style: none;
		border: solid 2px #fff; border-right: 0; border-left: 0;
		}

		#pagemenu li {
				float: left;
				border-right: solid 2px #fff;
				}

				#pagemenu li.last {
						border-right: none;
						}				
				
		#pagemenu a {
				display: block;
				padding: 0 10px;
				text-decoration: none;
				}

				#pagemenu a:hover {
						background: #fff;
						}

				#pagemenu a.active {
						background: #fff;
						}										

/*** style for activechapter ***/

#activechapter {
		padding: 10px 15px 0 15px;
		width: 516px; 
		}

		#activechapter p {
				margin: 0;
				}
				
/*** style for activepage ***/

#activepage {
		overflow: auto;
		padding: 0 15px;
		width: 486px!important; width: 516px; height: 120px;
		}

		#activepage p {
				margin: 0;
				}																									

/*** style for footer ***/

#footer {
		position: absolute;
		left: 0; bottom: 0;
		margin: 0; padding: 0;
		list-style: none;
		}

		#footer li {
				float: left;				
				}

				#footer li a {
						display: block;
						padding: 0 12px 4px 12px;
						font-weight: bold;
						text-decoration: none;
						border-right: solid 1px #fff;
						}

						#footer li a:hover {
								text-decoration: underline;
								}
				
/*** style for menu ***/

.menuwrap {
		width: 554px; height: 529px;
		behavior: url(iepngfix.htc);
		}
		
.menu {
		margin: 0; padding: 0;
		list-style: none;
		}

		.menu li {
				margin: 0; padding: 0;			
				}

				.menu li a {						
						display: block;
						padding-top: 5px; padding-left: 15px;
						width: 212px; height: 25px!important; height: 30px;					
						color: #fff;						
						font-size: 16px;
						font-weight: bold;
						text-transform: uppercase;
						text-decoration: none;
						}

						.menu li a.active {						
								padding-left: 220px;
								}						

.menu .first a {
		position: relative;
		margin: 0;
		height: 310px!important; height: 315px;
		font-weight: normal;
		}
		
		.menu .first img {
				display: block;
				margin: 20px 0 10px;
				border: solid 2px #fff;
				}

		.menu .first span {
				position: absolute;
				left: 15px; bottom: 2px;
				cursor: pointer;
				font-weight: bold;
				}

/*** style for app ***/

table.app {
		position: absolute;
		left: 217px; top: 0;
		width: 332px;
		}
		
div.app {
		overflow: auto;
		margin-right: 10px; padding-right: 10px;
		scrollbar-3dlight-color: #fff;
		scrollbar-arrow-color: #d52820;
		scrollbar-base-color: #fff;
		scrollbar-darkshadow-color: #d52820;
		scrollbar-face-color: #fff;
		scrollbar-highlight-color: #fff;
		scrollbar-track-color: #d52820;
		scrollbar-shadow-color: #fff;		
		}
		
.app2 {
		position: absolute;
		right: 0; top: 0;
		overflow: auto;
		padding: 10px;
		width: 402px!important; width: 422px;
		}		

div.app3 {
		position: absolute;
		right: 0; top: 0;
		overflow: auto;
		padding: 10px;
		width: 710px!important; width: 730px;
		}																		

/*** style for content home ***/

.text {
		padding: 20px;
		}
		
.fronttext {
		padding-bottom: 22px!important; padding-bottom: 24px;
		color: #d52820;
		background: url('../Webmasters/Images/bg_fronttext_btm.gif') left bottom no-repeat;
		}

		.fronttext div {
				padding: 10px 20px;
				color: #d52820;
				border: solid 2px #fff;
				border-top: 0;
				border-bottom: 0;
				background: #ece537;
				}		

		.fronttext a {
				color: #d52820;
				}										

/*** style for user login ***/				

.login {
		position: absolute;
		left: 10px; top: 30px;
		width: 190px;
		table-layout: fixed;
		}

		.login th {
				padding: 0;
				text-align: left;
				}

		.login tfoot {
				text-align: right;
				}
				
.entry {
		table-layout: fixed;
		padding: 2px;
		padding-left:0px;
		}
		
		.entry th {
				text-align: left;
				color: white;
				}
				
		.entry thead {
				font-weight: bold;
				}
				
		.entry tfoot {
				padding-top: 10px;
				}

		.entry .col1 {
			padding-top:4px;
			vertical-align: top;
			background-color: white;
			text-align: center;
			color: #c00; 
			font-weight:bold; 
		}

		.entry .col2 {
			position: relative;
			vertical-align: top;
			background-color: white;
			color: #c00; 
			font-weight:bold; 
		}

		.entry .col2 td {
			vertical-align: top;
			color: #f00;
			font-weight:bold; 
		}
/*** style for competence ***/

.competence, .task {
		position: absolute;
		right: 0; bottom: 50px;
		overflow: auto;		
		width: 680px; height: 165px;
		z-index: 1;
		}
		
.data {
		background: url('../Webmasters/Images/bg_competence_head.gif') no-repeat;
		}

		.data table {
				table-layout: fixed;
				width: 100%;
				background: url('../Webmasters/Images/bg_competence_foot.gif') bottom left no-repeat;
				line-height: 15px;
				color: #d52820;
				}

				.data table thead {
						height: 25px;
						font-weight: bold;
						}
						
						.data table thead th {
								padding-left: 0;
								border-left: solid 1px #eae22d;
								text-align: center;
								text-transform: capitalize;
								}
						.data table thead td {
								padding-left: 20px;
								}
							

				.data table tbody {
						background-color: #ece537;
						}

				.data table tfoot {
						height: 25px;
						padding-left: 10px;
						font-weight: bold;
						}
						
						.data table tfoot td {
							border-top: solid 1px #fff;
							text-align: right;
						}

.scoresoverview div {
		overflow: auto; 
		height: 115px;
		scrollbar-3dlight-color: #eae22d;
		scrollbar-arrow-color: #eae22d;
		scrollbar-base-color: #fff;
		scrollbar-darkshadow-color: #fff;
		scrollbar-face-color: #fff;
		scrollbar-highlight-color: #fff;
		scrollbar-track-color: #eae22d;
		scrollbar-shadow-color: #fff;		
		border-left: solid 2px #fff;
		background-color: #ece537;
		}

		.scoresoverview div table {
				width: 659px; /* width changed from 679 due to fix for fieldset */
				background: none;				
				}																 					

.description {
		padding: 2px 4px 2px 20px;
		background: url('../Webmasters/Images/white.gif') repeat-y;
		}
		
.data .description {
		background-image: none;
		}
		
.score {
		padding-left: 0;
		padding-right: 10px;
		border-left: solid 1px #fff;
		text-align: right;
		}				

/*** style for CV ***/

.part table, .part th {
		color: #000;
		}
		
.part fieldset {
		padding: 5px;
		border-color: #fff;
		}
		
		.part fieldset legend {
				color: #db001b;
				font-weight: bold;
				font-size: 120%;
				}

/*** style for show CV ***/

.part .competence table, .part .competence th  {
		color: #d52820;
		}
		
.part .competence {
		left: 0; top: 0;
		position: relative;
		margin-bottom: 15px;
		height: auto;
		}

		.part .scoresoverview div {
				overflow: visible;
				}

.entry .competence tfoot {
		padding-top: 0;
		}								

/*** style for assessmentstraject ***/
.entry ul {
		font-weight: bold;
		color: #c00;
		margin-left: 0px;
		padding: 0;
		list-style: none;
		}

.entry ul li {
	background-color: #fff;
	margin: 4px 0;
	}

.entry ul li a {
	display: block;
	height: 20px;
	padding: 2px 11px 0 0;
	color: #c00;
	font-weight: bold;
	text-decoration: none;
	vertical-align: middle;
	}

.entry ul li a:active {
		background: url("../Webmasters/Images/selected.gif") no-repeat right center;
		}
		
.entry .list td {
		font-weight: bold;
		color: #c00;
		background-color: #fff;
		padding: 2px;
		border-top: solid 2px #db001b;
		border-bottom: solid 2px #db001b;
		height: 26px;
		}

	.entry .list td input {
		margin:-1px 0 0 -3px;
		padding:0;
		}

.entry span {
	display: block;
	width: 18px;
	background: url("../Webmasters/Images/bullet.gif") no-repeat center center;
	color: #fff;
	text-align: center;
	}

.entry .list a {
	display: block;
	padding: 2px 11px 0 0;
	color: #c00;
	font-weight: bold;
	text-decoration: none;
	vertical-align: middle;
	}

.entry .list a:active {
	background: url("../Webmasters/Images/selected.gif") no-repeat right center;
	}

.assesmenttext_bg {
		float: left;
		width: 217px; height: 550px;
		behavior: url('../iepngfix.htc');
		background: url('../Webmasters/Images/menu/bg_vragenlijst.png') no-repeat;		
		}		
						
.assesmenttext {
		position: absolute;
		left: 0; top: 0;
		overflow: auto;
		padding: 10px;
		width: 188px!important; width: 208px; height: 490px!important; height: 510px;	
		}

.assessmentsentry {
		margin: 10px; margin-top: 20px; margin-left: 5px;
		margin-right: 5px!important;margin-right: 20px;
		width: 710px!important;width: 705px;
		color: #000;
		table-layout: fixed;
		border: solid 1px #fff;
		background: #ece537;	
		}
		
		.assessmentsentry thead {
				font-weight: bold;
				background: #fff;
				}

		.assessmentsentry th {
				padding: 3px 5px;
				text-align: left;
				color: #db001b;
				border-right: solid 1px #ece537;
				}

		.assessmentsentry td {
				padding: 3px 5px;
				border-right: solid 1px #fff;
				}

		.assessmentsentry .noborder {
				border-right: none;
				}				

		.assessmentsentry tfoot {
				text-align: right;
				}

				.assessmentsentry tfoot td {
						padding: 3px 5px;
						border-top: solid 1px #fff;
						}

				.assessmentsentry tfoot .error {
						display: inline;
						margin-right: 20px;
						color: #d52820;
						font-weight: bold;
						font-style: italic;						
						}						

		.assessmentsentry a {
				color: #d52820;	
				}

/*** style for ontwikkeling ***/																	

.assesment {
		position: absolute;
		right: 0; top: 0;
		overflow: auto;
		padding: 0;
		width: 410px;
		}		
		
.ontwikkeling {
		position: absolute;
		right: 0; top: 0;		
		padding: 0; 
		width: 415px; height: 295px; 
		overflow: auto;		
		}

/*** style for DIV with RadarSVG(assessments), derived from app2 ***/

.assessmentscore {
		position: absolute;
		right: 0; top: 295px;
		overflow: auto;
		width: 422px;
		text-align: center;
		background: url('../Webmasters/Images/bg_assesmentscore.gif') center top no-repeat;
		}

		.assessmentscore table {
				margin: 0 auto;
				table-layout: fixed;
				background: url('../Webmasters/Images/bg_assesmentscore_bottom.gif') bottom no-repeat;
				}

		.assessmentscore table .head {
				vertical-align: top;
				padding-top: 1px;
				padding-left: 10px;
				color: #abcfe7;
				font-weight: bold;
				font-size: 110%; 
				}

		.assessmentscore table .scores {
				vertical-align: top;
				padding: 5px 0;
				}				

		.assessmentscore table .head span {
				margin-left: 137px!important; margin-left: 132px;
				width: 20px;
				text-align: center;
				color: #fff;
				font-weight: normal;
				}								

				.assessmentscore table table {
						text-align: center;
						background: none;
						}
						
						.assessmentscore table table .type {
								padding-right: 10px;
								text-align: right;
								text-transform: capitalize;
								font-size: 110%;
								}

								.student_color img {
										background: yellow;
										}
										
								.waarnemer_color img {
										background: green;
										}

								.norm_color img { 
										background: red;
										}																
								
		.assessmentscore table .description {
				vertical-align: top;
				padding: 5px 10px;
				font-weight: bold;
				font-size: 110%;
				text-transform: uppercase;
				background: none;
				}

.compactposition {
	position: static;
}

/*** style for tabmenu ***/
		
.tabmenu {
		position: absolute;
		left: 0; bottom: 0;
		margin: 0;
		width: 100%; height: 30px;
		list-style: none;
		z-index: 999;	
		}

		.tabmenu li {
				position: absolute;
				left: 0; bottom: 0;
				padding-top: 5px; padding-right: 20px;
				width: 147px !important; width: 167px;
				text-align: right;
				cursor: pointer;
				behavior: url(iepngfix.htc);
				background: url('../Webmasters/Images/bg_kaart.png') no-repeat;
				}

				.tabmenu li a {
						color: #fff;
						font-weight: bold;
						font-size: 120%;
						text-decoration: none;
						text-transform: uppercase;
						}

				.tabmenu li div {
						display: none;
						overflow-y: scroll;
						margin: 0 10px; margin-bottom: 30px; padding-right: 5px;
						width: 140px; height: 165px;
						text-align: left;
						color: #000;
						z-index: -1;
						}

						.tabmenu li div table {
								width: 120px;
								table-layout: fixed;
								color: #000;
								}						

						.tabmenu li div a {
								color: #d52820;
								font-size: 100%;
								text-transform: none;
								text-decoration: underline;
								}

								.tabmenu li div a:hover {
										text-decoration: none;
										}																		

/* style for compact mode */
.compact {
	margin: 0;
	padding: 0;
	list-style: none;
	height: 52px;
}

	.compact li {
		float: left;
		width: 150px;
		text-align: left;
		background: url('../Webmasters/Images/menu/bg_compactmenu.gif') 0 0 repeat-x;
	}
	
	.compact li a {
		display: block;
		height: 52px;
		padding: 12px 0 0 5px;
		font-weight: bold;
		font-size: 16px;
		text-decoration: none;
		background: url('../Webmasters/Images/menu/bg_compactmenu-tab.gif') right top no-repeat;
	}
	
		.compact li a.first {
			padding-left: 20px;
		}

		.compact li a.last {
		background: url('../Webmasters/Images/menu/bg_compactmenu-lasttab.gif') right top no-repeat;
		}

.compactcontent {
	padding: 4px;
	text-align: left;
}