
/*###################################  GENERAL  ######################################*/
body {
width:100%;
margin: 0px;
text-align:center;
/*background-image:url(imgs/bg.jpg);
background-repeat: no-repeat;
background-color: #E0F5FF;*/
}

/*-------------------------------------<DIV BORDERS>--------------------------------- BORDERS AAN-UIT */
div {
    border:solid #FF0000 0px;
}
/*-------------------------------------<DIV BORDERS>---------------------------------  */


/*-------------------------------------<TOP BAR>---------------------------------  */
.bar {
width:100%;
height: 20px;
background-color:#ffffff;
}
/*-------------------------------------<TOP BAR>---------------------------------  */

/*###################################  GENERAL  ######################################*/




/*###################################  BODY LAYOUT  ######################################*/
#body {
width:100%;
    margin:0 auto;
    background:#ffffff;  /* fdd */
}
#header {
width:100%;
	padding:0px;
	height:244px;
	background:#ffffff;  /* fdd */
}
#column-left {
	float:left;
	width:312px;
	height:450px;
	padding:0px;
	background:#ffffff;  /* fdd */
}
#column-middle {
	float:left;
	width:500px;
	background:#ffffff;  /* fdd */
}
#column-middle-content {
position:relative;
	top:-5px;
	float:left;
	width:920px;
	height:530px;
	padding:5px;
	background:#ffffff;  /* ddf */
}
#column-middle-content_links {
position:relative;
	top:-23px;
	float:left;
	width:830px;
	height:800px;
	padding:5px;
	background:#ffffff;  /* ddf */
}
#column-middle-content2 {
position:relative;
	top:0px;
	float:left;
	width:830px;
	padding:5px;
}
#column-middle-content3 {
	float:right;
	width:200px;
	padding:5px;
	background:#ffffff;  /* ddf */
}
#column-right {
	float:right;
	width:200px;
	height:500px;
	padding:0px;
	background:#fff;  /* bfb */
}
#bottom {
  clear:both;
  padding:0px;
  background:#fff;  /* ff9 */
}
#footer {
  clear:both;
  padding:0px;
  background:#fff;  /* ff9 */
/*background-image:url(imgs/footer.jpg)*/;
}

/*###################################  BODY LAYOUT  ######################################*/




/*###################################  MENU LEFT  ######################################*/
#menu_container_left {
	width: 1200px;
	height:580px;
	padding:0px;
	position: relative;
	margin:-7px 0px auto;
	text-align:center; 
	background-color:#fff;
}

#menu{
	position: relative;
	margin:0 0 auto;
	width: 1200px;
	height:200px;
	text-align:center;
color:#E0F5FF;
font-size:16px;
font-family: Candara, Century Gothic, Helvetia;
}

#menu2{
	position: relative;
	margin:0 0 auto;
	width: 1200px;
	height:200px;
	text-align:left;
color:#339933;
font-size:20px;
font-family: Candara, Century Gothic, Helvetia;
}

.menu3{
	text-align:left;
	color:#3366FF;
font-size:18px;
font-family: Candara, Century Gothic, Helvetia;
}

.menu4{
	text-align:left;
	color:#990000;
font-size:18px;
font-family: Candara, Century Gothic, Helvetia;
}

#menu ul {
    text-align:left;
	list-style-type: none; /* delete bullets list */
/*	background-image: url(imgs/menu_bar.jpg);*/
	height: 36px;
	width: 100%;
	margin: auto; /* Auto margin will center the list within its parent element */
	
}

#menu li {
display:inline-block;
	float:left; /* zet li's NAAST elkaar */
	position:relative;
	left:-40px; /* schuif menu buttons links/rechts */

}

#menu ul a { /* links / li's binnen #menu */
	background-image: url(imgs/button.jpg);
	background-repeat: no-repeat;
	background-position: left;
/*	padding-right: 32px;  gebruik padding als je slechts één bg image voor button wil  */
/*	padding-left: 32px;  gebruik padding als je slechts één bg image voor button wil  */
	display: block; /* maak block clickable ipv alleen text */
	line-height: 44px; /* set hoogte link en daarmee centers link verticaal */
	text-decoration: none;
	color: #FFFFFF;

}


/* gebruik deze als voor iedere afzonderlijke button een aparte image wil */
#menu ul #butt1 a {
	background-image: url(imgs/btn_pv.jpg);
	width:200px;
	height:43px;
}

#menu ul #butt1  a:hover {
	background-image: url(imgs/btn_pv2.jpg);
	background-position: left;
}

/* gebruik deze als voor iedere afzonderlijke button een aparte image wil */
#menu ul #butt2 a {
	background-image: url(imgs/btn_lithium.jpg);
	width:200px;
	height:43px;
}

#menu ul #butt2  a:hover {
	background-image: url(imgs/btn_lithium2.jpg);
	background-position: left;
}

/* gebruik deze als voor iedere afzonderlijke button een aparte image wil */
#menu ul #butt3 a {
	background-image: url(imgs/btn_water.jpg);
	width:200px;
	height:43px;
}

#menu ul #butt3  a:hover {
	background-image: url(imgs/btn_water2.jpg);
	background-position: left;
}

/* gebruik deze als voor iedere afzonderlijke button een aparte image wil */
#menu ul #butt4 a {
	background-image: url(imgs/btn_heat.jpg);
	width:200px;
	height:43px;
}

#menu ul #butt4  a:hover {
	background-image: url(imgs/btn_heat2.jpg);
	background-position: left;
}

/* gebruik deze als voor iedere afzonderlijke button een aparte image wil */
#menu ul #butt5 a {
	background-image: url(imgs/btn_ir.jpg);
	width:200px;
	height:43px;
}

#menu ul #butt5  a:hover {
	background-image: url(imgs/btn_ir2.jpg);
	background-position: left;
}

/* gebruik deze als voor iedere afzonderlijke button een aparte image wil */
#menu ul #butt6 a {
	background-image: url(imgs/btn_press.jpg);
	width:200px;
	height:43px;
}

#menu ul #butt6  a:hover {
	background-image: url(imgs/btn_press2.jpg);
	background-position: left;
}


/* gebruik deze als voor iedere afzonderlijke button een aparte image wil */
#menu ul #butt7 a {
	background-image: url(imgs/btn_promo.jpg);
	width:200px;
	height:43px;
}

#menu ul #butt7  a:hover {
	background-image: url(imgs/btn_promo2.jpg);
	background-position: left;
}

#menu ul #butt8 a {
	background-image: url(imgs/btn_ss.jpg);
	width:200px;
	height:43px;
}


#menu ul #butt8  a:hover {
	background-image: url(imgs/btn_ss.jpg);
	background-position: left;
}


.txt6 { 
font-size:12px;
font-weight:normal; 
color:#339933;
font-family: Candara, Century Gothic, Helvetia;
}
a.txt6:link{color:#339933; text-decoration: none;}
a.txt6:active{color:#339933; text-decoration: none;}
a.txt6:visited{color:#339933; text-decoration: none;}
a.txt6:hover{color:#FE0000; text-decoration: none;}

/*###################################  MENU LEFT  ######################################*/




/*###################################  MENU RIGHT  ######################################*/
#all {
position:relative;
margin: 10px 0px auto;
text-align:center;
}

#stats {
position:relative;
top:-10px;
border-left:1px solid #999999;/**/
border-top:1px solid #999999;
border-right:1px solid #999999;
border-bottom:1px solid #999999;
height:25px;
}

.stats {
position:relative;
top:-8px;
height:20px;
text-align:center;
font-size:12px;
font-weight:normal; 
color:#339900;
font-family: Candara, Century Gothic, Helvetia;
}

.bottom {
font-family:Arial, Helvetica, sans-serif;
color:#666666;
font-size:12px;
text-decoration: none;
}

.logins { 
margin:10px 0px auto;
font-size:12px;
font-weight:normal; 
color:#339900;
font-family: Candara, Century Gothic, Helvetia;
border-left:1px solid #999999;/**/
border-top:1px solid #999999;
border-right:1px solid #999999;
border-bottom:1px solid #999999;

}
/*###################################  MENU RIGHT  ######################################*/


#pdf {
margin:-23px 680px auto;
position:relative;
width:150px;
height:85px;
text-align:center;
color:#339900;
font-size:10px;
font-family: Candara, Century Gothic, Helvetia;
}

#pdf1 {
margin:-50px 520px auto;
position:relative;
width:280px;
height:60px;
text-align:left;
color:#339900;
font-size:10px;
font-family: Candara, Century Gothic, Helvetia;
}

#pdf2 {
margin:-23px 430px auto;
position:relative;
width:400px;
height:85px;
text-align:center;
color:#339900;
font-size:10px;
font-family: Candara, Century Gothic, Helvetia;
}


/*###################################  MENU HORIZONTAL  #################################*/
#menu_horizontal {
margin:0px 0px auto;
width: 1250px;
text-align:center; 
background-color:#E0F5FF;
/*	background-image: url(imgs/menu_bar.jpg);
	background-repeat:repeat-x;*/
}

#horizontal{
	float:left;
	position:relative;
	left:0px;
	width: 1250px;
	height:55px;
	margin: 0 0 auto;
	text-align:left;
}

#horizontal ul {
    text-align:left;
	list-style-type: none; /* delete bullets list */
/*	background-image: url(imgs/menu_bar.jpg);*/
	height: 55px;
	width: 100%;
	margin: auto; /* Auto margin will center the list within its parent element */
	
	position:relative;
	left:0px; /* schuif menu buttons links/rechts */
}

#horizontal li {
	position:relative;
	top:-27px;
	left:-40px;
    float:left; /* zet li's NAAST elkaar */
}

#horizontal ul a { /* links / li's binnen #menu */
	background-repeat: no-repeat;
	background-position: left;
/*	padding-right: 32px;  gebruik padding als je slechts één bg image voor button wil  */
/*	padding-left: 32px;  gebruik padding als je slechts één bg image voor button wil  */
	display: block; /* maak block clickable ipv alleen text */
	line-height: 55px; /* set hoogte link en daarmee centers link verticaal */
	text-decoration: none;
	color: #FFFFFF;
}


/* gebruik deze als voor iedere afzonderlijke button een aparte image wil */
#horizontal ul #hor1 a {
	background-image: url(imgs/btn_home.jpg); /**/
	width:156px;
}
#horizontal ul #hor1  a:hover {
	background-image: url(imgs/btn_home2.jpg);
	background-position: left;
}

#horizontal ul #hor2 a {
	background-image: url(imgs/btn_about.jpg); /**/
	width:156px;
}
#horizontal ul #hor2  a:hover {
	background-image: url(imgs/btn_about2.jpg);
	background-position: left;
}

#horizontal ul #hor3 a {
	background-image: url(imgs/btn_concept.jpg); /**/
	width:156px;
}
#horizontal ul #hor3  a:hover {
	background-image: url(imgs/btn_concept2.jpg); /**/
	background-position: left;
}

#horizontal ul #hor4 a {
	background-image: url(imgs/btn_services.jpg); /**/
	width:156px;
}
#horizontal ul #hor4  a:hover {
	background-image: url(imgs/btn_services2.jpg); /**/
	background-position: left;
}

#horizontal ul #hor5 a {
	background-image: url(imgs/btn_location.jpg); /**/
	width:156px;
}
#horizontal ul #hor5  a:hover {
	background-image: url(imgs/btn_location2.jpg); /**/
	background-position: left;
}

#horizontal ul #hor6 a {
	background-image: url(imgs/btn_news.jpg); /**/
	width:156px;
}
#horizontal ul #hor6  a:hover {
	background-image: url(imgs/btn_news2.jpg); /**/
	background-position: left;
}


#horizontal ul #hor7 a {
	background-image: url(imgs/btn_contact.jpg); /**/
	width:156px;
}
#horizontal ul #hor7  a:hover {
	background-image: url(imgs/btn_contact2.jpg); /**/
	background-position: left;
}



#horizontal ul #hor8 a {
	background-image: url(imgs/btn_fb.jpg); /**/
	width:78px;
}
#horizontal ul #hor8  a:hover {
	background-image: url(imgs/btn_fb.jpg); /**/
	background-position: left;
}



#horizontal ul #hor9 a {
	background-image: url(imgs/btn_link.jpg); /**/
	width:77px;
}
#horizontal ul #hor9  a:hover {
	background-image: url(imgs/btn_link.jpg); /**/
	background-position: left;
}


/*###################################  MENU HORIZONTAL  #################################*/






/*###################################  FOOTER  ######################################*/
.footer {
width: 100%;
position:relative;
margin: 0px 0px auto; /* 1e= TOP  2e=LEFT */
text-align:center; /* IE fix */
color:#666; 
font-size:12px;
font-family: Candara, Century Gothic, Helvetia;	
position:relative;
top:1px; /* op 1px :  geeft een 1px line te zien tussen banner_container (header) en wrapper_menu */

}

.copyright { 
font-size:11px;
font-weight:normal; 
font-family:Arial, sans-serif, Verdana, Helvetia;
color:#cccccc;
}
	a.copyright:link{color:#cccccc}
	a.copyright:link{text-decoration:none}
	a.copyright:visited{color:#cccccc}
	a.copyright:visited{text-decoration:none}
	a.copyright:hover{color:#ff0000}
	a.copyright:hover{text-decoration:underline}
	a.copyright:active{color:#8E0800}
	a.copyright:active{text-decoration:none}

/*###################################  FOOTER  ######################################*/
	




/*--------------------------------------------TEXT----------------------------------------------*/
p{	margin:1em 0; }

h1 + p, h2 + p, h3 + p, h4 + p, h5 + p, h6 + p{	margin-top:-0.05em;}

h1{
color:#185084;
font-size:18px;
text-align:left;
margin-bottom:0.1em;
font-weight:lighter;
font-family: Century Gothic, Verdana, Helvetia;
background-repeat: no-repeat;
background-position: left;
}

h2{
color:#185084; 
font-size:16px;
text-align:left;
margin-bottom:0.1em;
font-weight:lighter;
font-family: Candara, Century Gothic, Helvetia;	
}

h3{ 
color:#185084;
font-size:16px;
text-align:left;
font-style:normal;
font-weight:lighter;
margin-bottom:0.1em;
font-family: Candara, Century Gothic, Helvetia;
}


h4{ 
color:#185084;
font-size:16px;
text-align:left;
font-style:normal;
font-weight:lighter;
margin-bottom:0.1em;
font-family: Candara, Century Gothic, Helvetia;
}

h5{ 
color:#FF6600; 
font-size:15spx;
text-align:left;
font-style:normal;
font-weight:lighter;
margin-bottom:0.1em;
font-family: Candara, Century Gothic, Helvetia;
}

h6{ 
color:#FF6600; 
font-size:14px;
text-align:left;
font-style:normal;
font-weight:lighter;
margin-bottom:0.1em;
font-family: Candara, Century Gothic, Helvetia;
}

h6{
    color:#FF6600; 
	margin-bottom:0.05em; 
}

h1{ font-size:2em;}

h2{	font-size:1.5em;}

h3{	font-size:1.2em;}

h4{	font-size:1.2em;}

h5{	font-size:0.8em;}

h6{	font-size:0.5em;}

a {
   color:#FF3300; 
}

a:hover {
   color:#999999;
}


/* ########################################## */
/* ################  LOGIN  ################# */
/* ########################################## */

  .but { 
  font-size:14px; 
  color:#990000; 
  font-family:BankGothic Md BT, Arial, sans-serif, Verdana, Helvetia;
	}

  .but2 { 
  font-size:14px;
  color:#339933; 
  font-family:BankGothic Md BT, Arial, sans-serif, Verdana, Helvetia;
	}

  .but3 { 
  font-size:14px;
  color:#999999; 
  font-family:BankGothic Md BT, Arial, sans-serif, Verdana, Helvetia;
	}

  .txdg { 
  font-size:12px; 
  color:#009966;
  font-family:BankGothic Md BT, Arial, sans-serif, Verdana, Helvetia;
	
  }		
	
  .txr { 
  font-family:BankGothic Md BT, Arial, sans-serif, Verdana, Helvetia;
  font-size:14px; 
  color:#008000; 
  }

/* ########################################## */
/* ################  LOGIN  ################# */
/* ########################################## */

 .txt { 
  font-size:14px;
  font-weight:normal;
  text-align:left;
  color:#333333;
  font-family: Candara, Century Gothic, Helvetia;
	}

 .prices {
 width:200px;
 padding:5px;
  font-size:16px;
  font-weight:normal;
  text-align:left;
  color:#333333;
  font-family: Candara, Century Gothic, Helvetia;
border-left:1px solid #999999;/**/
border-top:1px solid #999999;
border-right:1px solid #999999;
border-bottom:1px solid #999999;
	}

 .prices2 { 
  font-size:12px;
  font-weight:normal;
  text-align:left;
  color:#333333;
  font-family: Candara, Century Gothic, Helvetia;
	}

 .stats { 
  font-size:12px;
  font-weight:normal;
  text-align:center;
  color:#339933;
  font-family: Candara, Century Gothic, Helvetia;
	}

 .note { 
  font-size:12px;
  font-weight:normal;
  text-align:left;
  color:#FF0000;
  font-family: Candara, Century Gothic, Helvetia;
	}

.scrollArea {
width: 325px; 
height: 353px;
padding-left: 5px;
padding-right: 5px; 
border-color: #6699CC;
border-width: 1px; 
border-style: solid;
float: left; 
overflow: auto;
}
	
 .head { 
  font-size:14px;
  font-weight:bold;
  text-align:left;
  color:#FF9900;
  font-family: Candara, Century Gothic, Helvetia;
	}


/*--------------------------------------------TEXT----------------------------------------------*/


/*--------------------------------------------IMAGES----------------------------------------------*/
a img {
	border: none;
}

a img:hover {
	border: 1px solid silver;
}

/* image left - text wrapped: <img src... class="left".../> */
img.left {
	float: left;
	margin:10px 10px 10px 0;
}

/* image right - text wrapped */
img.right {
	float: right;
	margin:15px 410 10px 10px;
	width: 350px;
	height: 350px;
}


/* image middle - text wrapped */
img.middle {
    display: block;
    margin-left: auto;
    margin-right: auto }

/*--------------------------------------------IMAGES----------------------------------------------*/


/* ##################### MENU HORIZONTAL  ##########################  */
#menu{
	width: 1000px;
	height:36px;
	margin: 0 auto;
	text-align:left; 

}

#menu ul {
    text-align:left;
	list-style-type: none; /* delete bullets list */
/*	background-image: url(imgs/menu_bar.jpg);*/
	height: 36px;
	width: 100%;
	margin: auto; /* Auto margin will center the list within its parent element */
	
	position:relative;
	left:0px; /* schuif menu buttons links/rechts */
}

#menu li {
    float:left; /* zet li's NAAST elkaar */

}

#menu ul a { /* links / li's binnen #menu */
	background-image: url(imgs/button.jpg);
	background-repeat: no-repeat;
	background-position: left;
/*	padding-right: 32px;  gebruik padding als je slechts één bg image voor button wil  */
/*	padding-left: 32px;  gebruik padding als je slechts één bg image voor button wil  */
	display: block; /* maak block clickable ipv alleen text */
	line-height: 44px; /* set hoogte link en daarmee centers link verticaal */
	text-decoration: none;
	color: #FFFFFF;

}

/* gebruik deze als je slechts één bg image voor button wil 
#menu ul a:hover {
	background-image: url(imgs/button2.jpg);
	background-position: left;
    
}
/* ##################### MENU HORIZONTAL  ##########################  */





/*------------------------------------- PRINT ------------------------------------------------*/
@media print { 
	/* your print styles go here */
	#header, #footer, #menu { display: none; } 

	body { font: 12pt georgia,serif; } 
	h1 { font-size: 18pt; } 
	h2 { font-size: 16pt; color: #000; }
}
/*------------------------------------- PRINT ------------------------------------------------*/

