/* Opmaak en positionering voor de pagina: */

html{ /* Achtergrondkleur en afbeelding voor de pagina */
  background: #F0F0FF url(back.gif) top center repeat-x scroll;
}

body{
	left: 50%;
  margin: 0;
	margin-left: -374px;
	padding: 145px 20px 20px 210px;
	position: absolute;
	top: 15px;
  color: #616161;
  background: transparent url(side.gif) 0px 0px repeat-y scroll;
	width: 748px;

  /* Box model hack: */

  voice-family: "\"}\""; 
  voice-family:inherit;
	width: 518px;
}

#side{ /* De zijbalk */
  position: absolute;
  top: 77px;
  left: 50%;
  margin-left: -366px;
  height: 400px;
  padding: 180px 14px 0px 14px;
  color: #536A9D;
  background: transparent url(vrouw.jpg) 0px 0px no-repeat scroll;
  width: 179px;

  /* Box model hack: */

  voice-family: "\"}\""; 
  voice-family:inherit;
  width: 151px;
}
#side1{ /* De zijbalk */
  position: absolute;
  top: 77px;
  left: 50%;
  margin-left: -385px;
  height: 400px;
  padding: 180px 14px 0px 14px;
  color: #536A9D;
  background: transparent url(vrouw.jpg) 0px 0px no-repeat scroll;
  width: 179px;

  /* Box model hack: */

  voice-family: "\"}\""; 
  voice-family:inherit;
  width: 151px;
}


html>body #side{ /* Voor anders browsers dan IE */
  padding-top: 170px;
}

 /* Lettertypes */

h1, h2, h3{
	font-weight: normal;
}
 
p, address, legend, li, tel, h1, h2, h3, label, input, textarea{
	font-family: Verdana, Arial, Tahoma, Helvetica, Sans-serif, "Trebuchet MS";
}

h1#header{
  padding: 0;
  margin: -145px -21px 0px -210px;
  height: 166px; /* De hoogte van de header */
  background: transparent url(header.gif) 0px 0px no-repeat scroll;
  font-family: Tahoma, Verdana, Helvetica, Sans-serif;
  text-transform: uppercase;
  color: #6775AA;
  padding-left: 16px;
  font-size: 2.9em;
  letter-spacing: 0.05em;
  font-weight: bold;
}

h1#header em{
  font-style: normal; /* Geen cursieve letters in de header */
  display: block;
  color: #011B6A;
  margin-top: -55px;
  margin-left: 1.7em;
  font-size: 0.5em;
  letter-spacing: 0.1em;
  background: transparent url(telefoonservice.jpg) 220px 10px no-repeat scroll; /* De koppen in de header */
  padding-top: 40px;
}

html>body h1{ /* Voor andere browsers dan IE */
  margin-top: 0em;
}

#content{
  margin-top: -60px;
  margin-right: 50px;
  margin-left: 30px;  
}

h1{
  color: #02073C;
  margin-top: 0.3em;
  margin-bottom: 0.5em;
  font-weight: bold;
}

h2{
  color: #4D5880;
  font-size: 1.1em;
  clear: both;
  margin-top: 1.3em;
  margin-bottom: 0.2em;
  font-weight: bold;
}

h3{
  color: #6775AA;
  font-size: 0.8em;
  clear: both;
  margin-top: 0.3em;
  margin-bottom: -0.8em;
  font-weight: bold;
}

p, legend, li{
	font-size: 0.71em;
	line-height: 1.4em;	
}

#side h1{
  font-size: 0.9em;
  color: #D40000;
  font-weight: bold;
  margin-bottom: 1.1em;
  margin-top: 1em;	
}

#side h2{
  font-size: 0.7em;
  color: #536A9D;
  font-weight: bold;
}

#side tel{
  font-size: 0.9em;
  color: #536A9D;
  font-weight: bold;
}


#side li{
	font-size: 0.7em;
	line-height: 1.2em;
}

 /* Kleuren van de hyperlinks: */

a{
  color: #1639BA;
}

a:hover{
  color: #4F6EE0;
}

a.address{
  color: #011B6A;
	text-decoration: none;
}

a:hover.address{
  color: #FF0000;
	text-decoration: underline;
}

/* Opmaak voor contactformulier: */

fieldset{
	border: 0;
	margin: 30px 0 0 0;
  width: 425px;
  font-size: 0.9em;
}

legend{

}

fieldset p, ul ol{
	font-size: 1em;
}

html>body textarea{
	width: 395px;
}

input{
	width: 220px;
}

input, textarea, #contactform div.checkfrm input#naam{
	background: url(form.gif) #FFFFFF 0px -3px repeat-x scroll;
	border: 1px solid #A0AACF;
	padding: 0.3em;
}

input, textarea, select{
	font-size: 0.75em;
	margin-bottom: 0.4em;
}

input.knop{
	background-position: 0px 2px;
	color: #999999;
	width: 9em;
}

input.knop:hover{ /* Anndere achtergrondpositie en kleur bij het bewegen van de muis over de knop */
	background-position: 0px -2px;
	color: #777777;
}

input:hover, textarea:hover, /* Andere randkleur en achtergrondpositie bij het bewegen van de muis over de velden */
input:focus, textarea:focus,
#contactform div.checkfrm input#naam:hover{
	background-position: 0px -5px;
	border-color: #324C9C;
}

label{
	color: #777777;
	font-family: Verdana, Helvetica, Sans-serif;
	font-size: 0.75em;
}

small{
	color: #888888;
}

textarea{
	background: url(frm_ta.gif) #FFFFFF 0px -4px repeat-x scroll;
	height: 180px;
	overflow: auto;
	width: 398px;
}

textarea:hover, textarea:focus{ /* Andere achtergrondpositie bij het bewegen van de muis over het tekstveld */
	background-position: 0px -10px;
}

.bar fieldset{
	padding: 0;
}

#contactform{margin-bottom: -1em;}

#contactform div{
	background: #E4E9F4;
	margin: 2px;
	padding: 8px 0px 2px 8px;
}

p.inline {
	color: #777777;
	font-family: Verdana, Helvetica, Sans-serif;
	font-size: 0.75em;
}


#contactform div input, #contactform div.checkfrm input#naam{
	width: 180px;
}

#contactform div.checkfrm input#naam{
  float: right;
  margin: -28px 5px 10px -15px;
}

html>body #contactform div.checkfrm input#naam{
  margin-right: 10px;
}

#contactform label{
	color: #444444;
	display: block;
	float: left;
	width: 215px;
}

#contactform div.checkfrm{
  height: 35px;
}

#contactform div.checkfrm input{
  width: 15px;
  background: transparent;
  border: 0;
  position: relative;
  top: 6px;
}

#contactform div.checkfrm label{
  display: inline;
  float: none;
}

#contactform div.checkfrm label.slabel{
  width: 15px;
  margin: 0;
}

div label:hover + input, div label:hover + br + textarea{ /* Bij het bewegen van de muis over de labels verandert de kleur van de rand van de bijbehorende velden */
	border: 1px solid #324C9C;
}

/* Overig: */

strong{
  font-weight: normal; /* Strong, maar dan zonder de strong ;-) */
}

b{
  font-weight: normal; /* Strong, maar dan zonder de strong ;-) */
}

 /* Navigation: */
 #navcontainer
{
background: #DDE4F4;
width: 100%;
margin: 0 auto;
padding: 1em 0;
 /* font-family: verdana, arial, serif, georgia ;: */

text-align: center;
text-transform: lowercase;
}

ul#navlist
{
text-align: left;
list-style: none;
padding: 0;
margin: 0 auto;
width: 90%;
}

ul#navlist li
{
display: block;
margin: 0;
padding: 0;
}

ul#navlist li a
{
display: block;
width: 100%;
padding: 0.2em 0 0.2em 1em;
border-width: 1px;
border-color: #FFFFFF #858BAB #737995 #FFFFFF;
border-style: solid;
color: #484848;/*  buttonkleur, niet actief, was #7D7D7D */
text-decoration: none;
background: #F0F0FF; /* buttonkleur, niet actief, was #F7F6F5 */
}

#navcontainer>ul#navlist li a { width: auto; }

ul#navlist li#active a
{
background: #536A9D; /* kleur button actief was #2E81C9*/
color: #FFFFFF ; /* kleur letter actieve keuze was  #8D8D8D*/
font-weight: bold;
}

ul#navlist li a:hover, ul#navlist li#active a:hover
{
color: #525252; /* hoverkleur letters */
background: transparent;
border-color: #aaab9c #fff #fff #ccc;
}

img.left{ /* Links uitgelijnde afbeelding */
  float: left;
	padding:5px;	
	border:1px solid #eeeeee;
	margin-right:15px;
	margin-top:0px;
	margin-bottom:2px;	
}

img.right{ /* Rechts uitgelijnde afbeelding */
  float: right;
	padding:5px;	
	border:1px solid #eeeeee;
	margin-left:15px;
	margin-top:0px;
	margin-bottom:2px;	
}

p#bottomlinks{
  margin: 3em -350px 0 0; /* negatieve rechtermarge, anders valt hij in IE binnen de linkerkolom */
  padding: 2em 0 2em 0;
  font-size: 0.7em;
  color: #CACCC1;
  display: block;
  text-align: center;
  width: 748px;
  background: #F0F0FF url(footer.gif) 0px 0px no-repeat scroll; /* Zelfde achtergrondkleur als html-element */
  position: relative;
  left: -210px;
  top: 21px; 
  height: 50px;
}

p#bottomlinks a{
  color: #BFCAD9;
}

img.left{ /* Links uitgelijnde afbeelding */
  float: left;
  margin-right: 15px;
}

img.right{ /* Rechts uitgelijnde afbeelding */
  float: right;
  margin-left: 15px;
}

address{ /* Adres onderin */
  background: #FFF;
  font-weight: bold;
  color: #011B6A;
  font-style: normal;
  margin-left: -202px; /* plaatsing */
  margin-right: -12px;
  font-size: 0.6em;
  padding: 6px 0 6px 0;
  text-align: center;
  margin-top: 61px; /* plaatsing */
  margin-bottom: -61px;
  position: relative;
  z-index: 3;
  border-top: 1px solid #5A6DA4;
}