body {
  background:url(images/achtergrondpatroon2.jpg) repeat 50% 4%;
  background-attachment:fixed;
  margin-top:0;
  margin-left:0;
  z-index: 0;

}
  /*Deze zorgt er voor dat aan de linkerkant een vullend patroon is dat met de pagina meerekt,
   deze ligt een niveau lager dan de volgende selector waardoor deze als achtergrondpatroon fungeert*/
   
#linksomhulsel{
  position: absolute;
  background:url(images/achtergrondpatroon2.jpg) repeat 50% 4%;
  width:800px;
  height:100%;
  left:50%;
  margin-left: -1254px;
  margin-top:0px;
  z-index:1;

}

  /*Deze selector lig t/m 708px over de achtergrond heen en daarna neemt het achtergrondpatroon het over,
  hoever de pagina ook maar omlaag oprekt*/
  
#links{
  position: absolute;
  background:url(images/achtergrondpatroon1.jpg) repeat-x;
  width:800px;
  height:708px;
  left:50%;
  margin-left: -1254px;
  z-index:20;
}

#rechts{
  position: absolute;
  background:url(images/achtergrondpatroon3.jpg) repeat-x;
  background-attachment:scroll;
  width:auto;
  height:708px;
  left:50%;
  margin-left:414px;
  right:0;
  margin-right:0px;
  z-index:30;
}
      /*deze selector dient enkel en alleen om de uiterste grenzen van het scherm aan te geven,
       zodat mijn oprekkend vlak niet buiten het scherm geraakt en scrollbalken gaat veroorzaken. 100% is dan aanvullen tot de 100% van de schermbreedte.*/
#rechtsomhulsel{
  position: absolute;
  width:100%;
  height:100%
  margin-top:0px;
  z-index:29;
}

#container {
  position:absolute;
  background:url(images/benedenachtergrond.jpg) repeat 50% 4%;
  width:868px;
  height:100%;
  left: 50%;
  margin-left:-454px;
  z-index: 1;
}

#boven{
  position: absolute;
  background: url(images/bovenkant.jpg) no-repeat;
  width: 868px;
  height:79px;
}

#tussenvlakprijzen {
  position:absolute;
  background:url(images/tussenvlakprijzen.jpg) no-repeat;
  width:289px;
  height:44px;
  margin-top:79px;
  margin-left:0px;
  z-index: 2;
}

#prijzen {
  position:absolute;
  background:url(images/prijzen.jpg) no-repeat;
  width:289px;
  height:272px;
  margin-top:123px;
  margin-left:0px;
  z-index: 3;
}

#pietbeneden {
  position:absolute;
  background:url(images/pietbeneden.jpg) no-repeat;
  width:289px;
  height:180px;
  margin-top:395px;
  margin-left:0px;
  z-index: 4;
}

#linksbeneden {
  position:absolute;
  background:url(images/benedenlinks.jpg) no-repeat;
  width:289px;
  height:133px;
  margin-top:575px;
  margin-left:0px;
  z-index: 5;
}

#inhoud {
  position:absolute;
  background:url(images/grootvlak.jpg) no-repeat;
  width:579px;
  height:452px;
  margin-top:123px;
  margin-left:289px;
  z-index: 6;
}

#ondermijter {
  position:absolute;
  background:url(images/ondermijter.jpg) no-repeat;
  width:195px;
  height:44px;
  margin-top:79px;
  margin-left:673px;
  z-index: 7;
}

#beneden {
  position:absolute;
  background:url(images/benedenchocolade.jpg) no-repeat;
  width:579px;
  height:133px;
  margin-top:575px;
  margin-left:289px;
  z-index: 8;
}


/*hier komt de stijl van de navigatie*/

#navigatie {
  position: absolute;
  z-index:9;
  left:249px;
}
#navigatie ul {
  list-style-type:none;
   display:block;
   margin-top:79px;

}
#navigatie li {
  display:inline;
 }
 
#navigatie li span{
  display:none;

}

.homebutton a{
  background: url(images/buttons/home-a.jpg) no-repeat;
  width:85px;
  height:44px;
  display:block;
  float:left;
  list-style-type:none;

}

.homebutton a:hover{
  background: url(images/buttons/home-b.jpg) no-repeat;
  width:85px;
  height:44px;
  display:block;
  float:left;
  list-style-type:none;

}

.reserverenbutton a{
  background: url(images/buttons/reserveren-a.jpg) no-repeat;
  width:120px;
  height:44px;
  display:block;
  float:left;
  list-style-type:none;

}

.reserverenbutton a:hover{
  background: url(images/buttons/reserveren-b.jpg) no-repeat;
  width:120px;
  height:44px;
  display:block;
  float:left;
  list-style-type:none;

}

.contactbutton a{
  background: url(images/buttons/contact-a.jpg) no-repeat;
  width:93px;
  height:44px;
  display:block;
  float:left;
  list-style-type:none;

}

.contactbutton a:hover{
  background: url(images/buttons/contact-b.jpg) no-repeat;
  width:93px;
  height:44px;
  display:block;
  float:left;
  list-style-type:none;

}

.overbutton a{
  background: url(images/buttons/over-a.jpg) no-repeat;
  width:86px;
  height:44px;
  display:block;
  float:left;
  list-style-type:none;

}

.overbutton a:hover{
  background: url(images/buttons/over-b.jpg) no-repeat;
  width:86px;
  height:44px;
  display:block;
  float:left;
  list-style-type:none;

}
#tekstinhoud {
  position:absolute;
  width:500px;
  height:300px;
  font-family: tahoma;
  font-size: 11px;
  color:#ffffff;
  margin-top:175px;
  left:325px;
  z-index: 26;
  letter-spacing:1px;
  word-spacing: 3px;
  line-height: 20px;
}

#tekstinhoud a:link {
  color:#af0606;
  text-decoration:underline;
}
#tekstinhoud a:visited {
  color:#af0606;
  text-decoration:underline;
}
#tekstinhoud a:hover {
  color:#ffffff;
  text-decoration:none;
}

#opmerking {
  position:absolute;
  width:500px;
  height:30px;
  font-family: tahoma;
  font-size: 9px;
  color:#ffffff;
  margin-top:470px;
  left:325px;
  z-index: 27;
  letter-spacing:0px;
  word-spacing: 0px;
  font-weight: bold;
}

.informatie {
  position:absolute;
  background: url(images/kopjes/informatie.jpg) no-repeat;
  width:95px;
  height:30px;
  margin-top:150px;
  left:319px;
  z-index: 28;
}

.informatie span{
  display:none;
}

.over {
  position:absolute;
  background: url(images/kopjes/over.jpg) no-repeat;
  width:95px;
  height:30px;
  margin-top:150px;
  left:317px;
  z-index: 28;
}

.over span{
  display:none;
}

.reserveren{
  position:absolute;
  background: url(images/kopjes/reserveren.jpg) no-repeat;
  width:95px;
  height:30px;
  margin-top:150px;
  left:317px;
  z-index: 28;
}

.reserveren span{
  display:none;
}

.contact{
  position:absolute;
  background: url(images/kopjes/contact.jpg) no-repeat;
  width:95px;
  height:30px;
  margin-top:150px;
  left:317px;
  z-index: 28;
}

.contact span{
  display:none;
}

#tekstinhoud table tr td input{
  background:none;
  border-color:#ffffff;
  border-width:1px;
  border-style:solid;
  font-family: tahoma;
  font-size:11px;
  color: #000000;
}

#tekstinhoud table tr td textarea{
  background:none;
  border-color:#ffffff;
  border-width:1px;
  border-style:solid;
  font-family: tahoma;
  font-size:11px;
  color: #000000;
}

#tekstinhoud table tr td {
  background:none;
  font-family: tahoma;
  font-size:11px;
  color: #000000;
}

#tekstinhoud p {
  margin-top:1px;
}

.class {
  font-family:tahoma;
  font-size:9px;
  color:#000000;
}
