/* CSS design by Pixelman.be | V1.0 13/04/2009/ */

/* You may adapt elements of this CSS in your own projects, but the unique combination of images, colors, sizes, typography, and positioning ("the design") is copyright protected by Pixelman */

/* CSS tested on:

	MAC OSX  
	- Safari 2.0: OK
	- IE 5.2.3: NOT TESTED
	- Firefox(Mozilla 5) 2.0: OK

	MAC OS9
	- IE 5.0: NOT TESTED

	PC WIN98
	- IE 5.0: NOT TESTED

	PC WINXP WIN2000 VISTA
	- IE 6.0: OK
	- IE 7.0: OK
	- Firefox(Mozilla 5) 2.0: OK


*/

/*********************** basics ***********************/

body {
	margin: 0;
	padding: 0;
	color: #000;
	font-family: "Lucida Grande", "Lucida Grande", Geneva, Arial, Verdana, sans-serif;
	font-size: 12px;
	/*background: #2e2e30 url(../images/traceimage_home.jpg) no-repeat 0 0;	*/
	background-color: #2e2e30;	
	}
	
html, dl, div, img, swf, form { 
	margin: 0; 
	padding: 0;
	}
	
a {
	text-decoration: none;
	}

a:hover {
	text-decoration: underline;
	}	

*:focus {
	outline: none; /*remove blue border in safari & firefox */
	}
 
a img { /*remove borders on linked images */
	border: none;
	}

#site { /* whole site */
	position: absolute;
	margin: 0;
	padding: 0;
	/*border: solid 1px black;*/
	float: left;
	width: 100%;
	}

/*********************** header elements ***********************/

#headerbg {
	position: relative;
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
	width: 100%;
	background: #bf1724 url(../images/bg_thisconnect.jpg) repeat-x 0 0;
	/*background: #cf5300 none repeat 0 0;*/
	/*border: solid 1px #000;*/
	float: left;
	height: 600px;
	}

body#project #headerbg {
	background: #cdbda4 url(../images/bg_thisconnect.jpg) repeat-x 0 0;
	/*background: #cdbda4 url(../images/bg_greenmesh.jpg) repeat-x 0 0;*/
	/*background: #cf5300 none repeat 0 0;*/
	}

body#projects #headerbg {
	background: #cdbda4 url(../images/bg_thisconnect.jpg) repeat-x 0 0;
	/*background: #cf5300 none repeat 0 0;*/
	}

body#blog #headerbg {
	background: #cdbda4 url(../images/bg_thisconnect.jpg) repeat-x 0 0;
	/*background: #cf5300 none repeat 0 0;*/
	}

body#entry #headerbg {
	background: #cdbda4 url(../images/bg_thisconnect.jpg) repeat-x 0 0;
	/*background: #cf5300 none repeat 0 0;*/
	}

body#about #headerbg {
	background: #cdbda4 url(../images/bg_thisconnect.jpg) repeat-x 0 0;
	/*background: #cf5300 none repeat 0 0;*/
	}

#header {
	position: relative;
	margin: 0;
	padding: 0;
	/*border: solid 1px #000;*/
	/*height: 300px;*/	}

#banner {
	position: absolute;
	top: 0;
	left: 218px;
	margin: 0;
	padding: 0;
	height: 600px;
	background-color:#fff;
	/*border: solid 1px #000;*/	
	}

#banner2 {
	position: absolute;
	top: 0;
	left: 218px;
	margin: 0;
	padding: 0;
	height: 280px;
	height: 300px;
	/*border: solid 1px;*/
	}

.loader {
	position: absolute;
	top: 140px;
	left: 335px;
	margin: 0;
	padding: 0;
	height: 10px;
	/*border: solid 1px #000;*/	
	}


#logo {
	position: absolute;
	border: none;
	top: 30px;
	left: 50px;
	margin: 0;
	padding: 0;
	width: 114px;
	height: 113px;
	z-index: 10;
}

#logo a {
	position: absolute;
	display: block;
	border: none;
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
	width: 114px;
	height: 113px;
	z-index: 10;
	/*border: solid 1px #000;*/
	background: transparent url(../images/logo_thisconnect.png) no-repeat top left;	
	}

#logo a:hover {
	background: transparent url(../images/logo_thisconnect.png) no-repeat bottom left;
	text-decoration: none;
}

/******* filterby *******/

.togglebutton {
	position: absolute;
	right: 20px;
	top: 25px;
	/*border: solid 1px black;*/
	z-index: 10;
	}

.togglebutton a {
	position: relative;
	display: block;
	height: 12px;
	width: 14px;
	}

#filterby.open .togglebutton a {
	background: transparent url(../images/arrow_down_grey.png) 0 0 no-repeat;
	}

#filterby.close .togglebutton a {
	background: transparent url(../images/arrow_up_grey.png) 0 0 no-repeat;
	}

#filterby.open .togglebutton a:hover {
	background: transparent url(../images/arrow_down_white.png) 0 0 no-repeat;
	}

#filterby.close .togglebutton a:hover {
	background: transparent url(../images/arrow_up_white.png) 0 0 no-repeat;
	}



#filterby.open {
	position: absolute;
	left: 0;
	bottom: 0;
	margin: 0;
	padding: 20px 20px 10px 20px;
	width: 720px;
	/*border: solid 1px;*/
	background-color: #474747;
	float: left;
	}

#filterby.close {
	position: absolute;
	left: 0;
	/*bottom: -75px;*/
	top: 240px;
	margin: 0;
	padding: 20px 20px 10px 20px;
	width: 720px;
	/*border: solid 1px;*/
	background-color: #474747;
	float: left;
	}

#banner2 h2 {
	position: relative;
	margin: 0 30px 20px 0;
	padding: 0;
	color: #C2CF00;
	text-shadow: #333 0 0 0;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 18px;
	line-height: 21px;
	font-weight: normal;
	font-style: normal;
	text-align: right;
	}

#banner2 ul {
	position: relative;	
	margin: 0 0 0 0;
	padding: 0;
	list-style: none;
	font-size: 10px;
	color: #a3a3a3;
	clear: both;
	display: block;
	/*border: solid 1px black;*/
	width: 720px;
	}

#banner2 li {
	position: relative;
	margin: 0 0 0 0;
	padding: 0 0 15px 0;
	float: left;
	display: block;
	}

#banner2 li a {
	position: relative;
	float: left;
	margin: 0;
	padding: 0 20px 0 25px;
	display: block;
	line-height: 15px;
	color: #a3a3a3;
	text-decoration: none;
	height: 15px;
	background: transparent url(../images/checkbox.png) top left no-repeat;
	}

#banner2 li.on a {
	background: transparent url(../images/checkbox.png) bottom left no-repeat;
	}

#banner2 li a:hover {
	color: #fff;
	text-decoration: none;
	}

/******* topnav elements *******/

#topnav {
	position: absolute;
	top: 15px;
	left: 72px;
}

#topnav ul {
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
}

#topnav li {
	position: relative;
	margin: 0;
	padding: 0;
	float: left;
}

#topnav li a {
	position: relative;
	margin: 0 5px 0 0;
	padding: 0;
	float: left;
	display: block;
	color: #5e5e5e;
	text-transform: uppercase;
	font-size: 10px;
}

#topnav li.current a {
	color: #C2CF00;
	text-decoration: none;
}

#topnav li a:hover {
	color: #C2CF00;
	text-decoration: none;
}




/******* nav open elements *******/
#navbox.open {
	/*display: none;*/
	}


#navbox.open #navbg {
	position: absolute;
	top: 0;
	left: 0;
	height: 600px;
	width: 218px;
	/*width: 10px;*/
	background-color: #191919;	
	}


#navbg2 {
	position: absolute;
	top: 0;
	left: 0;
	height: 600px;
	width: 218px;
	/*width: 10px;*/
	background-color: transparent;	
	/*border: solid 1px white;*/
	}


#navbox.open #navbg_shadow {
	display: none;
	}

#navbox.open #nav {
	position: absolute;
	top: 150px;
	left: 71px;
	z-index: 10;
	font-family: "Klavika-Medium", "Lucida Grande","Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 13px;
	line-height: 16px;
	text-shadow: #333 0 0 0; /* making fonts less bold in safari*/ 
	}

#navbox.open #nav ul {
	position: relative;
	margin: 0;
	padding: 0;
	bottom: 0;
	left: 0;
	list-style: none;
	}

#navbox.open #nav ul li {
	position: relative;
	margin: 0;
	padding: 0;
	display: block;
	}

#navbox.open #nav ul li a {
	position: relative;
	margin: 0;
	padding: 0;
	display: inline-block;
	display: block;
	width: 135px;
	color: #5E5E5E;
	text-transform: uppercase;
	height:17px;
	font-weight: bold;
	/*border: solid 1px white;*/
	}

#navbox.open #nav ul li a:hover,
#navbox.open #nav ul li.current a {
	color: #C2CF00;
	/*color: #FFF;*/
	text-decoration: none;
	background: transparent url(../images/arrow_left_white.png) 120px 0 no-repeat;
	}

#navbox.open #nav ul li.current a {
	cursor: default;
	}

/******* nav close elements *******/

#navbox.close {
	/*display: none;*/
	}

	
#navbox.close #navbg_shadow {
	position: absolute;
	top: 0;
	left: 10px;
	width: 10px;
	float: left;
	background: transparent url(../images/bg_nav_shadow.png) 0 0 no-repeat;
	height: 600px;
	/*border: solid 1px black;*/
	}


#navbox.close #navbg {
	position: absolute;
	top: 0;
	left: 0;
	height: 600px;
	width: 10px;
	/*width: 10px;*/
	background-color: #191919;	
	}

#navbox.close #nav {
	position: absolute;
	top: 150px;
	left: 20px;
	z-index: 10;
	font-family: "Klavika-Medium", "Lucida Grande","Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 13px;
	text-shadow: #333 0 0 0; /* making fonts less bold in safari*/ 
	}

#navbox.close #nav ul {
	position: relative;
	margin: 0;
	padding: 0;
	bottom: 0;
	left: 0;
	list-style: none;
	}

#navbox.close #nav ul li {
	position: relative;
	margin: 0;
	padding: 0;
	display: block;
	height: 16px;
	height: 17px;
	}

#navbox.close #nav ul li a {
	display: none;
	position: relative;
	margin: 0;
	padding: 0 0 0 51px;
	width: 135px;
	color: #5E5E5E;
	font-weight: bold;
	text-transform: uppercase;
	/*border: solid 1px white;*/
	}

#navbox.close #nav ul li.current a {
	color: #fff;
	display: block;
	/*color: #FFF;*/
	text-decoration: none;
	background: transparent url(../images/arrow_right_white.png) 10px 0 no-repeat;
	}

#navbox.close #nav ul li.current a {
	cursor: default;
	}

#navbox.close #topnav {
	display: none;
	}



/******* subnav elements *******/

.subnav {
	position: relative;
	margin: 0;
	color: #191919;
	}

.subnav ul {
	left: 45px;
	position: relative;
	/*margin: 0 0 15px 0;*/
	margin: 0 0 0 0;
	padding: 0;
	list-style: none;
	font-size: 11px;
	color: #191919;
	width: 170px;
	}

.subnav li {
	position: relative;
	margin: 0;
	padding: 0 0 0 0;
	line-height: 16px;
	}

.subnav.date li {
	position: relative;
	margin: 0;
	padding: 0 0 0 25px;
	line-height: 16px;
	}

.subnav.tags li {
	position: relative;
	margin: 0;
	padding: 0 0 0 25px;
	line-height: 16px;
	}



.subnav li a {
	position: relative;
	margin: 0;
	padding: 0 0 0 25px;
	line-height: 18px;
	color: #8c8c8c;
	color: #191919;
	text-decoration: none;
	}
	
.subnav li.current a {
	background:transparent url(../images/arrow_right_black.png) no-repeat scroll 0 -1px;
	color:#191919;
	font-weight:bold;
	text-decoration:none;
}	

.subnav li a:hover {
	color: #000;
	text-decoration: none;
	background: transparent url(../images/arrow_right_black.png) 0 -1px no-repeat;
	}

.subnav .date {
	padding: 0 0 0 25px;
	color: #191919;
	font-weight: bold;
	}


/******* subsubnav elements next/prev entry *******/

#subsubnav {
	position: relative;
	margin: 20px 0 0 0;
	color: #191919;
	font-size: 11px;
	color: #191919;
	}

#subsubnav dl {
	position: relative;
	margin: 0;
	padding: 0;
	}

#subsubnav dd {
	position: relative;
	margin: 0 0 0 0;
	padding: 0;
	float: left;
	display: block;
	}

#subsubnav dd a {
	position: relative;
	margin: 0 20px 0 0;
	padding: 0;
	display: block;
	float: left;
	height: 14px;
	z-index: 10;
	/*border: solid 1px black;*/
	}


#subsubnav dd.prev a {
	background: transparent url(../images/arrow_left_grey.png) 0 0 no-repeat;
	}

#subsubnav dd.next a {
	background: transparent url(../images/arrow_right_grey.png) 0 0 no-repeat;
	}

#subsubnav dd.prev.active a {
	background: transparent url(../images/arrow_left_black.png) 0 0 no-repeat;
	}

#subsubnav dd.next.active a {
	background: transparent url(../images/arrow_right_black.png) 0 0 no-repeat;
	}

#subsubnav dd a img {
	border: none;
	text-decoration: none;
	}

#subsubnav dd.prev a:hover {
	background: transparent url(../images/arrow_left_black.png) 0 0 no-repeat;
	}

#subsubnav dd.next a:hover {
	background: transparent url(../images/arrow_right_black.png) 0 0 no-repeat;
	}



#subsubnav dt {
	position: relative;
	margin: 0;
	padding: 0;
	height: 14px;
	}


/******* medianav elements *******/

#medianav {
	}

#medianav ul {
	position: absolute;
	top: 20px;
	right: 20px;
	margin: 0 0 0 0;
	padding: 0;
	list-style: none;
	}

#medianav li {
	position: relative;
	margin: 0 0 0 10px;
	padding: 0 0 0 0;
	line-height: 16px;
	float: left;
	}

#medianav li a {
	position: relative;
	margin: 0;
	padding: 0;
	text-decoration: none;
	display: block;
	float: left;
	height: 10px;
	width: 10px;
	/*border: solid 1px black;*/
	background: transparent url(../images/bullet_image_small.gif) 0 0 no-repeat;
	}

#medianav li a:hover,
#medianav li.selected a {
	text-decoration: none;
	background: transparent url(../images/bullet_image_big.gif) 0 0 no-repeat;
	}

#medianav li.selected a {
	cursor: default;
	}


#medianav.similarproj ul {
	position: relative;
	top: 0;
	left: -10px;
	margin: 0 0 0 0;
	padding: 0;
	list-style: none;
	}


/*********************** content elements ***********************/

#content {
	position: absolute;
	margin: 0 0 0 0;
	padding: 0 0 0 ;
	top: 300px;
	left: 0;
	/*right: 0;*/
	/*border: solid 1px red;*/
	background-color: #E8E8E8;
	width: 100%;
	}

body#project #content {
	top: 370px;
	}

body#projects #content {
	/*top: 280px;*/
	top: 300px;
	}

body#blog #content {
	/*top: 280px;*/
	top: 300px;
	}

body#entry #content {
	top: 370px;
	}

#contentbg {
	position: absolute;
	top: -10px;
	left: 0;
	width: 100%;
	float: left;
	background: transparent url(../images/bg_footernav_shadow.png) bottom left no-repeat;
	_background: transparent none;
	height: 10px;
	/*border: solid 1px black;*/
	}
	

.contentwrap {
	position: relative;
	margin: 0;
	padding: 0;
	background-color: #fff;
	width: 978px;
	float: left;
	display: block;
	}


#contentleft {
	position: relative;
	margin: 0;
	padding: 50px 0 0 0;
	width: 216px;
	display: block;
	/*border: solid 1px black;*/
	float: left;
	}

#contentright {
	position: relative;
	margin: 0;
	padding: 0 0 30px 0;
	width: 758px;
	display: block;
	/*border: solid 1px black;*/
	float: left;
	min-height:160px;
	height:auto !important;
	height:160px;
	}

#contentright h1 {
	position: relative;
	margin: 40px 10px 10px 0;
	font-size: 28px;
	font-family: "Klavika-light", "Lucida Grande", Arial, Helvetica, sans-serif;
	line-height: 29px;
	color: #FF7800;
	font-weight: normal;
	/*text-shadow: #333 0 0 0; /* making fonts less bold in safari*/
	}

#contentright h1 a {
	position: relative;
	/*display: block;*/
	display: inline;
	color: #FF7800;
	margin: 0 0 0 0;
	padding: 0 30px 0 0;
	/*border: solid 1px black;*/
	text-decoration: none;
	}

#contentright h1 a .arrow_left {
	position: relative;
	display: inline-block;
	margin: 0 0 0 10px;
	padding: 0 0 0 0;
	height: 14px;
	width: 12px;
	/*border: solid 1px black;*/
	text-decoration: none;
	background: transparent url(../images/arrow_left_grey.png) no-repeat 0 0;
	}

#contentright h1 a:hover .arrow_left {
	background: transparent url(../images/arrow_left_black.png) no-repeat 0 0;
	}



#contentright h1 a:hover {
	text-decoration: none;
	color: #191919;
	}

#contentright h4 {
	position: absolute;
	margin: 0 0 0 0;
	top: 25px;
	left: 0;
	font-size: 11px;
	font-family: "Klavika-Medium", "Lucida Grande", Arial, Helvetica, sans-serif;
	line-height: 15px;
	color: #191919;
	font-weight: normal;
	/*text-shadow: #333 0 0 0; /* making fonts less bold in safari*/
	}

#contentright p {
	position: relative;
	margin: 0 80px 0 0;
	font-size: 16px;
	font-family: Georgia, "Times New Roman", Times, serif;
	line-height: 21px;
	/*color: #A3A3A3;
	color: #8E8E8E;*/
	color: #636363;
	font-weight: normal;
	}

#contentright p a {
	color: #636363;
	font-weight: normal;
	text-decoration: none;
	border-bottom: solid 1px #8E8E8E;
	}

#contentright p a:hover {
	color: #000;
	text-decoration: none;
	border-bottom: solid 1px #000;
	}


/*** contentoptions ***/


.contentoptions {
	position: relative;
	margin: 0;
	padding: 10px 0 10px 0;
	width: 100%;
	display: block;
	border-top: dotted 1px #b2b2b2;
	/*border-bottom: dotted 1px #8c8c8c;*/
	float: left;
	}

.contentleft2 {
	position: relative;
	margin: 0;
	padding: 0 0 0 0;
	width: 216px;
	display: block;
	/*border: solid 1px black;*/
	float: left;
	}

.contentright2 {
	position: relative;
	margin: 0;
	width: 758px;
	display: block;
	/*border: solid 1px black;*/
	float: left;
	}

.contentright2 ul {
	position: relative;
	margin: 0;
	padding: 0;
	display: block;
	float: left;
	list-style: none;
	font-size: 11px;
	}

.contentright2 li {
	position: relative;
	margin: 0 20px 0 0;
	padding: 0;
	display: block;
	float: left;
	}

.contentright2 li a {
	position: relative;
	margin: 0;
	padding: 0;
	display: block;
	float: left;
	color: #8c8c8c;
	}

.contentright2 li a:hover {
	color: #191919;
	text-decoration: none;
	}




/******** project elements ********/

#projectsbox {
	background-color: #F3F3F3;
	margin: 0 0 0 0;
	padding: 0 0 80px 0;
	width: 978px;
	
	}

#projectsbox h3 {
	position: absolute;
	font-family: "Klavika-Medium", "Lucida Grande", Arial, Helvetica, sans-serif;
	z-index: 10;
	font-size: 10px;
	font-weight: normal;
	text-transform: uppercase;
	margin: 0 0 0 0;
	left: 70px;
	top: 20px;
	}

	
#project_nav {
	position: relative;
	width: 978px;
	padding: 0 0 0 0;
	/*border-right: solid 2px #FFF;*/
	float: left;
	}

.project {
	position: relative;
	float: left;
	margin: 0 0 0 0;
	padding: 19px 19px 0 19px;
	width: 150px;
	/*border-top: solid 1px #DDD;*/
	border-bottom: solid 1px #DDD;
	border-right: solid 2px #FFF;
	display: block;
	min-height:240px;
	height:auto !important;
	height:240px;
	background-color: #F3F3F3;
	}

.project img {
	position: relative;
	/** AANGEPAST */
	/**width: 150px;*/
	/**height: 150px;*/
	/*border-top: solid 1px #DDD;*/
	/*border-right: solid 2px #FFF;*/
	display: block;
	/*filter:alpha(opacity=85);
	-moz-opacity:.85;
	opacity:.85;*/
	filter:alpha(opacity=100);
	-moz-opacity:1.0;
	opacity:1.0;
	}

.project img:hover {
	filter:alpha(opacity=100);
	-moz-opacity:1.0;
	opacity:1.0;
	}

.project:hover {
	background-color: #FFF;
	/*border-top: solid 1px #FFF;*/
	border-bottom: solid 1px #FFF;
	}


.project#first {
	padding: 19px 19px 0 48px;
	}

.project#last {
	border-right: none;
	margin: 0 0 0 0;
	padding: 19px 19px 0 19px;
	}

.project h2 {
	position: relative;
	margin: 20px 0 0 0;
	padding: 0;
	width: 150px;
	font-size: 17px;
	font-family: "Klavika-Light","Lucida Grande", Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #000;
	line-height: 20px;
	}

.project h4 {
	position: relative;
	width: 150px;
	font-size: 12px;
	font-family: Georgia;
	margin: 10px 0 0 0;
	padding: 0;
	font-weight: normal;
	color: #8C8C8C;
	line-height: 15px;
	}

.project a {
	color: #000;
	}
	
.project a:hover {
	color: #000;
	text-decoration: none;
	}


/******** blog elements ********/

#blogbox #contentright {
	min-height:140px;
	height:auto !important;
	height:140px;
	position: relative;
	margin: 0;
	width: 758px;
	display: block;
	/*border: solid 1px black;*/
	float: left;
	}

#blogbox #contentright3 {
	position: relative;
	margin: 0;
	width: 758px;
	display: block;
	/*border: solid 1px black;*/
	float: left;

	}



#blogbox {
	background-color: #FFF;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	width: 978px;
	/*border: solid 1px black;*/
	
	}

#blogbox h3 {
	position: absolute;
	font-family: "Klavika-Medium", "Lucida Grande", Arial, Helvetica, sans-serif;
	z-index: 10;
	font-size: 10px;
	font-weight: normal;
	text-transform: uppercase;
	margin: 0 0 0 0;
	left: 70px;
	top: 20px;
	}

	
#blog_nav {
	position: relative;
	width: 978px;
	padding: 0 0 0 0;
	/*border-right: solid 2px #FFF;*/
	float: left;
	}

.entry {
	position: relative;
	float: left;
	margin: 0 0 0 0;
	padding: 0 0 40px 0;
	width: 978px;
	border-top: dotted 1px #b2b2b2;
	display: block;
	min-height: 175px;
	height: auto !important;
	height: 175px;
	/*background-color: #F3F3F3;*/
	background-color: #FFF;
	}

.entry_thumb {
	position: relative;
	top: 30px;
	right: 30px;
	float: right;
	width: 150px;
	height: 150px;
	/*border: solid 1px black;*/
	display: block;
	}


.entry_thumb img {
	position: relative;
	width: 150px;
	border: none;
	display: block;
	float: left;
	}

.entry#first {
	border-top: none;

	}


.entry h1 {
	position: relative;
	margin: 40px 10px 10px 0;
	width: 560px;
	}

.entry h2 {
	position: relative;
	margin: 20px 0 0 0;
	padding: 0;
	width: 150px;
	font-size: 17px;
	font-family: "Klavika-Light","Lucida Grande", Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #000;
	line-height: 20px;
	}

.entry h4 {
	position: relative;
	width: 150px;
	font-size: 12px;
	font-family: Georgia;
	margin: 10px 0 0 0;
	padding: 0;
	font-weight: normal;
	color: #8C8C8C;
	line-height: 15px;
	}

.entry a {
	color: #000;
	}
	
.entry a:hover {
	color: #000;
	text-decoration: none;
	}

.entry p {
	width: 560px;
	}


	
/*********************** footer elements ***********************/

#footerparent.open #footerbg {
	position: relative;
	/*position: fixed;*/
	bottom: 0;
	margin: 0 0 0 0;
	padding: 0;
	float: left;
	width: 100%;
	color: #757575;
	font-size: 10px;
	background: #242424 url(../images/bg_footerbottom.jpg) repeat-x bottom left;
	}

#footerparent.close #footerbg {
	position: relative;
	/*position: fixed;*/
	bottom: 0;
	margin: 0 0 0 0;
	padding: 0;
	float: left;
	height: 10px;
	width: 100%;
	color: #757575;
	font-size: 10px;
	background: #242424 url(../images/bg_footerbottom.jpg) repeat-x bottom left;
	}


#footerparent.open #footer {
	position: relative;
	margin: 0;
	padding: 0;
	background-color: #242424;
	float: left;
	width: 978px;
	}

#footerparent.close #footer {
	display: none;
	}


#footernav {
	position: absolute;
	top: -25px;
	left: 0;
	width: 100%;
	float: left;
	/*background: transparent url(../images/bg_footernav_shadow.png) bottom left no-repeat;*/
	/*background: none;*/
	height: 25px;
	font-family: "Klavika-Medium", "Lucida Grande", Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 13px;
	text-transform: uppercase;
	color: #8c8c8c;
	}

#footernav ul {
	position: relative;
	top: 0;
	left: 45px;
	width: 978px;
	margin: 0;
	padding: 0;
	list-style: none;
	}

#footernav li {
	position: relative;
	margin: 0;
	padding: 0;
	float: left;
	}

#footernav li a {
	position: relative;
	margin: 0 25px 0 0;
	padding: 0;
	float: left;
	display: block;
	color: #8c8c8c;
	text-decoration: none;
	}

#footernav li a:hover {
	color: #191919;
	text-decoration: none;
	}

#footernav li.current a {
	color: #191919;
	padding: 0 0 0 20px;
	text-decoration: none;
	background: transparent url(../images/arrow_down_grey.png) no-repeat 0 0;
	}

#footernav li.current a:hover {
	color: #191919;
	padding: 0 0 0 20px;
	text-decoration: none;
	background: transparent url(../images/arrow_down_black.png) no-repeat 0 0;
	}


/*#footerparent.open #footertop {
	position: relative;
	padding: 30px 0 0 0;
	width: 100%;
	clear: both;
	height: 220px;
	overflow: hidden;
	}*/
	
#footertop {
	position: relative;
	padding: 0 0 0 0;
	width: 100%;
	clear: both;
	height: 0;
	overflow: hidden;
	}

#footerbottom {
	position: relative;
	width: 100%;
	height: 40px;
	clear: both;
	background: transparent url(../images/bg_footerbottom.jpg) repeat-x 0 0;
	}

#footerbottom p {
	position: relative;
	margin: 0 0 0 0;
	padding: 0;
	left: 50px;
	top: 15px;
	}

#footerbottom a {
	color: #757575;
	text-decoration: none;
	}

#footerbottom a:hover {
	color: #9A9A9A;
	text-decoration: none;
	}


.footerbox {
	position: relative;
	margin: 0 0 40px 0;
	width: 100%;
	float: left;
	}

.footerbox h3 {
	position: relative;
	margin: 0 0 25px 0;
	padding: 0;
	color: #C2CF00;
	text-shadow: #333 0 0 0;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 18px;
	line-height: 21px;
	font-weight: normal;
	font-style: normal;
	}

.footerbox p {
	position: relative;
	margin: 0;
	padding: 0;
	color: #757575;
	font-size: 10px;
	line-height: 16px;
	font-weight: normal;
	font-style: normal;
	}

.footerbox a {
	color: #C2CF00;
	}

.footerbox a:hover {
	color: #fff;
	text-decoration: none;
	}

#footerjump {
	position: relative;
	/*border: solid 1px red;*/
	width: 1px;
	height: 1px;
	display: block;
	z-index: 3000;
}


/******* footer links elements *******/


.footerbox ul {
	left: 0;
	position: relative;
	margin: 0 0 15px 0;
	padding: 0;
	list-style: none;
	font-size: 10px;
	color: #191919;
	}

.footerbox li {
	position: relative;
	margin: 0;
	padding: 0 0 0 0;
	line-height: 16px;
	}

.footerbox li a {
	position: relative;
	margin: 0;
	padding: 0 0 0 25px;
	line-height: 18px;
	color: #757575;
	text-decoration: none;
	}

.footerbox li a:hover {
	color: #fff;
	text-decoration: none;
	background: transparent url(../images/arrow_right_grey.png) 0 -1px no-repeat;
	}

/******* footer form elements *******/

.contactform_left {
	position: relative;
	width:230px;
	float: left;
	/*border: solid 1px black;*/
	}

.contactform_right {
	position: relative;
	width: 242px;
	float: left;
	/*border: solid 1px black;*/
	}
.contactform_right img{
	position: relative;
	left: 5px;
	width: 160px;
}

.footerbox .field01 {
	position: relative;
	margin: 0 6px 6px 0;
	padding: 10px 10px 0 10px;
	height: 20px;
	border: none;
	background-color: #474747;
	color: #191919;
	font-size: 13px;
	font-weight: normal;
	}

.footerbox .textarea01 {
	position: relative;
	margin: 0 0 6px 6px;
	padding: 10px 8px 0 8px;
	*padding: 10px 8px 4px 8px;
	height: 92px;
	border: none;
	background-color: #474747;
	color: #191919;
	font-size: 13px;
	overflow: hidden;
	resize:none;
	font-family: "Lucida Grande", Geneva, Arial, Verdana, sans-serif;
	font-weight: normal;
	}

.footerbox input.butt {
	position: relative;
	margin: 0 0 0 6px;
	padding: 0;
	float: right
	}


/************ button elements **************/

button {
	border: 0;
	cursor: pointer;
	font-weight: normal;
	margin: 0 0 0 0;
	padding: 0 20px 0 0;
	text-align: center;
	float: left; 
	width: auto;
	*overflow: visible;
	font-family: "Lucida Grande", Geneva, Arial, Verdana, sans-serif;
	outline: none; /*remove blue border in safari & firefox */

}

button span { 
	position: relative; 
	display: block; 
	white-space: nowrap; 
	padding: 0 0 0 20px;
	*margin-top: 1px;
}

/*purple buttons*/
button.submitBtn { 
	background: url(../images/btn_right.png) right no-repeat; 
	font-size: 11px; 
	font-weight: normal;
	text-transform: uppercase;
}

button.submitBtn span { 
	height: 30px;
	line-height: 30px;
	background: url(../images/btn_left.png) left no-repeat;
	color: #8C8C8C; 
}

button.submitBtn:hover {
	background: url(../images/btn_right_hover.png) right no-repeat;
	color: #FFF; 
}

button.submitBtn:hover span {
	background:url(../images/btn_left_hover.png) left no-repeat;
	color: #FFF; 
}


/************ alertbox black overlay ************/ 


.overlay_bg { /*achtergrond zwart */
    display: none;
    position: fixed;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: #000;
    z-index: 1001;
    -moz-opacity: 0.7;
    opacity:.70;
    filter: alpha(opacity=70);
}

#overlay_black_ie6 { /*achtergrond zwart enkel vr ie6 */
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 2000px;
    background-color: #000;
    z-index: 1001;
    -moz-opacity: 0.7;
    opacity:.70;
    filter: alpha(opacity=70);
}


/* styles for IE 5 Mac */
.overlay { 
    display: none;
	/*border: solid 1px black;*/
	background-color: #00ACC9;
	position: fixed;
	top: 20px;
	left: 20px;
	z-index: 1002;
}

/* following rules are invisible to IE 5 \*/
.overlay {
	/*border: solid 1px black;*/
	background-color: transparent;
	top: 45%;
	left: 0;
	width: 100%;
	margin-top: -125px;
	text-align: center;
}
/* end IE 5 hack */ 

.overlay_box {
	position: relative;
	padding: 30px 30px 20px 40px;
	text-align: left;
	width: 500px;
	/*min-height: 200px;
	height:auto !important;
	height: 200px;*/
	margin: 0 auto;
	border: 15px solid #AADADF;
	background-color: #FFF;
}


/* typo overlay */

.overlay h1 {
	position: relative;
	margin: 0 0 15px 0;
	padding: 0 0 0 15px;
	font-size: 44px;
	font-family: "Klavika-light", "Lucida Grande", Arial, Helvetica, sans-serif;
	line-height: 47px;
	color: #DE2D37;
	font-weight: normal;
	left: -19px;
	/*color: #CEC000;*/
	display: block;
}


.overlay h2 {
	position: relative;
	margin: 0 0 15px 0;
	padding: 0 0 0 15px;
	left: -15px;
	font-size: 26px;
	font-family: "Klavika-light", "Lucida Grande", Arial, Helvetica, sans-serif;
	line-height: 29px;
	color: #DE2D37;
	font-weight: normal;
	/*color: #CEC000;*/
	display: block;
	background: transparent url(../images/arrow_right_news.png) no-repeat 0 6px;
	_background: transparent url(../images/arrow_right_news.gif) no-repeat 0 6px;
}


.overlay p {
	position: relative;
	font-family: Georgia, "Times New Roman", Times, serif;
	margin: 0 0 0 0;
	padding: 0 0 20px 0;
	font-size: 14px; /* works in all */
	*font-size: 15px; /* targets IE6 and 7 */
	line-height: 18px; /* works in all */
	*line-height: 19px; /* targets IE6 and 7 */
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #43381E;
}

.overlay a {
	color: #000;
	font-weight: bold;
	
}


.overlay ul {
	position: relative;
	margin: 0 0 20px 0;
	padding: 0;
	list-style: none;
	font-size: 12px; /* works in all */
	*font-size: 13px; /* targets IE6 and 7 */
	line-height: 17px; /* works in all */
	*line-height: 18px; /* targets IE6 and 7 */
	font-family: Georgia, "Times New Roman", Times, serif;

}

.overlay li {
	position: relative;
	margin: 0 0 0 0;
	padding: 0 0 0 20px;
	background: transparent url(../images/bullet2.gif) 0 6px no-repeat;
}

/* overlaybox 01 elements */

#overlay_01 {
	top: 45%;
	margin-top: -115px;
}

#overlay_01 .overlay_box {
	padding: 30px 30px 25px 40px;
	width: 500px;
	/*min-height: 200px;
	height:auto !important;
	height: 200px;*/
}


/* overlaybox 00 elements for ie6 */

#overlay_00 {
	display: block;
	_position: absolute;
	top: 44%;
	margin-top: -150px;
}

#overlay_00 .overlay_box {
	display: block;
	_position: relative;
	padding: 30px 30px 20px 40px;
	width: 500px;
	min-height: auto;
	height: auto;
}