body { font:small Arial; background:#222; color:#443352; margin:50px 0; padding:0 }
div#wrapper { width:960px; position:relative; margin:0 auto; background:white url(../gfx/kolom.jpg) no-repeat; background-position:right top; border:8px solid white }
div#page { margin:0 120px 0 295px; padding:70px 0 10px 0; height:368px; overflow:hidden; }
div#foto { position:absolute; left:0; top:0 }
a img { border:0 }
img#logo { display:block; position:absolute; right:8px; top:10px }

h1 { color:#f39; font:150% Trebuchet MS; margin:0 0 1em }
p  { margin:0 20px 1em 0; line-height:1.4em; font-size:90% }
ul { margin:0; padding:0 0 1.4em 20px }
li { line-height:1.4em; margin-bottom:4px }
h2 { font-size:90%; margin:0 0 4px }
strong { color:#212 }
a { color:#f39; text-decoration:none; }
a:hover { text-decoration:underline; }

div.actie { background:#c2b1d0 url(../gfx/actieblok.gif) no-repeat; width:104px; height:143px;  position:absolute; right:8px; top:297px; text-align:center;}
div.actie h2 { text-transform:uppercase; font-size:130%; padding:8px 0;}
div.actie p { margin:0;}

div#menu { height:40px; background:#262525 url(../gfx/menu.jpg) repeat-x; text-align:right; position:relative; }
div#menu a { color:#f39; text-decoration:none; font:15px Trebuchet MS; font-weight:bold; display:block; float:left; 
	         background-image:url(../gfx/menubullet.gif); background-repeat:no-repeat; background-position:0 15px; padding:8px 15px 4px 25px }
div#menu li:first-child a { background:none; }
div#menu a:hover, div#menu a.selected { color:white }
div#menu ul { float:right; margin:0; padding:0 }
div#menu li { list-style-type:none; display:inline; margin:0 }

div#menu li ul { display:none; width:100px }
div#menu li.selected ul { display:block; text-align:left; position:absolute;right:8px; bottom:60px }
div#menu li.selected ul li { display:block;  }
div#menu li.selected ul li a { padding:4px 15px 4px 12px; font-size:90%; background-image:url(../gfx/submenubullet.gif); background-position:0 11px; float:none; line-height:16px }

/*back*/
div#page a#back { position:absolute; left:292px; top:14px; background-image:url(../gfx/back.gif); padding:0; background-position:0 -20px; display:block; width:50px; height:20px; text-decoration:none; }
div#page a#back:hover { background-position:0 0px; }
body.index div#page a#back { display:none; }
/*body.portfolio div#page a#back { left:0; }*/

/*slideshow home*/
div.slideshow   { position:relative; left:0; top:0; height:440px; width:270px; }
div.slideshow img { position:absolute; top:0; left:0; z-index:8 }
div.slideshow img.bovenop  { z-index:10 }
div.slideshow img.erachter { z-index:9 }

/*twitter/linkedin*/
a#twitter, a#linkedin { display:block; width:32px; height:32px; font-size:1px; text-indent:-100px; overflow:hidden; }
a#twitter  { background-image:url(../gfx/twitter.png); float:left; margin-right:10px;}
a#linkedin { background-image:url(../gfx/linkedin.png); }
a#twitter:hover, a#linkedin:hover { background-position:bottom; }

/* FORMULIER */
form { font-size:85% }
input.text, textarea { font:12px Arial; display:block; width:280px; border:1px solid #f39; margin:0 0 8px 150px }
label { display:block; width:150px; float:left }
input.submit { background:#f39; cursor:pointer; color:white; border:0; font-size:11px; padding:2px 12px; margin:0 0 0 150px }
div.error { color:red; margin:0 0 8px 150px; font-weight:bold; }
div.checkboxgroup { margin-left:150px; }

/* portfolio */
div#portfolio { color:white; background:black; position:absolute; font-size:12px; left:101px; top:101px; width:602px; height:302px;}
div#portfolio img { display:none; position:absolute; left:151px; top:1px; cursor:pointer;}
div#portfolio div#ctl { position:absolute; left:16px; bottom:16px;}
div#portfolio div#ctl a { display:block; float:left; position:absolute; width:17px; height:7px; margin-top:3px;}
div#portfolio div#ctl a:hover { background-position:0 -16px;}
div#portfolio a#prev { background-image:url(../gfx/pfprev.gif); left:0;}
div#portfolio a#next { background-image:url(../gfx/pfnext.gif); right:0;}
div#portfolio span#cnt   { display:block; float:left; width:120px; text-align:center;}
div#description { position:absolute; width:130px; left:6px; top:12px; font-size:11px; text-align:right; line-height:1.5em;}
div#description strong { font-weight:normal; color:#F39; }

/* portfolio */
div.portfolio { position:absolute; background:url(../gfx/bg_portfolio.gif) no-repeat; width:616px; height:303px; left:100px; top:100px; }
div.portfolio br { display:none; }
div.portfolio a        { display:block; float:left; height:65px; width:110px; margin:9px 0 0 9px; padding:0px; text-indent:-3000px; overflow:hidden; }
div.portfolio a:hover  { background-position:bottom; }

div.portfolio a#foto01 { background-image:url(../foto/portfolio_overzicht/foto01.jpg); }
div.portfolio a#foto02 { background-image:url(../foto/portfolio_overzicht/foto02.jpg); }
div.portfolio a#foto03 { background-image:url(../foto/portfolio_overzicht/foto03.jpg); }
div.portfolio a#foto04 { background-image:url(../foto/portfolio_overzicht/foto04.jpg); }
div.portfolio a#foto05 { background-image:url(../foto/portfolio_overzicht/foto05.jpg); }
div.portfolio a#foto06 { background-image:url(../foto/portfolio_overzicht/foto06.jpg); }
div.portfolio a#foto07 { background-image:url(../foto/portfolio_overzicht/foto07.jpg); }
div.portfolio a#foto08 { background-image:url(../foto/portfolio_overzicht/foto08.jpg); }
div.portfolio a#foto09 { background-image:url(../foto/portfolio_overzicht/foto09.jpg); }
div.portfolio a#foto10 { background-image:url(../foto/portfolio_overzicht/foto10.jpg); }
div.portfolio a#foto11 { background-image:url(../foto/portfolio_overzicht/foto11.jpg); }
div.portfolio a#foto12 { background-image:url(../foto/portfolio_overzicht/foto12.jpg); }
div.portfolio a#foto13 { background-image:url(../foto/portfolio_overzicht/foto13.jpg); }
div.portfolio a#foto14 { background-image:url(../foto/portfolio_overzicht/foto14.jpg); }
div.portfolio a#foto15 { background-image:url(../foto/portfolio_overzicht/foto15.jpg); }
div.portfolio a#foto16 { background-image:url(../foto/portfolio_overzicht/foto16.jpg); }
div.portfolio a#foto17 { background-image:url(../foto/portfolio_overzicht/foto17.jpg); }
div.portfolio a#foto18 { background-image:url(../foto/portfolio_overzicht/foto18.jpg); }
div.portfolio a#foto19 { background-image:url(../foto/portfolio_overzicht/foto19.jpg); }
div.portfolio a#foto20 { background-image:url(../foto/portfolio_overzicht/foto20.jpg); }