html
{
  overflow-y:        scroll;
}

body
{
  font-family:       Arial, helvetica, sans-serif;
  font-size:         80%;
  margin:            0;
  padding:           0 0 15px 0;
}

h1
{
  color:             #3e98ad;
  font-size:         170%;
  font-weight:       bold;
  font-family:       "Arial Black", Arial, Sans-Serif;
  margin: 8px 0;
}

img
{
  border: 0;
}

a
{
  text-decoration:   none;
  color:             #2295A8;
}

a:hover
{
  text-decoration:  underline;
}

.button
{
  float:            right;
  padding:          2px 3px;
  color:            white;
  font-weight:      bold;
  background-color: #666666;
}

#centeredcontent
{
  position:       relative;
  zoom:           1;

  width:          981px;
  margin:         0 auto;
  overflow:       visible;
}

.header
{
  position:       relative;
  margin-bottom:  2px;
  height:         73px;
}

#headerimage
{
  display:        block;
  width:          981px;
  height:         73px;
}

.planselectie
{
  position:         absolute;
  right:            0px;
  bottom:           0px;
  z-index:          5;

  font-family:      Arial Black;
  font-size:        1.4em;
  width:            254px;
  line-height:      34px;

  /* 257 x 34
  background:       #dbdbdb url('../images/planselectie_bg.png') no-repeat scroll top left;*/
  background-color: #dbdbdb;
}

.planbutton
{
  display:          block;
  width:            72px;
  height:           34px;
  text-align:       center;
  color:            #000;
}

.planbutton:hover
{
  background-color: #e5c0c0;
  text-decoration:  none;
}

.planselectie .planbutton.selected
{
  width:            70px; /* 72-2*1 */
  height:           32px; /* 34-2*1 */
  border:           1px solid #ffffff;

  color:            #ffffff;
  background-color: #f2343e;
}



/*
                  Height   Back      DisabledLink   SelectedLinkBG
mainnav           25px     #2295a8                  #f2343e
pagenavbar        22px     #3e98ad   #95cbd7
pagenavbar.below  23px     #3d97ad   #93c7d1

rightcolumn       ----     #dbdbdb

legenda           ----     #ffc300
legendasub        ----     #ede173


newsdate          19px     #a6a6a6
*/

.mainnav
{
  color:             #ffffff;
  background-color:  #3e98ad; /* blue */

  font-size:         1em;
  height:            25px;
  line-height:       25px;
}

.mainnav a
{
  display:           inline-block;
  padding:           0 15px;
  color:             #ffffff;
  font-weight:       bold;
}

.mainnav a.selected
{
  background-color:  #f2343e;
}

.langselect
{
  position:          absolute;
  right:             10px;
  top:               0;
}

.langselect a
{
  padding:           0 3px;
}



.pagelayout
{
  border-collapse:  collapse;
}
.pagelayout td
{
  padding:          0;
  vertical-align:   top;
}



.leftcolumn
{
}

.pagetitle
{
  font-size:        170%;
  font-weight:      bold;
  color:            #3e98ad;

  height:           47px;
  line-height:      47px;
}

.leftcolumn .divider
{
  height:           2px;
  background-color: #ffc300;
  font-size:        0; /*IE*/
  margin-bottom:    17px;
}


.rightcolumn
{
  background-color: #dbdbdb;
}
.rightcolumn .legendatitle
{
  font-size:        170%;
  font-weight:      bold;
  color:            #000000;

  padding:          0 15px;

  height:           47px;
  line-height:      47px;
  background-color: #ffc300;
}
.rightcolumn .divider
{
  height:           2px;
  background-color: #ffffff;
  font-size:        0; /*IE*/
}
.rightcolumn .legenda
{
  padding:          8px 0 4px 0;
  background-color: #ffc300;
}
.rightcolumn .legendasub
{
  background-color: #ede173;
}


.rightcolumn .seemap
{
  background-color: #ffc300;
}

.rightcolumn .seemap .label
{
  font-weight: bold;
  font-size: 110%;
}

.rightcolumn .seemap .label a
{
  color: #000000;
  text-decoration: none;
}

.rightcolumn .seemap .label a:hover
{
  text-decoration: underline;
}

.legenda a
{
  display:          block;

  color:            #000;
  font-weight:      bold;
  text-decoration:  none;

  padding:          2px 14px 2px 31px; /* 17+14 */
  margin-bottom:    10px; /* 18-2*2 */
}

.legenda a.selected,
.legenda a:hover
{
  background:       transparent url('../images/selectedinlegenda.png') no-repeat scroll 16px center;
}
.rightcolumn .legendasub a:hover
{
  background-image: none;
  background-color: #fff27c;
}
.rightcolumn .legendasub a.selected
{
  background-image: none;
  background-color: #ffffff;
}



.search
{
  margin-top:       15px;

  position:         relative;
  border:           1px solid #b2b1b1;
  background-color: #ffffff;
  height:           19px; /* 23-2*2 */

  padding:          2px 28px 2px 4px;
}
.search .searchinput
{
  border:           0;
  width:            100%;
}
.search .submitimage
{
  position:         absolute;
  right:            0;
  top:              0;
}

.rightcolumn .lowerpart
{
  padding:          4px 14px 20px 14px;
}





.pagenavbar
{
  background-color: #3e98ad; /* blue */
  height:           22px;
  line-height:      22px;

  margin-bottom:    20px;
}
.pagenavbar .disabled
{
  color:            #95cbd7;
}
.pagenavbar a
{
  color:            #ffffff;
}


.pagenavbar .prev
{
  margin-left:      6px;
  background:       transparent url('../images/pagenav_arrowleft.png') no-repeat scroll center left;
  padding-left:     17px;
}
.pagenavbar .next
{
  margin-right:     6px;
  background:       transparent url('../images/pagenav_arrowright.png') no-repeat scroll center right;
  padding-right:    17px;
}
.pagenavbar .prevdisabled
{
  color:            #95cbd7;
  background:       transparent url('../images/pagenav_arrowleft_disabled.png') no-repeat scroll center left;
}
.pagenavbar .nextdisabled
{
  color:            #95cbd7;
  background:       transparent url('../images/pagenav_arrowright_disabled.png') no-repeat scroll center right;
}

.documentnavbar
{
  background-color: #D9D9D9;
  height:           22px;
  line-height:      22px;

  margin-bottom:    20px;
}
.documentnavbar .disabled
{
  color:            #95cbd7;
}
.documentnavbar a
{
  color:            #2295a8;
}


.documentnavbar .prev
{
  margin-left:      6px;
  background:       transparent url('../images/graybg_arrowleft.png') no-repeat scroll center left;
  padding-left:     17px;
}
.documentnavbar .next
{
  margin-right:     6px;
  background:       transparent url('../images/graybg_arrowright.png') no-repeat scroll center right;
  padding-right:    17px;
}
.documentnavbar .prevdisabled
{
  color:            #95cbd7;
  background:       transparent url('../images/pagenav_arrowleft_disabled.png') no-repeat scroll center left;
}
.documentnavbar .nextdisabled
{
  color:            #95cbd7;
  background:       transparent url('../images/pagenav_arrowright_disabled.png') no-repeat scroll center right;
}

.documentpath a
{
  color: black;
}
/*td*/.pagenumbers
{
  text-align:       center;
  width:            100%;
}
/*td*/.pagenumbers a
{
  padding:          2px 5px;
}
.pagenumbers a.selected
{
  background-color:  #f2343e;
}



.newsitem
{
  color:            #353535; /* donkergrijs */
}

.newsitem:hover
{
  cursor: pointer;
}

#agendaitem .backlink
{
  padding: 10px 0 0 0;
}

#agendaitem div.newsdate
{
  margin: 10px 0 0 0;
}


/* 125x19 */
.newsdate
{
  background-color: #a6a6a6;
  color:            #ffffff;
  font-weight:      bold;

  margin-bottom:    10px;

  width:            119px; /* 125-3*2 */
  padding:          0 3px;

  height:           19px;
  line-height:      19px;
}

.newstitle
{
  color:            #3e914f; /* groen */
  font-weight:      bold;

  font-size:        1.2em;

  margin-bottom:    10px;
}

/* kleur van 'meer' link */
.newslink
{
  color:            #e73134; /* rood */
  font-weight:      bold;
}

.newspage hr
{
  margin:           15px 0;
  border:           0;
  border-top:       1px solid #3e98ad;
  height:           1px;
}

.newspage div.image
{
  padding-right: 20px;
}

.expandnews
{
  color:            #e73134;
  font-weight:      bold;
  white-space:      nowrap;
}

#bottombar
{
  padding: 15px 0 0 0;
}

#bottombar .colofon
{
  padding: 7px 0 0 0;
}

#bottombar .colofon .vtm
{
  color: #2295a8;
  font-weight: bold;
}

#bottombar .colofon .axis, #bottombar .colofon .axis a
{
  color: #979797;
}

#bottombar .colofon .axis a
{
  text-decoration: underline;
}

#bottombar .colofon .axis a:hover
{
  text-decoration: none;
}

.whc .whc_header { color: #000000; }
.whc .navpages { padding: 20px 0px 20px 0px; }
.whc .result_header a{ margin: 0px 0px 0px 0px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size:14px; color: #1b904c;  border: none; }
.whc .whc_lijn hr { color: #2295A8; height: 1px; }

.graybox
{
  background-color: #dbdbdb;
  padding:          20px 33px 20px 33px;
}

.graybox div.textheader
{
  color: #2295a8;
  padding: 15px 0 10px 0;
  font-weight: bold;
  font-size: 13pt;
}

.backlink
{
  padding: 0 0 10px 0;
}
.backlink a
{
  color: #2295a8;
  text-decoration: none;
}

.backlink a:hover
{
  text-decoration: underline;
}

.rightvideobanner
{
  padding: 20px 0 10px 0;
  margin: 0 0 0 13px;
}

.rightvideobanner .title
{
  font-weight: bold;
  padding: 10px 0;
}

#area div.headerimage
{
  padding: 0;
}

#area div.subject
{
  width: 690px;
  background-color: #ffc300;
  color: white;
  font-size: 140%;
  font-weight: bold;
  margin: 0 0 10px 0;
  padding: 5px 0 5px 10px;
}

/*************************************

Styling pulldown menu

*************************************/

#nav,
#nav ul
{
  color:             #ffffff;
  background-color:  #3e98ad; /* blue */

  font-size:         1em;
  font-weight: bold;

/*  height:            25px;*/

  float: left;
  width: 100%;

  list-style: none;
/*  line-height: 1;*/

  padding: 0;
  border: 0;
  margin: 0 0 0 0;
}

#nav li
{
  float: left;
  padding: 0px;
/*  width: 12%;*/

  padding: 0 10px;
}

#nav li.selected
{
  color:            #ffffff;
  background-color: #f2343e;
}

#nav ul li a
{
  color:       #2295a8;
}

#nav li:hover,
#nav li.sfhover
{
}

#nav a
{
  color:       #ffffff;
  font-family: arial, helvetica, sans-serif;

  display: block;
/*  width: 12%;*/
  text-decoration: none;
  padding: 5px 0px;
}

#nav a.toplevel
{
  white-space: nowrap;
}

#nav a.toplevel:hover
{
  text-decoration: underline;
}

/* ALL menu items with sub items */
#nav a.hassub
{
  background: url('../images/pulldownmenu_submenuarrow.png') center right no-repeat;
}
#nav ul li:hover a.hassub,
#nav ul li.sfhover a.hassub
{
  background: url('../images/pulldownmenu_submenuarrow_hover.png') center right no-repeat;
}

#nav li ul
{
  position: absolute;
  left: -999em;
/*  display: none;*/

  height: auto;
  width: 175px;

  margin: 0;

  font-weight:      normal;
  background-color: #eaf4f5;
  border:           1px solid #2295a8;
}

#nav li li
{
  padding: 5px 10px 5px 5px;
  width: 160px;
}
#nav li li:hover,
#nav li li.sfhover
{
  background-color: #ffc300;
}

#nav li ul a
{
  width: 150px;
  padding:0px;
}

#nav li ul ul
{
  margin: -15px 0 0 162px;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul
{
  left: -999em;
  /*display: none;*/
}

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul
{
  left: auto;
/*  display: block;*/
}

/*************************************

Photo viewer

*************************************/


.photoviewer
{
  background-color: #dbdbdb;
  padding:          20px 0 20px 0; /* need 25px at sides */
}

.photobrowse
{
  margin:           0 0 7px 0;
  text-align:       center;
}
.photoenlargement
{
  margin:           0 auto;
}

.photobrowse *
{
  vertical-align:   middle;
}

#photocount
{
  display:          -moz-inline-box;
  display:          inline-block;
  width:            60px;
  text-align:       center;

  font-weight:      bold;
  color:            #2295a8;
}

.prevthumb
{
  display:          -moz-inline-box;
  display:          inline-block;
  width:            26px;
  height:           22px;
  background-image: url('../images/skin/photo_prev.png');
  cursor:           pointer;
}

.nextthumb
{
  display:          -moz-inline-box;
  display:          inline-block;
  width:            26px;
  height:           22px;
  background-image: url('../images/skin/photo_next.png');
  cursor:           pointer;
}

.thumbbrowser_horizontal
{
  background-color: #323232;

  margin:           0 27px 0 22px;

  height:           62px;
  padding:          1px 0 1px 1px;
  border:           1px solid #939393;
}


.photoframe
{
  display:          table-cell;
  display:          inline-block;
  position:         relative;
  padding:          1px 9px 9px 2px;
}

#fullsizeimage
{
  display:          block;
}

.photoframe .topleft
{
  position:         absolute;
  top:              0px;
  left:             0px;

  width:            2px;
  height:           8px;
  background:       url('../images/skin/photoframe_tl.png') no-repeat scroll top left;
  font-size:        0; /* fix IE */
}

.photoframe .topmid
{
  position:         absolute;
  top:              0px;
  left:             2px;
  right:            9px;
  height:           1px;
  background:       url('../images/skin/photoframe_tm.png') repeat-x scroll top left;
  font-size:        0; /* fix IE */
}

.photoframe .topright
{
  position:         absolute;
  top:              0px;
  right:            1px;

  width:            8px;
  height:           8px;
  background:       url('../images/skin/photoframe_tr.png') no-repeat scroll top left;
  font-size:        0; /* fix IE */
}

.photoframe .midleft
{
  position:         absolute;
  left:             0px;
  top:              8px;
  bottom:           9px;

  width:            2px;

  background:       url('../images/skin/photoframe_ml.png') repeat-y scroll top left;
  font-size:        0; /* fix IE */
}

.photoframe .midright
{
  position:         absolute;
  right:            0px;
  top:              8px;
  bottom:           9px;

  width:            9px;

  background:       url('../images/skin/photoframe_mr.png') repeat-y scroll top left;
  font-size:        0; /* fix IE */
}

.photoframe .bottomleft
{
  position:         absolute;
  bottom:           0px;
  left:             0px;

  width:            8px;
  height:           9px;
  background:       url('../images/skin/photoframe_bl.png') no-repeat scroll top left;
  font-size:        0; /* fix IE */
}

.photoframe .bottommid
{
  position:         absolute;
  bottom:           0px;
  left:             8px;
  right:            9px;
  height:           9px;
  background:       url('../images/skin/photoframe_bm.png') repeat-x scroll top left;
  font-size:        0; /* fix IE */
}

.photoframe .bottomright
{
  position:         absolute;
  bottom:           0px;
  right:            1px;

  width:            8px;
  height:           9px;
  background:       url('../images/skin/photoframe_br.png') no-repeat scroll top left;
  font-size:        0; /* fix IE */
}

/*************************************

Styling overzicht pagina's (mensen/video)

*************************************/

.media
{
  /* establish new positioning context */
  position:         relative;

  background-color: #f0f0f0;
}

.mediapopup_anchor
{
  display:          none;
  position:         absolute;
  left:             66px;
  top:              57px;
  z-index:          20;
}

.media.hover /* For IE */
{
  /* since IE also regards <td> as positioning context,
     we must give media a z-index so the next <td> won't overlap our popup */
  z-index:          20;
}

.media:hover .mediapopup_anchor,
.media.hover .mediapopup_anchor /* For the IE6 fix we use a hover class instead of pseudo-class */
{
  display:          block;
}

.mediapopup
{
  position:         absolute;
  left:             0px;
  bottom:           0px;
}

.mediapopup .content
{
  width:            284px; /* 322-38 */
  padding:          19px 22px;

  color:            #ffffff;
  background-color: #00a800;
}

.mediapopup .bottom
{
  width:            40px;
  height:           34px;
  background:       transparent url('../images/mediapopup_bottom.png') no-repeat scroll center right;
}

.mediapopup .title
{
  font-size:        1.2em;
  font-weight:      bold;
  margin:           2px 0 5px 0;
}

.mediapopup .body
{
  margin-bottom:    10px;
}
.mediapopup a
{
  color:            #ffffff;
  font-weight:      bold;
}




/* video overzicht */
.videokolom {
 width: 243px;
 background-color: #2295A8;
 padding-left: 10px;}

.videokolom h1{
 color: #FFFFFF;}

.videotitel{
  color: #FFFFFF;
  margin: 10px 0px 10px 0px;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  padding: 0px 0px 0px 0px; font-size:18px;
}

.video_title{
        position: absolute;
  z-index: 5001;
        bottom: 2px;
        left: 2px;
  padding-left: 10px;
        color: #FFFFFF;
  font-weight: bold;
        height: 38px;
}

.videoholder{
  position: relative;
  display:block;
  cursor:pointer;
        margin:0px 15px 0px 0px;
        width:224px;
        height:126px;
        background-repeat:no-repeat;
        background-color:white;
        background-position:50% 50%;}

.video_title_bg{
        position: absolute;
  z-index: 5000;
        bottom: 2px;
        left: 2px;
        width: 220px;
        height: 38px;
        background-color: #2295A8;
        opacity:.80;filter: alpha(opacity=80); -moz-opacity: 0.8;
}

#videomeer{
  display:block;
  bottom: 0px;
  color: #FFFFFF;
  font-weight: bold;
  border:none;
}

img.videomask{
        background-repeat:no-repeat;
        background-color:transparent;
        background-position:0px 0px;
        background-image: url('../images/film_masker.png');}

img.videomask_wit{
        background-repeat:no-repeat;
        background-color:transparent;
        background-position:0px 0px;
        background-image: url('../images/film_masker_wit.png');}


/* overlay window voor media weergave */

/* venster die in volledig scherm boven de content komt liggen */
#qblendframe
{
  display:none;
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  left:0;
  height:100%;
  width:100%;
  margin:0;
  padding:0;
  background:#2593a5;
  z-index:10000;
}

/* viewport voor de media de gecentreerd in venster staat */
#qmediaframe
{
  display:none;
  position:fixed;
  top:0px;
  left:0px;
  width:1px;
  height:1px;
  border:none;
  margin:0;
  padding:0;
  z-index:10001;
  background-color:transparent;
  overflow:hidden;
}

#qmediacontent
{
  position:relative;
  top:25px;
  left:0px;
  border:1px solid white;
  margin:0;
  padding:0;
  z-index:10001;
  background-color:black;
}


#closemediabutton{
  position: relative;
  top:0px;
  left:0px;
  height:1px;
  z-index:14000;
}

#closemediabutton img{
  position: absolute;
  top: -10px;
  right: -10px;
  width: 25px;
  height: 26px;
  cursor: pointer;
  z-index:15000;
}

.playvideoimage
{
  position: absolute; 
  
  left: 150px;
  top: 82px;
}
