body {
  background: #6f9b31 url(../img/body-bg.jpg) 50% 0 no-repeat;
  margin: 0;
  padding: 0;
}

body#inner {
  background: #6f9b31 url(../img/body-inner-bg.jpg) 50% 0 no-repeat;
  margin: 0;
  padding: 0;
}


body, td {
  font: 11px/14px normal Tahoma, Arial, Helvetica;
}          

h1, h2, h3, h4, h5 {
  padding: 0;
  margin: 0;
  font-family: Impact, Verdana, Tahoma;
  color: #5f1f03;   
}
h3 { font-size: 11px; }

a { color: #5f1f03; }
a:hover { color: #c16f0b; }

#container {
  width: 970px;
  height: 1000px;
  margin: 0 auto;
  padding: 0;
}



#header {
  float: left;
  width: 970px;
  height: 428px;
  overflow: hidden;
}
#header-inner {
  float: right;
  width: 654px;
  height: 278px;
  overflow: hidden;
}
#header-inner-overlay {
  float: right;
  position: absolute;
  z-index: 15;
  background: url(../img/header-inner-overlay.png) 0 0 no-repeat;
  width: 654px;
  height: 278px;
}
#header-inner img {
  padding: 18px 0 0 5px;
}

#floated {
  float: left;
  width: 265px;
  height: 140px;  
}
#inner #floated {
  float: left;
  width: 265px;
  height: 120px;  
}
#logo {
  display: block;
  position: absolute;
  z-index: 1;
  background: url(../img/logo.png) 0 0 no-repeat;
  width: 245px;
  height: 150px;
  margin: 1px 0 0 30px;
  text-indent: -9999px;
}

#left-column {
  float: left;
  width: 311px; 
}
#right-column {
  float: right;
  width: 654px;
  padding: 30px 0 0 0;
  overflow: hidden;
}

#menu {
  float: left;  
  width: 265px;
  height: 278px;
}

#menu-wrapper {
  width: 294px;
  padding: 0 0 0 4px;
  
}
#menu-inner {
  background: url(../img/menu-bg.png) 0 0 no-repeat;
  float: left;  
  width: 294px;
  padding: 20px 0 0 0;
  overflow: hidden;
}
#menu-bottom {
  background: url(../img/menu-bottom.png) 0 0 no-repeat;
  float: left;  
  width: 294px;
  height: 19px;
  overflow: hidden;
}
#navigation {
  clear: both;
  display: block;
  list-style: none;
  width: 240px;
  padding: 0 0 0 25px;
  margin: 0;
}

#navigation li {
  display: block;
  width: 240px;
  margin: 0 0 3px 0;
}

#navigation li a {
  display: block;
  background: url(../img/nav-bg.gif) 0 0 no-repeat;
  width: 240px;
  height: 17px;
  padding: 7px;
  font-size: 15px;
  line-height: 17px;
  font-family: Impact, Verdana, Tahoma;
  text-decoration: none;
  text-transform: uppercase;
  color: #eeebe1;
  position: relative;
}

#navigation li ul {
  display: block;
  list-style: none;
  width: 210px;
  margin: 0;
  padding: 5px 0 15px 30px;
}

#navigation li ul li {
  display: block;
  width: 210px;
  height: 18px;
  margin: 0;
}

#navigation li ul li a {
  display: block;
  background: none;
  width: 210px;
  height: 14px;
  padding: 2px 0;
  font-size: 12px;
  line-height: 14px;
  text-transform: none;
  position: relative;
}
#navigation li a:hover {
  color: #ffffff;
}




#floated-boy {
  float: left;
  width: 265px;
  height: 10px; 
}
#boy {
  display: block;
  position: absolute;
  z-index: 10;
  background: url(../img/jongen-overlay.png) 0 0 no-repeat;
  width: 242px;
  height: 314px;
  margin: -180px 0 0 210px;
  text-indent: -9999px;
}


#floated-polarbear {
  clear: both;
  float: left;
  width: 260px;
  height: 15px; 
}
#polarbear {
  display: block;
  position: absolute;
  z-index: 16;
  background: url(../img/ijsbeer-overlay.png) 0 0 no-repeat;
  width: 205px;
  height: 170px;
  margin: -121px 0 0 170px;
  text-indent: -9999px;
}
#anniversarysmall {
  display: block;
  position: absolute;
  z-index: 16;
  background: url(../img/5jaarsmall-overlay.png) 0 0 no-repeat;
  width: 205px;
  height: 170px;
  margin: -121px 0 0 170px;
  text-indent: -9999px;
}


#showcase {
  float: right; 
  width: 650px;
  height: 386px;
  padding: 42px 0 0 0;
  overflow: hidden;
}
#show-left {
  float: left;  
  width: 650px;
  height: 386px;
  overflow: hidden;
}
#show-right {
  float: right; 
  width: 285px;
  height: 371px;
  padding: 15px 30px 0 0;
  overflow: hidden;
}
#show-top {
  float: left;  
  width: 650px;
  height: 293px;
  overflow: hidden;
}

#video {
  float: left;
  width: 460px;
  height: 293px;
  margin: 0 0 0 8px;  
}
#video-overlay {
  position: absolute;
  z-index: 2;
  background: url(../img/video-overlay-wide.png) 0 0 no-repeat;
  width: 460px;
  height: 288px;  
}

#oneliner {
  float: left;
  width: 275px;
  height: 180px;  
  margin-left: 50px;
}
#showcase h1 {
  display: block;
  float: left;
  background: url(../img/h1_lekkerbeesten2.gif) 0 0 no-repeat;
  width: 275px;
  height: 79px;
  text-indent: -9999px;
  padding: 0;
  margin: 0;
}

#showcase ul {
  float: left;
  list-style: none;
  width: 201px;
  margin: 0;
  padding: 2px 0 0 120px;
  overflow: hidden;
}

#showcase li {
  display: block;
  background: url(../img/show-bg.gif) 0 0 no-repeat;
  width: 201px;
  height: 34px;
  margin: 0 0 3px 0;
}

#showcase li a {
  display: block;
  width: 149px;
  height: 20px;
  padding: 9px 7px 5px 45px;
  font-size: 15px;
  font-family: Impact, Verdana, Tahoma;
  font-weight: normal;
  text-decoration: none;
  text-transform: uppercase;
  color: #eeebe1;
}
#showcase li a.movie {
  background: url(../img/icon-movie.gif) 7px 2px no-repeat;
}
#showcase li a.photo {
  background: url(../img/icon-photo.gif) 7px 2px no-repeat;
}


#floated-monkey {
  float: left;
  width: 290px;
  height: 40px; 
}
#monkey {
  display: block;
  position: absolute;
  z-index: 12;
  background: url(../img/aap-overlay.png) 0 0 no-repeat;
  width: 304px;
  height: 258px;
  margin: -77px 0 0 -40px;
  text-indent: -9999px;
}
#floated-binoculairs {
  float: left;
  width: 20px;
  height: 20px; 
}
#binoculairs {
  display: block;
  position: absolute;
  z-index: 12;
  background: url(../img/binoculairs-overlay.png) 0 0 no-repeat;
  width: 256px;
  height: 247px;
  margin: -32px 0 0 -90px;
  text-indent: -9999px;
}
#floated-anniversary {
  float: left;
  width: 20px;
  height: 40px; 
}
#anniversary {
  background:transparent url(../img/5jaar-anniversary2.png) no-repeat scroll 0 0;
  display:block;
  height:258px;
  margin:20px 0 0 -55px;
  position:absolute;
  text-indent:-9999px;
  width:250px;
  z-index:12;
}


#content {
  float: left;
  padding: 0 0 0 10px;  
}

#content-wrapper {
  float: right;
  padding: 0 15px 0 0;
}
#content-inner {
  float: right;
  background: url(../img/content-bg.png) 0 0 no-repeat;
  width: 525px;
  min-height: 410px;
  padding: 50px 50px 50px 60px;
  color: #5f1f03;
  font: 11px/14px Tahoma, Arial, Helvetica;
}
#content-inner iframe {
  display: block;
  position: relative;
}
#content-inner form {
  display: block;
  position: relative;
}
#content-inner h1 {
  font-size: 24px;  
  line-height: 24px;
}
#content-inner a {
  color: #5f1f03;
  position: relative;
}
#content-inner a:hover {
  color: #c16f0b;
  position: relative;
}

#left-column .box {
  margin: 0 0 8px 0;
}




ul#beestenboel {
  position: relative;
  list-style-type: none;
  display: block;
  float: left;
  margin: 30px 0 0 10px;
  padding: 0;
}
ul#beestenboel li {
  position: relative;
  display: block;
  float: left;
  height: 200px;
  width: 150px;
  margin: 0 20px 20px 0;
  overflow: hidden;
}
.beest-info {
  position: relative;
  display: block;
  float: left;
  padding: 0;
  margin: 0;
}
.beest-info h2 {
  width: 150px;
  font-size: 15px;
  line-height: 15px;
}

.beest {
  position: relative;
  display: block;
  float: left;
  width: 134px;
  height: 149px;
  padding: 0;
  margin: 0;
}
.beest-overlay {
  position: absolute;
  width: 134px;
  height: 149px;
  background:url(../img/beest-box.png) no-repeat 0 0;
  cursor: pointer;
  z-index: 17;
}
.beest a {
  position: relative;
}
.beest img {
  padding: 14px 0 0 9px;
  border: 0;
}







.box {
  float: left;
  background: url(../img/box-bg.png) 0 0 no-repeat;
  width: 271px; 
  height: 207px;
  margin: 0 8px 8px 0;
  padding: 20px;
  overflow: hidden;
}
.boxb {
  float: left;
  background: url(../img/boxb-bg.png) 0 0 no-repeat;
  width: 265px; 
  height: 181px;
  margin: 0 12px 8px 0;
  padding: 23px;
}

.boxd {
  float: left;
  background: url(../img/boxd-bg.png) 0 0 no-repeat;
  width: 637px; 
  height: 227px;
}

.box h2,
.boxb h2,
.boxd h2 {
  font-size: 18px;
  line-height: 20px;
  color: #5f1f03; 
  text-transform: uppercase;
  font-weight: normal;
}
.box a,
.boxb a,
.boxd a { 
  position: relative;
}

.boxd-left {
  float: left;
  width: 290px;
  height: 170px;
  padding: 30px 20px 10px 20px;
}
.boxd-right {
  float: right;
  width: 260px;
  height: 170px;
  padding: 30px 20px 10px 20px;
}

.banner-wrap {
  width: 269px;
  height: 141px;  
}
.banner-wrap img {
  padding: 13px 8px;
}
.banner-overlay {
  position: absolute;
  z-index: 3;
  background: url(../img/banner-overlay.png) 0 0 no-repeat;
  width: 269px;
  height: 141px;  
}
.box-text {
  padding: 5px 10px;
  font-weight: bold;
  color: #5f1f03;
}
.box-text p {
  padding: 0;
  margin: 0;
}


.boxd-right .box-text {
  height: 70px;
  width: 170px;
  font-size: 12px;
  line-height: 15px;
  font-family: Impact, Verdana, Tahoma;
  font-weight: normal;    
}

.bannerb-wrap {
  width: 262px;
  height: 167px;  
}
.bannerb-wrap img {
  padding: 5px 10px;
}
.bannerb-overlay {
  position: absolute;
  z-index: 3;
  background: url(../img/bannerb-overlay.png) 0 0 no-repeat;
  width: 262px;
  height: 167px;  
}

#newslist {
  list-style: none;
  padding: 0;
  margin: 0;
}


#floated-girl {
  width: 260px;
  height: 10px; 
}
#girl {
  display: block;
  position: absolute;
  z-index: 13;
  background: url(../img/meisje-overlay.png) 0 0 no-repeat;
  width: 177px;
  height: 206px;
  margin: -180px 0 0 120px;
  text-indent: -9999px;
}

#footer-inner {
  float: right;
  background: url(../img/footer-bg.png) 0 0 no-repeat;
  width: 555px;
  height: 81px;
  padding: 10px 30px 0 50px;
  display: inline;
}

#footer ul {
  list-style: none;
  margin: 0;
  padding: 18px 0;  
}
#footer-inner ul {
  float: left;
  list-style: none;
  margin: 0;
  padding: 18px 0;  
}
#footer-inner li,
#footer li {
  float: left;
  margin: 0 0 0 3px;
  font-size: 14px;
  line-height: 15px;
  font-family: Impact, Verdana, Tahoma;
  font-weight: normal;
  text-transform: uppercase;
  color: #5f1f03;
}
#footer-inner a,
#footer a {
  color: #5f1f03;
  text-decoration: none;
  position: relative;
}
#footer span {
  display: block;
  margin: 15px 0 0 0;
  text-align: right;
  font-size: 12px;
  line-height: 12px;
  font-family: Impact, Verdana, Tahoma;
  font-weight: normal;
  text-transform: uppercase;  
  color: #753e21; 
}
#footer span a {
  color: #753e21; 
}
#footer-inner span {
  display: block;
  margin: 15px 0 0 0;
  text-align: right;
  font-size: 10px;
  line-height: 15px;
  font-family: Impact, Verdana, Tahoma;
  font-weight: normal;
  text-transform: uppercase;  
  color: #5f1f03; 
}

#address {
  float: left; 
}
#address span {
  text-align:left;
  font-size: 14px;
  line-height: 14px;
}

#copyright {
  float: right; 
}


/*---- sIFR ---*/
.sIFR-flash {
  visibility: visible !important;
  margin: 0;
  padding: 0;
}

.sIFR-unloading .sIFR-flash {
  visibility: hidden !important;
}

.sIFR-replaced, .sIFR-ignore {
  visibility: visible !important;
}

.sIFR-alternate {
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 0;
  display: block;
  overflow: hidden;
}

.sIFR-replaced div.sIFR-fixfocus {
  margin: 0pt; 
  padding: 0pt; 
  overflow: auto; 
  letter-spacing: 0px; 
  float: none;
}

.sIFR-dummy { 
  width: 0px;
  height: 0px;
  margin-left: 42px;
  z-index: 0;
}

.sIFR-active .box h2 {
  visibility: hidden;
}
.sIFR-active #content-inner h1 {
  visibility: hidden;
  line-height: 24px;
}
.sIFR-active .boxd-left h2 {
  visibility: hidden;
  font-size: 13px;
  line-height: 13px;
}


/**
 * ALBUMS
 */
.album {
  display: block;
  float: left;
  
  height: 100px; 
  margin: 0 0 15px 0;
  width: 100%;
}

.albumthumb {
  display: block;
  float: left;
  padding: 0 8px 16px 0;
}
.albumthumb a {
  display: block;
  width: 120px;
  height: 90px;
  position: relative;
} 
.albumthumb img {
  float: left;
  border: 3px solid #fff;
}

.albumdesc {
  float: left;
  padding: 0 0 0 20px;
}

/*
#lightbox{
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 100;
  text-align: center;
  line-height: 0;
  }

#lightbox a img{ border: none; }
*/

#outerImageContainer{
  position: relative;
  background-color: #fff;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  }

#imageContainer{
  padding: 10px;
  }

#loading{
  position: absolute;
  top: 40%;
  left: 0%;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
  }
#hoverNav{
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
  }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
  width: 49%;
  height: 100%;
  background: transparent url(../img/blank.gif) no-repeat; /* Trick IE into showing hover */
  display: block;
  }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../img/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../img/nextlabel.gif) right 15% no-repeat; }


#imageDataContainer{
  font: 10px Verdana, Helvetica, sans-serif;
  background-color: #fff;
  margin: 0 auto;
  line-height: 1.4em;
  overflow: auto;
  width: 100% 
  }

#imageData{ padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }  
#imageData #caption{ font-weight: bold; }
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;  }     
#imageData #bottomNavClose{ width: 85px; float: right;  padding-bottom: 0.7em;  } 
    
#overlay{
  position: absolute;
  top: 0;
  left: 0;
  z-index: 90;
  width: 100%;
  height: 500px;
  background-color: #000;
  }
  
  

/** validated inputs **/ 
/*
input.required, textarea.required {
  border: 1px solid #00A8E6;
}
input.validation-failed, textarea.validation-failed {
  border: 1px solid #FF3300;
  color : #FF3300;
}
input.validation-passed, textarea.validation-passed {
  border: 1px solid #00CC00;
  color : #000;
}
*/

input.validation-failed, textarea.validation-failed {
  float: left;
  margin: 0 5px 0 0;
  background: #ffe5e2;
}

.validation-advice {
  float: left;
  margin: 0 5px 0 0;
  padding: 4px 5px;
  background-color: #72a1b8;
  color : #FFF;
  font-weight: bold;
}

.custom-advice {
  margin: 5px 0;
  padding: 5px;
  background-color: #72a1b8;
  color : #FFF;
  font-weight: bold;
}





/**
 * jQuery lightBox plugin
 * This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
 * and adapted to me for use like a plugin from jQuery.
 * @name jquery-lightbox-0.5.css
 * @author Leandro Vieira Pinho - http://leandrovieira.com
 * @version 0.5
 * @date April 11, 2008
 * @category jQuery plugin
 * @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
 * @license CC Attribution-No Derivative Works 2.5 Brazil - http://creativecommons.org/licenses/by-nd/2.5/br/deed.en_US
 * @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
 */
#jquery-overlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 90;
  width: 100%;
  height: 500px;
}
#jquery-lightbox {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100;
  text-align: center;
  line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
  position: relative;
  background-color: #fff;
  width: 250px;
  height: 250px;
  margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
  position: absolute;
  top: 40%;
  left: 0%;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
}
#lightbox-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
  width: 49%;
  height: 100%;
  zoom: 1;
  display: block;
}
#lightbox-nav-btnPrev { 
  left: 0; 
  float: left;
}
#lightbox-nav-btnNext { 
  right: 0; 
  float: right;
}
#lightbox-container-image-data-box {
  font: 10px Verdana, Helvetica, sans-serif;
  background-color: #fff;
  margin: 0 auto;
  line-height: 1.4em;
  overflow: auto;
  width: 100%;
  padding: 0 10px 0;
}
#lightbox-container-image-data {
  padding: 0 10px; 
  color: #666; 
}
#lightbox-container-image-data #lightbox-image-details { 
  width: 70%; 
  float: left; 
  text-align: left; 
}  
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {
  display: block; 
  clear: left; 
  padding-bottom: 1.0em;  
}      
#lightbox-secNav-btnClose {
  width: 66px; 
  float: right;
  padding-bottom: 0.7em;  
}
.onderdeelvan {
  width:40%;
  margin 0 30% 0 30%;
 }
.onderdeelvan  a{
  background:url(../img/footerdierenrijk.png) no-repeat 0 0;
  width:390px;
  height:29px;
  float:right;
  overflow:hidden;
 }

