/* Autodealers.nl CSS voor de dealerwebsite */
/*
Horizontaal met footer

Kleuren stalen:

body: #949393
pagewrap: #7A7A7A

header alternatief: #b60000
content: #7A7A7A


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: 0;
	margin: 0;
	border: none;
	outline: none;
}

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

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

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

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

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

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

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

h3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: bold;
	color: #4897c9;
}

h6 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: normal;
	color: #4897c9;
}

	h6 a {
	color: #4897c9;
		text-decoration: underline;
	}
	
		h6 a:hover {
			text-decoration: none;
		}

a {
	text-decoration: underline;
	color: #4897c9;
}

	a:hover {
		text-decoration: none;
	}

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

html {
	margin: 0;
	padding: 0;
	background:url("/upload/4097_wrap_1.jpg") repeat-x top center #24292E;

}

body {	
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	font-style: normal;
	color: #FFFFFF;
	
	background:url("/upload/4097_bg_header.jpg") no-repeat top center ;
}

.homebutton {
 	height: 225px;
 	width:	1200px;
  	display: block;
}

#pagewrap {
	margin: 0 auto;
	position: relative;
	width: 1000px;
}

	/* Header */
	#header {
		width: 1000px;
		height: 197px;
		overflow: hidden;
		position: relative;
		background: ;
	}
	
		#header h1 {
			position: absolute;
			text-indent: -9999px;
		}
		
		/* Horizontale navigatie */
		ul#navigatie {
			display: block;
			width: 1000px;
			height: 30px;
			background:;
			list-style-type: none;
			background:url("/upload/4097_nav_bg.jpg") repeat-x top center;
			padding-top:197px;
		}
		
			ul#navigatie li {
				float: left;
				overflow: hidden;
				line-height: 30px; /* hoogte van button (voor IE6) */
			}
			

				
			ul#navigatie li a {
				float: left;
				display: block;
				line-height: 30px;
				text-decoration: none;
				font-weight: bold;
				font-size: 16px;
				color: #444444;
				background: url(/upload/4097_nav_splice.jpg) no-repeat center left;
			}
			
			
			
			ul#navigatie li a:hover {
				color:#dc6000;
			}	
			
					
					ul#navigatie li:first-child a {
						background: none;
					}
				
				

	/* Content */
	#content {
		width: 1000px;
		background:#24292E;
		position: relative;
	}
		
		#contenttext {
			width: 960px;
			padding: 20px;
			line-height: 24px;
		}
		
			#contenttext_left {
				width: 618px;
				float: left;
				text-align: left;
			}
			
			#contenttext_right {
				width: 322px;
				float: right;
				text-align: right;
			}
			
			/* Laatst toegevoegde occasions */
			#gallery {
				text-align: left;
				position: relative;
				width: 320px;
				height: 240px;
				border: 1px solid #000000;
				overflow: hidden;
				line-height: normal;
			}

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

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

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

				#gallery .caption {
					z-index: 2; 
					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;
						}

	/* Footer */
	#footer {
		width: 100%;
		height: 33px;
		line-height: 33px; /* Hoogte van footer */
		overflow: hidden;
		background: url("/upload/4097_feuteur.jpg") repeat-x;
		text-align: center;
		position: relative;
	}
	
.uitschuifmenu
{
position: relative
}

.uitschuifmenu > ul {
    background: none repeat scroll 0 0 transparent;
    bottom: 24px;
    display: none;
    left: 0;
    list-style-type: none;
    position: absolute;
    top: 31px;
    z-index: 9;
	}


ul#navigatie {
    overflow: visible;
    padding-top:0px;
}
ul#navigatie li {
    float: left;
    line-height: 30px;
    overflow: visible;

}


.uitschuifmenu ul li a{
background:#CECECE !important;
text-indent: 5px;
width:180px;
height:30px;
}

.uitschuifmenu ul li {
background:#CECECE !important;
width:200px; 
}

#navigatie li.uitschuifmenu ul li a.boven{
    display: none;
}

.adp-directions {
    border-collapse: collapse;
    color: #fff;
    cursor: pointer;
    width: 100%;
}

/* ######## POPUP ########*/
	
	#achtergrond_popup {
		display: none;
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background: #000000;
		z-index: 9998;
	}
		
		#popup_contact {
			display: none;
			position: absolute;
			width: 952px;
			height: 586px;
			background: url('/upload/4097_popup_pasen.jpg') no-repeat 0 40px;
			border: 2px solid gray;
			z-index: 9999;
		}
		
			#popup_contact div.popup_head {
				position: relative;
				height: 40px;
				background: url('/upload/4097_bg_popup_head.jpg') repeat-x center;
			}
		
			#popup_contact div.popup_head h2 {
				line-height: 40px;
				margin: 0;
				padding: 0;
				text-indent: 20px;
				color: #FFFFFF;
			}
			
				#popup_contact div.popup_sluiten {
					position: absolute;
					top: 0px;
					right: 0px;
					width: 50px;
					height: 40px;
					text-indent: -9999px;
					border: 0;
					background: url('/upload/4097_popup_close.png') no-repeat center top;
					cursor: hand;
					cursor: pointer;
				}
				
					#popup_contact div.popup_sluiten:hover {
						background-position: center bottom;
					}

#snow{
	background: none; /* sneeuw komt van de images */
	font-family: Androgyne;
	background-image: url('//svl.autodealers.nl/upload/4552_snow1.png'), url('//svl.autodealers.nl/upload/4552_snow2.png'), url('//svl.autodealers.nl/upload/4552_snow3.png');
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index:1;
	-webkit-animation: snow 10s linear infinite;
	-moz-animation: snow 10s linear infinite;
	-ms-animation: snow 10s linear infinite;
	animation: snow 10s linear infinite;
}

@keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}

@-moz-keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 400px 1000px, 200px 400px, 100px 300px;}
}

@-webkit-keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}

@-ms-keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}	

#snow{
 display:none; 
}