@charset "utf-8";
/* CSS Document */

html {
	height:100%;
}
body {
	color:#666;
	margin:0;
	padding:0;
	background:#fff url(images/bg.jpg) top center repeat-x;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	height:100%;
}
a {
	outline: none;
}

hr {
	color:#010066;
}
li{
	list-style:square;
}
li.line20{
	line-height:20px;
}
a:link{
	color:#666;
	text-decoration:none;
}	
a:active{
	color:#666;
	text-decoration:none;
}	
a:visited{
	color:#666;
	text-decoration:none;
}	
a:hover{
	color:#444;
	text-decoration:underline;
}	
.blackborder{
	border:1px solid #000000;
}
.kadergrijs{
	width:280px;
	border:1px solid #666666;
	background:#CCCCCC;
	padding:10px;
	margin:15px 0 0 0;
}		
h1 {
	font-size:12px;
	font-weight:bold;
	margin:0 0 2px 0;
	color:#eb242c;
	text-transform:uppercase;
}
h2 {
	font-size:12px;
	font-weight:bold;
	color:#0071b8;
	margin:15px 0 15px 0;
}
h3 {
	font-size:12px;
	font-weight:bold;
	color:#616161;	
	margin:15px 0 10px 0;
}

#container {
	position:relative;
	background:url(images/bg_main.jpg) top left repeat-y;
	width:960px;
	left: 50%;
	margin-left: -480px;
	padding:0;
	height: auto !important; /* Use the correct setting in compliant browsers */
    _height:100%;		/*for IE*/
	min-height:100%;	/*for Firefox*/

	}
#header{
	position:relative;
	width:960px;
	height:180px;
	background:url(images/header.jpg) top center no-repeat;
	}
#header h1 {
	position:absolute;
	text-indent:-9999px;
}
.clear { clear:both;}
/* ----------------- Content -----------------*/
#content {
	position:relative;
}
#leftcolumn {
	float:left;
	width:280px;
}
#rightcolumn {
	float:right;
	width:630px;
	padding:10px 0 0 0;
}
#leftcol{
	float:left;
	width:305px;
}
#rightcol{
	float:right;
	width:305px;
}
#fullcol{
	float:left;
	width:630px;
}
/* ------------------ Footer ------------------ */
#pagina {
	position:relative;
	padding-bottom:40px;	/*for footer*/
}
#footer {
	position:relative;
	width:100%;
	height:40px;			/*for footer*/
	margin-top:-40px;		/*for footer*/
	z-index:1;
}
#footermain {
	position:relative;
	width:960px;
	height:40px;
	left: 50%;
	margin-left: -480px;
	background:url(images/bg_main.jpg) top left repeat-y;
	padding:0;
	z-index:10;
	font-size:10px;
}
#footermain a:link{
	color:#666;
	text-decoration:none;
}
#footermain a:hover{
	color:#666;
	text-decoration:underline;
}
#footermain a:visited{
	color:#666;
	text-decoration:none;
}
#designerlab {
	position:absolute;
	left:0px;
	top:15px;
	width:120px;
	height:20px;
}
#designerlab a{
	position:absolute;
	height:100%;
	width:100%
}
#foottekst {
	position:absolute;
	width:620px;
	height:20px;
	top:20px;
	left:330px;
}

/* ------------------ Menu top -----------------*/

.menu {
	position:absolute;
	width:638px;
	left:320px;
	top:132px;
	padding:0;
	margin:0;
}
.menu li {
	float:left;
	font-size:14px;
	font-weight:500;
	list-style:none;
}
.menu li a:link {
	color:#fff;
	text-decoration:none;
	margin-left:1px;
	padding:9px 25px 12px 25px;
	display:block;
}
.menu li a:visited {
	color:#fff;
	text-decoration:none;
	margin-left:1px;
	padding:9px 25px 12px 25px;
	display:block;
}
.menu li a.active {
	color:#000;
	text-decoration:none;
	background:#fff;
	margin-left:1px;
	padding:9px 25px 12px 25px;
	display:block;
}
.menu li a:hover {
	color:#000;
	text-decoration:none;
	background:#fff;
	margin-left:1px;
	padding:9px 25px 12px 25px;
	display:block;
	border-bottom:1px solid #FFFFFF;
}

/* ------------------ Navigatie left-------------- */

.navig {
	margin:0 0 0 15px;
	padding:0;
}
.navig li {
	list-style:none;
	margin-bottom:4px;
	font-size:13px;
}
.navig li a{
	color:#595959;
	text-decoration:none;
	padding:10px 0 12px 43px;	
	background:url(images/bg_menu.jpg) top right repeat-y;
	display:block;
}
.navig li a.active{
	display:block;
	background:url(images/bg_menu_hover.jpg) top right repeat-y;
	color:#000;
	padding:10px 0 12px 43px;	
}
.navig li a:hover {
	display:block;
	background:url(images/bg_menu_hover.jpg) top right repeat-y;
	color:#000;
	padding:10px 0 12px 43px;	
}

/* ------------ Nieuwsbrief --------------*/

#nieuwsbrief {
	position:relative;
	background:url(images/bg_news.jpg) top left no-repeat;
	width: 244px;
	height:150px;
	margin:20px 0 0 35px;
}
#nieuwsbrief input {
	position:relative;
	margin:0 0 7px 0;
	top: 40px;
}
.text {
	width:150px;
	left:70px;
}
.newsbutton {
	height:32px;
	width:121px;
	left:105px;
	border:none;
	cursor:pointer;
	background:url(images/newsbutton.jpg) top left no-repeat;
	text-indent:-9999px;
	}

.nbkader{
	margin:70px 0 0 5px;
	width:270px;
}
.nieuwsbrief_fouttitel{
	color:#FF0000;
}
.nieuwsbrief_list{
	list-style:square;
}
.nieuwsbrief_verzonden{
	color:#009933;
}			
/* ------------ Contact -------------*/
#contactform {
	margin-top:20px;
}
#contactform label {
	float:left;
	width:100px;
	display:block;
	margin-top:4px;
}
input, textarea, select{
	font-family:Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#333333;
}
.veld {
	width:260px;
	margin-bottom:4px;
}
.highlight {
	width:260px;
	margin-bottom:4px;
	border:1px solid #F00;
}
.textveld {
	width:260px;
	margin-bottom:4px;
	height:60px;
	overflow:auto;
}
.highlighttextveld {
	width:260px;
	margin-bottom:4px;
	height:60px;
	border:1px solid #F00;
	overflow:auto;
}
.contactbutton {
	float:left;
	margin:20px 0 0 0;;
	width:100px;
}
.nietverzonden{
	float:left;
	width:305px;
	margin:20px 0 0 0;
	color:#F00;
	font-weight:600;
}
.dropveld {
	width:265px;
	margin-bottom:4px;
}
.verzonden{
	padding:10px;
	background:#FFF;
}	
.nieuwsitem{
	float:left;
	width:630px;
	border-bottom:0px solid #ccc;
	margin:0;
	padding:0 0 15px 0; 
}
.nieuwsafb{
	float:left;
	width:150px;
	border: 1px solid #000000;
	margin:0 15px 15px 0;
}
/*-------- Fotogalerij --------------*/
.fotoleft{
	float:left;
	width:210px;
	margin:0 10px 0 0;
}
.fotoright{
	float:left;
	width:400px;
}
.fotothumb{
	float:left;
	width:95px;
	height:95px;
	border:1px solid #000000;
	margin:0 5px 5px 0;
}	
.fotothumb2{
	float:left;
	width:94px;
	height:94px;
	border:1px solid #000000;
	margin:0 5px 5px 0;
}	
.fotolarge{
	width:400px;
	border:1px solid #000000;
}
/*---------------- Lessenrooster ----------------*/
.lrdagen{
	float:left;
	width:25px;
	padding:10px 0 0 0;
}
.lrkader_uren{
	float:left;
	background: url(images/lessenrooster_uren.jpg) no-repeat top left;
	border:1px solid #666666;
	width:600px;
	height:30px;
	margin:0 0 5px 0;
}	
.lrkader{
	float:left;
	background: url(images/lessenrooster_bg.jpg) no-repeat top left;
	border:1px solid #666666;
	width:600px;
	height:20px;
	margin:0 0 5px 0;
}	
.lr_ov{
	float:left;
	width:600px;
	margin:0 0 0 30px;
}
.lr_ov_dag{
	float:left;
	width:100px;
	padding:5px 0 0 0;
	font-weight:600;
}
.lr_ov_les{
	float:left;
	width:350px;
	padding:5px 0 0 0;
}
.lr_ov_uur{
	float:left;
	width:120px;
	padding:5px 0 0 0;
}

.infopop {
    padding: 0;
}
 
.infopop span {
    background: url(images/tooltip.png) no-repeat;
	color:#FFF;
	width: 180px;
    height: 115px;
	margin-left:-210px;
	margin-top:-127px;
	padding-left:30px;
	padding-right:30px;
	padding-top:10px;
    position: absolute;
    z-index: 2;
    display: none;
}