/****************************** GLOBAL TAGS *******************************/

html {
	width: 100%;
	height: 100%;
	overflow-y:scroll;
	margin:0px;
	padding:0px;
}

body {
	width: 100%;
	height: 100%;
	margin:0px;
	padding:0px;
	background: #f5f5f5;
	font-family: Arial;
	color: #000000;
	position: absolute;
	font-size:72.5%;
}

img {
	border: 0px;
}

a {
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

form {
padding:0px;
margin:0px;
}

.movie {margin:0 auto; width:495px; height:500px; margin-top:50px;}	

/******************************** inlog *********************************/

#main_inlog {
	height:268px;
	position:relative;
	top:50%;
	margin-top:-134px;
}

.inlog {
	background:#fff;
	border:#d9d9d9 1px solid;
	margin:0 auto;
	width:400px;
	height:250px;
	font-family:Verdana, Geneva, sans-serif;
	font-size:12px;
	color:#a29090;
	margin-top:170px;
}

.inlog2 {
	background:#fff;
	border:#d9d9d9 1px solid;
	margin:0 auto;
	width:400px;
	height:140px;
	font-family:Verdana, Geneva, sans-serif;
	font-size:12px;
	color:#a29090;
}

/*.logo {
	background:url("../images/header2.png") no-repeat center;
	width:100%;
	height:56px;
}*/

.content-inlog {
	margin:0 auto;
	width:300px;
	height:190px;
}

.content-inlog2 {
	color:#565656;
	margin:0 auto;
	width:300px;
	height:190px;
	padding-top:25px;
}

.content-inlog2 a {color:#565656; text-decoration:none;}

.content-inlog  a {
	color:#565656;
	text-decoration:none;
}

.content-inlog a:hover {text-decoration:underline;}

.content-inlog2 a:hover {text-decoration:underline;}

#titel {
	font-size:13px;
	padding-top:10px;	
	color:#565656;
}

#gebruikersnaam {
	width:170px;
	float:right;
}

#wachtwoord {
	width:170px;
	float:right;
}

.input {
	width:170px;
	float:right;
}

#link-inlog {float:right;}


/******************************** index.html *********************************/
.game {
	margin-left:-20px;
	float:left;
}

.bg { background:url('../images/bg-link.png') no-repeat; height:38px; padding-top:23px; padding-left:20px;}

.bg a {color:#4e4e4e;}
.gwb {
	margin-top:-475px;
	margin-left:10px;

	float:left;
	width:111px;
	height:450px;
}

.mkb {
	margin-top:-478px;
	margin-right:7px;
	float:right;

	width:111px;
	height:450px;
}


.beeld {
	width:111px;
	height:100px;
	padding-bottom:23px;
}

.message  {
		font-size:18px;
		color:#FFF;
		width:980px;
		text-align:center;
		padding-top:220px;
		}

#page {
	width: 100%; 
	overflow:hidden;
	height: auto;
	background: url(../images/body_bg.png) repeat-x left top;
}


#main {
	width: 980px;
	margin: 0 auto;
}

#header {
	background: url(../images/header_logo.png) no-repeat center 10px;
	background-color:#fff;
	width: 980px;
	height: 91px;
}



#menu
	{ 
	width:980px; 
	height: 30px;
	}

	
#menu ul 
	{
	margin:0px;
	padding:0px;
	list-style:none;
	width: 980px;
	height: 30px;
	}

#menu li 
	{

    list-style: none;
	display: inline;
	text-align: center;
	}

#menu li a 
	{
	text-decoration: none;
	display:block;
	float:left;	
	background: url(../images/nav_bg.jpg) no-repeat;
	color: #4e4e4e;
	font-size: 12px;
	line-height:25px;
	width: 147px;
	height: 30px;
	}	
	
#menu li a:hover
	{
	text-decoration: none;
	color: #000;

	}	


/*-----------------------------------------------------------------------------

Position the background image within the left boxes we have created. Use hover states
to show the correct background position for hover states.

A negative margin is used to show the whole tab. As this doesn't work in IE a 
separate stylesheet is used for IE6 and below.

-----------------------------------------------------------------------------*/	


li#home a:link, li#home a:visited {	
	background-position: -3px -0px;
	}
	
li#home a:hover, li#home a:focus {	
	background-position: -3px -40px;
	}
	
li#hoewerkthet a:link, li#hoewerkthet a:visited {	
	background-position: -150px 0px;
	width:128px;
	padding-right:10px;
	}
	
li#hoewerkthet a:hover, li#hoewerkthet a:focus {	
	background-position: -140px -120px;
	width:147px;
	margin-left: -9px;
	padding-right:0px;
	}	
	
li#prijzen a:link, li#prijzen a:visited {	
	background-position: -150px 0px;
	width:128px;
	padding-right:10px;
	}
	
li#prijzen a:hover, li#prijzen a:focus {	
	background-position: -140px -120px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
	}
	
li#actievoorwaarden a:link, li#actievoorwaarden a:visited {	
	background-position: -150px 0px;
	width:128px;
	padding-right:10px;
	}
	
li#actievoorwaarden a:hover, li#actievoorwaarden a:focus {	
	background-position: -140px -120px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
	}	

li#waarom a:link, li#overons a:visited {	
	background-position: -150px 0px;

	padding-right:10px;
	}
	
li#waarom a:hover, li#overons a:focus {	
	background-position: -140px -120px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
	}
li#waarom a {
	background-position: -150px 0px;
	width: 128px;	
}

li#service a:link, li#service a:visited {	
	background-position: -150px 0px;
	width:128px;
	padding-right:10px;
	}
	
li#service a:hover, li#service a:focus {	
	background-position: -140px -120px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
	}	

li#nieuws a:link, li#nieuws a:visited {	
	background-position: -150px 0px;
	width:128px;
	padding-right:10px;
	}
	
li#nieuws a:hover, li#nieuws a:focus {	
	background-position: -140px -120px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
	}

li#contact a:link, li#contact a:visited {	
	background-position: -840px 0px;
	width: 126px; /*width:132px;*/
	padding-right:8px;
	}
	
li#contact a:hover, li#contact a:focus {	
	background-position: -830px -721px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
	}
	


/*-----------------------------------------------------------------------------

Set the on states using the body id.

-----------------------------------------------------------------------------*/	


#home-page li#home a:link, #home-page li#home a:visited {	
	background-position: -3px -40px;
	color:#e11211;
	}

#home-page li#hoewerkthet a:hover, #home-page li#hoewerkthet a:focus {	
	background-position: -140px -80px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
	}


/* -- hoe werkt het -- */

#hoewerkthet-page li#hoewerkthet a:link, #hoewerkthet-page li#hoewerkthet a:visited {	
	background-position: -140px -120px;
	width:147px;
	margin-left: -9px;
	padding-right:0px;
	color:#e11211;
	}

#hoewerkthet-page li#home a:link, #hoewerkthet-page li#home a:visited {	
	background-position: -3px -120px;
	color:#000;
	}

#hoewerkthet-page li#home a:hover, #hoewerkthet li#home a:focus {	
	background-position: -3px -160px;
	width: 147px;
	overflow:auto;
	position:relative;
	margin-left: 0px;
	padding-right:0px;
	}

#hoewerkthet-page li#actievoorwaarden a:hover, #hoewerkthet li#actievoorwaarden a:focus {	
	background-position: -140px -80px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
	}

/* -- prijzen -- actievoorwaarden -- */



#prijzen-page li#prijzen a:link, #prijzen-page li#prijzen a:visited {	
	background-position: -140px -120px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
	color:#e11211;
	}
	
#actievoorwaarden-page li#actievoorwaarden a:link, #actievoorwaarden-page li#actievoorwaarden a:visited {	
	background-position: -140px -120px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
	color:#e11211;
	}	

#actievoorwaarden-page li#hoewerkthet a:link, #actievoorwaarden-page li#hoewerkthet a:visited {	
	background-position: -150px -240px;
	}

#actievoorwaarden-page li#hoewerkthet a:hover, #actievoorwaarden li#hoewerkthet a:focus {	
	background-position: -140px -280px;
	width: 147px;
	overflow:auto;
	position:relative;
	margin-left: -9px;
	padding-right:0px;
	}

#actievoorwaarden-page li#waarom a:hover, #actievoorwaarden li#waarom a:focus {	
	background-position: -140px -80px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
	}

/* -- overons --pinnen-waarom */

#overons-page li#overons a:link, #overons-page li#overons a:visited {	
	background-position: -140px -120px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
	color:#e11211;
	}
	
#waarom-page li#waarom a:link, #waarom-page li#waarom a:visited {	
	background-position: -145px -120px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
	color:#e11211;
	}	

#waarom-page li#actievoorwaarden a:link, #waarom-page li#actievoorwaarden a:visited {	
	background-position: -290px -360px;
	}

#waarom-page li#actievoorwaarden a:hover, #waarom li#actievoorwaarden a:focus {	
	background-position: -280px -400px;
	width: 147px;
	overflow:auto;
	position:relative;
	margin-left: -9px;
	padding-right:0px;
	}
	
#waarom-page li#actievoorwaarden a:link, #waarom-page li#actievoorwaarden a:visited {	
	background-position: -290px -360px;
	}

#waarom-page li#actievoorwaarden a:hover, #waarom-page li#actievoorwaarden a:focus {	
	background-position: -280px -400px;
	width: 147px;
	overflow:auto;
	position:relative;
	margin-left: -9px;
	padding-right:0px;
	}	

#waarom-page li#nieuws a:hover, #waarom-page li#nieuws a:focus {	
	background-position: -145px -80px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
	}

/* -- service --  */

#service-page li#service a:link, #service-page li#service a:visited {	
	background-position: -140px -120px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
	color:#e11211;
	}

#service-page li#nieuws a:link, #service-page li#nieuws a:visited {	
	background-position: -425px -480px;
	}

#service-page li#nieuws a:hover, #service li#nieuws a:focus {	
	background-position: -415px -520px;
	width: 147px;
	overflow:auto;
	position:relative;
	margin-left: -9px;
	padding-right:0px;
	}

#service-page li#contact a:hover, #service li#contact a:focus {	
	background-position: -140px -80px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
	}

/* -- nieuws -- faq */

#nieuws-page li#nieuws a:link, #nieuws-page li#nieuws a:visited {	
	background-position: -140px -120px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
	color:#e11211;
	}

#nieuws-page li#service a:link, #nieuws-page li#service a:visited {	
	/*background-position: -570px -600px;*/
	}

/*#nieuws-page li#service a:hover, #nieuws li#service a:focus {	
	background-position: -560px -640px;
	width: 147px;
	overflow:auto;
	position:relative;
	margin-left: -9px;
	padding-right:0px;
	}*/
	
#nieuws-page li#waarom a:hover, #nieuws-page li#waarom a:focus {	
	background-position: -416px -520px;
	width: 147px;
	overflow:auto;
	position:relative;
	margin-left: -9px;
	padding-right:0px;
	}

#nieuws-page li#service a:hover, #nieuws-page li#service a:focus {	
	background-position: -140px -80px;
	width: 147px;
	margin-left: -9px;
	padding-right:0px;
}

/* -- contact -- */

#contact-page li#contact a:link, #contact-page li#contact a:visited {	
	background-position: -830px -722px;
	width: 149px;
	margin-left: -9px;
	padding-right:0px;
	color:#e11211;
	}

#contact-page li#service a:hover, #contact-page li#service a:focus {	
	background-position: -690px -760px;
	width: 147px;
	overflow:auto;
	position:relative;
	margin-left: -9px;
	padding-right:0px;
}


	
/*-----------------------------------------------------------------------------

Styles for the demo page

-----------------------------------------------------------------------------*/


#content{
	margin:0px;
	padding:0px;
}


#content .left{
	float: left;
	width: 260px;
	margin-top: 2px;
}


#content .right{
	float: left;
	width: 250px;
	margin-top: 2px;
}


#content .middle .top { width:465px; height:10px; display:block; background:url(../images/middle-block-bg-top.png) no-repeat left top; }

#content .middle .txt { width:425px; height:auto; display:block; overflow:hidden; background:url(../images/middle-block-bg.png) repeat-y left top; padding:0 20px; }

#content .middle .bottom { width:465px; height:10px; display:block; background:url(../images/middle-block-bg-bottom.png) no-repeat left top; }

#content .middle {

            float: left;

            color:#4e4e4e;

            width: 465px;


            background-color:#f5f5f5;

            margin-top:2px;

            display:block;

}

.link {
	text-decoration:none;
	color:#333333;
	}

#hans {

	width: 461px;
	height: 239px;
}


#content .middle .box_middle p{
	padding:0px;
	margin:0px;
	color: #4e4e4e;
	padding-left: 20px;
	padding-bottom: 50px;
	height: 100%;
}

#content .middle .box_middle_top {
	display:block;
	width: 580px;
	height: 10px;
	background: url(../images/content_top.png) no-repeat left top;
}


#content .middle .box_middle_bottom {
	display:block;
	width: 580px;
	height: 10px;
	background: url(../images/content_bottom.png) no-repeat left top;
}


#content .middle h1 {
	margin:0px;
	padding:0px;
	display: block;
	font-size: 16px;
	width: 192px;
	height: 31px;
	color: #929292;
	line-height: 30px;
	padding-left: 20px;

}

#content .middle .box_middle h2 {
	font-size: 12px;
	color: #df0100;
}


#content .left .box {
	/*background: url(../images/block_bg.png) no-repeat left 31px;*/
	background: url(../images/block_bg_2.png) repeat-y;
	color:#df0100;
	width: 257px;
	/*height: 257px;*/
	margin-bottom:5px;
}

#content .left .box p, #content .left .box h2, #content .right .box p, #content .right .box h2 {
	margin:0px;
	padding:0px;
	padding-left:10px;
}

#content .left .box p, #content .right .box p{
	margin:0px;
	padding:15px;
	display: block;
	padding-right: 20px;
	padding-top: 10px;
	line-height: 19px;;
	color:#4e4e4e;
	width: 210px;
}
#content .left .boxbottom {
	width: 257px;
	height:11px;
	display:block;
	background: url(../images/block_bg.png) no-repeat left bottom;	
}

#content .right .boxbottom {
	width: 257px;
	height:11px;
	display:block;
	background: url(../images/block_bg_r.png) no-repeat left bottom;	
}

#content .left .box p a, #content .right .box p a{
	color:#df0100;
}



#content .right .box {
	padding: 0px;
	margin: 0px; 
	background: url(../images/block_bg_r_2.png) repeat-y;
	color:#4E4E4E;
	width: 257px;
	padding-right: 10px;
	margin-bottom: 5px;
}

#content .right .box p span{
	font-size: 16px;
	font-weight: bold;	
}


#content .left h2 {
	margin:0px;
	padding:0px;
	display: block;
	font-size: 14px;
	background: url(../images/h2_bg.png) no-repeat left top;
	width: 257px;
	height: 32px;
	color: #929292;
	line-height: 34px;
	padding-left: 10px;

}

#content .left .orange h2 {
	background: url(../images/h2_bg_orange.png) no-repeat left top;
}

#content .left .green h2 {
	background: url(../images/h2_bg_green.png) no-repeat left top;
}

#content .right h2 {
	margin:0px;
	padding:0px;
	display: block;
	font-size: 14px;
	background: url(../images/h2_bg_r.png) no-repeat left top;
	width: 257px;
	height: 32px;
	color: #929292;
	line-height: 34px;
}


#content .right .box h2 {
	padding-left: 15px;
}

#content .right .box p {
	padding-left: 15px;
}

.footer {
	margin:0px;
	padding:0px;
	width: 988px; 
	position: relative; 
	height:40px;
	left: 50%; 
	margin: 30px 0px 0px -494px; 
	color: #cdcdcd; 
	clear: both;
	background: url(../images/footer_bg.png) no-repeat left top;
}
.footer2 {
	margin:0px;
	padding:0px;
	width: 988px; 
	position: relative; 
	height:40px;
	left: 50%; 
	margin: 10px 0px 0px -494px; 
	color: #cdcdcd; 
	clear: both;
	text-align:center;
	font-size:11px;
}
.footer2 a {color:#b1b1b1;}
.footer2 p {color:#b1b1b1;}
.footer .copy {
	padding:0px;
	position: absolute; 
	margin: 12px 0px 0px 14px; 
	font-size:10px;
}

.footer .copy a{
	text-decoration:none; 
	color:#cdcdcd; 
	font-size: 10px;
}
.footer .copy a:hover{
	text-decoration:none; 
	color:#cdcdcd; 
	font-size: 10px;
}

.footer .creator {
	padding:0px;
	position: absolute; 
	margin: 12px 0px 0px 790px; 
	width: 210px; 
	font-size: 10px;
}

.footer .creator a{
	text-decoration:none; 
	color:#cdcdcd; 
	font-size: 10px;
}
.footer .creator a:hover{
	text-decoration:none; 
	color:#cdcdcd; 
	font-size: 10px;
}

.bttn_vorige{
	width: 72px;
	height: 20px;
	border: 0px;
	margin-top: 20px;
	margin-bottom: 20px;
	margin-left: 20px;
	background: url(../images/bttn_vorige.png) no-repeat top left;
	text-align: left;
}


.bttn_bestel{
	width: 72px;
	height: 20px;
	border: 0px;
	margin-top: 20px;
	margin-bottom: 20px;
	margin-left: 20px;
	background: url(../images/bttn_bestellen.png) no-repeat top left;
	text-align:right;
}

.bttn_verstuur{
	width: 72px;
	height: 20px;
	border: 0px;
	margin-top: 20px;
	margin-bottom: 20px;
	background: url(../images/bttn_verstuur.png) no-repeat top left;
}


.bttn_afronden{
	width: 127px;
	height: 20px;
	border: 0px;
	margin-top: 20px;
	margin-bottom: 20px;
	margin-left: 20px;
	background: url(../images/bttn_bestelling-afronden.png) no-repeat top left;
	float:right;
}

.frm_nav {
	width: 520px;
	text-align: right;
}

form img{
	vertical-align: middle;
}

form .frm_tbl td{
	height: 22px;
	width: 200px;
}

form .lijst td{
	height: 50px;
}



.field {
	width: 170px;
	height: 13px;
	font-size: 11px;
}

.field2 {
	width: 400px;
	height: 13px;
	font-size: 11px;
}

.requiredfield { 
	width: 170px;
	height: 13px;
	font-size: 11px;
}

.invalidfield { 
	color: #666666; 
	background-color:#f6c8cb; 
	border: 1px solid #CCCCCC; 
	width: 170px;
	height: 13px;
	font-size: 11px;
}

.smallfield {
	width: 40px;
	font-size: 11px;
}

/******************************** jquery slider *********************************/

.scroller {
	background: url(../images/slide_bg.png) no-repeat left top;
	float: left;
	display: block;
	height: 144px;
	width: 980px;
}
.back {margin: 0px; z-index: 9; position: absolute;}
.forward {margin: 0px 0px 0px 953px; position: absolute;}
div.scrollable {width: 926px; height: 95px; margin-left: 27px; margin-top:25px; position: relative; overflow:hidden;}
div.items {width: 20000em; position: absolute; clear: both; margin: 0px 0px 0px 0px;}
div.scrollable div.items div {float: left; width: 185px; text-align: center; border-right: 1px solid #d9d9d9;}
.disabled {visibility: hidden !important;}
.activated {visibility: visible !important;}



/*

#products{
	display:block;
	height:150px;
	padding-top: 15px;
	width:980px;
}
#products #slider {
	background: url(../images/slide_bg.png) repeat-x left top;
	float: left;
	display: block;
	height: 100px;
	width: 980px;
	margin-left: 27px;
	margin-right: 27px;
}

#slider ul, #slider li{
	margin:0;
	padding:0;
	list-style:none;
	width:100px;
	padding-top: 12px;
	padding-left: 12px;
	padding-right: 12px;
	}

#slider, #slider li{ 
		width:925px;
		height:145px;
		overflow:hidden; 
	}

span#prevBtn{}
span#nextBtn{}	
span#prevId{}
span#prevId img{float: left;}




	#prevBtn, #nextBtn,
	#slider1next, #slider1prev{ 
		display:block;
		width:30px;
		height:77px;
		position:absolute;
		top:270px;
		z-index:1000;
		}	

	#nextBtn, #slider1next{ 
		position: absolute;
		float:right;
		right: 11%;
		}	

													
	#prevBtn a, #nextBtn a,
	#slider1next a, #slider1prev a{  
		display:block;
		position:relative;
		width:27px;
		height:144px;
		background:url(../images/bttn_slide_left.png) no-repeat 0 0;	
		}	
	#nextBtn a, #slider1next a{ 
		background:url(../images/bttn_slide_right.png) no-repeat 0 0;	
		}	
		
*/
#sfeerbeeld {background:url(../images/main_img.jpg) no-repeat;display:block;width:462px;height:476px;margin-top:2px;}
#film {margin-left:-30px; padding-top:15px;}
.div-lesmateriaal {width:423px; height:115px; background:#FABEBE; margin-top:15px; margin-bottom:15px; border:#DF0100 1px solid;}
.div-lesmateriaal:hover {cursor:pointer}
img.btn-lesmateriaal {margin-top:20px; margin-left:20px;}
p.lesmateriaal {width:290px; margin-left:120px; margin-top:-70px; vertical-align:middle; font-weight:bold;}
.educatie-film {background:#FABEBE; margin-top:15px; margin-bottom:15px; border:#DF0100 1px solid;}
#title-inlog {text-align:center; margin-top:40px}
.lesstof {color:#595959;}