/* CSS Elements Template Symphony.nl (c)2009 HN Leussink

v0.1 - 10 februari 2009

div	{
	border: 1px solid #808080;
	/*filter:alpha(opacity=75);
	-moz-opacity:.75;
	opacity:.75;} */







/* - BASIS TAGS - */

BODY {
	font-size: 62.5%; /* Reset 1em naar 10px */
	position: relative;
	font-family: Arial, sans-serif;
	text-align: center;
	margin: 0;
	padding: 0;
	background-image: url('images/bg.jpg');
	background-position: left top;
	background-repeat: repeat-x;}

A	{
	text-decoration: none;
	color: #0072bc;}

IMG	{
	border: 0;}





/* - CUSTOM CLASSES - */
	
.outer_rim	{ 	/* -- Buitenste rand -- */
	position: relative;
	width: 704px;
	margin: 10em auto;
	margin-bottom: 2em;}
			
.bar_top	{ 	/* -- Bovenste helft bovenbalk -- */
	position: relative;
	width: 704px;
	margin: 0;
	height: 28px;
	background-image: url('images/logo.png');
	background-position: left top;
	background-repeat: no-repeat;
	text-align: right;}
	
	.bar_top p	{
		letter-spacing: -.5px;
		font-size: 1.5em;
		position: absolute;
		bottom: 0;
		right: 0;
		margin: 0;
		font-weight: bold;
		color: #D0D0D0;}
	
.bar_bottom	{ 	/* -- Onderste helft bovenbalk -- */
	position: relative;
	width: 704px;
	margin: 0;
	margin-top: 20px;
	height: 10px;
	background-image: url('images/bar.png');
	background-position: left top;
	background-repeat: no-repeat;
	text-align: right;}
		
.block_nieuws { /* -- Nieuwsblok (middenstuk met plaatje) -- */
	font-family: Arial, sans-serif;
	position: relative;
	width: 704px;
	height: 272px;
	margin: 0;
	margin-top: 20px;
	background-position: left top;
	background-repeat: no-repeat;
	text-align: left;}
		
	.block_nieuws .artikel	{
		position: relative;
		width: 350px;
		margin-left: 25px;
		top: 12em;
		text-align: left;
		font-size: 1.1em;}
		
		.block_nieuws .artikel h3	{
			letter-spacing: -.5px;
			margin: 0;
			font-size: 1.2em;
			font-weight: bold;
			color:#0072bc;}
		
		.block_nieuws .artikel h2	{
			letter-spacing: -1px;
			margin: 0;
			margin-bottom: 10px;
			font-size: 1.3em;
			font-weight: bold;
			color:#707070;}
			
		.block_nieuws .artikel p	{
			margin: 0;
			font-size: .8em;
			color:#707070;
			text-align: justify;}

.block_subpage { /* -- Blok voor elke subpagina (middenstuk) -- */
	font-family: Arial, sans-serif;
	position: relative;
	width: 704px;
	height: 359px;
	margin: 0;
	margin-top: 20px;
	background-position: left top;
	background-repeat: no-repeat;
	text-align: left;}
		
	.block_subpage .tekst	{
		position: relative;
		width: 450px;
		height: 320px;
		margin-left: 25px;
		top: 3em;
		text-align: left;
		font-size: 1.1em;
		overflow: hidden;}
			
		.block_subpage .tekst p, UL	{
			color:#707070;
			text-align: justify;}
			
		.block_subpage .tekst h4	{
			color:#0072bc;
			font-size: 1.2em;
			margin:0 0 20px 0;}
			
		.block_subpage .tekst h3	{
			color:#0072bc;
			font-size: 1.4em;
			margin:0 0 20px 0;}
		
		
		.block_nieuws#n0	{
			background-image: url('images/bg_nieuws.jpg');}
		.block_nieuws#n1	{
			background-image: url('images/bg_nieuws2.jpg');}
		.block_nieuws#n2	{
			background-image: url('images/bg_nieuws3.jpg');}
		.block_nieuws#n3	{
			background-image: url('images/bg_nieuws4.jpg');}
		.block_nieuws#n4	{
			background-image: url('images/bg_nieuws5.jpg');}
		.block_nieuws#n5	{
			background-image: url('images/bg_nieuws6.jpg');}
		.block_nieuws#n6	{
			background-image: url('images/bg_nieuws7.jpg');}
		.block_nieuws#n7	{
			background-image: url('images/bg_nieuws8.jpg');}
			
		.block_subpage#contact	{
			background-image: url('images/bg_contact.jpg');}
		.block_subpage#symphony	{
			background-image: url('images/bg_symphony.jpg');}
		.block_subpage#centra	{
			background-image: url('images/bg_centra.jpg');}
		.block_subpage#diensten	{
			background-image: url('images/bg_diensten.jpg');}
		.block_subpage#development	{
			background-image: url('images/bg_development.jpg');}
		.block_subpage#technology	{
			background-image: url('images/bg_technology.jpg');}
		.block_subpage#artikel	{
			background-image: url('images/bg_artikel.jpg');}
		.block_subpage#publicaties	{
			background-image: url('images/bg_publicaties.jpg');}
		

.tussenbar	{ 	/* -- Tussenstuk, optioneel -- */
	display: none;
	position: relative;
	font-size: 1.3em;
	line-height: 25px;
	border: 1px solid #dadada;
	background-color: #DDD;
	color:#FFF;
	font-weight: bold;
	float: left;
	width: 700px;
	margin: 0em auto;
	margin-top: 7px;}
	
.bottom	{
	position: relative;
	font-family: Tahoma, Arial, sans-serif;
	color: #707070;
	width: 170px;
	height: 118px;
	margin: 7px 7px 0 0;
	float: left;}
	
		.bottom img	{
			margin-top: 10px;}
			
		.bottom p	{
			position: relative;
			margin: 10px 12px 12px 10px;
			font-size: 1em;
			text-align: left;}
			
		.bottom p#bottom	{
			position: absolute;
			left: 10px;
			margin: 0;
			bottom: 5px;}
	
	.bottom#cent				{ background-image: url('images/bottom_centra.jpg'); 	background-position: left bottom; background-repeat: no-repeat;}
	.bottom#dienst				{ background-image: url('images/bottom_diensten.jpg'); 	background-position: left bottom; background-repeat: no-repeat;}
	.bottom#dev					{ background-image: url('images/bottom_dev.jpg'); 		background-position: left bottom; background-repeat: no-repeat;}
	.bottom#techno				{ background-image: url('images/bottom_techno.jpg'); 	background-position: left bottom; background-repeat: no-repeat; margin-right:0;} /* uitzondering,omdat het de laatste is in de rij */

	.bottom#centra_collapsed	{ background-image: url('images/bottom_centra.jpg'); 	background-position: left bottom; background-repeat: no-repeat; 					height: 32px; border-top:1px solid #b2d4eb; overflow: hidden; top: -1px;}
	.bottom#diensten_collapsed	{ background-image: url('images/bottom_diensten.jpg'); 	background-position: left bottom; background-repeat: no-repeat; 					height: 32px; border-top:1px solid #b2d4eb; overflow: hidden; top: -1px;}
	.bottom#dev_collapsed		{ background-image: url('images/bottom_dev.jpg'); 		background-position: left bottom; background-repeat: no-repeat; 					height: 32px; border-top:1px solid #b2d4eb; overflow: hidden; top: -1px;}
	.bottom#techno_collapsed	{ background-image: url('images/bottom_techno.jpg'); 	background-position: left bottom; background-repeat: no-repeat; margin-right:0; 	height: 32px; border-top:1px solid #b2d4eb; overflow: hidden; top: -1px;}
	
	.bottom#centra_active		{ background-image: url('images/bottom_centra.jpg'); 	background-position: left bottom; background-repeat: no-repeat; 					height: 32px; padding-top: 9px; margin-top:-1px; z-index:2; overflow: hidden;}
	.bottom#diensten_active		{ background-image: url('images/bottom_diensten.jpg'); 	background-position: left bottom; background-repeat: no-repeat; 					height: 32px; padding-top: 9px; margin-top:-1px; z-index:2; overflow: hidden;}
	.bottom#dev_active			{ background-image: url('images/bottom_dev.jpg'); 		background-position: left bottom; background-repeat: no-repeat; 					height: 32px; padding-top: 9px; margin-top:-1px; z-index:2; overflow: hidden;}
	.bottom#techno_active		{ background-image: url('images/bottom_techno.jpg'); 	background-position: left bottom; background-repeat: no-repeat; margin-right:0; 	height: 32px; padding-top: 9px; margin-top:-1px; z-index:2; overflow: hidden;}

.footer	{ /* -- Footer, uiteraard -- */
	color:#D0D0D0;
	font-size: .9em;
	width: 704px;
	margin: 0em auto;}
	
	



    .scroll-pane {
		position: relative;
		width: 450px;
		height: 280px;
		overflow: hidden;
    }
    
.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 280px;
    background: #EEEEEE;
    background-image: url('images/slider_bg.png');
    background-repeat: repeat-y;
}
.jScrollPaneDrag {
	position: absolute;
	cursor: pointer;
	overflow: hidden;
	height: 20px;
	z-index: 1;
    background-image: url('images/slider.png');
}
.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;*/
}