@import url("reset.css");

body{
	font-family: Arial, Verdana, Tahoma, sans-serif;
	color: #303030;
	font-size: 12px;
	background: url(../images/bg.gif) no-repeat top center #cbcbcb;
	text-align: center;
	}

a{
	cursor: pointer;
}

#container{
	width: 970px;
	margin: 0px auto;
	text-align: left;
}

#header{
	margin-top: 27px;
	height: 72px;
	background: url(../images/bg_header.jpg) no-repeat left top;
	width: 970px;
}

.homelink{
	float: left;
	width: 240px;
	height: 73px;
	border: none;
	text-decoration: none;
	display: block;
}

#navigation{
	float: right;
	margin: 45px 10px 0px 0px;	
	width: 600px; 
}

	#navigation a{
		display: block;
		float: right; 
		padding: 0px 30px 0px 10px;
		color:  #e7e7e7;
		text-decoration: none;
		text-align: right;
		font-size: 15px;
		font-weight: bold;
	}
	
	#navigation a:hover{
		text-decoration: underline;
	}

#content{
}

#leftmenu{
	float: left;
	width: 237px;
	background-color: #D5D5D5;
	padding-top: 15px;
	margin-top: 53px;
	clear: left;
	_overflow: hidden;
}


#leftmenu a.download{
	padding: 8px 0px;
	display: block;
	text-decoration: none;
	color: #303030;
}


#leftmenu a.text{
	padding: 8px 0px;
	display: block;
	border-bottom: 1px solid #d5d5D5;
}

#leftmenu a.text.selected{
	background-color: #E7E7E7;
}
#thunderclouds, 
#people_and_places, 
#gargoyles, 
#moot, 
#drawing, 
#paint, 
#cobwebs, 
#ribstaal,  
#thickening,  
#lastnight, 
#hibsen, 
#multiverse, 
#verhuurd, 
#verkocht{
	display: none;
	padding: 11px 0px;
	background-color: #E7E7E7;
	padding-left: 11px;
	margin-left: 15px;
}

#leftmenu #link_moot, 
#leftmenu #link_thunderclouds, 
#leftmenu #link_gargoyles, 
#leftmenu #link_people, 
#leftmenu #link_cobwebs, 
#leftmenu #link_ribstaal,
#leftmenu #link_thickening, 
#leftmenu #link_lastnight, 
#leftmenu #link_hibsen, 
#leftmenu #link_multiverse, 
#leftmenu #link_verhuurd, 
#leftmenu #link_verkocht{
	margin-left: 15px;
	padding-left: 11px;
	border-bottom: 1px solid #dedede;
	background-color: #E7E7E7;
}



#leftmenu a.img{
	float: left;
	width: 60px;
	margin-right: 10px;
	display: block;
    text-align: center;
    background-color: #444;
    height: 60px;
    margin-bottom: 11px;
}

	#leftmenu a.img .outer {
				display: table;
				#position: relative;
				overflow: hidden;
				height: 60px;
				width: 100%;
			}
	
	#leftmenu a.img .middle {
					display: table-cell;
					#position: absolute;
					#top: 50%;
					vertical-align: middle;
				}
	#leftmenu a.img .inner {
						#position: relative;
						#top: -50%;
						#left: -50%;
					}

.latestWork a.img{
	width: 60px;
	margin-right: 11px;
	margin-bottom: 15px;
	display: block;
    text-align: center;
    background-color: #444;
    height: 60px;
    margin-bottom: 11px;
}

	.latestWork a.img .outer {
				display: table;
				#position: relative;
				overflow: hidden;
				height: 60px;
				width: 100%;
			}
	
	.latestWork a.img .middle {
					display: table-cell;
					#position: absolute;
					#top: 50%;
					vertical-align: middle;
				}
	.latestWork a.img .inner {
						#position: relative;
						#top: -50%;
						#left: -50%;
					}

#showContainer{
	float: left;
	width: 730px;
	_width: 720px;
	text-align: center;
	display: none;
	padding-top: 20px;
}

#showContainer .outer {
	/*
				display: table;
				#position: relative;
				overflow: visible;
				height: 560px;
				width: 100%;
				*/
			}
	
#showContainer .middle {
	/*
					display: table-cell;
					#position: absolute;
					#top: 50%;
					vertical-align: middle;
					*/
				}
#showContainer .inner {
	/*
						#position: relative;
						#top: -50%;
						#left: -50%;
						*/
					}

#textcontainer{
	height: 27px;
	#height: 52px;
	padding-top: 21px;
	display: none;
}

#titlecontainer{
	float: left;
	width: 414px;
	_width: 390px;
	_overflow: hidden;
	font-weight: bold;
}

#descriptioncontainer{
	float: right;
	width: 270px;
	text-align: right;
	margin-right: 26px;
}
	
h1{
	font-size: 15px;
	font-weight: bold;
	color: #303030;
	margin: 50px 0px 30px 0px;
}


h2{
	font-size: 15px;
	font-weight: bold;
	color: #303030;
	padding: 15px 0px 15px 0px;
}

h2 span{
	font-weight: normal;
	color: #7C7375;
	font-size: 12px;
}

#pagesContainer{
	padding: 0px 0px 0px 25px;
	line-height: 150%;
	float: left;
	width: 705px;
}

#pagesContainer.news{
	padding: 35px 0px 0px 25px;
	line-height: 150%;
	float: left;
	width: 705px;
}

#pagesContainer.home{
	padding: 0px 0px 10px 0px;
	line-height: 150%;
	border-bottom: 1px solid #D5D5D5;
	width: 480px;
}

#pagesContainer a, a, a:visited, a:hover{
	color: #7C7375;
}

#pagesContainer ul{
	margin: 10px 10px 10px 10px;
}
#pagesContainer ul li{
	background: url(../images/bullet.gif) no-repeat 5px 5px;
	padding: 0px 0px 5px 20px;
	}

.newsContainer{
	margin: 0px 0px 0px 0px;
	padding-bottom: 20px;
	border-bottom: 1px solid #D5D5D5;
	width: 700px;
}

.latestWork{
	margin: 50px 0px 0px 0px;
	padding: 0px 0px 0px 20px;
	border-bottom: 1px solid #D5D5D5;
	width: 120px;
	#width: 170px;
	height: 400px;
	float: right;
}

.latestNews{
	
	padding: 0px 15px 0px 0px;
	margin: 0px 15px 0px 0px;
	width: 480px;
	float: left;
	line-height: 150%;
}

.latestNews h2{
	font-size: 12px;
}

.home_container{
	float: left;
	width: 550px;
	overflow:hidden;
	padding: 0px 0px 20px 25px;
	border-right: 1px solid #D5D5D5;
	margin-top: 50px;
}

.home_container h3, .latestWork h3 {
	padding: 10px 5px 10px 0px;
	margin: 0px 0px 10px 0px;
	border-bottom: 1px solid #D5D5D5;
}

#footer{
	clear: both;
	text-align: center;
	padding-top: 30px;
	padding-bottom: 20px;
	padding-left: 237px;
}

	#footer a{
		color: #7C7375;
	}
	
/* styles for promo page */

.formulier{
	margin: 15px 0px;
	}

	.formulier label{
		float: left;
		width: 180px;
		font-weight: bold;
	}
	
	.formulier input.text{
		float: left;
		width: 200px;
		padding: 4px;
		#height: 25px;
		font-family: Arial, Verdana, Tahoma, sans-serif;
		color: #303030;
		font-size: 12px;
		border: 1px solid #808080;
		}
		
	.formulier input.checkbox{
		float: left;
		clear: left;
		display: block;
		font-weight: normal;
		margin: 12px 10px 0px 0px;
		#margin: 9px 10px 0px 0px;
		}

	.formulier label.checkbox{
		width: 500px;
		float: left;
		padding-top: 10px;
		font-weight: normal;
		cursor: pointer;
		}
	
	.formulier input.submit, .formulier input.submit:focus, .formulier input.submit:active{
		background-image: none;
		background-color: #808080;
		color: #fff;
		margin-left: 15px;
		border: 1px solid #565656!important;
		padding: 3px 10px;
		#padding-bottom: 1px;
		float: left;
		cursor: pointer;
		#height: 23px;
		#width: 1px;
		#overflow: visible;
		}
		
		
	.formulier input.hidden{
		position: absolute;
		left: -3000px;
		}
	
	.comment{
		color: #808080;
		}
	
	.error{
		color:#900;
		font-weight: bold;
		margin: 15px 0px;
		}
		
/* CLEARFIX */

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

.clearfix {
    #display: inline-block;
}

html[xmlns] .clearfix {
    display: block;
}

* html .clearfix {
    height: 1%;
}

/* END CLEARFIX */