/***************************************************************************************
* Salarisbureau Hofstee & Kruisinga * www.hofstee-kruisinga.nl * Cascading Style Sheet *
****************************************************************************************/

/* Generic *****************************************************************************/
html { 
	font-size: 100%;
	height: 100%;
	margin-bottom: 1px;
	}
body {
	width: 100%; height: 100%;
	background-color: #fff;
	background: url('/images/bg.jpg') no-repeat 50% 117px;
	text-align: center;
	font-family: 'Trebuchet MS', Tahoma, Verdana, sans-serif;
	color: #444;
	font-size: 13px;
	margin: 0; padding: 0;
	}
	body#minimize { background: url('/images/bg_minimize.jpg') no-repeat 50% 117px; }

a:link { color: #034ea2; text-decoration: none; }
a:visited { color: #0089d0; text-decoration: none; }
a:active,a:hover { color: #9bd22d; text-decoration: none; }

p { margin: 0 0 10px; padding: 0; }
pre,code { font-family: monospace; }
sub, sup { line-height: 0; font-size: 12px; }
table,td,th { border: 1px solid #efefef; border-collapse: collapse; padding: 5px; }

h1 { margin: 0; padding: 15px 0 0; }
h2 { position: relative; float: left; margin: 0; padding: 0; }
	h2 a { 
		display: block;
		background-position: 0 0;
		background-repeat: no-repeat;
		text-indent: -5000px;
		overflow: hidden;
		}
h3,h4 { font-size: 13px; margin: 0; padding: 0; }
	h4 a { font-weight: normal; }

img { display: block; border: 0; }
form { margin: 0; padding: 0; }
fieldset { border: 1px solid #eaeaea; padding: 0 10px 10px; }
	fieldset.clear { border: none; margin: 0; padding: 0; }
legend { color: #9bd22d; padding: 10px 0; }
div { margin: 0; padding: 0; }

/* Identities **************************************************************************/
h2 a#home:hover,h2 a#diensten:hover,h2 a#bedrijfsprofiel:hover,h2 a#vragen:hover,h2 a#contact:hover,h2 a#sitemap:hover,h2 a#home.active,h2 a#home.active:hover,h2 a#diensten.active,h2 a#diensten.active:hover,h2 a#bedrijfsprofiel.active,h2 a#bedrijfsprofiel.active:hover,h2 a#vragen.active,h2 a#vragen.active:hover,h2 a#contact.active,h2 a#contact.active:hover,h2 a#sitemap.active,h2 a#sitemap.active:hover { background-position: 0 -16px; }
h2 a#actueel:hover,h2 a#salaris:hover,h2 a#interim:hover,h2 a#advies:hover { background-position: 0 -57px; }
h2 a#actueel.active,h2 a#actueel.active:hover,h2 a#salaris.active,h2 a#salaris.active:hover,h2 a#interim.active,h2 a#interim.active:hover,h2 a#advies.active,h2 a#advies.active:hover { background-position: 0 -114px; }

/* Primary navigation */
h2 a#home { margin: 15px 0 0 362px; background-image: url('/images/h2_home.gif'); width: 41px; height: 16px; }
h2 a#diensten { margin: 15px 0 0 17px; background-image: url('/images/h2_diensten.gif'); width: 65px; height: 16px; }
h2 a#bedrijfsprofiel { margin: 15px 0 0 17px; background-image: url('/images/h2_bedrijfsprofiel.gif'); width: 111px; height: 16px; }
h2 a#vragen { margin: 15px 0 0 17px; background-image: url('/images/h2_vragen.gif'); width: 51px; height: 16px; }
h2 a#contact { margin: 15px 0 0 17px; background-image: url('/images/h2_contact.gif'); width: 58px; height: 16px; }
h2 a#sitemap { margin: 15px 3px 0 17px; background-image: url('/images/h2_sitemap.gif'); width: 60px; height: 16px; }

/* Secondary navigation */
h2 a#actueel { background-image: url('/images/h2_actueel.jpg'); width: 189px; height: 57px; }
h2 a#salaris { background-image: url('/images/h2_salaris.jpg'); width: 189px; height: 57px; }
h2 a#interim { background-image: url('/images/h2_interim.jpg'); width: 189px; height: 57px; }
h2 a#advies { background-image: url('/images/h2_advies.jpg'); width: 190px; height: 57px; }

#home_bg {
	position: relative;
	float: left;
	width: 768px; height: 267px;
	background: url('/images/home_bg.jpg') no-repeat 0 0;
	}
	#home_bg h3 { margin: 43px 0 0 25px; }
	#home_bg h4 { margin: 6px 0 0 25px; }
#diensten_bg {
	position: relative;
	float: left;
	width: 768px; height: 141px;
	background: url('/images/diensten_bg.jpg') no-repeat 0 0;
	}
	#diensten_bg h3 { margin: 42px 0 0 25px; }
#page {
	position: relative;
	float: left;
	padding: 0 25px;
	}
	.contact_bg { background: url('/images/contact_bg.jpg') no-repeat 0 0; }
	.clear_bg { background: url('/images/clear_bg.jpg') no-repeat 0 0; }
#article {
	position: relative;
	float: left;
	width: 524px;
	margin: 15px 6px 10px 9px;
	display: inline;
	}
	#article ul { list-style-image: url('/images/icon_list.gif'); }
	#article ul.default,#article ul.default li { list-style-image: url('/images/icon_bullet.gif'); }
	#article ul li { margin: 0; padding-left: 5px; }
#column {
	position: relative;
	float: left;
	width: 474px;
	margin: 25px 15px 10px 0;
	display: inline;
	}
	#column a.category { font-weight: bold; }
	#column a.sub { margin-left: 10px; }
#answers {
	position: relative;
	clear: left;
	float: left;
	width: 100%;
	display: inline;
	}
#menu {
	position: relative;
	float: left;
	width: 214px; height: 258px;
	background: url('/images/menu_bg.jpg') no-repeat 0 0;
	padding: 12px 0 0 15px;
	display: inline;
	}
	.main_menu { margin: 15px 0 0; }
	.contact_menu { margin: 49px 0 0; }
	.default_menu { margin: 25px 0 0; }
#footer {
	position: relative;
	float: left;
	width: 760px;
	margin: 10px 4px 0;
	text-align: center;
	display: inline;
	font-size: 12px;
	}

#form {
	position: relative;
	float: left;
	width: 474px;
	margin: 15px 15px 0 0;
	display: inline;
	}
	#form label {
		clear: left;
		float: left;
		display: block;
		width: 150px;
		text-align: left;
		padding-right: 8px; 
		}
		#form label.radio { clear: none; width: auto; }
	#form input {
		float: left;
		display: block;
		width: 275px;
		margin-bottom: 5px;
		}
	#form textarea {
		clear: left;
		float: left;
		display: block;
		width: 433px; height: 100px;
		}

span.button a#button_contact { background-image: url('/images/button_contact.jpg'); width: 174px; height: 25px; }
span.button a#button_informatie { background-image: url('/images/button_informatie.jpg'); width: 174px; height: 25px; }

span#nav_left {	position: relative;	float: left; width: 4px; height: 57px; background: url('/images/nav_left.jpg') no-repeat 0 0; }
span#nav_right { position: relative; float: left; width: 4px; height: 57px;	background: url('/images/nav_right.jpg') no-repeat 0 0; }
span#nav_d1 { width: 1px; height: 57px;	position: relative;	float: left; background: url('/images/nav_d1.jpg') no-repeat 0 0; }
span#nav_d2 { width: 1px; height: 57px;	position: relative;	float: left; background: url('/images/nav_d2.jpg') no-repeat 0 0; }
span#nav_d3 { width: 1px; height: 57px;	position: relative;	float: left; background: url('/images/nav_d3.jpg') no-repeat 0 0; }
span#nav_d1.shadow,span#nav_d2.shadow,span#nav_d3.shadow { background-position: 0 -57px; }
span#nav_d1.highlight,span#nav_d2.highlight,span#nav_d3.highlight { background-position: 0 -114px; }

input#gebruikersnaam,input#wachtwoord { margin-bottom: 5px; width: 195px; }
input#man,input#vrouw { width: auto; }
input#button_login { margin: 15px 55px 5px 40px; background-image: url('/images/button_login.jpg'); width: 119px; height: 25px; }
input#button_submit { margin: 10px 0 0; background-image: url('/images/button_submit.jpg'); width: 204px; height: 25px; }

span.button a#button_contact:hover,span.button a#button_informatie:hover,input#button_login:hover,input#button_login.hover,input#button_submit:hover,input#button_submit.hover { background-position: 0 -25px; }

/* Classes *****************************************************************************/
div.center {
	position: relative;
	width: 768px;
	text-align: left;
	margin: 0 auto;
	}
div.fullbox {
	clear: right;
	float: left;
	width: 420px;
	margin: 10px 0 0;
	overflow: hidden;
	}
span.button { position: relative; float: left; margin: 61px 0 0 25px; }
	span.button a {
		display: block;
		background-position: 0 0;
		background-repeat: no-repeat;
		text-indent: -5000px;
		overflow: hidden;
		}
span.label {
	clear: left;
	float: left;
	display: block;
	width: 155px;
	text-align: left;
	padding-right: 8px;
	margin-bottom: 9px;
	}
span.align { float: left; display: block; margin-right: 10px; }
span.error,label.error { color: #ff0000; }
span.example { font-style: italic; font-size: 11px; }

.first { margin-top: 10px; }
.last { margin-bottom: 10px; }
.date { color: #666; font-style: italic; }
.formtext { display: block; margin: 5px 0 0 14px; }

a.clear:link { color: #9bd22d; text-decoration: none; }
a.clear:visited { color: #9bd22d; text-decoration: none; }
a.clear:active,a.clear:hover { color: #9bd22d; text-decoration: none; }

img.title { margin-top: 25px; }
img.headline { margin-bottom: 5px; }
img.icon { display: inline; vertical-align: bottom; }

table.article { 
	width: 400px;
	margin-bottom: 10px;
	}
	table.article th { width: 200px; }