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

body {
	background:#FFF;
	margin:10px;
/*	background-image:url('../Afbeelding2.png');*/
}

#title {
	float:left;
	width:100%;
	background-color:#999;
}
	#title p { color:#000; padding:5px;}

#menu {
	float:left;
	width:100%;
	min-width:960px;
	height:35px;
/*	margin-top:20px;*/
}

#content {
	float:left;
	width:100%;
}

	#col1,#col2 {
		position:absolute;
		top:50px;
	}
	#col1 				{width:290px;}
	#col2 				{left:308px;width:550px;}
	#col2.project {width:700px;}
	
		#contactText	* {color:#990065;}
		#submenu				{margin-top:20px;}
		#projectImg			{max-height:575px;cursor:pointer;}
		#imgNav					{position:absolute;top:585px;left:635px;}
		#projNav				{position:absolute;top:585px;left:-297px;}
		
		
table,tbody,tr,td {
	margin:0px;
	padding:0px;
	border-spacing:0px;
	vertical-align:top;
}
td:first-child {
	padding-right:10px;
}

/* === random projects === */

#rndCol {
	position:absolute;
	top:40px;
	left:0px;
	margin:0px;
	padding:0px;
}

div.random {
	position:absolute;
/*	display:none;*/
	margin:0px;
	padding:25px;
/*	background-color:#999;*/
}
div.random img {
	height:425px;
	width:300px;
	border:solid 1px #fff;
	padding:10px;
}
div.random img:hover {border-color:#990065;}
div.random p {margin:0px;padding:0px 0px 0px 10px;width:300px;}

/* Placing */
#rndCol .nr1 {top:2px; left:35px;}
#rndCol .nr2 {top:30px; left:430px;}
#rndCol .nr3 {top:2px; left:837px;}
#rndCol .nr4 {top:535px; left:22px;}
#rndCol .nr5 {top:585px; left:475px;}
#rndCol .nr6 {top:530px; left:883px;}

body.books__publications #rndCol .nr1 {top:0px; left:7px;}
body.books__publications #rndCol .nr2 {top:0px; left:430px;}
body.books__publications #rndCol .nr3 {top:2px; left:837px;}
body.books__publications #rndCol .nr4 {top:535px; left:22px;}
body.books__publications #rndCol .nr5 {top:585px; left:457px;}
body.books__publications #rndCol .nr6 {top:525px; left:856px;}

body.magazines #rndCol .nr1 {top:0px; left:10px;}
body.magazines #rndCol .nr2 {top:0px; left:446px;}
body.magazines #rndCol .nr3 {top:2px; left:855px;}
body.magazines #rndCol .nr4 {top:540px; left:60px;}
body.magazines #rndCol .nr5 {top:540px; left:480px;}
body.magazines #rndCol .nr6 {top:525px; left:875px;}

body.identities #rndCol .nr1 {top:0px; left:15px;}
body.identities #rndCol .nr2 {top:0px; left:457px;}
body.identities #rndCol .nr3 {top:2px; left:1024px;}
body.identities #rndCol .nr4 {top:540px; left:65px;}
body.identities #rndCol .nr5 {top:545px; left:490px;}
body.identities #rndCol .nr6 {top:525px; left:885px;}

body.campaigns #rndCol .nr1 {top:0px; left:7px;}
body.campaigns #rndCol .nr2 {top:15px; left:395px;}
body.campaigns #rndCol .nr3 {top:0px; left:860px;}
body.campaigns #rndCol .nr4 {top:540px; left:47px;}
body.campaigns #rndCol .nr5 {top:565px; left:467px;}
body.campaigns #rndCol .nr6 {top:540px; left:923px;}

body.miscellaneous #rndCol .nr1 {top:0px; left:7px;}
body.miscellaneous #rndCol .nr2 {top:10px; left:460px;}
body.miscellaneous #rndCol .nr3 {top:0px; left:922px;}
body.miscellaneous #rndCol .nr4 {top:550px; left:85px;}
body.miscellaneous #rndCol .nr5 {top:540px; left:505px;}
body.miscellaneous #rndCol .nr6 {top:540px; left:960px;}



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

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

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

#menu ul,
#menu ul ul {
	list-style: none;
	padding:0px 10px 10px 0px;
}
#menu ul li {
	float: left;	
	margin-right:10px;
	letter-spacing:.06em;
}
#menu ul li ul li {
	float:none;
	height:18px;
}
#menu ul.lev1 {
	width:100%;
}

#menu ul li.active {
	position: relative;
	z-index:999;
}

#menu li a,
#menu li span.nonClickable {
	white-space: nowrap;
	padding:2px 2px 0px;
}

#menu ul ul {
	display:none;
	position: absolute;
	top: 100%;
	left: 0px;
	width: auto;
	padding:0px 2px 2px;
	margin-left:-2px;
}

#menu ul ul ul {
	top: 1px;
	left: 99%;
}

#menu ul li.active ul		 						{	display:block;}
#menu ul li.pos2.active ul 					{ display:none; }
body.project #menu ul li ul 				{ display:none; }


#menu ul li a,
#submenu ul li a {
	border-bottom:solid 1px #fff;
}
#menu ul li a:hover,
#menu ul li.active a,
#submenu ul li a:hover,
#submenu ul li a.active {	border-color: #990065;}

#menu ul li.lev2 a {	border-color:#fff;}
#menu ul li.lev2 a:hover {
	border-color: #990065;
}


#menu li .seperator							{ color:#990065; position:relative; top:3px; margin-left:10px;}
#menu li.lev1.last .seperator,
#menu li.lev2 .seperator				{ display:none;}
#menu li.lev1.pos1 .seperator		{ padding-left:58px; }

#menu li span.nonClickable			{ color:#999; white-space: nowrap; }

#menu li.lev1										{ margin-right:10px; }
#menu li.last										{ margin-right:0px;}
#menu li.lev1.pos1							{	color:#990065; }
#menu li.lev1.pos2							{	margin-left:60px; }
#menu li.lev1.pos1 a 						{	color:#990065; }

#menu ul.lev2										{ padding-top:8px; }



#submenu .seperator,
#submenu ul li									{ display:none;}
#submenu ul li.active,
#submenu ul li.active ul li			{ display:block;}
#submenu ul li.active a.lev1		{ display:none;}