/* ################################################################################# */
/*                                                                                   */
/*                                     BODY                                          */
/*                                                                                   */
/* ################################################################################# */

* {
	margin: 			0; 
	padding: 			0; 
}

html, body {
	height: 			100%; 
}

html {
	font-size: 			100%; 
	overflow-y:			scroll;	/* laat altijd de linker scrollbalk zien in FireFox */
}

body {
	background:			#FFFFFF; 
	color: 				#000000; 
	font-family: 		"Trebuchet MS", Verdana, Helvetica, sans-serif; 
	font-size: 			62.5%; /* standaard font grootte is nu 10px, dus 1.2em = 12px */
	line-height: 		140%; 
	text-align: 		center; 
}

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

/*                                                                                   */

/*                                   DEFAULT                                         */

/*                                                                                   */

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

h1 {
	color:				#CF0A37; 
	font-family: 		"Trebuchet MS", Verdana, Helvetica, sans-serif; 
	font-size:			1.8em; 
	line-height:		1.2em; 
	margin:				0 0 0.25em 0; 
}

h2 {
	background:			url(../images/aanhalingstekens.gif) no-repeat left top; 
	color:				#000000; 
	font-family: 		"Trebuchet MS", Verdana, Helvetica, sans-serif; 
	font-size:			1.2em; 
	font-style:			italic; 
	line-height:		1.2em; 
	margin:				0.75em 0 1em 0; 
	padding:			0 0 0 30px; 
}

h3 {
	color:				#CF0A37; 
	font-family: 		"Trebuchet MS", Verdana, Helvetica, sans-serif; 
	font-size:			1.2em; 
	line-height:		1.2em; 
	margin:				1.5em 0 0 0; 
}

h4 {
	color:				#000000; 
	font-family: 		"Trebuchet MS", Verdana, Helvetica, sans-serif; 
	font-size:			1.2em; 
	font-style:			italic; 
	line-height:		1.2em; 
	margin:				0.75em 0 0 0; 
}

h5 {
	color:				#000000; 
	font-family: 		"Trebuchet MS", Verdana, Helvetica, sans-serif; 
	font-size:			1.2em; 
	font-style:			italic; 
	line-height:		1.2em; 
	margin:				0 0 0 0; 
}

p {
	font-size:			1em; 
	line-height:		1.5em; 
	margin:				0 0 1em 0; 
}

table, tr, td {
	font-size:			1em; 
}

img {
	border: 			0; 
}

ul {
	list-style: 		none; 
	margin: 			0; 
	padding: 			0; 
}

a {
	color:				#CF0A37; 
	text-decoration:	underline; 
}

a:hover {
	color:				#000000; 
	text-decoration:	underline; 
}

.clear-both {
	clear:				both; 
}

/* ################################################################################# */
/*                                                                                   */
/*                                  CONTAINER                                        */
/*                                                                                   */
/* ################################################################################# */

#containerbox {
	position:			relative; 
	min-height: 		100%; 
	height: 			100%; 
	voice-family: 		"\"}\""; 
	voice-family: 		inherit; 
	height: 			auto; 
}

html>body #containerbox {
	height: 			auto; 
}

#wrapper {
	margin: 			0 auto; 
	padding: 			0 0 30px 0; 
	text-align: 		left; 
	width: 				980px; 
}

/* ################################################################################# */
/*                                                                                   */
/*                                   HEADER                                          */
/*                                                                                   */
/* ################################################################################# */

#header {
	background:			url(../images/bg_topmenu.jpg) no-repeat right top; 
	clear: 				both; 
	font-size:			1.1em; 
	height:				80px; 
}

/* logo */

h1#m4wonen-logo {
	float: 				left; 
	margin:				0 0 0 10px; 
	padding:			10px 0 0 0; 
}

h1#m4wonen-logo a {
	display: 			block; /* h1 in de header wordt vervangen door het M4 Wonen logo */
}

h1#m4wonen-logo a span {
	display: 			none; 
}

#header ul {
	display:			inline; 
	
 	float: 				right; 
	
 	list-style: 		none; 
	margin:				10px 10px 0 0; 
}
#header ul li {
	color:				#FFFFFF; 
	
 	float: 				left; 
	line-height:		1em; 
}

#header ul li.first a {
	border-left:		none; 
}

#header ul li.active a {
	color:				#000000; 
	text-decoration:	none; 
}

#header a {
	border-left:		1px solid #FFFFFF; 
	color:				#FFFFFF; 
	
 	padding: 			0 10px; 
	text-decoration:	none; 
}

#header a:hover {
	color:				#000000; 
	text-decoration:	none; 
}

/* ################################################################################# */
/*                                                                                   */
/*                                 SLIDESHOW                                         */
/*                                                                                   */
/* ################################################################################# */

#slideshow {
	float:				left; 
	height:				250px; 
	width:				680px; 
}
/* ################################################################################# */
/*                                                                                   */
/*                                  BOXEN	                                         */
/*                                                                                   */
/* ################################################################################# */

#inzetten {
	color:				#000000; 
	float:				left; 
	font-size:			1.3em; 
	margin:				10px 10px 20px 20px; 
	text-align:			left; 
	width:				650px; 
}

.inzet {
	background:			url(../images/bg_box_bottom.jpg) top left no-repeat; 
	float:				left; 
	height:				150px; 
	margin:				20px 0 0 0; 
	width:				300px; 
}

.inzet_content {
	height:				120px; 
	margin:				15px 25px; 
	width:				250px; 
}

.inzet_content h1, .inzet_content h2, .inzet_content h3, .inzet_content h4 {
	margin-top:			0; 
}


/* ################################################################################# */
/*                                                                                   */
/*                                   CONTENT                                         */
/*                                                                                   */
/* ################################################################################# */

#content {
	background:			url(../images/bg_content.jpg) repeat-x left top; 
	clear: 				both; 
	height: 			400px; 
	min-height: 		400px; 
	margin:				0 0 25px 0; 
	text-align:			left; 
	width:				980px; 
}

/* ################################################################################# */
/*                                                                                   */
/*                                CONTENT BREADCRUMB                                 */
/*                                                                                   */
/* ################################################################################# */

#content-breadcrumb {
	clear:				both; 
	margin:				0 20px; 
	padding:			8px 0; 
	text-align:			left; 
	width:				940px; 
}

#content-breadcrumb ul {
	
 	list-style: 		none; 
}

#content-breadcrumb ul li {
	background:			url(../images/breadcrumb.gif) no-repeat left center; 
	color:				#FFFFFF; 
	display:			inline; 
	line-height:		1em; 
}

#content-breadcrumb ul li.first a {
	background:			none; 
}

#content-breadcrumb ul li.active a {
	color:				#CF0A37; 
	text-decoration:	none; 
}

#content-breadcrumb a {
	color:				#000000; 
	padding: 			0 5px 0 15px; 
	text-decoration:	none; 
}

#content-breadcrumb a:hover {
	color:				#CF0A37; 
	text-decoration:	none; 
}


/* ################################################################################# */
/*
/*                                      CONTENT                                      */
/*                                                                                   */
/* ################################################################################# */

#content-left {
	color:				#000000; 
	float:				left; 
	font-size:			1.3em; 
	margin:				10px 60px 20px 20px; 
	text-align:			left; 
	width:				600px; 
}

#content-left ul li {
	background:			url(../images/bullit.gif) no-repeat left 4px; 
	line-height:		1.5em; 
	margin:				0 0 0.5em 0; 
	padding:			0 0 0 18px; 
}

#content-left ul.sitemap {
	margin:				0 0 2em 0; 
}

#content-left ul li.subpageli {
	background:			url(../images/bullit.gif) no-repeat left 4px; 
	line-height:		1.5em; 
	margin:				0 0 0.5em 25px; 
	padding:			0 0 0 18px; 
}

#content-left ol li {
	line-height:		1.5em; 
	list-style-position: outside; 
	margin:				0 0 0.5em 25px; 
}

#content-left .homenieuws a {
	color:				#000000; 
	text-decoration:	none;	
}

#content-left .homenieuws a:hover {
	color:				#CF0A37; 
	text-decoration:	none;	
}

#content-left .datum {
	color:				#CF0A37; 
	font-weight:		bold; 
	padding:			0 15px 0 0; 
}

#content-left dl {
	margin:				0 0 2em 0; 
}

#content-left dl a {
	display:			block; 
	background:			#FFFFFF url(../images/bg_rijen.jpg) no-repeat left bottom; 
	color:				#000000; 
	padding:			10px; 
	text-decoration:	none;	
}

#content-left dl a:hover {
	background:			#F0F0F0 url(../images/bg_rijen_over.jpg) no-repeat left bottom; 
	text-decoration:	none;	
}

#content-left dl.locatieoverzicht img {
	float:				left; 
	margin:				0 15px 0 0; 
	z-index:			1; 
}

#content-left dl.locatieoverzicht img.label {
	float:				left; 
	margin:				0 -115px 0 0; 
	position:			relative; 
	left:				-115px; 
	z-index:			2; 
}

#content-left dl img.pijl, #content-left dl.locatieoverzicht img.pijl {
	float:				right; 
	position:			relative; 
	top:				-15px; 
	z-index:			0; 
}

#content-left dl.locatieoverzicht a {
	height:				100%; 
}

#content-left dl.locatieoverzicht a {
	height:				auto; 
}

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

.woning td {
	clear:				both; 
	vertical-align: 	bottom; 
}

.prijs {
	background:			url(../images/bg_rijen.jpg) no-repeat left bottom; 
	float:				right; 
	font-size:			1em; 
	padding:			20px; 
	width:				auto; 
}

.fotogallery td {
	padding:			5px;
}

#content-right {
	background:			url(../images/bg_nwe_projecten.jpg) no-repeat left top; 
	float:				right; 
	font-size:			1.3em; 
	margin:				10px 0 20px 0; 
	text-align:			left; 
	width:				300px; 
}

#content-right ul li {
	background:			url(../images/bullit_grijs.gif) no-repeat left 4px; 
	color:				#FFFFFF; 
	line-height:		1.5em; 
	margin:				0 0 0.5em 0; 
	padding:			0 0 0 18px; 
}

#content-right #nieuweprojecten {
	clear:				both; 
	height:				373px; 
	margin:				25px; 
	width:				250px; 
}

#content-right #nieuweprojecten h1, #content-right #nieuweprojecten h4, #content-right #nieuweprojecten p {
	font-style:			normal; 
	color:				#FFFFFF; 
}

#content-right #nieuweprojecten h1 {
	margin:				0 0 0.5em 0; 
}

#content-right #nieuweprojecten h4 {
	font-size:			1em; 
	margin:				0; 
}

#content-right #nieuweprojecten a {
	color:				#000000; 
}

#content-right #nieuweprojecten a:hover {
	color:				#FFFFFF; 
}

#content-right dl.locatieoverzicht {
	margin:				0 0 15px 0; 
}

#content-right dl.locatieoverzicht a {
	background:			url(../images/devider_nwe_projecten.jpg) no-repeat left bottom; 
	display:			block; 
	height:				100px; 
	text-decoration:	none; 
}

#content-right dl.locatieoverzicht a:hover {
	background:			#666666 url(../images/devider_nwe_projecten.jpg) no-repeat left bottom; 
}

#content-right dl.locatieoverzicht img {
	float:				left; 
	margin:				0 15px 0 0; 
	z-index:			1; 
}

#content-right dl.locatieoverzicht img.label {
	float:				left; 
	position:			relative; 
	left:				-115px; 
	margin:				0 -115px 0 0; 
	z-index:			2; 
}

#content-right dl.locatieoverzicht img.button {
	float:				right; 
	margin:				0 10px 0 0; 
}

/* ################################################################################# */
/*                                                                                   */
/*                                   FOOTER                                          */
/*                                                                                   */
/* ################################################################################# */

#footer {
	background:			url(../images/bg_footer.jpg) repeat-x left top; 
	clear: 				both; 
	font-size:			1.1em; 
	height:				30px; 
		/*
	position: 			absolute; 
		bottom: 			0; 
		*/
	text-align:			right; 
	width:				980px; 
	/*width:				100%;*/
}

#footer ul {
	display:			inline; 
 	float: 				right; 
 	list-style: 		none; 
	margin:				10px 10px 0 0; 
}

#footer ul li {
	color:				#FFFFFF; 
	float: 				left; 
	line-height:		1em; 
}

#footer ul li.first a {
	border-left:		none; 
}

#footer ul li.active a {
	color:				#000000; 
	text-decoration:	none; 
}

#footer a {
	border-left:		1px solid #FFFFFF; 
	color:				#FFFFFF; 
	padding: 			0 10px; 
	text-decoration:	none; 
}

#footer a:hover {
	color:				#000000; 
	text-decoration:	none; 
}
