@import url(/include/css/editor.php);

/** =COLORS **
*/


body {
	background: #abbbc6 url('/image/body-bg.jpg') top center no-repeat;
	}


/** =LAYOUT **/

#container {
	width: 996px;
	height: 995px;
	margin: 0px auto;
	background: url('/image/container-bg.png') bottom left no-repeat;
	position: relative;
	}

/** =HEADER **/

#header {
	width: 960px;
	height: 173px;
	margin: 0px 0px 0px 8px;
	background: #b20838;
	}
#logo {
	width: 311px;
	height: 173px;
	float: left;
	}
#logo a {
	width: 311px;
	height: 173px;
	display: block;
	}
#topImage {
	float: left;
	width: 649px;
	height: 173px;
	text-align: right;
	}

#navigation {
	width: 960px;
	height: 85px;
	margin: 0px 0px 0px 8px;
	}
	#navigation h1 {
		font-weight: normal;
		font-size: 28px;
		color: #b20838;
		margin: 10px 0px 0px 15px;
	}


/** =CONTENT - HOMEPAGE **/

#home-intro {
	}


/** CONTENT - DEFAULT **/

#content {
	width: 960px;
	height: 625px;
	margin: 0px 0px 0px 8px;
	}
#content.fotopage {
	background: #000000;
	height: 625px;
	position: relative;
	overflow: hidden;
	text-align: center;
}
#content.fotopage #text {
	background: #000000;
	color: #ffffff;
	font-weight: bold;
	bottom: 0px;
	left: 0px;
	position: absolute;
	height: 75px;
	line-height: 75px;
	width: 247px;
}
#content.fotopage #albums {
	background: #000000;
	color: #ffffff;
	bottom: 0px;
	right: 0px;
	height: 75px;
	line-height: 75px;
	position: absolute;
	width: 713px;
}

.jcarousel-next {
	top: 15px !important;
	height: 47px !important;
	background-color: black!important;
}

.thumbs {
	background: #000000;
  	height: 75px;
  	width: 760px;
}
#sidebar {
	width: 302px;
	position: absolute;
	top: 265px;
	left: -10px;
	overflow: auto;
	}
	#sidebar-top {
	width: 302px;
	height: 20px;
	background: url('/image/sidebar/sidebar-top.png') top left no-repeat;
	}
	#sidebar-body {
	width: 302px;
	max-height: 600px;
	background: url('/image/sidebar/sidebar-body.png') top left repeat-y;
	overflow: auto;
	color: #ffffff;
	}
	#sidebar-body img.albums {
		margin-top: 20px;
	}
	#sidebar-body #text {
		width: 260px;
		margin: 0px 0px 0px 16px;
		text-align: justify;
	}
	#sidebar-body #text a {
		color: #b5985a;
		text-decoration: none;
	}
	#sidebar-body hr {
		width: 260px;
		border: 1px solid #ffffff;
		margin: 0px 0px 20px 0px;
		padding: 0px;
	}
	#sidebar-body hr.bottom {
		width: 260px;
		border: 1px solid #ffffff;
		margin: 20px 0px 0px 0px;
		padding: 0px;
	}
	#sidebar-bottom {
	width: 302px;
	height: 40px;
	background: url('/image/sidebar/sidebar-bottom.png') top left no-repeat;
	}


/** =FOOTER **/

#footer {
	height: 60px;
	width: 960px;
	margin: 0px 0px 0px 8px;
	}
	#contact {
	width: 960px;
	height: 20px;
	list-style: none;
	padding: 15px 0px 0px 0px;
	}

	#contact li { /* all list items */
		float: left;
		width: auto; /* width needed or else Opera goes nuts */
		margin: 0px;
		padding: 0 18px;
		border-left: 2px solid #b20838;
		font-size: 15px;
		color: #6a7780;
	}
	#contact li.first {
		border: 0px;
		}
	#contact li:hover a {
		font-weight: bold;
		}
	#contact li.active a {
		font-weight: bold;
		}
#footer p {
	text-align: right;
	padding-right: 44px;
	}
#footer a {
	}


/** =CLASSES **/





.height1 { /* als je een divje wilt gebruiken ipv pixel.gif dan dien je in IE deze class te gebruiken en daarnaast de juiste
				hoogte en breedte te geven, zonder deze class krijgt je altijd een aantal pixels onder een div */
	height:1px;
	line-height:1px;
	font-size:1px;
	overflow:hidden;
}

body {
	scrollbar-arrow-color: #000000;
	scrollbar-3dlight-color: #FFFFFF;
	scrollbar-highlight-color: #000000;
	scrollbar-face-color: #FFFFFF;
	scrollbar-shadow-color: #000000;
	scrollbar-track-color: #FFFFFF;
	scrollbar-darkshadow-color: #FFFFFF;
	overflow: -moz-scrollbars-vertical;
	}

/* 		VERTICAL ALIGN
Width en Height kunnen aangepast en/of via een
andere class toegewezen worden.

Moet altijd de volgende HTML hebben:
<div class="verticalalign">
<div>
<div>
	<!-- element dat gecentreerd moet -->
</div>
</div>
</div>
*/
.verticalalign { width:400px; height:300px; }
.verticalalign { display: table;  overflow: hidden; text-align:left; }
.verticalalign * { display: table-cell; vertical-align: middle; overflow:visible; }
.verticalalign * * { display:auto; vertical-align:none; }