html {
 height: 100%;
}
body{
 font: 12px Arial, Helvetica, sans-serif;
 height: 100%;
 outline:none;
 margin:0px;
 padding:0px;
 overflow:hidden;
}
body a
{
outline:none;	
}

@font-face {
	font-family: 'KievitBlack';
	src: url('font/kievit_black-webfont.eot');
	src: url('font/kievit_black-webfont.woff') format('woff'), url('font/kievit_black-webfont.ttf') format('truetype'), url('font/kievit_black-webfont.svg#webfontzRLMnXV2') format('svg');
	font-weight: normal;
	font-style: normal;
}

#main {
 width: 940px;
 height:auto;
 margin: 0px auto;
 padding:0px 0px 0px 0px;
}

/* Header */
#header
{
float:left;
display:inline;
position:absolute;
width:687px;
height:37px;
margin:0px 0px 0px 253px;
padding:0px;
background:url('images/headerBg.gif') no-repeat;

}
#header #siteLogo
{
float:left;
display:inline;
margin:5px 0px 0px 30px;
padding:0px;
}
#header #siteLogo a, img
{
border:none;	
}

#header ul
{
float:left;
display:inline;
list-style:none;
margin:0px 0px 0px 25px;
padding:0px;
}
#header li.werk
{
float:left;
display:inline;
height:26px;
width:74px;
margin:4px 0px 0px 0px;
padding:0px;
background:url('images/navButtons.gif') no-repeat;
}
#header li.mensen
{
float:left;
display:inline;
height:26px;
width:88px;
margin:4px 0px 0px 3px;
padding:0px;
background:url('images/navButtons.gif') -76px 0px no-repeat;
}
#header li.overons
{
float:left;
display:inline;
height:26px;
width:100px;
margin:4px 0px 0px 3px;
padding:0px;
background:url('images/navButtons.gif') -167px 0px no-repeat;
}

#header li.werkActive
{
float:left;
display:inline;
height:26px;
width:74px;
margin:4px 0px 0px 0px;
padding:0px;
background:url('images/navButtonsActive.gif') no-repeat;
}
#header li.mensenActive
{
float:left;
display:inline;
height:26px;
width:88px;
margin:4px 0px 0px 3px;
padding:0px;
background:url('images/navButtonsActive.gif') -76px 0px no-repeat;
}
#header li.overonsActive
{
float:left;
display:inline;
height:26px;
width:100px;
margin:4px 0px 0px 3px;
padding:0px;
background:url('images/navButtonsActive.gif') -167px 0px no-repeat;
}

#header li a
{
float:left;
display:inline;
height:100%;
width:100%;
text-indent:-999999px;
margin:0px;
padding:0px;
}

#twitterFeed
{
position: relative;
overflow: hidden;
float:left;
display:inline;
height:32px;
width:223px;
margin:0px;
padding:0px;
background:url('images/twitterIcon.gif') 100% 0px no-repeat;
}
.headline {
position: absolute;
top: 33px;
left: 1px;
height: 30px;
width:220px;

}
#twitterFeed p
{
float:left;
display:inline;
font-size:9px;
width:180px;
margin:3px 0px 0px 7px;
padding:0px;	
}
#twitterFeed a
{
text-decoration:none;
color:#000;
}
#twitterFeed a:hover
{
text-decoration:underline;
color:#000;
}

a.login
{
float:left;
display:inline;
width:67px;
height:21px;
text-indent:-999999px;
margin:7px 0px 0px 11px;
padding:0px;
background:url('images/inloggen.gif') no-repeat;
}

/* end header */

/* content */
.content
{
float:left;
position:absolute;
margin:46px 0px 0px 0px;
padding:0px 0px 3px 0px;
background:url('images/contentFooter.png') 1px 100% no-repeat;
z-index:9;
}
.large
{
width:638px;
}
.small
{
width:358px;
}

.contentInner
{
float:left;
margin:0px;
padding:0px;
background:url('images/rightDotted.gif') top right repeat-y;
border-left:1px solid #000;
border-bottom:1px solid #000;
border-top:1px solid #000;
z-index:9;
}
.inline
{
display:inline;
}
.none
{
display:none;
}

.contentInner .leftColumn
{
float:left;
display:inline;
width:285px;
margin:20px 0px 0px -25px;
padding:0px 20px 5px 0px;
/*height:452px;*/
}
.contentInner a.close
{
float:left;
display:inline;
width:25px;
height:20px;
text-indent:-999999px;
margin:0px 0px 0px 0px;
padding:0px;
background:url('images/closeIcon.gif') no-repeat;
}
.contentInner .next
{
float:right;
display:inline;
width:auto;
margin:0px;
padding:0px;
height:21px;
}
.next a
{
float:left;
display:inline;
width:21px;
height:21px;
text-indent:-999999px;
margin:0px 0px 0px 0px;
padding:0px;
background:url('images/nextArrow.gif') no-repeat;
}
.leftColumn h1
{
display:block;
font-size:18px;
font-family: 'KievitBlack';
text-transform:uppercase;
line-height:22px;
font-weight:bold;
margin:5px 0px 0px 25px;
padding:0px 0px 6px 0px;
}
.leftColumn h2
{
display:block;
font-size:11px;
text-transform:uppercase;
margin:10px 0px 0px 25px;
padding:0px;
}
.leftColumn p
{
display:block;
line-height:14px;
font-size:11px;
color:#2f2f2f;
margin:0px 20px 0px 25px;
padding:0px 0px 10px 0px;
}

.top
{
float:left;
display:inline;
position:absolute;
height:6px;
width:11px;
margin:0px 0px 0px 0px;
padding:0px;
background:url('images/topArrow.png') no-repeat;
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod='crop', src='images/topArrow.png');
z-index:99;
}

.contentInner .rightColumn
{
float:left;
display:inline;
width:329px;
margin:0px 3px 0px 0px;
padding:0px 0px 0px 0px;
}

.contentInner .workers
{
margin:0px 3px 0px 0px;
}

#scroll .innerBox
{
float:left;
display:inline;
width:306px;
height:auto;
margin:0px;
padding:0px 0px 12px 0px;
background:url('images/rowOff.gif') left bottom no-repeat;
cursor: pointer;
cursor: hand;

}
#scroll .innerBoxSelected
{
color:#fff;
cursor:pointer;
background:url('images/rowOn.gif') left bottom no-repeat;
}



#scroll-2 .innerBox
{
float:left;
display:inline;
width:306px;
height:auto;
margin:0px;
padding:0px 0px 12px 0px;
background:url('images/rowOff.gif') left bottom no-repeat;
}
#scroll-2 .innerBoxSelected
{
color:#fff;
cursor:pointer;
background:url('images/rowOn.gif') left bottom no-repeat;
}



.innerBox img
{
float:left;
display:inline;
margin:8px 10px 0px 10px;
padding:0px;
border:1px solid #000;
}
.innerBox h2
{
display:block;
font-size:11px;
text-transform:uppercase;
margin:10px 0px 0px 10px;
padding:0px;
}

.innerBox p
{
display:block;
line-height:14px;
font-size:11px;
color:#2f2f2f;
margin:0px 20px 0px 10px;
padding:0px 0px 5px 0px;
}

.innerBox .selected
{
color:#fff;
}
.innerBox .innerContent
{
float:right;
display:inline;
width:186px;
height:auto;
margin:0px 20px 0px 0px;
padding:5px 0px 0px 0px;
background:url('images/xDotted.gif') repeat-x;
}


.innerBox .noImage
{
float:left;
display:inline;
width:277px;
margin:0px 20px 0px 10px;
}

.innerBox .innerContent .projects
{
float:left;
display:inline;
color:#000;
text-decoration:none;
font-size:11px;
margin:0px;
padding:0px 13px 2px 0px;
background:url('images/arrowDown.gif') 100% 4px no-repeat;
}
.innerBox .innerContent .projects:hover
{
text-decoration:underline;	
}
.innerBox .innerContent .arrowUp
{
background:url('images/arrowUp.gif') 100% 4px no-repeat;
}

.innerBox .innerContent .icon
{
float:left;
display:inline;
margin:2px 7px 0px 0px;
padding:0px;
border:none; 
}

.innerBox .innerContent ul
{
float:left;
list-style:none;
width:100%;
margin:5px 0px 0px 0px;
padding:0px;
}
.innerBox .innerContent li
{
float:left;
display:inline;
margin:0px;
padding:0px 0px 5px 0px;
}
.innerBox .innerContent li a
{
float:left;
display:inline;
color:#000;
text-decoration:none;
font-size:11px;
font-weight:bold;
margin:0px;
padding:0px;
}
.innerBox .innerContent li a:hover
{
text-decoration:underline;
}
.innerBox .innerContent li span
{
float:left;
display:inline;
width:100%;
color:#000;
text-decoration:none;
font-size:11px;
margin:0px;
padding:0px;
}








#scroll .innerBoxHover
{
float:left;
display:inline;
width:306px;
height:auto;
color:#fff;
margin:0px;
padding:0px 0px 12px 0px;
background:url('images/rowOn.gif') left bottom no-repeat;
}
#scroll-2 .innerBoxHover
{
float:left;
display:inline;
width:306px;
height:auto;
color:#fff;
margin:0px;
padding:0px 0px 12px 0px;
background:url('images/rowOn.gif') left bottom no-repeat;
}

.innerBoxHover img
{
float:left;
display:inline;
margin:8px 10px 0px 10px;
padding:0px;
border:1px solid #fff;
}
.innerBoxHover h2
{
display:block;
font-size:11px;
text-transform:uppercase;
margin:10px 0px 0px 10px;
padding:0px;
}
.innerBoxHover p
{
display:block;
line-height:14px;
font-size:11px;
color:#fff;
margin:0px 20px 0px 10px;
padding:0px 0px 5px 0px;
}

.innerBoxHover .innerContent
{
float:right;
display:inline;
width:186px;
height:auto;
margin:0px 20px 0px 0px;
padding:5px 0px 0px 0px;
background:url('images/xDotted.gif') repeat-x;
}


.innerBoxHover .noImage
{
float:left;
display:inline;
width:277px;
margin:0px 20px 0px 10px;
}

.innerBoxHover .innerContent .projects
{
float:left;
display:inline;
color:#fff;
text-decoration:none;
font-size:11px;
margin:0px;
padding:0px 13px 2px 0px;
background:url('images/arrowDownWithe.gif') 100% 4px no-repeat;
}
.innerBoxHover .innerContent .projects:hover
{
text-decoration:underline;	
}
.innerBoxHover .innerContent .arrowUp
{
background:url('images/arrowUpWithe.gif') 100% 4px no-repeat;
}

.innerBoxHover .innerContent .icon
{
float:left;
display:inline;
margin:2px 7px 0px 0px;
padding:0px;
border:none; 
}

/* icons */
.flickrIcon
{
float:left;
display:inline;
margin:2px 4px 0px 0px;
height:25px;
width:25px;
padding:0px;
border:none;
background:#fff url('images/iconFlickr.gif') 3px 3px no-repeat;
}
.flickrIcon:hover
{
background:#000 url('images/iconFlickrHover.gif') no-repeat;
}


.youtubeIcon
{
float:left;
display:inline;
margin:2px 4px 0px 0px;
height:25px;
width:27px;
padding:0px;
border:none;
background:#fff url('images/iconYoutube.gif') 3px 3px no-repeat;
}
.youtubeIcon:hover
{
background:#000 url('images/iconYoutubeHover.gif') no-repeat;
}


.linkedinIcon
{
float:left;
display:inline;
margin:2px 4px 0px 0px;
height:25px;
width:27px;
padding:0px;
border:none;
background:#fff url('images/iconLinkedin.gif') 5px 1px no-repeat;
}
.linkedinIcon:hover
{
background:#000 url('images/iconLinkedinHover.gif') 1px -1px no-repeat;
}


.myspaceIcon
{
float:left;
display:inline;
margin:2px 4px 0px 0px;
height:25px;
width:27px;
padding:0px;
border:none;
background:#fff url('images/iconMyspace.gif') 7px 2px no-repeat;
}
.myspaceIcon:hover
{
background:#000 url('images/iconMyspaceHover.gif') 3px 0px no-repeat;
}


.twitterIcon
{
float:left;
display:inline;
margin:2px 2px 0px 0px;
height:25px;
width:27px;
padding:0px;
border:none;
background:#fff url('images/iconTwitter.gif') 5px 1px no-repeat;
}
.twitterIcon:hover
{
background:#000 url('images/iconTwitterHover.gif') 4px 3px no-repeat;
}

.vimeoIcon
{
float:left;
display:inline;
margin:2px 4px 0px 0px;
height:25px;
width:27px;
padding:0px;
border:none;
background:#fff url('images/iconVimeo.gif') 3px 1px no-repeat;
}
.vimeoIcon:hover
{
background:#000 url('images/iconVimeoHover.gif') 2px 3px no-repeat;
}


/* end icons */

.innerBoxHover .innerContent ul
{
float:left;
list-style:none;
width:100%;
margin:5px 0px 0px 0px;
padding:0px;
}
.innerBoxHover .innerContent li
{
float:left;
display:inline;
margin:0px;
padding:0px 0px 5px 0px;
}
.innerBoxHover .innerContent li a
{
float:left;
display:inline;
color:#fff;
text-decoration:none;
font-size:11px;
font-weight:bold;
margin:0px;
padding:0px;
}
.innerBoxHover .innerContent li a:hover
{
text-decoration:underline;
}
.innerBoxHover .innerContent li span
{
float:left;
display:inline;
width:100%;
color:#fff;
text-decoration:none;
font-size:11px;
margin:0px;
padding:0px;
}






/* icons */
.innerBoxHover .innerContent .flickrIcon
{
float:left;
display:inline;
margin:2px 4px 0px 0px;
height:25px;
width:25px;
padding:0px;
border:none;
background:#000 url('images/iconFlickrHover.gif') 0px 0px no-repeat;
}
.innerBoxHover .innerContent .flickrIcon:hover
{
background:#fff url('images/iconFlickr.gif') 3px 3px no-repeat;
}


.innerBoxHover .innerContent .youtubeIcon
{
float:left;
display:inline;
margin:2px 4px 0px 0px;
height:25px;
width:27px;
padding:0px;
border:none;
background:#000 url('images/iconYoutubeHover.gif') no-repeat;
}
.innerBoxHover .innerContent .youtubeIcon:hover
{
background:#fff url('images/iconYoutube.gif') 3px 3px no-repeat;
}


.innerBoxHover .innerContent .linkedinIcon
{
float:left;
display:inline;
margin:2px 4px 0px 0px;
height:25px;
width:27px;
padding:0px;
border:none;
background:#000 url('images/iconLinkedinHover.gif') 0px -1px no-repeat;
}
.innerBoxHover .innerContent .linkedinIcon:hover
{
background:#fff url('images/iconLinkedin.gif') 4px 1px no-repeat;
}


.innerBoxHover .innerContent .myspaceIcon
{
float:left;
display:inline;
margin:2px 4px 0px 0px;
height:25px;
width:27px;
padding:0px;
border:none;
background:#000 url('images/iconMyspaceHover.gif') 3px 0px no-repeat;
}
.innerBoxHover .innerContent .myspaceIcon:hover
{
background:#fff url('images/iconMyspace.gif') 7px 2px no-repeat;
}



/* end icons */













.txtBox
{
float:left;
display:inline;
width:309px;
margin:2px 0px 0px 0px;
padding:0px 0px 5px 20px;
background:url('images/yDotted.gif') repeat-y;
}
.txtBox h2
{
display:block;
font-size:11px;
text-transform:uppercase;
margin:10px 0px 0px 0px;
padding:0px;
}
.txtBox p
{
display:block;
line-height:14px;
font-size:11px;
color:#2f2f2f;
margin:10px 20px 0px 0px;
padding:0px 0px 10px 0px;
}
.txtBox a
{
font-size:11px;
color:#2f2f2f;
text-decoration:none;
}
.txtBox a:hover
{
text-decoration:underline;
}
.txtBox .vcard
{
float:right;
display:inline;
width:auto;
margin:-25px 0px 0px 0px;
padding:0px;
}
.vcard a
{
float:left;
display:inline;
width:79px;
height:21px;
text-indent:-999999px;
margin:0px 0px 0px 0px;
padding:0px;
background:url('images/iconVcard.gif') no-repeat;
}


.intrested
{
float:right;
display:inline;
width:auto;
margin:0px 1px 0px 0px;
padding:0px;
}
.intrested a
{
float:left;
display:inline;
width:111px;
height:21px;
text-indent:-999999px;
margin:0px 0px 0px 0px;
padding:0px;
background:url('images/iconIntrested.gif') no-repeat;
}

.txtBox .innerContent
{
float:left;
display:inline;
margin:10px 0px 0px 0px;
padding:0px 0px 10px 0px;
}

.spacing
{
margin:11px 0px 0px 0px;
}

.hr
{
float:left;
display:inline;
width:303px;
height:1px;
font-size:1px;
overflow:hidden;
margin:2px 0px 0px 3px;
padding:0px 0px 0px 0px;
background:url('images/xDotted.gif') repeat-x;
}



#bottomTxt
{
float:left;
display:inline;
width:270px;
height:111px;
margin:-20px 0px 0px 0px;
padding:0px 0px 5px 20px;
background:url('images/yDotted.gif') repeat-y;
}
#bottomTxt h2
{
display:block;
font-size:11px;
text-transform:uppercase;
margin:10px 0px 0px 0px;
padding:0px;
}
#bottomTxt p
{
display:block;
line-height:14px;
font-size:11px;
color:#2f2f2f;
margin:10px 20px 0px 0px;
padding:0px 0px 10px 0px;
}


#contentFooter
{
float:left;
display:inline;
width:270px;
height:7px;
background:url('images/contentFooter.gif') no-repeat;
}

.footerIcons
{
float:right;
display:inline;
width:95%;
margin:0px 3px 0px 0px;
padding:0px;
}
/* end content*/



/* Scroll bar  */
.holder
{
float:left;
display:inline;
width:328px;
margin:20px 0px 25px 0px;
padding:0px 0px 0px 0px;
border-top:1px solid #000;
border-left:1px solid #000;
border-bottom:1px solid #000;
}


.scroll-pane {
	width:328px;
	height: 200px;
	overflow: auto;
	background: #ccc;
	display:inline;
	float: left;
}

.wide {
	width: 400px;
}

#scroll {
	height: 334px;
}

#scroll-2 {
	height: 434px;
}


.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	width:328px;
	z-index: 1;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	width:22px;
	background: #000000;
}
.jScrollPaneDrag {
	position: absolute;
	background: #fff url('images/dragg.gif') no-repeat;
	height:106px;
	width:22px;
	margin:0px 0px 0px 0px;
	cursor: pointer;
	overflow: hidden;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	background: #000000 url('images/scrollArrows.gif') 6px 6px no-repeat;
	height: 20px;
}

a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	background: #000000 url('images/arrowDownWithe.gif') 6px 6px no-repeat;
	height: 20px;
}