/* ------------------------------------------------------ */
/* Copyright 2008 (Non-)verbaal, http://www.nonverbaal.nl */
/* -------------------------------------------------------*/

@import url("reset.css");
@import url("clearfix.css");
@import url("form.css");

body {
	background: #D3D3D3;
	font: 62.5% Verdana, Arial, Helvetica, sans-serif;

}

a { color: #00B1EC; font-weight: bold; text-decoration: underline; }
a:hover, a:active { text-decoration: none; }


/*** Menu ***/
#nav { position: absolute; margin-left: 11px; }
#nav ul { padding: 0; margin: 0; list-style: none; }
#nav a { position:relative; display:block; height: 38px; text-indent: -9999px; outline: none; background-color: transparent; background-repeat: no-repeat; background-image: url(../images/bg/menu.jpg); }
#nav li { float: left; list-style: none; }
#nav li ul { position: absolute; left: -999em; width: 10em; }
#nav li:hover ul, #nav li.over ul { left: auto; z-index: 3000; }
#nav li a span { display:none;}
	
#menu_1 a { background-position: -0px 0px; width: 98px; }
#menu_2 a { background-position: -98px 0px; width: 109px; }
#menu_3 a { background-position: -207px 0px; width: 95px; }
#menu_4 a { background-position: -302px 0px; width: 107px; }
#menu_5 a { background-position: -409px 0px; width: 88px; }
#menu_6 a { background-position: -497px 0px; width: 97px; }

#menu_1 a:hover, #menu_1.active a { background-position: -0px -38px; }
#menu_2 a:hover, #menu_2.active a { background-position: -98px -38px; }
#menu_3 a:hover, #menu_3.active a { background-position: -207px -38px; }
#menu_4 a:hover, #menu_4.active a { background-position: -302px -38px; }
#menu_5 a:hover, #menu_5.active a { background-position: -409px -38px; }
#menu_6 a:hover, #menu_6.active a { background-position: -497px -38px; }

/* Content ---------------------------------------------- */
div#content h1,
div#content h2,
div#content h3,
div#content h4 { margin-top: 1em; margin-bottom: 0.5em; }
div#content div { line-height: 1.5em; }
div#content strong { font-weight: bold; }
div#content em { font-style: italic; }
div#sidebar p, 
div#content table, 
div#content p { margin-bottom: 1.1em; }
div#content table td { vertical-align: top; padding: 0 0 1em 0; }
div#content table ul { margin: 0em 2.2em; }
div#content div ul { list-style: disc; margin: 1.1em 2.2em; }
div#content div ol { list-style: decimal; margin: 1.1em 2.2em; }

#container { width: 870px; margin: 0px auto; position : relative; background-image : url(../images/bg/main.jpg); }
#header { width: 100%; height: 306px; background : url(../images/bg/headers/1.jpg); }
#main { width: 100%; background-image : url(../images/bg/content.gif); background-repeat : repeat-y; font-size: 110%; line-height: 160%; }
#content {
	width: 438px;
	border: 1px solid #E2E2E2;
	float: left;
	margin: 0px 0px 0px 13px;
	padding: 10px 30px 20px 30px;
}
#vacature_holder {
		width: 498px;
	border: 1px solid #E2E2E2;
	float: left;
	margin: 10px 0px 0px 13px;

}
#sidebar { width: 280px; height: 200px; float: left; margin: 0px 0px 0px 5px; padding: 19px 30px 20px 30px; }
#footer { width: 100%; height: 100px; background-image : url(../images/bg/footer.jpg); background-repeat : no-repeat; background-color: #D3D3D3; }

#cv #header { background : url(../images/bg/headers/3.jpg); }
#contact #header { background : url(../images/bg/headers/2.jpg); }
#specialisme #header { background : url(../images/bg/headers/4.jpg); }
#vacatures #header { background : url(../images/bg/headers/5.jpg); }

/* overige */
div.hr { margin: 10px 0px 10px 0px; height: 1px; background: url(../images/bg/hr.gif) repeat-x scroll center; }
div.hr hr { display: none; }

p.datum { color: #00B1EC; font-weight: bold; }
p.blue { color: #00B1EC; }

ul.ul_specialismen li { background-image : url(../images/bg/ul_specialismen.gif); background-repeat : no-repeat; padding: 0px 0px 0px 20px; margin: 0px 0px 5px 0px; font-weight: bold; }

#breadcrump { font-weight: bold; background: url(../images/bg/hr.gif) bottom repeat-x; margin-top: 10px; padding: 7px 0px 7px 0px; font-size: 90%; }
#breadcrump a { color: black; text-decoration : none; }
#breadcrump a:hover { text-decoration : underline; }

ul.most_recent { color: #00B1EC; font-weight: bold; margin: 10px 0px 10px 0px; }
ul.most_recent li { margin: 8px 0px 8px 0px; padding-bottom: 8px; line-height : 25px; background: url(../images/bg/hr.gif) bottom repeat-x; }
ul.most_recent li a { padding: 5px 0px 5px 28px; color: white; }
ul.most_recent li#rec_1 a { background: url(../images/bg/recent/1.gif) no-repeat left; }
ul.most_recent li#rec_2 a { background: url(../images/bg/recent/2.gif) no-repeat left; }
ul.most_recent li#rec_3 a { background: url(../images/bg/recent/3.gif) no-repeat left; }

a.register_black { width: 158px; height: 18px; display : block; text-indent: -9999px; outline: none; background-image : url(../images/buttons/normal/schrijf_in_black.jpg); }
a.register_black:hover { background-image : url(../images/buttons/over/schrijf_in_black.jpg); }
a.register_white { width: 152px; height: 18px; display : block; text-indent: -9999px; outline: none; background-image : url(../images/buttons/normal/schrijf_in_white.jpg); }
a.register_white:hover { background-image : url(../images/buttons/over/schrijf_in_white.jpg); }
a.stuur_cv_white { width: 162px; height: 18px; display : block; text-indent: -9999px; outline: none; background-image : url(../images/buttons/normal/stuur_cv_white.jpg); }
a.stuur_cv_white:hover { background-image : url(../images/buttons/over/stuur_cv_white.jpg); }
a.verstuur_cv_white { width: 192px; height: 18px; display : block; text-indent: -9999px; outline: none; background-image : url(../images/buttons/normal/verstuur_cv_white.jpg); }
a.verstuur_cv_white:hover { background-image : url(../images/buttons/over/verstuur_cv_white.jpg); }

div.vac_equal {
	background : white;
	width: 438px;
	margin: 0px 0px 0px 0px;
	padding: 20px 30px 20px 30px;
}
div.vac_not_equal {
	background : #EDF9FE;
	width: 438px;
	margin: 0px 0px 0px 0px;
	padding: 20px 30px 20px 30px;
}

div.contactgegevens { font-weight: bold; color: white; }
div.contactgegevens h2  { margin: 260px 0px 10px 0px; }
div.contactgegevens p { padding-left: 25px; }
div.contactgegevens p.close_with_envelope { background-image : url(../images/envelop.gif); background-position : bottom left; background-repeat : no-repeat; }
div#content div.contactgegevens { font-weight: bold; color: black; }

div.form-container form p { margin: 20px 0 0 0; font-weight: bold; }
div.form-container form p.note { margin-left: 170px; font-size: 90%; color: #333; }
div.form-container form fieldset { margin: 10px 0; padding: 10px; /*border: #DDD 1px solid;*/ }
div.form-container form legend { font-weight: bold; color: #666; }
div.form-container form fieldset div { padding: 0.25em 0; }
div.form-container input, textarea { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 120%; margin:10px 0px 0px 0px; background : #F2FCFF; border: 1px solid #A6EAFF; }
div.form-container label, 
div.form-container span.label { margin:10px 0px 0px 0px; padding-right: 10px; width: 150px; display: block; float: left; text-align: left; font-weight: bold; }
div.form-container textarea.fullwidth { width: 100%; height: 250px; }
div.form-container #attach_cv { width: 100%;  }


div.form-container label.right {width:222px; float:right;}
div.form-container fieldset.smallform label { margin:10px 0px 0px 0px; padding-right: 10px; width: 70px; display: block; float: left; text-align: right; }
div.form-container fieldset.smallform .button {margin-left:78px;}
div.form-container label.error, 
div.form-container span.error { color: #C00; }
div.form-container label em, 
div.form-container span.label em { position: absolute; right: 0; font-size: 120%; font-style: normal; color: #C00; }
div.form-container input.error { border-color: #C00; background-color: #FEF; }
div.form-container div.controlset label, 
div.form-container div.controlset input { display: inline; float: none; }
div.form-container div.controlset div { margin-left: 170px; }
div.form-container div.buttonrow { 	position: relative; /* Needed to solve the Peekaboo bug in IE6 */ margin-left:158px; }
div.form-container div.buttonrow input { padding:2px;}
div.form-container span.dagnotatie { color:#999999; }
div.form-container input.inputshort { width:132px; }
div.form-container input.inputshorter { width:62px; }
div.form-container label.radiolabel { width:30px; color:#999999; float:none; display: inline; margin-right:7px; }