/*-------------------------------------------------------------------

Stylesheet: Niels Scheuneman, www.nielsscheuneman.nl
Versie: 1.0
Auteur: S. de Goede
Datum: 30 December 2006

-------------------------------------------------------------------*/

/* =Algemeen
-------------------------------------------------------------------*/

* {
  margin: 0px;
  padding: 0px;
  }

h1, h2, h3, h4, h5, h6, p, pre, blockquote, form, fieldset, table, ul {
  margin: 1em 0;
  }

body {
  background-color: #000;
  color: #ccc;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 62.5%;
  line-height: 1.6;
  min-width: 760px;
  text-align: center;
  }

.clear {
  clear: both;
  }

hr.clear {
  clear: both;
  border: 1px solid #181818;
  height: 1px;
  }

fieldset {
  border: 1px solid transparent;
}

table {
  border-spacing: 0;
  border-collapse: collapse;
  }

td {
  text-align: left;
  font-weight: normal;
  }

/* =Type
-------------------------------------------------------------------*/

p {
  font-size: 1.1em;
  margin: 1em 0 2em 0;
  }

h1, h2, h3 {
  font: bold 1.2em "Trebuchet MS",Arial,Verdana,Sans-Serif;
  color: #cf0008;
  letter-spacing: 3px;
  text-transform: uppercase;
  }

h4 {
  font-size: 1.1em;
  font-weight: bold;
  }

/* =Header
-------------------------------------------------------------------*/

#header {
  background: #000 url(img/header_bg.gif) repeat-x 0 0;
  height: 161px;
  }

#header h1 {
  background: transparent url(img/header.gif) repeat-x 0 0;
  margin: 0 auto;
  height: 98px;
  width: 270px;
  display: block;
  text-indent: -9999px;
  overflow: hidden;
  }

/* =Wrapper
-------------------------------------------------------------------*/

#wrapper {
  background-color: #000;
  text-align: left;
  margin: 0 auto 36px auto;
  width: 760px;
  clear: left;
  }

/* =Nav
-------------------------------------------------------------------*/

#nav {
  width: 760px;
  height: 63px;
  margin: 0 auto;
  _margin: 0;
  list-style: none;
  }

#nav li {
  margin-top: 1px;
  float: left;
  height: 63px;
  }

#home #nav li.nav_home, #biografie #nav li.nav_biografie, #nieuws #nav li.nav_nieuws, #foto #nav li.nav_foto, #palmares #nav li.nav_palmares, #gastenboek #nav li.nav_gastenboek, #links #nav li.nav_links, #contact #nav li.nav_contact {
  background: transparent url(img/arrow.gif) no-repeat 50% 100%;
  }

#nav li a{
  display: block;
  height: 49px;
  overflow: hidden;
  background-repeat: no-repeat;
  background-position: 0 0;
  background-color: transparent;
  outline: none;
  text-indent: -9999px;
  }

#nav li.nav_home a { width: 72px; background-image: url(img/nav_home.gif); }
#nav li.nav_biografie a { width: 109px; background-image: url(img/nav_biografie.gif); }
#nav li.nav_nieuws a { width: 88px; background-image: url(img/nav_nieuws.gif); }
#nav li.nav_foto a { width: 82px; background-image: url(img/nav_foto.gif); }
#nav li.nav_palmares a { width: 107px; background-image: url(img/nav_palmares.gif); }
#nav li.nav_gastenboek a { width: 129px; background-image: url(img/nav_gastenboek.gif); }
#nav li.nav_links a { width: 72px; background-image: url(img/nav_links.gif); }
#nav li.nav_contact a { width: 99px; background-image: url(img/nav_contact.gif); }

#nav li a:hover, #nav li a:active, #nav li a:focus{
  background-position: 0 100%;
  }

#home #nav li.nav_home a, #biografie #nav li.nav_biografie a, #nieuws #nav li.nav_nieuws a, #foto #nav li.nav_foto a, #palmares #nav li.nav_palmares a, #gastenboek #nav li.nav_gastenboek a, #links #nav li.nav_links a, #contact #nav li.nav_contact a {
  background-position: 0 100%;
  }

/* =Content
-------------------------------------------------------------------*/

#content_wrapper {
  margin-top: 16px;
  padding: 20px 28px 0 26px;
  background: #181818 url(img/content_bg1.jpg) no-repeat 0 0;

  }

#content {
  float: left;
  display: inline;
  margin: 0 0 6px 8px;
  width: 482px;
  padding-bottom: 16px;
  background: transparent url(img/content_bg2.jpg) no-repeat 0 100%;
  }

#content h2 {
  color: #fff;
  display: block;
  overflow: hidden;
  height: 42px;
  border-bottom: 1px solid #333;
  position: relative;
  margin: 0 0 16px 0;
  }

#content h2 span {
  background-color: transparent;
  background-position: 0 0;
  background-repeat: no-repeat;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  }

#home h2 span.home { background-image: url(img/content_h2_home.gif); }
#biografie h2 span.biografie { background-image: url(img/content_h2_biografie.gif); }
#nieuws h2 span.nieuws { background-image: url(img/content_h2_nieuws.gif); }
#foto h2 span.foto { background-image: url(img/content_h2_foto.gif); }
#palmares h2 span.palmares { background-image: url(img/content_h2_palmares.gif); }
#gastenboek h2 span.gastenboek { background-image: url(img/content_h2_gastenboek.gif); }
#links h2 span.links { background-image: url(img/content_h2_links.gif); }
#contact h2 span.contact { background-image: url(img/content_h2_contact.gif); }

#content a:link, #content a:visited {
  padding-bottom: 2px;
  text-decoration: none;
  background: transparent url(img/a_link.gif) repeat-x 0 100%;
  color: #fff;
  }

#content a:visited {
  color: #999;
  background-image: url(img/a_visited.gif);
  }

#content a:hover, #content a:active, #content a:focus {
  background-image: url(img/a_hover.gif);
  color: #cf0008;
  }

#content img {
  display: block;
  margin: 20px auto;
  border: 4px solid #999;
  }

#content a:hover img, #content a:active img, #content a:focus img {
  border-color: #cf0008;
  }

#content ul {
  list-style: none;
  margin: 10px 0 20px 0;
  font-size: 1.1em;
  }

#content li {
  padding-left: 16px;
  margin: 2px 0;
  background: transparent url(img/li_dot.gif) no-repeat 0 50%;
  }

/* =Sidebar
-------------------------------------------------------------------*/

#sidebar {
  float: right;
  display: inline;
  margin: 16px 10px 0 0;
  width: 218px;
  }

#sidebar img {
  margin-bottom: 14px;
  display: block;
  }

/* =Footer
-------------------------------------------------------------------*/

#footer {
  background: #000 url(img/footer_bg.gif) repeat-x 0 0;
  height: 85px;
  }

#footer  p {
  background: transparent url(img/footer.gif) no-repeat 0 1px;
  margin: 0 auto;
  width: 123px;
  height: 80px;
  }

/* =Nieuws
-------------------------------------------------------------------*/

#newslist {
  list-style: none;
  margin: 10px 0 20px 0;
  font-size: 1.1em;
  }

#newslist a:link, #newslist a:visited {
  padding-bottom: 3px;
  border: none;
  background: #181818 url(img/a_visited.gif) repeat-x 0 100%;
  }

#newslist a:visited {
  color: #999;
  background: #181818 url(img/a_visited.gif) repeat-x 0 100%;
  }

#newslist a:hover, #newslist a:active, #newslist a:focus {
  text-decoration: none;
  background: #181818 url(img/a_hover.gif) repeat-x 0 100%;
  color: #cf0008;
  }

#newslist li {
  margin: 4px 0;
  clear: both;
  padding-left: 16px;
  background: transparent url(img/li_dot.gif) no-repeat 0 50%;
  }

#newslist a span {
  float: right;
  }

/* =Foto's
-------------------------------------------------------------------*/

#foto #content_wrapper div {
  width: 198px;
  float: left;
  height: 148px;
  margin: 14px 8px;
  display: inline;
  background: #181818 url(img/foto_bg.jpg) no-repeat 50% 50%;
  }

#foto #content p , #foto #content h3 {
  text-align: center;
  }

#foto #content img {
  margin: 10px auto 6px auto;
  }

/* =Gastenboek
-------------------------------------------------------------------*/

#gastenboek div#content_wrapper div {
  border-bottom: 1px solid #333;
  margin-bottom: 1.8em;
  position: relative;
  }

#gastenboek p.date {
  margin: -0.4em 0;
  color: #666;
  }

#gastenboek span.email {
  position: absolute;
  right: 0;
  _right: 28px;
  top: 0;
  }

#gastenboek form {
  margin-top: 26px;
  }

#gastenboek form p {
  margin: 1em 0;
  }
#gastenboek label {
  display: block;
  width: 96px;
  float: left;
  text-align: right;
  margin-right: 10px;
  }

#gastenboek input, #gastenboek textarea {
  background-color: #000;
  border: 1px solid #999;
  color: #ccc;
  width: 280px;
  font: 1em/1.6 Verdana, Arial, Helvetica, sans-serif;
  padding: 3px;
  }

#gastenboek input#controle {
  width: 3.4em;
  }

#gastenboek input#submit {
  background-color: #505050;
  color: #fff;
  font-weight: bold;
  width: 10em;
  margin-left: 106px;
  margin-bottom: 2em;
  }

/* =Links
-------------------------------------------------------------------*/

#links #content a:link, #links #content a:visited {
  padding-bottom: 3px;
  background: #181818 url(img/a_visited.gif) repeat-x 0 100%;
  }

#links #content a:visited {
  background-image: url(img/a_visited.gif);
  }

#links #content a:hover, #links #content a:active, #links #content a:focus {
  background-image: url(img/a_hover.gif);
  }

#links #content li {
  margin: 4px 0;
  }