
/* ################################################### */
/* # version:   1.0                                  # */
/* # author:    A. Kaasschieter | Ibuildings.nl      # */
/* # e-mail:    info@ibuildings.nl                   # */
/* # website:   http://www.ibuildings.nl             # */
/* ################################################### */


/* GLOBAL RESET */
/* ################################################### */


html, body                          { width: 100%; height: 100%; }
body,div,dl,dt,dd,ul,ol,li,
h1,h2,h3,h4,h5,h6,
pre,form,fieldset,input,textarea,
p,blockquote
{  
  margin: 0; 
  padding: 0; 
} 
*                                   { line-height: 160%; }
#container .leftcol li, 
#container .rightcol .panelaqua li,
#container .rightcol .panelgreen li,
dd
{ 
  margin-left: 7%; 
}

fieldset                            { padding: .5em; }

* html div, * html li
{
  zoom:1;
}

a,
a:link
{
  color: #FFFFFF;
}

a:hover
{
  text-decoration: none;
}

* html img
{
 	behavior: url("/styles/jouwzld/iepngfix.htc");
}


/* HOOK */
/* ################################################### */


html
{
  background: #FFFFFF url(/img/jouwzld/body_bg.jpg) repeat-x left top;
}

body
{
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.8em;
  color: #FFFFFF;
  clear: both;
}

.decoration
{
  position: absolute;
  top: 600px;
  right: -80px;
  width: 249px;
  height: 249px;
  background: url(/img/jouwzld/deco.png) no-repeat top left;
}

#page
{
  position: relative;
  width: 960px;
  margin: 0px auto;
  text-align: left;
  min-height: 100%; 
  height: auto !important; 
  height: 100%; /* for IE */
  line-height: 100%;
}

#header
{
  display: block;
  position: relative;
  color: #323232;
  z-index: 200;
}

#header .top
{
  display: block;
  position: relative;
  height: 309px;
}

#header .top .logo
{
  z-index: 50;
  position: absolute;
  top: 22px;
  left: -57px;
  width: 458px;
  height: 279px;
  background: url(/img/jouwzld/logo.png) no-repeat left top;
 	behavior: url("/styles/jouwzld/iepngfix.htc");
}

#header .top .logo h1
{
  text-indent: -9999px;
}

#header .top .logo h1 a
{
  display: block;
  width: 458px;
  height: 279px;
}

#header .top .userlogin
{
  position: absolute;
  top: 50px;
  right: 0;
  width: 360px;
  height: 25px;
  background: url(/img/jouwzld/userlogin.gif) no-repeat left top;
}

#header .top .userlogin .text
{
  position: absolute;
  top: 2px;
  left: 5px;
  width: 100px;
  height: 19px;
  background: none;
  padding: 2px 0 0 0; 
  line-height: 120%;
  border: none;
  color: #FFFFFF;
}

#header .top .userlogin .password
{
  position: absolute;
  top: 2px;
  left: 130px;
  width: 100px;
  height: 19px;
  background: none;
  padding: 2px 0 0 0; 
  line-height: 120%;
  border: none;
  color: #FFFFFF;
}

#header .top .userlogin .button
{
  position: absolute;
  top: 0;
  left: 250px;
  width: 100px
  height: 24px;
  padding: 3px 50px 3px 10px;
  _padding: 2px 35px 3px 0;
  background: none;
  line-height: 120%;
  border: none;
  cursor: pointer;
  color: #FFFFFF;
  font-weight: bold;
}

#header .top .userlogout
{
  position: absolute;
  top: 50px;
  right: 0;
  width: 460px;
  height: 25px;
  color: #FFFFFF;
}

#header .top .userlogout span.text
{
  display: block;
  position: absolute;
  left: 0;
  top: 2px;
  width: 330px;
  text-align: right;
  height: 25px;
}

#header .top .userlogout span.userid
{
  color: #35a6d6;
  font-weight: bold;
}

#header .top .userlogout .logoutbutton
{
  display: block;
  position: absolute;
  right: 0;
  width: 100px;
  height: 23px;
  padding: 2px 0 0 10px;
  cursor: pointer;
  color: #FFFFFF;
  font-weight: bold;
  text-decoration: none;
  background: url(/img/jouwzld/userlogout.gif) no-repeat left top; 
}

#header .top .banner
{
  z-index: 30;
  position: relative;
  float: right;
  margin: 85px 0 0 0;
  width: 600px;
  height: 215px;
}

#header .top .banner1 { background: url(/img/jouwzld/banner1.png) no-repeat left top; }
#header .top .banner2 { background: url(/img/jouwzld/banner2.png) no-repeat left top; }
#header .top .banner3 { background: url(/img/jouwzld/banner3.png) no-repeat left top; }
#header .top .banner4 { background: url(/img/jouwzld/banner4.png) no-repeat left top; }
#header .top .banner5 { background: url(/img/jouwzld/banner5.png) no-repeat left top; }
#header .top .banner6 { background: url(/img/jouwzld/banner6.png) no-repeat left top; }
#header .top .banner7 { background: url(/img/jouwzld/banner7.png) no-repeat left top; }
#header .top .banner8 { background: url(/img/jouwzld/banner8.png) no-repeat left top; }


#header .center
{
  position: relative;
  display: block;
  width: 960px;
  height: 115px;
  margin: 0 0 10px 0;
  z-index: 400;
}

#header .bottom
{
  position: relative;
  display: block;
  width: 945px;
  height: 39px;
  margin: 0 0 10px 0;
  padding: 0 0 0 15px;  
  background: url(/img/jouwzld/subheader.jpg) no-repeat left top;
  
}

#header .bottom #breadcrumb
{
  position: relative;
  float: left;
  width: 500px;
  padding: 6px 0 0 0;
  color: #0f498d;
}

#header .bottom #breadcrumb span
{
  font-size: 1.2em;
  color: #FFFFFF;
  font-weight: bold;
}

#header .bottom #breadcrumb a
{
  color: #FFFFFF;
}

#search
{
  float: right;
  position: relative;
  width: 372px;
  height: 25px;
  margin: 6px 0 0 0;
  background: url(/img/jouwzld/searchbar.jpg) no-repeat left top;
}

#search .text
{
  position: absolute;
  top: 3px;
  left: 8px;
  _left: 8px;
  width: 315px;
  padding: 2px 0 0 0px; 
  background: none;
  border: none;
  line-height: 120%;
  color: #bfbfbf;
  text-align: left;
}

#search .button
{
  position: absolute;
  left: 328px;
  _left: 328px;
  width: 25px;  
  height: 25px;
  padding: 2px 10px 0 10px;
  background: none;
  line-height: 100%;
  border: none;
  cursor: pointer;
  color: #878787;
}

.panel #search
{
  float: left;
  position: relative;
  width: 550px;
  height: 35px;
  margin: 0;
  background: url(/img/jouwzld/searchbar2.png) no-repeat left top;
}

.panel #search .text
{
  position: absolute;
  top: 3px;
  left: 8px;
  _left: 8px;
  width: 495px;
  padding: 2px 0 0 0px; 
  background: none;
  border: none;
  line-height: 120%;
  font-size: 1.4em;
  color: #bfbfbf;
  text-align: left;
}

.panel #search .button
{
  position: absolute;
  left: 514px;
  _left: 514px;
  width: 35px;  
  height: 35px;
  padding: 2px 10px 0 10px;
  background: none;
  line-height: 100%;
  border: none;
  cursor: pointer;
  color: #878787;
}

#container
{
  position: relative;
  display: block;
  width: 960px;
  padding: 0 0 120px 0;  
  z-index: 0;
}

#container:after
{
  clear: both;
  display: block;
  height: 0;
  visibility: hidden;
}

#container .leftcol
{
  position: relative;
  float: left;
  width: 590px;
}

#container .rightcol
{
  position: relative;
  float: right;
  width: 360px;
}

#container-footer
{
  width: 960px;
  position: absolute;
  bottom: 0 !important;
  bottom: -1px; /* for certain IE widths */
  height: 100px;
  padding: 10px 0 0 0;
  font-size: 0.9em;
  color: #58928d;
  background: url(/img/jouwzld/dots_footer.gif) repeat-x left top;
}

#container-footer .left
{
  float: left;
  width: 450px;
}

#container-footer .left a.pz
{
  display: block;
  float: left;
  width: 66px; /* 49px; */
  height: 38px; /* 41px; */
  background: url(/topics/logo_jouwzeeland_pz.png) no-repeat left top; /* /img/jouwzld/footer_pz.png */
}

#container-footer .right
{
  position: absolute;
  right: 0;
  width: 360px;
}

#container-footer .right .volgons
{
  position: absolute;
  left: 0;
  top: -15px;
  width: 95px;
  height: 53px;
 	behavior: url("/styles/jouwzld/iepngfix.htc");
  background: url(/img/jouwzld/footer_volgons.png) no-repeat left top;}


#container-footer .right a
{
  display: block;
  float: right;
  margin-left: 10px;
}

#container-footer .right a.hyves { width: 57px; height: 38px; background: url(/img/jouwzld/footer_hyves.png) no-repeat left top; }
#container-footer .right a.twitter { width: 65px; height: 38px; background: url(/img/jouwzld/footer_twitter.png) no-repeat left top; }
#container-footer .right a.picasa { width: 98px; height: 38px; background: url(/img/jouwzld/footer_picasa.png) no-repeat left top; }
#container-footer .right a.youtube { width: 76px; height: 38px; background: url(/img/jouwzld/footer_youtube.png) no-repeat left top; }

#container-footer .right a.hyves:hover { background: url(/img/jouwzld/footer_hyves.png) no-repeat -57px top; }
#container-footer .right a.twitter:hover { background: url(/img/jouwzld/footer_twitter.png) no-repeat -65px top; }
#container-footer .right a.picasa:hover { background: url(/img/jouwzld/footer_picasa.png) no-repeat -98px top; }
#container-footer .right a.youtube:hover { background: url(/img/jouwzld/footer_youtube.png) no-repeat -76px top; }

#container-footer .left .text
{
  float: left;
  padding: 5px 0 0 10px;
}

#container-footer a
{
  color: #35a7d7;
  text-decoration: none;
}

#container-footer a span
{
  display: none;
}

#container-footer a:hover
{
  text-decoration: underline;
}

#container-footer .left,
#container-footer .right
{
  float: left;
}


/* BLOCKS */
/* ################################################## */


.paragraph
{
  position: relative;
  display: block !important;
  padding: 0 0 5px 2px;
  margin: 0 20px 15px 0;
}

.paragraph p
{
  padding: 0 0 10px 0;
}

.paragraph p a:link
{
  color: #FFFFFF;
}

.paragraph .paragraph
{
  margin: 0 0px 15px 0;
}

.gsaresult
{
  padding: 0 0 20px 0;
  background: url(/img/jouwzld/dots_horizontal.gif) repeat-x left bottom;
}

.psmall
{
  width: 260px;
}

.panelblue .overlay
{
  position: absolute;
  width: 307px;
  height: 270px;
  top: -18px;
  left: 290px;
  z-index: 10;
}

.panelred .overlay
{
  position: absolute;
  right: -5px;
  top: -20px;
  width: 100px;
}

.panelaqua .overlay
{
  position: absolute;
  right: -50px;
  top: -30px;
  width: 150px;
}

.panelpunt .overlay
{
  position: absolute;
  right: -65px;
  top: -17px;
  width: 120px;
}

.hulp
{
  display: block;
  width: 550px;
  background: url(/img/jouwzld/dots_horizontal.gif) repeat-x left bottom;
  min-height: 55px;
  _height: 55px;
}

.hulp .text
{
  width: 550px;
  float: left;
}

.hulp .text p
{
  width: 420px;
}

.hulpnodig
{
  position: absolute;
  top: -30px;
  right: 20px;
  width: 107px;
  height: 90px;
  background: url(/img/jouwzld/hulpnodig.png) no-repeat left top;
 	behavior: url("/styles/jouwzld/iepngfix.htc");
}

.hulpnodig a
{
  position: absolute;
  bottom: 0;
  behavior: none;
}

.leftcol .panel
{
  position: relative;
  display: block;
  width: 590px;
  margin: 0 0 10px 0;
}

.rightcol .panel
{
  position: relative;
  display: block;
  margin: 0 0 10px 0;
}

.panel .top
{
  height: 2px;
  line-height: 0;
  font-size: 0; 
}

.panel .bottom
{
  height: 2px;
  line-height: 0;
  font-size: 0;
}

.leftcol .panelblue
{
  background: url(/img/jouwzld/panel_blue_outer.png) repeat-y left top;
}

.leftcol .panelblue .top
{
  width: 590px;
  background: url(/img/jouwzld/panel_blue_top.png) no-repeat left top;
}

.leftcol .panelblue .center
{
  position: relative;
  width: 566px;
  margin: 0 0 0 2px;
  padding: 10px 0 10px 20px;
  min-height: 231px;
  _height: 231px;
  color: #FFFFFF;
  background: #49b0db url(/img/jouwzld/panel_blue_inner.png) no-repeat right bottom;
}

.leftcol .panelblue .bottom
{
  width: 590px;
  background: url(/img/jouwzld/panel_blue_bottom.png) no-repeat left top;
}

.leftcol .panelred
{
  background: url(/img/jouwzld/panel_red_outer.png) repeat-y left top;
}

.leftcol .panelred .top
{
  width: 590px;
  background: url(/img/jouwzld/panel_red_top.png) no-repeat left top;
}

.leftcol .panelred .center
{
  position: relative;
  width: 566px;
  margin: 0 0 0 2px;
  padding: 10px 0 10px 20px;  
  min-height: 231px;
  _height: 231px;
  color: #FFFFFF;
  background: #c01e4c url(/img/jouwzld/panel_red_inner.png) no-repeat left top;
}

.leftcol .panelred .bottom
{
  width: 590px;
  background: url(/img/jouwzld/panel_red_bottom.png) no-repeat left top;
}

.leftcol .panelmap
{
  background: #333333;
}

.leftcol .panelmap li
{
  margin: 0 !important;
}

.rightcol .panel
{
  position: relative;
  margin: 0 0 10px 0;
}

.rightcol .paneltagcloud
{
  width: 358px;
  border: 1px solid #c8c8c8;
  color: #b4b4b4;
  background: #FFFFFF;
}

.rightcol .paneltagcloud .center
{
  position: relative;
  width: 320px;
  margin: 0 0 0 2px;
  padding: 20px 16px 20px 20px;    
  color: #b4b4b4;
  text-align: center;
}

.rightcol .paneltagcloud .center a
{
  color: #b4b4b4;
}

.rightcol .paneltagcloud .center a:hover
{
  color: #0289BC;
}

.jztag_1 { font-size: 1em; }
.jztag_2 { font-size: 1.2em; }
.jztag_3 { font-size: 1.4em; }
.jztag_4 { font-size: 1.6em; }
.jztag_5 { font-size: 1.8em; }
.jztag_6 { font-size: 2.1em; }
.jztag_7 { font-size: 2.4em; }
.jztag_8 { font-size: 2.7em; }

.rightcol .panelgreen
{
  background: url(/img/jouwzld/panel_green_outer.png) repeat-y left top;
}

.rightcol .panelgreen .top
{
  width: 360px;
  background: url(/img/jouwzld/panel_green_top.png) no-repeat left top;
}


.rightcol .panelgreen p
{
  padding: 0 0 10px 0;
}

.rightcol .panelgreen .center
{
  position: relative;
  width: 320px;
  margin: 0 0 0 2px;
  padding: 10px 16px 10px 20px;    
  min-height: 200px;
  _height: 200px;
  color: #FFFFFF;
  background: url(/img/jouwzld/panel_green_inner.png) no-repeat bottom right;
}

.rightcol .panelgreen .bottom
{
  width: 360px;
  background: url(/img/jouwzld/panel_green_bottom.png) no-repeat left top;
}


.rightcol .panelaqua
{
  background: url(/img/jouwzld/panel_aqua_outer.png) repeat-y left top;
}

.rightcol .panelaqua .top
{
  width: 360px;
  background: url(/img/jouwzld/panel_aqua_top.png) no-repeat left top;
}

.rightcol .panelaqua p
{
  padding: 0 0 10px 0;
}

.rightcol .panelaqua .center
{
  position: relative;
  width: 320px;
  margin: 0 0 0 2px;
  padding: 10px 16px 10px 20px;    
  color: #FFFFFF;
}

.rightcol .panelaqua .bottom
{
  width: 360px;
  background: url(/img/jouwzld/panel_aqua_bottom.png) no-repeat left top;
}



.rightcol .panelpunt
{
  background: url(topics/panel_punt_outer2.jpg) repeat-y left top;
}

.rightcol .panelpunt .top
{
  width: 360px;
  background: url(topics/panel_punt_top.jpg) no-repeat left top;
}

.rightcol .panelpunt p
{
  padding: 0 0 10px 0;
}

.rightcol .panelpunt .center
{
  position: relative;
  width: 320px;
  margin: 0 0 0 2px;
  padding: 10px 16px 10px 20px;    
  color: #FFFFFF;
}

.rightcol .panelpunt .bottom
{
  width: 360px;
  background: url(topics/panel_punt_bottom.jpg) no-repeat left top;
}


.panel table.button
{
  position: relative;
  padding: 0;
  margin: 10px 0 10px 0;
  white-space: nowrap;
  line-height: 0;
  height: 25px;
  color: #ffffff;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.panel table.button td
{
  position: relative;
  display: block;
  padding: 0 25px 0 0;
  height: 25px;
}

.panel table.button a
{
  display: block;
  height: 19px;
  padding: 6px 10px 0 10px;
  text-decoration: none;
  line-height: 100%;
  color: #FFFFFF !important;
}

.panelblue .button td { background: url(../../img/jouwzld/bt_blue_arrow.gif) no-repeat right top; }
.panelblue .button { background: url(../../img/jouwzld/bt_blue.gif) no-repeat left top; }

.panelred .button td { background: url(../../img/jouwzld/bt_red_arrow.gif) no-repeat right top; }
.panelred .button { background: url(../../img/jouwzld/bt_red.gif) no-repeat left top; }

.panelgreen .button td { background: url(../../img/jouwzld/bt_green_arrow.gif) no-repeat right top; }
.panelgreen .button { background: url(../../img/jouwzld/bt_green.gif) no-repeat left top; }

form.meedenken
{
  position: relative;
  padding: 20px 0 0 0;
}

form .error
{
  color: #da0303 !important;
  font-weight: bold !important;
}

form.meedenken label
{
  display: inline;
  position: relative;
  float: left;
  clear: left;
  height: 20px;
  width: 55px;
  padding: 2px 0 0 0;
  margin: 0 0 10px 0;
}

form.meedenken input.text,
form.meedenken input.fancyFormText
{
  display: inline;
  position: relative;
  width: 240px;
  float: right;
  height: 20px;
  margin: 0 0 8px 0;
  padding: 2px 5px 0 5px;
  border: 1px solid #4d928d;
  background: #8fd2cd;
}

form.meedenken textarea
{
  display: inline;
  position: relative;
  float: right;  
  width: 240px;
  height: 100px;
  padding: 2px 5px 0 5px;
  border: 1px solid #4d928d;
  background: #8fd2cd;  
}

form.meedenken input.button
{
  display: block;
  position: relative;
  float: right;
  margin: 10px 0 5px 0;
  padding: 0px 25px 0 10px;
  white-space: nowrap;
  overflow: hidden;
  width: 104px;
  height: 25px;
  color: #ffffff;
  text-align: left;
  text-decoration: none;
  border: none;
  background: url(/img/jouwzld/bt_aqua_full.png) no-repeat left top;
}




.userloginfull form
{
  position: relative;
  padding: 20px 0 0 0;
}

.userloginfull form label
{
  display: block;
  position: relative;
  float: left;
  clear: left;
  height: 20px;
  width: 100px;
  padding: 2px 0 0 0;
  margin: 0 0 10px 0;
}

.userloginfull form input.text,
.userloginfull form input.password
{
  display: block;
  position: relative;
  clear: right;
  width: 380px;
  float: right;
  height: 20px;
  padding: 2px 5px 0 5px;
  border: 1px solid #dcdcdc;
  background: #befbf7 url(/img/jouwzld/form_field.png) repeat-x left top;
}

.userloginfull form a
{
  display: block;
  position: relative;
  float: right;
  padding: 10px 150px 10px 30px;
}

.userloginfull form input.button
{
  display: block;
  position: relative;
  float: right;
  margin: 10px 0 5px 0;
  padding: 0 0 3px 10px;
  overflow: hidden;
  width: 110px;
  height: 25px;
  color: #ffffff;
  text-align: left;
  line-height: 100%;
  text-decoration: none;
  border: none;
  background: url(/img/jouwzld/form_button.gif) no-repeat left top;
}





.panelred form.profiel
{
  background: #90183a;
  padding: 20px;
  display: block;
  width: 510px;
}

.panelred form.profiel table
{
  width: 100%;
}

.panelred form.profiel label
{
  display: block;
  padding: 2px 0 0 0;
}

.panelred form.profiel .field
{
  width: 340px;
}

.panelred form.profiel .field input
{
  width: 300px;
}

.panelred form.profiel .field span input
{
  width: auto;
}

.panelred form.profiel .field span.checkbox input
{
  background: none;
  border: none;
}

.panelred form.profiel .field .short input
{
  width: 180px !important; 
}

.panelred form.profiel input.fancyFormText
{
  height: 20px;
  padding: 2px 5px 0 5px;
  border: 1px solid #dcdcdc;
  background: #befbf7 url(/img/jouwzld/form_field.png) repeat-x left top;
}

.panelred form.profiel input.button
{
  display: block;
  position: relative;
  float: right;
  margin: 10px 0 5px 0;
  padding: 0px 25px 2px 5px;
  white-space: nowrap;
  overflow: hidden;
  width: 108px;
  height: 23px;
  color: #ffffff;
  text-align: left;
  text-decoration: none;
  line-height: 100%;
  border: none;
  background: url(/img/jouwzld/form_button.gif) no-repeat left top;
}

#jz_username
{
  margin: 0 0 10px 0;
}


.panelred form.algemeen
{
  background: #90183a;
  padding: 20px;
  display: block;
  width: 510px;
}

.panelred form.algemeen label
{
  display: inline;
  position: relative;
  float: left;
  clear: left;
  height: 20px;
  width: 95px;
  padding: 2px 0 0 0;
  margin: 0 0 10px 0;
}

.panelred form.algemeen input.fancyFormText
{
  display: inline;
  position: relative;
  width: 340px;
  float: right;
  height: 20px;
  margin: 0 0 8px 0;
  padding: 2px 5px 0 5px;
  border: 1px solid #dcdcdc;
  background: #befbf7 url(/img/jouwzld/form_field.png) repeat-x left top;
}

.panelred form.algemeen textarea
{
  display: inline;
  position: relative;
  float: right;  
  width: 340px;
  height: 100px;
  padding: 2px 5px 0 5px;
  border: 1px solid #dcdcdc;
  background: #befbf7 url(/img/jouwzld/form_field.png) repeat-x left top; 
}

.panelred form.algemeen input.button
{
  display: block;
  position: relative;
  float: right;
  margin: 10px 0 5px 0;
  padding: 0px 25px 2px 5px;
  white-space: nowrap;
  overflow: hidden;
  width: 108px;
  height: 23px;
  color: #ffffff;
  text-align: left;
  text-decoration: none;
  line-height: 100%;
  border: none;
  background: url(/img/jouwzld/form_button.gif) no-repeat left top;    
}



.panelaqua form.inschrijven
{
  display: block;
  width: 100%;
}

.panelaqua form.inschrijven table
{
  width: 100%;
}

.panelaqua form.inschrijven label
{
  display: block;
  padding: 2px 0 0 0;
}

.panelaqua form.inschrijven .field
{
  width: 180px;
}

.panelaqua form.inschrijven .field input
{
  width: 180px;
}

.panelaqua form.inschrijven input.fancyFormText
{
  height: 20px;
  padding: 2px 5px 0 5px;
  border: 1px solid #4d928d;
  background: #8fd2cd;
}

.panelaqua form.inschrijven input.button
{
  display: block;
  position: relative;
  float: right;
  margin: 10px 0 5px 0;
  padding: 0px 25px 0 5px;
  white-space: nowrap;
  overflow: hidden;
  width: 108px;
  height: 25px;
  color: #ffffff;
  text-align: left;
  text-decoration: none;
  line-height: 100%;
  border: none;
  background: url(/img/jouwzld/bt_aqua_full.png) no-repeat left top;
}



/* MAP */
/* ################################################### */


#map 
{
 	position: relative;
 	width: 590px;
 	height: 434px;
 	overflow: hidden;
}

#map a 
{
 	outline: none;
}

#map #bullets 
{
 	list-style: none;
}

#map #bullets li 
{
 	display: none;
 	position: absolute;
}

#map #bullets a 
{
 	display: block;
 	width: 13px;
 	height: 13px;
 	background: url(/img/jouwzld/bullet.gif) left top no-repeat;
	 text-indent: -9999px;
}

#map #pin 
{
 	display: none;
 	position: absolute;
 	width: 20px;
 	height: 30px;
	 background: url(/img/jouwzld/pin.gif) left top no-repeat;
}

.qtip 
{
 	font: 12px Arial, Helvetica, sans-serif;
}


/* NEWS */
/* ################################################### */


.newssummary,
.searchItem
{
  margin: 0 0 20px 0;
  display: block !important;
}

.newssummary .summary,
.searchItem .summary
{
  display: block;
}

.newssummary .summary img.imgleft,
.searchItem .summary img.imgleft
{
  display: block;
  max-width: 83px;
  _width: 83px;
}

.panelgreen .newssummary
{
  padding: 0 0 15px 0;
  border-bottom: 1px dotted #ffffff;
}

.leftcol .newssummary img,
.leftcol .searchItem img
{
  border: 1px solid #000000;
}

ul.tags
{
  display: block;
  position: relative;
  margin: 10px 0 0 0;
  width: 545px;
  height: 20px;
  overflow: hidden;
  white-space: nowrap;  
  z-index: 40;
}

ul.tags li
{
  list-style-type: none;
  display: inline;
  float: left;
  padding: 0;
  margin: 0 !important;
  height: 24px;
}

ul.tags a
{
  display: inline;
  text-decoration: none;
  float: left;
  font-size: 0.9em;
  padding: 2px;
  margin: 0 7px 0 0;
  padding: 0 5px 0 5px;
  background: #7b1431;
}

ul.tags a:hover
{
  background: #91314c;
}

ul.tags .line
{
  display: block;
  width: 1px;
  float: left;  
  height: 15px;
  position: relative;
}

ul.tags .line div
{
  background: transparent url(/img/jouwzld/dots_horizontal.gif) repeat-x left top;
  position: absolute;
  z-index: 30;
  left: 0;
  top: 0px;
  width: 600px;
  height: 12px;
}

/* GEEN TAGS DUS DAN MAAR VAST */

.newsfull
{
  background: url(/img/jouwzld/dots_horizontal.gif) repeat-x bottom left;
}



/* COMMENTS */
/* ################################################### */


.jzComments
{
  display: block !important;
  padding: 0 0 10px 0;
  background: url(/img/jouwzld/dots_horizontal.gif) repeat-x bottom left;
}

.jzComments .jzAvatar
{
  width: 83px;
  min-height: 50px;
  _height: 50px;
  float: left;
  margin: 0 10px 0 0;
}

.jzComments .jzAvatar img
{
  border: 1px solid #ffffff;
}

.jzComments .jzComment
{
  display: block;
  position: relative;
  float: left;
  width: 310px;
  padding-bottom: 10px;
}

.jzComments .jzCommentIcons
{
  display: block;
  float: right;
  width: 100px;
}

.jzComments .jzCommentIcons a
{
  display: block;
  float: left;
  width: 23px;  
  height: 23px;  
}

.jzComments .jzCommentIcons a.inappropriate { background: url(/img/jouwzld/icon_inappropriate.png) no-repeat left top;}
.jzComments .jzCommentIcons a.hyves { background: url(/img/jouwzld/icon_hyves.png) no-repeat left top;}
.jzComments .jzCommentIcons a.twitter { background: url(/img/jouwzld/icon_twitter.png) no-repeat left top;}

.jzComments .jzCommentIcons a span
{
  display: none;
}

.commentTable .textarea textarea
{
  padding: 2px 5px 0 5px;
  border: 1px solid #dcdcdc;
  background: #befbf7 url(/img/jouwzld/form_field.png) repeat-x left top;
}

.commentTable .send input
{
  display: block;
  position: relative;
  float: left;
  margin: 10px 0 5px 0;
  padding: 0px 25px 2px 5px;
  white-space: nowrap;
  overflow: hidden;
  width: 108px;
  height: 23px;
  color: #ffffff;
  text-align: left;
  text-decoration: none;
  line-height: 100%;
  border: none;
  background: url(/img/jouwzld/form_button.gif) no-repeat left top;
}


/* POLL */
/* ################################################### */


.jzPoll
{
  display: block;
  padding: 0 0 10px 0;
}

.panelblue .jzPoll input.button
{
  display: block;
  position: relative;
  float: left;
  margin: 10px 10px 0 0;
  padding: 0 0 3px 5px;
  white-space: nowrap;
  overflow: hidden;
  width: 110px;
  height: 25px;
  color: #ffffff;
  text-align: left;
  text-decoration: none;
  line-height: 100%;
  border: none;
  background: url(/img/jouwzld/form_button_blue.gif) no-repeat left top;
}

.panelblue .jzPoll a.button
{
  display: block;
  position: relative;
  float: left;
  margin: 10px 10px 0 0;
  padding: 5px 0 0 6px;
  white-space: nowrap;
  overflow: hidden;
  width: 104px;
  height: 20px;
  color: #ffffff;
  text-align: left;
  text-decoration: none;
  line-height: 100%;
  border: none;
  background: url(/img/jouwzld/form_button_blue.gif) no-repeat left top;
}



.panelred .jzPoll input.button
{
  display: block;
  position: relative;
  float: right;
  margin: 10px 0 5px 0;
  padding: 0px 25px 2px 5px;
  white-space: nowrap;
  overflow: hidden;
  width: 108px;
  height: 23px;
  color: #ffffff;
  text-align: left;
  text-decoration: none;
  line-height: 100%;
  border: none;
  background: url(/img/jouwzld/form_button.gif) no-repeat left top;
}

.panelred .jzPoll a.button
{
  display: block;
  position: relative;
  float: right;
  margin: 10px 0 5px 20px;
  padding: 4px 0 2px 5px;
  white-space: nowrap;
  overflow: hidden;
  width: 108px;
  height: 18px;
  color: #ffffff;
  text-align: left;
  text-decoration: none;
  line-height: 100%;
  border: none;
  background: url(/img/jouwzld/form_button.gif) no-repeat left top;
}

.panelred .jzPoll
{
  display: block;
  padding: 0 0 20px 0;
  margin: 0 0 20px 0;
  background: url(/img/jouwzld/dots_horizontal.gif) repeat-x bottom left;
}

span.jzHomePollStelling
{
  font-size: 1.2em;
  font-weight: bold;
  width: 300px;
  margin: 0 0 20px 0;
}

.panelblue span.jzHomePollStelling
{
  display: block;
  width: 300px;
  color: #333333;
}


/* MEDIA */
/* ################################################### */


.media
{
  margin: 10px 0 20px 0;
  padding: 0 0 20px 0;
  background: url(/img/jouwzld/dots_horizontal.gif) repeat-x bottom left;
}

.media .mediaLink 
{
  display: block;
  position: relative;
  float: left;
  height: 100px;
  margin-right: 8px;
  width: 125px;
}

.media .mediaLink img
{
  border: 1px solid #000000; 
}

.media .meta
{
  position: relative;
  float: right;
  width: 180px;  
}

.media .meta span
{
  display: block;
}


/* HEADERS */
/* ################################################### */


h2
{
  z-index: 40;
}

.panelblue h3,
.panelred h3,
.panelgreen h3,
.nieuwskop
{
  color: #FFFFFF;
  font-size: 1.2em;
  font-weight: bold;
}

h3 a
{
  text-decoration: none;
}

h3 a:hover
{
  text-decoration: underline;
}


/* GLOBAL FORM */
/* ################################################### */


form 
{
  margin: 0;
  padding: 0;
  display: inline;
}
 
input, select, textarea 
{
  font: 1em arial, helvetica, sans-serif;
}
 
textarea 
{
  line-height: 1.25;
}
 
label 
{
  cursor: pointer;
}


/* GLOBAL CLASSES */
/* ################################################### */


.clearfix:after 
{
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

.clearfix 
{
  display: inline-block;
}

html[xmlns] .clearfix 
{
  display: block;
}

* html .clearfix 
{
  height: 1%;
}

.clear        { clear: both; }
.floatleft    { float: left !important; }
.floatright   { float: right !important; }
 
.textleft     { text-align: left; }
.textright    { text-align: right; }
.textcenter   { text-align: center; }
.textjustify  { text-align: justify; }
 
.bold         { font-weight: bold; }
.italic       { font-style: italic; }
.underline    { border-bottom: 1px solid; }
.highlight    { background: #ffc; }

a img         { border: none; } 
.imgleft, .alignleft      { float: left; margin: 4px 10px 4px 0; }
.imgright, .alignright     { float: right; margin: 4px 0 4px 10px; }
 
.noindent     { margin-left: 0; padding-left: 0; }
.nobullet     { list-style: none; list-style-image: none; }

#atk_debugging_div
{
  clear: both;
  color: #333333;
  font-size: 1.2em;
  margin: 0 0 0 25px;  
}

.eventcalendar
{
	width: 100%;
	margin-bottom: 15px;
}

.eventcalendar .days td,
.eventcalendar .weekdays td,
.eventcalendar .navigate td
{
	text-align: center;
	padding: 2px 0 2px 0;
}

.eventcalendar .days td
{
	width: 14%;
	padding: 4px 0 2px 0;
	height: 20px;
}

.eventcalendar .days .othermonth
{
  color: #bcbcbc;
}

.eventcalendar .navigate
{
	background: #3887a9;
	color: #FFFFFF;
	font-weight: bold;
}

.eventcalendar .weekdays
{
	background: #68aaa6;
	color: #FFFFFF;
}

.eventcalendar .days .today
{
	color: #0081c6;
}

.eventcalendar .days .event a
{
	background: #c01e4c;
	color: #ffffff;
	display: block;
	text-decoration: none;
	margin: 0px auto;
	width: 20px;
}

.eventcalendar .days .event a:hover
{
	background: #0081C5;
	color: #ffffff;
}

.eventcalendar .days .eventout a
{
	background: #bdd49a;
	color: #ffffff;
	display: block;
	text-decoration: none;
	margin: 0px auto;
	width: 20px;
}

.eventcalendar .days .eventout a:hover
{
	background: #86CCEF;
	color: #ffffff;
}

a.previousmonth, a.previousmonth:visited,
a.nextmonth, a.nextmonth:visited
{
	display: block;
	text-align: center;
	background: #165976;
	color: #FFF;
	text-decoration: none;
	margin: 0px auto;
	width: 20px;
}

a.previousmonth:hover,
a.nextmonth:hover
{
	background: #c01e4c;
}


/* GOV_VIDEO CLASSES */
/* ################################################### */


body#fullscreen 
{
    	height: 100%;
	width: 100%;
	margin: 0;
	padding: 0;
}

span.metageg {display: block; color: #fff;}

/* css for movie */
.moviecontent, .audiocontent { width: 400px; } /* a default value will be replaced by movie width */
.moviecontent ul, .audiocontent ul {border: 0;overflow:hidden;margin:0;padding:15px 0 10px 0; list-style:none; }
.moviecontent li, .audiocontent li {background-image:none;padding:0;margin:0;border:1px;}

.moviecontent h3, .audiocontent h3 { border-bottom:1px solid #fff; color: #000; margin: 0px; padding: 0px 0 0px 0; font-size: 100%;}
.moviecontent li h3 a, .audiocontent li h3 a {border-bottom: 0px solid #FFF; color: #000;}
.moviecontent li h3 a:hover, .audiocontent li h3 a:hover {color: #000;}

.moviecontent li a {display: block; padding: 10px 15px 3px 0; font-weight: bold; border-bottom:1px solid #dedede; background:url("img/pijl.gif") right no-repeat;height:1%; text-decoration: none; color: #000;}
.moviecontent li li a { font-weight: normal; padding: 10px 15px 3px 0;}
.moviecontent li a:hover {color: #000; border-bottom: 1px solid #000; background:url("img/pijl-hover.gif") right no-repeat;}


.audiocontent li a {display: block; padding: 2px 15px 3px 0; font-weight: bold; border-bottom:1px solid #dedede; background:url("img/pijl.gif") right no-repeat;height:1%; text-decoration: none; color: #000;}
.audiocontent li li a { font-weight: normal; padding: 2px 15px 3px 0;}
.audiocontent li a:hover {color: #000; border-bottom: 1px solid #000; background:url("img/pijl-hover.gif") right no-repeat;}


.moviecontent li p a, .audiocontent li p a {display: inline; text-decoration: underline; color: blue; background: #FFF; border: 0; padding: 0; margin: 0; font-weight: normal;}
.moviecontent li p a:hover, .audiocontent li p a:hover {display: inline; text-decoration: underline; color: blue; background: #FFF; border: 0; padding: 0; margin: 0;}

.moviecontent li img, .audiocontent li img { margin-bottom: -4px; border:0px;}

.moviecontent li a.open, .audiocontent li a.open { background:url("img/pijl-open.gif") right no-repeat; }
.moviecontent li a.open:hover, .audiocontent li a.open:hover { background:url("img/pijl-open-hover.gif") right no-repeat; }
.moviecontent ul.open, .moviecontent div.open, .moviecontent p.open,
.audiocontent ul.open, .audiocontent div.open, .audiocontent p.open {display: block; }
.moviecontent li a.close, .audiocontent li a.close { background:url("img/pijl.gif") right no-repeat; }
.moviecontent li a.close:hover, .audiocontent li.close:hover { background:url("img/pijl-hover.gif") right no-repeat; }
.moviecontent ul.close, .moviecontent div.close, .moviecontent p.close,
.audiocontent ul.close, .audiocontent div.close, .audiocontent p.close  {display:none;}
.moviecontent li.transcription div, .audiocontent li.transcription div { margin:0; padding:0; border-bottom: 1px solid #FFF;}

.moviecontent li.transcription span.actor, .audiocontent li.transcription span.actor { font-weight: bold;}
.moviecontent li.transcription span.handeling, .moviecontent li.transcription span.audiobeschrijving, 
.moviecontent li.transcription span.gebaar, .moviecontent li.transcription span.sfeer, 
.moviecontent li.transcription span.geschreventekst,
.audiocontent li.transcription span.handeling, .audiocontent li.transcription span.audiobeschrijving, 
.audiocontent li.transcription span.gebaar, .audiocontent li.transcription span.sfeer, 
.audiocontent li.transcription span.geschreventekst  { font-style: italic;}
