/****************************************************************************************************************************************/
/* Copyright © 2007, ITSForYou */
/*
/* Oranje			: #EE6A00 
/* Grijze tekst		: #404040
/****************************************************************************************************************************************/


/****************************************************************************************************************************************/
/* Global stuff */
/****************************************************************************************************************************************/

* {
	font-family					: Verdana, Trebuchet MS, Arial;
	font-size 					: 11px;
	color						: #404040;
	cursor						: default;
}

body {
	margin						: 0px;
	border						: 0;
}

a:link, a:visited {
	color						: #EE6A00;
	text-decoration				: none;
}

a:hover {
	color						: #EE6A00;
	text-decoration				: underline;
	cursor						: pointer;
}

ul{
	margin-top					: 5px;
	margin-bottom				: 5px;
}

li {
	list-style-type				: square;
	color						: #EE6A00;
}

/****************************************************************************************************************************************/
/* Screen objects */
/****************************************************************************************************************************************/

#pageBody {
	background-color			: #121212;
	background-image			: url(../images/background.png);
	background-repeat			: repeat-x;
	overflow-x					: hidden;
	overflow-y					: auto;

}

#divAllScreen {
	position					: absolute;
	height						: 100%;
	width						: 100%;
	padding						: 0px;
	margin						: 0px;
	z-index						: 1;
}

#divOutline {
	position					: absolute;
	left						: 50%;
	width 						: 1000px;
	height 						: 590px;
	margin-left					: -500px;
	background-image			: url(../images/background_1st.gif);
	background-repeat			: no-repeat;
	z-index						: 2;
	visibility					: hidden;
}

#divFlashHeader {
	position					: absolute;
	top							: 0px;
	left						: 380px;
	width						: 600px;
	height						: 99px;
	z-index						: 3;
}

#divFlashBeekstraat {
	position					: relative;
	top							: 140px;
	left						: 242px;
	width						: 500px;
	height						: 300px;
	z-index						: 3;
}

#divContentPlaceholder {
	position					: absolute;
	top							: 105px;
	left						: 15px;
	width						: 965px;
	height						: 455px;
	z-index						: 3;
}

#divActueelPlaceholder {
	top							: 9px;
	left						: 0px;
	width						: 210px;
	height						: 440px;
}

#divActueel {
	width						: 200px;
	height						: 415px;
	overflow-x					: hidden;
	overflow-y					: auto;
}

#divAboutPlaceholder {
	top							: 10px;
	left						: 223px;
	width						: 240px;
	height						: 300px;
}

#divPortfolioPlaceholder {
	top							: 10px;
	left						: 474px;
	width						: 240px;
	height						: 300px;
}

#divContactPlaceholder {
	background-image			: url(../images/john_baijens.gif);
	background-position			: 100% 100%;
	background-repeat			: no-repeat;
	top							: 10px;
	left						: 725px;
	width						: 240px;
	height						: 300px;
}

#divMissiePlaceholder {
	top							: 324px;
	left						: 223px;
	width						: 742px;
	height						: 125px;
}

#divMorePlaceholder {
	background					: white;
	top							: 10px;
	left						: 225px;
	width						: 0px;
	height						: 0px;
	z-index						: 4;
	display						: none;
	opacity						: 1;
}

#divCloseMore {
	position					: absolute;
	top							: 0px;
	right						: 0px;
	width						: 20px;
	height						: 15px;
	background-image			: url(../images/close.gif);
	background-position			: center top;
	background-repeat			: no-repeat;
	cursor						: pointer;
	z-index						: 5;
}

#divFooterPlaceholder {
	position					: absolute;
	top							: 575px;
	left						: 0px;
	width						: 1000px;
	height						: 15px;
}

#divCopyright {
	position					: absolute;
	color						: #aaaaaa;
}

#divFooter {
	position					: absolute;
	right						: 0px;
	color						: #aaaaaa;
	text-align					: right;
}

#iframeMore {
	border						: 0px;
	width						: 99.8%;
	height						: 94.8%;
}

/****************************************************************************************************************************************/
/* Classes
/****************************************************************************************************************************************/

.placeholder {
	position					: absolute;
	background					: #FFFAF0;
	border						: 1px solid #EE6A00;
	z-index						: 4;
}

.content {
	padding						: 5px;
}

.content h1 {
	font-size					: 12px;
	color						: #EE6A00;
	margin						: 0px 0px 10px 0px;
}

.content h2 {
	font-weight					: normal;
	color						: #EE6A00;
	margin						: 0px 0px 0px 0px;
}

.item {
	font-size					: 10px;
	padding-bottom				: 15px;
}

.datum {
	font-size					: 9px;
	color						: #EE6a00;
}

.orange {
	color						: #EE6A00;
}

.boldOrange {
	color						: #EE6A00;
	font-size					: 10px;
	font-weight					: bold;
}

.groetenTxt {
	position					: absolute;
	left						: 5px;
	bottom						: 5px;
}

.kleineTxt {
	font-size					: 9px;
}

.kleineTxt a:link, .kleineTxt a:visited {
	color						: #AAAAAA;
}

.moreTxt {
	position					: absolute;
	right						: 5px;
	bottom						: 5px;
	overflow 					: hidden;
}

.moreHeader {
	background					: #EE6A00;
	background-image			: url(../images/header.png);
	top							: 0px;
	height						: 15px;
	color						: #FFFFFF;;
	font-weight					: bold;
	padding-left				: 5px;
	margin						: 0px;
	cursor						: pointer;
	overflow					: hidden;
}

.noMoreHeader {
	background					: #EE6A00;
	background-image			: url(../images/header.png);
	top							: 0px;
	height						: 15px;
	color						: #FFFFFF;;
	font-weight					: bold;
	padding-left				: 5px;
	margin						: 0px;
	overflow					: hidden;
}

.closeMoreTxt {
	padding						: 5px;
}

a:hover h2.moreHeader {
	text-decoration				: underline;
}

a:hover div#divCloseMore {
	background-position			: center -15px;
}

.portfolioItem {
	height						: 200px;
}

.portfolioItem a {
	line-height					: 20px;
}

.portfolioItem img {	
	position					: absolute;
	width						: 225px;
	margin-left					: 0px;
	border						: 1px solid #AAAAAA;
}

.portfolioItem div {
	position					: absolute;
	left						: 245px;
	width						: 210px;
	background					: #FFFFFF;
	border						: 1px dashed #AAAAAA;
	padding						: 5px;
	margin						: 5px;
}


/****************************************************************************************************************************************/
/* Corners
/****************************************************************************************************************************************/

.topLeftCorner {
	position					: absolute;
	background-image 			: url('../images/corners.gif');
	top							: -1px;
	left						: -1px;
	width						: 10px;
	height	 					: 10px;
}

.topRightCorner {
	position					: absolute;
	background-image			: url('../images/corners.gif');
	background-position 		: 100% 0;
	top							: -1px;
	right						: -1px;
	width						: 10px;
	height	 					: 10px;
}

.bottomLeftCorner {
	position					: absolute;
	background-image 			: url('../images/corners.gif');
	background-position 		: 0 100%;
	bottom						: -1px;
	left						: -1px;
	width						: 10px;
	height	 					: 10px;
}

.bottomRightCorner { 
	position					: absolute;
	background-image 			: url('../images/corners.gif');
	background-position			: 100% 100%;
	bottom						: -1px;
	right						: -1px;
	width						: 10px;
	height	 					: 10px;
}



