﻿/* Stylesheet voor WSB.nl. (c) WSB Hi-Tech Bicycle Europa B.V. Alle rechten voorbehouden. */

/* Stijlen: Algemeen */

body {
  margin: 0px;
  padding: 0px;
  font-family: Verdana, Sans-Serif;
}

a img {
  border: none;
}

.clearfix {
  clear: both;
  line-height: 0px;
}

#site {
  width: 990px;
  margin: 0px auto;
  background: url(/interface/images/site_bg.gif) repeat-y left top;
}

#site.home {
  background: url(/interface/images/site_home_bg.gif) repeat-y left top;
}


/* Stijlen: Top en Navigatie */

.top {
  height: 391px;
  position: relative;
}

.top #taalkeuze {
  position: absolute;
  left: 95px;
  top: 11px;
  font-size: 10px;
  color: #989191;
}

.top #taalkeuze .knoppen {
  position: absolute;
  left: 170px;
  top: 0px;
  width: 50px;
}


/* Stijlen: Home */

#site #main {
  background: url(/interface/images/main_bg.gif) no-repeat left top;
  padding: 0px 30px;
  float: left;
  width: 930px;
}

#site.home #main {
  background: url(/interface/images/main_home_bg.gif) no-repeat left top;
}

#home_collectie {
  float: left;
  width: 561px;
  margin: 0px 24px 20px 0px;
}

#home_collectie .titel {
  margin: -7px 0px 7px 0px;
  position: relative;
}

#home_collectie .collectieblok {
  float: left;
  width: 169px;
  height: 150px;
  margin-right: 18px;
  position: relative;
}

#home_collectie .collectieblok .fietsPreview {
  position: absolute;
  left: 0px;
  top: 45px;
  z-index: 1;
}

#fiets1 img, #fiets2 img, #fiets3 img
{
  margin-left:10px;
}

#home_collectie .collectieblok #collectie1Navigatie, #home_collectie .collectieblok #collectie2Navigatie, #home_collectie .collectieblok #collectie3Navigatie
{
  position:relative;
  display:none;
  left: 40px;
  top: 80px;
  height:27px;
  width:92px;
  z-index: 3;
}

/* ** stijlen javascript slider. ** */
#home_collectie .collectieblok #collectie1Navigatie a, #home_collectie .collectieblok #collectie2Navigatie a, #home_collectie .collectieblok #collectie3Navigatie a
{
  height:14px;
  display:block;
}

#home_collectie .collectieblok #collectie1Navigatie img, #home_collectie .collectieblok #collectie2Navigatie img, #home_collectie .collectieblok #collectie3Navigatie img
{
  z-index:5;
}

#home_collectie .collectieblok:hover #collectie1Navigatie, #home_collectie .collectieblok:hover #collectie2Navigatie, #home_collectie .collectieblok:hover #collectie3Navigatie
{
  position:relative;
  display:block;
}

#home_collectie .collectieblok .collectietitel {
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: 2;
}

#home_rechts {
  float: left;
  width: 340px;
}


#welkom {
  margin-bottom: 20px;
}

#welkom p {
  color: #726801;
  margin: 0px;
  padding: 0px;
  font-size: 11px;
  line-height: 18px;
}

#welkom a {
  color: #726801;
}

#snelselectie {
  margin-bottom: 20px;
  position: relative;
}

#snelselectie select {
  position: absolute;
  left: 160px;
  top: 10px;
  font-size: 11px;
  width: 150px;
  color: #726801;
}

#snelselectie select .strong {
  background: #e4e1bf;
  color: #726801;
}


/* Stijlen: Vervolgpagina's */

#content {
  float: left;
  width: 560px;
  margin: 34px 140px 0px 35px;
  font-size: 12px;
  line-height: 18px;
  color: #6e6421;
  line-height:24px;
}

#content p, #rechts p {
  padding: 0px;
  margin: 0px 0px 20px 0px;
}

#content a {
  text-decoration: none;
  color: #ca2b2a;
}

#content a:hover {
  text-decoration: underline;
  color: #ca2b2a;
}

#content ul {
  margin: 0px 0px 20px 0px;
  padding: 0px;
}

#content li {
  margin: 0px 0px 5px 0px;
  padding: 0px 0px 0px 20px;
  list-style: none;
  background: url(/interface/images/bullet.gif) no-repeat left 5px;
}

#content .foto_links {
  float: left;
  clear: left;
  margin: 0px 10px 10px 0px;
}

#content .foto_rechts {
  float: right;
  clear: right;
  margin: 0px 0px 10px 10px;
}

#content .fotos_onder {
  margin: 0px -10px 20px 0px;
  float: left;
  clear: both;
}

#content .fotos_onder img {
  float: left;
  margin: 0px 10px 12px 0px;
}

.afbeelding_fiets
{
  float:right;
  margin-left:10px;
}

#rechts {
  float: left;
  width: 180px;
  font-size: 11px;
  line-height: 18px;
  color: #6e6421;
  _margin-left:-30px;
}


/* Stijlen: Overzicht */

#overzicht {
  margin-bottom: 10px;
  float: left;
  clear: both;
}

#overzicht .overzicht_item {
  float: left;
  width: 174px;
  height: 170px;
  overflow: hidden;
  margin: 0px 10px 10px 0px;
  font-size: 11px;
  line-height: 14px;
  color: #897e30;
  text-decoration: none;
}

#overzicht .overzicht_item:hover {
  text-decoration: none;
}

#overzicht .overzicht_item span {
  display: block;
}

#overzicht .overzicht_item .overzicht_titel {
  font-weight: bold;
}

#overzicht h3:hover {
  cursor: pointer;
}

/* Stijlen: Footer */

#footer {
  width: 100%;
  height: 17px;
  background: #afa754;
}

#footer_inner {
  width: 960px;
  margin: 0px auto;
  position: relative;
}

#copyright {
  color: #d8d4ab;
  font-size: 10px;
  padding-top: 2px;
}

#copyright a {
  color: #d8d4ab;
  text-decoration: none;
}

#copyright a:hover {
  color: #ffffff;
  text-decoration: underline;
}

#tsjil {
  position: absolute;
  right: 0px;
  top: 2px;
  display: block;
}

/* ----- Stijlen menu ----- */
* html #menu { /* IE6 hover fix */
  _behavior: url(/scriptlibrary/csshover.htc);
}

#menu ul
{
  /*padding-top:104px;*/
  top:104px;
}

#menu a
{
  padding-top:0px;
  top:104px;
}

/* *** Stijlen van ul en hover's *** */
#menu ul
{
  font-family:Arial;
  font-size:12px;
  position:absolute;
  list-style:none;
  padding-left:0px;
  margin-top:0px;
  margin-bottom:0px;
}

#menu ul a
{
  text-decoration:none;
  color:#726801;
}

#menu ul li
{
  padding-left:18px;
  padding-top:8px;
  line-height:15px;
  /* ** height is required for opacity in IE ** */
  height:15px;
  padding-bottom:8px;
  background-color:White;
  opacity:.85;
  filter: alpha(opacity=85);
  -moz-opacity: 0.85;
}

#menu .first
{
  height:12px;
  *+height:15px;
  line-height:0px;
  padding:0px;
}

#menu .last
{
  height:10px;
  *+height:15px;
  line-height:0px;
  padding:0px;
}

#menu ul li:hover, #menu ul li:hover a
{
  background-color:white;
  color:#d4302d;
  opacity:1;
  filter: alpha(opacity=100);
  -moz-opacity: 1.00;
}

#menu ul li.first:hover, #menu ul li.last:hover
{
  background-color:White;
  opacity:.85;
  filter: alpha(opacity=85);
  -moz-opacity: 0.85;
}

/* *** Positioneering van ul's *** */
#menu #img1.actief{  background-position: 0px -144px;}
#menu #img1:hover{  background-position: 0px -48px;}
#menu #img1.metSub:hover{  background-position: 0px -96px;}
#menu #img1
{
  position:absolute;
  left:173px;
  background-image: url("/interface/images/nav/btn1.png");
  display:block;
  height:48px;
  width:103px;
}

/* *** Positioneering van submenu's *** */
/* *** Percentages gebruiken voor ie7. *** */
#menu .casing2 .actief{  background-position: 0px -213px;}
#menu .casing2:hover #img2{  background-position: 0px -71px;}
#menu .casing2:hover #img2.metSub{  background-position: 0px -142px;}
#menu .casing2:hover .link2{  left:276px; *+left:23.85%;}
#menu #img2
{
  position:absolute;
  left:276px;
  background-image: url("/interface/images/nav/btn2.png");
  display:block;
  height:71px;
  width:138px;
}

#menu .link2
{
  top:175px;
  left:276px;
  width:138px;
  left:-9001px;
}

#menu .casing3 .actief{  background-position: 0px -222px;}
#menu .casing3:hover #img3{  background-position: 0px -74px;}
#menu .casing3:hover #img3.metSub{  background-position: 0px -148px;}
#menu .casing3:hover .link3{  left:414px; *+left:37.75%;}
#menu #img3
{
  position:absolute;
  left:414px;
  background-image: url("/interface/images/nav/btn3.png");
  display:block;
  height:74px;
  width:141px;
}

#menu .link3
{
  top:178px;
  left:414px; 
  width:141px;
  left:-9001px;
}

#menu .casing4 .actief{  background-position: 0px -216px;}
#menu .casing4:hover #img4{  background-position: 0px -72px;}
#menu .casing4:hover #img4.metSub{  background-position: 0px -144px;}
#menu .casing4:hover .link4{  left:555px; *+left:52%;}
#menu .casing4 #img4
{
  position:absolute;
  left:555px;
  background-image: url("/interface/images/nav/btn4.png");
  display:block;
  height:72px;
  width:127px;
}

#menu .link4
{
  top:176px;
  left:555px; 
  width:127px;
  left:-9001px;
}

#menu #img5.actief{  background-position: 0px -165px;}
#menu #img5:hover{  background-position: 0px -55px;}
#menu #img5.metSub:hover{  background-position: 0px -110px;}
#menu #img5
{
  position:absolute;
  left:682px;
  background-image: url("/interface/images/nav/btn5.png");
  display:block;
  height:55px;
  width:133px;
}

