body { font-size: 62.5%; background: #0e0e0f url(/lib/images/background.png) 0 0 repeat-x; }
body.extranet { background-image: url(/lib/images/background_extranet.png); }

* { font-size: 1em; }
h1 { margin-bottom: 22px; font-size: 3em; font-family: Garamond; font-weight: bold; }
h2 { font-weight: bold; font-size: 1.2em; }

#container { width: 996px; margin: 0 auto; }
#header { position: relative; height: 272px; }
#header .peoples { position: absolute; top: -1px; left: 175px; height: 272px; width: 495px; background: url() 0 0 no-repeat; }
#header .peoples_00 { background-image: url(/lib/images/header_photo_00.png); }
#header .peoples_01 { top: -3px; left: 170px; height: 273px; width: 409px; background-image: url(/lib/images/header_photo_01.png); }
#header .peoples_02 { top: 26px; height: 246px; width: 398px; background-image: url(/lib/images/header_photo_02.png); }
#header .peoples_03 { height: 272px; width: 396px; background-image: url(/lib/images/header_photo_03.png); }
#header .peoples_04 { height: 272px; width: 462px;background-image: url(/lib/images/header_photo_04.png); }
#header .peoples_05 { top: 3px; height: 269px; width: 442px;background-image: url(/lib/images/header_photo_05.png); }
#header .peoples_06 { height: 272px; width: 451px;background-image: url(/lib/images/header_photo_06.png); }
#header .peoples_07 { top: 6px; height: 265px; width: 432px;background-image: url(/lib/images/header_photo_07.png); }
#header .peoples_08 { top: -1px; height: 272px; width: 457px;background-image: url(/lib/images/header_photo_08.png); }

#header .glow { width: 831px; height: 208px; background: url(/lib/images/header_glow.png) 0 0 no-repeat; }
.extranet #header .glow { display: none; }
#header .quote { position: absolute; top: 100px; left: 550px; width: 437px; height: 97px; background: url(/lib/images/header_quote.png) 0 0 no-repeat; }
.extranet #header .quote { top: 170px; left: 630px; background-image: url(/lib/images/header_quote_extranet.png); }
#logo { position: absolute; top: 5px; left: 40px; width: 196px; height: 200px; background: url(/lib/images/header_stars.png) 0 0 no-repeat; }
#logo img { display: block; margin: -6px 0 0 34px; }
#utils { position: absolute; right: 98px; top: 24px; width: 220px; height: 27px; background: url(/lib/images/utils_bg2.png) 0 0 no-repeat; }
#utils ul { overflow: hidden; padding: 5px 12px;}
#utils li { float: left; }
#utils a { display: block; padding: 0 5px; border-right: 1px solid #fff; font-family: Garamond; font-size: 1.4em; text-decoration: none; }
#utils a:hover { text-decoration: underline; }
#utils li.last a { border: 0; }

#menu { position: absolute; bottom: 0; left: 0; padding-left: 50px; }
#menu li { float: left; }
#menu a { display: block; padding: 13px; font-family: Trebuchet MS; font-weight: bold; font-size: 1.4em; text-decoration: none; }

#contentcontainer { background: #181819 url(/lib/images/contentcontainer_bg.png) 0 0 repeat-x; }
#contentcontainer .contentcontainer_wrapper { padding: 57px 58px 30px 109px; background: url() 86px 63px no-repeat; }
#contentcontainer .char_a { background-image: url(/lib/images/chars/char_a.png) !important; }
#contentcontainer .char_b { background-image: url(/lib/images/chars/char_b.png) !important; }
#contentcontainer .char_c { background-image: url(/lib/images/chars/char_c.png) !important; }
#contentcontainer .char_d { background-image: url(/lib/images/chars/char_d.png) !important; }
#contentcontainer .char_e { background-image: url(/lib/images/chars/char_e.png) !important; }
#contentcontainer .char_f { background-image: url(/lib/images/chars/char_f.png) !important; }
#contentcontainer .char_g { background-image: url(/lib/images/chars/char_g.png) !important; }
#contentcontainer .char_h { background-image: url(/lib/images/chars/char_h.png) !important; }
#contentcontainer .char_i { background-image: url(/lib/images/chars/char_i.png) !important; }
#contentcontainer .char_j { background-image: url(/lib/images/chars/char_j.png) !important; }
#contentcontainer .char_k { background-image: url(/lib/images/chars/char_k.png) !important; }
#contentcontainer .char_l { background-image: url(/lib/images/chars/char_l.png) !important; }
#contentcontainer .char_m { background-image: url(/lib/images/chars/char_m.png) !important; }
#contentcontainer .char_n { background-image: url(/lib/images/chars/char_n.png) !important; }
#contentcontainer .char_o { background-image: url(/lib/images/chars/char_o.png) !important; }
#contentcontainer .char_p { background-image: url(/lib/images/chars/char_p.png) !important; }
#contentcontainer .char_q { background-image: url(/lib/images/chars/char_q.png) !important; }
#contentcontainer .char_r { background-image: url(/lib/images/chars/char_r.png) !important; }
#contentcontainer .char_s { background-image: url(/lib/images/chars/char_s.png) !important; }
#contentcontainer .char_t { background-image: url(/lib/images/chars/char_t.png) !important; }
#contentcontainer .char_u { background-image: url(/lib/images/chars/char_u.png) !important; }
#contentcontainer .char_v { background-image: url(/lib/images/chars/char_v.png) !important; }
#contentcontainer .char_w { background-image: url(/lib/images/chars/char_w.png) !important; }
#contentcontainer .char_x { background-image: url(/lib/images/chars/char_x.png) !important; }
#contentcontainer .char_y { background-image: url(/lib/images/chars/char_y.png) !important; }
#contentcontainer .char_z { background-image: url(/lib/images/chars/char_z.png) !important; }

.homepage #content { width: 451px; }
.homepage .paragraph .image { float: none; border: 2px solid #fff; }
.homepage .paragraph .text { width: auto; }

body.evenementen #content { width: 451px; }
body.evenementen #content .paragraph .text { width: 451px; }
body.links #content { width: 451px; }
body.links #content .paragraph .text { width: 451px; }

body.sponsoren #content { width: 280px; }
body.sponsoren #content .paragraph .text { width: 280px; }
body.sponsoren #sidepanel .inner { padding-left: 30px; }
body.contact #content { width: 451px; }
body.contact #content .paragraph .text { width: 451px; }
body.contact #sidepanel .inner { padding-left: 50px; }
body.bestuur #content { width: 300px; padding-right: 50px; }
body.bestuur #content .paragraph .text { width: 300px; }
body.bestuur #sidepanel .inner { padding: 0px; }
body.fotoboek #content { width: 800px; }
body.fotoboek #content .paragraph .text { width: 800px; }

#content { float: left; width: 829px; margin-bottom: 30px; min-height: 400px; }

#sidepanel { float: left; width: 378px; padding-top: 20px; }
#sidepanel .inner { padding: 0 0 0 132px; }
.paragraph { overflow: hidden; margin-bottom: 20px; }
.paragraph p { margin-bottom: 20px; }
.paragraph .image { float: right; margin-bottom: 20px; }
.paragraph .image img { display: block; }
.paragraph .text { font-size: 1.2em; width: 532px; }
.paragraph .text ul { list-style: square; padding-left: 30px; }
.paragraph .text ol { list-style: decimal; padding-left: 30px; }

#footer { position: relative; clear: both; width: 453px; height: 94px; background: url(/lib/images/footer_bg.png) 0 0 no-repeat; }
#footer { width: 560px; background-image: url(/lib/images/footer_bg2.png); }
#footer a.backtotop { position: absolute; top: 33px; right: 21px; width: 96px; height: 17px; background: #fff url(/lib/images/a_backtotop.png); text-indent: -9999px; }
#footer a.backtotop {  }
#footer ul { overflow: hidden; padding: 55px 0 20px 0; }
#footer li { float: left; color: #757677; padding: 0 5px; border-right: 1px solid #757677; }
#footer li.last { border: 0; }
#footer a { color: #757677; text-decoration: none; }
#footer a:hover { text-decoration: underline; }
#footer .linkedin { position: relative; }
#footer .linkedin a { position: absolute; top: -7px; left: 6px; height: 32px; width: 30px; }

.homepage .evenementen { position: relative; margin-bottom: 70px; }
.homepage .evenementen .item { margin-bottom: 6px; overflow: hidden; }
.homepage .evenementen .item h3 { padding: 4px 0 8px 0; font-size: 1.2em; color: #c1c1c1; }
.homepage .evenementen .item .date { float: left; height: 25px; width: 25px; padding-top: 2px; line-height: 10px; text-align: center; color: #d0a3a6; background: url(/lib/images/home_evenement_date.png) 0 0 no-repeat; }
.homepage .evenementen .item .text { margin-left: 34px; padding-right: 22px; color: #949699; font-size: 1em; }
.homepage .evenementen .item .text a { color: #949699; }
.homepage .evenementen .item .text .teaser { color: #949699; }
.homepage .evenementen .item .top { width: 246px; height: 10px; background: url(/lib/images/home_evenementen_bg.png) 0 0 no-repeat; }
.homepage .evenementen .item .middle { padding: 0 6px; background: #383d42; }
.homepage .evenementen .item .bottom { width: 246px; height: 10px; background: url(/lib/images/home_evenementen_bg.png) 0 bottom no-repeat; }
.homepage .evenementen .all_events { float: right; margin-top: -6px; margin-right: 30px; width: 77px; height: 46px; text-indent: -9999px; background: url(/lib/images/txtBekijkAlleEvenementen.png) 0 0 no-repeat; }
.homepage .evenementen h2 { width: 247px; height: 19px; margin-bottom: 8px; text-indent: -9999px; background: url(/lib/images/txtJaarprogramma.png) 0 0 no-repeat; }

.homepage #sidepanel .sponsoren h2 { width: 245px; height: 19px; margin-bottom: 8px; text-indent: -9999px; background: url(/lib/images/txtLeden.png) 0 0 no-repeat; }
#flashsponsors { margin-left: 20px; width: 227px; height: 203px; }
#flashSponsorOverzicht { width: 560px; height: 101px; }
#flashPaintings { position: relative; height: 500px; width: 300px; }
#flashPainting1 { position: absolute; top: 10px; left: 49px; width: 225px; height: 201px; }
#flashPainting2 { position: absolute; top: 212px; left: 10px; width: 128px; height: 105px; }
#flashPainting3 { position: absolute; top: 193px; left: 131px; width: 175px; height: 135px; }
#flashPainting4 { position: absolute; top: 316px; left: 38px; width: 190px; height: 200px; }

#accordion h2 { width: 247px; height: 19px; margin-bottom: 8px; text-indent: -9999px; background: url(/lib/images/txtJaarprogramma.png) 0 0 no-repeat; }
#accordion .evenementitem h3 { background: #630f13; font-weight: bold; color: #fff; font-size: 1.2em; padding-left: 20px; text-decoration: none; cursor: pointer; margin-top:10px;}
#accordion .evenementitem h3.closed { background: #eaeaea; color: #000; border: 1px solid #8f8f8f; border-bottom: 0; }
#accordion .evenementitem h3.last { border-bottom: 1px solid #8f8f8f;}
#accordion .evenementitem .teasertekst ul { list-style: square; padding-left: 30px; }
#accordion .evenementitem .teasertekst li { padding: 3px 10px 3px 0px; }
#accordion .evenementitem .teasertekst a { color: #fff; font-size: 1.1em; text-decoration: underline; }
#accordion .evenementitem .teasertekst span.text { font-size: 1.1em; }
#accordion .evenementitem .teasertekst a:hover { text-decoration: underline; }
#accordion .evenementitem .teasertekst a.active { color: #fff; text-decoration: underline; font-weight: bold; }
#accordion .evenementitem .datum { display:none; }
.verplichtevelden { float: right; }
.contactform { clear: both; width: 353px; }
.contactform fieldset { padding: 20px; margin-bottom: 20px; background: #39444e; }
.contactform fieldset.submit { padding: 0 20px 0 0; background: none; }
.contactform fieldset.submit input { float: right; padding: 0 10px; width: auto; font-weight: bold; }
.contactform legend { font-size: 1.2em; font-weight: bold; margin-left: -6px; margin-bottom: 20px;}
.contactform div { margin-bottom: 5px; overflow: hidden; }
.contactform input { width: 145px; background: #b2b9c1; font-size: 1.2em; color: #000; }
.contactform select { width: 145px; background: #b2b9c1; font-size: 1.2em; color: #000; }
.contactform textarea { width: 309px; height: 107px; background: #b2b9c1; font-size: 1.2em; color: #000;  }
.contactform label { float: left; width: 150px; font-size: 1.2em; }
.contactform input.radiocheck { width: auto; background: none; }
.contactform label.radiocheck { float: none; width: auto; }

div.bestuur { font-size: 1.2em; border-left: 1px solid #fff; padding-left: 30px; }
div.bestuur table { width: 500px; }
div.bestuur th { font-weight: bold; width: 500px; padding-bottom: 20px;}
div.bestuur td { padding-bottom: 10px; }
div.bestuur span { display: block; font-size: 0.8em; color: #b4b5b5;  }

.photobook table.placeholder { width: 800px; height: 533px; background-color: #fff; margin: 0 0 20px 0; padding: 0; border: 0; border-collapse: collapse;}
.photobook table.placeholder td { width: 388px; height: 260px; text-align:center; background-color: #fff; overflow: hidden; margin: 0; padding: 0;}
.photobook { vertical-align: middle; } 
.photobook img { display: block; margin: 0; overflow:hidden; border:1px solid #fff; }
.photobook p { overflow: hidden; }
.photobook a.vorige { background-image: url(../images/vorige.jpg); width: 13px; height: 77px; display: block; text-indent: -9999px; float: left; margin-right: 2px;}
.photobook a.volgende { background-image: url(../images/volgende.jpg); width: 13px; height: 77px; display: block; text-indent: -9999px; float: left;}
.photobook .thumb img{ width: 77px; height: 77px; float: left; margin-right: 2px; margin-top:0px; border:none;}

.sponsorendetail { }
.sponsorendetail .contentleft { float: left; width: 220px; padding-bottom: 20px; }
.sponsorendetail .contentright { float: left; width: 220px; padding-bottom: 20px; }
.sponsorendetail img { border: 1px solid #fff; }
.sponsorendetail ul { margin-left: 20px;list-style: square; }
.sponsorendetail li { font-size: 12px; }
.sponsorendetail .tekst { padding-top: 10px; border-top: 2px solid #fff; clear: left; font-size: 12px; }
.sponsorendetail .logo { float: left; margin: 0 10px 10px 0; }
.sponsorendetail .sponsorblok { clear: left; }