@charset "utf-8";

/* default.css voor Vanderspek.be */

body {
	margin:0;
	padding:0;
	}

*html {
	margin:0;
	padding:0;
	}

/* algemene terugkerende classes */

.Holder { clear:both; }

.Center { text-align:center; position:relative; }	
.Centered { margin:0 auto; text-align:left; position:relative; }

.Column { float:left; }
.ColumnRight { float:right;}

.Span-14	{ width:1000px; }
.Span-10	{ width:734px; }
.Span-9		{ width:694px; }
.Span-8		{ width:585px; }
.Span-7		{ width:470px; }
.Span-6		{ width:390px; }
.Span-4		{ width:203px; }
.Span-3		{ width:215px; }
.Span-2		{ width:195px; }

.Padding1	{ padding:10px 10px 5px; }
.Padding2 	{ padding:13px 20px 20px; }
.Padding3	{ padding:15px 0 0 20px; }

/* Basic horizontal menu */
.Horizontal ul { list-style:none; margin:0; padding:0; }
.Horizontal ul li { position:relative; float:left; display:inline;}
.Horizontal ul li a { display:block; float:left; }
.Horizontal ul li a span { display:block; float:left; cursor:pointer; }
.Horizontal ul li ul { display:none; position:absolute; z-index:101 }
.Horizontal ul li:hover ul, .Horizontal ul li.sfHover ul {  }

/* basic vertical menu */
.Vertical ul {list-style:none; margin:0; padding:0; }
.Vertical ul li {clear:both; padding:0; margin:0; }
.Vertical ul li a { display:block; position:relative; clear:both; float:left; /* width:custom */ }

/* Clearing floats without extra markup
   Based on How To Clear Floats Without Structural Markup by PiE
   [http://www.positioniseverything.net/easyclearing.html] */

.Clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
	}

.Clearfix{display: inline-block;}

* html .Clearfix {height: 1%;}

.Clearfix {display: block;}

a img { border:0; }

/************* wax */

a.Wax {
	position:absolute;	
	right:0;
	bottom:0;
	display:block;
	width:27px;
	height:22px;
	background:url(img/logo_wax.gif);
	text-indent:-9999px;
	}

a.Wax:hover { background-position: 0 -22px; }

	/***** DESIGN */
	
html { background:url(img/back_htmll.jpg) top center repeat; }

body { background:url(img/back_body2.jpg) center top no-repeat; height:100%; text-align:center; } 

#Wrapper { position:relative; clear:both; overflow:auto; margin:0 auto; text-align:left; }

/******* Header */

#Header { height:368px; }

#Menu { position:absolute; top:315px; left:266px; }

#Menu li { font-size:16px; position:relative; margin:0 18px 0 0; }

#Menu li a { color:#9dd9ff; z-index:6; position:relative;  }

#Menu li a:hover, #Menu li.Current a { color:#fff; }

#Menu li span { color:#004a79; position:absolute; left:1px; top:1px; z-index:5 }

#Menu li a span { position:relative; z-index:61 }

a.Logo { display:block; width:228px; height:107px; position:absolute; top:40px; left:36px; }
a.Logo span { display:none; }

a.Home { display:block; width:62px; height:52px; position:absolute; top:32px; left:302px; }
a.Home span { display:none; }

.Cycle { position:absolute; top:127px; left:272px; z-index:11; width:677px; height:125px; overflow:hidden; }

#Cycle { width:677px; height:125px; }

.Cycle .Overlay { position:absolute; width:677px; height:125px; z-index:300; left:0; top:0; background:url(img/banner_overlay.png) top left no-repeat;  } 

/******* Submenu */

#Submenu { margin:0 0 0 20px; height:49px; overflow:hidden; }

#Submenu ul li a { color:#999; font-size:1.4em; padding:14px 35px 14px 20px; background:url(img/subnav.gif) top right no-repeat; text-decoration:none; }
#Submenu ul li a:hover, #Submenu ul li.Current a { color:#069; }

#Submenu ul li.First a { padding-left:0 }

/******* Content */

#ContentHolder { margin-bottom:10px; overflow:hidden; position:relative; }

#Content { background:#fff url(img/back_content.gif) repeat-y; margin-top:7px; overflow:hidden; }

.ColumnRight { margin-right:19px; }

.Bottom, .Top { height:6px; overflow:hidden; }

.Bottom { background:url(img/content_bottom.png); }
.Top { background:url(img/content_top.png); }

.Item { margin:0 0 1.5em; border-bottom:1px solid #eaeaea; overflow:hidden; }

/** who's who */

.Item .Image { float:left; margin:0 20px 1.5em 0; }

.Contact { font-size:0.9em; float:right; padding:10px; background:#eaeaea; border-left:1px solid #eaeaea; margin-left: 20px; width:230px; }

.Contact p { margin:0; }

a.Project { width:150px; color:#9dd9ff; font-size:1.6em; height:208px; overflow:hidden; padding:5px; display:block; background:#0076c1; float:left; margin:0 20px 20px 0; }
a.Project:hover { color:#fff; }

a.Project .Image { width:150px; height:185px; display:block; overflow:hidden; }

/********** Products */

.Product { width:200px; height:200px; overflow:hidden; }

.Product2 { width:200px; height:60px; overflow:hidden; }

/******* Sidebar */

#Sidebar { color:#fff; font-size:0.9em; padding:0 0 0 0; margin:0 0 0 30px; }

#Sidebar a { text-decoration: none; color:#fff; }

.LeftBox { margin-bottom:20px; position:relative; }

.LeftBox ul li a { display:block; }

.LeftBox ul li a strong { margin-bottom:2px; display:block; }

.LeftBox ul li a span { display:block; clear:both; }

.LeftBox ul li { float:left; width:auto; margin-bottom:15px;  }

#News { height:171px; }

#Weather { height:170px; }

/*#Weather a { background: url(http://www.meteo.be/meteo/view/nl/65239-Home.html?image=forecast&ext=.png) 50% no-repeat; position:absolute; top:30px; left:15px; width:170px; height:139px; display:block;}*/

#Weather img.KMI { position:absolute; top:30px; left:15px; width:170px; height:139px; } 

#Project { height:272px; }

#Used { height:92px; position:relative; }

.Used { position:absolute; text-transform:uppercase; font-size:3em; }

a.Used { top:33px; left:18px; z-index:100 }
span.Used { top:34px; left:19px; color:#004a79; z-index:99; }

/****** Footer */

#FooterHolder { margin-bottom:10px; }

#Footer { background:#fff url(img/back_content.gif) repeat-y; height:90px; overflow:hidden; font-size:0.9em; }

strong.Logo { display:block; width:108px; height:51px; background:url(img/logo_footer.gif) no-repeat; text-indent:-9999px;  }

/********* extra */

.Back { display:block; padding:5px 7px; text-decoration:none; position:absolute; top:0; right:0; background:url(img/back_link.gif) left bottom no-repeat; }

hr { margin-bottom:15px; }

#map { position:absolute !important; right:15px; top:45px; }
/****** Forms, Contact */

#frmContact fieldset {
	border:0;
	padding:0;
	margin:0;
	}

.row { padding-top:10px; }

label { margin-bottom:4px; clear:both; display:block; }


.InputText input { width:200px;	background:url(img/back_input.jpg) top left no-repeat; }

.InputText input, textarea {
	font: normal 1em Verdana, sans-serif;
	border:1px solid #fff;
	padding:6px 5px;
	color:#033
	}
	
.InputText input:hover, .InputText input:focus, textarea:hover, textarea:focus { border-color:#cf9; }

.Short input { width:80px; }

textarea {
	height:158px;
	overflow:auto;
	width:427px;
	background:url(img/back_textarea.jpg);
	}
	
.InputButton input { 
	background:#690 url(img/back_button.gif) top left repeat-x; 
	border:1px solid #a9d157;
	border-bottom-color: #587e18;
	border-right-color: #587e18;
	padding:5px 6px; 
	font-size:1.2em; 
	font-weight:bold; 
	color:#FFF; 
	cursor:pointer; 
	font: bold 1em Verdana, sans-serif;
	}

.InputButton input:hover { background:#9c3; }

.Errors { margin:15px 0 0 0; }

.Errors h3 { padding-left:20px; background:url(img/icon_error.gif) center left no-repeat; }

.Succes h3 { padding-left:20px; background:url(img/icon_succes.gif) center left no-repeat; color:#690; }

.ProductMenu ul li { line-height:2.5em; }