/********************************/
 /*         BASIC STYLES         */
/********************************/

* {
margin: 0px;
padding: 0px;
}

a img {border:none;}
a {outline:none;}

a {color:#7B93C3;}
a:hover {color:#333366;}

body {
	background-color:#ffffff;
	overflow:hidden;
	cursor:default;

	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size:11px;
	color:#54668A;
	} 

div.centered_container {
	position: absolute;
	top:50%; left:50%; /* ga naar het midden van de pagina */
	width:1030px; height:637px; /* bepaal de grootte van het block */
	margin-left:-515px; margin-top:-308px;  /* halveer de grootte en verschuif negatief */
	/*overflow:hidden;*/
	}

#tpl1-2 {background: url(/pics/bg_site_1-2.jpg) no-repeat;}
#tpl1-3 {background: url(/pics/bg_site_1-3.jpg) no-repeat;}

#tpl3-2 {background: url(/pics/bg_site_3-2.jpg) no-repeat;}
#tpl3-3 {background: url(/pics/bg_site_3-3.jpg) no-repeat;}
#tpl3-3contact {background: url(/pics/bg_site_3-3contact.jpg) no-repeat;}
#tpl3-3info {background: url(/pics/bg_site_3-3_info.jpg) no-repeat;}
#tpl1-3info {background: url(/pics/bg_site_1-3_info.jpg) no-repeat;}


div.logo_site {
	position:absolute;
	top:45px;
	left:55px;
}

hr {color:#333366; height:1px; margin-top:10px; margin-bottom:10px; width:540px;}


ul, ol {margin-left:15px;}


div.fotorij a {margin-right:26px;}


  /********************************/
 /*         INTRO PAGINA         */
/********************************/

div.introblokje {
	width:98px; 
	height:33px; 
	border:1px solid #D3D3D3; 
	float:left;	
	margin:7px 14px 13px 0px; 
	padding:8px 14px 12px 14px;
	}
div.introblokje2 {
	width:230px;
	height:155px;
	border:1px solid #D3D3D3; 
	float:left;	
	margin:0px 15px 10px 0px; 
	padding:10px 19px 0px 19px;
	text-align:justify;		/* verander left in justify voor bloktekst */
	}


h1.trebuchet, h1.trebuchet a, h1.trebuchet a:hover {
	font-family:"trebuchet ms", verdana, arial;
	font-size:14px;
	font-style:italic;
	font-weight:bold;
	text-decoration:none;
	color:#333366;
	}
h2.trebuchet{
	font-family:"trebuchet ms", verdana, arial;
	font-size:13px;
	font-style:italic;
	text-decoration:none;
	color:#333366;
	}
h3.trebuchet {
	font-family:"trebuchet ms", verdana, arial;
	font-size:13px;
	font-style:italic;
	color:#b8b8b8 
	}
h4.trebuchet {
	font-family:"trebuchet ms", verdana, arial;
	font-size:10px;
	font-weight:bold;
	color:#FFFFFF 
	}


h1.trebuchet a {color:#333366; text-decoration:none;}
h1.trebuchet a:hover {color:#8ea5d2; text-decoration:none;}

h3.trebuchet a {color:#b8b8b8; text-decoration:none;}
h3.trebuchet a:hover {color:#8ea5d2; text-decoration:none;}






  /********************************/
 /*          NAV STYLES          */
/********************************/

div.nav_main {
	position:absolute;
	top:104px;
	left:57px;
	height:18px;
	z-index:1;
	font-size:12px;
	font-weight:bold;
	}

div.nav_main td {
	text-align:center;
	background: url(/pics/divider_nav.gif) no-repeat center right;
	}



a img.nav {filter:alpha(Opacity=50); opacity:0.50; moz-opacity:0.50;}
a:hover img.nav {filter:alpha(Opacity=100); opacity:1.00; moz-opacity:1.00;}

a img.title {filter:alpha(Opacity=100); opacity:1.00; moz-opacity:1.00;}
a:hover img.title {filter:alpha(Opacity=90); opacity:0.90; moz-opacity:0.90;}

a img.thumb {filter:alpha(Opacity=90); opacity:0.90; moz-opacity:0.90; border:1px solid #cccccc;}
a:hover img.thumb {filter:alpha(Opacity=100); opacity:1.00; moz-opacity:1.00;}

a.noline {text-decoration:none !important; color:#6E7FAA !important;}
a.noline:hover {color:#7B93C3 !important;}

a.noline2 {text-decoration:none !important; color:#333366 !important;}
a.noline2:hover {color:#A1B2D0 !important; }

a.noline3 {text-decoration:none !important; color:#8EA5D2 !important;}
a.noline3:hover {color:#333366 !important;}

a.backlink {position:absolute; top:10px; right:12px; z-index:9;}


.off {filter:alpha(Opacity=60); opacity:0.60; moz-opacity:0.60;}
.on {filter:alpha(Opacity=100); opacity:1.00; moz-opacity:1.00;}







  /********************************/
 /*      DIV BLOKKEN STYLES      */
/********************************/


.blok1links, .blok2links, .blok3links {		/******* ALLE 3 DE BLOKKEN LINKS WAAR JE TEKST IN STAAT  ********/
	width:412px;
	height:83px;
	border:1px solid #333366;
	padding:20px;
	padding-top:13px;
	padding-bottom:10px;
	font-family:arial, verdana, helvetica, sans-serif;
	font-size:12px;
	line-height:150%;
	text-align:justify;
	}

.blok1links A, .blok2links A, .blok3links A {color:#8ea5d2; text-decoration:none;}
.blok1links A:hover, .blok2links A:hover, .blok3links A:hover 	{color:#8ea5d2; text-decoration:underline;}

.blok1links {
	position:absolute;
	top:180px;
	left:110px;
	}
.blok2links {
	position:absolute;
	top:300px;
	left:110px;
	}
.blok3links {
	position:absolute;
	top:421px;
	left:110px;
	}

#links_span3 {
	width:555px;
	height:325px;
	overflow:auto;
	}
#iframe_span3{
	position:absolute; 
	top:0px; 
	left:0px;
	width:595px;
	height:348px;
	}


.blok1rechts, .blok2rechts, .blok3rechts {	/******* ALLE 3 DE BLOKKEN RECHTS WAAR JE SUB DINGEN IN STAAN  ********/
	width:134px;
	height:76px;
	border:1px solid #333366;
	padding:15px;
	padding-right:5px;
	font-family:arial, verdana, helvetica, sans-serif;
	font-size:11px;
	overflow:hidden;
	line-height:170%;
	vertical-align:middle;
	}
.blok1rechts {
	position:absolute;
	top:180px;
	left:720px;
	}
.blok1rechts ul { list-style-type:none; position:absolute; left:0px;}

.blok2rechts {
	position:absolute;
	top:300px;
	left:720px;
	}

.blok3rechts {
	position:absolute;
	top:421px;
	left:720px;
	}
#rechts_span2 {
	height:196px;
	}




/******* LINKJES IN DE 3 RECHTER BLOKKEN  ********/
.blok1rechts a {color:#333366; text-decoration:none;}
.blok1rechts a:hover {color:#8ea5d2; text-decoration:underline;}

.blok2rechts a {color:#28740e; text-decoration:none;}
.blok2rechts a:hover {color:#333366; text-decoration:underline;}

.blok3rechts a {color:#8ea5d2; text-decoration:none;}
.blok3rechts a:hover {color:#333366; text-decoration:underline;}

 



.blok1img, .blok2img, .blok3img {	/******* ALLE 3 DE BLOKKEN LINKS WAAR JE IMAGES IN STAAN  ********/
	width:141px;
	height:106px;
	border:1px solid #333366;
	border-left:none;
	border-right:none;
	text-align:center;
	overflow:hidden;
	}
.blok1img {
	position:absolute;
	top:180px;
	left:564px;
	}
.blok2img {
	position:absolute;
	top:300px;
	left:564px;
	}
.blok3img {
	position:absolute;
	top:421px;
	left:564px;
	}





  /********************************/
 /*        CONTENT STYLES        */
/********************************/

.page_img {
	position:absolute;
	top:0px;
	left:0px;
	height:106px;
	border-right:1px solid #333366;
	border-bottom:1px solid #333366;
	z-index:2;
	}
.page_kop {
	position:absolute;
	top:0px;
	left:167px;
	width:403px;
	height:106px;
	vertical-align:middle;
	z-index:1;
	border-bottom:1px solid #333366;
	}

.page_text {
	position:absolute;
	top:145px;
	left:25px;
	width:95%;
	}

.page_text_overflow {
	position:absolute;
	top:120px;
	left:0px;
	padding-left:25px;
	padding-right:25px;
	padding-top:10px;
	width:545px;
	height:205px;
	overflow:auto;
	overflow-x:hidden;
	}

.titleboven {position:absolute; bottom:10px;}
.titleonder {position:absolute; top:117px; left:167px;}


h1 { 	font-size:12px;
	font-weight:bold;
	color:#333366;
	margin-top:0px;
	margin-bottom:0px;
	}
h2 { 	font-size:12px;
	font-weight:bold;
	color:#8EA5D2;
	margin-top:0px;
	margin-bottom:0px;
	}
h3 { 	font-size:12px;
	font-weight:bold;
	color:#ff6f00;
	margin-top:0px;
	margin-bottom:1px;
	}
h4 { 	font-size:11px;
	font-weight:bold;
	color:#333366;
	margin-top:0px;
	margin-bottom:1px;
	}

h6 { 	font-size:10px;
	font-weight:bold;
	color:#888888;
	margin-top:0px;
	margin-bottom:1px;
	}


p {	margin-bottom:10px; margin-top:0px;}



.klein {font-size:9px;}
.rood {color:#ff0000;}
.grijs {color:#8e8e8e;}
.blauw {color:#7B93C3;}
.lichtblauw {color:#8ea5d2;}

.floatleft {float:left; margin-right:10px;}
.floatright {float:right; margin-left:10px;}

.left {text-align:left;}
.center {text-align:center;}
.right {text-align:right;}
.top {vertical-align:top;}
.middle {vertical-align:middle;}
.bottom {vertical-align:bottom;}





  /********************************/
 /*         FORM STYLES          */
/********************************/

table.form {font-size:11px;}
table.form td {padding:5px;}


input, select, textarea {
	font-family:arial, helvetica, sans-serif;
	font-size:11px;
	}
select {
	width:172px;
	}
input.veld {
	width:172px;
	height:16px; 
	padding:0px; 
	padding-left:4px; 
	background:#ffffff url(/pics/bg_veld.gif) top left repeat-x;
	border:1px solid #a5acb2;
	color:#8ea5d2;
	}

input.button {
border:none;
	cursor:hand;
	background:#ff6600 url('/pics/vraag-aan.jpg') no-repeat;
	width:96px;
	height:26px;
	
	font-size:11px;
	color:#fff;
	font-weight:bold;
	cursor:pointer;
	}

.textarea {
	width:172px;
	height:75px; 
	border:1px solid #a5acb2; 
	background:#ffffff url(/pics/bg_veld.gif) top left repeat-x;
	overflow:auto;
	padding-left:4px;
	color:#8ea5d2;
	}

#poweredby {position:absolute; top:-100px;}
#poweredby span {display:none;}




table.lichtblauw td {padding-left:5px; padding-right:10px;}
	



  /********************************/
 /*        FOOTER STYLES         */
/********************************/


div.footer-textlinks {
	position:absolute;
	bottom:44px;
	left:120px;
	height:25px;
	}
div.footer-textlinks a {text-decoration:none; color:#6d6fa2;}
div.footer-textlinks a:hover {text-decoration:underline;  color:#333366;}

div.footer-textlinks td {
	padding:0px 13px;
	background: url(/pics/divider_bottomnav.gif) no-repeat right center;
	}


div.footer {
	position:absolute;
	bottom:30px;
	left:26px;
	height:60px;
	width:920px;
	}

div.footer td {
	text-align:center;
	vertical-align:bottom;
	background: url no-repeat bottom right;
	width:10%;
	}


div.bottomnav-credits {
	position:absolute;
	bottom:18px;
	left:22px;
	height:13px;
	letter-spacing:1px;
	font-size:10px;
	color:8e8e8e;
	z-index:6;
	}

div.bottomnavicons {
	position:absolute;
	bottom:0px;
	right:80px;
	z-index:7;
	}

div.bottomnav a {color:#8e8e8e;}
div.bottomnav a:hover {color:#8ea5d2;}



div.seo_keurmerk {
	position:absolute;
	bottom:55px;
	right:1px;
	}

div.docdata {
	position:absolute;
	bottom:100px;
	right:8px;
	}

div.iab {
	position:absolute;
	bottom:50px;
	right:4px;
	}

div.qshops {
	position:absolute;
	bottom:10px;
	right:3px;
	}

div.belme {
	position:absolute;
	bottom:43px;
	left:30px;
	}

div.offerte {
	position:absolute;
	bottom:383px;
	left:275px;
	z-index:9;
	}

div.portfolio {
	position:absolute;
	bottom:380px;
	left:275px;
	}

div.icon-fiva {
	position:absolute;
	bottom:555px;
	left:637px;
	}

div.icon-fairygood {
	position:absolute;
	bottom:555px;
	left:546px;
	}

div.icon-janbibejan {
	position:absolute;
	bottom:555px;
	left:473px;
	}

div.icon-quiksilver {
	position:absolute;
	bottom:555px;
	left:405px;
	}

div.icon-tnt{
	position:absolute;
	bottom:555px;
	left:330px;
	}

div.icon-recente {
	position:absolute;
	bottom:595px;
	left:570px;
	}

div.file-reg {
	position:absolute;
	bottom:619px;
	left:22px;
	}
	
div .nieuw-web {
	position: absolute;
	bottom: 623px;
	left: 610px;
	width: 700px;
	}

  /********************************/
 /*          RSS STYLES          */
/********************************/

  
.rss-box { } 
.rss-title, rss-title a { } 
.rss-items {}

.rss-item a:link, .rss-item a:visited, .rss-item a:active {}
.rss-item a:hover { }
.rss-date {font-size:9px;}







/**
 * The CSS for Shadowbox.
 *
 * This file is part of Shadowbox.
 *
 * Shadowbox is free software: you can redistribute it and/or modify it under
 * the terms of the GNU Lesser General Public License as published by the Free
 * Software Foundation, either version 3 of the License, or (at your option)
 * any later version.
 *
 * Shadowbox is distributed in the hope that it will be useful, but WITHOUT ANY
 * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
 * FOR A PARTICULAR PURPOSE.  See the GNU Lesser General Public License for
 * more details.
 *
 * You should have received a copy of the GNU Lesser General Public License
 * along with Shadowbox.  If not, see <http://www.gnu.org/licenses/>.
 *
 * @author      Michael J. I. Jackson <mjijackson@gmail.com>
 * @copyright   2007 Michael J. I. Jackson
 * @license     http://www.gnu.org/licenses/lgpl-3.0.txt GNU LGPL 3.0
 * @version     SVN: $Id: shadowbox.js 150 2007-12-04 18:42:03Z michael $
 */

/*_________________________________________________________________  Overlay  */
#shadowbox_overlay {
  visibility: hidden;
  position: absolute;
  display: block;
  margin: 0;
  padding: 0;
  top: 0;
  left: 0;
  z-index: 998;
}

/*_______________________________________________________________  Container  */
#shadowbox_container {
  position: fixed;
  height: 0px;
  width: 100%;
  margin: 0;
  padding: 0;
  top: 0;
  left: 0;
  z-index: 999;
  text-align: center; /* centers in quirks and IE */
}

/*_______________________________________________________________  Shadowbox  */
#shadowbox {
  display: none;
  visibility: hidden;
  margin: 0 auto;
  position: relative;
  font-family: 'Lucida Grande', Tahoma, sans-serif;
  text-align: left; /* reset left alignment */
}

/*___________________________________________________________________  Title  */
/*
HTML snapshot:
<div id="shadowbox_title">
  <div id="shadowbox_title_inner">Title Here</div>
</div>
*/
#shadowbox_title {
  height: 25px;
  padding: 0;
  overflow: hidden;
}
#shadowbox_title_inner {
  height: 16px;
  font-size: 16px;
  line-height: 16px;
  white-space: nowrap;
  padding: 5px 0 4px 8px;
  color: #fff;
}

/*____________________________________________________________________  Body  */
/*
HTML snapsnot:
<div id="shadowbox_body">
  <div id="shadowbox_body_inner">
    <img src="my_image.jpg" id="shadowbox_content" height="350" width="580">
  </div>
  <div id="shadowbox_loading">
    <img src="images/loading.gif" alt="loading"></div>
    <span><a href="javascript:Shadowbox.close();">Cancel</a></span>
  </div>
</div>
*/
#shadowbox_body {
  position: relative;
  overflow: hidden;
  margin: 0;
  padding: 0;
  border: 2px solid #fff;
  background-color: #000;
}
#shadowbox_body_inner {
  position: relative;
  overflow: hidden;
}
#shadowbox_loading {
  position: absolute;
  top: 0;
  left: 0;
  height: 10000px; /* overflow:hidden will clip this */
  width: 100%;
  background-color: #222;
}
#shadowbox_loading img {
  float: left;
  margin: 10px 10px 0 10px;
}
#shadowbox_loading span {
  float: left;
  margin-top: 16px;
  font-size: 10px;
}
#shadowbox_loading span a,
#shadowbox_loading span a:link,
#shadowbox_loading span a:visited {
  color: #fff;
}

#shadowbox_content.html { /* make html content scrollable */
  height: 100%;
  width: 100%;
  overflow: auto;
}

/*_________________________________________________________________  Toolbar  */
/*
HTML snapshot:
<div id="shadowbox_toolbar">
  <div id="shadowbox_toolbar_inner">
    <div id="shadowbox_nav_close">
      <a href="javascript:Shadowbox.close();"><span class="shortcut">C</span>lose</a>
    </div>
    <div id="shadowbox_nav_next">
      <a href="javascript:Shadowbox.next();"><span class="shortcut">N</span>ext</a>
    </div>
    <div id="shadowbox_nav_previous">
      <a href="javascript:Shadowbox.previous();"><span class="shortcut">P</span>revious</a>
    </div>
    <div id="shadowbox_counter">
      <a href="javascript:Shadowbox.change(0);">1</a>
      <a href="javascript:Shadowbox.change(1);" class="shadowbox_counter_current">2</a>
      <a href="javascript:Shadowbox.change(2);">3</a>
    </div>
  </div>
</div>
*/
#shadowbox_toolbar {
  margin: 0;
  padding: 0;
  height: 20px;
  overflow: hidden;
}
#shadowbox_toolbar_inner {
  height: 20px;
  color: #fff;
}
#shadowbox_toolbar_inner div {
  padding-top: 4px;
  padding-bottom: 2px;
  font-size: 11px;
  height: 10px;
  line-height: 10px;
}
#shadowbox_toolbar_inner div span.shortcut {
  text-decoration: underline;
  font-weight: bold;
}
#shadowbox_toolbar_inner div a {
  text-decoration: none;
  color: #fff;
}
#shadowbox_toolbar_inner div a:hover {
  text-decoration: none;
  color: #ff6600;
}
#shadowbox_nav_close,
#shadowbox_nav_previous,
#shadowbox_nav_next {
  float: right;
  padding-right: 10px;
}
#shadowbox_counter {
  float: left;
  padding-left: 10px;
}
#shadowbox_counter a {
  padding: 0 4px 0 0;
}
#shadowbox_counter a.shadowbox_counter_current {
  color: #ff6600;
  font-size: 12px;
  font-weight: bold;
}

/*________________________________________________________________  Messages  */
div.shadowbox_message {
  text-align: center;
  padding: 10px;
}
div.shadowbox_message a:link,
div.shadowbox_message a:visited {
  text-decoration: none;
  color: #bed333;
}
div.shadowbox_message a:hover,
div.shadowbox_message a:focus {
  text-decoration: underline;
}