/*
Horizontaal met footer navigatie template CSS

Kleuren stalen:

body: #949393
pagewrap: #7A7A7A

header alternatief: #b60000
content: #7A7A7A
footer: alternatief: #b60001


Aanpassen van de opbouw van de website kan vanaf STRUCTUUR.
Aanpassen van de typografie (fonts e.d.) in het gedeelte TYPOGRAFIE en GLOBALE TAGS
Voor het gebruik van het horizontale menu is aangegeven waar waardes moeten worden aangepast.
*/

/******************************************
** RESETS
******************************************/

* {
	padding: 0px;
	margin: 0px;
	border: none;
}

/******************************************
** TOOLS
******************************************/

.clear {
	clear: both; /* Clearen na een float */
}

.borderTest {
	border: 1px solid red;
}

html>body #header {
	z-index: 10; /* Prevent certain problems with form controls */
}

html>body #footer {
	z-index: 10; /* Prevent certain problems with form controls */
}

form {
	height: 100%;
}

/* html>body #content {
	height: 100%;
} */

/******************************************
** TYPOGRAFIE en GLOBALE TAGS
******************************************/

h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 24px;
	font-style: normal;
	font-weight: bold;
	color: #d10e00;
}

h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 24px;
	font-style: normal;
	font-weight: bold;
	color: #d10e00;
}

h3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: bold;
}

h6 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: bold;
	line-height: 40px;
	color: #FFFFFF;
}

h6 a {
	color: #c5c9e6;
}

a {
	text-decoration: underline;
	outline-style: none;
	color: #291672;
	font-weight: bold;
}

a:hover {
	text-decoration: none;
}

img {
	border: medium none;
}

p {
}

/******************************************
** STRUCTUUR
******************************************/

html {
	/* height: 100%; */
	margin: 0;
	padding: 0;
}

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: normal;
	font-style: normal;
	color: #000000;
	height: 100%;
	background: #efefef;
	background-image: url(/upload/3595_bg.jpg);
	background-repeat: repeat-x;
}

form {
	height: 100%;
}

#pagewrap {
	margin: 0 auto;
	/* height: 100%; */
	width: 930px;
}

	/* Content */
	#content {
		width: 930px;
		background-color: #FFFFFF;
		/*background: url(/upload/3595_background_content.jpg) repeat-x; Eenmalig plaatje voor de content, dit is de "schaduw" */
	}
		
		#contenttext {
			width: 890px;
			padding: 20px;
		}
		
			#contenttext_left {
				width: 550px;
				margin: 0 20px 0px 0px;
				float: left;
				text-align: left;
			}
			
			#contenttext_left2 {
				width: 475px;
				margin: 0 20px 0px 0px;
				float: left;
				text-align: left;
			}
			
			#contenttext_right {
				width: 320px;
				float: right;
				text-align: right;
			}
			
			#contenttext_right2 {
				width: 320px;
				float: left;
				margin-top: 32px;
				
			}
			
			.pic {
				width: 320px;
				height: 240px;
				float: right;
			}

	/* Header */
	#header {
		width: 930px;
		height: 203px;
		overflow: hidden;
		background: url(/upload/3595_header.jpg) no-repeat;
	}
	
		#header h1 { /* Wegwerken van de h1 header in het logo */
			text-indent: -9999px;
			height: 0px;
			width: 0px;
		}
		
		/* Horizontale navigatie */
		ul#navigatie {
			display: block;
			width: 680px; /* width van alle buttons bij elkaar */
			height: 14px; /* hoogte van button */
			margin: 166px 0 0 250px; /* de X en Y coordinaat van het menu binnen DIV (links boven) */
		}
			
			ul#navigatie li {
				display: inline;
				overflow: hidden;
				line-height: 37px; /* hoogte van button (voor IE6) */
			}
				
				ul#navigatie li a {
					display: block;
					height: 37px; /* hoogte van button */
					float: left;
				}
				
					/* het invoegen van de verschillende buttons */
					ul#navigatie li a.nav_home {
					 	width: 58px; /* breedte van button */
					 	background: url(/upload/3595_nav_home.jpg) no-repeat;
						background-position: top left; /* uitgelijnd naar boven zodat de normale state zichtbaar is */
						text-indent: -9999px; /* wegwerken van de tekst */
					}
					
					ul#navigatie li a.nav_occasions {
					 	width: 92px; /* breedte van button */
					 	background: url(/upload/3595_nav_occasions.jpg) no-repeat;
						background-position: top left; /* uitgelijnd naar boven zodat de normale state zichtbaar is */
						text-indent: -9999px; /* wegwerken van de tekst */
					}
					
					ul#navigatie li a.nav_inkoop {
					 	width: 101px; /* breedte van button */
					 	background: url(/upload/3595_nav_inkoop.jpg) no-repeat;
						background-position: top left; /* uitgelijnd naar boven zodat de normale state zichtbaar is */
						text-indent: -9999px; /* wegwerken van de tekst */
					}
					
					ul#navigatie li a.nav_zoeken {
					 	width: 114px; /* breedte van button */
					 	background: url(/upload/3595_nav_zoeken.jpg) no-repeat;
						background-position: top left; /* uitgelijnd naar boven zodat de normale state zichtbaar is */
						text-indent: -9999px; /* wegwerken van de tekst */
					}
					
					ul#navigatie li a.nav_contact {
					 	width: 82px; /* breedte van button */
					 	background: url(/upload/3595_nav_contact.jpg) no-repeat;
						background-position: top left; /* uitgelijnd naar boven zodat de normale state zichtbaar is */
						text-indent: -9999px; /* wegwerken van de tekst */
					}
					
					ul#navigatie li a.nav_route {
					 	width: 112px; /* breedte van button */
					 	background: url(/upload/3595_nav_route.jpg) no-repeat;
						background-position: top left; /* uitgelijnd naar boven zodat de normale state zichtbaar is */
						text-indent: -9999px; /* wegwerken van de tekst */
					}
					
					ul#navigatie li a.nav_open {
					 	width: 121px; /* breedte van button */
					 	background: url(/upload/3595_nav_tijden.jpg) no-repeat;
						background-position: top left; /* uitgelijnd naar boven zodat de normale state zichtbaar is */
						text-indent: -9999px; /* wegwerken van de tekst */
					}
				
				ul#navigatie li a:hover { /* bij rollover, uitlijnen naar onder zodat rollover state zichtbaar is */
					background-position: bottom left;
				}
	
	/* Footer */
	#footer {
		width: 930px;
		height: 40px;
		overflow: hidden;
		margin: 0 auto;
		bottom: 0px;
		background: url(/upload/3595_bg_footer.jpg) repeat-x;
		text-align: center;
	}
	
		#footer #copyright {
			float: left;
			padding: 10px 0 0 45px;
			text-align: center;
		}
	
			#footer #copyright h6 {
				font-size: 13px;
				font-weight: normal;
				font-style: normal;
				margin: 0;
				padding: 0;
				lineheight: 40px;
				text-align: center;
				color: #FFFFFF;
			}
			
				#footer #copyright h3 a {
					color: #FFFFFF;
					text-decoration: underline;
				}
				
				#footer #copyright h3 a:hover {
					text-decoration: none;
				}
		
		/* Horizontale navigatie */
		ul#footer_navigatie {
			display: block;
			width: 310px; /* width van alle buttons bij elkaar */
			height: 40px; /* hoogte van button */
			margin: 30px 0 0 675px; /* de Y en X coordinaat van het menu binnen DIV (links boven) */
		}
			
			ul#footer_navigatie li {
				display: inline;
				overflow: hidden;
				line-height: 14px; /* hoogte van button (voor IE6) */
			}
				
				ul#footer_navigatie li a {
					display: block;
					height: 40px; /* hoogte van button */
					float: left;
				}
				
					/* het invoegen van de verschillende buttons */
					ul#footer_navigatie li a.footernav_faq {
					 	width: 65px; /* breedte van button */
					 	background: url(/upload/3595_footernav_faq.jpg) no-repeat;
						background-position: top; /* uitgelijnd naar boven zodat de normale state zichtbaar is */
						text-indent: -9999px; /* wegwerken van de tekst */
					}
					
					ul#footer_navigatie li a.footernav_disclaimer {
					 	width: 130px; /* breedte van button */
					 	background: url(/upload/3595_footernav_disclaimer.jpg) no-repeat;
						background-position: top; /* uitgelijnd naar boven zodat de normale state zichtbaar is */
						text-indent: -9999px; /* wegwerken van de tekst */
					}
					
					ul#footer_navigatie li a.footernav_contact {
					 	width: 115px; /* breedte van button */
					 	background: url(/upload/3595_footernav_contact.jpg) no-repeat;
						background-position: top; /* uitgelijnd naar boven zodat de normale state zichtbaar is */
						text-indent: -9999px; /* wegwerken van de tekst */
					}
				
				ul#footer_navigatie li a:hover { /* bij rollover, uitlijnen naar onder zodat rollover state zichtbaar is */
					background-position: bottom left;
				}
				
	/* Slideshow */
	#gallery {
	text-align: left;
	position: relative;
	width: 320px;
	height: 240px;
	border: 1px solid #000000;
	}

	#gallery a {
	float: left;
	position: absolute;
	}

	#gallery a img {
	border: none;
	width: 320px;
	height: 240px;
	}

	#gallery a.show {
	z-index: 500;
	}

	#gallery .caption {
	z-index: 600; 
	background-color: #3A6A92; 
	color: #FFFFFF;
	width: 320px; 
	position: absolute;
	bottom: 0px;
	}

	#gallery .caption .content {
	margin: 5px;
	color: #FFFFFF;
	}

	#gallery .caption .content h3 {
	margin: 0px;
	padding: 0px;
	color: #FFFFFF;
	}