/* KLEUREN 

Groen: #85d926

*/

/* ============================================================	*/ 
/* ========	HTML STANDAARDEN  	===============================	*/
/* ============================================================	*/ 

html {
	height:100%;
	width:100%;
	}
body {
	margin:0 0 0 0;
	width:100%;
	height:100%;
	text-align:center;
	background-color:#d9d9d9;
	}
body, table, th, td, p, input, textarea, select {
	font-family:Verdana, Arial, Helvetica, Sans-serif;
	font-size:10px;
	}	
a {}
a:hover {}
h1 {}
h2 {margin:0 0 10px 0;font-size:28px;font-weight:normal;}
h3 {margin:0 0 15px 0;font-size:15px;color:#85d926;font-style:italic;font-weight:normal;}
h4 {margin:0 0 15px 0;}
h5 {margin:0 0 15px 0;}
h6 {color:#FFF;font-size:12px;}	
p 	{margin:0 0 15px 0;}
	
ol {}
ul {margin:0 0 15px 0;}
ul ul {margin:0;}
li {}
li li {}

label {}
.cB {clear:both;}

/* ============================================================	*/ 
/* ========	LAYOUT BLOCKEN  	===============================	*/
/* ============================================================	*/ 

.container {
	position:relative;
	margin:0 auto 0 auto;
	width:824px;
	text-align:left;
	background:#292929;
	padding-bottom:15px;
	}
body.homepage .container 	{background:#292929 url(../gfx/back-home.gif) repeat-y left top;}
body.diensten .container 	{}
body.nieuws .container 		{background:#292929 url(../gfx/back-nieuws.gif) repeat-y left top;}
body.wagenpark .container 	{}
body.geschiedenis .nav ul li a.geschiedenis {background-position:0 -100px;}
body.vacatures .container 	{}
body.contact .container 	{background:#292929 url(../gfx/back-contact.gif) repeat-y left top;}
body.contact .intro-block {background:#FFF url(../gfx/contact-intro.jpg) no-repeat left top;}

/* ============================================================	*/ 
/* ========	HEADER				===============================	*/
/* ============================================================	*/

.header {position:relative;text-align:center;min-height:151px;background:#FFF url(../gfx/wolken.jpg) no-repeat center top;}
body.homepage .header {height:346px;z-index:0;}
body.homepage .header-block {border-top:0;}
.header .truck {	
position:absolute;
top:0px;
left:0px;
width:824px;
height:139px;
background:transparent url(../images/back_header_truck.jpg) no-repeat left top;
z-index:1;
}
.flash-intro {position:absolute;left:50%;margin-left:-413px;z-index:2;top:0px;}
.header-block {position:relative;margin:0 auto;width:824px;text-align:left;border-top:12px solid #333;z-index:9;}
.logo {
	position:absolute;
	top:0px;
	left:-11px;
	width:332px;
	height:75px;
	z-index:10;
	background:transparent url(../gfx/logo_vanvliettransport.png) no-repeat left top;
	}
body.homepage .logo {top:12px;}
.language {position:absolute;top:4px;right:2px;width:23px;height:15px;z-index:250;}
body.homepage .language {top:16px;}
.track-trace {
	display:none;
	position:absolute;
	padding:40px 0px 0px 17px;
	top:6px;
	right:0px;
	width:222px;
	height:75px;
	z-index:101;
	background:transparent url(../gfx/trace-trace.gif) no-repeat left top;
	}
body.homepage .track-trace 	{top:18px;}
.track-trace label 			{display:block;float:left;padding:2px 0 0 2px;margin:0 5px 7px 0;height:16px;background-color:#ABE569;width:68px;}
.track-trace .type-text 	{height:16px;width:131px;margin-bottom:7px;border:none;float:left;}
.track-trace .buttons 		{padding-left:158px;}
.track-trace .buttons input {margin-top:-3px;}

/* ============================================================	*/ 
/* ========	NAVIGATION			===============================	*/
/* ============================================================	*/
.nav {margin-bottom:-4px;width:824px;overflow:hidden;background-color:#d9d9d9;height:34px;background:transparent url(../gfx/menu/back.gif) repeat-x left top;}
.nav ul {padding-left:25px;}
.nav ul li {float:left;padding-left:6px;}
.nav ul li a {position:relative;display:block;float:left;height:34px;overflow:hidden;}
.nav ul li a span {display:block;margin-top:-100px;}

.nav ul li a.home 			{width:76px;background:transparent url(../gfx/menu/home.gif) no-repeat 0px 0px;}
.nav ul li a.diensten 		{width:97px;background:transparent url(../gfx/menu/diensten.gif) no-repeat 0px 0px;}
	.nav ul li a.services 		{width:97px;background:transparent url(../gfx/menu/services.gif) no-repeat 0px 0px;}
.nav ul li a.nieuws 		{width:76px;background:transparent url(../gfx/menu/nieuws.gif) no-repeat 0px 0px;}
	.nav ul li a.news 		{width:76px;background:transparent url(../gfx/menu/news.gif) no-repeat 0px 0px;}
.nav ul li a.wagenpark 		{width:109px;background:transparent url(../gfx/menu/equipment.gif) no-repeat 0px 0px;}
	.nav ul li a.fleet 		{width:109px;background:transparent url(../gfx/menu/fleet.gif) no-repeat 0px 0px;}
.nav ul li a.geschiedenis 	{width:97px;background:transparent url(../gfx/menu/geschiedenis.gif) no-repeat 0px 0px;}
		.nav ul li a.history 	{width:97px;background:transparent url(../gfx/menu/history.gif) no-repeat 0px 0px;}
.nav ul li a.vacatures 		{width:97px;background:transparent url(../gfx/menu/vacatures.gif) no-repeat 0px 0px;}
	.nav ul li a.jobs 		{width:97px;background:transparent url(../gfx/menu/jobs.gif) no-repeat 0px 0px;}
.nav ul li a.contact 		{width:97px;background:transparent url(../gfx/menu/contact.gif) no-repeat 0px 0px;}


.nav ul li a:hover 			{background-position:0px -50px;}
.nav ul li.active a 		{background-position:0px -100px;}
.nav ul li.active a:hover 	{background-position:0px -100px;}

.content .pagenav {margin:20px 0;}
.content .pagenav a {margin-right:10px;text-decoration:none;}
.content .pagenav a:hover {color:#FFF;text-decoration:none;}
.content .pagenav a span {color:#FFF;font-weight:normal;}

/* ============================================================	*/ 
/* ========	FOOTER				===============================	*/
/* ============================================================	*/

div.footer {position:relative;clear:both;width:800px;margin:0 auto;text-align:left;padding:30px 0 70px 24px;}
div.footer address ,div.footer address strong{color:#000;}
div.footer address span {float:left;display:block;width:400px;padding:0px 0px 0px 0px;}

/* ============================================================	*/ 
/* ========	CONTENT-BLOCK		===============================	*/
/* ============================================================	*/

.main-content 	{width:824px;overflow:hidden;}
.main-content a:hover {text-decoration:underline;}
a.read-more 	{font-weight:bold;font-style:italic;}


.left-column 	{float:left;width:430px;color:#FFF;}
.right-column 	{float:left;width:394px;color:#85D926;}

.right-column a,
.right-column b,
.right-column strong,
.right-column li,
.right-column li a {color:#FFF;}
.right-column hr {
	margin:0px 0px 10px 0px;
	border:none;
	height:1px;
	font-size:1px;
	background-color:#6E6E6E;
	}

.right-column a.read-more {color:#FFF;}

.light-grey 	{background-color:#4E4E4E;}
.mid-grey 		{background-color:#404040;}
.dark-grey 		{background-color:#313131;}

.content {padding:20px 20px 1px 20px;}	
.content a {color:#85D926;}

.content ul li {padding:0 0 0 10px;background:transparent url(../gfx/li_white.gif) no-repeat 0px 6px;}

.interview img {float:left;margin-right:10px;}

.movie-block {margin:0 0 15px 0;}


.intro-backimage {background:#FFF url(../gfx/intro-back.jpg) no-repeat left top;}
.intro-block {width:824px;overflow:hidden;background-color:#FFF;color:#4E4E4E;padding-bottom:30px;}
.intro-block h2 {color:#565656;}
.contact .intro-block h5 {margin:20px;}
.intro-block .left-column,
.intro-block .right-column,
.intro-block .left-column strong,
.intro-block .right-column strong {color:#4E4E4E;}
.intro-block ul li {color:#565656;background:transparent url(../gfx/li_dot_grey.gif) no-repeat 0px 4px;}
.intro-block ul li a {color:#565656;font-weight:bold;}
.cabine-img {float:left;margin-right:10px;}
.intro-block .triple-column {width:473px;margin-right:33px;}
.intro-block .single-column {width:272px;padding-top:42px;}
.intro-block p a.read-more {color:#85D926;}
.subkop {margin:0 0 15px 0;color:#85d926;font-size:14px;line-height:14px;font-style:italic;}

table.contact {margin:10px 0}
.intro-block table.contact {margin:30px 0 -25px 0;}
.intro-block table.contact td {color:#999;font-weight:bold;}
table.contact th {padding:5px 0px 5px 28px;text-align:left;}
table.contact td {padding:2px 0px 2px 10px;color:#85d926;}
table.contact td strong {color:#FFF;}
table.contact td a {color:#85d926;}
table.contact td.col-01 {width:135px;padding-left:28px;}
table.contact td.col-02 {width:129px;}
table.contact td.col-03 {width:235px;}
table.contact td.col-04 {width:110px;}
table.contact td.col-05 {width:147px;}

table.contact tr.head th {background-color:#85d926;color:#333;}


.content .photoalbum {width:100%;overflow:hidden;}
.content .photoalbum ul {}
.content .photoalbum li {float:left;margin:0 8px 8px 0;padding:0;background-image:url(none);}
.content .photoalbum li a {}
.content .photoalbum li img {display:block;border:1px solid #FFF;max-height:74px;_height:74px;}
/* ============================================================	*/ 
/* ========	PAGES DIFFERENT STYLES		  	===================	*/
/* ============================================================	*/ 


body.vacatures .left-column 	{float:left;width:310px;color:#FFF;padding-left:20px;}
body.vacatures .right-column 	{float:left;width:494px;color:#85D926;}
body.vacatures h2 {color:#FFF;font-size:16px;}
body.vacatures strong,
body.vacatures li,
body.vacatures a.read-more  {color:#85d926;}
body.vacatures p {color:#FFF;}
/* ============================================================	*/ 
/* ========	FORMULIEREN		  	===============================	*/
/* ============================================================	*/ 

.formgrid {
	width:560px;
	background-color:#F5F5F5;
	border:15px solid #F5F5F5;
	}
input, select {
	vertical-align:middle;
	}
input.type-text {
	padding:2px 0 0 2px;
	color:#666;
	background-color:#FFF;
	border:1px solid #F00;
	}
.formgrid input.type-text {
	width:232px;
	background-color:#FFF;
	}
input.type-button {
	border:1px solid #F00;
	background-color:#F00;
	color:#333;
	font-weight:bold;
	cursor:pointer;
	margin:0;
	padding:0;
	}
label {vertical-align:middle;cursor:pointer;}
select.select {}
textarea.textarea {
	width:470px;
	}
.radio {}
.radio input {
	margin-right:5px;
	vertical-align:middle;
	}