/* CSS Document */

html, body, form { padding:0; margin:0; font:normal 11px/16px Tahoma, Arial, Helvetica, sans-serif; color:#595959;}
html {}
body { height:100%;background:url(images/bg-main.gif) left top no-repeat fixed; margin-left:41px;}
body#home { height:100%;background:url(images/bg-main-home.gif) left top no-repeat fixed;}
p { margin:0 0 10px 0; padding:0; }
p, ul, li, td, a, input { font:normal 11px/16px Tahoma, Arial, Helvetica, sans-serif; color:#595959;}
a:hover { text-decoration:none;}

h1{ color:#555; padding:0; margin:0 0 20px 0; font:normal 22px Georgia, "Times New Roman", Times, serif;}
h1 a{ color:#555; padding:0; margin:0 0 20px 0; font:normal 22px Georgia, "Times New Roman", Times, serif;}
h1 a:hover { text-decoration:underline;}

h2{ color:#666; padding:0; margin:30px 0 15px 0; font:normal 18px Georgia, "Times New Roman", Times, serif; border-bottom:1px solid #ddd;}
h2 a{ text-decoration:none; color:#666; padding:0; margin:30px 0 15px 0; font:normal 18px Georgia, "Times New Roman", Times, serif; border-bottom:1px solid #ddd;}
h2 span{ font:bold 12px Arial, Helvetica, sans-serif; color:#888; }
h5{ color:#666; padding:0; margin:15px 0 10px 0; font:normal 14px Arial, Helvetica, sans-serif;}

.input { font:normal 11px Tahoma, Arial, Helvetica, sans-serif; color:#595959; border:1px solid #999; padding:2px; margin:0;}



#main { left:41px; position:relative; top:0; z-index:0;}
#flash { width:450px; display:block;}
body>div#inner-content { width:40%; top:0; height:500px; border:1px solid #e6e6e6; background:#fff; z-index:0; margin-left:43%; margin-top:3%;}


/* for IE 6 */
#content-box { width:375px; margin-left:455px; z-index:1; position:static; height:100%; display:block; }
#content-box div.content-box-width {margin:0 auto; }

#content-box ul, #content-box ul li { padding:0; margin:0; list-style:decimal;}
#content-box ul { padding-left:23px; margin:5px 0;}

#content-box ul ul, #content-box ul ul li { list-style:disc; }

#content-box ul.bull, #content-box ul.bull li { list-style:none; padding:0; margin:0; }
#content-box ul.bull { margin:3px 0 8px 0;}
#content-box ul.bull li { padding-left:10px; background:url(images/arrow-inner.gif) 0 5px no-repeat;}

#footer {height:122px; padding:20px; top:490px; position:absolute; left:60px;}



.sses-logo { float:left; border:none; text-decoration:none; width:115px;}
.copy-right { float:left; text-decoration:none; text-align:left; width:80px; border-left:1px solid #bebebe; padding-left:15px;}
.rpbg-member { position:absolute; width:102px; right:-485px;}

.footer-nav { height:84px; display:inline; }
.footer-nav ul, .footer-nav ul li { padding:0; margin:0; list-style:none; font-size:11px; }
.footer-nav ul { padding-left:15px; border-left:1px solid #bebebe; color:#2f2f2f; float:left;width:75px; padding-right:5px;}
.footer-nav ul li a { color:#2f2f2f; text-decoration:none; font-size:11px;}
.footer-nav ul li a:hover { text-decoration:underline;}

body#home #footer { display:block;}
#home_content-box {left:475px; height:500px; position:absolute; top:0; width:500px; } 
#hide-out { position:absolute; top:0; left:0; width:100%; z-index:0; height:100%; display:block; }
#home_content { position:relative; top:0; left:0; width:100%; z-index:1; display:block; }
#home-link-area { padding-top:150px;}

.portfolio-main { margin:0 auto;}

.portfolio-thumbs { margin-bottom:15px;}
.portfolio-thumbs .img-thumb { float:left; margin-right:10px; width:100px;}
.portfolio-thumbs .description { text-align:left; float:right; width:225px;}

p.visit-site { clear:both; text-align:left; padding:8px 0 5px 0;  border-bottom:1px solid #eee; }
p.visit-site a { text-decoration:none; color:#333;}
p.visit-site a:hover { text-decoration:underline;}


.gallery { display:none;}
.gallery-thumbs { }
.gallery-thumbs a {margin:5px 12px 10px 0px; float:left; padding:0; text-decoration:none; border-bottom:2px solid #eee; }
.gallery-thumbs a:hover {border-bottom:2px solid #ddd; }
.gallery-thumbs img {}
.gallery-thumbs a img { border:none;}
.gallery-thumbs a .thumb-tag { color:#999; font-weight:bold; display:block; padding:3px 8px; margin-top:1px; text-align:center;}
.gallery-thumbs a:hover .thumb-tag { color:#666;}



.head img{ border:0; padding:0; margin:0; display:block;}
.head a { text-decoration:none; background:#fff;}

.item h1 { color:#999; padding:5px 0 10px 0; margin:0; font:normal 12px Georgia, Arial, Helvetica, sans-serif; background:#fff;}

.inner .body ul, .inner .body ul li, .inner .body ul li a { padding:0; margin:0; color:#fff; text-decoration:none; list-style:none; line-height:12px;}
.inner .body ul li a:hover { color:#fff; text-decoration:underline;}
.inner .body ul li { margin-bottom:5px; padding-left:10px; background:url(images/arrow-menu.gif) 0 4px no-repeat; }

#aboutus .body { background:#FABC07; /*border-bottom:6px solid #fbc936;*/}
#services .body { background:#DF2A17; /*border-bottom:6px solid #fc6932;*/}
#portfolio .body { background:#4CABE1; /*border-bottom:6px solid #6fbbe7;*/}
#contactus .body { background:#F8008A; /*border-bottom:6px solid #fe4dae;*/}

.contact-ico { width:155px; margin-right:10px; margin-top:10px; float:left;}
.contact-ico img{ float:left; margin-right:10px;}
.contact-ico strong { color:#333; font-size:12px; font-family:Arial, Helvetica, sans-serif;}
.contact-ico a{ text-decoration:none;}
.contact-ico a:hover{ text-decoration:underline;}


/* CSS fix for Position Fixed Problem in Previous versions of IE */
@media screen
  {
  div#main, div#footer, div#inner-content
    {
    position: fixed; 
    }
  /* Don't do this at home */
 * html
    {
    overflow-y: hidden;
    }
  * html body
    {
    overflow-y: auto;
    height: 100%;
    }
  * html div#main
    {
    position: absolute;  
    }
  * html div#footer
    {
	position: absolute;
    }
	* html div#inner-content
    {
    position: absolute;
    }
	* html #inner-content { width:40%; margin-left:43%; border:1px solid #e6e6e6; background:#fff; margin-top:3%; height:500px; }
	* html #footer {}
  /* All done. */
  }



/* jump stations --- For home page slideing boxes */

#jumpstations {
	/*width:994px;*/
	position:absolute;
	z-index:2;
	top:30%;
	left:0;
	z-index:2;
	margin-top:-75px;
}
body.jsready #jumpstations { top:50%; }
	#jumpstations .item {
		position:relative;
		width:100px;
		float:left;
		margin-right:10px;
	}
		#jumpstations .item .top {
			display:block;
			height:10px;
			overflow:hidden;
/*			background:url(jumpst-shadow-top.png) 50% 0 repeat-y;*/
		}		
		#jumpstations .item .bottom {
			display:block;
			height:12px;
			overflow:hidden;
/*			background:url(jumpst-shadow-bottom.png) 50% 0 repeat-y;*/
		}
		#jumpstations .inner {
			position:relative;
/*			background:url(jumpst-shadow.png) 50% 0 repeat-y;	*/
		}
		body.jsready #jumpstations .inner {
			overflow:hidden;
		}
			#jumpstations .item .head {
				position:relative;
				z-index:200;	
				min-height:100px;
/*				margin:0 12px 0 12px;
				padding:40px 0 10px 0;
				background:#FFF;*/
				display:block;
			}
			body.jsready #jumpstations .item .head { cursor:pointer; text-align:center; }
			#jumpstations .item .body {
/*				width:100px;
				margin:0 12px 0 12px;
				background:#FFF;*/
				padding:10px 8px 5px 8px;
				overflow:hidden;
				display:block;
				width:84px;
			}
			body.jsready #jumpstations .item .body { 
				display:none; 
				position:relative;
				z-index:100;
				padding:8px;
				color:#fff;
			}
			body.jsready #jumpstations .item.opened .body { display:block; }
#jumpstations .item h2 { margin:0 0 0.2em 0; }
#jumpstations .item .head p { margin:0; }				
#jumpstations .item h2 a {
	display:block;
	height:31px;
	overflow:hidden;
	text-indent:-10000em;
	background-repeat:no-repeat;
}
#jumpstations #bedrijf h2 a { background-color:#FFFFFF; }
#jumpstations #vak h2 a { background-color:#FFFFFF; }
#jumpstations #werk h2 a { background-color:#FFFFFF; }
#jumpstations #contact h2 a { background-color:#FFFFFF; }		
#jumpstations .item .body h3 { 
	margin-top:0;
	font-size:1em;
}			
#jumpstations .item .body h3 a { text-decoration:none; }




/* Light box CSS */

#lightbox{
	background-color:#eee;
	padding: 10px;
	border-bottom: 2px solid #666;
	border-right: 2px solid #666;
	}
#lightboxDetails{
	font-size: 0.8em;
	padding-top: 0.4em;
	}	
#lightboxCaption{ float: left; }
#keyboardMsg{ float: right; }
#closeButton{ top: 5px; right: 5px; }

#lightbox img{ border: none; clear: both;} 
#overlay img{ border: none; }

#overlay{ background-image: url(images/overlay.png); }

* html #overlay{
	background-color: #333;
	back\ground-color: transparent;
	background-image: url(images/blank.gif);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/overlay.png", sizingMethod="scale");
	}