html, body, div, h1, h2, h3, h4, p, ul, li, dl, dt, dd { margin: 0; padding: 0; }
html, body { background: #fff; color: #000; height: 100%; }
body { min-width: 600px; max-width: 1051px; margin: 0 auto; padding-bottom: 1px; }
#container { margin: 0 47px; position: relative; }
h1, h2, #menu { text-transform: lowercase; }
h1 img, h2 img { display: block; }
h1 { padding-top: 72px; }
h3 { clear: both; font-weight: normal; font-size: 100%; }
h4 { font-size: 100%; }
a img { border: none; }

#menu { margin: 32px 0 23px 0; list-style: none; width: 100%; overflow: hidden; }
#menu li { float: left; background: transparent url(img/menu-wit.gif) no-repeat top left; margin-right: 10px; height: 18px; overflow: hidden; }
 #menu li a { color: #000; display: block; text-decoration: none; background: transparent url(img/menu-wit.gif) no-repeat top left; }
  #menu li a:hover { color: #3c0; }
   #menu li a em { visibility: hidden; }

#home #menu li { background-image: url(img/menu-home.gif); }
#home #menu li a { background-image: url(img/menu-home.gif); }
   
 #menu li#menu-portfolio, #menu li#menu-portfolio a { width: 82px; background-position: 0 0; }
 #menu li#menu-cv, #menu li#menu-cv a { width: 22px; background-position: -93px 0; }
 #menu li#menu-contact, #menu li#menu-contact a { width: 70px; background-position: -125px 0; }

 #portfolio #menu li#menu-portfolio a, #menu li#menu-portfolio a:hover { background-position: 0 -19px; }
 #cv #menu li#menu-cv a, #menu li#menu-cv a:hover { background-position: -93px -19px; }
 #contact #menu li#menu-contact a, #menu li#menu-contact a:hover { background-position: -125px -19px; }
 
#content { }
 #content p { margin-bottom: 10px; }
 #content ul { margin-bottom: 10px; list-style: none; }
 #content dd { margin-bottom: 10px; list-style: none; }

#home { background: #fff url(img/back2.jpg) no-repeat 0 -20px; height: 100%; }
 #home h1 img, #home h2 img { visibility: hidden; }
 
#portfolio #content { margin-top: -12px; font-family: Verdana, sans-serif; font-size: 11px; color: #ccc; font-weight: bold; padding-bottom: 40px; }
 #portfolio #content h3 { line-height: 16px; }
 #portfolio #content a { color: #ccc; }
 #portfolio #content a:hover { color: #3c0; }
 #portfolio #content .float { float: left; margin: 20px 8px 5px 0; }
 #portfolio #content .geen-link { margin-right: 20px; }
 #portfolio #content .img a { padding-right: 12px; display: block; background: #fff url(img/plusje-zwart.gif) no-repeat bottom right; }
 #portfolio #content .img a:hover { background-image: url(img/plusje-groen.gif); }
 #portfolio #content .img a img { display: block; }
 
 #portfolio #content #voorbeeld { float: left; width: 580px; height: 450px; overflow: auto; }
 #portfolio #content #voorbeeld.no-scroll { overflow: hidden; }
  #portfolio #content #voorbeeld #lijst { width: 2368px; }
   #portfolio #content #voorbeeld img { display: block; float: left; margin-right: 20px; }
   
 #portfolio #content #beschrijving { font-family: Georgia, serif; margin: 20px 20px 0 620px; color: #999; }
  #portfolio #content #beschrijving h3 { font-weight: bold; clear: none; }
  #portfolio #content #beschrijving h4 { font-weight: normal; text-transform: uppercase; }
  #portfolio #content #beschrijving p { font-weight: normal; }
   #portfolio #content #beschrijving #menu-images { list-style: none; margin: 0 0 2em 0; padding: 0; }
    #portfolio #content #beschrijving #menu-images li { display: inline; border-left: 1px solid #ccc; text-align: center; font-family: Verdana, sans-serif; }
    #portfolio #content #beschrijving #menu-images li.first { border-left: none; }
    #portfolio #content #beschrijving #menu-images li a { font-weight: normal; text-decoration: underline; padding: 0 8px; }
    #portfolio #content #beschrijving #menu-images li.first a { padding-left: 0; }
    #portfolio #content #beschrijving #menu-images li#current a { color: #666; text-decoration: none; }
  
 #portfolio #terug { position: absolute; top: 90px; left: 590px; display: block; width: 85px; height: 53px; background: #fff url(img/back-button-w.gif) no-repeat left top; }
  #portfolio #terug:hover { background-image: url(img/back-button-g.gif); }
  #portfolio #terug em { display: block; visibility: hidden; height: 53px; background: transparent url(img/back-button-g.gif) no-repeat left top; }

#cv #content, #contact #content { margin: 0 -15px 5px -15px; padding: 15px; font-family: Georgia, serif; font-size: 19px; line-height: 26px; }
  
#cv #content { background: #d8d127; }
#cv #content.hover { background: #aacbd1; }
 #cv #content .rechts { position: absolute; top: 84px; right: -15px; }
 #cv #content a { color: #000; text-decoration: none; border-bottom: 1px solid #cbc40a; }
 #cv #content a:hover { color: #0c0; border-color: #0c0; }
 #cv #content h3 { color: #fff; margin-top: 30px; }
 #cv #foot { color: #999; padding: 0 0 10px 0; font-family: Arial, sans-serif; font-size: 11pt; }
  #cv #foot a { color: #aaa; }

#contact #content { background: #a2a074; height: 644px; }
#contact #content.hover { background: #aacbd1; }
 #contact #content a { color: #000; text-decoration: none; border-bottom: 1px solid #929068; }
 #contact #content a:hover { color: #0c0; border-color: #0c0; }
