/*
	Websitenaam
	***********
	
	Stylesheet for screens by pasz.nl
*/

/*	Basic markup
	************/

html, body {
	margin:0;
	padding:0;
	font:10px/14px "Verdana", sans-serif;
}

body {
	padding:0;
	height:100%;
	color:black;
	text-align:center;
	background:#eae298;
}




/*	Headings	*/
h1, h2, h3, h4, h5, h6 {
	margin:0 0 5px 0;
	padding:0;
	font-weight:bold;
	color:#8b1513;
}

h1 {font-size:16px;}
h2 {font-size:15px;}
h3 {font-size:14px;}
h4 {font-size:13px;}
h5 {font-size:12px;}
h6 {font-size:11px;}




/*	Basic content	*/
p {
	margin:0 0 1.5em 0;
	padding:0;
}

a {
	color:blue;
	text-decoration:underline;
}

a:hover {
	text-decoration:none;
}

img {
	border:0;
	margin:0;
	padding:0;
}




/*	Tables	*/
table {
	border-collapse:collapse;
	border:none;
}

table caption,
table th,
table td {
	margin:0;
	padding:0;
	font-style:normal;
	text-align:left;
	vertical-align:top;
}

table th {
}

table td {
	
}

table caption {
}




/*	Forms	*/
form {
	
}

form p {
	
}

form p label {
display: block;
	
}



/*	Generic classes
	***************/

.displayNone	{display:none}
.displayInline	{display:inline}



/*	Buttons	*/
.btn {
	cursor:pointer;
	cursor:hand;	
}

.btn:active	{outline:none}
.btn:focus	{-moz-outline-style:none}



/*	Basic layout
	************/

#wrapper {
	position:relative;
	width:941px;
	margin:42px auto 0 auto;
	text-align:left;
	background:repeat-y 0 0 url(../gfx/bg_wrapper.gif);
}

#logo {
	position:absolute;
	top:73px;
	left:248px;
}

#main {
	width:693px;
	padding:220px 0 0 248px;
}

#skipToNav {
	display:none;
}



/*	Navigation	*/
#nav {
	position:absolute;
	top:0;
	left:248px;
	list-style:none;
	margin:0;
	padding:0 0 0 16px;
	width:677px;
	height:18px;
	background:#830628;
}

#nav li {
	display:inline;
	margin:0;
	padding:0;
}

#nav li a {
	display:block;
	float:left;
	margin:0 31px 0 0;
	padding:0;
	font-size:12px;
	line-height:18px;
	color:white;
	text-decoration:none;
}

#nav li a:hover {
	text-decoration:underline;
}

#nav li.last-child a {
	margin:0;
}

#nav li.active a {
	color:#c7b300;
}

/*	Navigation bottom	*/
#navBottom {
	margin-left:248px;
padding-top: 70px;
	width:689px;
	text-align:center;
}

#navBottom li {
	display:inline;
	margin:0;
	padding:0;
	font:12px/18px "Verdana", sans-serif;

}

#navBottom li a {
	display:inline;
	margin:0;
	padding:0 6px 0 5px;
	text-decoration:none;
	color:#4f4f4f;
	font-size:8px;
	line-height:8px;
	text-transform:uppercase;
	border-right:1px solid #4f4f4f;
}

#navBottom li.last-child a {
	border:0;
}



/*	Adres	*/
#adres {
	position:absolute;
	top:0;
	left:0;
	width:212px;
	padding:365px 0 18px 20px;
	color:#8b1513;
	background:#fbf8d7 no-repeat 0 0 url(../gfx/bg_adres.gif);
	}
	#adres h2 {
		color: #fff;
		font-size: 1.6em;
		margin-bottom: 10px;
		}
	#adres #terugbellen {
		padding: 0 20px;
		}

#adres {
	position:absolute;
	top:0;
	left:0;
	width:232px;
	padding:18px 0 18px 0;
	color:#8b1513;
	background:#fbf8d7 no-repeat 0 0 url(../gfx/bg_adres.gif);
	}
	body#pageLanding #adres	{
		background:#fbf8d7 no-repeat 0 0 url(../gfx/bg_adres_landingspage.gif);
		}
	.btn {
		display: block;
		left: 9px;
		margin: 30px 0 40px 0;
		position: relative;
		
		}

#adres div#topImg {
	margin-bottom: 167px;
	height: 180px;
	width: 232px;
	}

#adres p
{
	padding-left: 20px;
}

#adres a {
	color:#8b1513;
	text-decoration:none;
}

#adres a:hover {
	text-decoration:underline;
}

#adres #naam {
	display:none;
}



/*	Page: Home */
#pageHome h1 {
	display:none;
}

#pageHome #main {
	padding-top:196px;
}

div.blok {
	position:relative;
	float:left;
	margin:0 31px 0 0;
	width:210px;
	height: 340px;
	background:#eee066 no-repeat 0 100% url(../gfx/bg_blok.gif);
}

div.blok .visual {
	position:absolute;
	top:8px;
	left:0;
}

div.blok h2 {
	height:16px;
	margin:0 0 10px 0;
	padding:150px 16px 5px 16px;
	color:white;
	font-size:13px;
	line-height:16px;
	font-weight:normal;
	text-transform:uppercase;
	background:#b6a614;
	text-align: center;
}

div.blok p {
	padding:0 16px;
	color:#8b1513;
	height: 120px;
}

#blokDiensten {
	background-color:#ffaa8f;
}

#blokDiensten h2 {
	background:#830628;
}

#blokTestimonials {
	margin-right:0;
	background-color:#bdaebf;
}

#blokTestimonials h2 {
	background:#8e7692;
}

#blokNieuws  a
{
	color: #8b1513 !important;
	font-size: 11px;
}

#blokNieuws table tr td
{
	padding: 0 16px 0 16px;
}

#blokNieuws table
{
	margin-bottom: 20px;
	height: 120px;
}



/*	Page: Medewerkers	*/
#medewerkers {
	margin:0 0 0 125px;
	width:330px;
	height:236px;
	background:no-repeat 0 0 url(../gfx/medewerkers.jpg);
}



/*	Hacks
	*****/

/* slightly enhanced, universal clearfix hack */
.clearfix:after,
#main:after {
	visibility:hidden;
	display:block;
	font-size:0;
	content:" ";
	clear:both;
	height:0;
}
.clearfix,
#main {display:inline-block;}
/* start commented backslash hack \*/
* html .clearfix,
* html #main {height:1%;}
.clearfix,
#main {display:block;}
/* close commented backslash hack */

textarea {
	height: 200px;
	width: 300px;
	}
	
/*
Title	: Form
====================================== */

legend {
	display: none;
	}

label, input[type="text"], select, textarea {
	color: #000;
	font-size: 1.2em;
	}
	
/* Textfield
====================================== */	
.frm-field label {
	color: #fff;
	display: block;
	float: left;
	margin-bottom: 4px;
	padding-top: 3px;
	padding-right: 30px;
	width: 170px;
	}

.frm-field {
	/*height: 100%;*/
	margin-bottom: 10px;
	position: relative;
	}
	.frm-field input {
		width: 185px;
		}

/* Textarea
====================================== */
.frm-field textarea {
	height: 100px;
	width: 200px;
	}

/* Required
====================================== */
.frm-required {
	background: url(../gfx/css/required.png) no-repeat left top;
	color: #cc0000;
	height: 16px;
	left: 175px;
	position: absolute;
	top: 2px;
	vertical-align: top;
	width: 16px;
	}

/* Checkboxes
====================================== */
.frm-checkbox {
	margin-bottom: 10px;
	position: relative;
	}

.frm-checkbox label {
    display: block;
    float: left;
    padding-right: 30px;
    padding-top: 3px;
    width: 170px;
	}	
	.frm-checkbox fieldset label {
    	float: left;
    	margin-top: -16px;
    	padding: 0 0 0 24px;
    	width: auto;
		}

.frm-checkbox fieldset input {
    display: block;
    height: 14px;
    margin: 4px 1px 1px;
    width: 18px;
	}


/* Radiobuttons
====================================== */
.frm-radio {
	margin-bottom: 10px;
	position: relative;
	}

.frm-radio label {
    display: block;
    float: left;
    padding-right: 30px;
    padding-top: 3px;
    width: 170px;
	}	
	.frm-radio fieldset label {
    	float: left;
    	margin-top: -16px;
    	padding: 0 0 0 24px;
    	width: auto;
		}

.frm-radio fieldset input {
    display: block;
    height: 14px;
    margin: 4px 1px 1px;
    width: 18px;
	}
	
/* Selectbox
====================================== */
.frm-select label {
	display: block;
	float: left;
	font-size: 1.2em;
	padding-top: 3px;
	padding-right: 30px;
	width: 170px;
	}
	
.frm-select {
	/*height: 100%;*/
	margin-bottom: 10px;
	position: relative;
	}
	
/* Submit
====================================== */
.frm-submit {
	margin-bottom: 0.8em;
	margin-left: 96px;
	margin-top: 10px;
	}

/* Error view
====================================== */
.errorMsg {
	height: 30px;
	margin-bottom: 0.8em;
	}
	.errorMsg p {
   		border: 1px solid #E46330;
    	color: #E46330;
    	font-size: 1.2em;
    	padding: 2px 4px;
		}

.frm-field.error input,
.frm-field.error textarea {
	border: 2px solid #e46330;
	}


