/* 
stylesheet www.svzwolle.nl (basic.css)

INHOUD
1. Reset
2. Default
3. Headings
4. Links
5. Images
6. Layout
7. Branding/Masthead
8. Navigation
9. Leftsidebar
10. Main	
11. Rightsidebar
12. Footer
13. Home
14. 
15. 
18. Pagina navigatie

COLOURS
Yellow = #ffc600
Gray = #4b4b4b


/* 1. Reset 
---------------------------------------------------------------------------------------------------------------------------------------*/
@import url(reset.css);


/* 2. Default
---------------------------------------------------------------------------------------------------------------------------------------*/
body { font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:18px; margin:5px 0; background:#000; color:#333; }

p, ul, dl, ol { margin-bottom:18px; }

ul { list-style:none; line-height:20px; color:#000; float:left; }


/* 3. Headings
---------------------------------------------------------------------------------------------------------------------------------------*/
h1, h2, h3, h4, h5 { color:#000; }

h1 { font-size:18px; margin-bottom:5px; line-height:22px; }

h2 { font-size:16px; margin-bottom:4px;  }

h3 { font-size:14px; margin-bottom:3px; }

h4 { font-size:12px; height:24px; line-height:25px; padding:0 10px; display:block; float:left; margin-bottom:15px; width:460px; background:url(../_img/template/bg_kop.gif) no-repeat; }

h5 { font-size:11px; font-weight:normal; margin-bottom:12px; }

	
/* 4. Links
---------------------------------------------------------------------------------------------------------------------------------------*/
a { text-decoration:none; color:#0287d3; }

a:hover { color:#000; }

a.fll { display:block; float:left; }

a.flr { display:block; float:right; }

h4 a { display:block; color:#000; background:url(../_img/template/bg_kop_link.gif) no-repeat right; }

h5 a { color:#000; }


/* 5. Images
---------------------------------------------------------------------------------------------------------------------------------------*/
img { border:1px solid #000; }

img.fll { float:left; margin-right:15px; }

img.flr { float:right; margin-left:15px; }


/* 6. Layout
---------------------------------------------------------------------------------------------------------------------------------------*/
#wrapper { width:955px; margin:auto;  }

#content { float:left; margin-bottom:5px; background:url(../_img/template/bg_content.gif) repeat-y; }

#leftsidebar { float:left; width:149px; padding-left:1px; }

#main { float:left; padding:25px 10px; width:480px; margin-right:5px; }

*html #main { margin-right:0px; }

#rightsidebar { float:right; width:300px; background:#fff; font-size:11px; padding-bottom:50px; }

#rightsidebar p { margin-bottom:0; }

#rightsidebar img { border:none; }


/* 7. Branding/Masthead
---------------------------------------------------------------------------------------------------------------------------------------*/
#masthead { height:150px; margin-bottom:5px; background:url(../_img/template/masthead.jpg) no-repeat; }

#masthead h1 { margin-bottom:0; }

#masthead h1 a { text-indent:-9000px; height:120px; width:300px; display:block; }

#zoeken { float:right; }
	

/* 8. Navigation
---------------------------------------------------------------------------------------------------------------------------------------*/
#masthead ul { height:30px; line-height:30px; margin-bottom:0; font-size:11px; width:955px; behavior: url(csshover.htc); }
 
#masthead ul li { float:left; border-right:solid 1px #ffc600; text-transform:uppercase; }

#masthead ul li a { color:#FFF; display:block; padding:0 10px; }

#masthead ul li a:hover, #masthead ul li a.active { color:#ffc600; }

#masthead ul li.last { border:none; }

#masthead ul li.exit { float:right; border-top:1px solid #000; border-right:none; height:29px; }

#masthead ul li.exit a { color:#000; padding-right:28px; background:url(../_img/template/arrow_handbal.gif) top right no-repeat #CCC; }

#masthead ul li.exit a:hover { background-color:#FFF; background-position:right -31px; color:#000; }


/* 9. Leftsidebar
---------------------------------------------------------------------------------------------------------------------------------------*/
#leftsidebar ul { margin:0px; list-style:none; line-height:24px; width:148px; float:none;  }

#leftsidebar ul { border-top:1px solid #CCC; margin-top:24px; float:none; }

#leftsidebar ul li { padding:0px; border-bottom:1px solid #CCC; line-height:24px; }

#leftsidebar ul li a { display:block; height:24px; color:#333; padding:0 10px 0 27px; background:url(../_img/template/sidebar_arrow.gif) no-repeat top left; }

#leftsidebar ul li a:hover, #leftsidebar ul li a.active { background-color:#ffc600; background-position:0 -24px; color:#000;  }

#leftsidebar ul ul { margin:0 1px 0 0; border-top:none; background-color:#FFF; border-bottom:1px solid #CCC; float:none; }

#leftsidebar ul ul li { border:none; line-height:22px; }

#leftsidebar ul ul li a { height:22px; background:none; padding-left:29px;  }

#leftsidebar ul ul li a:hover { background:#999; color:#FFF; }

#leftsidebar ul ul li a.active { background:#ccc; color:#333; }

#leftsidebar ul ul ul { border:none; margin:0px;  }

#leftsidebar ul ul ul li a { padding-left:29px; font-weight:normal; }


/* 10. Main
---------------------------------------------------------------------------------------------------------------------------------------*/
#container { float:left; padding:0px 10px 10px; width:460px; }

*html #container { float:left; padding:0px 10px 10px 5px; }

#container h1 { margin-top:10px; }

ul.overzicht  { width:460px; border-top:1px solid #CCC; margin:10px 0 25px 0; float:left; }

ul.overzicht li { float:left; border-bottom:1px solid #CCC; }

ul.overzicht li a { float:left; display:block; width:460px;  padding:10px 0; }

ul.overzicht li a:hover { background:#e5f2f9; }

ul.overzicht li img { float:left; margin:0 20px 0 10px; padding:0; }

ul.overzicht li h3 { margin-top:5px; }

ul.overzicht li p { margin:0; }

h3.headactiviteit {margin-top:0px; }

p.activiteit { margin:0px; line-height:18px; } 

#topnav { border-bottom:1px dashed #000; padding:5px 10px; float:left; width:460px; }

#bottomnav { border-top:1px dashed #000; padding:5px 10px; float:left; width:460px; }


/* 11. Rightsidebar
---------------------------------------------------------------------------------------------------------------------------------------*/
#heteerste, #verslagen { float:left; width:270px; padding:4px 15px 15px 15px; background-color:#FFF; border-bottom:5px #000 solid; }

#rectangle { float:left; width:300px; border-bottom:5px #000 solid; }

#heteerste { text-align:center; padding:0; width:300px; }

#heteerste h5 { float:left; }

#heteerste h1 { clear:left; }

a.compleetprogramma { display:block; height:26px; width:169px; background:url(../_img/template/programma.gif) no-repeat; text-indent:-9999px; margin:auto; }

a.download { display:block; height:26px; width:148px; background:url(../_img/template/download.gif) no-repeat; text-indent:-9999px; margin-bottom:15px; }

a.sponsor { display:block; height:26px; width:148px; background:url(../_img/template/sponsoren.gif) no-repeat; text-indent:-9999px; margin:auto; }

a.compleetprogramma:hover, a.download:hover, a.sponsor:hover { background-position:0 -26px; }

#verslagen { padding-bottom:15px; background:url(../_img/template/bg_wedstrijdverslagen.gif) no-repeat top #fff; }

#sponsorbanners { float:left; width:300px; padding:0; border-bottom:5px #000 solid; }

ul#sponsorbanners li.hoofdsponsor { padding-bottom:15px;  }

ul#sponsorbanners h5 { padding:5px 10px 0px 10px; margin-bottom:0px; }


/* 12. Footer
---------------------------------------------------------------------------------------------------------------------------------------*/
#footer { float:left; width:955px; height:35px; background:url(../_img/template/footer.jpg) no-repeat; margin-bottom:20px; text-align:center; } 

#footer p { font-size:11px; line-height:11px; color:#000; margin-top:14px; }

#footer span.stripe { margin:0 8px; }



/* 13. Home
---------------------------------------------------------------------------------------------------------------------------------------*/
#newsblock { float:left; border-bottom:1px solid #ccc; padding:0 10px 20px; margin-bottom:20px; width:460px; }

#newsheadline { float:left; margin-bottom:20px; width:460px; }

#newsheadline h1 { margin-top:5px; }


ul#newsitems { float:left; list-style:none; margin-bottom:20px; width:460px; clear:both; } 

ul#newsitemsonder { float:left; list-style:none; margin-bottom:0px; width:460px;  }

ul#newsitems li, ul#newsitemsonder li { float:left; margin:0 10px 0 0; width:220px; display:block; }




#smallblock { float:left; width:290px; margin:0 10px 20px 0; }

#smallblock h4 { width:270px; background:url(../_img/template/bg_kop_small.gif) no-repeat; }

#smallblock ul.activities { height:123px; }

.date { color:#000; margin:0 10px; font-weight:bold; width:45px; display:block; float:left; }

.verslagdatum { color:#000; font-weight:bold; width:45px; display:block; float:left;  }

.notfound { margin:0 10px; }

.rssfeed { font-size:11px; margin:-4px 0 0 6px; }

ul.rssfeed li { line-height:16px; padding:4px; border-bottom:1px dashed #999; }

*html .rssfeed { margin:0 0 0 5px; }

#bannerblock { float:left; width:180px; margin-bottom:20px }

#bannerblock img { float:left; margin-bottom:20px; }

.fullbanner { border:none; margin-left:6px; float:left; }

*html .fullbanner { margin-top:20px; }

ul#verslag { margin-bottom:0; }


/* 13. fotos 
---------------------------------------------------------------------------------------------------------------------------------------*/
ul#fotooverzicht li { float:left; margin:0 12px 12px 0; height:101px; width:101px; }

ul#fotooverzicht a img { margin:0; padding:0; border:#0287d3 1px solid; }

ul#fotooverzicht a img:hover { border:#000 1px solid; }


/* 14. links sponsorens
---------------------------------------------------------------------------------------------------------------------------------------*/
ul.list, ul.sponsorenlist, ul.downloadlist  { margin-bottom:20px; padding:6px 0; width:460px; float:left; border-bottom:1px solid #CCC; border-top:1px solid #CCC; }

ul.sponsorenlist { padding:0; border-top:1px solid #CCC; border-bottom:none; }

ul.sponsorenlist li { border-bottom:1px solid #CCC; padding:8px 0; }

ul.list li { width:152px; border:none; padding:0; margin-bottom:0px; float:left; }

#links #container h1, #sponsoren #container h1 { margin-bottom:18px; }


/* 15. Formulieren
---------------------------------------------------------------------------------------------------------------------------------------*/
ol li { float:left; list-style:none; margin-bottom:6px; }

label { float:left; width:130px; color:#333; padding-bottom:0; }

.text { border:1px solid #ccc; background:#fff; padding:2px; height:15px; width:294px; font-family:Arial, Helvetica, sans-serif; color:#333; font-size:12px; }

.area { height:110px; overflow:hidden;  }

.statusok, .statuserror { font-weight:bold; }

.statusok { color:#37bc03; }

.statuserror { color:#F00; }

button { float:right; height:26px; width:132px; background:url(../_img/template/verzend.gif) no-repeat; border:none; text-indent:-9999px; cursor:pointer; }

button:hover { background-position:0 -26px; }


/* 16. STIJL DOOR LEON
---------------------------------------------------------------------------------------------------------------------------------------*/
.hide { display: none; }
	
.show { display: block; }
	
tr.tablehead td { font-weight: bold; }

.schema { width:100% }

.schema td { vertical-align:middle; padding-left:5px; height:24px; }

.datum { width:180px; }

.uitslag { text-align:center; width:50px; }

#container a.compleetprogramma { margin:0 0 24px 0; } 

tr.even { background-color: #FFF; }
	
tr.uneven { background-color: #d9edf8; }
	
tr.uneven_grey { background-color: #F5F5F5; }
	
.stand1e_team { padding: 0px 0px 0px 20px; }
	
.stand1e_score { padding: 0px 10px 0px 0px; color: #000; }


#kantine, #schema { width:460px; }

.next, .prev { width:120px; vertical-align:bottom; padding-bottom:5px; }

.week { text-align:center; vertical-align:bottom; }

.next { text-align:right; }

#schema { border-top:1px solid #CCC; margin-bottom:15px; }

#schema td { padding:10px; background-color:#d9edf8; border-bottom:2px solid #FFF; }

#schema td.tijd { width:100px;  border-right:2px solid #FFF; font-weight:bold; background:#a7d6fa; }

#schema tr.days td { padding:6px 0 5px; border-bottom:1px solid #CCC; background-color:#FFF; }


/* 17. TAB STIJLEN
---------------------------------------------------------------------------------------------------------------------------------------*/
#tabs { display: block; float: left; width: 100%; }
	
a.tab, a.tab_active { display:block; padding:5px 10px 2px 10px; background:url(../_img/template/bg_block_top.gif) repeat-x top; border-right:1px solid #CCC; float: left; font-size:11px; }

a.tab { color:#666; cursor:pointer; }
	
a.tab:hover, a.tab_active { background:#FFF; color:#000; cursor:pointer; }

a.tab:hover { border-bottom:1px solid #CCC; padding-bottom:1px; background:#fafafa; }

.panel { background-color:white; padding:10px 0px 10px 0px;	overflow:auto; clear:left; margin-bottom:5px; }

.game { margin-top:20px; }

.stand { margin-top:5px; }

.stand td { vertical-align:middle; height:20px; }



/* 18. PAGINA NAVIGATIE
---------------------------------------------------------------------------------------------------------------------------------------*/
.underline td { border-bottom:1px solid #CCC; padding-top:10px; }

.underlineeven td { border-bottom:1px dashed #CCC; }

.underlineuneven td { border-bottom:1px dashed #CCC; }


/* 19. Classes
---------------------------------------------------------------------------------------------------------------------------------------*/
.bigimage { margin-bottom:15px; }

.gegevens { margin-top:20px; }

.gegevens h3 { clear:both; width:460px; border-bottom:1px solid #CCC; padding-bottom:8px; margin-bottom:8px; }

.gegevens ul { float:left; width:460px; border-bottom:1px solid #CCC; padding-bottom:8px; }

.gegevens ul li.name { font-weight:bold; margin-top:20px; }

.gegevens ul li.accomodatie { font-weight:bold; margin-top:12px; }

.gegevens li.picture { float:left; margin-right:20px; }

.gegevens ul.sponsoroverzicht { padding:10px 0 10px 0; }

.gegevens ul.sponsoroverzicht li { text-align:center; margin-right:20px; margin-bottom:10px; width:215px; height:120px; border:1px solid #CCCCCC; float:left; }

.gegevens ul.sponsoroverzicht li.last { margin-right:0; float:right; }

.gegevens ul.sponsoroverzicht li table td { height:97px; width:220px; text-align:center; vertical-align:middle; }

.gegevens ul.sponsoroverzicht li img { border:none; }

table.showsponsor { border:1px solid #CCC; width:278px; margin:10px;  }

table.showsponsor td { text-align:center; vertical-align:middle; padding:10px;  }



/* 20. Lightbox
------------------------------------------------------------*/
#jquery-overlay { position:absolute; top:0; left:0; z-index:90; width:100%; height:500px; }
	
#jquery-lightbox { position:absolute; top:0; left:0; width:100%; z-index:100; text-align:center; line-height:0; }
	
#jquery-lightbox a img { border:none; }

#lightbox-container-image-box { position:relative; background-color:#fff; width:250px; height:250px; margin:0 auto; }
	
#lightbox-container-image { padding:10px; }
	
#lightbox-loading { position:absolute; top:40%; left:0%; height:25%; width:100%; text-align:center; line-height:0; }
	
#lightbox-nav { position:absolute; top:0; left:0; height:100%; width:100%; z-index:10; }
	
#lightbox-container-image-box > #lightbox-nav { left:0; }
	
#lightbox-nav a { outline:none; }

#lightbox-nav-btnPrev, #lightbox-nav-btnNext { width:49%; height:100%; zoom:1; display:block; }
	
#lightbox-image { }

#lightbox-nav-btnPrev { left:0; float:left; }

#lightbox-nav-btnNext { right:0; float:right; }

#lightbox-container-image-data-box { font:10px Verdana, Helvetica, sans-serif; background-color:#fff; margin:0 auto; line-height:1.4em; overflow:auto; width:100%; padding:0 10px 0;}
	
#lightbox-container-image-data { padding:0 10px; color:#666; }
	
#lightbox-container-image-data #lightbox-image-details { width:70%; float:left; text-align:left;}
	
#lightbox-image-details-caption { font-weight:bold; }
	
#lightbox-image-details-currentNumber { display:block; clear:left; padding-bottom:1.0em; }
	
#lightbox-secNav-btnClose { width:66px; float:right; padding-bottom:0.7em; }