/*
Verticaal met footer navigatie template CSS

Kleuren stalen:

body: #949393

header alternatief: #b60000 (Voor als de slice niet geladen kan worden)
footer: alternatief: #b60001 (Voor als de slice niet geladen kan worden)


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 */
}

html>body {
	height: 100%;
}

#_ctl0 {
	height: 100%;
}
/******************************************
** TYPOGRAFIE en GLOBALE TAGS
******************************************/
h1 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 22px;
	font-style: bold;
	font-weight: bold;
}

h2 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 14px;
	font-style: italic;
	font-weight: normal;
}

h3 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 20px;
	font-style: bold;
	font-weight: bold;
	color: #c39b3c;
}

a {
	text-decoration: none;
	outline-style: none;
	color: #0000ff;
}

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

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: url(/upload/3430_test.jpg) repeat-x #ffffff;
}

form {
	height: 100%;
}
#pagewrap {
	margin: 0 auto;
	width: 1000px;
	background: #ffffff; /* Zet hier de repeat background voor de content! */
	}
	 /* Header */
	#header {
		width: 1000px;
		height: 98px;
		overflow: hidden;
		
		background: url(/upload/3430_banner.jpg) no-repeat #000000;
		}
		
	
		#header h1 { /* Wegwerken van de h1 header in het logo */
			text-indent: -9999px;
			height: 0px;
			width: 0px;
		}
		
		
	
	/* Content */
	#content {
		width: 1000px;
		min-height:465px;
					background: url(/upload/3430_background_content2.jpg) repeat-x top left #ffffff;
		}
	
		#stripe_top {
			height:2px;
			width:1000px;
			background: #BDBE1B;
		}

			/* Topbar */
	#topbar {
		width: 1000px;
		height: 25px;
		overflow: hidden;

		background: url(/upload/3430_background_navigatie.jpg) repeat-x #0000ff;
		}
		
		
		/* Horizontale navigatie */
		ul#topbar_navigatie {
				display: block;
				height: 25px; /* hoogte van button */
				margin-left: 20px;
			}
			
			ul#topbar_navigatie li {
				display: inline;
				overflow: hidden;
				line-height: 25px; /* hoogte van button (voor IE6) */
				}
				
				ul#topbar_navigatie li a {
					display: block;
					height: 25px; /* hoogte van button */
					float: left;
					text-indent: 23px;
					font-size:17px;
					font-family: "Times New Roman";
					color: #CCC;
					background: url("/upload/3430_button.jpg") left top no-repeat;
					padding: 0 15px;
				}
	
				ul#topbar_navigatie li a:hover { /* bij rollover, uitlijnen naar onder zodat rollover state zichtbaar is */
					background-position: bottom left;
				}
		
		#contenttext {
			width: 960px;
			min-height:425px;
			padding:20px;
			color:#000000;
		}
		
		#stripe_bottom {
			height:2px;
			width:1000px;
			background: url(/upload/3430_stripe_bottom_content.jpg) no-repeat top left #ffff00;
			display:none;
		}
		
	
	
	/* Footer */
	#footer {
		width: 1000px;
		height: 25px;
		overflow: hidden;
		display:none;

		background: url(/upload/3430_background_navigatie.jpg) repeat-x #0000ff;
		}
		
		/* Horizontale navigatie */
		ul#footer_navigatie {
				display: block;
				height: 25px; /* hoogte van button */
			}
			
			ul#footer_navigatie li {
				display: inline;
				overflow: hidden;
				line-height: 25px; /* hoogte van button (voor IE6) */
				}
				
				ul#footer_navigatie li a {
					display: block;
					height: 25px; /* hoogte van button */
					float: left;
					}
				
					/* het invoegen van de verschillende buttons */
						ul#footer_navigatie li a.nav_home {
					 	width: 100px; /* breedte van button */
					 	
					 	background: url(/upload/3430_nav_home.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.nav_overons {
					 	width: 167px; /* breedte van button */
					 	
					 	background: url(/upload/3430_nav_overons.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.nav_aanbod {
					 	width: 150px; /* breedte van button */
					 	
					 	background: url(/upload/3430_nav_aanbod.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.nav_import {
					 	width: 229px; /* breedte van button */
					 	
					 	background: url(/upload/3430_nav_import.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.nav_inkoop {
					 	width: 165px; /* breedte van button */
					 	
					 	background: url(/upload/3430_nav_inkoop.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.nav_verzekering {
					 	width: 154px;
					 	
					 	background: url(/upload/3430_nav_verzekering.jpg) no-repeat;
						background-position: top;
						
						text-indent: -9999px;
					}
*/
					
					ul#footer_navigatie li a.nav_contact {
					 	width: 184px; /* breedte van button */
					 	
					 	background: url(/upload/3430_nav_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;
				}
				
		#left { 
			width: 450px;
			float: left;
		}
		
		#right { 
			width: 320px;
			float: right;
			text-align: right;
		}
		
	/* Slideshow 2 */

	#gallery {
	text-align: left;
	position: relative;
	width: 320px;
	height: 240px;
	border: 1px solid #FFFFFF;
	}

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

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

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

	#gallery .caption {
	z-index: 600; 
	background-color: #012E4B;
	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;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 18px;
	}