
/* Stylesheet for Frameworx FWX01 site... */

/* For W3C browsers: make sure the entire window is filled. */
html {
  margin:0px;
  padding:0px;
  _padding-right:20px;  /* This seems to prevent unecessary scrollbars in IE6 */
  width:100%;
  height:100%;
  overflow:auto;
}

.content_body, body {
  width:100%;
  height:100%;
  margin:0px;
  padding:0px;
  margin-right:-26px;
  color:#444444;
  font-family:Arial, Helvetica, sans-serif;
  background:#FFFFFF url(/p-httpd/_cache/_style/images/canvas_sides.gif) repeat-y scroll 50% 0;
}

/* From here: normal style definitions */

a       { color:#660099; text-decoration:none; }
a:hover { text-decoration:underline; }

p    { color:#444444; font-size:13px; padding:0px; margin:0px; margin-top:8px; line-height:130%; }
h1   { color:#444444; padding:0px; font-size:20px; font-style:normal; font-weight:normal; }
.cms_titel { color:#444444; padding:0px; font-size:20px; font-style:normal; font-weight:normal; line-height:130%; }
h2   { font-size:13px; }
h3   { font-size:14px; }
h4   { font-size:15px; }

hr { color:#CCAAFF; height:1px; padding:0px; margin:0px; }

ol, ul, ul p {
  font-size:12px;
  list-style-image:url(/p-httpd/_style/images/bullet.gif);
  margin:0px;
  margin-bottom:0px;
  padding:10px;
  padding-top:5px;
  padding-bottom:0px;
}

li {
  font-size:12px;
  margin-left:15px;
}

img { padding:0px; margin:0px; margin-top:3px; margin-bottom:3px; }

/* From here: positioning all the divs */
/* NOTE: Content divs (like content, columns) may not have top or bottom paddings or margins!!! */
#center{ 
  height:100%; 
  width:982px; 
  padding:0px; 
  margin:0px; 
  margin-left:auto; 
  margin-right:auto; 
  text-align:left; 
}

#canvas  {
  width:982px;
  height:100%;
  padding:0px;
  margin:0px;
  float:left;
  background-color:#DDCCFF;
}

#menu-bg {
  position:fixed;
  margin-top:-3px;
  margin-left:-1px;
}

#logo {
  left: -3px;
  top: 5px;
}

#site { width:983px; background-color:#DDCCFF; }

#content {
  border-left:1px solid #DDCCFF;
  margin:0px; 
  padding:0px;
  margin-top: 50px;
  padding-left:10px; 
  padding-right:10px;
  background-attachment:fixed;
 }


#column_left { 
    position:absolute; 
    top:0px; 
    width:204px; 
    margin:0px; 
    margin-left:0px; 
    padding:0px; 
    padding-left:10px; 
    padding-right:10px;
}
#column_middle    {
  position:absolute;
  top:0px;
  width:736px;
  margin:0px;
  margin-left:224px;
  padding:0px;
}



/* ------------------------- navpath / breadcrumbs ------------------------- */
.navpathHolder { margin:0 0 20px 0; }
.navpath {
  width: 100%;
  height: 15px;
  margin: 0px;
  padding: 0px;
  padding-bottom:6px;
  display: block;
  overflow: hidden;
  background-image:url(images/navpath_grad.gif);
  background-color:#FFFFFF;
  background-position:top left;
  background-repeat:repeat-x;
  border-bottom:1px solid #CCCCCC;
}
.navpath ul {
  margin: 0;
  padding: 0;
  padding-left:5px;
  height: 21px;
  display: block;
}
.navpath ul li {
  display: block;
  float: left;
  position: relative;
  height: 21px;
  overflow: hidden;
  line-height: 21px;
  margin: 0px 6px 0px 0;
  padding: 0px 10px 0px 0;
  font-size: .9167em;
  background: url(images/navpath_arrow.png) no-repeat 100% 0;
}
.navpath ul li div.chevronOverlay {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 2;
}
.navpath ul li span {
  display: block;
  overflow: hidden;
}
.navpath ul li a {
  display: block;
  position: relative;
  height: 21px;
  line-height: 21px;
  overflow: hidden;
  float: left;
}
.navpath ul li.first a {
  height: 16px !important;
  text-indent:-1000em;
  width:16px;
  padding: 0;
  margin-top: 2px;
  overflow: hidden;
  background:url(/p-httpd/_cms/toolbox/jquery/breadcrumb/Images/IconHome.gif) no-repeat 0 0;
}
.navpath ul li.first a:hover {
  background-position: 0 -16px;
}
.navpath ul li.last {
  background: none;
  margin-right: 0;
  padding-right: 0;
}
.chevronOverlay {
  display: none;
  background: url(images/navpath_arrow_overlay.png) no-repeat 100% 0;
  width: 20px;
  height: 20px;
}


/* From here: the menus */

#menu {
  width:158px;
  margin:0px;
  padding:0px;
  margin-top:120px;
  margin-left:20px;
  text-indent:0px;
  background-color:transparent;
  border-bottom: 1px solid #CCAAFF;
  border-left: 1px solid #CCAAFF;
  border-right: 1px solid #CCAAFF;
  opacity:0.9;
  filter:alpha(opacity=90);
}

#menu a.head {
  width:158px;
  height:25px;
  cursor:pointer;
  color:#660099;
  background-color:#CCAAFF;
  display:block;
  font-size:14px;
  font-weight:bold;
  margin:0px;
  padding:0px;
  text-indent:8px;
  line-height:25px;
  text-decoration: none;
  border-top: 1px solid #CCAAFF;
}


/* Hover and selected states... */
#menu li a:hover {
  background-color:#DDCCFF;
}

#menu li.cms_selected a.head,
#menu li.cms_expanded a.head,
#menu li li.cms_selected a {
  color:#660099;
  background-color:#DDCCFF;
}

#menu li li a:hover {
 color:#660099;
 background-color:#DDCCFF;
}

/* Prevent unnecessary focus */
#menu .ui-state-focus{
    outline: none;
}




/*

#menu a.head:hover {
  color:#660099;
  background-color:#DDCCFF;
}

#menu a.cms_selected {
  color:#660099;
  background-color:#DDCCFF;
  text-decoration:underline;
}

#menu a.current {
  color:#660099;
  background-color:#DDCCFF;
}

*/


#menu ul {
  width:100%;
  border-width:0px;
  margin:0px;
  padding:0px;
  text-indent:0px;
}

#menu li {
  margin:0px;
  padding:0px;
  width:100%;
  list-style:none outside none;
  display:inline;
}

#menu li li a {
  height:20px;
  line-height:20px;
  color:#660099;
  background-color:#CCAAFF;
  font-size:14px;
  display:block;
  text-decoration: none;
  text-align:left;
  text-indent:13px;
  padding-right:10px;
  border-top: 1px solid #CCAAFF;
}

/*
#menu li li a:hover {
  color:#660099;
  background-color:#DDCCFF;
}

#menu li li.cms_selected a {
  color:#660099;
  background-color:#DDCCFF;
  text-decoration: underline;
}
*/

/* Nieuws - Used for news in the subpage... */
.nieuws        { padding:0px; margin:0px; }
.nieuws .news_title { font-size:14px; font-style:normal; font-weight:bold; }
.nieuws tr td p  { font-size:13px; font-style:italic; }
.nieuws tr td p.par_title  { font-style:normal; }
.nieuws li     { padding:0px; font-size:12px; }
.nieuws .news_more {
  position:relative;
  float:right;
  text-decoration:none;
  color:#660099;
  font-weight:bold;
  font-size:12px;
  padding-left:10px;
  background-image:url(/p-httpd/_style/images/bullet.gif);
  background-repeat:no-repeat;
  background-position:0px 4px;
}
.nieuws_datum span { }

.img_righttop  { margin:0px; padding:0px; margin-left:5px;  margin-bottom:5px; }
.img_lefttop   { margin:0px; padding:0px; margin-right:5px; margin-bottom:5px; }

.hallmark_img  { padding:0px; margin-left:5px; margin-right:5px; margin-bottom:10px; }
.page_pic      { padding:0px; margin:0px; }

/* more class for the user to use in the WYSIWYG editor... */
.cms_more {
  text-decoration:none;
  color:#660099;
  font-weight:bold;
  font-size:12px;
  padding-left:10px;
  background-image:url(/p-httpd/_cache/_style/images/bullet.gif);
  background-repeat:no-repeat;
  background-position:0px 4px;
}
a.cms_more { color:#660099; }
.cms_more:hover { color:#660099; }


/* Buttons in forms, e.g. mail response form... */
.cms_input    { height:20px; font-weight:bold; font-size:12px; background-color:#DDCCFF;}
.cms_subtitel { color:#444444; font-size:13px; font-style:normal; font-weight:bold; }
.cms_meer     { color:#660099; font-size:13px; font-style:normal; font-weight:bold; }
.cms_meer a, .cms_meer a:hover  { text-decoration:none; }

/* Additional standard colors... */
.cms_rood      { color:#FF0000; }
.cms_wit       { color:#FFFFFF; }
.cms_zwart     { color:#000000; }
.cms_9px_font  { font-size:9px; }
.cms_10px_font { font-size:10px; }
.cms_11px_font { font-size:11px; }

/* E-mail forms... */
.email_response_div             { width:100%; margin-left:0px; margin-right:0px; }
.email_response_required_fields { font-size:9px; font-style:italic; color:#444444; padding-right:10px; }

.mini_response_form    { width:100%; background-color:#EFEFEF; padding:0px; margin:0px; border:1px solid #DDCCFF; border-collapse:separate; border-spacing:3px; }
.mini_response_form tr td { padding:2px; padding-left:7px; padding-right:7px; margin:0px; font-size:11px; }
.mini_response_form tr th { text-align:left; padding:0px; margin:0px; padding-left:4px; font-size:12px; color:#FFFFFF; background-color:#CCAAFF; }
.mini_response_input   { color:#444444; width:100%; font-size:11px; border:1px solid #DDCCFF; }
.mini_response_button  {
   font-size:11px;
   color:#FFFFFF;
   background-color:#CCAAFF;
   border:1px solid#DDCCFF;
   margin:2px;
   margin-right:-4px;
   padding-left:15px;
   padding-right:15px;
}

.email_response_form    { width:100%; background-color:#EFEFEF; padding:0px; margin:0px; border:1px solid #DDCCFF; }
.email_response_form tr td { padding:2px; padding-left:7px; padding-right:7px; margin:0px; font-size:11px; }
.email_response_form tr th { text-align:left; padding:0px; margin:0px; padding-left:4px; font-size:12px; color:#FFFFFF; background-color:#CCAAFF; }
.email_response_input   { color:#444444; width:100%; font-size:11px; border:1px solid #DDCCFF; }
.email_response_button  {
   font-size:11px;
   color:#FFFFFF;
   background-color:#CCAAFF;
   border:1px solid#DDCCFF;
   margin:2px;
   margin-right:-4px;
   padding-left:15px;
   padding-right:15px;
}

.submenu         { color:#CCCCCC; padding:0px; margin:0px; font-size:11px; font-family:Arial, Helvetica, sans-serif; }
.submenu_divider { padding:0px; margin:0px; padding-left:7px; padding-right:4px; margin-bottom:-1px; }
.submenu a       { text-decoration:none; }

/* Additional stuff... */
.normal    { background-color:#FFFFFF; }
.alt       { background-color:background-color:#DDCCFF }
.var       { background-color:#FFFFFF; }
.inv       { background-color:#FFFFFF; }
.capt      { background-color:#FFFFFF; color:#333333; }
.NoteStyle { color:#CCAAFF; background-color:#FFFFFF; border:solid 1px #CCAAFF; font-size:10px; padding:4px; }
.PopStyle  { z-index:20; top:0px;left:0px; position:absolute; visibility:hidden; width:200px; }

.img_right      { margin:0px; padding:0px; margin-right:0px; margin-bottom:-3px; }
.img_center     { margin:0px; padding:0px; margin-right:0px; margin-bottom:-3px; }

/* Par styles... */
.par_normal          { background-color:transparent; margin:0px; margin-top:10px; }

.par_normal td { padding:0px; margin:0px; }
.par_normal .par_title     {
  color:#444444;
  font-size:20px;
  font-weight:bold;
  line-height:100%;
  padding:0px;
  margin:0px;
  padding-top:10px;
}
.par_normal .par_subtitle  { color:#444444; font-size:15px; font-style:normal; font-weight:bold; padding:0px; margin:0px; }
.par_normal p              { color:#444444; font-size:13px; }

.par_block                  { background-color:#EFEFEF; margin:0px; margin-top:10px; }
.par_block td               { background-color:#EFEFEF; padding:10px; padding-top:0px; margin:0px; margin-left:10px; margin-right:10px; }
.par_block tr.title td      { padding:0px; padding-left:10px; }
.par_block .par_title       {
  color:#444444;
  font-size:20px;
  font-weight:bold;
}
.par_block .par_subtitle    { color:#444444; font-size:15px; font-style:normal; font-weight:normal; }
.par_block p                { color:#444444; font-size:13px; }

div.icon {
  position:relative;
  float:right;
  width:20px;
  margin:0px;
  padding:0px;
  padding-right:5px;
  margin-top:-20px;
}
div.goto_pagetop img { padding:0px; margin:0px; }
div.goto_pagetop a {
  display:block;
  height:20px;
  padding:0px; margin:0px;
  margin-top:2px;
  background-image:url(/p-httpd/_cache/_style/images/pagetop.png);
  background-repeat:no-repeat;
  background-position:0px 0px;
  behavior: url(/p-httpd/_cms/js/iepngfix.htc);
}
.goto_pagetop a:hover { background-position:0px -20px; }

#tooltip {
  position: absolute;
  z-index: 999;
  border: 1px solid #CCAAFF;
  background-color: #DDCCFF;
  padding: 4px;
  opacity: 0.85;
}
#tooltip h3, #tooltip div { margin:0; font-size:10px; }

/* Search */
.search_block  { padding:0px; margin:0px; padding-top:10px; }
.search_input  { color:#444444; font-size:11px; padding-bottom:3px; border:1px solid #DDCCFF; width:100px; }
.search_button { color:#444444; font-weight:normal; font-size:11px; background-color:#DDCCFF; }
.search_amount,
.search_none   { text-align:right; width:100%; background-color:#EFEFEF; padding:2px; padding-right:5px; margin:0px; }
a.search_title,
a:visited.search_title { font-size:15px; color:#CCAAFF; font-weight:bold; text-decoration:underline; }


.normal_row td { background-color:#EFEFEF; }
.alt_row    td { background-color:#F6F2F6; }


/* Flash popup - Yellow Note Flash movie... */
div.flash_popup_div {
  height:200px;
  width:200px;
  visibility:visible;
  position:absolute;
  top:25px;
  margin-left:425px;
  z-index:10;
}

/* Optional diap-blockcolors for Newsletter plug-in, can be overrulled with config of plug-in */
.newsletter p.par_title { font-size:12px; margin-top:8px; }
.newsletter td.diap     { background-color:#EFEFEF; }

/* For Image Zoomer... */
img.zoom_img { border:1px solid white; cursor:pointer; }


.thumbnailer img { margin:8px; }
.show_image_description { color:#444444; font-size: 16px; font-weight:bold; line-height:160%; font-family: Arial, Helvetica, sans-serif; }

/* Settings for vertical accordion */
.accordion_vertical { margin:0px; padding:0px; }
.borderstyle { padding:8px; padding-top:0px; margin-top:10px; border:2px solid #CCAAFF; }
.accordion_vertical a.head {
  width:100%;
  cursor:pointer;
  display:block;
  margin:0px;
  padding:0px;
  text-decoration: none;
}
.accordion_vertical a.head:hover { }
.accordion_vertical a.selected { }
.accordion_vertical a.current { }
.accordion_vertical ul { margin:0px; padding:0px; }
.accordion_vertical li {
  width:100%; margin:0px; padding:0px;
  list-style:none outside none; display:inline;
}
.accordion_vertical li li a {
  margin:0px; padding:0px;
  text-decoration: none;
  display:block;
}
.accordion_vertical li li a:hover { }


.thumbnailer td { text-align:center; padding:5px; align:bottom;}
.thumbnailer tr { text-align:left; align:bottom; }
.thumbnailer img { border:0px solid transparent; }

.thumbnailer_title {
  color:#444444; 
  font-size:13px; 
  padding:0px; 
  margin:0px; 
  margin-top:8px;
  font-style:italic;
  text-align:center;
}
