html { margin: 0; padding: 0; background: #FECB4E url(../img/html_bg.gif) scroll repeat-x 0px 80px; }
body {
    position: relative; text-align: center; font-family: "Century Gothic", Arial, sans-serif; font-size: 9pt;
    background: white url(../img/achtergrond_verloop.png) scroll repeat-x top left;
    margin: 0; padding: 0; 
}

#extra_bg {
    position: absolute; bottom: 0; left: 0; width: 100%; height: 200px;
    background: transparent url(../img/achtergrond_huisjes.gif) scroll no-repeat bottom center;
}

a { color: #851718; }

#content { margin: 16px auto 0 auto ; width: 920px; text-align: left; }
#extra_marge_onder { position: relative; height: 36px; }
#menu_inner { padding: 0px 15px 0 23px; }
#content_inner { padding-right: 23px; }
#media_inner { padding: 0 19px 0 22px; }

h1 { font-size: 13pt; font-weight: 900; color: #154d06; margin: 0px 0px 12px 0px; padding: 0; } /* Hoofdtitel van de pagina */
h2, h2 a { text-decoration: none; font-size: 13pt; font-weight: 900; color: #154d06; margin: 0px 0px 12px 0px; padding: 0; } /* Kopjes van extra items op de pagina */
h3 { font-size: 10pt; font-weight: bold;              margin: 0px 0px 4px 0px;  padding: 0; } /* Overige kopjes op de pagina */
h4 { font-size:  9pt; font-weight: bold;              margin: 0px 0px 2px 0px;  padding: 0; } /* Eventuele subkopjes */

/** HET LOGO **/
#slogan { position: absolute; z-index: 20; /* left: 37px; top: 5px; */ right: 20px; top: 26px; }
#logo { position: absolute; z-index: 20; left: 540px; top: -12px; }

/** OPMAAK VAN HET MENU **/
ul#menu, ul.submenu { list-style-type: none; margin: 0; padding: 0; }
ul#menu    { margin-left: 20px; margin-bottom: 20px; margin-top: 0;  }
ul#menu li { list-style-type: none; margin: 0; padding: 0; }

/** INLOGFORMULIER **/
form#inloggen { margin: 0; padding: 0; position: absolute; z-index: 20; right: 30px; top: 0px; text-align: right; font-size: 9px;}
form#inloggen input { font-size: 9px; line-height: 14px;  }
form#inloggen input.tekst { width: 70px; border: 1px solid #ABA195; background: url(../img/bg_input_login.gif) white scroll repeat-x bottom left; height: 15px; padding: 0px 3px; }
form#inloggen input.knop  { width: 55px; border-width: 0px; background: url(../img/bg_login.gif) transparent scroll no-repeat 50% 1px; height: 20px;}
form#inloggen a#wachtwoord_vergeten, form#inloggen a#account_details { display: block; margin: 4px; color: #aca499; text-decoration: none;}

/** Rode en groene balk **/
.foto_groot { float: left; margin-right: 19px; border: 1px solid white; background-color: black; padding: 0; }
#hok_rood, #hok_groen { color: white; }
#hok_rood h3, #hok_rood h3 a, #hok_groen h3, #hok_groen h3 a { color: #edb52c; font-size: 11pt; text-decoration: none;  }

div#fotos_nav { position: absolute; bottom: 14px; right: 20px; border-top: 1px solid #edb52c; width: 260px; margin-top: 8px; }
ul#fotos_klein {  list-style-type: none; margin: 8px 0 0 0px; padding: 0 0 0 24px; text-align: center; }
ul#fotos_klein li { position: relative; float: left; width: 56px; margin: 0px 6px; height: 38px; }
ul#fotos_klein a img { opacity:30; filter:alpha(opacity=30); border: 1px solid transparent;  }
ul#fotos_klein li.selected img { opacity: 100; filter: alpha(opacity=100); border: 1px solid yellow;}

ul#fotos_navigatie    { list-style-type: none; margin: 0;  padding: 0px 0 0 24px; text-align: center; }
ul#fotos_navigatie li { position: relative; float: left; width: 56px; margin: 0px 6px; font-size: 9px; color: #edb52c; }
ul#fotos_navigatie li.vorige { text-align: left; }
ul#fotos_navigatie li.volgende { text-align: right; }
ul#fotos_navigatie a { color: #edb52c; text-decoration: none; }

img.advertentie { border-width: 0; }

/** Inhoud **/
#boven_inhoud { clear: both; margin-top: 0; }
#main_inhoud { clear: both; margin-top: 6px; }

/** Algemene lijsten **/
ul.lijst { list-style-type: none; margin: 0; padding: 0; }
ul.lijst li { list-style-type: none; margin: 0px 0; padding: 0; }
ul.lijst li { display: block; clear: both; margin: 10px 0; }
ul.lijst .onderschrift { font-size: 8pt; color: #154d06;  }
ul.lijst h3 a { text-decoration: none; }

/** Media lijst **/
ul.media_lijst h3, ul.media_lijst h3 a { color: #851718; }
ul.media_lijst div.foto_met_onderschrift { float: left; margin: 2px 5px 2px 0; }
ul.media_lijst img { border: 1px solid black; padding: 1px;}

/** Nieuws lijst **/
ul.nieuws_lijst h3 a { color: #851718; }
ul.nieuws_lijst img { margin: 2px 4px; }

/** Playground lijst **/
ul.playground_lijst h3 a{ color: #086e3c; }

/** Submenu lijst **/
ul.submenu_lijst li.only_title { margin: 2px 0; }
ul.submenu_lijst h3 a { color: #851718; }

/** Submenu lijst **/
ul.kleine_nieuws_lijst { margin-top: 12px; }
ul.kleine_nieuws_lijst li { margin: 2px 0; font-size: 9pt; }
ul.kleine_nieuws_lijst li span.datum { font-size: 8pt; float: left; position: relative; width: 70px; height: 21px; }
ul.kleine_nieuws_lijst li a { color: black; text-decoration: none; }

/** Reactie lijst **/
h2.reactie_titel { margin: 12px 0 4px 0; }
ul#reacties { list-style-type: none; margin: 0; padding: 0; border-top: 1px solid black; }
ul#reacties li { margin: 0; border-bottom: 1px dotted black; padding: 4px 0; }
ul#reacties p.meta { font-size: 8pt; color: #154d06; text-align: right; margin: 2px 0 0 0; }

form#reactie_formulier { margin-top: 6px; }
form#reactie_formulier .tekst { width: 100%; margin-bottom: 3px; font-size: 9pt; font-family: "Century Gothic", Arial, sans-serif; }
form#reactie_formulier textarea { height: 120px; }

ul#sitemap, ul#sitemap ul { list-style-type: none; margin-left: 0; padding-left: 0; }
ul#sitemap li { margin-left: 0; padding-left: 0; margin: 10px 0; }
ul#sitemap ul li { margin: 1px 0 1px 15px; }

/** Account formulier **/
#account_form label{ float: left; display: block; position: relative; width: 110px;}
#account_form input{ margin: 1px 0; }

#loginform label{ float: left; display: block; position: relative; width: 110px;}

/** FOOTER **/
#footer { text-align: right; color: white; padding: 0px 10px; font-size: 8pt; margin-top: -8px;}
#footer a { color: white; text-decoration: none; }
#footer .copyright { float: left; width: 360px; text-align: left; }
#footer #extra_links { float: left; }
