html,
body {
height: 100%;
}

body {
background-image: url(/img/body-bg.gif);
background-repeat: repeat-y;
background-position: center top;
font-family: Arial, _sans ;
font-size: 12px;
line-height: 1.5em;
*line-height: 1.4em;
margin: 0;
}

/* GEN STYLES */

img {
border: 0;
}

a:link,
a:visited,
a:active {
color: inherit;
text-decoration: none;
}

a:hover {
color: #000000;
text-decoration: none;
}

#main {
width: 924px;
margin-left: auto;
margin-right: auto;
background-color: #ffffff;
}

#header {
width: 925px;
height: 80px;
position: relative;
float: left;
clear: both;
background-color: #fff;
margin: 0px 0px 0px 0px;
}

#logo {
width: 550px;
position: absolute;
left: 30px;
top: 10px;
}

#header-nav {
width: 310px;
position: absolute;
left: 600px;
top: 20px;
text-align: right;
}

#header-nav a {
font-size: 11px;
font-weight: bold;
text-decoration: none;
}

#header-nav a:link,
#header-nav a:active,
#header-nav a:visited {
color: #000000;
}

#header-nav a:over {
color: #cc0000;
}

#nav {
position: absolute;
margin: 81px auto 0px auto;
font-weight: bold;
z-index: 99;
padding-left: 35px;
*margin: 1px 50px 0px -910px;
}

#header-nav1 {
position: absolute;
left: 0px;
top: 5px;
padding-left: 710px;
}

#header-nav1 a {
font-size: 11px;
font-weight: bold;
text-decoration: none;
}

#header-nav1 a:link,
#header-nav1 a:active,
#header-nav1 a:visited {
color: #000000;
}

#header-nav1 a:over {
color: #cc0000;
}

#tab-active {
width: 200px;
height: 35px;
position: relative;
float: left;
margin-right: 5px;
background-image: url(/img/tab.jpg);
background-repeat: no-repeat;
color: #cc0000;
}

#tab-inactive {
width: 200px;
height: 35px;
position: relative;
float: left;
margin-right: 5px;
background-image: url(/img/tab-inactive.jpg);
background-repeat: no-repeat;
color: #ffffff;
}

.tab {
font-size: 13px;
text-align: center;
padding-top: 10px;
}

#tab-active a {
text-decoration: none;
color: #cc0000;
}

#tab-active .tab a:hover,
#tab-active .tab a:active,
#tab-active .tab a:visited {
text-decoration: none;
color: #000000;
}

#tab-inactive a {
text-decoration: none;
color: #666666;
}

#tab-inactive a:active,
#tab-inactive a:visited {
text-decoration: none;
color: #666666;
}

#tab-inactive a:hover {
text-decoration: none;
color: #000000;
}

#left {
width: 740px;
min-height: 450px;
_height: 435px;
position: relative;
float: left;
margin-top: 35px;
margin-left: 15px;
_margin-left: 8px;
background-image: url(/img/content-bg.gif);
background-repeat: no-repeat;
}

#left-inner {
width: 740px;
height: 472px;
_height: 402px;
position: relative;
float: left;
margin: 10px 0px 0px 0px;
}

#page-inner {
width: 730px;
height: 472px;
position: relative;
float: left;
margin: 10px 0px 0px 0px;
overflow: auto;
}

#left #pagetitle {
width: 500px;
*height: 20px;
_height: 20px;
margin: 15px 0px 0px 25px;
_margin: 15px 0px 0px 13px;
*padding-bottom:5px;
font-size: 18px;
color: #cc0000;
position: relative;
float: left;
clear: left;
overflow: visible;
}

#left #pagetitle a {
font-size: 18px;
color: #333333;
}

#left #pagetitle .path {
font-size: 18px;
color: #333333;
}

#left #texttitle {
width: 685px;
margin: 15px 0px 10px 25px;
_margin: 15px 0px 10px 13px;
_padding-bottom: 5px;
font-size: 18px;
color: #cc0000;
position: relative;
float: left;
clear: left;
}

#left #pagenum1,
#left #pagenum2 {
width: 200px;
position: relative;
float: left;
text-align: right;
font-size: 18px;
color: #cc0000;
}

#left #pagenum1 {
margin: 15px 0px 0px 0px;
_margin: 15px 0px 0px 0px;
padding-bottom: 5px;
}

#left #pagenum2 {
margin: 5px 25px 0px 525px;
_margin: 5px 25px 0px 0px;
_clear: right;
}

#left #pagenum1 a,
#left #pagenum2 a {
color: #666666;
text-decoration: underline;
}

#left #pagecontent {
width: 685px;
margin: 10px 0px 0px 25px;
_margin: 0px 0px 0px 13px;
color: #000000;
position: relative;
float: left;
clear: both;
}

#left #groups,
#left #products {
width: 740px;
height: 405px;
margin: 10px 0px 0px 0px;
*margin: 5px 0px 0px 0px;
position: relative;
float: left;
clear: both;
}

#left #artikel {
margin: 25px 10px 0px 5px;
position: relative;
float: left;
clear: both;
}

#artikel #artikel-img {
margin: 20px 0px 0px 20px;
_margin: 20px 0px 0px 10px;
width: 200px;
position: relative;
float: left;
clear: left;
}

#artikel #artikel-content {
margin: 0px 0px 0px 5px;
width: 475px;
height: 400px;
position: relative;
float: left;
clear: right;
overflow: auto;
}

#artikel .artikel-item {
width: 458px;
position: relative;
float: left;
clear: both;
margin: 10px 0px 0px 0px;
}

#artikel .artikel-var {
position: relative;
float: left;
width: 100px;
font-size: 10px;
font-weight: bold;
}

#artikel .artikel-val {
position: relative;
float: left;
font-size: 12px;
font-weight: bold;
}

#artikel td {
font-size: 11px;
}

#artikel .title {
font-weight: bold;
}

#right {
width: 150px;
height: 400px;
position: relative;
float: left;
margin-top: 35px;
margin-left: 8px;
background-color: #fff;
}

#right .item {
width: 150px;
position: relative;
float: left;
background-image: url(/img/item-bg.gif);
background-repeat: no-repeat;
padding-top: 8px;
}

#right .item-close {
width: 150px;
position: relative;
float: left;
}

#right .divider {
height: 8px;
width: 150px;
position: relative;
float: left;
_margin-top: -8px;
}

#search,
#news,
#brand {
position: relative;
float: left;
margin: 5px 10px 5px 15px;
*margin: 0px 5px 0px 12px;
_margin: 0px 5px 0px 7px;
}

#search {
}

#search input { 
width: 118px;
font-size: 12px; 
font-family: Arial, _sans; 
color: #333; 
font-weight: bold;
_font-weight: normal;
border: 1px solid #999;
margin: 2px 0px 5px 0px;
*margin: 2px 0px 5px 2px;
_margin: 2px 0px 5px 0px;
text-indent: 3px;
}

#news {
height: 198px;
*height: 198px;
_height: 200px;
line-height: 1.2em;
_padding-right: 5px;
}

#news a {
color: #333333;
font-weight: bold;
_font-weight: normal;
text-decoration: underline;
}

#news .archief a {
font-size: 11px;
text-decoration: none;
}

#brand {
height: 106px;
*height: 116px;
_height: 110px;
}

#brand #labels {
padding-top: 10px;
}

.item .header {
font-weight: bold;
font-size: 13px;
color: #cc0000;
margin-bottom: 50px;
}

#search .vb {
font-size: 10px;
color: #666666;
}

#content {
position: relative;
float: left;
clear: both;
margin: 10px 0px 0px 10px;
}

#footer {
width: 800px;
position: relative;
float: left;
clear: both;
margin-top: 5px;
*margin-top: 0px;
margin-left: 20px;
_margin-left: 15px;
font-size: 10px;
color: #666666;
}

#footer a {
color: #666666;
text-decoration: none;
}

.level1 {
width: 140px;
height: 155px;
_height: 151px;
position: relative;
float: left;
background-image: url(/img/level1-bg.jpg);
background-repeat: no-repeat;
margin: 0px 4px 0px 4px;
_margin: 0px 0px 0px 5px;
}

.level1-item {
width: 100px;
height: 100px;
position: relative;
float: left;
margin: 20px 0px 0px 20px;
_margin: 20px 0px 0px 10px;
background-color: #ffffff;
}

.level1-info {
width: 120px;
position: relative;
float: left;
margin: 2px 0px 0px 10px;
_margin: 4px 0px 0px 5px;
color: #666666;
font-size: 11px;
font-weight: bold;
_font-weight: normal;
text-align: center;
_line-height: .99em;
}

.level1 a {
color: #333333;
}

.level2 {
width: 120px;
height: 140px;
position: relative;
float: left;
background-image: url(/img/level2-bg.jpg);
background-repeat: no-repeat;
margin: 0px 0px 0px 3px;
_margin: 0px 0px 0px 2px;
}

.level2 a {
color: #333333;
}

.level2-item {
width: 80px;
height: 80px;
position: relative;
float: left;
margin: 20px 0px 0px 20px;
_margin: 20px 0px 0px 10px;
background-color: #ffffff;
}

.level2-info {
width: 100px;
position: relative;
float: left;
margin: 2px 0px 0px 10px;
_margin: 2px 0px 0px 5px;
color: #666666;
font-size: 11px;
font-weight: bold;
_font-weight: normal;
text-align: center;
}

.level11 {
width: 140px;
height: 155px;
_height: 156px;
position: relative;
float: left;
margin: 0px 4px 0px 4px;
_margin: 0px 4px 0px 3px;
}

.level11-item {
width: 140px;
_width: 120px;
height: 110px;
position: relative;
float: left;
margin: 0px 0px 0px 0px;
background-image: url(/img/level1-overlay.png);
_background-image: url(/img/level1-overlay.gif);
background-repeat: no-repeat;
padding: 20px 0px 0px 20px;
}

.level11-info {
width: 120px;
position: relative;
float: left;
margin: -8px 0px 0px 10px;
_margin: 0px 0px 0px 5px;
color: #666666;
font-size: 11px;
font-weight: bold;
_font-weight: normal;
text-align: center;
_line-height: .99em;
}

.level11 a {
color: #333333;
}

.level22 {
width: 120px;
height: 140px;
position: relative;
float: left;
margin: 0px 0px 0px 3px;
_margin: 0px 0px 0px 2px;
}

.level22 a {
color: #333333;
}

.level22-item {
width: 120px;
_width: 100px;
height: 90px;
position: relative;
float: left;
margin: 0px 0px 0px 0px;
background-image: url(/img/level2-overlay.png);
_background-image: url(/img/level2-overlay.gif);
background-repeat: no-repeat;
padding: 20px 0px 0px 20px;
}

.level22-info {
width: 110px;
_width: 100px;
position: relative;
float: left;
margin: -5px 0px 0px 5px;
_margin: -5px 0px 0px 0px;
color: #666666;
font-size: 11px;
font-weight: bold;
_font-weight: normal;
text-align: center;
overflow: visible;
}

#level33 {
width: 240px;
height: 240px;
position: relative;
float: left;
margin: 0px 0px 0px 0px;
}

#level33-item {
width: 220px;
height: 220px;
position: relative;
float: left;
clear: both;
margin: 0px 0px 0px 0px;
background-image: url(/img/level3-overlay.png);
_background-image: url(/img/level3-overlay.gif);
background-repeat: no-repeat;
padding: 20px 0px 0px 20px;
}

#vouwschema {
width: 51px;
height: 39px;
position: relative;
float: left;
margin-left: 120px;
_margin-left: 60px;
}

#vraag {
width: 51px;
height: 39px;
position: relative;
float: left;
}

#level3 {
width: 220px;
height: 220px;
position: relative;
float: left;
background-image: url(/img/level3-bg.jpg);
background-repeat: no-repeat;
margin: 0px 0px 0px 0px;
}

.brand-item {
width: 120px;
position: relative;
float: left;
margin: 0px 0px 15px 0px;
*margin: 0px 0px 15px 5px;
_margin: 0px 0px 15px 0px;
text-align: center;
}

.newslist {
width: 600px;
position: relative;
float: left;
clear: both;
}

.newslist-date {
margin: 5px 0px 0px 25px;
_margin: 5px 0px 0px 13px;
font-size: 10px;
color: #666666;
font-style: italic;
position: relative;
float: left;
}

.newslist-title {
}

.newslist-teaser {
margin: 5px 0px 0px 25px;
_margin: 5px 0px 0px 13px;
position: relative;
float: left;
}

.newslist-teaser a {
font-weight: bold;
color: #333333;
}

.newslist-teaser a:hover {
text-decoration: underline;
}

.label {
width: 670px;
position: relative;
float: left;
padding-top: 10px;
padding-bottom: 10px;
margin-bottom: 10px;
border-bottom: 1px solid #ddd;
}

.label-img {
width: 150px;
_width: 140px;
height: 100%;
position: relative;
float: left;
text-align: center;
margin-right: 10px;
}

.label-title {
width: 500px;
position: absolute;
top: 0;
left: 160px;
border: 0px solid #000;
margin-bottom: 5px;
}

.label-info {
width: 500px;
position: absolute;
top: 25px;
left: 160px;
_padding-top: 3px;
_padding-bottom: 10px;
border: 0px solid #000;
line-height: .5em;
}