body {
   font-family: Verdana;
   font-size: 12px;
   background: #d2d2d2 url(/Files/System/images/bg.jpg) repeat-y top center;
   line-height: 140%;
}

a {
   color: #000;
   border-bottom: 1px solid #ff8b03;
   padding: 2px 0px;
}

a:hover {
   color: #ff8b03;

}

#container {
   width: 898px;
   background: url(/Files/System/images/body_bg.jpg) bottom left no-repeat;
   border: 1px solid #fff;
   margin-left: auto;
   margin-right: auto;
padding-bottom: 30px;
}

#header {

}

#header h1 a {
   background: url(/Files/System/images/header.jpg) no-repeat;
   display: block;
   height: 78px;
   text-indent: -9999px;
border-bottom: 0px;
padding-bottom: 0px;
margin-bottom: -2px;
}

#header ul {
   background: url(/Files/System/images/topnav.jpg) no-repeat;
   height: 38px;
}

#header li {
   float: left;
   text-indent: -9998px;
   margin-top: 7px;
   margin-right: 0px;
}

#header li a {
   display: block;
   padding: 3px 5px;
   border: 0px;
   position: relative;
}


html>body #header li.contact { margin-left: 243px; width: 62px; }
#header li.contact { margin-left: 121px; width: 62px; }
#header li.nieuwsbrief { width: 97px; }
#header li.route { width: 56px; }
#header li.haspels { width: 69px; }

/* SIDEBAR */

#sidebar {
   float: left;
   width: 230px;

}

/* NAVIGATION */

#nav {

   z-index: 0;
   width: 234px;
   height: 295px;
   margin-left: -35px;
   margin-top: 15px;
   padding: 10px 10px 10px 10px;
  position: absolute;
}

#nav ul {
position: relative;
display: block;
z-index: 500;
}

html>body #nav {
   width: 259px;
   height: 320px;
   background: url(/Files/System/images/nav_bg.png) no-repeat;
}

#nav ul {
   margin-top: 0px;
}

#nav li {
   margin-bottom: 0px;
background: url(/Files/System/images/nav-bullet-white.gif) no-repeat 5px 8px;
}
#nav li div:hover {
background: url(/Files/System/images/nav-bullet-red.gif) no-repeat 5px 8px;
cursor: pointer;
}

#nav li li:hover, #nav li li.over {
background: url(/Files/System/images/nav-bullet-red.gif) no-repeat 5px 8px;
}

#nav li div {
height: 25px;
}

#nav li li {
height: 23px;
padding-top: 2px;
}

#nav li li a {
   font-size: 14px;
   padding-left: 45px;
}

#nav * {

}

#nav a {
   border-bottom: 0px;
   font-weight: normal;
   font-family: Arial;
   font-weight: bold;
   padding-left: 35px;
}


#nav a:hover {
   color: #d60b01;
}
#nav embed {
   position: relative;
}

/* COPPER */

#copper {
   filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='/Files/System/Images/copper_bg.png'); 
   position: absolute;
   width: 234px;
   margin-left: -35px;
   height: 85px;
   padding: 10px 10px 10px 10px;
}

html>body #copper {
   width: 254px;
   height: 105px;
   padding: 0px 10px 10px 10px;
   background: url(/Files/System/images/copper_bg.png) no-repeat;
}

#copper h2 {
margin-top: 10px;
   margin-left: 5px;
   color: #fff;
   font-size: 18px;
   font-family: arial;
   font-weight: bold;
border-bottom: 0px;
}

#copper h2 {
margin-bottom: -10px;
}

#copper table {
margin-left: 3px;
color: #fff;
margin-top: 0px;
}

#copper table td {
border-bottom: 1px solid #d68921;
width: 145px;
padding-top: 0px;
}

html>body #copper table td {
padding-top: 7px;
}

#copper table td.short {
width: 62px;
font-weight: bold;
}

#copper dt {
   padding-top: 0px;
   margin-top: 0px;
height: 20px;
}

#copper dd {
   padding-top: 0px;
height: 20px;
   color: #ffe4c6;
}


#copper {
   position: absolute;
   margin-top: 346px;
}

/* TXT */

#txt {
   margin-lefT: 230px;
   padding: 15px;
padding-bottom: 20px;
}

#txt h1 {
   font-size: 20px;
   font-weight: lighter;
   color: #d60b01;
   margin-bottom: 0px;
}

#txt p {
   margin-bottom: 10px;
}

a.more, a.more:hover {
   display: block;
   font-weight: bold;
   color: #333;
   margin-top: 5px;
   width: 85px;
   padding: 3px 3px 3px 5px;
border: 0px;
float: right;
margin-top: -5px;
}

a.more:hover {
color: #d60b01;
}

#producten {
float: left;
margin-top: 15px;
width: 210px;
   height: 200px;
   padding-right: 50px;
   background: url(/Files/System/images/kabels.gif) no-repeat 210px 0px;
}

#producten h2, #nieuws h2 {
border: 0px;
margin-top: 0px;
}

#producten p, #nieuws p {
line-height: 140%;
margin-top: 0px;
}

#producten a.more {
float: none;
width: 100%;
margin-top: 0px;
margin-left: 100px;
}

#nieuws {
   background: url(/Files/System/images/news_bg.png) no-repeat;
   margin-left: 290px;
   padding: 15px;
height: 245px;
margin-bottom: 20px;
}

#nieuws p {
margin-top: 5px;
position: relative;
font-size: 11px;
height: 120px;
}

#nieuws a {
position: relative;
}

#nieuws p img, #nieuws p span {
float: right;
margin-left: 5px;
position: absolute;
right: 0;
margin-right: -100px;
margin-top: 0px;
}

#nieuws p {
margin-right: 100px;
}

#nieuws ul {
clear: right;
padding-top: 20px;
padding-left: 0px;
}

#txt #nieuws li {
margin-bottom: 5px;
background: none;
padding-left: 0px;
}

#nieuws li a {
background: url(/Files/System/images/bullet-orange.gif) no-repeat 0px 4px;
padding-left: 15px;
font-weight: bold;
font-size: 11px;
width: 100%;
}

#txt #nieuws li a:hover {
color: #ff8400;
}

#footer {
   clear: both;
   margin-top: 10px;
}

#footer p {
margin-left: 20px;
width: 200px;
float: left;
}

#footer address {
margin-left: 420px;
}

#txt ul, #txt ol {
margin-bottom: 10px;
margin-left: 10px;
}

#txt li {
   background: url(/Files/System/images/bullet-red.gif) no-repeat 0px 4px;
   padding-left: 15px;
}

#txt li a {
   border: 0px;
}

#txt li a:hover {
   color: #d60b01;
}

div.clearfix {
margin-top: 15px;
}

.branches param, object.branches, .branches embed {
width: 100%;
}

div#flashobject {
margin-left: 2px;
margin-top: 30px;
}

#test span {
background: red;
display: block;
}

#test span.over {
background: #000;
}

h2 {
margin-bottom: 5px;
border-bottom: 1px solid #bbb;
padding-bottom: 5px;
margin-top: 25px;
}

h3 {
margin-bottom: 5px;
border-bottom: 1px solid #bbb;
padding-bottom: 5px;
margin-top: 25px;

}

p {
line-height: 180%;
}


p img, .nieuws p img.newsimage {
float: right;
margin: 10px;
margin-right: 0px;
margin-top: -30px;
padding: 3px;
background: #fff;
border: 1px solid #ccc;
margin-bottom: 10px;
}

.nieuws p img {
float: none; margin: 0;
}

p img.left {
float: left;
margin-left: 0px;
margin-right: 10px;
margin-top: 5px;
}

#nieuws p img {
width: auto;
}

dt {
font-weight: bold;
}

#txt .kabelindex {
width: 625px;
display: block; 
height: 150px;
margin-left: 0px;
background: #fff url(/Files/System/Images/Kabels/kabels1.jpg) no-repeat 15px 157px; border: 1px solid #ccc;
padding: 5px;
height: 310px;
padding-right: 0px;
margin-bottom: 10px;
}

#txt #drie {
height: 300px;
background: #fff url(/Files/System/Images/Kabels/kabels2.jpg) no-repeat 15px 147px; border: 1px solid #ccc;
}

#txt .kabelindex li {
float: left;
background: none;
padding: 0;
margin: 0;
width: 25%;
color: #555;
}

#txt .kabelindex .drie li {
width: 33.3%;
}

#txt .kabelindex .drie li li {
width: auto;
}

#txt .kabelindex a {
color: #000;
border-bottom: 1px dotted #fd8902;
padding: 0px;
}



.kabelindex strong {
background: #efefef;
margin-bottom: 5px;
display: block;
padding: 5px;
color: #fff;
border-right: 5px solid #fff;
}
.kabelindex .drie strong {
color: #000;
}

.kabelindex #installatiekabel strong {
background: #57a100;
}
#txt .kabelindex li#installatiekabel li {
background: url(/Files/System/images/bullet-green.gif) no-repeat 5px 4px;
}
.kabelindex #stuurstroomkabel strong {
background: #004199;
}

#txt .kabelindex li#stuurstroomkabel li {
background: url(/Files/System/images/bullet-blue.gif) no-repeat 5px 4px;
}

.kabelindex #geharmoniseerd strong {
background: #fd8902;
}

.kabelindex #datakabel strong {
background: #d70c02;
}

#txt .kabelindex li#datakabel li {
background: url(/Files/System/images/bullet-red.gif) no-repeat 5px 4px;
}

#txt .kabelindex ul {
background: none;
padding: 0;
margin: 0;
}

#txt .kabelindex li li {
background: url(/Files/System/images/bullet-orange.gif) no-repeat 5px 4px;
padding: 0;
margin: 0;
float: none;
border: 0px;
padding-left: 20px;
width: auto;
}

img.kabel {
border: 1px solid #ccc;
margin-bottom: -15px;
padding: 18px;
background: #fff;
}

#txt p.terug {
margin-left: 460px;
position: absolute;
margin-top: -15px;
}

#txt p.terug a {
color: #999;
border-bottom: 0px;
font-size: 10px
}

span.nieuws {
color: #555;
margin-top: -5px;
margin-bottom: -5px;
position: relative;

font-size: 10px;
}

#txt .gallery {
margin-left: 0px;
}

#txt .gallery li {
width: 140px;
height: 140px;
margin-right: 15px;
float: left;
background: none;
padding: 0px;
}

#txt .gallery li a {

display: block;
padding: 10px;

text-align: center;

}

#txt .gallery li a:hover {
background: #fff;
}

#txt .gallery li a img {
background: #efefef;
padding: 5px;
}

#txt .gallery li a:hover img {
padding: 4px;
border: 1px solid #ccc;
}



#header ul li a {

padding-bottom: 7px;
}

.Contact {
width: 60px;
margin-left: 180px;
display: block;
}

.Nieuwsbrief {
width: 93px;
}

.Documenten {
width: 93px;
}

.Route {
width: 56px;
}

.Haspels {
width: 68px;
}

.Prijslijst {
width: 72px;
}



/* FORMULIER HASPELS */

form {
width: 550px;
}

#form fieldset {
border: 0px;
padding: 0px;
padding-bottom: 0px;
}

#form legend {
margin-bottom: 0px;
margin-left: -5px;
display: block;
font-weight: bold;
margin-bottom: 10px;
}

#form label {
width: 100%;
font-weight: bold;
display: block;
float: none;
padding: 2px;
cursor: pointer;
color: #333;
}

#form label:hover {
color: #000;
}

#form div {
margin-bottom: 5px;
padding: 5px;
}

#form input, #form textarea {
padding: 2px;
background: #fff;
border: 1px solid #ccc;
}

#form input {
width: 100%;
margin-left: 0%;
margin-bottom: 10px;
}

#form select {
border: 1px solid #ccc;
}

#form textarea {
width: 497px;
font-family: verdana;
font-size: 12px;
}

#form .error {
background: #ffc1b5;
border: 1px solid #f62900;
}

#form .error input, #form .error textarea {
border: 1px solid #f62900;
}

#form .prysmian input {
width: 40px;
margin-top: 5px;
margin-left: 25px;
margin-right: 5px;
}

#form .prysmian input.b {
width: 411px;
margin-right: 0px;
margin-left: 10px;
}

#form .prysmian span {
margin-top: 9px;
position: absolute;
}


#form .overige {
width: 230px;
float: left;
}
#form .overige2 {
width: 234px;
padding-top: 26px;
float: right;
margin-right: 31px;
padding-right: 17px;
}

#form .aflever {
clear: both;
}

#form .hefinstallatie legend {
margin-bottom: 5px;
}

#form .hefinstallatie {
height: 35px;
}

#form .hefinstallatie label {
width: 50px;
float: left;
}

#form .hefinstallatie input {
width: 20px;
float: right;
margin-top: -15px;
}

#form .ktg input {
float: left;
width: 240px;
margin-right: 10px;
}

#form .ktg div {
padding: 0px;
}

#form .afhalen input, #form .contactpersoon input, #form .telefoon input {
width: 497px;
}

.nofloat {
margin: 0px;
float: none;
}
#txt address {
float: left;
width: 33%;
}



#contactform {
margin-top: 150px;
}

#contactform #form {
margin-left: -5px;
}

#contactform textarea {
width: 540px;
}

html>body .gallery {
height: 280px;
}

input.disabled {
border: 1px solid #F2F2F2;
background-color: #F2F2F2;
}

input.required, textarea.required {
}

#form select.validation-failed, #form input.validation-failed, #form textarea.validation-failed {
border: 1px solid #C00321;
}

input.validation-passed, textarea.validation-passed {
color : #000;
}

#form .validation-advice {
background-repeat: no-repeat;
background-position: 4px 0px;
margin: -1px 0 0 0px;
height: 0px;
padding: 0px; 
color: #C10322;
width: 100%;
display: none;
}



#form div.validation-advice p {
padding: 4px 3px 2px 3px; 
color: #C10322;
margin: 0px;
display: none;
}

#form div.custom-advice {
background-color: #C10322;
color : #C10322;
display: none;
}

#form input#nieuwsbrief  {
width: auto;
float: left;
margin-top: 3px;
margin-top: 0;
margin-right: 10px;
padding: 0;
border: 0;
background: none;
}

#form #nieuwsdiv label {
display: inline;
clear: none;
}

#nieuws p img {
width: 90px;
}
#txt .nieuws {

padding-bottom:40px;
}