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

/** =COLORS **
*/


body {
	}


/** =LAYOUT **/

#container {
	}


/** =HEADER **/

#header {
	}

#logo {
	}

#navigation {
	}


/** =CONTENT - HOMEPAGE **/

#home-intro {
	}


/** CONTENT - DEFAULT **/

#content {
	}


#sidebar {
	}


/** =FOOTER **/

#footer {
	}
#footer p {
	}
#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; }

body {
	padding: 20px;
	background: #000 url(../../image/bg.gif) no-repeat center top;
}

body, pre, td {
	color: #fff;
}

#container {
	position: relative;
	width: 504px;
	margin: 0 auto;
}

#logo a {
	text-indent: -999em;
	display: block;
	height: 55px;
	background: transparent url(../../image/logo.png) no-repeat center top;
	margin-bottom: 20px;
}

#wrapper {
	border: 2px solid #E72A8B;
	height: 500px;
	background: #000;
	overflow: hidden;
}

#wrapper h1 {
	display: none;
}

#content {
	padding: 10px 15px;
	overflow: auto;
	height: 480px;
}

#nav {
	background: #E72A8B;
	height: 36px;
	line-height: 36px;
	overflow: hidden;
}

#nav li {
	float: left;
}

#nav a {
	text-transform: lowercase;
	display: block;
	padding: 0 10px;
	line-height: 38px;
	height: 36px;
	color: white;
	text-decoration: none;
	font-size: 16px;
}

#nav .first a {
	background: transparent url(../../image/home2.png) no-repeat center center;
	text-indent: -999em;
	width: 24px;
}

#nav .first a:hover, #nav .first.active a {
	background-image: url(../../image/home.png);
}

#nav a:hover, #nav .active a { color: #000; }

#footer { font-size: 0.875em; color: #777; }

#footer a { color: #a11d61; }

#footer p { text-align: right; }

#subnav {
	list-style: none;
	padding: 0 5px;
	margin: 0;
	background: #E72A8B url(../../image/subnav.gif) repeat-x left top;
	height: 20px;
	line-height: 20px;
	overflow: hidden;
}

#subnav li {
	float: left;
}

#subnav a {
	text-transform: lowercase;
	display: block;
	text-decoration: none;
	color: #f8c0dc;
	padding: 0 5px;
}

#subnav a:hover, #subnav .active a {	color: #000; }

input, textarea { color: #000; border: none; padding: 4px 8px; }

input.btn {
	width: auto;
	color: #fff;
	background-color: #E72A8B;
	padding: 5px 10px;
	text-transform: lowercase;
	font-weight: bold;
	cursor: pointer;
	outline: none;
	border: 1px outset #E72A8B;
}

input.btn:active {
	border: 1px inset #E72A8B;
}

#login { margin-top: 160px; padding-left: 100px; }
#login input { float: none; }

#login p { margin-bottom: 10px; clear: both; }

#login label { display: block; float: none; }

#thumbs {
	position: absolute;
	right: -164px;
	top: 75px;
	background: #E72A8B;
	border: 2px solid #E72A8B;
	border-bottom-width: 4px;
	height: 534px;
	width: 162px;
}

#thumbs .container {
	width: 100%;
	height: 100%;
	overflow: hidden;
}

#thumbs ul {
	list-style: none;
	padding: 0;
	margin: 0;
	margin-bottom: 24px;
}

#thumbs img {
	margin: 2px;
	border: 1px solid #000;
}

#enlarged {
	display: table-cell;
	width: 480px;
	height: 500px;
	vertical-align: middle;
	text-align: center;
}

.p_portfolio #enlarged {
	height: 480px;
	width: 500px;
}

#thumbs .button {
	position: absolute;
	height: 24px;
	line-height: 24px;
	width: 100%;
	background: #f0f;
	text-indent: -999em;
	background: transparent url(../../image/arrow-up.png) no-repeat center center;
	cursor: pointer;
}

#thumbs .up {
	top: 0;
}

#thumbs .down {
	bottom: -2px;
	background-image: url(../../image/arrow-down.png);
}

#news .item {
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: 1px dotted #E72A8B;
}

#news h3, .itemOne h2 {
	font-size: 18px;
	margin-bottom: 0;
	line-height: 1;
}

#news p.date, .itemOne p.date {
	margin-bottom: 10px;
	font-size: 0.9em;
}

#news h3 a { text-decoration: none; }

.odd .figure img, .itemOne .figure img { float: right; margin-left: 10px; padding-bottom: 5px; }

.even .figure img { float: left; margin-right: 10px; padding-bottom: 5px; }

.clearfix { clear: both; }

button {
	background: #E72A8B;
	border: 1px outset #E72A8B;
	padding: 3px 10px;
	float: right;
	margin-right: 87px;
}

#content td.generator_content_blok {
	padding-bottom: 0;
}

#thumbs .container li {
	position: relative;
	margin-bottom: 2px;
}

#thumbs a {
	text-decoration: none;
}

#thumbs .container span {
	display: block;
	background-color: #000;
	background-color: rgba(0, 0, 0, 0.7);
	color: white;
	text-align: center;
	height: 18px;
	line-height: 18px;
	position: relative;
	width: 156px;
	margin-top: -26px;
	margin-left: 3px;
	font-weight: bold;
}