/** default html elements */
body {
    text-align: left;	
}

/** layout start */
div#global-wrapper {
	position: relative;
    background: transparent url(../img/layout/footer.jpg) no-repeat center bottom;
	padding-bottom: 284px;
	width: 100%;
}

div#site-position-wrapper {
	position: relative;
	width: 974px;
	margin: 0 auto;
}

div#site-wrapper {
	margin-left: -2px; /** site 2 pixels naar links verschuiven zodat de stippellijn uitlijnt */
}

/******************************************************************/
/**************************** HEADER ******************************/
/******************************************************************/

div#top {
	position: relative;
	height: 124px;
}

/** logo */
div#top div#logo {
	float: left;
	margin-top: 26px;
}

div#top div#logo a {
	display: block;
	text-indent: -9000px;
	width: 274px;
	height: 72px;
	background: #fff url(../img/logo.gif) no-repeat left top;
}

/** search */
div#top div#search {
	position: absolute;
	top: 5px;
	right: 5px;
}

div#top div#search input.searchfield {
	display: block;
	float: left;
	width: 134px;
	height: 24px;
	background: url(../img/elements/search-bg.png) no-repeat left top;
	padding: 4px 20px 4px 7px;
	border: 0;
	margin: 0;
}

div#top div#search button { 
    float: left;
	cursor: pointer;
	display: block;
	width: 71px;
	height: 27px;
	margin: -1px 0 0 -15px;
	text-indent: -9000px;
	background: url(../img/elements/button-zoeken.png) no-repeat left top;
    border: 0;
}

/** navigation */
div#top div#nav {
	float: left;
    margin-top: 81px;
    margin-left: 73px;
}

div#top div#nav ul {
    position:absolute;
    z-index:999;
}

div#top div#nav ul li {
	float: left;
}

div#top div#nav ul li a {
	padding: 0 10px;
	color: #878787;
	text-transform: uppercase;
}

div#top div#nav ul li a:hover, div#top div#nav ul li a.clsLinkActive, div#top div#nav ul li a.clsLinkActiveTop {
    color: #111;
	text-decoration: none;
}

div#top div#nav ul li a.clsLinkActive, div#top div#nav ul li a.clsLinkActiveTop {
	position: relative;
	background: #D04660;
	color: #fff;
	padding: 3px 10px;
}

/** hoeken */
span.corner {
	position: absolute;
	width: 4px;
	height: 4px;
}

span.nw {
	top: 0;
	left: 0;
	background: url(../img/layout/nw.gif);
}
span.ne {
	top: 0;
	right: 0;
	background: url(../img/layout/ne.gif);
}
span.sw {
	bottom: 0;
	left: 0;
	background: url(../img/layout/sw.gif);
}
span.se {
	bottom: 0;
	right: 0;
	background: url(../img/layout/se.gif);
}

span.nw-sub {
	top: 0;
	left: 0;
	background: url(../img/layout/nw-sub.gif) no-repeat left top;
}
span.ne-sub {
	top: 0;
	right: 0;
	background: url(../img/layout/ne-sub.gif);
}
span.sw-sub {
	bottom: 0;
	left: 0;
	background: url(../img/layout/sw-sub.gif);
}
span.se-sub {
	bottom: 0;
	right: 0;
	background: url(../img/layout/se-sub.gif);
}

/** submenu's */

div#top div#nav ul li ul {
	margin-top: 3px;
	font-size: 11px;
	display: none;
	overflow: hidden;
}

div#top div#nav ul li ul li {
	float: left;
	margin-right: 2px;
}

div#top div#nav ul li ul li a {
	position: relative;
	width:125px;
	padding: 3px 10px;
	background: #B5DFE1;
	color: #444;
}

div#top div#nav ul li ul li a.clsLinkActive, div#top div#nav ul li ul li a:hover {
	color: #000;
	background: #B5DFE1;
}

/** header image */
div#header {
	position: relative;
	width: 974px;
	height: 557px;
	background: #fff url(../cms/domainfiles/1/layout/home.png) no-repeat left top;
	z-index: 2;
}

div#toploader {
	z-index: 1;
	position: absolute;
	top: 160px;
	left: 457px;
}

/** highlight */
div#header div#highlight {
	position: absolute;
	top: 77px;
	left: 37px;
}

div#header div#highlight h2 {
	color: #fff;
	text-transform: uppercase;
	text-shadow: 1px 1px 1px #bed4c6;
}

div#header div#highlight p {
	display: block;
	width: 250px;
	height: 63px;
	color: #fff;
	font-size: 13px;
	line-height: 1.4em;
	padding: 15px;
	background: transparent url(../img/elements/highlight-bg.png) no-repeat left top;
}

div#header div#highlight a.more {
	display: block;
	text-indent: -9000px;
	width: 88px;
	height: 33px;
	background: transparent url(../img/elements/button-leesmeer.png) no-repeat left top;
	margin: -22px 0 0 175px;
}

/******************************************************************/
/**************************** CONTENT *****************************/
/******************************************************************/

div#content-wrapper {
	min-height: 340px;
	z-index: 5;
	position: relative;
	margin: -325px 0 0 17px;
	width: 944px;
    background: transparent url(../img/layout/content-bg.png) no-repeat 0 72px;	
}

div#content-wrapper div.top {
	width: 944px;
	height: 72px;
	background: transparent url(../img/layout/content-top-bg.png) no-repeat left top;
}

div#content-wrapper>div.content {
	margin-top: -12px;	
}

div#content-wrapper div#main-wrapper div.content div.column-left {
    float: left;
    width: 48%; 
}

div#content-wrapper div#main-wrapper div.content div.column-right {
    float: right;
    width: 48%;
}

div#content-wrapper div#main-wrapper {
	float: left;
	width: 718px;
	margin-top: -50px;
}

div#content-wrapper div#main-wrapper div.content > ul {
    list-style: square;
    margin: 5px 16px;
}

div#content-wrapper div#main-wrapper div.top {
	height: 41px;
    background: transparent url(../img/layout/content-main-top.png) no-repeat left top;
}

div#content-wrapper div#main-wrapper div.content {
	padding: 0 18px 18px;
}

div#content-wrapper div#main-wrapper div.content table.results tr.odd{
	border:1px solid #ccc;
}

div#content-wrapper div#main-wrapper div.content table.results td{
	padding: 10px 5px 5px 5px;
	vertical-align:top;
}

div#content-wrapper div#main-wrapper div.content table.results tr.odd td{
	background-color:#ECF0F7;
}

div#content-wrapper div#main-wrapper div.content table.results tr.even td{
	background-color:#FFFFFF;
}

div#content-wrapper div#main-wrapper div.content table.results td a{
	color:#878787;
}

div#content-wrapper div#main-wrapper div.content h1 {
	margin-bottom: 0.25em;
	color: #414141;
	text-transform: uppercase;
	font-size: 18px;
}

div#content-wrapper div#main-wrapper div.content h2.searchresults {
	font-size:16px;
}

/** sidebar */
div#content-wrapper div#sidebar {
	float: right;
	position: relative;
    margin: -46px 0 0 1px;	
	width: 221px;
	overflow: hidden;
}

div#content-wrapper div#sidebar div.top {
    width: 221px;
	height: 28px;
    background: transparent url(../img/layout/sidebar-top.png) no-repeat left top;
}

div#content-wrapper div#sidebar div.content {
}

/** sidebar blocks */
div#sidebar div.block {
    margin: 10px;	
}

div#sidebar div.block h2 {
	color: #6b7777;
	text-transform: uppercase;
	font-size: 13px;
}

/** news */
div.news ul li a {
	display: block;
    padding: 1px;
	text-align: right;
	color: #6b7777;
}

div.news ul li a span.date {
	float: left;
	text-align: left;
	color: #869090;
}

div.news ul li a:hover {
	background: #ebf5f7;
}

/** overig */
div.overlay {
	position: absolute;
	top: 0;
	left: 0;
	background: #000;
	z-index: 1000;
}

.harhar {
	position: absolute;
	top: 100px;
	left: 480px;
	z-index: 1001;
}

div.loader {
	width: 31px;
	height: 31px;
	background: url(../img/elements/loader.gif) no-repeat center center;
	margin: 50px auto;
	text-indent: -9000px;
}

ul.services {
	list-style: none;
    width: 500px;
    margin: 0 auto;
}

ul.services li {
    font-size: 11px;
    margin-right: 15px;
	margin-bottom: 3px;
}

ul.services li a {
    display: block;
    padding-left: 25px;
}

ul.services li a.lastfm {
    background: url(../img/elements/lastfm.gif) no-repeat left center;
}
ul.services li a.linkedin {
    background: url(../img/elements/linkedin.gif) no-repeat left center;
}
ul.services li a.twitter {
    background: url(../img/elements/twitter.gif) no-repeat left center;
}
ul.services li a.flickr {
    background: url(../img/elements/flickr.gif) no-repeat left center;
}
ul.services li a.rss {
    background: url(../img/elements/rss.jpg) no-repeat left center;
}


/******************************************************************/
/**************************** FOOTER ******************************/
/******************************************************************/


/******************************************************************/
/********************** BUGFIXES / HACKS **************************/
/******************************************************************/

div.spacer { clear: both; }
div.float-left { float: left; }
div.float-right { float: right; }

/* float clearing for IE6 */
* html .clearfix{
  height: 1%;
  overflow: visible;
}

/* float clearing for IE7 */
*+html .clearfix{
  min-height: 1%;
}

/* float clearing for everyone else */
.clearfix:after{
  clear: both;
  content: ".";
  display: block;
  height: 0;
  visibility: hidden;
  font-size: 0;
}

/*************************** JSSCROLLPANE *****************************/

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

.jScrollPaneTrack {
    position: absolute;
    cursor: pointer;
    right:0;
    top:0;
    height: 100%;
    background: #ddd;
}
.jScrollPaneDrag {
    position: absolute;
    background: #999;
    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-color: #666;*/
    height: 9px;
}
a.jScrollArrowUp:hover {
    /*background-color: #f60;*/
}

a.jScrollArrowDown {
    display: block;
    position: absolute;
    z-index: 1;
    bottom: 0;
    right: 0;
    text-indent: -2000px;
    overflow: hidden;
    /*background-color: #666;*/
    height: 9px;
}
a.jScrollArrowDown:hover {
    /*background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
    /*background-color: #f00;*/
}

/************* TWITTER TICKER ***************************/

div#sidebar div.block h2.tut{
    color:white;
    font-family:"Myriad Pro",Arial,Helvetica,sans-serif;
    font-size:16px;
    padding:12px 0 0 35px;
    text-transform:uppercase;
    
    text-shadow:2px 1px 6px #333;
}

div#sidebar #twitter-ticker{
    width:200px;
    height:300px;
    background:url(../img/misc/twitter/slickbg.png) no-repeat #f5f5f5;
    color:#666666;
    display:none;
    -moz-border-radius:10px 10px 6px 6px;
    -khtml-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius:6px;
    text-align:left;
	margin-top: 30px;
}

div#twitter-ticker #tweet-container{
    height:230px;
    width:auto;
    overflow:hidden;
}

div#twitter-ticker #twitIcon{
    position:absolute;
    top:-25px;
    left:-10px;
    width:64px;
    height:64px;
}

div#twitter-ticker #top-bar{
    height:45px;
    background:url(../img/misc/twitter/top_bar.png) repeat-x;
    position:relative;
    -moz-border-radius:6px 6px 0 0;
}

div#twitter-ticker .tweet{
    padding:5px;
    margin:0 8px 8px;
    
    border:1px solid #F0F0F0;
    background:url(../img/misc/twitter/transparent.png);
    
    width:auto;
    overflow:hidden;
}

div#twitter-ticker .tweet .avatar,
div#twitter-ticker .tweet .user,
div#twitter-ticker .tweet .time{
    float:left;
}

div#twitter-ticker .tweet .time{
    text-transform:uppercase;
    font-size:10px;
    color:#AAAAAA;
    white-space:nowrap;
}


div#twitter-ticker .tweet .avatar img{
    width:36px;
    height:36px;
    border:2px solid #eeeeee;
    margin:0 5px 5px 0;
}

div#twitter-ticker .tweet .txt{
    clear:both;
}

div#twitter-ticker .tweet .user{
    font-weight:bold;
}

div#twitter-ticker a, a:visited {
    color:#00BBFF;
    text-decoration:none;
    outline:none;
}

div#twitter-ticker a:hover{
    text-decoration:underline;
}

div#twitter-ticker #loading{
    margin:100px 95px;
}

/*************************************************************************************************
 * FORMULIER OPMAAK
 *************************************************************************************************/
	table.form
	{
		border-collapse:			separate;
		border-spacing:				10px;
		
		*border-collapse:			expression('separate', cellSpacing = '10px');
		
		margin-left:				-10px;
	}
	
	tr#toppie td
	{
		vertical-align:				top !important;
	}
	
	.req
	{
		font-size:					13px;
		color:						#DF3737;
		text-align:					center;
	}
	
	textarea
	{
		font-size:					13px;
		color:						#4F4F4F;
		
		border:						1px solid #C1C1C1;
		
		width:						250px;
		height:						150px;
	}
	
	select
	{
		font-size:					13px;
		color:						#4F4F4F;
		
		border:						1px solid #C1C1C1;
		
		width:						250px;
		height:						23px;
	}
	
	input.text
	{
		font-size:					13px;
		color:						#4F4F4F;
		
		border:						1px solid #C1C1C1;
		
		width:						250px;
		height:						25px;
	}
	
	input.button
	{
		cursor:						pointer;
		
		width:						250px;
		height:						25px;
	}
	
	.clsInfBlock
	{
		font-family:				verdana,arial;
		color:						#000000;
		line-height:				18px;
		font-size:					11px;
		
		width:						600px;
		
		display:					block;
		padding:					15px;
		
		background-color:			#D6DDE1;
		border:						1px solid #5E5D98;
		border-top:					3px solid #5E5D98;
	}
	
	.clsInfBlock img
	{
		margin-right:			15px;
	}