/* -- Eric Meyer's Global Reset -- */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}
/* -- My Global Re-Reset -- */
body { background: #9c0; font: 12px/18px Arial, Helvetica, sans-serif; text-align: left; }
h1, h2, h3, h4, h5, h6 { font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, sans-serif; }
p { margin-bottom: 12px; }
a, a:hover { color: #f90; text-decoration: none; }
.floatleft { float: left; }
.floatright { float: right; clear: right; }
/* http://www.positioniseverything.net/easyclearing.html */
.clearfix:after { clear: both; content: '.'; display: block; height: 0; visibility: hidden; }
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* -- Colours --
Donkergroen:
PMS: 369
CMYK: 075-000-100-000
RGB: 28-133-27
HTML: # 339933
RAL: 6018
Lichtgroen:
PMS: 381
CMYK: 025-000-100-000
RGB: 207-226-28
HTML: # 99CC00
Sikkens: 438-A6 (NCS1050G70Y)
Oranje:
Biotop: PMS: 123
Chorus Silk: PMS: 137
CMYK: 000-045-100-000
RGB: 255-170-45
HTML: # FF9900
RAL: 1033
heel lichtgroen: #e8f0db
heel licht oranje: #fde2ba
/* -- General settings for div's -- */
.container_12 { margin: 0 auto; width: 960px; }
.wrap_8, .wrap_6, .block_8, .block_6, .block_4, .block_3 { display: inline; float: left; margin-left: 10px; margin-right: 10px; position: relative; }
.wrap_8, .block_8 { width: 620px; }
.wrap_6, .block_6 { width: 460px; }
.block_4 { width: 300px; }
.block_3 { width: 220px; }
.alpha { margin-left: 0; }
.omega { margin-right: 0; }
.prefix_3 { padding-left: 240px; }
.prefix_4 { padding-left: 310px; }
.prefix_6 { padding-left: 480px; }
.prefix_8 { padding-left: 630px; }
.prefix_9 { padding-left: 720px; }
/* -- Specific settings for div's -- */
.container { background: #fff; width: 100%; }
#headerTop { background-color: #9c0; border-bottom: 2px solid #8f8f8f; height: 28px; }
#header { background: #fff url(img/bg-header.png) no-repeat 10px 0; height: 120px; }
#logo { background: url(img/logo.png) no-repeat 60px 15px; height: 120px; }
#slogan { background: url(img/dordrecht.jpg) no-repeat 100% 0; height: 120px; }
#slogan h1 { color: #393; font-size: 28px; line-height: 120px; text-align: center; }
#headerBottom { background-color: #f90; border-bottom: 2px solid #8f8f8f; border-top: 1px solid #c1c1c1; height: 38px; }
#footer { background-color: #9c0; border-top: 2px solid #8f8f8f; height: 30px; }
/* Navigation */
#menu { border-left: 1px solid #fde2ba; height: 38px; margin-left: 10px; }
.menuNav, .menuNav ul { list-style: none; }
.menuNav { font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, sans-serif; position: relative; z-index: 100; }
#nav li, .menuNav li { float: left; position: relative; }
.menuNav li a, .menuNav li a:link, .menuNav li a:active, .menuNav li a:visited { background: #F90; border-right: 1px solid #fde2ba; color: #fde2ba; display: block; font: 13px/38px "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, sans-serif; padding: 0 20px; text-decoration: none; text-transform: uppercase; }
.menuNav li a:hover { background: #FFF; color: #F90; }
.menuNav li a.active { color: #FFF; }
#nav li:hover a, #nav li.sfHover a { background: #FFF; color: #F90; }
#nav li:hover ul a, #nav li.sfHover ul a { background: #F90; color: #fde2ba; }
#nav li:hover ul a:hover, #nav li.sfHover ul a:hover { background: #FFF; color: #F90; }
.menuNav ul { background: #F90; border-bottom: 0px solid #8f8f8f; left: -1px; position: absolute; top: -999em; width: 170px; }
.menuNav li:hover ul, .menuNav li.sfHover ul { top: 39px; }
.menuNav ul li { border: 0; float: none; }
.menuNav ul a { border: 1px solid #8f8f8f; border-bottom: 0; padding-right: 0px; white-space: nowrap; width: 170px; }
.menuNav ul a:hover { background: #FFF; color: #F90; }
/* -- Page Verkiezingen -- */
#mainPage { padding-bottom: 20px; }
#mainPage h2 { color: #8f8f8f; font-size: 30px; letter-spacing: -1px; line-height: 30px; margin-bottom: 10px; }
#mainPage h3 { border-bottom: 1px solid #f90; color: #393; font-size: 20px; letter-spacing: -1px; line-height: 20px; margin-bottom: 10px; }
#mainPage h3 span { background: url(img/rss.png) no-repeat 0 3px; text-indent: -9999px; width: 16px; }
#mainPage h3.padding { padding-top: 10px; }
#result { background: #e8f0db; padding: 10px; width: 440px; }
#result h3 { border-bottom: 1px dashed #393; color: #9c0; font-size: 20px; letter-spacing: -1px; line-height: 20px; margin-bottom: 10px; }
#result img { margin-bottom: 9px; width: 440px; }
#result h4 { color: #f90; font-size: 13px; line-height: 18px; font-weight: bold; }
#result p { color: #434343; }
#result a { color: #9c0; }
#result a:hover { color: #9c0; text-decoration: underline; }
#result ul { margin-bottom: 12px; }
#result li a { background: url(img/bg-list.png) no-repeat 2px 6px; color: #9c0; display: block; line-height: 18px; padding: 0 0 0 12px; }
#result li a:hover { background-color: #fde2ba; color: #393; text-decoration: none; }
#opinion { border-bottom: 2px dashed #393; margin-bottom: 10px; padding-bottom: 20px; margin-top: 18px; }
#mainPage #opinion h3 { border-bottom: 1px solid #f90; color: #393; font-size: 20px; letter-spacing: -1px; line-height: 20px; margin-bottom: 10px; }
#opinion img { border: 1px solid #8f8f8f; float: left; margin: 0 10px 5px 0; width: 168px; }
#opinion h4 { color: #9c0; font-size: 13px; line-height: 18px; font-weight: bold; }
#opinion a { color: #f90; }
#opinion a:hover { color: #f90; text-decoration: underline; }
#opinion h4.pdf-green { background: url(img/pdfgreen.png) no-repeat 0 0; padding-bottom: 10px; padding-left: 20px; }
#opinion h4 a { color: #f90; }
#result h4 a { color: #f90; }
#opinion h4 a:hover { color: #9c0; text-decoration: underline; }
#result h4 a:hover { color: #9c0; text-decoration: underline; }
#opinion ul { margin-bottom: 12px; }
#opinion li a { background: url(img/bg-list.png) no-repeat 2px 6px; color: #f90; display: block; line-height: 18px; padding: 0 0 0 12px; }
#opinion li a:hover { background-color: #e8f0db; color: #393; text-decoration: none; }
.candidate { float: left; margin-bottom: 10px; }
.candidate img { border: 1px solid #8f8f8f; margin-bottom: 0; width: 218px; }
.candidate p { font-size: 11px; line-height: 15px; }
.candidate a:hover { text-decoration: underline; }
.article { border-bottom: 2px dashed #393; margin-bottom: 10px; padding-bottom: 5px; }
.article h4, .articleMore h4 { color: #9c0; font-size: 13px; line-height: 15px; font-weight: bold; }
.article h4 a, .articleMore h4 a { color: #9c0; }
.article h4 a:hover, .articleMore h4 a:hover { color: #9c0; text-decoration: underline; }
.article p { margin-bottom: 12px; }
.article p.date { color: #c1c1c1; font-size: 11px; line-height: 15px; margin-bottom: 6px; }
.article p.readmore { font-size: 11px; line-height: 15px; margin-top: -6px; }
.article p.readmore a { color: #f90; }
.article p.readmore a:hover { text-decoration: underline; }
.articleMore { border-bottom: 2px dashed #393; margin-bottom: 10px; padding-bottom: 10px; }
#news .articleMore { border-bottom: 2px dashed #9c0; }
.articleMore li a, #content .articleMore li a { background: url(img/bg-list.png) no-repeat 2px 6px; color: #f90; display: block; padding: 0 0 0 12px; }
.articleMore li a span, #content .articleMore li a span { color: #c1c1c1; }
.articleMore li a:hover, #content .articleMore li a:hover { background-color: #e8f0db; color: #393; }
.articleMore li a:hover span, #content .articleMore li a:hover span { color: #8f8f8f; }
/* -- Page -- */
#mainPage, #links, #news, #department, #contact, #plans, #humans, #results, #kids { padding-top: 20px; }
#content { padding: 20px 0 40px; }
#results #content, #kids #content { padding-top: 0; }
#desc { background: #e8f0db; color: #434343; margin-bottom: 40px; padding: 10px; width: 280px; }
#desc h4 { color: #f90; font-size: 13px; line-height: 18px; font-weight: bold; }
#desc h4.pdf-green { background: url(img/pdfgreen.png) no-repeat 0 0; padding-bottom: 9px; padding-left: 20px; }
#desc h4 a, #result h4 a { color: #f90; }
#desc h4 a:hover, #result h4 a:hover { color: #9c0; text-decoration: underline; }
#desc textarea { width: 260px; }
#desc ul { margin-bottom: 12px; }
#humans #desc ol { list-style: inside decimal; }
#desc li, #desc li a { background: url(img/bg-list.png) no-repeat 2px 6px; color: #9c0; display: block; line-height: 18px; padding: 0 0 0 12px; }
#desc li { color: #434343; }
#desc li a:hover { background-color: #fde2ba; color: #393; text-decoration: none; }
#plans #desc li, #humans #desc ol li { background: none; margin-bottom: 0; padding: 0; }
h2 { border-bottom: 1px dashed #393; color: #9c0; font-size: 30px; letter-spacing: -1px; line-height: 30px; margin-bottom: 10px; }
h3 { border-bottom: 1px solid #f90; color: #393; font-size: 20px; letter-spacing: -1px; line-height: 20px; margin-bottom: 10px; }
#links #content img { border: 1px solid #8f8f8f; height: 148px; width: 298px; }
#content ul, #content ol { margin-bottom: 12px; }
#content ul li { background: url(img/bg-list.png) no-repeat 2px 6px; color: #111; line-height: 18px; margin-bottom: 12px; padding: 0 0 0 12px; }
#links #content li, #news #content .articleMore li, #plans #content .articleMore li, #results #content .articleMore li { background: none; margin-bottom: 0; padding: 0; }
#links #content li a { background: url(img/bg-list.png) no-repeat 2px 6px; color: #f90; display: block; line-height: 18px; margin-bottom: 6px; padding: 0 0 0 12px; }
#links #content li a:hover { background-color: #e8f0db; color: #393; }
#content ol li { list-style: inside decimal; margin-bottom: 12px; }
#humans #content ol li { margin-bottom: 3px; }
#content strong { color: #f90; font-weight: bold; }
#news #content .article, #department #content .article { border-bottom: 2px dashed #9c0; }
#plans #content .article, #kids #content .article { border-bottom: 2px dashed #f90; }
#humans #content .article, #results #content .article { border: 0; margin-bottom: 20px; }
#humans #content .article p { margin-bottom: 6px; }
#news #content h3, #department #content h3, #plans #content h3, #results #content h3 { border: 0; margin-bottom: 5px; }
#news #content h3 a, #department #content h3 a, #plans #content h3 a, #results #content h3 a { color: #393; }
#news #content h3 a:hover, #department #content h3 a:hover, #plans #content h3 a:hover, #results #content h3 a:hover { color: #393; text-decoration: underline; }
#content h4 { color: #9c0; font-size: 13px; line-height: 18px; }
#news #content img, #department #content img { border: 1px solid #8f8f8f; float: right; margin: 0 0 5px 10px; width: 298px; }
#plans #content img, #results #content img, #kids #content img { border: 1px solid #8f8f8f; width: 298px; }
#humans #content img { border: 1px solid #8f8f8f; float: left; margin: 0 10px 5px 0; width: 138px; }
img.floatleft { margin: 0 10px 5px 0; }
img.floatright { margin: 0 0 5px 10px; }
#humans #content img { border: 1px solid #8f8f8f; float: left; margin: 0 10px 5px 0; width: 138px; }
#humans #content img.bigimage, #kids #content img.bigimage { border: 1px solid #8f8f8f; float: none; margin: 0 0 20px 0; width: 618px; }
#results #content img.bigimage { border: 0; float: none; margin: 0 0 20px 0; width: 620px; }
#content .article p.date { margin-bottom: 6px; }
/* Paging Styles
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
#content ul.pages { border: none; display: block; font-size: 10px; margin: 20px 0px 60px; text-transform: uppercase; }
#content ul.pages li { background: none; display: inline; float: left; list-style: none; padding-left: 0; }
#content ul.pages li a { background: none; border: 1px solid #f90; color: #393; display: block; float: left; line-height: 18px; margin: 0 5px 0 0; padding: 0 5px; text-decoration: none; }
#content ul.pages li a:hover { background: #e8f0db; border: 1px solid #f90; }
#content ul.pages li.pgEmpty { border: 1px solid #f90; color: #9c0; display: block; float: left; margin: 0 5px 0 0; padding: 0px 5px; }
#content ul.pages li.pgCurrent { background: #e8f0db; border: 1px solid #393; color: #393; display: block; float: left; font-weight: bold; margin: 0 5px 0 0; padding: 0px 5px; }
/* -- Footer -- */
#footer p { color: #e8f0db; line-height: 30px; padding-left: 10px; }
#footer a { color: #e8f0db; }
#footer a:hover { color: #FFF; text-decoration: underline; }