/*************************************************
*Main
*************************************************/

.main
{
	position: relative;
	height: auto;
	z-index: 2;
}

div#logo_ferrofinder
{
	position: absolute;
	top: 15px;
	left: 40px;
	width: 260px;
	height: 60px;
	cursor: pointer;
}

.login_segment
{
	position: absolute;
	top: 15px;
	left: 367px;
	z-index: 999;
	border: 0px solid #333;
}

	img#slot
	{
		position: relative;
		top: 0px;
		left: 0px;
	}


	.login_segment input.username
	{
		position: absolute;
		top: 0px;
		left: 40px;
		
		border-left-style: ridge ;
		border-top-style: ridge ;
		
		width: 165px;
		font-size: 16px;
		font-weight: normal;
		color: #0078c9;
	}

	.login_segment input.password
	{
		position: absolute;
		top: 30px;
		left: 40px;
		
		border-left-style: ridge ;
		border-top-style: ridge ;
		
		float: left;
		
		width: 165px;
		font-size: 16px;
		color: #0078c9;
	}

	.login_segment input.login
	{
		position: absolute;
		top: 17px;
		left: 191px;
	}

div#aanmelden
{
	position: absolute;
	top: 40px;
	left: 228px;
	
	width: 100px;

	color: #333333;
	font-size: 14px;
	
}



/*************************************************
*Homepage
*************************************************/

/** Left **/

.contenthome
{
	height: auto;
	width: 950px;
}

	.contenthome .left
	{
		position: relative;
		width: 550px;
		height: auto;
		float: left;
		
		border: 0px solid #060;
	}
	
		.contenthome .left .thema_block
		{
			position: relative;
			height: 490px;
			width: 535px;
			
			border: 0px solid #039;
		}
		
			.contenthome .left .thema_block .thema_bg
			{
				width: 254px;
				height: 233px;
				position: relative;
				float: left;
				margin-right: 13px;
				margin-top: 13px;
				border: 0px solid #039;
			}
				
				.contenthome .left .thema_block .thema_bg .header
				{
					position: absolute;
					top: 20px;
					left: 20px;
					
					font-size: 16px;
					color: #0078c9; 
				}
				
				.contenthome .left .thema_block .thema_bg .tekst
				{
					position: absolute;
					top: 60px;
					left: 20px;
					
					font-weight: bold;
					color:#666666;
				}

				.contenthome .left .thema_block .thema_bg .button
				{
					background-image:url(../images/thema_button.jpg);
					position: absolute;
					top: 170px;
					left: 155px;
						
					width: 83px;
					height: 25px;
					
					text-align: center;
					line-height: 22px;
					font-weight: bold;
					color: #666666;
				}
				
		.contenthome .left .tagcloud{
			position: relative;
			float: left;
			height: 200px;
			width: 480px;
			margin: 40px 0 0 10px;
			padding: 0 0 0 10px;
			border: 0px solid #999;		
		}
		
		.contenthome .left .tagcloud span{
		  padding: 4px;
		}
		
			.contenthome .left .tagcloud span a:link{
			  color: #999;
			  text-decoration: none;
			}
			.contenthome .left .tagcloud span a:hover{
			  color: #0078c9;
			  text-decoration: underline;
			}
			.contenthome .left .tagcloud span a:visited{
			  color: #0078c9;
			  text-decoration: none;
			}
			
	.contenthome .right
	{
		position: relative;
		height: auto;
		width: 390px;
		float: right;
		
		border: 0px solid #F00;
	}

/** Right **/

div#nieuws_header_rss
{
	position: relative;
	width: 350px;
	height: 25px;
	
	background-image: url(../images/header_news_ferro.jpg);
	background-repeat: repeat-x;
	
	font-size: 13px;
	font-weight: bold;
	color: #FFF;
	line-height: 25px;
	padding-left: 20px;
}

.table_rss{
	
	position: relative;
	
	width: 340px;
	height: 100%;
	
	text-align: left;
	border-collapse: collapse;
	border-spacing: 2px;
	border-bottom: 0px;
}

.table_rss td      { padding: 3px; text-align: left; line-height: 20px;}

.collapse_news{
cursor: hand;
cursor: pointer;
width: 335px;
}

.opennewsdetail{
background: none;
padding: 2px;
}

/*********************************************
*Tagcloud
*********************************************/

  .smallest {
      font-size: 9px;
  }

  .small {
      font-size: 11px;
  }
  
  .medium {
      font-size: 16px;
  }
  
  .large {
      font-size: 25px;
  }
  
  .largest {
      font-size: 29px;
  }

/*********************************************
*Registratiebevestiging
*********************************************/

.button_registratiebevesting1{
	height: 40px;
	width: 950px;
	float: left;
	margin: 0 0 0 -400px;
}

.button_registratiebevesting2{
	height: 40px;
	width: 950px;
	float: left;
	margin: 0 0 0 -375px;
}

/*************************************************
*Definities
*************************************************/

.definities
{
	position: relative;
	margin-top: 30px;
	left: 50px;
}
	
		.definities .ul
		{
			position: relative;
			list-style: none;
			font-size: 16px;
		}

/*************************************************
*Overzicht
*************************************************/

.overzicht{
	position: relative;
	margin: 30px 0;
	height: auto;
	width: auto;
}


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

/* Scheiding */

div#lijn_verticaal
{
	background-image: url(../images/line_verticaal.gif);
	background-repeat: repeat-y;
	
	position: relative;
	float: left;
	top: 0px;
	left: 0px;
	
	width: 5px;
	height: 480px;
}

/* Nieuws */

div#nieuws_branche
{
	position: relative;
	top: 0px;
	left: 0px;
	height: 200px;
	
}

.marge
{
	position: relative;
	height: 40px;
	width: 100px;
}

.nieuws_rss_weer
{
	position: relative;
	left: 20px;
	height: auto;
	width: 370px;
	float: left;
	
	border: 0px solid #066;
}

div#nieuws_header
{
	position: relative;
	top: 10px;
	left: 20px;
	width: 345px;
	height: 20px;
	
	background-image: url(../images/header_news_ferro.jpg);
	background-repeat: repeat-x;
	
	font-size: 13px;
	font-weight: bold;
	color: #FFF;
	line-height: 25px;
	padding-left: 20px;
}

table#news
{
	position: relative;
	top: 40px;
	left: 25px;
	text-align: left;
	font-family: Verdana;
	font-weight: normal;
	font-size: 11px;
	color: #404040;
	width: 350px;
	border-collapse: collapse;
	border-spacing: 2px;
	overflow: scroll;
}

td               { color: #000000; padding: 2px;
                   text-align: left; }
				   
.rijkleur        { background-color: #e5f4f6; border: 0px; }
.frontkleur      { background-color: none; }
.rijgroepkleur   { background-color: fuchsia; }
.tabel_header	 { font-size:14px; color: #0078c9;}






div#regel_toevoegen
{
	position: relative;
	
	padding-left: 850px;
}

div.regel_toevoegen_small
{
	position: relative;
	padding-left: 330px;
	margin: 0 0 20px 0;
}


img#header
{
	position: absolute;
	left: 10px;
	top: -1px;
}

img#tab_contact
{
	position: absolute;
	right: 40px;
	top: 0px;
}

div#tab_contact
{
	position: absolute;
	right: 64px;
	top: -1px;
}


img#tab_sitemap
{
	position: absolute;
	right: 130px;
	top: 0px;
}

div#tab_sitemap
{
	position: absolute;
	right: 153px;
	top: -1px;
}




/* BUTTONS */


/* BUTTONS */

div#buttonoranje a  {

	background-image: url("../images/backgroundbutton.jpg");
	background-position: center;
	border: 1px solid #BBAA7D;
	cursor: pointer;
	width: 150px;
	height: 24px;
	
	position: relative;
	top: 10px;
	left: 10px;
	
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	padding-right: 10px;
	
	margin-left: 50px;
	margin-top: 5px;
	
	text-align: center;
	text-decoration:none;
	
	color: #534741;
	font-size: 13px;
	font-weight: bold;

}

div#buttonoranje_2 a  {

	background-image: url("../images/backgroundbutton.jpg");
	background-position: center;
	border: 1px solid #BBAA7D;
	cursor: pointer;
	height: 20px;
	
	position: relative;
	float: right;
	
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	padding-right: 10px;
	
	margin-left: 50px;
	margin-top: 5px;
	
	text-align: center;
	text-decoration:none;
	line-height: 20px;
	
	color: #534741;
	font-size: 13px;
	font-weight: bold;

}






/* ####################################### */

img#vergrootglas
{
	position: absolute;
	top: 59px;
	left: 708px;
}

input#search
{
	position: absolute;
	top: 65px;
	left: 762px;
	
	border-left: ridge rgb(60%,60%,60%);
	border-top: ridge rgb(60%,60%,60%);

	width: 165px;
	font-size: 16px;
	color: #0078c9;

}

input#go_search
{
	position: absolute;
	top: 65px;
	left: 915px;
}


/*************************************************
*	Wachtwood - wijzigen
*************************************************/

div#change_password
{
	position: relative;
	top: 30px;
	width: 400px;
}

div#password_navigation
{
	position: relative;
	top: 20px;
	float: right;
}



/**************************************************
*	Collapse
**************************************************/


.mycontactpersoon{ /*header of 1st demo*/
cursor: hand;
cursor: pointer;
padding: 2px 5px;
border-bottom: 1px solid #CCCCCC;
width: 450px;
height: auto;
}

.opencontactpersoon{ /*class added to contents of 1st demo when they are open*/
background: none;
height: auto;
}

/***********************************************
*	Aanmelden stap1 
***********************************************/

div#abonnementen
{
	position: relative;
	top: 30px;

	float: left;

}

.abo_description
{
	position: relative;
	margin-left: 10px;
	font-style: italic;
	font-size: 9px;
}

#fade1{
	position: absolute;
	top: -50px;
	right: 10px;
	font-size: 15px;
	font-weight: bold;
}

div#dhtmltooltip{
	position: absolute;
	width: 0px;
	height: auto;
	border: 2px solid #0078c9;
	font-weight: bolder;
	padding: 4px;
	background-color: lightyellow;
	visibility: hidden;
	z-index: 102;
}

div#dhtmltooltip_menu{
	position: absolute;
	width: 0px;
	height: auto;
	border: 0px solid black;
	padding: 4px;
	visibility: hidden;
	z-index: 102;
	
	font-weight: bolder;
	font-size: 14px;
}


div#alg_bedrijfsgegevens
{
	position: relative;
	top: 30px;
	left: 0px;
	
	float: left;
	
	z-index: 101;
}

div#alg_persoonsgegevens
{
	position: relative;
	top: 30px;
	left: 100px;
	
	margin-bottom: 30px;
	
	z-index: 3;
}

div#alg_voorwaarden
{
	position: relative;
	top: 0px;
	left: 0px;
	height: auto;
	
	float: left;
	
	padding-top: 30px;
	padding-bottom: 50px;
	
	z-index: 4;
}




/*********************************************
*	Bevestig - stap 2
*********************************************/

div#bev_bedrijfsgegevens
{
	position: relative;
	top: 30px;
	left: 0px;
	
	float: left;
	
	z-index: 101;
}

div#bev_persoonsgegevens
{
	position: relative;
	top: 30px;
	left: 100px;

}

table#tabel_gegevens_bevestigd
{
	position: relative;
	top: 0px;
	left: 0px;
	
	float: left;
	
	width: 800px;
	height: 100%;
	
	text-align: left;
	font-family: Verdana;
	font-size: 11px;
	color: #666666;
	border-collapse: collapse;
	border-spacing: 2px;
	overflow: scroll;

}


/*********************************************
*StatischMenu
*********************************************/

.menu_statisch{
	position: relative;
	top: 0px;
	left: 0px;
	
	height: 350px;
}

	.menu_statisch .middle{
		position: relative;
		top: 70px;
		left: 350px;
		
		float: left;
	}

	.menu_statisch .koptekst{
		position: relative;
		top: 20px;
		float: left;
		width: 900px;
		text-align: center;
		z-index: 1;
	}
	
.menu_statisch_onder
{
	position: relative;
	top: 0px;
	left: 0px;
	
	height: 150px;

}

	.menu_statisch_onder img#left
	{
		position: absolute;
		top: 0px;
		left: 200px;
	
	}
	
	.menu_statisch_onder img#middle
	{
		position: absolute;
		top: 0px;
		left: 400px;
	
	}
	
	.menu_statisch_onder img#right
	{
		position: absolute;
		top: 0px;
		left: 600px;
	
	}
	
/*********************************************
*StatischMenu - Offertes
*********************************************/

div#menu_place
{
	position: absolute;
	top: 175px;
	left: 100px;
}

div#menu_search
{
	position: absolute;
	top: 175px;
	left: 580px;
}

/*********************************************
*StatischMenu - Vind
*********************************************/

div#menu_vacatures
{
	position: absolute;
	top: 100px;
	left: 100px;
}

div#menu_bedrijven
{
	position: absolute;
	top: 175px;
	left: 100px;
}

div#menu_productiecapaciteit
{
	position: absolute;
	top: 250px;
	left: 100px;
}

/*********Rechts*********/

div#menu_opleidingen
{
	position: absolute;
	top: 100px;
	left: 540px;
}

div#menu_machines
{
	position: absolute;
	top: 175px;
	left: 580px;
}

div#menu_personeel
{
	position: absolute;
	top: 250px;
	left: 540px;
}
/*********************************************
*StatischMenu - Nieuwsgierig
*********************************************/

div#menu_branche
{
	position: absolute;
	top: 140px;
	left: 100px;
}

div#menu_forum
{
	position: absolute;
	top: 220px;
	left: 100px;
}

div#menu_nieuws
{
	position: absolute;
	top: 140px;
	left: 540px;
}

div#menu_links
{
	position: absolute;
	top: 220px;
	left: 540px;
}

/*********************************************
*StatischAdverteren
*********************************************/

.adverteren{
	position: relative;
	width: 950px;
	height: auto;
	border: 0px solid #F00;
}

.adverteren .tekst{
	position: relative;
	width: 500px;
	height: auto;
	padding: 30px 0;
	border: 0px solid #0C0;
}


/***********************************************
*	Bekijknieuws
***********************************************/

div#nieuws_overzicht
{
	position: relative;
	width:500px;
	margin:0px auto;
}

div#kop_nieuws
{
	position: relative;
	width: 500px;
	height: 140px;
	background-image: url(../images/news_ferrofinder.jpg);
	background-position: bottom;
	background-repeat: repeat-x;
	padding: 0 0 0 10px;
	border-bottom: 1px solid #CCCCCC;
}

div#nieuws_categorie
{
	position: absolute;
	top: 120px;
	right: 10px;
	
	color: #FFFFFF;
	font-size: 14px;
	font-weight: bold;
}

div#nieuws_scheidingslijn
{
	position: relative;
	width: 510px;
	height: 1px;
	background-image: url(../images/menu_lijn.gif);
	background-repeat: repeat-x;
	margin: 0 0 3px 0;
}


div#kop_nieuws_branche
{
	position: relative;
	width: 500px;
	height: 140px;
	background-image: url(../images/news_branche.jpg);
	background-position: bottom;
	background-repeat: repeat-x;
	padding: 0 0 0 10px;
	border-bottom: 1px solid #CCCCCC;
}


div#kop_nieuws_rss
{
	position: relative;
	width: 500px;
	height: 140px;
	background-image: url(../images/news_rss.jpg);
	background-position: bottom;
	background-repeat: repeat-x;
	padding: 0 0 0 10px;
	border-bottom: 1px solid #CCCCCC;
}

.sub_nieuws_rss
{
	position: relative;
	width: 479px;
	height: 150px;
	background-color: #FFF;
	border: 1px solid #DBDBDB;
	padding: 20px 0 0 30px;
}


/*********************************************
*BekijkBedrijfsprofiel 
*********************************************/

table.bedrijfsprofiel{
	position: relative;
	top: 0px;
	margin-left: 15px;
	width: 200px;
	height: 100%;
	color:#006;
}
	table.bedrijfsprofiel td{color: #666;}

.bedrijfsprofiel_left{
	position: relative;
	height: auto;
	width: 600px;
	float: left;
	margin: 30px 0;
}

	.bedrijfsprofiel_left .activiteiten{
		position: relative;
		width: 200px;
		left: 0px;
		float: left;
	}
	
		.bedrijfsprofiel_left .activiteiten ul{
			color: #666;
		}
	
	.bedrijfsprofiel_left .producten{
		position: relative;
		float: left;
		width: 200px;
		left: 150px;
	}
	
		.bedrijfsprofiel_left .producten ul{
			color: #666;
		}
	
	.bedrijfsprofiel_left .bedrijfsomschrijving{
		position: relative;
		float: left;
		width: 500px;
		margin: 70px 0;
	}
	
		.bedrijfsprofiel_left .bedrijfsomschrijving .tekst{
			position: relative;
			margin: 10px;
		}
	
	.bedrijfsprofiel_left .filialen{
		position: relative;
		float: left;
		width: 500px;
		margin: 20px 0;
	}
	
		table.filialen td{
			color: #666;
		}
	
.bedrijfsprofiel_right{
	position: relative;
	height: auto;
	width: 330px;
	float: right;
	border: 0px solid #666;
}

	.bedrijfsprofiel_right .bedrijfslogo{
		position: relative;
		top: 20px;
		left: 0px;
		height: 200px;
		width: 200px;
		float: right;
	}
	
	.bedrijfsprofiel_right .branche{
		position: relative;
		top: 50px;
		height: 50px;
		width: 200px;
		margin-bottom: 50px;
		float: right;
	}
	
	.bedrijfsprofiel_right .branche .tekst{
		margin: 10px 0 0 20px;
	}
		
	.bedrijfsprofiel_right .contact{
		position: relative;
		top: 50px;
		left: 0px;
		float: right;
		width: 200px;
		margin-bottom: 50px;
	}
	
	.bedrijfsprofiel_right .bedrijfsfoto{
		position: relative;
		margin: 30px 0;
		height: 250px;
		width: 200px;
		float: right;
		right: 60px;
	}

		.bedrijfsprofiel_right .bedrijfsfoto .border{
			border: 2px solid #0078c9;
		}
	
div#bewerk_button
{
	position: absolute;
	top: 20px;
	left: 290px;
}

/*******************************************
*Bewerk Bedrijfsprofiel 
*******************************************/

.bewerk_blok
{
	position:relative;
	left: 0px;
	
	float: left;
	
	width: 470px;
	min-height: 300px;
	border: 0px solid #930;
	
	z-index: 1;
}

.sheiding{
	position: relative;
	width: 800px;
	height: 2px;
	float: left;
}

.verwijder_foto{
	position: relative;
	max-width: 50px;
	max-height: 50px;
}
/******************************************
*Filiaal mutatie 
******************************************/

div#fil_bezoekadres
{
	position: relative;
	top: 50px;
	left: 0px;
	
	float: left;
	
	width: 400px;
	
	z-index: 4;
}

div#fil_postadres
{
	position: relative;
	top: 50px;
	left: 200px;
	
	width: 250px;
}

/**************************************************
*	Detail
**************************************************/

.detailpagina{
	position: relative;
	top: 20px;
}


/**************************************************
*Machinedetail
**************************************************/

div#machine_detail
{
	position: relative; 
	left: 0px; 
	width: 75%;
	height: auto;
	margin-top: 30px;
	float: left;
}


div#machine_photo
{
	position: relative;
	left: 50px; 
	width: 22%;
	margin-top: 30px;
	float: left;
}

/**************************************************
*Contactpersoon
**************************************************/

.contactpersoon{
	position: relative;
	margin-top: 25px;
	height: auto;
	width: 500px;
	float: left;
	border: 0px solid #000;
}

/**************************************************
*Offertedetail
**************************************************/

.offerte_left{
	position: relative;
	float: left;
	width: 500px;
	border: 0px solid #909;
}

	.offerte_left .detail{
		position: relative; 
		left: 0px; 
		width: 90%;
		float: left;
		margin-top: 50px;
		border: 0px solid #F00;
	}
	
	.offerte_left .contactpersoon

.offerte_right{
	position: relative;
	float: right;
	width: 300px;
	border: 0px solid #030;
}

	.offerte_right .omschrijving{
		position: relative;
		top: 0px; 
		margin: 0 0 20px 0;
		padding: 0 30px 0 0;
		border: 0px solid #060;
		float: right;
	}
	
		.offerte_right .omschrijving .offerte_bg{
			position: absolute;
			height: 280px;
			width: 416px;
			background-image: url("../images/textarea_bg.png");
		
			background-repeat: no-repeat;
			padding: 0 0 20px 0;
			margin: 50px 0;
			z-index: 95;
		}

		.offerte_right .omschrijving textarea.offerte {
			position: relative;
			left: 3px;
			width: 390px;
			height: 200px;
			border: 0px solid #cccccc;
			padding: 5px;
			margin: 15px 0;
			z-index: 98;
		}

/**************************************************
*OpleidingDetail
**************************************************/

.opleiding_left
{
	float: left;
	width: 500px;
	margin: 50px 0;
}

	.opleiding_left .algemeen{
		position: relative; 
		left: 0px; 
		width: 90%;
		float: left;
		margin-top: 10px;
	}
	
	.opleiding_left .contact{
		position: relative; 
		left: 0px; 
		width: 90%;
		float: left;
		margin-top: 30px;
	}

.opleiding_right
{
	position: relative;
	float: right;
	width: 400px;
	top: 50px;
}

	.opleiding_right .omschrijving{
		position: relative;
		height: 300px;
		margin: 0 0 20px 0;
		padding: 0 30px 0 0;
		border: 0px solid #060;
		float: right;
	}
	
		.opleiding_right .omschrijving .opleiding_bg{
			position: absolute;
			height: 280px;
			width: 416px;
			background-image: url("../images/textarea_bg.png");
		
			background-repeat: no-repeat;
			padding: 0 0 20px 0;
			margin: 50px 0;
			z-index: 95;
		}
		
		.opleiding_right .omschrijving textarea.offerte {
			position: relative;
			left: 3px;
			width: 390px;
			height: 200px;
			color: #333;
			border: 0px solid #cccccc;
			padding: 5px;
			margin: 15px 0;
			z-index: 98;
		}



div#opleiding_bg_1
{
	position: absolute;
	top: 175px;
	height: 258px;
	width: 416px;
	background-image: url("../images/textarea_bg_offerte.jpg");
	z-index: 95;
}

div#opleiding_bg_2
{
	position: absolute;
	top: 530px;
	height: 258px;
	width: 416px;
	background-image: url("../images/textarea_bg_offerte.jpg");
	z-index: 95;
}

div#opleiding_bg_3
{
	position: absolute;
	top: 885px;
	height: 258px;
	width: 416px;
	background-image: url("../images/textarea_bg_offerte.jpg");
	z-index: 95;
}


div#opleiding_desc
{
	float: left;
	margin-top: 25px; 
	
	width: 110%;	
	height: auto;
}


div#opleiding_contactpersoon
{
	position: relative;
	margin-top: 25px;
	height: auto;
	width: 500px;
	float: left;
	border: 1px solid #F00;
}

/**************************************************
*OpleidingMutatie
**************************************************/

.opleidingmutatie_left
{
	float: left;
	width: 430px;
	margin: 50px 0;
	border: 0px solid #333;
}

.opleidingmutatie_right
{
	position: relative;
	float: right;
	width: 500px;
	top: 50px;
	border: 0px solid #333;
}

	.opleidingmutatie_right .nav{
		position: absolute;
		right: 30px;
		top: 750px;
	}
/**************************************************
*CVDetail
**************************************************/

div#cv_algemeen
{
	position: relative; 
	left: 0px; 
	top: 50px; 
	width: 75%;
	float: left;
}

.cv_picture
{
	position: relative; 
	left: 0px; 
	top: 50px; 
	width: 20%;
	float: right;
}

	.cv_picture .image
	{
		position: relative;
		left: 9px;
	}



/******************************************
*CV - mutatie 
******************************************/

.cv_left
{
	margin-top: 50px;
	width: 470px;
	height: auto;
	
	float: left;
}

.cv_right
{
	margin-top: 50px;
	width: 470px;
	height: auto;
	
	float: right;
}

/**************************************************
*	Vacaturedetail
**************************************************/

div#vacature_algemeen
{
	position: relative; 
	left: 0px; 
	top: 50px; 
	width: 70%;
	float: left;
}

.vacature_picture
{
	position: relative; 
	left: 0px; 
	top: 50px; 
	width: 20%;
	float: right;
}

	.vacature_picture .image
	{
		position: relative;
		left: 9px;
	}


/* ##################################### Machines ######################################################## */

div#machine_gegevens
{
	position: relative;
	top: 50px;
	left: 0px;
	
	width: 300px;
}


/* #################################### Vacatures ######################################################## */

div#vacature_een
{
	position: relative;
	top: 50px;
	left: 0px;
	
	float: left;
	
	width: 450px;
	
}

div#vacature_twee
{
	position: relative;
	top: 50px;
	right: 40px;
	float: right;
	
	width: 400px;
	
}


/* ##################################### SpryAccordion ################################################### */


/* SpryAccordion.css - Revision: Spry Preview Release 1.4 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/* This is the selector for the main Accordion container. For our default style,
 * we draw borders on the left, right, and bottom. The top border of the Accordion
 * will be rendered by the first AccordionPanelTab which never moves.
 *
 * If you want to constrain the width of the Accordion widget, set a width on
 * the Accordion container. By default, our accordion expands horizontally to fill
 * up available space.
 *
 * The name of the class ("Accordion") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style the
 * Accordion container.
 */
.Accordion {
	border-left: solid 0px gray;
	border-right: solid 0px black;
	border-bottom: solid 0px gray;
	overflow: hidden;
	color: #666;
	
	top: 50px;
	
	width: 520px;
}

/* This is the selector for the AccordionPanel container which houses the
 * panel tab and a panel content area. It doesn't render visually, but we
 * make sure that it has zero margin and padding.
 *
 * The name of the class ("AccordionPanel") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * accordion panel container.
*/
.AccordionPanel {
	margin: 0px;
	padding: 0px;
}



/* This is the selector for the AccordionPanelTab. This container houses
 * the title for the panel. This is also the container that the user clicks
 * on to open a specific panel.
 *
 * The name of the class ("AccordionPanelTab") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * accordion panel tab container.
 */
.AccordionPanelTab {
	background-color: #CCCCCC;
	border-bottom: solid 1px #B0B0B0;
	margin: 0px;
	padding: 2px;
	cursor: pointer;
}

/* This is the selector for a Panel's Content area. It's important to note that
 * you should never put any padding on the panel's content area if you plan to
 * use the Accordions panel animations. Placing a non-zero padding on the content
 * area can cause the accordion to abruptly grow in height while the panels animate.
 *
 * Anyone who styles an Accordion *MUST* specify a height on the Accordion Panel
 * Content container.
 *
 * The name of the class ("AccordionPanelContent") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * accordion panel content container.
 */
.AccordionPanelContent {
	overflow: auto;
	margin: 0px;
	padding: 0px;
	height: 250px;
	color: #666;
}


/* This is an example of how to change the appearance of the panel tab that is
 * currently open. The class "AccordionPanelOpen" is programatically added and removed
 * from panels as the user clicks on the tabs within the Accordion.
 */
.AccordionPanelOpen .AccordionPanelTab {
	background-color: #EEEEEE;
}

/* This is an example of how to change the appearance of the panel tab as the
 * mouse hovers over it. The class "AccordionPanelTabHover" is programatically added
 * and removed from panel tab containers as the mouse enters and exits the tab container.
 */
.AccordionPanelTabHover {
	color: #0078c9;
}
.AccordionPanelOpen .AccordionPanelTabHover {
	color: #0078c9;
}

/* This is an example of how to change the appearance of all the panel tabs when the
 * Accordion has focus. The "AccordionFocused" class is programatically added and removed
 * whenever the Accordion gains or loses keyboard focus.
 */
.AccordionFocused .AccordionPanelTab {
	background-color: #EEEEEE;
}

/* This is an example of how to change the appearance of the panel tab that is
 * currently open when the Accordion has focus.
 */
.AccordionFocused .AccordionPanelOpen .AccordionPanelTab {
	background-color: #CCCCCC;
}

/*############################################## Contactpersonen ################################################*/

div#visitekaartje
{
	position: relative;
	left: 0px;
	top: 50px;
	height: auto;
	border: 0px solid #FF0000;
	float: left;
}

div#visitekaartje_links
{
	position: relative;
	top: 0px;
	left: 0px;
	float: left;
	background-image: url("../images/visitekaartje_links.jpg");
	width: 25px;
	height: 276px;
	voice-family: "\"}\"";
	voice-family: inherit;
}


div#visitekaartje_midden
{
	position: relative;
	margin: 0px 0px 0px 0px;
	padding-right: 10px;
	padding-top: 30px;
	top: 0px;
	left: 0px;
	float: left;
	background-image: url("../images/visitekaartje_midden.jpg");
	background-repeat: repeat-x;
	height: 276px;
	width: 380px;
}

.visitekaartje
{
	position: relative;
	left: 5px;
	top: 50px;
	height: auto;
	border: 0px solid #FF0000;
	float: left;
}

	.visitekaartje .left
	{
		position: relative;
		height: 200px;
		width: 170px;
		border: 0px solid #FF0000;
		float: left;
	}
	
		.visitekaartje .left .pasphoto_area
		{
			position: relative;
			height: 150px;
			width: 130px;
			border: 0px solid #FF0000;
		}
		
			.visitekaartje .left .pasphoto_area .pasphoto
			{
				position: relative;
				max-height: 150px;
				max-width: 130px;
				border: 0px solid #FF0000;
			}
		
		.visitekaartje .left .contacpersoon_naam
		{
			position: relative;
			height: 40px;
			width: 170px;
			margin: 20px 0;
			border: 0px solid #FF0000;
			font-size: 17px;
			font-weight: lighter; 
			color: #0078c9;
		}
	
	.visitekaartje .right
	{
		position: relative;
		height: 200px;
		width: 200px;
		float: right;
		border: 0px solid #FF0000;
	}

img#pasphoto
{
	position: relative;
	top: 0px;
	left: 5px;
	float: left;
	max-height: 150px;
	max-width: 130px;
	border: 1px solid #FF0000;
}

div#contacpersoon_header
{
	position: relative;
	top: 0px;
	left: 5px;
	height: 50px;
	width: 150px;
	border: 1px solid #FF0000;
	font-size: 14px; 
	color: #0078c9;

}

div#contactpersoon_header_functie
{
	position: relative;
	top: 0px;
	left: 20px;
}

div#visitekaartje_rechts
{
	position: relative;
	top: 0px;
	left: 0px;
	float: left;
	background-image: url("../images/visitekaartje_rechts.jpg");
	width: 32px;
	height: 276px;
	voice-family: "\"}\"";
	voice-family: inherit;

}

/*###############################################################################################################*/


/*********************************************
*	#Search
*********************************************/

div#navigatie_area
{
	position: relative;
	left: 750px;
	float: left;
	margin-top: -110px;
}

div#zoek_area
{
	position: relative;
	float: left;	
	margin: 1px 0 30px 0;
	height:auto;
	width: 950px;
	left: 0px;
	border: 0px solid #F00;
}

table.zoeken{
	position: relative;
	float: left;
	left: 0px;
	border: 0px solid #F00;
}

div#lijn_area_top{
	position: relative;
	float: left;
	background-image: url(../images/menu_lijn.gif);
	background-repeat: repeat-x;

	height: 3px;
	width: 950px;
	
	margin: 30px 0 10px 0;
}

div#lijn_area_bottom{
	position: relative;
	float: left;
	background-image: url(../images/menu_lijn.gif);
	background-repeat: repeat-x;

	height: 3px;
	width: 950px;
}

div#result_area
{
	position: relative;
	float: left;
	height: auto;
	z-index: 1;
}

div#select_png
	{ 
		height: 23px;
		width: 23px;
		background-image: url(../images/select.png);
		cursor: pointer;
	}


.search_footer{
	position: relative;
	float: left;
	height: auto;
	margin: 30px 0 0px 0;
}

	.search_footer .num_pages{
		padding: 5px 10px 5px 10px;
		margin: 5px 5px 5px 5px;
		border: 1px solid #666666;
		color: #333333;
		text-decoration: none;
		cursor: pointer;
		float: left;
	}
	
		.search_footer .num_pages .pages a:hover
		{
			color: #FF0366;
		}
		
		.search_footer .num_pages .pages a:active
		{
			color: #333333;
		}
		
		.search_footer .num_pages .pages a:visited
		{
			color: #333333;
		}

table.search
{
	position: relative;
	
	width: 950px;
	height: 100%;
	
	text-align: left;
	font-family: Verdana;
	font-weight: normal;
	font-size: 11px;
	border-collapse: collapse;
	border-spacing: 2px;
	border-bottom: 1px;
}

	.tableRollOverEffect1{
		background-color: #CEF4FF;
		color:#FFF;
	}

	.tableRollOverEffect{
		background-image: url(../images/table_bg_rollover.gif);
		background-repeat: repeat-x;
	}

	.tableRowClickEffect1{
		background-color: #E1E1E1;
		color:#FFF;
	}

table.search td      { padding: 3px; margin-right: 10px;
                   			text-align: left; border-bottom: 1px solid #CCCCCC;}
							
.header_search	 { font-size:11px; color: #0078c9;}

/*********************************************
*	Banner
*********************************************/

.banner
{
	position: relative;
	float: right;
	top: 30px;
}


/*********************************************
*	Nieuws - Detail
*********************************************/

.nieuws_detail {
position: relative;
top: 0px;
width: 250px;
padding-top: 20px;
padding-left: 30px;
margin: 0px 10px 0px 50px;
border-left: solid 1px  #CCCCCC;

	column-count: 3;
   	column-gap: 20px;
	column-rule: 1px solid #666;
}

div#nieuws_footer {
position: relative;
top: 0px;
width: 250px;
padding-top: 20px;
padding-left: 30px;
margin: 0px 10px 0px 50px;
border-left: solid 1px  #CCCCCC;
}


div#nieuws_button
{
	position: relative;
	top: 40px;
	float: right;
}


/*********************************************
*	Contact 
*********************************************/

div#table_contact
{
	position: relative;
	top: 50px;
	left: 0px;
	
	float: left;
}

div#contact_ff
{
	position: relative;
	top: 0px;
	left: 10px;
	
	float: left;
}

/*********************************************
*	Links
*********************************************/

.nuttige_links
{
	position: relative;
	margin-top: 30px;
	left: 50px;
}

/*********************************************
*Brancheinformatie
*********************************************/

div#logo_rabobank
{
	position: relative;
	float: right;
	right: 40px;
}

.branchelinks{
	position: relative;
	float: left;
	height: auto;
}

/*********************************************
*	Quicktour
*********************************************/

.quick_left
{
	margin: 0 0 0 20px;
}

.quick_buttons
{
	margin: 20px 0 0 40px;
}

.border_images
{
	border: 2px solid #999999;
}

/*********************************************
*	Menu 
*********************************************/

div#lijn_menu{
	position: relative;
	
	top: 100px;
	left: 13px;
	
	background-image: url(../images/menu_lijn.gif);
	background-repeat: repeat-x;
	height: 3px;
	width: 979px;
}

div#marktplaats_new{
	position: absolute;
	height: 30px;
	width: 60px;
	top: 70px;
	left: 280px;
	background-image: url(../images/new_marktplaats.png);
	background-repeat: no-repeat;
	z-index: 999;
}

div#marktplaats_new_ingelogd{
	position: absolute;
	height: 30px;
	width: 60px;
	top: 70px;
	left: 270px;
	background-image: url(../images/marktplaats_new.png);
	background-repeat: no-repeat;
	z-index: 999;
}

.menu_test
{
	position: absolute;
	top: 70px;
	left: -30px;
	
	z-index: 99;
}

.menu_test a:visited
{
	color: #0078c9;
	text-decoration: none;
}



/*********************************************
*	Navigatie 
*********************************************/




.navigation_2
{
	position: relative;
	top: 20px;
	left: 10px;
	float: left;
}

div#navigation_left
{
	position: relative;
	top: 50px;
	float: left;
	
}

form#mailer
{
	display: none;
}

div.formerror {
	color: red;
}

/*********************************************
*	Text-wrap 
*********************************************/


#page_wrap {
	width: 600px;
	z-index: 1;
	margin: 50px 0 0 0;
}

#bottom_fade {

	width: 700px;
	height: 200px;
	z-index: 2;
	position: fixed;
	bottom: 0%;
	float: left;
	background-image: url("../images/bottom-fade.png");
}

#bug {
	position: absolute;
	right: 20px; 
	top: 290px; 
	height: 30px; 
	width: 200px; 
	background-color:#CC3366; 
	color:#FFF; 
	font-size:16px; 
	font-weight:bolder; 
	line-height: 30px; 
	border: 2px solid #FFFFFF;
	cursor: pointer;
	text-decoration: none;
}