/* HTML profiel */
html,
body {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	border: none;
	}

html {
	font-size: 100%;
}

body {
	font: normal 12px Arial;
	color: #555555;
}


/* Links */
a,
a:hover {
	outline: none;
	text-decoration: none;
	color: #0080C0;
	cursor: pointer;
}

a:hover {
	color: #773377;
}

a.white,
a.white:hover {
	color: #fff;
}

a.grey,
a.grey:hover {
	color: #555;
}


/* Standaard CSS-settings */
img {
	border: none;
}

div.handleiding {
	width: 740px;	
	font-size: 12px;
}

img.handleiding {
	width: 740px;	
}
form {
	margin: 0;
	padding: 0;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
	width: 100%;
}

td,
th {
	padding: 0;
	vertical-align: top;
}

input, select, textarea {
	vertical-align: middle;
	font: normal 11px Arial;
	color: #555555;
}

input.checkbox,
input.radio {
	margin: 2px 4px 4px 0;
	-margin: 0 0 1px -4px;
}

input.button {
	font: normal 12px Arial;
	color: #333333;
	text-align: center;
	margin: 0;
	padding-left: 10px;
	padding-right: 11px;
	overflow: visible;
	width: auto !important;
	width: 1px;
}

/* Headings */
h1,
h2,
h3,
h4,
h5 {
	margin: 0;
	padding: 0;
}

h1 {
	font: bold 15px/16px Arial;
	text-transform: uppercase;
	padding: 0 0 5px 0;
	color: #f36; 
}

h1 strong {
	font-size: 1.3em;
	line-height: 1em;
	font-weight: lighter;
}

h2 {
	font: bold 14px/15px Arial;
	color: #f36; 
}

h3 {
	font: bold 16px/17px Arial;
	padding: 0 0 5px 0;
}

h4 {
	font: bold 11px/12px Arial;
	color: #f36;
}

h5 {
	font: bold 11px/12px Arial;
}


/* Wireframe layout */
#pageWrapper {
	margin: 0 auto;
	width: 800px;
	min-height: 100%;
	-height: 100%;
	background: #ffffff url(/images/ouders_stripes_right_vertical5.png) right top repeat-y;
}

div#top_index {
	height: 179px;
}

.left_top_index,
.stripes_top_index {
	display: inline;
	background: url(/images/ouders_left_top4.png) no-repeat;
	float: left;
	width: 510px;
	height: 179px;
}

.stripes_top_index {
	background: url(/images/ouders_stripes4.png) repeat-x;
	width: 250px;
}

.bekijk_je_toekomst_index {
	text-align: right;
	padding: 15px;
}

.bekijk_je_toekomst_index h1 {
	font: bold 18px/19px Arial;
}

.bekijk_je_toekomst_index h1 strong {
	font-weight: bold;
}

.stripes_top_corner_index {
	display: inline;
	background-image: url(/images/ouders_stripes_right_corner4.png);
	background-repeat: no-repeat;
	float: left;
	width: 40px;
	height: 179px;
}

div.index_links {
	position: relative;
	padding-top: 11px;
}

div.index_link_top,
div.index_link_bottom {
	text-align: right;
	line-height: 21px;
	color: #555;
	font-weight: bold;	
}

div.index_link_bottom {
	color: #fff;
}

div#pageBlock {
	clear: both;
	padding: 1px 40px 20px 0px;
}

div.oke_indication_top {
	color: #009900;
	font-weight: bold;
}

div.error_indication_top {
	color: #ff0000;
	font-weight: bold;
}

td.menu_left {
	width: 168px;
	padding: 0 10px;
}

table.menu_left_content {
	text-align: right;
	font-weight: bold;
	color: #fff;
	font-weight: normal;
}

td.menu_header {
	padding: 18px 0 4px 0;
	font-size: 13px;
	font-weight: bold;
}

td.menu_seperator {
	font-size: 1px;
	line-height: 1px;
	padding: 0;
	border-top: solid 1px #ffffff;
}

td.menu_link {
	padding: 3px 0 4px 0;
	border-bottom: solid 1px #ffffff;
	font-size: 11px;
}

td.main_content {
	font-size: 12px;
	line-height: 16px;
	padding: 10px 10px 0 10px;
}


/* Block elementen */
.block_table {
	margin-bottom: 10px;
}

.block_spacer {
	width: 10px;
}

.block {
	border: 1px solid #adadad;
	padding: 10px 10px 20px 10px;
	background: url(/images/section_border_bottom_background.png) left bottom repeat-x;
}

.block_half {
	width: 49%;
}

span.block {
	display: block;	
}


/* Formulier onderdelen */
td.field {
	padding: 2px 0 3px 0;
}

td.label {
	padding: 5px 10px 0 0;
}

td.label label {
	display: block;
}

label span {
	font: bold 18px/18px Arial;
	color: #ff0000;
}

.error {
	color: #ff0000;
}

td.label label span {
	float: right;
}


/* Overige elementen */
td.select_label {
	text-align: left;
	font-size: 12px;
	padding: 4px 0px;
	margin: 4px 0;
	width: 76px;
}

td.select_field {
	float: left;
	width: 210px;
	height: 32px;
	margin: 4px 0;
}

div.doe_de_test_arrow {
	text-align: center;
	display: block;
	width: 218px;
	height: 140px;
	
	padding: 85px 0 0 0;
	background: url(../images/doe_de_test_arrow.png) no-repeat;
	
}

a.doe_de_test_link_roze {
	font-size: 18px;
	font-weight: bold;
	color: #f36;
}

a.doe_de_test_link_blauw {
	font-weight: bold;
}

/* Homepage sections */
.section {
	width: 179px;
}

.section_header {
	width: 179px;
	background: no-repeat;
	height: 72px;
}

.section_leerlingen .section_header {
	background-image: url(../images/section_header_leerlingen.png);
}

.section_decanen .section_header {
	background-image: url(../images/section_header_decanen.png);
}

.section_ouders .section_header {
	background-image: url(../images/section_header_ouders.png);
}

.section_bedrijven .section_header {
	background-image: url(../images/section_header_bedrijven.png);
}

.section_header h4 {
	padding: 55px 0 0 75px;
	text-transform: uppercase;
}

.section_header h4:first-letter {
	font-size: 1.2em;
	line-height: 1em;
}

.section_content {
	border: solid #81D503;
	border-width: 0 2px;
	padding: 0 10px;
	height: 65px;
	width: 155px;
}

.section_content a {
	position: relative;
	display: block;
	font-size: 10px;
	padding-left: 5px;
}

.section_content a span {
	position: absolute;
	margin: 0 0 0 -5px;
}

.section_footer {
	background: url(../images/section_footer.png) no-repeat;
}


/* Schoolbord */
.schoolbord {
	background: url(../images/schoolbord.jpg) no-repeat;
	width: 217px;
    min-height: 169px;
	padding: 40px 20px 0px 20px;
	font-size: 9px;
	line-height: 11px;
	color: #ffffff;
}


/* lijst */
.lijst td,
.lijst th {
	border: 1px solid #cccccc;
	padding: 4px 5px;
}

.lijst th {
	background: #e5e5e5;
	text-align: left;
}

.lijst th a,
.lijst th a:hover {
	color: #555555;
	text-decoration: none;
	padding-right: 10px;
}

.lijst th a.ASC {
	background: url(/images/ASC.gif) right center no-repeat;
}

.lijst th a.DESC {
	background: url(/images/DESC.gif) right center no-repeat;
}

.lijst td.icon {
	width: 20px;
	padding: 4px 2px;
	text-align: center;
}

.lijst th.icon {
	padding-bottom: 0;
	text-align: center;
}

/* statistiek lijst */
table.statistiekenlijst {
	border-collapse: collapse;
}

.statistieklijst td,
.statistieklijst th {
	border: solid #ffffff;
    border-width: 0 2px;
    text-align: left;
    padding: 2px 5px 3px 5px;
}

.statistieklijst th {
    background: #80D500;
	color: #FFFFFF;
}

.statistieklijst tr.kleur {
	background: #E6FFBF;
}

.statistieklijst th.datum {
	width: 90px;
}

/* navigatie */
.header_nav {
	float: right;
	margin-top: -25px;
}


/* Video */
.video_overlay .still {
	position: absolute;
	z-index: 9;
	}

.video_overlay a,
.video_overlay a:hover {
	position: relative;
	z-index: 10;
	display: inline-block;
	width: 150px;
	height: 118px;
	text-decoration: none;
	}

.video_overlay a img {
	-behavior: url(/css/iepngfix.htc);
	width: 150px;
	height: 118px;
	}

.video_overlay a span {
	display: inline-block;
	width: 150px;
	margin: -25px 0 0 0;
	text-align: center;
	color: #ffffff;
	font-weight: bold;
	}

td.label_data {
	padding-left: 2px;
	font-size: 12px;
	font-weight: bold;
}

table tr td.select_label_to_right {
	vertical-align: top;
	padding-top: 4px;
	padding-right: 4px;
	text-align: right;
	font-size: 12px;
	padding-left: 0px;
	width: 180px;
}

.aanmelden_text_field {
	width: 330px;
}
table tr td.select_field_leerling {
	float: left;
	height: 22px;
}

/* Beroepenscroller */
#motioncontainer {
/*	margin:0 auto; */
	position: relative;
	overflow: hidden;
	margin: 0;
	padding: 0;
	height: 118px;
	width: 100% !important;
	-width: expression(Math.min(this.offsetWidth, maxwidth)+"px");
}

#motiongallery {
	position: absolute;
	left: 0;
	top: 0;
	margin: 0;
	padding: 0;
	white-space: nowrap;
	}

#trueContainer {
	margin: 0;
	padding: 0;
	}

#statusdiv {
	display: none;
	}

.caroussel_links {
	position: absolute;
	z-index: 1000;
	margin-top: -118px;
}

.caroussel_rechts {
	position: absolute;
	margin-top: -118px;
}

/* printversie */
@media print {
	html,
	body {
		width: auto;
		height: auto;
		}
	
	#pageWrapper {
		margin: 0;
		padding: 0;
		width: auto;
		background: none;
	}
	
	div#top_index {
		display: none;
	}
	
	div#pageBlock {
		padding: 0;
	}
	
	td.menu_left {
		display: none;
	}
	
	td.main_content {
		padding: 0;
	}
}