body{
	font-size: x-small;
	font-family: verdana, arial, helvetica, sans-serif;
	line-height: 1.3;
	background: url(/images/backgrounds/page-full.gif) 50% 0% #fff repeat-y;
}

body.wide{
	background: url(/images/backgrounds/page-wide.gif) 50% 0% #fff repeat-y;
}

#top{
	position: relative;
	z-index: 100;
	height: 52px;
	background: #999696;
}

#header{
	height: 180px;
	border-bottom: 2px solid #000;
	border-top: 2px solid #000;	
	background: #000;
}

#content,
#navigation,
#window{
	width: 800px;
	height: 180px;
	margin: 0 auto 0 auto;
}


#window{
	overflow: hidden;
}

/* --- Navigation --- */

#navigation{
	background: url(/images/backgrounds/buttons.gif) no-repeat;
	color: #fff;
	position: absolute;	
	bottom: 0;
	left: 50%;
	margin-left: -400px;
	height: 28px;
	padding-top: 9px;
}
#navigation a{
	color: #fff;
}

#navigation li{
	position: absolute;
}

#navigation .container{
	display: none;
	position: absolute;
	top: 29px;
	width: 137px;
	overflow: hidden;
	height: 400px;
	border: 1px solid black;
	z-index: 100;
}
#navigation[id] .container{
	background: url(/images/backgrounds/submenu.png);
}

#navigation li ul{
	width: 137px;	
	height: 400px;
	padding-top: 10px;
	margin: 0;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='/images/backgrounds/submenu.png');	
	color: #fff;	
}


#navigation li ul li{
	position: static;
	display: block;
	padding: 5px 17px;
	height: auto;
	width: auto;
}

#navigation li a{
	display: block;
	text-indent: -10000px;	
	width: 137px;
	height: 28px;
	border-bottom: 2px solid black;	
}

#navigation li li a{
	display: block;
	position: relative;
	border: 0;	
	height: 12px;
	margin-bottom: 3px;
	color: #000;
	background: none;
	background-position: 0 0;
}

#navigation li:hover ul,
#navigation li.over ul,
#navigation li:hover .container,
#navigation li.over .container{
	display: block;
}

#navigation li:hover,
#navigation li.over{
	z-index: 100;
}

#navigation li:hover a,
#navigation li.over a{
	background-position: 0 -28px;
}

#navigation li:hover li a,
#navigation li.over li a{
	background-position: 0 0;
}

/* --- Body --- */

#content{
	position: relative;
	border-top: 10px solid white;
	background: none;
}

#logo{
	float: left;
	padding-left: 35px;
	padding-top: 10px;
}

h1{
	font-size: 270%;
	color: #B3B5B7;
	clear: left;
	float: left;
	width: 255px;
	text-align: right;
	margin-top: 20px;
}

p{
	margin-bottom: 1em;
}

h2{
	margin: 1em 0 1em 0;
}

blockquote{
	margin: 2em 0 2em 0;
	padding: 0;
	text-indent: 0;
	font-size: 100%;
}

#text,
#breadcrumb{
	width: 255px;	
	margin: 0px 0 0 300px;
}


#breadcrumb{
	margin-top: 25px;
}

.no-bread-crumb #text{
	margin-top: 20px;
}

#text{
	margin-top: 32px;
}

.wide #text{
	width: 450px;
	background: #fff;
}
#text a{
	color: #A31C22;
}

#text ul,
#text ul li{
	list-style: disc outside;
}

#text ul{
	margin: 1em 0;
}

#text ul li{
	margin-left: 2em;
}

#text ul.none,
#text ul.none li{
	list-style: none;
	margin: 0;
}

#breadcrumb,
#breadcrumb a{
	color: #999696;
}

#breadcrumb span.active{
	color: #000;
}

#bar{
	position: absolute;
	right: 0;
	top: -3px;
	width: 230px;
}

body.wide #bar,
#language{
	right: 0;
	text-align: right;
	background: url(/images/backgrounds/bar-wide.gif) #fff 0 100% no-repeat;	
	padding: 0 0 6px 0;		
}

#bar .nav{
	vertical-align: middle;	
	margin-right: 13px;
}

#language{
	background: url(/images/backgrounds/line-horizontal.gif) 0 100% repeat-x;
}

#bar-content{
	margin: 10px 20px;
}


dl.address dt{
	float: left;
	width: 5em;
}

dl address dd{
	margin-left: 5em;
}

/* ---- Textbox right --- */

div.textbox_right{
	border-left: 2px dotted #716e6e;
	width: 227px; 
	position: absolute; 
	right: 0; 
	top: 25px;
	height: 400px;
}
div.textbox_right h2{
	margin: 10px 20px 5px 20px;
}
div.textbox_right dl{
	margin: 5px 20px;	
}			
div.textbox_right dl dt{
	font-weight: bold;
	margin: 0;
	padding: 0;				
}
div.textbox_right dl dd{
	margin: 0 0 1em 0;
	padding: 0;
}

/* ---- People --- */

div.person{
	border-left: 2px dotted #716e6e;
	width: 230px; 
	position: absolute; 
	right: 0; 
	top: 25px;
	display: none;
}
#text a{
	color: #A31C22;
}
div.person dl{
	margin: 5px 20px;	
}			
div.person dl dt{
	font-weight: bold;
	margin: 0;
	padding: 0;				
}
div.person dl dd{
	margin: 0 0 1em 0;
	padding: 0;
}

div.person h2{
	margin: 10px 20px 5px 20px;
}
div.person img{
	margin: 5px 20px;
}
/* --- Client login --- */

form.login{
	margin-top: 3em;
}

form.login label{
	float: left;
	width: 7em;
	text-align: right;
}

form.login input{
	margin-left: 1em;
	width: 10em;
}

form.login input.submit{
	clear: both;
	width: auto;
	margin: 1em 0 0 0;
	
}

/* --- 2COL buttons --- */


div.left,
div.right{
	float: left;
	width: 50%;
}

/* --- NAV buttons --- */

#navigation #t-dvj_interactive .container{ height: 180px;  }
#navigation #t-kwalitatief .container{ height: 180px; }
#navigation #t-kwantitatief .container{ height: 180px; }
#navigation #t-datamining .container{ height: 180px; }
#navigation #t-co_creation .container{ height: 190px; }


#t-dvj_interactive{ z-index: 11 }
#t-kwalitatief{	left: 126px; 	z-index: 10;}
#t-kwantitatief{	left: 252px; 	z-index: 9;}
#t-datamining{	left: 378px; 	z-index: 8;}
#t-co_creation{	left: 504px; 	z-index: 7;}
#t-client-login{	left: 696px; 	z-index: 6;}

#t-datamining .container{
	width: 163px;
}
#t-datamining .container a{
	width: 150px;
}

#t-dvj_interactive a{	background: url(/images/buttons/0.dvj_interactive.gif) no-repeat;}
#t-kwalitatief a{	background: url(/images/buttons/0.kwalitatief.gif) no-repeat;}
#t-kwantitatief a{ background: url(/images/buttons/0.kwantitatief.gif) no-repeat;}
#t-datamining a{	background: url(/images/buttons/0.datamining.gif) no-repeat;}
#t-co_creation a{	background: url(/images/buttons/0.co_creation.gif) no-repeat;}
#t-client-login a{	background: url(/images/buttons/client_login.gif) no-repeat;}


#navigation #t-dvj_interactive li a:hover,
#navigation #t-kwalitatief li a:hover,
#navigation #t-kwantitatief li a:hover,
#navigation #t-datamining li a:hover,
#navigation #t-co_creation li a:hover{
	background-position: 0 -12px;
}
