/************************************************************************************************/
/*template*/
/************************************************************************************************/
*{margin:0;padding:0; font-family:"Arial", Helvetica, sans-serif; font-size:12px; color:#322c15;}
img{border:0px;}
div.clear{clear:both; font-size:0px;}
html, body{background:#4e3b17; height:100%;}
html {
	 overflow:     -moz-scrollbars-vertical; 
}
div.right_fix{position:absolute; top:0; right:0; background:url(../images/background_right.png) repeat-x; width:50%; height:592px;}
div.right_fix2{position:absolute; top:0; right:0; background:url(../images/gradient_right.png) repeat-x; width:50%; height:400px;}

/*background*/
.main_top{background:url(../images/background.png) repeat-x;}
.gradient_back{background:#876815; min-height:100%; height:100%;}


.gradient_top{position:relative; z-index:1; background:#eee9c3  url(../images/gradient_top.png) repeat-x;}
.gradient_bottom{position:relative; z-index:1; background:url(../images/gradient_bottom.png) repeat-x bottom;}


/************************************************************************************************/
/*container*/
/************************************************************************************************/
#container{position:relative; z-index:1;}
#container.main{position:relative; z-index:1; background:url(../images/gradient_background.jpg) no-repeat center top;}
#container.subpage{position:relative; z-index:1; background:url(../images/gradient_repeat.png) repeat-y center;}
#container.subpage .top{position:relative; z-index:1; background:url(../images/gradient_middle_top.jpg) no-repeat center top;}
#container.subpage .bottom{position:relative; z-index:1; background:url(../images/gradient_middle_bottom.jpg) no-repeat center bottom; padding-bottom:9px;}
#container .content{position:relative; z-index:1; margin:auto; width:960px;}

/************************************************************************************************/
/*container*/
/************************************************************************************************/
.relative {position:	relative;}
.absolute {position: absolute; z-index:1;}

div.banner1 {top: 30px;left: 280px;}
div.banner2 {top: 80px;left: 800px;}
/************************************************************************************************/
/*top*/
/************************************************************************************************/
#top{position:relative; height:123px;}
#top.stroke{border-bottom:1px solid #c7a858}
#top h1 a{position:absolute; top:22px; left:0; display:block; background:url(../images/logo.png) no-repeat; width:255px; height:86px; text-indent:-6000px;}

/*login*/
#top .login{position:absolute; top:46px; right:0; font-size:11px;}

#top .login span{position:absolute; top:-15px; display:block;}
#top .login span.username{left:3px;}
#top .login span.password{left:153px;}

#top .login input{background:#e1ce63; border:1px solid #857532; margin-right:7px; padding:2px; color:#322c15; width:135px;}
#top .login a{background:#322c15; border:none; padding:3px 6px 3px 6px; color:#fff; text-decoration:none;}
#top .login a:hover{background:#fff6b6; color:#4c3606;}
#top .login a.extend{margin-right:7px; padding-right:38px;}


/************************************************************************************************/
/*middle*/
/************************************************************************************************/
/*main*/
#middle{padding-top:72px; }

/*box*/
#middle.main .box{float:left; padding-bottom:41px;}
#middle.main .box h2{text-indent:-6000px;}
#middle.main .box a{display:block; padding:241px 17px 0px 17px; color:#866c35; text-decoration:none; width:158px; height:50px;}
#middle.main .box a:hover{color:#322c15;}

#middle.main .spelen{background: url(../images/play_back.png) no-repeat bottom;}
#middle.main .spelen a{background:url(../images/play.png) no-repeat;}
#middle.main .spelen a:hover{background:url(../images/play_over.png) no-repeat;}

#middle.main .leren{background: url(../images/learn_back.png) no-repeat bottom;}
#middle.main .leren a{background:url(../images/learn.png) no-repeat;}
#middle.main .leren a:hover{background:url(../images/learn_over.png) no-repeat;}

#middle.main .ontmoeten{background: url(../images/meet_back.png) no-repeat bottom;}
#middle.main .ontmoeten a{background:url(../images/meet.png) no-repeat;}
#middle.main .ontmoeten a:hover{background:url(../images/meet_over.png) no-repeat;}

#middle.main .binden{background: url(../images/bind_back.png) no-repeat bottom;}
#middle.main .binden a{background:url(../images/bind.png) no-repeat;}
#middle.main .binden a:hover{background:url(../images/bind_over.png) no-repeat;}

#middle.main .fitvoelen{background: url(../images/feel_fit_back.png) no-repeat bottom; margin-right:-3px;}
#middle.main .fitvoelen a{background:url(../images/feel_fit.png) no-repeat;}
#middle.main .fitvoelen a:hover{background:url(../images/feel_fit_over.png) no-repeat;}

/*subpage*/
#middle.subpage{position:relative; padding-top:51px;}


/************************************************************************************************/
/*left*/
/************************************************************************************************/
#left{float:left; width:174px;}
#left ul{padding-bottom:10px; list-style:none;}
#left ul li a.menu{display:block; width:174px; height:40px; text-indent:-6000px;}
#left ul li ul{display:inline;}
#left ul li ul li{display:block; margin-left:40px; padding:4px 13px 2px 13px;}
#left ul li ul li a{background:url(../images/arrow_black.png) no-repeat center right; padding-right:12px; color:#322c15; font-weight:bold; text-decoration:none; width:106px;}

#left ul.yellow li ul li{border-bottom:1px solid #e3cc2e;}
#left ul.yellow li ul li a:hover{background:url(../images/arrow_yellow.png) no-repeat right; color:#bfa200;}

#left ul.spelen li ul li{border-bottom:1px solid #b7a3c8;}
#left ul.spelen li ul li a:hover{background:url(../images/arrow_pink.png) no-repeat right; color:#e0119d;}

#left ul.leren li ul li{border-bottom:1px solid #b7a3c8;}
#left ul.leren li ul li a:hover{background:url(../images/arrow_purple.png) no-repeat right; color:#7d5cc6;}

#left ul.ontmoeten li ul li{border-bottom:1px solid #b0ea84;}
#left ul.ontmoeten li ul li a:hover{background:url(../images/arrow_green.png) no-repeat right; color:#69be28;}

#left ul.binden li ul li{border-bottom:1px solid #ffb675;}
#left ul.binden li ul li a:hover{background:url(../images/arrow_orange.png) no-repeat right; color:#ff7900;}

#left ul.fitvoelen li ul li{border-bottom:1px solid #88c9fd;}
#left ul.fitvoelen li ul li a:hover{background:url(../images/arrow_blue.png) no-repeat right; color:#0073cf;}

#left ul.spelen li a.menu{background:url(../images/button_play.png) no-repeat;}
#left ul.spelen li a.menu:hover, #left ul.spelen li.active a.menu{background:url(../images/button_play_active.png) no-repeat;}
#left ul.leren li a.menu{background:url(../images/button_learn.png) no-repeat;}
#left ul.leren li a.menu:hover, #left ul.leren li.active a.menu{background:url(../images/button_learn_active.png) no-repeat;}
#left ul.ontmoeten li a.menu{background:url(../images/button_meet.png) no-repeat;}
#left ul.ontmoeten li a.menu:hover, #left ul.ontmoeten li.active a.menu{background:url(../images/button_meet_active.png) no-repeat;}
#left ul.binden li a.menu{background:url(../images/button_bind.png) no-repeat;}
#left ul.binden li a.menu:hover, #left ul.binden li.active a.menu{background:url(../images/button_bind_active.png) no-repeat;}
#left ul.fitvoelen li a.menu{background:url(../images/button_feel_fit.png) no-repeat;}
#left ul.fitvoelen li a.menu:hover, #left ul.fitvoelen li.active a.menu{background:url(../images/button_feel_fit_active.png) no-repeat;}
#left ul.about li a.menu{background:url(../images/button_about.png) no-repeat;}
#left ul.about li a.menu:hover, #left ul.about li.active a.menu{background:url(../images/button_about_active.png) no-repeat;}
#left ul.clubs li a.menu{background:url(../images/button_clubs.png) no-repeat;}
#left ul.clubs li a.menu:hover, #left ul.clubs li.active a.menu{background:url(../images/button_clubs_active.png) no-repeat;}
#left ul.trainers li a.menu{background:url(../images/button_trainers.png) no-repeat;}
#left ul.trainers li a.menu:hover, #left ul.trainers li.active a.menu{background:url(../images/button_trainers_active.png) no-repeat;}
#left ul.users li a.menu{background:url(../images/button_users.png) no-repeat;}
#left ul.users li a.menu:hover, #left ul.users li.active a.menu{background:url(../images/button_users_active.png) no-repeat;}


/************************************************************************************************/
/*right*/
/************************************************************************************************/
#right{position:relative; float:right; background:url(../images/box_background.png) repeat-y; padding:16px 20px 16px 20px; width:728px;min-height: 200px;}
#right.subpage2{background:url(../images/box_background2.png) repeat-y;}
#right .box_bottom{position:absolute; bottom:-4px; left:0; z-index:10; background:url(../images/box_bottom.gif) no-repeat; width:768px; height:4px;}
#right .box_bottom2{background:url(../images/box_bottom2.gif);}

div.tab h2{position:absolute; top:-41px; left:0; background:url(../images/box_tab.png) no-repeat; padding:9px 20px 20px 20px; color:#322c15; font-size:29px; line-height: 42px; width:100%;}
div.tab-subpage2 h2{position:absolute; top:-41px; left:0; background:url(../images/box_tab2.png) no-repeat; padding:9px 20px 20px 20px; color:#322c15; font-size:29px; line-height: 42px; width:100%;}
#right h3{margin-bottom:23px; font-size:20px;}
#right h4{margin:16px 0px 3px 0px;}
#right.subpage2 h4{margin-top:0px;}

#right.subpage .left{float:left; margin-right:36px; width:330px;}
#right.subpage .right{float:left; width:362px;}
#right.subpage2 .left{float:left; margin-right:36px; width:362px;}
#right.subpage2 .right{float:left; width:330px;}

#right.subpage2 p{margin-bottom:19px;}
#right.subpage2 p.last{margin-bottom:0px;}

#right .item{position:relative;  margin:0px 0px 6px 23px;}
#right .item span.mark{position:absolute; top:0; left:-23px; }
#right .item p{margin-bottom:5px;}
#right .item a.download{float:left; background:url(../images/download.png) no-repeat; margin-right:7px; width:83px; height:17px; text-indent:-6000px;}
#right .item a.download:hover{background:url(../images/download_over.png) no-repeat;}
#right .item a.pdf{background:url(../images/pdf.png) no-repeat 0px 3px; padding:5px 0px 2px 18px; color:#322c15; text-decoration:none; height:10px;}

#right span.mark{border:1px solid #a19681; padding:2px 4px 2px 4px; color:#432d04; font-size:10px;}

#right .legend{margin:22px 0px 3px 0px;}
#right .legend span.mark{margin-left:13px;}

/************************************************************************************************/
/*bottom*/
/************************************************************************************************/
#bottom ul{list-style:none;}
#bottom ul li{float:left;}
#bottom ul li a{position:relative; display:block; background:#e3cc2e; padding:3px 4px 3px 4px; color:#432d04; font-weight:bold; text-decoration:none;}
#bottom ul li a.last {margin-right: 0;}
#bottom ul li a span{position:absolute; top:8px; right:20px; display:block; background:url(../images/arrow.png) no-repeat; width:6px; height:5px;}
#bottom ul li a:hover{background:#fff6b6;}
#bottom ul li a:hover span{background:url(../images/arrow_over.png) no-repeat;}
#bottom ul li.nieuws a{width:128px;}

/************************************************************************************************/
/*footer*/
/************************************************************************************************/
#footer{position:relative;}

/*main*/
#footer.main ul{padding:7px 12px 0px 0px; list-style:none;}
#footer.main ul li{float:right; background:url(../images/bullet.png) no-repeat 6px 6px; padding-left:16px;}

/*subpage*/
#footer{height:30px;}
#footer.subpage ul{padding:19px 8px 0px 0px; list-style:none;}
#footer.subpage ul li{float:right; background:url(../images/bullet2.png) no-repeat 6px 6px; padding-left:16px;}

#footer ul li.first{background:none; padding:0px;}
#footer ul li a{color:#e3cc2e; font-size:11px; text-decoration:none;}
#footer ul li a:hover{color:#fff6b6;}




/************************************************************************************************/
/*aanpassingen 9 december*/
/************************************************************************************************/

#bottom ul li.over-tennis a{margin-right: 8px; width:170px;}
#bottom ul li.nieuws a{margin-right: 9px; width:100px;}
#bottom ul li.motivatie-verenigingen a{margin-right: 9px; width:205px;}
#bottom ul li.motivatie-trainers a{margin-right: 9px; width:180px;}
#bottom ul li.motivatie-actieve-leden a{width:230px;}


#left ul.nieuws li a.menu{background:url(../images/button_nieuws.png) no-repeat;}
#left ul.nieuws li a.menu:hover, #left ul.nieuws li.active a.menu{background:url(../images/button_nieuws_active.png) no-repeat;}

div.nieuwsitem h5 {
	color:#a0a0a0;
	font-size:0.80em;
	padding-bottom:5px;
}

div.nieuwsitem {
	width: 340px;
	height: 150px;
}

div.nieuwsitem-left {
	float: left;
	margin: 0 8px 0 0;
}

div.footer {
	float: left;
	width: 715px;
	padding: 5px 5px 5px 0;
}

a.pagenumbers, a.pagenumbers:visited {
	background-color: #322c15;
	padding: 5px;
	margin-right: 5px;
	color: #ffffff;
	text-decoration: none;
	font-weight: bold;
}

a.pagenumbers:active, a.pagenumbers:hover {
	background-color: #e3cc2e;
	color: #322c15;	
}

div.footer a.active {
	background-color: #e3cc2e;
	color: #322c15;
}

a.leesmeer, a.leesmeer:visited {
	background: url(../images/arrow_brown.png) no-repeat scroll 65px 6px;
	padding: 0 20px 0 0;
	margin: 0 0 0 0;
	font-weight: bold;
	text-decoration: none;
	color:#432d04;
	line-height: 40px;

}

a.leesmeer:active, a.leesmeer:hover {color:#000;}

/************************************************************************************************/
/* NIEUWE HOMEPAGE!!!! */
/************************************************************************************************/

div.header {position:absolute; top:20px; width: 410px; right:0; font-size:11px; text-align:right;}
div.header ul li a:hover {color: #fff6b6;}
div.header a.extend{background:#322c15; border:none; padding:3px 10px 3px 10px; color:#fff; text-decoration:none; margin-right:7px;}
div.header a.extend:hover{background:#fff6b6; color:#4c3606;}
div.header input{background:#e1ce63; color: #8c845a; border:1px solid #857532; margin:0 7px 0 0; padding: 1px 2px 3px 5px; width:130px; height:13px;}
div.header ul{padding:7px 12px 0px 0px; list-style:none;}
div.header ul li{float:right; background:url(../images/bullet-geel.gif) no-repeat 6px 6px; padding-left:16px;}
div.header ul li.last{background: none;}
div.header ul li a{font-size: 11px; text-decoration: none;}
div.search {margin-top: 50px;}
div.logout {margin-top: 10px;margin-bottom: -18px;}

h1.purple {font-size: 18px; color: #7d5cc6; margin-bottom: 16px;}
h2 {font-size: 17px; margin-bottom: 12px;}
p.intro {font-size: 12px; font-style: italic; margin-bottom: 10px;}
p {margin-bottom: 27px;}

.homepage-news h2 {margin-bottom: 2px;}
.homepage-news p {margin-bottom: 4px;}
.homepage-news {margin-bottom: 20px;}

a.arrow {
	font-weight: bold;
	text-decoration: none;
	padding-right: 12px;
	background: transparent url(../images/arrow.gif) no-repeat scroll right 5px;
}

div.middle {margin-top: 20px;}
div.text {padding-left: 13px;}

div.nav-home {position:relative; z-index:100; width: 960px;}

ul.subnav li{padding:0; margin: 0; width: 144px; list-style: none; border-bottom: #000 1px solid;}
ul.subnav li a{background:url(../images/arrow_black.png) no-repeat center right; border: #ff0 1px solid; padding: 0; margin: 0; color:#322c15; font-weight:bold; text-decoration:none;}

.nav-home ul {list-style-type:none;}
.nav-home ul ul {width:186px;}
.nav-home li {float:left;width:186px;position:relative;}
.nav-home li.spelen {margin-right:7px;}
.nav-home li.leren {margin-right:7px;}
.nav-home li.ontmoeten {margin-right:8px;}
.nav-home li.binden {margin-right:8px;}
.nav-home li.fitvoelen {margin-right:0px;}

div.nav-home ul li ul{display:inline;}
div.nav-home a {display:block; text-decoration:none; width:186px; height:40px; float: left; list-style:none;}
div.nav-home a.nav-home-spelen {background:url(../images/button_spelen_home.png) no-repeat;}
div.nav-home a.nav-home-spelen:hover, div.nav-home a.nav-home-spelen-true {background:url(../images/button_spelen_home_active.png) no-repeat;}
div.nav-home a.nav-home-leren {background:url(../images/button_leren_home.png) no-repeat;}
div.nav-home a.nav-home-leren:hover, div.nav-home a.nav-home-leren-true {background:url(../images/button_leren_home_active.png) no-repeat;}
div.nav-home a.nav-home-ontmoeten {background:url(../images/button_ontmoeten_home.png) no-repeat;}
div.nav-home a.nav-home-ontmoeten:hover, div.nav-home a.nav-home-ontmoeten-true {background:url(../images/button_ontmoeten_home_active.png) no-repeat;}
div.nav-home a.nav-home-binden {background:url(../images/button_binden_home.png) no-repeat;}
div.nav-home a.nav-home-binden:hover, div.nav-home a.nav-home-binden-true {background:url(../images/button_binden_home_active.png) no-repeat;}
div.nav-home a.nav-home-fitvoelen {background:url(../images/button_fitvoelen_home.png) no-repeat;}
div.nav-home a.nav-home-fitvoelen:hover, div.nav-home a.nav-home-fitvoelen-true {background:url(../images/button_fitvoelen_home_active.png) no-repeat;}

/* verstopt niveau's (position:absolute zodat er geen ruimte gebruikt wordt) */
.nav-home ul ul {position:absolute; height:0; top:40px; left:40px; width:146px;}

/* stijl tabel voor IE, neemt geen ruimte in beslag */
.nav-home table {position:absolute; top:0; left:0; border-collapse:collapse;}

/* stijl niveau 2 links */
.nav-home ul ul a, .nav-home ul ul a:visited {font-weight: bold; background:#fff url(../images/arrow_black.gif) no-repeat scroll 120px 7px; color:#000; height:auto; line-height:1em; padding:5px 10px; width:124px;border-right: 1px solid #000;border-bottom: 1px solid #000;border-left: 1px solid #000;}
.nav-home ul ul a.spelen, .nav-home ul ul a.spelen:visited {border-right: 1px solid #e0119d; border-bottom: 1px solid #e0119d; border-left: 1px solid #e0119d;}
.nav-home ul ul a.leren, .nav-home ul ul a.leren:visited {border-right: 1px solid #7d5cc6;border-bottom: 1px solid #7d5cc6;border-left: 1px solid #7d5cc6;}
.nav-home ul ul a.ontmoeten, .nav-home ul ul a.ontmoeten:visited {border-right: 1px solid #69be28;border-bottom: 1px solid #69be28;border-left: 1px solid #69be28;}
.nav-home ul ul a.binden, .nav-home ul ul a.binden:visited {border-right: 1px solid #ff7900;border-bottom: 1px solid #ff7900;border-left: 1px solid #ff7900;}
.nav-home ul ul a.fitvoelen, .nav-home ul ul a.fitvoelen:visited {border-right: 1px solid #0073cf;border-bottom: 1px solid #0073cf;border-left: 1px solid #0073cf;}

/* stijl niveau 1 links:hover */
.nav-home a.spelen:hover, .nav-home ul ul a.spelen:hover{color:#e0119d; background: white url(../images/arrow_pink.png) no-repeat scroll 120px 7px;}
.nav-home a.leren:hover, .nav-home ul ul a.leren:hover{color:#7d5cc6; background: white url(../images/arrow_purple.png) no-repeat scroll 120px 7px;}
.nav-home a.ontmoeten:hover, .nav-home ul ul a.ontmoeten:hover{color:#69be28; background: white url(../images/arrow_green.png) no-repeat scroll 120px 7px;}
.nav-home a.binden:hover, .nav-home ul ul a.binden:hover{color:#ff7900; background: white url(../images/arrow_orange.png) no-repeat scroll 120px 7px;}
.nav-home a.fitvoelen:hover, .nav-home ul ul a.fitvoelen:hover{color:#0073cf; background: white url(../images/arrow_blue.png) no-repeat scroll 120px 7px;}

div.content-left {
	float: left;
	margin-top: 20px;
	margin-bottom: 25px;
	/*background: transparent url(../images/bg_home_content.png) no-repeat scroll 0 0;*/
	height: 282px;/*311*/
	width: 287px;/*573*/
	padding: 29px 40px 0 246px;
}

div.content-left-flash {
	float: left;
	margin-top: 20px;
	margin-bottom: 25px;
}

div.content-right {
	float: right;
	margin-top: 20px;
	margin-bottom: 25px;
	padding-top: 20px;
	width: 380px;
}

div.banner-left {float: left;}
div.banner-right {float: right;}

div.nav-home ul li ul {display:none;}

.content-home .content-right
{
	margin-top: 2px;
}

fieldset ul
{
	list-style-type: none;
}

