@import url(/include/css/editor.php);

/****** COLORS *******
#40505E		Blue/Gray				Navigation, Configurator, etc

#333333		Dark Gray		Text color
#666666		Light Gray		Sub sub navigation links
#999999		Gray			Footer, Sub sub nav heading & Reference Img border

#4F8A10		Green			News - heading and link
#BFCDB1		Light Green		News - line color
#8F1761		Purple			Showcase - heading and link
#04466F		Blue			Item on Home - heading and link
#005c96		Blue #2			Tags - heading and link
*/
* {
	outline: none;
}
html,body{margin:0;padding:0}
body {
	text-align:center;
	}

div#container {
	/*background:#FFFFFF url('/image/background.jpg') center top no-repeat;*/
	text-align:left;
	width:932px;
	margin:0 auto;
	}


hr {
	display: block;
	border: 0px;
	height:1px;
	background: #606D7A;
}

/* Blocks */

#content .block {
	height:210px;
	/*overflow:hidden;*/
	}
.homepage #newsblock,
#subnav {
	/*height:210px;*/
	}

.block {
	/*height:300px;*/
	/*padding:0 10px;*/
	margin-bottom:30px;
	position:relative;
	}
.block .readmore {
	/*position:absolute; => mag uit ivm niet gebruik vaste hoogte*/
	bottom:2em;
	}

.block h2,
h2.subhHeading {
	padding-bottom:5px;
	margin-bottom:5px;
	border-bottom:1px solid #606d7a;
	}


/* Header */

div#header {
	position:relative;
	height:161px;
	}
	div#languages{
		margin-top:140px;
		float:right;
	}
	div#languages div{
		float:left;
		margin-left:5px;
	}
#langSelect {
	position: absolute;
	top: 0;
	right: 0;
	margin: 0;
	padding: 0 10px 0 0;
	}
	#langSelect li {
		display:inline;
		height: 30px;
		line-height: 30px;
		float:left;
		color:#fff;
		}
		#langSelect li a {
			text-transform:uppercase;
			color:#d5dbe0;
			text-decoration: none;
			margin: 0 7px;
			}
			#langSelect li.active a {
				color: white;
				font-weight:bold;
				}

#search {
	overflow: hidden;
	position: absolute;
	top: 0;
	right: 130px;
	padding-top: 5px;
}
	#search input {
		width: 85px;
		margin: 0;
		padding: 0;
		border: 0px;
		height: 20px;
		line-height: 19px;
		font-size: 100%;
		text-indent: 3px;
	}
		#search input.placeholder {
			color: gray;
		}
		#search input.submit {
			background: url("/image/arrow-blue.gif") no-repeat scroll 3px 3px white;
			width: 20px;
			cursor: pointer;
			text-indent: -999em;
		}
			
		
				
#logo {
	float:left;
	margin-top: 55px;
	text-indent: -999em;
	}
#logo a {
	display: block;
	width: 332px;
	height: 60px;
	}

#navigation {
	clear:both;
	position:relative;
	height:100px;
	background:url('/image/bg-nav.gif') left top repeat-x;
	}
#breadcrumbs {
	font-size:10px;
	margin-top:40px;
	}
#breadcrumbs a {
	font-size:10px;
	}


/* Content */

div#content {
	float:left;
	width:605px;
	}


	/* News */

	h2.newsTitle {
		font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;
		font-size:10pt;
		}

	.newsItemTags {
		margin-bottom:1em;
	}

	.newsItem {
		clear:both;
		overflow:auto;
		zoom:1;
		border-bottom:1px solid #cccccc;
		padding-bottom:12px;
		margin-bottom:12px;
		}
	.newsItem h2 {
		height:18px;
		line-height:14px;
		}
	.newsItem h2 a {
		font-weight:bold;
		text-decoration:none;
		}
	.newsItem h2 a:hover {
		text-decoration:underline;
		}
	.newsItem .figure {
		float:left;
		width:100px;
		margin-right:12px;
		}
	.figureFull {
		width:300px;
		float:right;
		margin: 0 0 20px 30px;
		}
	.newsItem .readmore {
		text-align:right;
		padding-right:2px;
		}


	/* Referencies */

	#case .inlineImage {
		width:120px;
		float:left;
		margin:5px 5px 0 0;
		}

	p.linkBack {
		margin-top:1em;
		}
	p.linkBack a {
		background:url('/image/arrow-back.gif') left center no-repeat;
		padding-left:15px;
		/* color:#40505E; */
		text-decoration:underline;
		}

	p.casePdfLink {
		margin-top:1em;
		padding-left:20px;
		clear:both;
		background:url('/image/icons/pdf.gif') left center no-repeat;
		}

	#showcases h2,
	#referenties h2 {
		font-size:10pt;
		font-weight:bold;
		margin-bottom:1em;
		}

	#showcases {
		margin-bottom:2em;
		}

	.case {
		margin:auto;
		padding:auto;
		height:90px;
		clear:both;
		}
	.case .figure {
		display:block;
		text-align:center;
		width:145px;
		height:75px;
		line-height:75px;
		border:1px solid #999999;
		float:left;
		margin-right:10px;
		}
	.case .figure:hover {
		border-color:#333333;
		}
	.case .figure img {
		border:0;
		vertical-align:middle;
		}

	#referenties {
		}

	#referentieList {
		margin:0 0 0 1.6em;
		padding:0;
		}
	#referentieList li {
		list-style-image:url('/image/arrow-referentie-list.gif');
		}


	/* Downloads */

	#downloadList {
		width:100%;
		padding:0;
		margin:0;
		border-collapse:collapse;
		border-bottom:1px solid #dddddd;
		}

	#downloadList th {
		vertical-align:top;
		color:#333333;
		}

	#downloadList tbody tr:hover td {
		background:#ededed;
		}
	#downloadList .heading:hover td {
		background:#eeeeee;
		}
	#downloadList .heading td {
		font-weight:bold;
		background:#eeeeee;
		border-top:1px solid #aaaaaa;
		border-bottom:1px solid #aaaaaa;
		padding-left:22px;
		}

	#downloadList .even td {
		border-top:1px solid #dddddd;
		}
	#downloadList .lastCell {
		border-top:1px solid #dddddd;
		}


	/* Contact */
	#contacttext {
	}
	/*
	#contacttext {
		height:262px;
		background: yellow;
		}
	#contactIntro {
		float:left;
		width:250px;
		margin-right:20px;
		background: orange;	
	}
	*/
	#contact
	#adresgegevens {
		float:left;
		width:300px;
		margin-left:20px;

		background: green;
		}
	#adresgegevens table,
	#adresgegevens table * {
		border-collapse:collapse;
		margin:0 !important;
		padding:0 !important;
		}

/* Sidebar */

div#sidebar {
	float:right;
	width:285px;
	margin-right: 10px;
	}
	#sidebar .block {
		padding: 0;
	}



#newsblock .readmore {
	margin-top:10px;
	}

#newsblock .item {
	border-bottom:1px solid #BFCDB1;
	padding:8px 0;
	}
#newsblock .item,
#newsblock .item a {
	line-height:1.4;
	text-decoration:none;
	}
#newsblock .item {
	color: #628ebc;
	}
#newsblock .item a:hover {
	text-decoration:underline;
	}



#cloud .readmore { margin-top:10px; }


/* Extra */

div#extra {
	float:left;
	width:605px;
	margin-top: 15px;
	display: none; /*mag uit ivm niet gebruiken*/
	}

#extra .block {
	width:286px;
	float:left;
	/*padding-right:17px;*/
	padding: 0;
	}
	#extra .blockRight {
		float: right;
	}

.showcaseImage {
	margin-bottom:21px;
	}



/* Footer */

div#footer {
	clear:both;
	width:100%;
	padding-top:10px;
	background:url('/image/bg-footer.gif') 0px 10px repeat-x;
	height:75px;
	}
div#footer p {
	padding:20px 0 10px 0;
	border-top:1px solid #606e7a;
	color:#999999;
	text-align:center;
	}
div#footer a {
	color:#999999;
	}
#footer img {
	margin-left: 3px;
	vertical-align: middle;
	}
	


/* FAQ */	
div.faq {
	display: block;
	background: url(/image/arrow-blue.gif) no-repeat 0px 4px;
	margin: 0 0 2px;
	padding: 2px 0 0 20px;
	border-bottom: 1px solid #BFCDB1;
}
div.open-faq {
	background: url(/image/arrow-blue_down.gif) no-repeat 0px 4px;
}
div.first {
	border-top: 1px solid #BFCDB1;
	padding-top: 4px;
	background-position: 0px 6px;
}
	div.faq p.q {
		cursor: pointer;
		font-weight: bold;
	}
	div.faq .answer {
		margin: 0 0 10px 0;
		display: none;
		overflow: auto;
		zoom: 1;
	}
		div.open-faq .answer {
			display: block;
		}
			div.faq .answer div.btn {
				display: block;
				background: pink;
			}
			div.faq .answer div.btn span {
				display: inline;
				float: right;
				padding: 0 10px;
				background: #628EBC;
				color: white;
				cursor: pointer;
			}

		
/* DEFAULT STYLES */

a img {
	border:none;
	}

.readmore a {
	text-decoration:underline;
	padding-right:18px;
	padding-top:2px;
	background:url('/image/arrow-blue.gif') right bottom no-repeat;
	}

img.standalone {
	display:block;
	}

.border	{ border : 1px solid #000000; }

.height1 { /* als je een divje wilt gebruiken ipv pixel.gif dan dien je in IE deze class te gebruiken en daarnaast de juiste
				hoogte en breedte te geven, zonder deze class krijgt je altijd een aantal pixels onder een div */
	height:1px;
	line-height:1px;
	font-size:1px;
	overflow:hidden;
}



/*SPLASH PAGE*/
body.homepage #container {
	background: none;
}
	#splashh1 {
		padding: 2em 0;
		text-align: center;
	}
	#splash {
		border-bottom: 1px solid #606E7A;
	}
		#splash div {
			margin: 0 auto;	
			width: 698px;	
			line-height: 1;	
		}
			#splash object {
				outline: none;
			}


			
#tagcloud {
	background: #F4F3F3;
	clear:both;
	display:block;
	overflow:auto;
	zoom: 1;
	padding: 1em 0 1em 1em;
}

#tagcloud ul {
		display: block;
		clear: both;
		list-style: none;
		margin: 0;
		padding: 0;
		
	}
		#tagcloud ul li {
			display: inline;

		}
			#tagcloud ul li a {
				position: relative;
				display: block;
				float: left;
				height: 18px;
				line-height: 18px;
				margin: 0 10px 10px 0;
				padding: 0 10px;
				background: url(/image/tagcloud-item_bg.gif) no-repeat -7px 0px;
				text-decoration: none;
				color: #628EBC;
			}
				#tagcloud li.intro a {
					background: none;
					margin: 0;
					padding: 0;
					color: #333333;
				}
				#tagcloud ul li a em {
					position: absolute;
					width: 8px;
					right: 0;
					top: 0;
					background: url(/image/tagcloud-item_bg.gif) no-repeat 0px 0px;
				}
				
			#tagcloud a:hover {
				background-position: -7px -18px;
				color: white;
			}
				#tagcloud li.intro a:hover {
					color: #333333;
				}
				#tagcloud a:hover em {
					background-position: 0px -18px;
				}
				
				
				
/* Geeft aan welke statische teksten nog vertaald moeten worden */
.vertalen {
	border:1px solid #FF0;
	background-color:#F00;
	color:#FF0;
}

#newslettersignup label {
	width: 100px;
}
	#newslettersignup label.error {
		width: auto;
		color: red;
	}		
#newslettersignup input {
	dispkay: inline;
	width: auto;
}








/* miniconfigurator */

#miniconf {
	/*background: pink;*/
}

	#miniconf h5 {
		font-size: 100%;
	}
	#miniconf .gray {
		overflow: visible;
		zoom: 0;
		opacity: .3;
		filter: alpha(opacity = 30);

	}
	#miniconf legend {
		width: 100%;
	}

	#miniconf label.error {
		display: block;
		clear: both;
		margin-top: 10px;
		background: red top left;
		color: white;
		padding: 5px;
	}
	
	
	#miniconf input {
		width: auto;
	}
		#miniconf div.radiofloat input {
			border: 0px;		
		}
	
	#miniconf fieldset {
		/*background: orange;*/
	}
	
	#miniconf .radiofloat,
	#miniconf .textfloat
	 {
		overflow: auto;
		zoom: 0;
		/*border-bottom: 5px solid blue;
		border-top: 5px solid blue;*/
	}
		#miniconf .radiofloat label {
			width: auto;
		}
		#miniconf .textfloat label {
			width: 100%;
			height: 100px;
		}
		#miniconf .radiofloat label img {
		/*
			width: 50px;
			height: 50px;
		*/
		}
		#miniconf .radiofloat input {
			width: auto;
			clear: left;
		}
		#miniconf .textfloat input {
			width: 50px;
			clear: left;
		}
		#miniconf .radiofloat p,
		#miniconf .textfloat p
		 {
			/*border-right: 1px solid red;*/
			float: left;
			width: 23%;
			clear: none;
			margin: 0;
		}
		#miniconf .radiofloat.width15 p,
		#miniconf .textfloat.width15 p
		 {
			width: 15%;
		}
		#miniconf .radiofloat.width22 p,
		#miniconf .textfloat.width22 p
		{
			width: 22%;
			text-align: center;
		}
			#miniconf .radiofloat.width22 p input{
				margin-left: 60px;
			}
		#miniconf .radiofloat.width8 p,
		#miniconf .textfloat.width8 p
		 {
			width: 11%;
		}
	
		#miniconf .radiofloat.width50 p,
		#miniconf .textfloat.width50 p
		 {
			width: 49%;
		}
		
		#miniconf .radiofloat.width30 p,
		#miniconf .textfloat.width30 p
		 {
			width: 32%;
		}

	
	
	
		#sponsors {
		}
		#sponsors div.cat {
			display: block;
			overflow: auto;
			zoom: 1;
			clear: both;
			padding-bottom: 10px;
			margin-bottom: 10px;
			border-bottom: 1px solid #CCCCCC;
		}
			#sponsors div.cat h2,
			#sponsors div.cat p {
				width: 400px;
				float: left;
			}
				#sponsors div.cat p {
					clear: both;
				}
			#sponsors div ul {
				margin: 0;
				padding: 0;
				float: right;
				/*background: #F4F3F3;*/
				width: 150px;
				height: 150px;
				/*line-height: 170px;*/
				overflow:hidden;
			}
				#sponsors div ul li {
					list-style: none;
					text-align: center;
					display: none;
				}

	
#pdf_banner {
	display: block;
	height: 59px;
	line-height: 59px;
	background: url(/image/pdf_banner.jpg);
	color: white;
	font-size: 110%;
	text-indent: 55px;
	text-decoration: none;
}


	
	
	
	
	
	
	
	
/* 		VERTICAL ALIGN
Width en Height kunnen aangepast en/of via een
andere class toegewezen worden.

Moet altijd de volgende HTML hebben:
<div class="verticalalign">
<div>
<div>
	<!-- element dat gecentreerd moet -->
</div>
</div>
</div>
*/
.verticalalign { width:400px; height:300px; }
.verticalalign { display: table;  overflow: hidden; text-align:left; }
.verticalalign * { display: table-cell; vertical-align: middle; overflow:visible; }
.verticalalign * * { display:auto; vertical-align:none; }