html, body{
 margin:0;
 padding:0;
 text-align:center;
 background-color: #DDD9FB;
 FONT-FAMILY: Arial, Verdana, Tahoma, Trebuchet MS, Arial, Helvetica, sans-serif;
 FONT-SIZE: 12px;
 color: #3313F3;
}

#pagewidth{
 background-color: #FF8F00;
 width:1024px;
 height: 683px;
 text-align:left;
 margin-left:auto;
 margin-right:auto;
 margin-top:50px;
 border: 1px solid #61787D;
}

#technolojoy{
 MARGIN-left: 694px;
 WIDTH: 330px;
 height: 12px;
 background-image: url(img/technolojoy2.gif);
}

#top{
 MARGIN: 0px auto;
 WIDTH: 1024px;
 height: 146px;
 background-image: url(img/packshot.gif);
}

#top2{
 MARGIN: 0px auto;
 WIDTH: 1024px;
 height: 27px;
}

#middle{
 width: 1024px;
 height: 389px;
 MARGIN: 0px auto;
}

#middle2{
 width: 1024px;
 height: 508px;
 MARGIN: 0px auto;
}

#middle3{
 margin-top: 20px;
 margin-left: 50px;
 width: 800px;
 height: 508px;
 text-align: left;
}

#profiel{
 float: left;
 MARGIN-left: 118px;
 MARGIN-top: 80px;
 WIDTH: 250px;
 height: 42px;
}

#werkwijze{
 float: left;
 MARGIN-left: -250px;
 MARGIN-top: 122px;
 WIDTH: 250px;
 height: 42px;
}

#voorbeelden{
 float: left;
 MARGIN-left: -250px;
 MARGIN-top: 162px;
 WIDTH: 250px;
 height: 42px;
}

#prijslijst{
 float: left;
 MARGIN-left: -250px;
 MARGIN-top: 206px;
 WIDTH: 250px;
 height: 42px;
}

#offerte{
 float: left;
 MARGIN-left: -250px;
 MARGIN-top: 246px;
 WIDTH: 250px;
 height: 42px;
}

#contact{
 float: left;
 MARGIN-left: -250px;
 MARGIN-top: 290px;
 WIDTH: 180px;
 height: 42px;
}

#factory{
 float: right;
 MARGIN: 0px auto;
 WIDTH: 386px;
 height: 111px;
 background-image: url(img/factory.gif);
}

#imgvoorbeeld{
 float: left;
 MARGIN: 20px;
 margin-left: 30px;
 WIDTH: 1024px;
 height: 42px;
 background-image: url(img/voorbeelden.gif);
 background-repeat: no-repeat;
}

#imgwerkwijze{
 float: left;
 MARGIN: 20px;
 margin-left: 30px;
 WIDTH: 1024px;
 height: 42px;
 background-image: url(img/werkwijze.gif);
 background-repeat: no-repeat;
}

#imgcontact{
 float: left;
 MARGIN: 20px;
 margin-left: 30px;
 WIDTH: 1024px;
 height: 42px;
 background-image: url(img/contact.gif);
 background-repeat: no-repeat;
}

#imgprijslijst{
 float: left;
 MARGIN: 20px;
 margin-left: 30px;
 WIDTH: 1024px;
 height: 42px;
 background-image: url(img/prijslijst.gif);
 background-repeat: no-repeat;
}

#imgprofiel{
 float: left;
 MARGIN: 20px;
 margin-left: 30px;
 WIDTH: 1024px;
 height: 42px;
 background-image: url(img/profiel.gif);
 background-repeat: no-repeat;
}

#imgofferte{
 float: left;
 MARGIN: 20px;
 margin-left: 30px;
 WIDTH: 1024px;
 height: 42px;
 background-image: url(img/offerte.gif);
 background-repeat: no-repeat;
}

#txtvoorbeeld{
 position: relative;
 top: 50px;
 left: 50px;
 MARGIN: 0px auto;
 WIDTH: 300px;
 height: 15px;
}

#txtprofiel{
 float: left;
 MARGIN-left: 40px;
 MARGIN-top: 0px;
}

#txtprijslijst{
 float: left;
 MARGIN-left: 0px;
 MARGIN-top: 0px;
 width: 400px;
 height: 250px;
}

#imgprwa {
 clear: both;
 position: relative;
 top: 60px;
 left: 137px;
 WIDTH: 749px;
 height: 340px;
 background-image: url(img/vb_prwa.gif);
}

#imgprmp {
 clear: both;
 position: relative;
 top: 60px;
 left: 137px;
 WIDTH: 749px;
 height: 340px;
 background-image: url(img/vb_mepr.gif);
}

#imgprpa {
 clear: both;
 position: relative;
 top: 60px;
 left: 137px;
 WIDTH: 749px;
 height: 340px;
 background-image: url(img/vb_praa.gif);
}

#imgvb1{
 MARGIN: 0px auto;
 WIDTH: 200px;
 height: 200px;
 background-image: url(img/vb1.gif);
 background-repeat: no-repeat;
}

#txtvb1{
 position: relative;
 top: 0px;
 MARGIN: 0px auto;
 WIDTH: 200px;
 height: 70px;
}

#imgvb2{
 MARGIN: 0px auto;
 WIDTH: 200px;
 height: 200px;
 background-image: url(img/vb2.gif);
 background-repeat: no-repeat;
}

#imgvb3{
 MARGIN: 0px auto;
 WIDTH: 200px;
 height: 200px;
 background-image: url(img/vb3.gif);
 background-repeat: no-repeat;
}

#bottom{
 MARGIN: 0px auto;
 WIDTH: 1024px;
 height: 148px;
 background-image: url(img/products1bottom.gif);
}

#bottom2{
 MARGIN: 0px auto;
 WIDTH: 1024px;
 height: 148px;
 background-image: url(img/products2bottom.gif);
}

#contactpagina{
 float: left;
 MARGIN: 0px auto;
 WIDTH: 359px;
 height: 389px;
 background-image: url(img/contactpagina.gif);
}

#email{
 float: left;
 MARGIN-left: 52px;
 MARGIN-top: 248px;
 WIDTH: 340px;
 height: 25px;
}

#website{
 float: left;
 MARGIN-left: 52px;
 MARGIN-top: 0px;
 WIDTH: 340px;
 height: 25px;
}

#fles{
 float: right;
 MARGIN: 0px auto;
 WIDTH: 138px;
 height: 500px;
 background-image: url(img/fles.gif);
}

 /* *** Float containers fix*** */
.clearfix:after {
 content: ".";
 display: block;
 height: 0;
 clear: both;
 visibility: hidden;
 }

.clearfix{display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix{height: 1%;}
.clearfix{display: block;}
/* End hide from IE-mac */

#navlist
{
margin: 0;
padding: 3px 0 20px 10px;
border-bottom: 1px solid #3313f3;
}

#navlist ul, #navlist li
{
margin: 0;
padding: 0;
display: inline;
list-style-type: none;
}

#navlist a:link, #navlist a:visited
{
float: left;
line-height: 14px;
font-weight: bold;
margin: 0 10px 4px 10px;
text-decoration: none;
color: #3313f3;
}

#navlist a:link#current, #navlist a:visited#current, #navlist a:hover
{
border-bottom: 4px solid #3313f3;
padding-bottom: 2px;
background: transparent;
color: #3313f3;
}

#navlist a:hover { color: #3313f3; }

a.a:link {color: #3313f3; text-decoration: underline}
a.a:visited {color: #3313f3; text-decoration: underline}
a.a:hover {color: #ffffff; text-decoration: underline}
a.a:active {color: #ffffff; text-decoration: underline}

a.b:link {color: #ffffff; text-decoration: underline}
a.b:visited {color: #ffffff; text-decoration: underline}
a.b:hover {color: #3313f3; text-decoration: underline}
a.b:active {color: #3313f3; text-decoration: underline}

a.divlink, a.divlink:link {
display:block;
width: 200px; /*width needs to be specified to work in IE*/
height: 200px; /*height needs to be specified to work in IE*/
/*Other browsers expand the link to full width and height.*/
line-height:0;
font-size:0;
}

.navlist2
{
float:left;
padding: 1px;
margin-left: 100px;
margin-top: 100px;
font: 12px verdana, sans-serif;
width: 12em;
color: #ffffff; }

.navlist2 li
{
list-style: none;
margin: 0px;
border-left: 1px #61787D solid;
border-bottom: 1px #61787D solid;
text-align: left;
}

.navlist2 li a
{
display: block;
padding: 0.7em 0.5em 0.7em 0.9em;
text-decoration: none;
}

.navlist2 li a:link { color: #ffffff; }
.navlist2 li a:visited { color: #ffffff; }

.navlist2 li a:hover
{
font-weight:bold;
color: #3313F3;
background: #DDD9FB;
border-left: 7px #004080 solid;
}

.navlist3
{
float:left;
padding: 1px;
margin-left: 36px;
margin-top: -1px;
font: 12px verdana, sans-serif;
width: 200px;
color: #ffffff; }

.navlist3 li
{
list-style: none;
margin: 0px;
border-left: 1px #61787D solid;
border-bottom: 1px #61787D solid;
text-align: left;
}

.navlist3 li a
{
display: block;
padding: 0.7em 0.5em 0.7em 0.9em;
text-decoration: none;
}

.navlist3 li a:link { color: #ffffff; }
.navlist3 li a:visited { color: #ffffff; }

.navlist3 li a:hover
{
font-weight:bold;
color: #3313F3;
background: #DDD9FB;
border-left: 7px #004080 solid;
}

.navlist4
{
float:left;
padding: 1px;
margin-left: -1px;
margin-top: 339px;
font: 12px verdana, sans-serif;
width: 200px;
color: #ffffff; }

.navlist4 li
{
list-style: none;
margin: 0px;
border-left: 1px #61787D solid;
border-bottom: 1px #61787D solid;
text-align: left;
}

.navlist4 li a
{
display: block;
padding: 0.7em 0.5em 0.7em 0.9em;
text-decoration: none;
}

.navlist4 li a:link { color: #ffffff; }
.navlist4 li a:visited { color: #ffffff; }

.navlist4 li a:hover
{
font-weight:bold;
color: #3313F3;
background: #DDD9FB;
border-left: 7px #004080 solid;
}