/* === Styles for layout of site =============================  */

#wrapper {
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
}
#container {
	position:absolute;
	top:10px;
	left:10px;
	width:760px;
	height: 100%;
	}

#title {
	position:absolute;
	top:0px;
	left:0px;
	font-size:1em;
	padding:8px;
}
#title h1 {
	display:block;
	padding:0px;
	color:#000;
	font-size:1.1em;
	font-weight:bold;
}

#menu	{
	position:absolute;
	top:65px;
	left:32px;
	z-index:10;
	font-size:1em;
}

#content	{
	position:absolute;
	top:65px;
	left:200px;
	width:780px;
	z-index:0;
	padding:8px;
}
#content.smal {
	width:510px;
}
#content ul {
	margin:0px;
}
#content li {
	list-style-type:disc;
	border:none;
	max-width:none;
	margin-left:16px;
}
#content a {
	display:inline;
	padding:0px;
}
#content a:hover {
	text-decoration:underline;
}
#content .inner {
	overflow:hidden;
	min-height:345px;
	padding:20px 20px 10px 20px;
}
#content.portfolio {
	height:470px;
}

#content div.text {
	float:left;
	width:450px;
}
#content div.portfolio {
	width:230px;
	float:left;
	margin-left:40px;
}

/* === algemene layout styles === */

.border {	border:solid 1px #000000;}


/* === Menu styles ================================================== */

ul {
	margin-top:12px;
}

ul li {
	list-style-type:none;
	margin:0px 8px 2px 0px;
	max-width:140px;
	cursor:pointer;
}
ul li.current {
	width:160px;
	max-width:none;
	border-right:none;
}

li.current,
li:hover {
	z-index:1000;
	margin-left:8px;
}

li a,
li .inner div {
	display:block;
	background-color:#FFF;
	text-decoration:none;
	padding:6px 8px 8px 8px;
	cursor:pointer;
}
a {
	cursor:pointer;
}

li a:hover,
li a:visited,
li a:active,
li.current a.current {
	text-decoration:none;
}


/* ===  Standaard Blokjes === */

ul li,
.blok {
	border:solid 1px #000;
	background-color:#FFF;
}
.rood 	{
	border-top-color:#A72179;
	border-left-color:#A72179;
}
.geel 	{
	border-top-color:#FFE200;
	border-left-color:#FFE200;
}
.groen 	{
	border-top-color:#99CA3C;
	border-left-color:#99CA3C;
}
.blauw	{
	border-top-color:#5BBBEA;
	border-left-color:#5BBBEA;
}

/* === blokjes changed by jQuery */

.jBlock {
	border:none;
	background-color:transparent;
}
li.jBlock {
	position:absolute;
	margin:0px 8px 8px 0px;
}

.jBlock .top,
.jBlock .left,
.jBlock .bottom {
	background: transparent url("../img/blok_rood.gif") top right no-repeat;
	margin:0px;
	padding:0px;
}
.jBlock .top {
	background-position:top right;
}
.jBlock .left {
	background-position:top left;
	font-size:2px;
	width:8px;
	height:8px;
}
.jBlock .bottom {
	background-position:bottom left;
}
.jBlock .inner {
	background-color:#fff;
	border:solid 1px #000;
	border-top:none;
	border-left:none;
	margin-left:8px;
	padding:8px;
}
li.jBlock .inner 					{ padding:0px;}

li.jBlock.current 				{	width:176px;}
li.jBlock.current					{ margin:8px 0px 0px 8px; }
/*li.jBlock:hover						{ margin:8px 0px 0px 8px; }*/
li.jBlock.current .inner 	{	border-right:none; }

.jBlock.geel	.top,
.jBlock.geel	.left,
.jBlock.geel	.bottom {background-image:url("../img/blok_geel.gif"); }

.jBlock.groen	.top,
.jBlock.groen	.left,
.jBlock.groen	.bottom {background-image:url("../img/blok_groen.gif"); }

.jBlock.blauw	.top,
.jBlock.blauw	.left,
.jBlock.blauw	.bottom	{background-image:url("../img/blok_blauw.gif"); }


/* === content item (portfolio) === */

.portfolio_item {
	float:left;
	display:block;
	width:225px;
	height:150px;
	margin:0px 8px 16px 8px ;
	overflow:hidden;
	border:solid 1px #000;
	background-color:#fff;
}
	.portfolio_item img {
		width:225px;
		height:150px;
		border:none;
	}
	.portfolio_item .bijschrift {
		width:217px;
		height:142px;
		padding:4px;
	}
	.portfolio_item .bijschrift * {
		font-size:12px;
		line-height:1.25em;
	}
	.portfolio_item .bijschrift h3 {
		padding-bottom:2px;
	}

.submenu {
	margin:0px 0px 16px 5px;
	cursor:pointer;
}
.submenu a {
	margin:0px 4px;
}
.submenu a.current,
.submenu a:hover	 { color:#99CA3C; text-decoration:none;}

/* =========== contact formulier ======= */

fieldset {
	border:none;
	clear:both;
	margin:8px 0px 0px;
	padding:0px;
	width:450px;
}

.form_field {
	min-height:22px;
}

legend,
input.cancel,
input.reset {
	display:none;
}
label {
	width:100px;
	float:left;
}
textarea,
input {
	float:right;
	width:330px;
	border:solid 1px #5BBBEA;
}
textarea:hover,
textarea:focus,
input:hover,
input:focus {
	border-color:#216180;
}
input.submit {
	width:150px;
	font-size:1em;
	background-color:#fff;
	margin-top:4px;
}
input.submit:hover {
	background-color:#5BBBEA;
	color:#FFF;
	cursor:pointer;
}

.error {
	color:#5BBBEA;
	font-style:italic;
}
noscript {
	float:left;
}