/*-----------------------------------------------------------------------------
Website: Kris Baele
Auteur: Webatvantage.be
Laatst gewijzigd: 24-11-2009
-----------------------------------------------------------------------------*/

/* Html, body
---------------------------------------------*/
html, body { font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 12px; color: #fff;  text-align: center; }
body { background: #fff; }

/* Headings
---------------------------------------------*/
h1 { font-size: 14px; font-weight: bold; margin: 0 0 10px 0; }
h2 { font-size: 12px; font-weight: bold; margin: 0 0 10px 0; }
h3 { font-size: 12px; font-weight: normal; margin: 0 0 10px 0; }

/* Links
---------------------------------------------*/
a:link,
a:visited,
a:active,
a:hover { color: #fff; text-decoration: underline; }

/* Container
---------------------------------------------*/
#container { width: 960px; height: auto; margin: 0 auto; text-align: left; }

/* Header
---------------------------------------------*/
#header { position: relative; width: 960px; height: 135px; margin: 50px 0 0 0; }

/* Logo */
#header a#logo { position: absolute; top: 0; left: 0; display: block; width: 167px; height: 103px; background: url('../Graphics/Logo.jpg') no-repeat top left; text-indent: -9999px; }

/* Navigation */
#header ul#navigation { position: absolute; right: 0; top: 0; height: 95px; width: auto; }
#header ul#navigation li { display: inline; list-style: none; }
#header ul#navigation li a { float: left; display: block; width: 95px; height: 95px; margin: 0 0 0 10px; background: #ddd; color: #fff; text-decoration: none; text-indent: -9999px;  }

#header ul#navigation li a#home { background: #8cc63f url('../Graphics/Home.gif') no-repeat top left; }
#header ul#navigation li a#creaties { background: #983b1f url('../Graphics/Creaties.gif') no-repeat top left; }
#header ul#navigation li a#trouwringen { background: #983b1f url('../Graphics/Trouwringen.gif') no-repeat top left; }
#header ul#navigation li a#transformaties { background: #408bca url('../Graphics/Transformaties.gif') no-repeat top left; }
#header ul#navigation li a#winkel { background: #fbab18 url('../Graphics/Winkel.gif') no-repeat top left; }
#header ul#navigation li a#kris_baele { background: #bbdb89 url('../Graphics/Kris_baele.gif') no-repeat top left; }
#header ul#navigation li a#nieuwsbrief { background: #bbdb89 url('../Graphics/Nieuwsbrief.gif') no-repeat top left; }
#header ul#navigation li a#info { background: #5d5555 url('../Graphics/Info.gif') no-repeat top left; }

/* Content
---------------------------------------------*/
#content { position: relative; width: 960px; height: 550px; background: #5d5555; /*overflow: hidden;*/ }

/* Album */
div#album { position: absolute; top: 60px; left: 55px; width: 850px; height: 430px; }
div#album div.item { float: left; width: 205px; height: 100px; background: #fff; margin: 0 10px 10px 0; }
div#album div.last { margin-right: 0; }

div#album ul#pagination { position: absolute; bottom: -40px; left: 0; height: 30px; list-style: none; margin: 0; padding: 0; }
div#album ul#pagination li { display: inline; }
div#album ul#pagination li a:link,
div#album ul#pagination li a:visited,
div#album ul#pagination li a:active { float: left; display: block; width: 30px; height: 30px; line-height: 30px; margin: 0 2px 0 0; padding: 0; background: #484142; text-align: center; text-decoration: none; }
div#album ul#pagination li a:hover,
div#album ul#pagination li a.active { background: #7c7272 !important; }

/* Contactform */
form#contactform {}
form#contactform p { margin: 0 0 5px 0; }
form#contactform p label { display: block; width: 500px; height: 20px; }
form#contactform p .input,
form#contactform p .inputred { display: block; width: 492px; height: 16px; padding: 4px; background: #ddd; border: 1px solid #222; font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 12px; }
form#contactform p .textarea,
form#contactform p .textareared { display: block; width: 492px; height: 90px; padding: 4px; background: #ddd; border: 1px solid #222; font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 12px; overflow: auto; }
form#contactform p .input:focus,
form#contactform p .textarea:focus { background: #fff; }
form#contactform p .inputred,
form#contactform p .textareared { border: 1px solid #c00; }
form#contactform p .submit { padding: 3px; background: #ddd; border: none; border: 1px solid #222; cursor: pointer; font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #5d5555; }
form#contactform p.info_message { width: 492px; padding: 5px; background: #ddd; color: #5d5555; font-weight: bold; }
form#contactform p.error_message { width: 492px; padding: 5px; background: #ddd; color: #c00; font-weight: bold; }
form#contactform p.success_message { width: 492px; padding: 5px; background: #ddd; font-weight: bold; }

div#contact_info { margin: 10px 0; }

/* Sidebar
---------------------------------------------*/
#sidebar { float: left; width: 330px; height: 530px; margin: 10px 0 10px 10px; background: #5d5555; overflow: hidden; }

/* Main
---------------------------------------------*/
#main { float: left; width: 600px; height: 530px; margin: 10px 0 10px 10px; line-height: 16px; }

#main ul,
#main_large ul  { margin: 10px 0; list-style-type: square; list-style-position: outside; }
#main li, #main_large li { margin: 0 0 5px 15px; padding: 0 0 0 5px; }
#main ol, #main_large ol { margin: 10px 0; }

.title { padding: 25px 0 15px 55px; }

/* Footer
---------------------------------------------*/
#footer { width: 960px; height: 30px; line-height: 30px; overflow: hidden; }
#footer a { color: #999; text-decoration: none; }
#footer a:hover { text-decoration: underline; }
#footer #subnav { float: left; width: 400px; text-align: left; font-size: 9px; color: #999; text-transform: uppercase; }
#footer #credits { float: right; width: 400px; text-align: right; font-size: 9px; color: #999; text-transform: uppercase; }

/* Default classes
---------------------------------------------*/
.underline { text-decoration: underline !important; }
