/*************************************************************************************************
 * <APPLICATIE TITEL> CSS
 *************************************************************************************************/

/*************************************************************************************************
 * STYLE RESETS
 *************************************************************************************************/
 
    body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
        margin:0;
        padding:0;
    }
    
    table {
        border-collapse:collapse;
        border-spacing:0;
    }
    
    fieldset,img { 
        border:0;
    }
    
    ol,ul {
        list-style:none;
    }
    
    caption,th {
        text-align:left;
    }
    
    h1,h2,h3,h4,h5,h6 {
        font-size:100%;
        font-weight:normal;
    }
    
    abbr,acronym { 
        border:0;
    }
    
/*************************************************************************************************
 * GENERIEKE STYLES (UITSLUITEND "KALE" HTML-TAGS!)
 *************************************************************************************************/
 
    html, body {

    }
 
    body, td, input, select, textarea {
		font-family:			arial, verdana;
		font-size:				11px;
		color:					#772377;
		vertical-align:			top;
		line-height:			23px;
    }
    
    body {
    	background:				#f4f4ec;
		padding:				0;
		margin:					0;
		
		text-align:				center;
    }
    
    a:link, a:visited, a:hover, a:active {
    	color:#f18e19;
    }
    
    a:hover {
    }
    
    h1 {
    	font-size:18px;
    	color:#772377;
    	font-weight:bold;
    	padding-bottom:20px;
    }
    
        h2 {
    	font-size:11px;
    	color:#772377;
    	font-weight:bold;
    }
 
    h2 {
    }
    
    h3 {
    }
    
    p {
    }

/*************************************************************************************************
 * GLOBALE LAYOUT (STRAMIEN + ALGEMENE OPMAAK)
 *************************************************************************************************/

#container {
	width:999px;
	background:white;
	position:relative;
	margin:0 auto;
	text-align:left;
}

#header {
	width:999px;
	height:98px;
	background:url("../images/header.jpg") top left no-repeat;
}

#footer {
	width:999px;
	height:111px;
	background:url("../images/footer.jpg") top left no-repeat;
}

#overflow {
	overflow:hidden;
	_height:1%;
	
}

#columnLeft {
	width:468px;
	float:left;
	_width:465px;
	display:inline;
}


#columnRight {
	width:531px;
	float:right;
	display:inline;
}

#columnLeft_header {
	width:468px;
	_width:465px;
	height:34px;
	background:url("../images/columnLeftHeader.jpg") top left no-repeat;
}

#columnLeft_content {
	margin-left:30px;	
	margin-top:30px;	
	margin-bottom:0px;	
	margin-right:30px;
	height:354px;
	overflow:auto;
}


div.vacature {
	margin-left:30px;	
	margin-top:30px;	
	margin-bottom:0px;	
	margin-right:30px;
}

#columnRight_content {
	margin-left:30px;	
	margin-top:30px;	
	margin-bottom:30px;	
	margin-right:30px;	
}

#columnRight_content img {
	float:left;
	width:266px;
}

#columnRight_content #info {
	float:left;
	width:200px;
	margin-top:20px;
}


#columnRight_content ul li {
	background:url("../images/bullet.jpg") 0% 50% no-repeat;
	padding-left:30px;
}



#columnRight_header {
	width:531px;
	height:398px;
}


/*
ul#topHorLeft {
	float:left;
	display:inline;
	margin-top:65px;
	margin-left:190px;
}

ul#topHorLeft li {
	font-size:14px;
	float:left;
	display:inline;
}

ul#topHorLeft li a {
	padding-left:10px;
	padding-right:10px;
	text-decoration:none;
}
*/
ul#topHorRight {
	margin-right:16px;
	float:right;
	margin-top:65px;
	display:inline;
}

ul#topHorRight li {
	font-size:14px;
	float:left;
	display:inline;
}

ul#topHorRight li a {
	padding-left:20px;
	padding-right:20px;
	text-decoration:none;
	color:#772377;
	font-weight:bold;
}


ul#bottomLeftHor {
	float:left;
	display:inline;
	margin-top:81px;
	margin-left:40px;
}

ul#bottomLeftHor li {
	font-size:11px;
	float:left;
	display:inline;
}

ul#bottomLeftHor li a {
	padding-left:10px;
	padding-right:10px;
	text-decoration:none;
}

ul#bottomRightHor {
	float:right;
	display:inline;
	margin-top:81px;
	margin-right:40px;
}

ul#bottomRightHor li {
	font-size:11px;
	float:left;
	display:inline;
}

ul#bottomRightHor li a {
	padding-left:10px;
	padding-right:10px;
	text-decoration:none;
}

ul#topHorLeftSmall {
	position:absolute;
	top:14px;
	left:560px;
}

ul#topHorLeftSmall li {
	font-size:11px;
	float:left;
	display:inline;
}

ul#topHorLeftSmall li a {
	padding-left:10px;
	padding-right:10px;
	text-decoration:none;
}

ul#fontsizelinks {
	position:absolute;
	top:14px;
	left:650px;
}
ul#fontsizelinks li {
	font-size:11px;
	float:left;
	display:inline;
}

ul#fontsizelinks li a {
	padding-left:3px;
	text-decoration:none;
}

#search {
	position:absolute;
	top:16px;
	right:50px;
}	

#search input {
	border:1px solid #d9c6d2;
}

#search .btn {
	background:url("../images/btn.jpg") top left no-repeat;
	width:17px;
	height:19px;
	border:none;
}

ul#topHorLeft, ul#topHorLeft li ul
{
	list-style:			none;
	margin:				0px;
	padding:			0px;
}

ul#topHorLeft
{
	float:				left;
	display:			inline;
	margin-top:65px;
	margin-left:190px;
}

ul#topHorLeft li
{
	float:				left;
	display:			inline;
	font-size:14px;
	white-space: nowrap;
}

* html ul#topHorLeft li
{
	width:				1%;
}

ul#topHorLeft li a
{
	display:			block;
	text-decoration:	none;
	color:				#f18e19;
	line-height:		16px;
	
	padding-left:10px;
	padding-right:10px;
	text-decoration:none;
}

ul#topHorLeft li a:hover
{
	text-decoration:	underline;
}

ul#topHorLeft li ul
{
	width:				200px;
	position:			absolute;
	margin-top:			5px;
	margin-left:		6px;
	display:			none;
	border-top:			none;
	background-color:	#772377;
}

ul#topHorLeft li ul li
{
	margin-left:		0px;
	margin-top:			0px;
	margin-bottom:		0px;
	background:			none;
	float:				none;
	padding:			0px;
	width:				100%;
	height:				100%;
}

ul#topHorLeft li ul li a
{
	font-weight:		100;
	padding:			2px 5px;
	color:				#ffffff;
	font-size:11px;

}

ul#topHorLeft li ul li a:hover
{
	padding:			2px 5px;
	color:				white;
	background-color:	#f18e19;
	text-decoration:	none;
}

ul#topHorLeft li ul li ul
{
	border:				1px solid #BBBBBB;
	margin-top:			-20px; /* Menu hoogte in principe. Mag ook afwijken. */
	margin-left:		130px; /* Menu breedte in principe. Mag ook afwijken. */
}

/* IE */
* html ul#topHorLeft li ul li
{
	float:				left;
	clear:				both;
}

* html ul#topHorLeft li a
{
	height:				1%;
}


/*************************************************************************************************
 * PAGINA SPECIFIEKE LAYOUT + OPMAAK
 *************************************************************************************************/

 div.vacature ul li {
 	background: transparent url(../images/bullet.jpg) no-repeat scroll 0 50%;
 	padding-left:30px;
 }
 
 
	/*****************************************************
	 * PAGINA VOORBEELD 1
	 *****************************************************/

	/*****************************************************
	 * PAGINA VOORBEELD 2
	 *****************************************************/

/*************************************************************************************************
 * FORMULIER OPMAAK
 *************************************************************************************************/

.req
{
	color:			#F79331;
}

.text
{
	font-family:	verdana, arial;
	font-size:		11px;
	
	border:			1px solid #000000;
	background:		url("../cms/images/bg_textfield.jpg") top left repeat;
	
	width:			250px;
	height:			20px;
}

.button
{
	font-family:	verdana, arial;
	font-size:		11px;
	font-weight:	bold;
	color:			white;
	
	border:			1px solid #000000;
	background:		#F89432;
	
	width:			250px;
	height:			20px;
}

.textarea
{
	font-family:	verdana, arial;
	font-size:		11px;
	
	border:			1px solid #000000;
	
	width:			250px;
	height:			150px;
}

table.form
{
	font-family:	verdana, arial;
	font-size:		11px;
	color:			white;
}
td.form
{
	font-family:	verdana, arial;
	font-size:		11px;
	padding-right:	15px;
	line-height:	18px;
	width:			50%;
}
td.formInput
{
	font-family:	verdana, arial;
	font-size:		11px;
	line-height:	18px;
	padding-top:	2px;
	padding-bottom:	2px;
	width:			50%;
}
td.formInput input {
	width:			100%
}
td.formInput textarea {
	width:			100%
}
td.formInput select {
	width:			100%
}

td.formInput .SBMbutton{
	font-family:	verdana, arial;
	font-size:		11px;
	font-weight:	bold;
	color:			white;
	
	border:			1px solid #000000;
	background:		#F89432;
	
	width:			100%;
	height:			20px;
}

/*************************************************************************************************
 * OVERIGE OPMAAK
 *************************************************************************************************/
 
    
/*************************************************************************************************
 * MODIFIERS
 *************************************************************************************************/
 
    .spacer {
        clear: both;
    }