* { border: 0; font-size: 1em; margin: 0; outline: 0; padding: 0; text-decoration: none }
a { color: #999 }
a:visited { text-decoration: line-through }
address { font-style: normal; font-size: 10px; font-weight: bold }
b, h1, h2, h3, h4, h5, h6, strong { font-weight: bold }
blockquote, h3 { font: bold italic 18px/1 'Georgia', serif; margin: 4px 0 }
cite, dfn, em, h3, i, var { font-style: italic }
h1 { background: url('images/gfx/h1.png') white no-repeat; font-size: 48px; height: 48px; overflow: hide; position: absolute; top: 32px; width: 224px }
h1 a { display: block; height: 60px; text-indent: -9999px }
h2 { background: #000; color: #fff; padding: 0 6px }
html { background: #eee; color: #000; font: normal 12px/1.33 'Arial', sans-serif; overflow-y: scroll }
li { display: list-item; margin: 0 0 0 1.5em }
marquee { color: #fce617 } /* Dit gaan we natuurlijk anders doen */
ol li { list-style: decimal }
p { margin: 0 0 1.5em 0 }
ul li { list-style: disc }

.aside { background: white; float: left; height: 680px; opacity: 1; position: relative; width: 240px }
.aside a { color: #000 }
.aside .links { background: #fce617; font-size: 9px; height: 13px; padding: 2px 0 0 0; position: absolute; top: 80px; width: 224px }
.aside .links a { display: block; float: left; font-weight: bold; height: 14px; padding: 0 0 0 20px }
.aside .nav { background: white; height: 180px; padding: 128px 0 0 0 }
.aside .nav * { list-style: none; margin: 0; padding: 0 }
.aside .nav a { outline: 1px solid lime; display: block; height: 36px; text-indent: -9999px }
.aside .nav ul { margin: 0; padding: 0 }
.aside .nav ul li { height: 36px; overflow: hidden }
.aside .nav li a:hover, .aside .nav .active a { background: url('images/gfx/a3.gif') transparent no-repeat }
.aside .nav .cat-1 { background: url('images/gfx/cat-1.png') transparent no-repeat }
.aside .nav .cat-2 { background: url('images/gfx/cat-4.png') transparent no-repeat }
.aside .nav .cat-3 { background: url('images/gfx/cat-2.png') transparent no-repeat }
.aside .nav .cat-4 { background: url('images/gfx/cat-3.png') transparent no-repeat }
.aside .nav .cat-5 { background: url('images/gfx/cat-5a.png') transparent no-repeat }
.aside .nav2 { background: white; height: 130px }
.aside .nav2 * { list-style: none; margin: 0; padding: 0 }
.aside .nav2 ul { background: white; margin: 0; padding: 7px 0 }
.aside .nav2 ul li { display: block; height: 19px; overflow: hidden; padding: 0 0 1px 0 }
.aside .nav2 ul li.page-1 { background: url('images/gfx/page1.png') transparent no-repeat }
.aside .nav2 ul li.page-2 { background: url('images/gfx/page2.png') transparent no-repeat }
.aside .nav2 ul li.page-3 { background: url('images/gfx/page3.png') transparent no-repeat }
.aside .nav2 ul li.page-4 { background: url('images/gfx/page4.png') transparent no-repeat }
.aside .nav2 ul li.page-5 { background: url('images/gfx/page5.png') transparent no-repeat }
.aside .nav2 ul li a { display: block; height: 19px; text-indent: -9999px }
.aside .nav2 ul li a:hover { background: url('images/gfx/a2.gif') transparent no-repeat }
.aside .news { background: transparent; height: 90px; padding: 0 20px 20px }
.aside .news .h { font-weight: bold }
.aside .quote { background: transparent; height: 120px; padding: 10px 20px 0 20px }
.aside .quote .h { font-weight: bold }
.aside .quote .q { font-family: 'Georgia', serif; font-style: italic; font-weight: bold; line-height: 1.25 }
.aside .quote .q cite, .tweet .date { font-family: 'Arial', sans-serif; font-style: normal; font-size: 10px; font-weight: bold }
.article { background: white; float: left; min-height: 680px; opacity: 1; padding: 0 0 0 5px; position: relative; width: 715px }
.article .col1of1 { background: white }
.article .col1of2 { background: white; float: left; height: auto; position: relative; width: 340px }
.article .col2of2 { background: white; float: left; height: auto; margin: 0 0 0 20px; position: relative; width: 340px }
.article .header { background: transparent; height: 80px; width: 715px }
.article .header * { list-style: none; margin: 0; padding: 0 }
.article .header a { color: #000 }
.article .header .menu { list-style: none; margin: 0; padding: 7px 0 0 0 }
.article .header .menu li { display: block; float: left; font-size: 14px; font-weight: bold; position: relative; width: 180px; z-index: 3000 }
.article .header .menu li.col-4 { width: 175px }
.article .header .menu li ul { background: white; display: none; left: 0; line-height: 1.2; padding: 12px 0 0 0; position: absolute; top: 16px; width: 160px; z-index: 999 }
.article .header .menu li ul li { float: none; font-size: 12px; font-weight: normal }
.article .header .menu li a { text-decoration: none }
.article .header .menu li.active a { text-decoration: line-through }
.article .header .menu li.active ul li a { text-decoration: none }
.article .header .menu li ul li a:visited { text-decoration: line-through }
.article .images { position: absolute }
.article .image img { position: absolute; z-index: 1 }
.article .project .col1of2 { background: white; bottom: 58px; position: absolute; z-index: 30 }
.article .project .col1of2 h2 { height: 15px; line-height: 15px }
.article .project .nav * { list-style: none; margin: 0; padding: 0 }
.article .project .nav a { display: block; height: 18px; text-indent: -9999px; width: 18px }
.article .project .nav li { height: 18px; overflow: hidden; position: absolute; top: 36px; width: 18px }
.article .project .nav li.next { background: url('images/gfx/project-next.png') #ffe800 no-repeat; left: 682px; z-index: 39 }
.article .project .nav li.previous { background: url('images/gfx/project-previous.png') #ffe800 no-repeat; left: 0; z-index: 38 }
.article .quote { border-bottom: 4px solid #000; padding: 4px 0 }
.entry { border-bottom: 4px solid #000; padding: 2px 0 }
.entry .date { font-size: 10px; font-weight: bold }
.entry .more4 { color: #999; cursor: pointer; font-weight: bold; padding: 4px 0 }
.entry .summary p { margin: 0 }
.entry .summary p + p { margin: 1.5em 0 0 0 }
.entry .title {  }
.entry .text { display: none }
.summary { font-weight: bold }

.more2, .more3 { color: #999; cursor: pointer }
.more2 { bottom: 0; display: none; position: absolute; right: 10px }
.more3 { bottom: 0; position: absolute; right: 10px }
.more4 {}

#content { background: white; height: 600px; position: relative }
#map { background: #ccc; height: 323px }

body.home .col2of2 div { background: #c8c8c8; border-bottom: 4px solid #000; height: 176px }
body.home .col2of2 div a { background: #c8c8c8; color: #000; display: block; font-size: 16px; font-weight: bold; height: 176px; position: relative }
body.home .col2of2 div a:hover { background: #fce617 }
body.home .col2of2 div a img { display: block; height: 176px; left: 0; position: absolute; top: 0 }
body.home .col2of2 div a span.title { display: block; height: 176px; left: 0; padding: 10px; position: absolute; top: 0 }
body.home .col2of2 div a:hover img { visibility: hidden }

body.nieuwsblog li.page-1 a { background: url('images/gfx/a2.gif') transparent no-repeat }
body.wat-we-doen li.page-2 a { background: url('images/gfx/a2.gif') transparent no-repeat }
body.visie li.page-2 a { background: url('images/gfx/a2.gif') transparent no-repeat }
body.werkwijze li.page-2 a { background: url('images/gfx/a2.gif') transparent no-repeat }
body.historie li.page-2 a { background: url('images/gfx/a2.gif') transparent no-repeat }
body.wie-zijn-we li.page-3 a { background: url('images/gfx/a2.gif') transparent no-repeat }
body.medewerker li.page-3 a { background: url('images/gfx/a2.gif') transparent no-repeat }
body.medewerkers li.page-3 a { background: url('images/gfx/a2.gif') transparent no-repeat }
body.studio li.page-3 a { background: url('images/gfx/a2.gif') transparent no-repeat }
body.voor-wie li.page-4 a { background: url('images/gfx/a2.gif') transparent no-repeat }
body.contact li.page-5 a { background: url('images/gfx/a2.gif') transparent no-repeat }

body.client ul.projects { list-style: none; margin: 0 -20px 0 0; padding: 0 }
body.client ul.projects li { background: #c8c8c8; border-bottom: 4px solid #000; display: block; float: left; height: 160px; list-style: none; margin: 0 20px 0 0; padding: 0; width: 160px }
body.client ul.projects li a { background: #c8c8c8; color: #c8c8c8; display: block; font-size: 16px; font-weight: bold; height: 160px; position: relative }
body.client ul.projects li a:hover { background: #fce617; color: #fce617; text-decoration: none }
body.client ul.projects li a img { display: block; height: 160px; left: 0; position: absolute; top: 0 }
body.client ul.projects li a span.title { display: block; height: 160px; left: 0; padding: 0 10px; position: absolute; top: 0 }
body.client ul.projects li a:hover img { visibility: hidden }

body.medewerkers ul.persons { list-style: none; margin: 0 -20px 0 0; padding: 0 }
body.medewerkers ul.persons li { background: #c8c8c8; border-bottom: 4px solid #000; display: block; float: left; height: 160px; list-style: none; margin: 0 20px 0 0; padding: 0; width: 160px }
body.medewerkers ul.persons li a { background: #c8c8c8; color: #c8c8c8; display: block; font-size: 16px; font-weight: bold; height: 160px; position: relative }
body.medewerkers ul.persons li a:hover { background: #fce617; color: #000; text-decoration: none }
body.medewerkers ul.persons li a img { display: block; height: 160px; left: 0; position: absolute; top: 0 }
body.medewerkers ul.persons li a span.title { display: block; left: 0; padding: 0 10px; position: absolute; top: 0 }
body.medewerkers ul.persons li a span.title .function { display: block; font-size: 12px }
body.medewerkers ul.persons li a:hover img { visibility: hidden }

body.voor-wie #content { color: #999 }
body.voor-wie #content a { color: #000 }
body.voor-wie #content a:hover { text-decoration: line-through }



.page { cursor: pointer; height: 680px; position: absolute; width: 960px }
.page .top { display: block; height: 8px; left: 0; position: absolute; top: 0; width: 960px }
.page .right { display: block; height: 680px; left: 952px; position: absolute; top: 8px; width: 8px }
.page .bottom { display: block; height: 8px; left: 0; position: absolute; top: 672px; width: 960px }
.page .left { display: block; height: 680px; left: 0; position: absolute; top: 8px; width: 8px }
.page .inner { margin: 8px; min-height: 680px; position: relative }

#page1 { background: url('images/bg/1.jpg') transparent repeat; left: 24px; top: 0 }
#page2 { background: url('images/bg/2.jpg') transparent repeat; left: 16px; top: 8px }
#page3 { background: url('images/bg/3.jpg') transparent repeat; left: 8px; top: 16px }
#page4 { background: #fff; cursor: default; left: 0; top: 24px }
#page4 .inner { background: #fff; margin: 0 }

.clear { clear: both; width: 100% }

.page:target { z-index: 100 }

#root { margin: 0 auto; position: relative; width: 1000px }


.test { background: lime }

