/*
	BEGIN of Reset CSS Styles
	This is used to avoid complications when different browsers use different default values for these elements
*/

@import url('menu.css');
@import url('modules.css');
@import url('sitemap.css');
@import url('slimbox.css');

html, body, div, span, applet, object, iframe,
h1, h2, blockquote, pre,
abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
}
/*
	END of Reset CSS Styles
*/
html, body {
	height: 100%;
}

body {
	background: #fff url('/images/content_background.png') center repeat-y;
	margin: 0;
	padding: 0;
	font-family: helvetica, arial, verdana, serif, sans-serif;
	font-size: 16px;
}

img {
	border: none;
	outline: none;
}

a{
	color: black;
	outline: none;
}

#left p a:hover {
	background-color: #eeff00;
	color: #000;
}
#websiteWrapper{
	margin: 0 auto;
	padding: 0;
	width: 940px;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	/*margin: 0 auto -240px;*/
	margin: 0 auto -390px;
}

*:first-child+html #websiteWrapper
{
	/*padding-bottom: 240px;*/
	padding-bottom: 390px;
}

#footerMenuContainer{

	/*
	height: 240px;
	background: #000 url('/images/footer_verloop.png') repeat-x;
	*/
	height: 390px;
	background: #000;
}

h2{
	color: #000;
	font-size: 24px;
	font-family: Helvetica;
	font-weight: normal;
	margin: 0;
	margin-bottom: 14px;
	padding-top: 31px;
	padding-bottom: 0px;
}

#left, #leftHeader{
	float: left;
	margin-right: 20px;
	width: 700px;
	border-bottom: 1px solid #d9d9d9;
}

#aside, #rightHeader{
	float: left;
	padding-left: 21px;
	width: 199px;
}

#left, #aside{
	margin-bottom: 40px;
}

/* Headers */
.header{
	height: 131px;
	width: 940px;
}

#leftHeader{
	border-bottom: 1px solid #d9d9d9;
	height: 130px;
}

#leftHeader img{
	float: left;
}

#rightHeader{
	border-bottom: 1px solid #d9d9d9;
	height: 130px;
	margin-left: 20px;
	padding-left: 0;
	text-align: center;
}

/*** styles for leftside ***/

/* Homepage */
#introBlock{
	float: left;
	margin: 0 0 0 0;
	padding: 0;
	width: 100%;
	position: relative;
}

#introBlock p{
	border-bottom: 1px solid #d9d9d9;
	height: 67px;
	margin: 0;
	padding-top: 13px;
	padding-bottom: 35px;
}

#introBlock h1{
	clear: both;
	font-family: georgia;
	line-height: 100%;
	font-size: 40px;
	font-weight: normal;
	margin: 0px;
	margin-top: 35px;
	padding: 0px;
}

.moduleLinkContent h2{
	color: #000;
	font-size: 24px;
	font-family: Helvetica;
	font-weight: normal;
	margin: 0;
	padding: 0;
	padding-top: 21px;
	padding-bottom: 10px;
}

#introBlock p.project_client{
	margin: 0px;
	padding: 0px;
	padding-bottom: 20px;
	font-size: 18px;
	font-family: Helvetica;
	border-bottom: 0px;
	color: #737373;
	font-weight: normal;
	float: left;
	margin-top: 9px;
	height: 17px;
}

#newsOverview
{
	border-top: 1px solid #d9d9d9;
	padding-top: 18px;
}

#pagingDiv {
	float: left;
	margin-top: -5px;
	padding-bottom: 13px;
	width: 100%;
}

#pagingDiv .previousPage,
#pagingDiv .nextPage,
#newsOverview .previousPage{
	color: #000;
	font-family: helvetica, serif;
	font-size: 0.6875em; /* 11 / 16 */
	text-decoration: none;
}

.previousPage{
	float: left;
}

a.previousPage:hover, a.nextPage:hover{
	background-color: #eeff00;
}

.nextPage{
	float: right;
}

#pagingDiv .pagingLinkInactive{
	color: #ccc;
}

/****/

/*** article blocks ***/
.articleSnippet .moduleTopLine
{
}

.moduleTopLine
{
	border-bottom: 1px solid #d9d9d9;
	width: 100%;
	height: 20px;
	clear: both;
}

.moduleTopLine.split
{
	float: left;
	clear: none;
	width: 340px;
}

.moduleTopLine.split.left
{
	margin-right: 20px;
}

.moduleBottomSpacer
{
	clear: both;
	width: 100%;
	height: 20px;
}

div.text_single{
	float: left;
	margin: -10px 0 0px 0;
}

div.text_single p {
	color: #737373;
	font-size: 16px;
	line-height: 140%;
	font-family: Helvetica;
	margin: 0;
	margin-bottom: 10px;
}

div.text_double {
	width: 340px;
	float: left;
}

div.text_double p {
	font-size: 12px;
	line-height: 130%;
	color: #737373;
	font-family: Helvetica;
	margin-bottom: 10px;
}

div.text_double.left {
	float: left;
	margin-right: 24px;
	width: 338px; 
}

div.text_double.right {
	float: left;
	margin-top: 0px;
	width: 338px;
}

.moduleLinkContent
{
	clear: both;
	position: relative;
}

p
{
	line-height: 140%;
	/*font-size: 16px;*/
	color: #737373;
}

.article, .articleBig
{
	float: left;
	padding-bottom: 15px;
	width: 100%;
	position: relative;
}

/** IE6 & IE7 fixes **/ 
* html .article{float: none;}
*:first-child + html .article{ float: none;}

.news_admin_div
{
	position: absolute;
	top: 2px;
	right: 2px;
	z-index: 6;
}


.articleBig h1{
	color: #000;
	font-family: 'georgia', serif;
	font-size: 2.5em; /* 40 / 16 */
	font-weight: normal;
	line-height: 110%;
	padding-top: 5px;
}

.articleBig h1 a{
	text-decoration: none;
}

.articleBig h1 a:hover{
	background-color: #eeff00; 
}

.articleTitle{
	float: left;
	padding: 10px 20px 0 0;
	width: 200px;
}

.articleTitle h2{
	color: #000;
	font-size: 1em;
	line-height: 110%;
	font-weight: normal;
	margin: 0px;
	margin-top: 5px;
	padding: 0px;
	width: 220px;
}

.articleText{
	color: #737373;
	float: left;
	font-size: 0.875em; /* 14 / 16 */
	padding: 15px 0 0 20px;
	width: 440px;
	line-height: 130%;
}

.articleText p{
	color: #737373;
	margin: 0;
	padding: 0 0 20px 0;
	/*line-height: 130%;*/
}

.articleBig p{
	color: #737373;
	font-size: 1em; /* 16 / 16 */
	line-height: 140%;
}

.articleBig p.articleDate,
.articleSnippet p.articleDate
{
	margin: 4px 0 0 0;
	padding: 0px;
	color: #737373;
	font-size: 0.6875em; /* 11 / 16 */
	text-transform: lowercase;
}

.articleBig a,
.articleSnippet a
{
	text-decoration: none;
}

.articleSnippet a:hover{ background-color: #eeff00;}

.articleSnippet{
	float: left;
	width: 100%;
	position: relative;

}

.articleSnippet h1{
	color: #737373;
	color: #000;
	float: left;
	font-family: 'georgia', serif;
	font-size: 1.125em;  /* 18 / 16 */
	font-weight: normal;
	line-height: 140%;
	margin: 0;
	padding: 0;
	width: 100%;
	margin-bottom: 3px;
}

.articleSnippet h1 a{
	text-decoration: none;
}


/*****/

/**** Picture containers ****/

/* Picture containers */
.bigPicturesContainer,
.middlePicturesContainer,
.smallPicturesContainer,
.listboxContainer,
.portfolioItemsContainer,
.middlePicturesContainer_linked{
	float: left;
	width: 700px;
}

*:first-child+html .bigPicturesContainer{float: none;}
*:first-child+html .middlePicturesContainer{float: none;}
*:first-child+html .smallPicturesContainer{float: none;}
*:first-child+html .listboxContainer{float: none;}
*:first-child+html .middlePicturesContainer_linked{float: none;}

.middlePicturesContainer a
{
	background: transparent url('/images/blank.gif') repeat;
}

.portfolioItemsContainer{
	margin-top: 21px;
}

.listboxContainer {
	background: #fff url('../images/list_faux.png') repeat-y;
}

.middlePicturesContainer_linked {
	background-color: black;
	padding: 0px;
}

.middlePicturesContainer_linked .pictureMiddle_1,
.middlePicturesContainer_linked .pictureMiddle_2 {
	border: 0px;
	margin-bottom: 0px;
	padding: 0px;
}


/* Big picture */
.pictureBig{
	float: left;
	height: 447px;
	width: 700px;
}


.bigPicturesContainer p{
	color: #737373;
	float: left;
	font-family: helvetica, serif;
	font-size: 1em; /* 16 / 16 */
	line-height: 130%;
	margin: 2px 0 0 0;
	padding: 0;
}

.borderDivBig {
	border: 1px solid #cdcdcd;
	height: 436px;
	position: absolute;
	width: 698px;
}

.divRollover{
	background-color: #eeff00;
	/*
	filter: alpha(opacity=50); /* internet explorer */
	/*
	-khtml-opacity: 0.5;      /* khtml, old safari */
	/*
	-moz-opacity: 0.5;       /* mozilla, netscape */
	/*
	opacity: 0.5;           /* fx, safari, opera */
}


/* Middle picture */
.pictureMiddle_1, .pictureMiddle_2{
	float: left;
	height: 212px;
	width: 340px;
}

.pictureMiddle_1{
	margin-right: 20px;
}

.borderDivMiddle{
	border: 1px solid #cdcdcd;
	height: 210px;
	position: absolute;
	width: 338px;
}

.borderDivPortrait {
	border: 1px solid #cdcdcd;
	height: 542px;
	position: absolute;
	width: 338px;
}

.noBorderDivMiddle{
	height: 210px;
	position: absolute;
	width: 338px;
}

/* Small pictures */
.pictureSmall_1, .pictureSmall_2{
	float: left;
	height: 138px;
	width: 220px;
}

.pictureSmall_1{
	margin-right: 20px;
}

.borderDivSmall{
	border: 1px solid #cdcdcd;
	height: 136px;
	position: absolute;
	width: 218px;
}

/* all pictures have a border-bottom */
.pictureBig, .pictureMiddle_1, .pictureMiddle_2, .pictureSmall_1, .pictureSmall_2{
	/*border-bottom: 1px solid #d9d9d9;*/
	padding-bottom: 7px;
}

/* Portfolio items */
.portfolioItemsContainer a{
	color: #fff;
	text-decoration: none;
}

.portfolioItemsContainer a:hover{
	color: #000;
}

.hotspot {
	background: transparent url('/images/blank.gif') repeat;
	position: absolute;
	z-index: 3;
	top: 0px;
	left: 0px;
}

.portfolioItemSmall_1 .hotspot,
.portfolioItemSmall_2 .hotspot {
	height: 215px;
	width: 220px;
}

.portfolioItemMedium_1 .hotspot,
.portfolioItemMedium_2 .hotspot {
	width: 100%;
	height: 100%;
}

.portfolioItemSmall_1, .portfolioItemSmall_2{
	background: transparent url('/images/portfolio_bottom.png') center bottom no-repeat;
	border-bottom: 1px solid #d9d9d9;
	float: left;
	height: 245px;
	margin-bottom: 19px;
	width: 220px;
	position: relative;
}

.portfolioItemSmall_1{
	margin-right: 20px;
}

/** IE6 fix **/
*html .portfolioItemSmall_1{margin-right: 17px;}

.portfolioItemSmall_1 .project_admin_div,
.portfolioItemSmall_2 .project_admin_div,
.portfolioItemMedium_1 .project_admin_div,
.portfolioItemMedium_2 .project_admin_div
{
	position: absolute;
	top: 2px;
	right: 2px;
	z-index: 6;
}

.portfolioItemSmall_1 h4,
.portfolioItemSmall_2 h4
{
	font-family: 'georgia', serif;
	font-size: 16px;
	height: 58px;
	font-weight: normal;
	line-height: 120%;
	margin: 0;
	padding: 0;

}

.portfolioItemMedium_1 h4,
.portfolioItemMedium_2 h4
{
	float: left;
	font-family: 'georgia', serif;
	font-size: 18px;
	font-weight: normal;
	max-height: 43px;
	line-height: 120%;
	margin-top: 10px;
	margin-bottom: 5px;
	padding: 0;
}

.portfolioItemSmall_1 h4,
.portfolioItemSmall_2 h4{
	font-weight: normal;
	margin-top: -3px;
	margin-left: 1px;
}

.portfolioItemSmall_1 p,
.portfolioItemSmall_2 p,
.portfolioItemMedium_1 p,
.portfolioItemMedium_2 p
 {
	color: #737373;
	float: left;
	font-family: helvetica, serif;
	font-size: 0.6875em; /* 11 / 16 */
	margin-top: 4px;
	width: 100%;
}

.portfolioItemSmall_1 p,
.portfolioItemSmall_2 p{
	font-size: 0.75em; /* 12 / 16 */
	margin-top: 7px;
	margin-left: 1px;
}

.portfolioItemMedium_1 p,
.portfolioItemMedium_2 p
 {
	font-size: 13px;
	line-height: 130%;
	height: 47px;
}

.portfolioItemSmall_1 a,
.portfolioItemSmall_2 a,
.portfolioItemMedium_1 a,
.portfolioItemMedium_2 a
 {
	text-decoration: none;
}

#introBlock ul,
.portfolioItemSmall_1 ul,
.portfolioItemSmall_2 ul{
	float: left;
	list-style: none;
	margin: 0px;
	padding: 0px;

	position: absolute;
	bottom: 5px;
	left: 0px;
}

#introBlock ul
{
	top: 5px;
	margin: 5px 0 10px 0;

}

#introBlock ul li a{
	text-decoration: none;
}

#introBlock ul li,
.portfolioItemSmall_1 ul li,
.portfolioItemSmall_2 ul li{
	background-color: #b3b3b3;
	color: #fff;
	float: left;
	font-family: helvetica, serif;
	font-size: 0.6875em; /* 11 / 16 */
	height: 15px;
	margin-right: 5px;
	padding: 0 5px 0 5px;
}

#introBlock ul li a,
.portfolioItemSmall_1 ul li a,
.portfolioItemSmall_2 ul li a{
	color: #fff;
}

#introBlock ul li:hover,
.portfolioItemSmall_1 ul li:hover,
.portfolioItemSmall_2 ul li:hover,
#introBlock ul li:hover a,
.portfolioItemSmall_1 ul li:hover a,
.portfolioItemSmall_2 ul li:hover a{
	background-color: #eeff00;
	color: #000;
}

.portfolioItemMedium_1,
.portfolioItemMedium_2
{
	background: transparent url('/images/portfolio_bottom_medium.png') center bottom no-repeat;
	border-bottom: 1px solid #d9d9d9;
	float: left;
	height: 338px;
	margin-bottom: 0px;
	width: 341px;
	position: relative;
}

.transparentBg {
	background: transparent;
	background-image: none;

}

.portfolioItemMedium_1{
	margin-right: 18px;
}

.noborder{
	border: 0;
}

/* Information lists */
.listBox,
.listBox2{
	background-color: #f3f3f3;
	float: left;
	min-height: 114px;
	padding: 8px 10px 10px 8px;
	width: 214px;
	color: #737373;
	font-family: helvetica, serif;
	font-size: 13px; /* 13 / 16 */
	line-height: 140%;
}

.listBox {
	margin-right: 2px;
}

.listBox h3,
.listBox2 h3{
	color: #000;
	font-family: helvetica, serif;
	font-size: 16px; /* 16 / 16 */
	margin: 0;
	padding: 0 0 10px 0;
}

.listBox p,
.listBox2 p{
	line-height: 135%;
	margin: 0;
	padding: 0;
}

.picturePortrait_1, .picturePortrait_2{
	float: left;
	width: 340px;
}

.picturePortrait_1{margin-right: 20px;}

/*** Styles for the contactform ***/
.contactForm{
	padding-bottom: 40px;
	width: 460px;
}

.contactForm .textRow, .contactForm .textArea, .contactForm .capchaTextRow{
	background-color: #f4f4f4;
	border: none;
	color: #737373;
	float: left;
	font-family: Helvetica;
	font-size: 14px;
	height: 15px;
	margin-bottom: 10px;
	padding: 5px;
	width:450px;
}


.contactForm .capcha{
	height: 25px;
}

.contactForm .capchaTextRow{
	float: right;
	width: 320px;
}

.contactForm .textArea{
	height: 110px
}

.contactForm input.submit{
	background-color: #fff;
	border: none;
	color: #b3b3b3;
	font-family: Helvetica;
	font-size: 18px;
	text-align: left;
	font-weight: bold;
	cursor: pointer;
}

.contactForm input.submit:hover{
	background-color: #eeff00;
	color: #000;
}

/*** Styles for aside (right) ***/
#nav{
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
}


.asideArticle{
	border-bottom: 1px solid #d9d9d9;
	color: #737373;
	float: left;
	font-family: helvetica, serif;
	padding-bottom: 17px;
	margin-bottom: 9px;
	width: 100%;
}

.asideArticle a{
	color: #000;
	font-weight: bold;
	text-decoration: none;
}

.asideArticle a:hover{
	background-color: #eeff00;
}

.asideArticle h3, #asideCategoryTray h3{
	color: #000;
	font-size: 1em;
	font-weight: normal;
}



.asideArticle p{
	float: left;
	font-size: 0.75em; /* 12 / 16 */
	line-height: 130%;
	margin: -5px 0 0 0;
}

ul.asideCategoryTray
{
	border: none;
	float: left;
	clear: both;
	list-style: none;
	margin: 0;
	padding: 0;
}

ul.asideCategoryTray li
{
	background-color: #b3b3b3;
	clear: both;
	color: #fff;
	float: left;
	font-family: helvetica, serif;
	font-size: 0.6875em; /* 11 / 16 */
	height: 15px;
	margin: 0 5px 5px 0;
	padding: 0 5px 0 5px;
}

ul.asideCategoryTray li a
{
	color: #fff;
	font-weight: normal;
	text-decoration: none;
}

ul.asideCategoryTray li:hover,
ul.asideCategoryTray li:hover a,
ul.asideCategoryTray li a:hover{
	background-color: #eeff00;
	color: #000;
}



 /*** Footer styles ***/

#footerSloganContainer, #footerMenuContainer{
	clear: both;
	float: left;
	width: 100%;
}

#footerSloganContainer{
	background-color: #d9d9d9;
}

#footerSlogan{
	margin: 0 auto;
	height: 59px;
	padding-top: 21px;
	width: 940px;
}

#footerSlogan .footerSloganText{
	color: #000;
	font-size: 30px;
	font-family: Flama, sans-serif;
	line-height: 120%;
}


#footerMenu{
	color: #fff;
	margin: 0 auto;
	padding: 16px 0 0 2px;
	width: 938px;
}
#footerMenu img, #footerMenu img.subsiteFooterImage{
	float: right;
	margin: -16px -4px 0 0;
}

#footerMenu img.subsiteFooterImage{
	margin: 5px -4px 0 0;
}

.footerContent{
	color: #b3b3b3;
	float: left;
	font-size: 0.8125em; /* 13 / 16 */
	margin-right: 19px;
	width: 220px;
}

.footerContent p
{
	font-size: 13px;
	line-height: 150%;
}

.footerContent a{
	color: #fff;
	text-decoration: none;
}

.footerContent a:hover{
	color: #eeff00;
}

.footerContent p{
	margin: 0;
	padding: 0;
}

.footerContent ul{
	list-style: none;
	margin: 0;
	padding: 0;
}

.footerContent ul li{
	line-height: 150%;
	font-family: helvetica, serif;
}

#infoDiv,
#infoDiv * {
	font-size: 10px;
	color: black;
}

#login {
    margin:100px auto;
    border: 1px solid #bbb;
    padding: 10px;
    width: 500px;
    background-color:#fafafa;
}


/* LOGIN PAGE */
.editContainerCompleteLogin{
	float: left;
	width: 555px;
	margin-top: 15px;
	padding: 15px 10px;
}

.editContainerCompleteLogin p{
	font-size: 12px;
}

.editContainerCompleteLogin .text{
	background-color: #f9f9f9;
	border: 1px solid #000;
	float: left;
	font-size: 12px;
	margin: 5px 0 0 4px;
	padding: 5px;
	width: 250px;
}

.editContainerCompleteLogin label{
	float: left;
	font-size: 12px;
	width: 230px;
	margin: 8px 0 0 8px;
}

.editContainerCompleteLogin .forgotLogin
{
	float: right;
	margin: 30px 49px 0 0;
}

.forgotLogin img, .forgotLogin a{
	float: right;
}

.forgotLogin img{
	margin-right: 2px;
}

.editContainerCompleteLogin .button{
	float: right;
	margin: 10px 49px 0 0;
}

.editContainerCompleteLogin h2 {
	background: gray url('../images/edit_header_bg.png') repeat-x;
	color: #fff;
	float: left;
	font-size: 15px;
	font-weight: bold;
	margin-bottom: 5px;
	padding: 3px 0 3px 9px;
	width: 555px;
}

.loginErrorDiv{
	background-color: #fbe3e4;
	border: 1px solid #fbc2c4;
	float: left;
	padding: 7px;
	width: 545px;
}

.sendEmailDiv{
	background-color: #e6efc2;
	border: 1px solid #c6d880;
	float: left;
	padding: 7px;
	width: 545px;
}

.loginErrorDiv img, .loginErrorDiv p, .sendEmailDiv img, .sendEmailDiv p{
	float: left;
}

.loginErrorDiv p, .sendEmailDiv p{
	margin: 7px 0 0 10px;
	font-size: 12px;
	font-weight: bold;
}

/* BEGIN admintools style */
#adminTools_open{
	display: none;
	position: fixed;
	right: 0;
	top: 0;
	width: 225px;
	padding-left: 25px;
	height: 100%;
	background: gray url('../images/admin_toolbar_background.png') repeat-y top left;
}

#adminToolsClosed{
	position: fixed;
	right: 0;
	top: 0;
	height: 100%;
	width: 25px;
	display:block;
	background: gray url('../images/admin_toolbar_background.png') repeat-y top left;
}

#adminTools_open img.closeImage{
	position: relative;
	top: 50%;
	left: -15px;
	margin-top: -6px;
	cursor: pointer;
}

#adminToolsClosed img{
	position: relative;
	top: 50%;
	left: 10px;
	margin-top: -6px;
	cursor: pointer;
}

#infoDiv{
	float: left;
	width: 225px;
}
