@charset "utf-8";

/* CSS Document */



/* Eric Meyer Reset */



html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }

:focus { outline: 0; }

body { line-height: 1; color: black; background: white; }

ol, ul { list-style: none; }

table { border-collapse: separate; border-spacing: 0; }

caption, th, td { text-align: left;	font-weight: normal; }

blockquote:before, blockquote:after, q:before, q:after { content: ""; }

blockquote, q { quotes: "" ""; }





/* BASIC

----------------------------------*/
.hide{
	display: none;
}

html { padding: 0px; }

body { 
background:#fff url(../img/bg.gif) repeat-y top left; 
font-family:Arial, Helvetica, sans-serif; 
font-size: 12px; 
line-height:18px; 
color:#666; 
height: 100%; 
margin: 0px; 
padding: 0px;
}



a {color:#009baa; text-decoration:none;}

a:hover {color:#006872; /*text-decoration: underline*/}

strong {color:#009baa; font-weight:bold}



.right {float:right; position:absolute; top:10px; right:10px;}

.clearing { clear: both; }  

.clearfix { overflow: hidden; }

.minitext {font-size:10px; color: #c3c3c3;}

.bold {font-weight:bold}



/* LEFT

----------------------------------*/

#container-left { position: fixed; height: 100%; width: 506px; left:0px; top:0px; 
	/*border:1px solid red;*/}



h1#logo { text-indent: -9999px;	overflow: hidden; width: 176px;	height: 128px; background-image: url("../img/prophets-logo.gif"); background-repeat: no-repeat; display: block; margin: 50px 164px 25px 164px; }



/* ACCORDION

----------------------------------*/

#accordion { padding-left:45px;}



h2 {padding-bottom:13px; width: 133px; }

h2 a{ text-indent: -9999px; overflow: hidden; width: 113px; height: 17px; background-image: url("../img/h2.gif"); background-repeat: no-repeat; display: block;}



#about h2 a{ background-position: 0px 0px; }

	#about h2 a:hover{ background-position: -200px 0px; }

#news h2 a{ background-position: 0px -17px; }

	#news h2 a:hover{ background-position: -200px -17px; }

#services h2 a{ background-position: 0px -34px; }

	#services h2 a:hover{ background-position: -200px -34px; }

#clients h2 a{ background-position: 0px -51px; }

	#clients h2 a:hover{ background-position: -200px -51px; }

#jobs h2 a{ background-position: 0px -68px; }

	#jobs h2 a:hover{ background-position: -200px -68px; }

#contact h2 { background-position: 16px -85px; text-indent: -9999px; overflow: hidden; width: 113px; height: 4px; background-image: url("../img/h2.gif"); background-repeat: no-repeat; display: block;}
#contact h2 .arrow { margin: 0px 5px 0px 0px; cursor: default !important;  background-position: 0px -34px !important;}
#contact p  {padding: 15px 0px 0px 16px; }
#contact a  {padding: 15px 0px 0px 16px; }





.resizer{padding-bottom: 13px; padding-left:17px;}

.resizer p {width: 405px; }

.arrow { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; width: 17px; height: 17px; background-image: url(../img/h2-arrows.gif); background-position: 0px -2px; cursor:pointer;}

.current .arrow {background-position: 0px -34px;}



/* ABOUT

----------------------------------*/



/* NEWS

----------------------------------*/

#twitterfeed { width: 425px; }

	#twitterfeed p{ padding-bottom: 17px; display:block; width: 425px;}



/* SERVICES

----------------------------------*/

#services li{width:230px;}

#services li a{ background-color:#ededed; display:block; width:230px; font-weight:bold; padding:2px 4px 2px 5px; border-bottom:1px solid #FFF; color:#009aa6;	-moz-border-radius: 4px; -webkit-border-radius: 4px; }

#services li a:hover{	background-color:#02b8c6; padding-left:5px;	color:#FFF; }



/* CLIENTS

----------------------------------*/

#clientlist{ width:220px;}

#clientlist li{ width:110px; float: left;}

#clientlist li a{ background-color:#ededed; display:block; width:100px; font-weight:bold; padding:2px 4px 2px 5px; border-bottom:1px solid #FFF; color:#009aa6;	-moz-border-radius: 4px; -webkit-border-radius: 4px; }

#clientlist li.checked a{ background-color:#E0E0E0; color:#009aa6; -moz-border-radius: 4px;	-webkit-border-radius: 4px; }

#clientlist li a:hover{	background-color:#02b8c6; padding-left:5px;	color:#FFF; }

#clientlist li#all-clients a{ background-color:#ffffff;	padding-left:6px;}

#clientlist li#all-clients a:hover{background-color:#02b8c6;}

#clientlist li#all-clients.checked a{ background-color:#E0E0E0; }

#clientlist li#all-clients.checked a:hover{ background-color:#02b8c6; }



/* JOBS

----------------------------------*/

#jobs li{width:190px;}

#jobs li a{ background-color:#ededed; display:block; width:190px; font-weight:bold; padding:2px 4px 2px 5px; border-bottom:1px solid #FFF; color:#009aa6;	-moz-border-radius: 4px; -webkit-border-radius: 4px; }

#jobs li a:hover{	background-color:#02b8c6; padding-left:5px;	color:#FFF; }



/* SORT

----------------------------------*/
/*
#sort_container{
	width: 50px;
	height: 300px;
	background: green;
	margin-left: 50px;
	display: none;
}

body{
	position: relative;
}
*/

#sort {	
	display:none;

	z-index: 888; 
	overflow:hidden; 
	top: 20px; 
	left: 440px; 
	width: 50px; 
	position: absolute; 
	text-align:right;
	/*
	border:1px solid red;
	*/
	}

#sort h2 {width:50px; text-align:left;}

#sort h2 a{background-position: 0px -102px; width:25px; float:left; margin-left:15px;_margin-left:6px;}

	#sort h2 a:hover{ background-position: -200px -102px; }

.arrowsort { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; width: 9px; height: 13px; background-image: url(../img/h2-arrows.gif); background-position: -5px -50px; cursor:pointer;}

.currentsort .arrowsort {background-position: -5px -64px;}



#filter li a{ background-color:#ededed;	display:block; height: 17px; font-size:10px; border-bottom:1px solid #FFF; color:#009aa6;	padding-right:6px; -moz-border-radius: 4px; -webkit-border-radius: 4px;}

#filter li#all a{ 	background-color:#ffffff; }

#filter li a:hover{ background-color:#02b8c6; color:#FFF;}

#filter li#all a:hover{ background-color:#02b8c6; }

#filter li.checked a{ background-color:#E0E0E0; }

#filter li#all.checked a{ background-color:#E0E0E0; }

#filter li#all.checked a:hover{ background-color:#02b8c6;}

/*
body{
	background: #ccc;
}
#container-right, #container-left {
	background: #fff;
	}
*/
	
/* RIGHT

----------------------------------*/
/*
body{
	background: red;
}
*/
#container-right {
	float: left;
	margin-left:506px !important; 
	z-index:100;
	display: inline; /*DAMN YOU IE6!*/
	/*
	border:1px solid red;
	max-width:450px;
	*/
	background: #eee !important;
	overflow: hidden !important;
	}
#inner-container{
	background: #fff !important;
	overflow: hidden !important;
	/*
	max-width:750px !important;
	*/
	}

	#container-right ul{
	/*
	max-width:700px !important;
	*/
	width: 605px !important;
	}

	#container-right li{ width: 150px; height: 150px; margin: 1px 0px 0px 1px; }

	
	#bg_right{
		display: block !important;
		width: 500px !important;
		height: 500px !important;
		z-index: 500 !important;
		position: absolute !important;
		left: 500px !important;
		
	}


/*CAPTIONSLIDE

----------------------------------*/

.boxgrid{ width: 130px; height: 130px; margin:10px; float:left; overflow: hidden; position: relative; }  

.boxgrid img{ position: absolute; top: 0; left: 0; border: 0; }

.boxcaption{ padding:10px; color:#FFF; float: left; position: absolute; background: #009baa; height: 130px;	width: 130px; opacity: .9; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90); -MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; cursor:pointer; }

.captionfull .boxcaption{ top: 150px; left: 0;}



.boxcaption h3 {font-size:16px; font-weight:bold;}

.boxcaption h4 {font-size:14px; font-weight:normal;}

p.short-description {font-size:11px; position:absolute; top:80px; width:130px; line-height:13px}

p.tags {font-size:10px; font-weight:bold; position:absolute; bottom:24px; width:130px; display:none;}



/* SOCIAL ICONS

----------------------------------*/

#social {width:25px; height: 100px; z-index: 998; overflow:hidden; top: 60px; 0px; left:0px; position: fixed; _position:absolute;}

#social .icons {width:25px; height:25px; text-indent: -9999px; overflow: hidden; background-image: url("../img/socialicons.gif"); background-repeat: no-repeat; display: block;}



#social .facebook {background-position:0px 0px;}

#social .twitter {background-position:0px -25px;}

#social .rss {background-position:0px -50px;}

#social .newsletter {background-position:0px -75px;}

#social .customerarea {background-position:0px -100px;}



#social a.facebook:hover{background-position:-25px 0px;}

#social a.twitter:hover{background-position:-25px -25px;}

#social a.rss:hover{background-position:-25px -50px;}

#social a.newsletter:hover{background-position:-25px -75px;}

#social a.customerarea:hover{background-position:-25px -100px;}



.tipsy {font-size: 10px; background-repeat: no-repeat;  background-image: url(../img/tipsy.gif); }

  .tipsy-inner { color: white; width: 135px; text-align: center; height:36px;}

  .tipsy-west { background-position: left center; }



/* SUPERBOX

----------------------------------*/

/* Base Superbox Styles */

#superbox-overlay{position:fixed;top:0;left:0;z-index:9998;width:100%;height:100%;}

#superbox-wrapper{position:fixed;z-index:9999;top:0;display:table;width:100%;height:100%; overflow:hidden;}

#superbox-container{position:relative;display:table-cell;width:100%;height:100%;margin:0;padding:0;vertical-align:middle; overflow:hidden;}

#superbox{margin:0 auto;padding:0; overflow:hidden;}

#superbox-container .loading{margin:0;text-align:center; overflow:hidden;}



/* IE7 */

*:first-child+html #superbox-container{position:absolute;top:50%;display:block; height:auto; overflow:visible;}

*:first-child+html #superbox{position:relative;top:-50%;display:block;}

/* IE6 - Thanks to Thickbox for IE expressions */

* html #superbox-container{position:absolute;top:50%;display:block;height:auto; overflow:visible;}

* html #superbox{position:relative;top:-50%;display:block;}

* html #superbox-overlay{position:absolute;height:expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight + 'px' : document.body.offsetHeight + 'px');}

* html #superbox-wrapper{position:absolute;margin-top:expression(0 - parseInt(this.offsetHeight / 2) + (document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');}



/* Default Theme */

#superbox-overlay{background:#000;}

#superbox-container .loading{text-align:center;font-size:40px;color:#fff;}

#superbox{}

#superbox-innerbox{}

#superbox.image{text-align:center;}

#superbox .close,

#superbox .nextprev{overflow:hidden;margin:0;}



/* POP

----------------------------------*/

#pop {width:676px; height:376px;}

	#pop .corner {width: 13px; height: 13px; background-image: url(../img/pop/corner.png); position:absolute; background-image: none\9; background-color:#009baa\9; }

	#pop #cornertopleft {background-position: 0px 0px; top:0px; left:0px; }

	#pop #cornertopright {background-position: -13px 0px; top:0px; left:663px; }

	#pop #cornerbottomleft {background-position: 0px -13px; top:363px; left:0px;}

	#pop #cornerbottomright {background-position: -13px -13px; top:363px; left:663px;}

	#pop .center {background-color:#009baa; height:13px; width:650px; position:absolute; left:13px}

	#pop .center-bottom {background-color:#009baa; height:13px; width:650px; position:absolute; left:13px; top:363px;}

	#pop #background {background-color:#009baa; height:350px; width: 676px; position:absolute; left:0px; top:13px;}

	

.transparant {	opacity: .5;}

	#pop #content {width:622px; height:322px; background-color:#FFF; position:absolute; left:13px;top:13px; border: 1px solid #555555; padding:13px; overflow:hidden;}

	#big { height: 225px; width: 400px; background-color: #0F0; float:left;}

	#big-links a{ margin-top:16px; background-image:url(../img/h2-arrows.gif); background-repeat:no-repeat; background-position:left top; padding-left:16px; display:block;}

	#thumbs {height: 45px; width: 328px; margin-top:13px; }

	#thumbs li{ height: 45px; width: 45px; margin-right:13px; float:left}

	#thumbs .more{ height: 45px; width: 130px; float:right; margin-right:0px; text-align:right}

	#beschrijving {position: absolute; left: 430px; width: 203px}

	#beschrijving h1 {font-size:18px; font-weight: bold;color:#009baa; margin: 13px 0px 13px 0px;}

	#beschrijving h2 {margin-bottom: 13px;}

	#beschrijving p {overflow:hidden; font-size:11px; line-height:16px; margin-bottom:16px;}

	

	.close {z-index:355; top:40px; left: 635px;position: relative; overflow: hidden;}

	.close a{text-indent: -9999px; overflow: hidden; width: 25px; height: 25px; background-image: url("../img/close.gif"); background-repeat: no-repeat; display: block;}

	.close a:hover{background-position: 0px -25px; cursor:pointer;}
	
	
.cover a {color:#FFF;}


div#work-big{
	width:622px; height:322px; 
	background-color: #fff; 
	position: absolute; 
	left: 13px;
	top: 13px; 
	border: 1px solid #555555; 
	padding: 13px; 
	overflow: hidden;
}
	div#work{
		overflow: hidden;
	}
	div#work h2{
		font-size: 16px;
		color: #009BAA;
		margin-bottom: -5px;
		width: auto;
	}
		div#image{
			float: left;
			width: 411px;
			height: 271px;
			position: relative;
		}
		div#image img{
			position: absolute;
			top: 0;
			left: 0;
		}
	div#work ul{
		float: right;
	}
		div#work ul li{
			padding-bottom: 9px;
		}
/* GENERIC STYLES */
.current{
	display: block;
}
.hidden{
	display: none;
}


/*people_wanted */

#people_wanted  {  width: 282px; height: 212px; position: fixed; top: 200px; left: 300px;   cursor: pointer;  }
#myFlashContent { z-index: 0;}
#people_wanted a { background: url('../img/close-peoplewanted.png') no-repeat scroll top left; position: absolute;	width: 37px; height: 8px; text-indent: -9988px;  display: block; margin: -33px 0 0 141px; z-index: 10; }


#people_wanted a { *margin: 183px 0px 0px -151px;  }

#news-nav  { padding: 0px 40px 0px 0px; list-style: disc; margin: 0px 0px 0px 12px; }
#news-nav li { color:#666;  padding: 0px 0px 7px 0px; list-style: disc; }
#news-nav li a {  }

/* getintouchform */
#getintouchform { padding: 23px 0px 20px 16px; width: 170px; }
#getintouchform .input { width: 170px; background: #ececec; border-top: 1px solid #d4d4d4; border-right: 1px solid #c5c5c5; border-left: 0px; border-bottom: 0px; margin: 0px 0px 10px 0px; font-size: 12px; color: #999999; padding: 6px 12px; }
#getintouchform .submit {  background: url('../img/getintouch-form-btn.png') no-repeat scroll top left; height: 34px; width: 142px; border: none; text-indent: -9988px; margin: 5px 0px 0px 0px;  cursor: pointer;}
#getintouchform .submit:hover {  background: url('../img/getintouch-form-btn.png') no-repeat scroll bottom left; }


 /* klein stukje van Steven */
 
 .forgot {
	color: #C00;
 }
 
 .thanks {
	font-size:13px; 
	font-weight: bold;
 }