@import url("teaser-carousel.css");
@charset "utf-8";
/* CSS Document */


/*
html,body{ height: 100%;}
*/

body {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #FFF url(../images/bg_body.jpg) repeat-x top;
	margin: 0; /* zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
}

#background-container { background-image: url(../php/rotator.php); 	background-repeat: no-repeat; overflow: hidden; }
#background-container3 { background-image: url(../php/rotator.php); background-repeat: no-repeat; }

p {
	font-size: 11px;
	line-height: 160%;
	padding:0;
	margin:0;
	margin-bottom:1.5em;
}

td p {
	margin:0;
	padding:0;
}

h1 {
	font-family:Verdana, Geneva, sans-serif;
	font-size: 17px;
	color: #663366;
	font-weight: bold;
}
 
h2 {
	font-size: 12px;
	font-size: 17px;
	color: #663366;
	font-weight: bold;
	padding: 0;
}

h3 {
	color: #663366;
	font-size: 13px;
	font-size: 17px;
	font-weight: bold;
	margin-bottom: 5px;
}

h4 {
	/* border-bottom: 1px dashed #CC3366; */
	color: #663366;
	font-size: 12px;
	font-weight: bold;
	margin-bottom: 3px;
	margin-bottom:0;
	padding-bottom: 8px;
}



/* Image links */

a img { border: none; }
a img:hover { filter: alpha (opacity=85) ; opacity: .9; }

/* Main containers */

#container {
	position: relative;
	min-height: 100%;
	height:auto !important; /* for modern browsers */
	height:100%; /* this is for IE*/
	text-align: left;
	overflow:hidden;
	width: 995px;	
	padding: 0;
}

/* Trick to get equal length columns 
*/
#content-left, #content-middle, #content-right, #content-middle-wide {
	padding-bottom: 3000px;
	margin-bottom: -3000px;
}

#header {
	padding-top: 1px; /* prevents margin collapse */
	margin: 0;
	padding: 0;
	height: 18px;
	background-color: #988b6d;
	width: 530px;	
}

#content-left {
	float: left;
	position: relative;
	width: 244px;
	background-image: url(../images/bg_content_left.gif);	
	background-color: white;
	background-repeat: no-repeat;	
	height: 750px;
	border-right: 1px solid #D2D2D2;
}

#content-middle {
	background-color: white;
	position: relative;
	float: left;
	width: 539px;
	height: 100%;	
	z-index: 100;
}

#content-middle-wide {
	background-color: white;
	position: relative;
	float: left;
	width: 740px;
	height: 100%;
	margin-left:0;
	padding-left:0;
}

#content-right {
	position: relative;	
	float: left;
	width: 208px;	
	height: 100%;
	min-height:100%; 	
	background-color: #e2ded6;
	background-image: url(../images/teaser_top.gif);
	background-repeat: no-repeat;
	background-position: left top;
	overflow: hidden;	
	margin-top: 0px;	
	padding-top: 15px;
	/* Cross browser opacity */
	opacity:.85;
    	filter: alpha(opacity=85); 
    	-moz-opacity: 0.85;		
}

#teasers-right {
	left:800px;
	position:absolute;
	top:25px;
}

#footer {
	height: 66px;	
	width: 100%;
	clear: both;
	position: relative;
	background-image: url(../images/bg_footer.gif);
	background-repeat: repeat-x;
	height: 66px;
	margin: 0;	
	padding: 0;
}

/* Top navigation */

#header-left {
	float:left;	
	margin: 0;
	padding: 0;
	width: 245px; /* same as content-left */
	border-right: 1px solid white;
	height: 100%;
}

#header-right {
	float: left;
}

ul#header-nav {	
	list-style: none;
	height: 10px;	
	margin: 2px 30px 0 0px;	
	padding: 0;
	float: right;
	font-size: 11px;
}

ul#header-nav li {
	float: left;
	padding-right: 10px;	
}

ul#header-nav li a {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 11px;
	font-weight: bold;
	text-decoration: none;
	color: black;
}

#header-nav .selected {
	color: white;
}

/* Left column */

#content-left-logo {
	position: absolute;
	top: 26px;
	left: 46px;
}

#content-left-text {
	width: 175px;
	color: #663366;
	margin-left: 40px;
}

/* Main menu */

div#main-menu {
	position: relative;
	position:absolute;
	margin-top: 275px;
	width: 245px;
	padding: 0;
	/*padding-top: 275px;*/
	z-index:900;
}

#main-menu #menu-list {
	background: url(../images/bg-main-menu.gif) no-repeat 0px -283px;
	/* background: url(../images/bg-main-menu-line.gif) no-repeat top left;  */
	padding-bottom:10px;
}

#sub-menu, #content-left .purple {
	position: absolute;
	top: 315px;
}

#sub-menu h1 {
	font-size: 14px;
	font-weight: bold;
	color: #663366;	
	padding-left: 10px;
	margin-top: 15px;
}

#main-menu ul, #sub-menu ul {
	color: #615143;
	font-weight: bold;
	font-size: 12px;	
	list-style: none;
	padding-left: 10px;	
	/* padding-bottom: 15px; */
	margin: 0;
}

#main-menu ul li,  #sub-menu ul li {
	margin: 0;
	padding-top: 10px;
}

#main-menu ul li a, #sub-menu ul li a {
	padding-left: 27px;
	background-image: url(../images/arrow_main_menu_item.gif);
	background-repeat: no-repeat;
	background-position: 0 0px; /* used to position the images so that they line up with the text */
	display: block;
	width: 200px; /* without width, only the text part of the link is clickable in IE */		
	line-height: 23px;
}

#sub-menu ul li a {
	line-height: 21px;
}

#menu-show {
	line-height: 25px;
	height: 25px;
/*	margin-top: 5px;*/
	padding-left: 35px;
	padding-top: 5px;
	padding-bottom: 11px;	
	background-image: url(../images/bg_menu_close.gif);
	background-repeat: no-repeat;
	background-position: left;	
}

#menu-show img { margin-right: 10px; }

a.menu-item {
	text-decoration: none;	
	color: #615743;
	font-weight: bold;
	font-size: 12px;
}

a.menu-item:hover { color:#000; }

#main-menu a.current {
	font-weight: bold;
	color: #cc3366;		
}

#sub-menu a.current {
	font-weight: bold;
	color: #cc3366;	
	background-image: url(../images/arrow_purple.gif) !important;
	background-repeat: no-repeat;
	background-position: 0 0px; /* used to position the images so that they line up with the text */	
}

/* #menu-text, .purple p {  // cause purple intro text to indent */
#menu-text {
	color: #663366;
	font-weight: bold;
	font-size: 11px;
	margin-left: 40px;
	width: 175px;
	margin-top: 10px;
	line-height:160% !important;

}

/* Middle column */

#text-middle-top {
	padding: 10px 0 10px 15px;
}

.column-single {
	/*position: relative;*/
	/* padding-right: 10px; */
	width: 100%;
	background-color: white;
}

.column-head {
	background:url(../images/column_head.gif) no-repeat left top;
	height:76px;
	width:523px;
	margin-top:20px;
}

.column-head img { margin-left:28px; }

.column-breadcrumb {
	margin-top: -35px;
	margin-left: -9px;
	padding-right: 13px;
}

.column-breadcrumb ul {
	list-style: none;
}

.column-breadcrumb ul li {
	display: inline;
}

.column-breadcrumb ul li, ul li a {
	color: #663366;
	font-size: 11px;
	text-decoration: none;
}

.column-breadcrumb ul li a { padding:0 0.3em; }

.column-body { margin-top:16px; margin-top:35px;}

.two-cols {
	padding-left: 5px;
	padding-right: 15px;
}

.two-cols p {
	padding-left: 15px; 
	padding-right: 5px;
}

.one-col  { padding: 0 15px 40px 50px;}

.one-wide-col {
	padding: 0;
	margin: 0;
}

.one-col p {
	font-size: 12px;
	padding-right: 35px; /* text is slightly smaller than rest of div */
}

.column-body p { color: #663366;}

/* Default bullet style for inline text */
.column-body ul {
	color: #663366;
	font-size: 12px;
	list-style: square;		
}

.column-body ul li {
	line-height: 150%;
}


.column-body .quickscan li {
	line-height: 30px;
}

.column-body p li a {
	/* text-decoration: underline; */
	/* font-size: 12px; */
}


ul.internal-links, ul.mixed-links, ul.csc-menu-1 {	
	list-style: none;	
	margin: 0 0 15px 0;
	padding: 5px 0 10px 0;
}

ul.internal-links li, ul.csc-menu-1 li {	
	padding-left: 15px;
	padding-top: 5px;
	padding-bottom: 5px;
	width: 100%; /* Change: 20.04.2009 */
}

ul.mixed-links li {
	padding-top: 3px;
	padding-bottom: 0px;
	height: 30px;
	width: 100%;
}

ul.mixed-links span {
	font-weight: normal;
	font-size: 12px;
}

ul.internal-links li a, ul.mixed-links li a , ul.csc-menu-1 a {	
	text-decoration: none;
	font-weight: bold;
	font-size: 12px;
	color: #663366;
	padding: 4px 0px 4px 33px;
	display: block;
	/* width: 100%; /* without this, only the text part of the link is clickable in IE */	
}

ul.internal-links li a:hover, ul.mixed-links li a:hover , ul.csc-menu-1 a:hover {	
	color: #cc3366;
}

ul.mixed-links li a {
	line-height: 30px;
}

ul.mixed-links li a:hover {
	 background-color: #f1efeb;
}

.red-bg, ul.csc-menu-1{
	background-color: #f1efeb;
}

.red-border, ul.csc-menu-1 {	
	border-top: 1px dashed #cc3366;
	border-bottom: 1px dashed #cc3366;
}

li.red-border {	
	border-bottom: 1px dashed #cc3366;
	border-top: none;
}

a { color:#663366; }
td a { text-decoration:none; }

a.link-doc, a.link-ext, a.external-link, a.link-int  { 
	background-image: url(../images/icon_doc.gif); 
	background-repeat: no-repeat;  
	background-position: 0 50%; 
	text-decoration: none; 
	display: inline-block;
	
	font-size:11px;
	font-weight:bold;
	padding-bottom:5px;
	padding-left:35px;
	padding-top:5px;
}

a.link-ext, a.external-link {  background-image: url(../images/icon_link.gif); }	
a.link-int  { background-image: url(../images/arrow_purple.gif); }

/*
.download { float: right; font-size: 10px !important; color: #615743;  padding-right: 5px;}
*/

ul.internal-links.red-border li a, ul.csc-menu-1 li a {	
	background-image: url(../images/arrow_red.gif);
	background-repeat: no-repeat;
	background-position: 0px 2px;	
	line-height: 15px;	
}

a:hover , ul.internal-links li a:hover, a.link-ext:hover {
	color: #cc3366;
}

/* Stappenplan list */

ul.stappenplan, ol {
	/*
	display: block;
	list-style: none;
	margin: 0;
	padding: 0;
	padding: 15px 0 15px 40px;
	*/
	color: #663366;
	font-size: 11px;
	line-height: 160%;
	margin:0;
	padding:0;
}

ul.stappenplan  li, ol li {
	list-style: decimal;
	padding:15px 0 15px 0px;
}

.step1 { background-image: url(../images/step_1.gif); background-repeat: no-repeat; background-position: 5px 18px; }
.step2 { background-image: url(../images/step_2.gif); background-repeat: no-repeat; background-position: 5px 18px; }
.step3 { background-image: url(../images/step_3.gif); background-repeat: no-repeat; background-position: 5px 18px; }
.step4 { background-image: url(../images/step_4.gif); background-repeat: no-repeat; background-position: 5px 18px; }
.step5 { background-image: url(../images/step_5.gif); background-repeat: no-repeat; background-position: 5px 18px; }
.step6 { background-image: url(../images/step_6.gif); background-repeat: no-repeat; background-position: 5px 18px; }

/* Links to movies */

table.teaser-table {	
	border-collapse: collapse;
	margin-left: 30px;
	margin-top: 15px;
} 

table.teaser-table td {	
	width:  440px;
	height: 295px;
	margin-bottom: 230px;
} 

table.teaser-table td.empty {	height: 25px;}

div.teaser-container {
	position: relative;
	width: 180px;
	height: 270px;
	background-image:url(../images/bg_teaserbox.png);
	background-repeat:no-repeat;
}

.teaserbox {
	background:url(../images/button_bekijk_film.png) no-repeat left bottom; 
	color:#FFF;
	font-family:Arial, Helvetica, sans-serif; 
	font-size: 12px;
	font-weight: bold;
	width:180px; 
	padding-bottom: 30px;
	margin-left:14px;
}

.teaserbox-overzicht{
	width:180px; 
	margin:0;
}

.teaserboxover{}

.teaserbox img.quote, .teaserbox-overzicht img.quote{
	margin-bottom:10px; 
	margin-left:0px; 
	margin-right:0px; 
	margin-top:0px ;
}

.teaserbox .teaserboxbodytext, .teaserbox-overzicht .teaserboxbodytext {
	width:180px; 
	height:74px; 
	margin:0; 
	padding:5px; 
	background-repeat:no-repeat; 
	font-family:Arial, Helvetica, sans-serif; 
	font-weight:bold; 
	font-size:12px; 
	color:#FFF;
}

.teaserboxbekijk { background-image:url(../images/button_bekijk_film.png); }


/* Vakkenlijst */

ul.course-list {
	list-style-type: square;
	list-style-position: inside;
	border-top: 1px solid;
	border-top: 1px dashed #cc3366;	
	padding: 0;
	padding-top: 5px;
	margin: 0 0 10px 0;
}

ul.course-list li {
	/* margin-bottom: 10px; */
	line-height: 20px;
	font-size: 11px;
	color: #663366;
}

/* Vacaturesites */

div.site-info {
	margin-bottom: 30px;
}

div.site-info .site-img {
	background-color: orange;
	float: left;
	width: 147px;
}

div.site-info .site-descr {
	float:left;
	padding: 0;
	margin-left: 35px;
	width: 289px;
}

div.site-info p {
	font-size: 11px;
	padding: 0;
	margin-top: 5px;
	margin-bottom: 10px;
}
div.site-info a {
	color: #663366;
	font-weight: bold;
	font-size: 11px;
	padding-left: 35px;
	padding-top: 5px;
	padding-bottom: 5px;
}

/* Site map */

ul.site-map {
	list-style: square;
	color: #cc3366;
	list-style-position: inside;
	display: block;
	margin-left: -25px;
}

ul.site-map .level1 {
	margin-top: 10px;
	list-style: square;
	list-style-position: inside;
	color: #cc3366;

}

.head {
	padding-top: 5px;
	border-top: 1px dashed #cc3366;
	width: 350px;
}

ul.site-map .level2 {
	margin-top: 8px;
	padding-bottom: 5px;
	list-style: square;
	color: #663366;	
}

/* Contact form */

.contact-form {
	padding-left: 15px;
	padding-top: 25px;
	padding-bottom: 15px;
}

.contact-form label {
	display:block; 
	width: 100px;
	margin-bottom: 10px;
	font-size: 11px;
	color: #663366;
}

.contact-form input, textarea {
	margin-bottom: 5px;
}

.contact-form a.submit {
	background-image: url(../images/arrow_main_menu_item.gif);
	background-repeat: no-repeat;
	background-position: right;
	
	padding-right: 40px;
	padding-top: 5px;
	padding-bottom: 5px;
	
	text-decoration: none;
	color: #663366;
	font-size: 11px;
	font-weight: bold;
}

/* Right column */


/* Footer */

ul#footer-nav {
	position: absolute;
	right: 12px;
	top: 30px;
	height: 15px;
	list-style:none;
	padding: 0;
}

ul#footer-nav li {
	border-left: 1px solid #FFF;
	float: left;
	padding: 0 6px;	
	font-family: Verdana, Geneva, sans-serif;
	font-size: 11px;
	color: white;
}

ul#footer-nav li a {
	text-decoration: underline;
	font-weight: normal;
	color: white;	
	font-size: 11px;
}

#footer-nav li.no-link { border:0; }
	
/* Site map */
.site-map, .csc-sitemap {
	width:400px;	
}

.site-map ul, .csc-sitemap ul {
	list-style-position: inside;
	list-style-type: square;
	font-size: 11px;
	color: #cc3366;
	padding-top: 10px;
	padding-bottom: 10px;
}

ul.level2, .csc-sitemap ul ul {
	color: #663366;	
}

ul.level2, .csc-sitemap ul ul li {
	line-height: 20px;
	color: #663366;	
}

.csc-sitemap li {
  border-top: #F00 dashed 1px; 
  padding-bottom:10px;
}

.csc-sitemap li li  { border:0;  padding-bottom:0;}

.head {
  border-top: #F00 dashed 1px; 
  margin-top: 20px;
}

/* Additional RTE styles */
	
ul.bullets {
	border: 1px solid red;
}	

a.download {
	text-decoration: none; 	
	font-size:11px;
	font-weight:bold;
	padding-bottom:5px;
	padding-top:5px;
}

a.word {
	background-image: url(../images/word_icon.gif); 
	background-repeat: no-repeat;  
	background-position: 0 50%; 
	text-decoration: none; 	
	font-size:11px;
	font-weight:bold;
	padding-bottom:5px;
	padding-left:35px;
	padding-top:5px;
}

a.pdf {
	background-image: url(../images/icon_doc.gif); 
	background-repeat: no-repeat;  
	background-position: 0 50%; 
	text-decoration: none; 	
	font-size:11px;
	font-weight:bold;
	padding-bottom:5px;
	padding-left:35px;
	padding-top:5px;
}

a.internal-link {	
	background-image: url(../images/arrow_red.gif);
	background-repeat: no-repeat;
	background-position: 0 50%; 
	text-decoration: none; 	
	font-size:11px;
	font-weight:bold;
	padding-bottom:5px;
	padding-left:35px;
	padding-top:5px;		
	display: block; /* without this, in IE6 & IE7, links spanning multiple lines will have no background */
	display: inline-block;
}

/* Misc */

.h-purple { color: #663366;}

.nomargin {
	margin:0;
	padding-bottom: 0;
} 

hr.red-border {
  height: 0;
  border-bottom: 1px dashed #cc3366;
}

.smallp {
	 font-size: 11px !important; 
	 margin: 0;
	 padding: 0;
}

/*Extra /////////////////*/
div.csc-textpic div.csc-textpic-imagewrap .csc-textpic-image {  margin:0; }

/* Carousel */
span.teaser-name {	
	color: black;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 14px;
	font-weight: bold;
	text-decoration: none;
}
span.teaser-job {
    color: white;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 12px;
    font-weight: bold;
    text-decoration: none;
}

#cornerLink {
	display: none;
}

