/* screen stylesheet 
 *
 * Fabrique Design en Communicatie
 * authors: VBO
 * Version: 20100113
 */

/* START structure */
html, body {
    margin: 0;
    padding: 0;
    min-height: 100%;
    font-family: Arial;
}

body {
    background: #C6E2F3 url('../images/backgrounds/body.jpg') 50% 0 no-repeat fixed;
    font-size: 12px;
    color: #333;
}

#framework {
    padding-top: 160px;
    width: 943px;
    margin: 0 auto;
    position: relative;
    margin-bottom: 20px;
}

#framework:after {
    content: "."; 
    display: block;
    height: 0;
    visibility: hidden;
    clear: both;
}

#logo {
    position: absolute;
    top: 25px;
    left: 0;
    width: 361px;
    height: 33px;
    background: url('../images/backgrounds/logo.png') 0 0 no-repeat;
}

#logo img{
    display: none;
}

#logo a {
    display: block;
    width: 370px;
    height: 45px;
}

#primary{
    width: 700px;
    margin-right: 20px;
    float: left;
    border-top: 6px solid #333333;
}

#primary:after{
    content: "."; 
    display: block;
    height: 0;
    visibility: hidden;
    clear: both;
}

#primary #main{
    float: left;
    width: 459px;
    margin-right: 20px;
}

#primary #main:after{
    content: "."; 
    display: block;
    height: 0;
    visibility: hidden;
    clear: both;
}

#primary #main h3 {
    margin-bottom: 2px;
}

#primary .intro{
    font-weight: bold;
}

#secondary{
    float: left;
    width: 220px;
    border-top: 6px solid #333333;
    margin-bottom: 20px;
}

.search #primary{
    width: 938px;
}

.search #searchbox-content{
    width: 293px;
}

.search #primary .intro{
    font-weight: normal;
}

body.search #secondary{
    border-top: none;
}

body.search .intro {
    display: none;
}
body.search .intro.active {
    display: block;
}

/* END structure */

/* START generic elements */
a {
    color: #0290b3;
    text-decoration:none;
}

a:hover {
    text-decoration:underline;
}

h1{
    font-size: 250%;
    margin: 0 0 5px 0;
}

h2{
    font-size: 120%;
    margin: 0;
}

h1 a, h2 a, h3  a {
    color: #333;
    text-decoration:none;
}

h1 a:hover, h2 a:hover, h3  a:hover {
    text-decoration:none;
}

ul, ol{
    margin: 0 0 15px 25px;
    padding: 0;
}

p{
    margin: 0 0 15px 0;
}

img{
    border: 0;
}

.screenreader{
    display: none;
}

#side .section{
    background: url('../images/backgrounds/stripe-short.png') 0 0 no-repeat;
    margin-left: 479px;
    margin-top: 30px;
    padding: 7px 0 0 0;
}

#side .section h3{
    font-family: Georgia;
    font-style: italic;
    font-weight: normal;
    font-size: 150%;
    margin: 0 0 10px 0;
}

#side .section .linked-objects-image{
    list-style: none;
    margin: 0;
    padding: 0;
}

#side .section .linked-objects-image img{
    max-width: 100px;
    min-width: 100px;
}

#side .section .linked-objects-image li{
    background: url('../images/backgrounds/dots-black.png') 0 0 repeat-x;
    margin: 12px 0 0 0;
    padding: 8px 0 0 0;
    display: block;
    clear: right;
}

#side .section .linked-objects-image li .description{
    float: right;
    width: 110px;
}

/*#side .section .linked-objects-image li .description img{
    float: left;
    margin-right: 5px;
    //width: 110px;
}

#side .section .linked-objects-image li .content{
    float:left;
    margin-top: 5px;
    //width: 110px;
}*/

#side .section .linked-objects-image li .description h4{
    margin: 0;
}

#side .section .linked-objects-image li a{
    /*text-decoration: none;
    color: #333;*/
}

#side .section .linked-objects-image li .description span{
    display: block;
}

#side .section .linked-objects-image li .description .archivenumber{
    font-style: italic;
}

#side .archivelink h3{
    font-size: 100%;
    font-family: Arial;
    font-weight: bold;
    font-style: normal;
    margin-bottom: 0;
}

#secondary h2{
    font-size: 210%;
}

#searchbox{
    margin-bottom: 40px;
}

#searchbox.primary {
    margin-bottom: 30px;
    margin-top: 15px;
}

#searchbox.primary form {
    height: 20px;
}

#searchbox.primary input {
    float: left;
}

#searchbox.primary #searchbox-submit {
    margin-left: 10px;
}

#searchbox #searchbox-content{
    margin-top: 10px;
    padding: 12px 6px;
    background: url('../images/backgrounds/darkblue-transparent.png') 0 0 repeat;
    text-align: right;
}

#searchbox form{
    margin: 0;
}

#searchbox label{
    display: none;
}

#searchbox #searchbox-textinput{
    width: 206px;
    border-top: 1px solid #000;
    border-right: 1px solid #616161;
    border-bottom: 1px solid #000;
    border-left: 1px solid #000;
    display: block;
    margin: 0;
    margin-bottom: 10px;
}

#searchbox #searchbox-submit{
    background: url('../images/backgrounds/searchbox-submit.png') 0 0 no-repeat;
    width: 70px;
    height: 20px;
    text-indent: -1982px;
    overflow: hidden;
    line-height: 20px;
    border: 0;
    cursor: pointer;
}


#banners{
    border-top: 6px solid #333333;
}

#banners a {
    /*text-decoration: none;*/
    display: block;
} 

#banners .imagebanner a {
    color: #fff;
}

#banners .imagebanner img {
    max-width: 220px;
    min-width: 220px;
}

#banners .banner{
    background: url('../images/backgrounds/white-transparent.png') 0 0 repeat;
    padding: 8px;
    margin-top: 10px;
}

#banners .banner h3{
    font-weight: normal;
    font-style: italic;
    font-family: Georgia;
    font-size: 150%;
    margin: 0;
}

#banners .banner p.subtitle, #banners #newslettersubscribe a{
    /*text-decoration: none;*/
    padding-left: 10px;
    background: url('../images/backgrounds/banner-link.png') 0 50% no-repeat;
    margin: 0;
}

#banners .banner p.subtitle {
    margin-top: 5px;
}

#banners .imagebanner{
    position: relative;
    width: 220xp;
    margin-top: 10px;
}

#banners .imagebanner .text{
    position: absolute;
    bottom: 0;
    color: #FFF;
    background: url('../images/backgrounds/imagebanner.png') 0 0 repeat;
    padding: 9px;
    width: 202px;
}

#banners .imagebanner .text h3{
    font-family: Georgia;
    font-size: 150%;
    font-weight: normal;
    font-style: italic;
    margin: 0 0 5px 0;
    padding: 0 0 5px 0;
    background: url('../images/backgrounds/dots-white.png') 0 100% repeat-x;
}

#banners .imagebanner .text p{
    margin: 0;
}

#newslettersubscribe form{
    margin: 10px 0;
    /*height: 30px;*/
    position: relative;
    background: url('../images/backgrounds/dots-black.png') 0 100% repeat-x;
}

#newslettersubscribe label{
    display: none;
}

#newslettersubscribe #newslettersubscribe-response {
    font-size: 10px;
    margin-top: 10px;
}

#newslettersubscribe #newslettersubscribe-response.error {
    color: #FF0000;
}

#newslettersubscribe input {
    /*position: absolute;*/
    left: 0;
    font-size: 100%;
    width: 202px;
    height: 15px;
    border-top: 1px solid #000;
    border-right: 1px solid #616161;
    border-bottom: 1px solid #000;
    border-left: 1px solid #000;
    margin: 0;
    margin-bottom: 10px;
}

#newslettersubscribe input#newslettersubscribe-submit{
    /*position: absolute; 
    right: 0;*/
    background: url('../images/backgrounds/newslettersubscribe-submit.png') 0 0 no-repeat;
    width: 60px;
    height: 20px;
    text-indent: -1982px;
    /*overflow: hidden;*/
    line-height: 20px;
    border: 0;
    cursor: pointer;
    /*left: auto;*/
    margin-left: 143px;
}

#reactions{
    position: relative;
    padding-top: 20px;
    background: url('../images/backgrounds/dots-black.png') 0 0 repeat-x;
    width: 459px;
}

#reactions form{
    background: url('../images/backgrounds/lightblue-transparent.png') 0 0 repeat;
    padding: 8px;
    margin: 0 0 20px 0;
}

#reactions h3{
    margin: 0 0 10px 0;
    font-size: 120%
}

#reactions .inputgroup{
    clear: both;
    position: relative;
    margin-bottom: 10px;
}

#reactions label{
    position: absolute;
    width: 70px;
}

#reactions .inputgroup input, #reactions .inputgroup textarea{
    font-size: 100%;
    width: 255px;
    height: 15px;
    border-top: 1px solid #000;
    border-right: 1px solid #616161;
    border-bottom: 1px solid #000;
    border-left: 1px solid #000;
    margin: 0 0 0 80px;
    font-family: arial;
}
#reactions .inputgroup span {
  display: block;
  margin-left: 80px;
}

#reactions .inputgroup textarea{
    height: 80px;
    overflow: auto;
}

#reactions #id_comment {
    resize: none;
}

#reactions .captcha {
    margin-left: 80px;
    border: 1px solid #000;
}

#reactions ul.errorlist {
    margin-left: 100px;
    font-size: 0.8em;
}

#reactions #reaction-submit{
    background: url('../images/backgrounds/reaction-submit.png') 0 0 no-repeat;
    width: 97px;
    height: 20px;
    text-indent: -1982px;
    overflow: hidden;
    line-height: 20px;
    border: 0;
    cursor: pointer;
}

#reactions ul#comments{
    list-style: none;
    margin: 20px 0;
    padding: 0;
}

#reactions ul#comments li{
    margin-bottom: 20px;
    padding-top: 10px;
    background: url('../images/backgrounds/stripe-short.png') 0 0 no-repeat;
}

#reactions ul#comments .properties{
    margin-bottom: 5px;
}

#reactions ul#comments .author{
    font-weight: bold;
}

.paging{
    list-style: none;
    padding: 0;
    margin: 0 0 20px 0;
}

.paging li{
    display: inline;
    margin-right: 8px;
    font-size: 90%;
}

.paging li a{
    text-decoration: none;
}

.paging li.active a{
    border-top: 2px solid #000;
    font-size: 120%;
    font-weight: bold;
}
/* END generic elements /*

/* START breadcrumbs */
#breadcrumbs{
    position: absolute;
    left: 0;
    top: 140px;
    border-top: 1px solid #333;
}

#breadcrumbs ul{
    list-style: none;
    margin: 0;
    padding: 0;
}

#breadcrumbs li{
    display: inline;
    font-size: 90%;
}

#breadcrumbs a{
    color: #333;
    text-decoration: none;
    padding-right: 12px;
    background: url('../images/backgrounds/arrow-small.png') 100% 50% no-repeat;
}

#breadcrumbs .last a{
    background: none;
    padding: 0;
}
/* START breadcrumbs */

/* START navigation */
#navigation{
    position: absolute;
    top: 72px;
    left: 0;
}

#navigation ul{
    list-style: none;
    margin: 0 0 0 -6px;
    padding: 0;
}

#navigation li{
    font-size: 120%;
    float: left;
    padding: 6px
}

#navigation li:hover, #navigation li.hover{
    background: #4AC1E6;
}

#navigation li.active{
    margin-top: -1px;
    font-weight: bold;
    font-size: 125%;
}

#navigation li.last{
    margin-right: 0;
}

#navigation li.last a{
    width: 103px;
}

#navigation li a{
    border-top: 2px solid #000;
    display: block;
    width: 101px;
    padding-right: 5px;
    color: #000;
    text-decoration: none;
    padding-top: 2px;
}

#navigation li.active a{
    border-top: 4px solid #333333;
}

#navigation li:hover a, #navigation li.hover a{
    color: #FFF;
    border-top: 4px solid #FFF;
    font-weight: bold;
}

#navigation li ul {
    background: #4AC1E6;
    position: absolute;
    width: 118px;
    padding-top: 20px;
    left: -999em;
}

#navigation li.last ul{
    width: 120px;
}

#navigation li:hover ul , #navigation li.hover ul{
	left: auto;
}

#navigation li:hover ul a, #navigation li.hover ul a, #navigation li:hover ul a:hover, #navigation li.hover ul a:hover{
    border-top: 0;
    margin-top: 5px;
    font-size: 70%;
    font-weight: normal;
}
/* END navigation */

/* START footer */
#footer{
    background: #333333;
    color: #999;
}

#footer-content{
    padding: 20px 0 40px 0;
    width: 943px;
    margin: 0 auto;
    /*position: relative;*/
}

#footer-content p, #footer-content a {
    font-size: 11px;
}

#footer-content:after{
    content: "."; 
    display: block;
    height: 0;
    visibility: hidden;
    clear: both;
}

#footer .section{
    width: 90px;
    float: left;
    margin-right: 40px;
    background: url('../images/backgrounds/footer-section.png') 0 0 no-repeat;
}

#footer .last{
    margin-right: 0;
}

#footer #footer-logo{
    background: none;
    width: 181px;
}

#footer #footer-about{
    width: 150px;
}

#footer #footer-contact{
    width: 120px;
}

#footer h4{
    margin: 5px 0 15px 0;
    font-size: 115%;
}

#footer ul {
    margin: 0;
}

#footer li {
    list-style-type: none;
    padding-left: 10px;
    background: url('../images/backgrounds/arrow-small-grey.png') 0 5px no-repeat;
    margin-top: 2px;
}

#footer a {
    color: #999;
}

#footer li.twitter {
    padding-left: 20px;
    background: url('../images/backgrounds/icon-twitter.png') 0 0 no-repeat;
    height: 18px;
}

#footer li.rss {
    margin-top: 5px;
    padding-left: 20px;
    background: url('../images/backgrounds/icon-rss.png') 0 0 no-repeat;
    height: 18px;
}

/* END footer */

/* START page-home */
.page-home h1{
    display: none;
}

.page-home #primary{
    width: 459px;
}

.page-home #primary .carousel img {
  max-width: 460px;
  min-width: 460px;
}

.page-home #primary .morestories {
    margin-bottom: 30px;
    margin-top: 5px;
}

.page-home #primary .morestories a{
    background: url('../images/backgrounds/arrow-small.png') 0 50% no-repeat;
    padding-left: 10px;
    font-size: 100%;
}

.page-home #primary .morestories a:hover {
    /*text-decoration: underline;*/
}

.page-home #primary .factoids{
    border-top: 6px solid #333333;
}

.page-home #primary .factoids .item{
    background: url('../images/backgrounds/stripe-short.png') 0 0 no-repeat;
    padding: 8px 0 0 0;
    margin: 10px 5px 5px 0;
    width: 225px;
    float: left;
}

.page-home #primary .factoids .last{
    margin-right: 0;
}

.page-home #primary .factoids .item h3{
    margin: 0 0 5px 0;
    font-family: Georgia;
    font-style: italic;
    font-size: 140%;
}

.page-home #primary .factoids .item p {
    margin-bottom: 0px;
}

.page-home #primary .carousel ul{
    list-style: none;
    margin: 0;
    padding: 0;
}

.page-home #secondary{
    width: 220px;
    margin-right: 21px;
}

.page-home #secondary .twitter{
    margin-top: 45px;
    border-top: 6px solid #333333;
}

.page-home #secondary .item{
    background: url('../images/backgrounds/stripe-short.png') 0 0 no-repeat;
    padding: 8px 0 0 0;
    margin-bottom: 25px;
    margin-top: 10px;
}

.page-home #secondary .item h3{
    margin: 0 0 5px 0;
    font-family: Georgia;
    font-style: italic;
    font-size: 150%;
}

.page-home #secondary .item h3 a{
    /*text-decoration: none;*/
}

.page-home #secondary .item .date{
    font-weight: bold;
    font-style: italic;
}

.page-home #secondary .morenews{
    background: url('../images/backgrounds/dots-black.png') 0 0 repeat-x;
    padding-top: 5px;
}

.page-home #secondary .morenews a{
    background: url('../images/backgrounds/arrow-small.png') 0 50% no-repeat;
    padding-left: 10px;
    font-size: 100%;
}

.page-home #secondary .morenews a:hover {
    /*text-decoration: underline;*/
}

.page-home #tertiary{
    float: left;
    width: 220px;
    border-top: 6px solid #333333;
}

.page-home h2{
    font-size: 210%;
}
/* END page-home */

/* START page-landing */
#landing-list .row{
    margin-bottom: 20px;
    float: left;
}

#landing-list .row:after{
    content: "."; 
    display: block;
    height: 0;
    visibility: hidden;
    clear: both;
}

#landing-list .item{
    float: left;
}

#landing-list .even{
    margin-left: 20px;
}

#landing-list .image{
    float: left;
    width: 100px;
}

#landing-list .image img {
    max-width: 100px;
    min-width: 100px;
}

#landing-list .description{
    border-top: 3px solid #333;
    margin-left: 20px;
    width: 220px;
    float: left;
    clear: right;
    padding-top: 2px;
}

#landing-list .description h2{
    font-size: 140%;
    margin-bottom: 5px;
}

#landing-list .description h2 a{
    /*text-decoration: none;*/
}

#landing-list .description p {
    margin: 0;
}
/* END page-landing */

/* START page-stories */
#stories-list{
    list-style: none;
    margin: 0 0 20px 0;
    padding: 0 0 1px 0;
    background: url('../images/backgrounds/dots-black.png') 0 100% repeat-x;
}

#stories-list > li {
    margin-bottom: 40px;
}

#stories-list li:after{
    content: "."; 
    display: block;
    height: 0;
    visibility: hidden;
    clear: both;
}

#stories-list .image{
    float: left;
    width: 100px;
}

#stories-list .image img {
    min-width: 100px;
    max-width: 100px;
}

#stories-list .description{
    border-top: 3px solid #333;
    margin-left: 20px;
    width: 220px;
    float: left;
}

#stories-list .description h2{
    font-size: 150%;
    margin-bottom: 5px;
    text-decoration: none;
}

#stories-list .index{
    border-top: 1px solid #333;
    float: left;
    width: 340px;
    margin-left: 20px;
}

#stories-list .index ol{
    list-style: none;
    margin: 25px 0 0 0;
    padding: 0;
}

#stories-list .index li{
    margin-bottom: 3px;
}

#stories-list .index a{
    background: url('../images/backgrounds/arrow-small.png') 0 50% no-repeat;
    padding-left: 10px;
    /*text-decoration: none;*/
}

#stories-header{
    margin: 0 0 20px 0;
}

#stories-header img {
    max-width: 700px;
    min-width: 700px;
}
/* END page-stories */

/* START page-news */
#news-list{
    list-style: none;
    margin: 0 0 20px 0;
    padding: 0;
    background: url('../images/backgrounds/dots-black.png') 0 100% repeat-x;
}

#news-list li{
    background: url('../images/backgrounds/dots-black.png') 0 0 repeat-x;
    position: relative;
    padding: 5px 0;
}

#news-list h2{
    font-family: Georgia;
    font-style: italic;
    font-size: 130%;
    margin-left: 80px;
}

#news-list .date{
    position: absolute;
    left: 0;
    top: 7px;
    font-style: italic;
}

#news-list h2 a{
    /*text-decoration: none;*/
}

#news-list li.spotlight{
    background: url('../images/backgrounds/stripe-short.png') 0 0 no-repeat;
    padding: 5px 0 0 0;
    margin-bottom: 25px;
}

#news-list li.spotlight h2{
    font-size: 165%;
    margin: 0 0 5px 0;
}

#news-list .spotlight .date{
    position: relative;
    top: auto;
    left: auto;
    font-weight: bold;
    font-style: normal;
    float: left;
    padding-right: 0.3em;
}

#news-list.files a {
    background: url('../images/icons/pdf-icon.gif') 0 0 no-repeat;
    padding-left: 24px;
}
/* END page-news */

/* START page-sitemap */
#sitemap ul{
    margin-bottom: 20px;
}

#sitemap ul ul{
    margin-left: 20px;
}

#sitemap li{
    margin-top: 10px;
    margin-bottom: 20px;
}

#sitemap ul ul li{
    margin-bottom: 10px;
}
/* END page-sitemap */

/* Content opmaak */
#main img.left {
    float: left;
    margin: 10px 10px 10px 0;
}

#main img.right {
    float: right;
    margin: 10px 0 10px 10px;
}
/* END Content opmaak */

/* START Zoekpagina */
#primary #searchtabs {
    height: 30px;
    margin: 0;
    position: relative;
}

#primary #searchtabs li {
    float: left;
    list-style-type: none;
    margin-right: 18px;
    margin-bottom: -2px;
    height: 18px;
    width: 98px;
    border-top: 2px solid #000;
    padding: 6px 5px;
    font-size: 1.2em;
}

#primary #searchtabs li:hover {
    cursor: pointer;
    border-top: 5px solid #000;
    font-weight: bold;
    padding: 3px 5px;
}

#primary #searchtabs li.active {
    border-top: 5px solid #000;
    padding: 3px 4px;
    background-color: #fff;
    border-left: 1px solid #000;
    border-right: 1px solid #000;
    border-bottom: 2px solid #fff;
    font-weight: bold;
}

#primary iframe {
    border: 1px solid #000;
    background-color: #fff;
    display: none;
}

#primary iframe.active {
    display: block;
}
/* END Zoekpagina */

/* START carousel */
.carousel{
    margin: 10px 0 0;
}

.carousel ul{
    list-style: none;
    margin: 0 0 10px 0;
    padding: 0;
}

.carousel .description{
    font-family: Georgia;
    font-size: 140%;
    font-style: oblique;
    background: url('../images/backgrounds/dots-black.png') 0 100% repeat-x;
    padding: 5px 0;
}

.carousel .description a{
    background: url('../images/backgrounds/arrow-medium.png') 100% 50% no-repeat;
    text-decoration: none;
    padding-right: 20px;
    color: #333;
}

.carousel .selected{
    font-size: 180%;
}

.carousel .selected a{
    background: url('../images/backgrounds/arrow-large.png') 100% 50% no-repeat;
    /*text-decoration: none;*/
    padding-right: 20px;
}

.carousel ul .image {
    display: none;
}

.carousel .readmore{
    background: url('../images/backgrounds/arrow-small.png') 0 50% no-repeat;
    text-decoration: none;
    padding-left: 10px;
    font-size: 90%;
}
/* END carousel */

/* page children */
#page-children ul {
    margin: 0;
}

#page-children li{
    list-style-type: none;
    text-decoration: none;
    padding-left: 10px;
    background:transparent url(../images/backgrounds/arrow-small.png) no-repeat scroll 0 5px;
    margin: 0 0 3px 0;
}

#page-children li a {
    text-decoration: none;
}

#page-children li a:hover {
    text-decoration: underline;
}

div.addthis {
    display: block;
    clear: both;
}