/* 
/* 

Juni 2008
Door : Koen Haarbosch  |  Bit Squad

*/

/* --------------------------------------------- // -------- ALGEMENE SITE */

* {
	font-family: Tahoma, Arial, Verdana, Helvetica, sans-serif;
	font-size: 11px;
	padding: 0; 
	margin: 0;
	border: 0;
}

a:link { color: #000000; text-decoration: underline; } /*  niet bezochte link */
a:hover  { color: #000000; text-decoration: none;} /*  roll over  */

body {
	margin: 0;
	padding: 0;
	text-align: center;
	/*font-size: 100%; /* font-size wordt op 100% van de browser instellingen van de gebruiker gezet, deze grootte wordt dus overgenomen */
	background: #FFFFFF url(/grafx/bg_body.gif) repeat-x 0px 0px;
}
.clear {
	clear: both;
	height: 0px;
	font-size: 1px;
	border: none;
	margin: 0; 
	padding: 0;
	background: transparent;
}
#wrapper {
	width: 986px;
	margin-left: auto; 
	margin-right: auto;
	padding: 0;
	text-align: left;
}

/* --------------------------------------------- // -------- Instellen Fonts */
#back_print, #language{
	font-size: 0.75em;
}
#menu, #video, .txtSearch, .txtSearch_large, #rightPaneTop, #rightPaneBottom {
	font-size: 0.7em;
}
#content 
{
	font-size: 11px;
}
#content h1 {
	font-size: 1.6em;
}
#content h2 {
	font-size: 1.4em;
}
#content h3 {
	font-size: 1.2em;
}

/* --------------------------------------------- // -------- Header */
#header {
	float: left;
	width: 986px;
	height: 39px;
	background: #FFFFFF url(/grafx/bg_header.gif) no-repeat 0px 0px;
}
#address {
	float: left;
	width: 521px; /* 781 */
	height: 26px;
	padding: 13px 0 0 260px;
}
#language {
	float: left;
	width: 177px;
	height: 39px;
	line-height: 39px;
	text-align: right;
	padding: 0 28px 0 0;
}
#language a {
	text-decoration: none;
	font-weight: bold;
	margin: 0 5px 0 5px;
	color: #646466;
	
}
#language a.active { color: #009EE1;}
#language a:hover { text-decoration: underline; }
#headerMain {
	float: left;
	width: 986px;
	height: 192px;
	background: #FFFFFF url(/grafx/bg_headerMain.jpg) no-repeat 0px 0px;
}
#lefttop {
	float: left;
	width: 175px; /*  210 */
	height: 147px;
	padding: 45px 0 0 35px;
	/*background:url(/grafx/text_zoeken.gif) no-repeat 35px 30px;*/
}
img#placeholder 
{
	margin: 84px 0 0 12px;

}

.txtSearch, .txtSearch_large {
	float: left;
	width: 120px;
	height: 19px;
	padding: 4px 3px 0 4px;
	background: #FFFFFF url(/grafx/bg_search_box.gif) no-repeat 0px 0px;
}
.txtSearch_large {  
	width: 139px;
	background: #FFFFFF url(/grafx/bg_search_box_large.gif) no-repeat 0px 0px;
}
.search_button {
	float: left;
}
#visual {
	float: left;
	width: 571px;
	height: 191px;
	background: url(/grafx/visual.jpg) no-repeat 0px 0px;
}
#login {
	float: left;
	width: 178px;
	height: 135px;
	padding: 28px 0 0 10px; /*57px 0 0 27px;*/
	/*background:url(/grafx/DSO_logo_def_2.gif) no-repeat 5px 28px;*/
}
#login img.name {
	margin: 10px 0 0 0;
}

/* --------------------------------------------- // -------- Breadcrumb */

#breadcrumbContainer {
	float: left;
	width: 986px;
	height: 55px;
	background: #FFFFFF url(/grafx/bg_breadcrumb.jpg) no-repeat 0px 0px;
}
#logo {
	float: left;
	width: 163px; /* 210 */
	height: 55px;
	padding: 0 0 0 47px;	
}
#breadcrumb {
	float: left;
	width: 753px;
	height: 55px;
	line-height: 55px;
	padding: 0 0 0 15px;
	/*color: #0FA3E2;	*/
	color:#135673;
}
#breadcrumb span {
	color: #646466;
}
#breadcrumb a {
	margin: 0 10px 0 0;
	color: #646466;
}
#back_print {
	float: left;
	width: 210px;
	height: 55px;
	line-height: 55px;
}
#back_print a {
	margin: 0 5px 0 5px;
	color: #646466;
}

/* --------------------------------------------- // -------- ColumnContainer */

#columnContainer {
	float: left;
	width: 986px;
	background: url(/grafx/bg_columnContainer.gif) repeat-y top left;
}

/* --------------------------------------------- // -------- colLeft */

#colLeft {
	float: left;
	width: 210px;
}
#menu {
	float: left;
	width: 210px;
	margin: 0 0 75px 0;
}
#menu ul {
	list-style: none;
	padding: 0px;
	margin: 3px 0 0 0;
}
#menu ul ul {
	margin: 0;
}
#menu li {
	list-style: none;
	padding: 0;
	margin: 0;
}
#nav a {
background:transparent url(/grafx/bg_menu_item.gif) no-repeat scroll 0 0;
border:0 none;
color:#9C9D9F;
display:block;
float:left;
letter-spacing:0.1em;
margin:0;
padding:7px 5px 7px 38px;
text-decoration:none;
width:167px;
}
#nav a:hover, #nav li.TrueOpen a {
background:transparent url(/grafx/bg_menu_item_over.gif) no-repeat scroll 0 0;
color:#FFFFFF;
}
#nav li ul {
display:none;
}
#nav li span.opened ul {
display:block;
}
#nav li li a, #nav li.TrueOpen span.opened ul li.False a {
background:#FFFFFF url(/grafx/bg_submenu_item.gif) no-repeat scroll 0 0;
border:0 none;
color:#9C9D9F;
display:block;
float:left;
letter-spacing:0.1em;
margin:0;
padding-left:48px;
text-decoration:none;
width:157px;
}
#nav li.TrueOpen a.TrueOpen, #nav li.TrueOpen a.TrueOpen:Hover {
background:#FFFFFF url(/grafx/bg_submenu_item_over.gif) no-repeat scroll 0 0;
border:0 none;
color:#2D2C2F;
display:block;
float:left;
letter-spacing:0.1em;
margin:0;
padding-left:48px;
text-decoration:none;
width:157px;
}
#nav li.TrueOpen a.FalseOpen {
background:transparent url(/grafx/bg_submenu_item.gif) no-repeat scroll 0 0;
color:#9C9D9F;
}
#nav li.TrueOpen a:hover.FalseOpen{
background:transparent url(/grafx/bg_submenu_item_over.gif) no-repeat scroll 0 0;
color:#2D2C2F;
}
#nav li.TrueOpen span.opened ul li.False a:hover, #nav li.TrueOpen span.opened ul li.True a {
background:transparent url(/grafx/bg_submenu_item_over.gif) no-repeat scroll 0 0;
color:#2D2C2F;
}
#nav li {
cursor:default;
float:left;
margin:0;
padding:0;
}
#nav li li {
border:0 none;
clear:left;
display:block;
float:left;
margin:0;
padding:0;
}
#nav li.footer {
background:transparent url(/grafx/bg_menu_footer.gif) no-repeat scroll 0 0;
float:left;
height:16px;
width:210px;
}
#menuExtra {
padding:20px 0 50px 38px;
}
#menuExtra a {
color:#9C9D9F;
}
/* --------------------------------------------- // -------- colMiddle */

#colMiddle {
	float: left;
	width: 571px;
}
#content {
	float: left;
	width: 695px; /* 571 */
	line-height: 1.4em;
	padding: 15px 40px 30px 32px;
}
#content h1 {
	display: block;
	color:#808080;
	margin: 0 0 20px 0;
}
#content h2 {
	color: #646466;
}
#content h3 {
	color: #646466;
}
#content p {
	margin: 10px 0 10px 0;
}
#content a {
	color: #0FA3E2;
}
#content ul {
	list-style: none;
}
#content li {
	padding: 0 0 0 12px;
	background: url(/grafx/list_style_sub_item.gif) no-repeat 0 8px;
}
/*
#content table tr th {
	padding: 5px 10px 5px 0;
	font-size: 0.9em;
	font-weight:bold;
	vertical-align: top;
}
#content table tr td {
	border-top: solid 1px #CCCCCC;
	padding: 5px 10px 5px 0;
	font-size: 0.9em;
	vertical-align: top;
}
#content table tr td p { margin: 0; }
*/
/* Sitemap */
#content ul#sitemap li {
	margin: 2px 0 2px 0;
}
#content ul#sitemap li a {
	font-weight: bold;
}
#content ul#sitemap li ul li a {
	font-weight: normal;
}
#content ul#sitemap ul {
	margin: 0 0 0 15px;
}

/* List */
#list dt {
	color: #646466;
	font-weight: bold;
}
#list dd.summary {
	color: #646466;
	margin: 3px 0 3px 0;
}
#list dd.link {
	padding: 0 18px 0 0;
}
#list dd.link a{
	display: block;
	width: 95%;
	color: #0FA3E2;
	font-weight: bold;
	padding: 1px 0 10px 22px;
	margin: 0 0 10px 0;
	border-bottom: solid 3px #F1F1F1; 
	background: url(/grafx/arrow_double.gif) no-repeat 2px 5px;
}

/* Paging */
#paging ul {
	list-style: none;
}
#paging ul li {
	float: left;
	background: none;
}
#paging ul li a.active {
	color: #666666;
	font-weight: bold;
	text-decoration: none;
}

/* --------------------------------------------- // -------- colRight */
#colRight {
	float: left;
	width: 205px;
	
}
#colRight dl {
	width: 192px;
	margin: 0 0 10px 0;
	background: url(/grafx/blocks/bg_block_verloop.gif) no-repeat bottom left;
}
#colRight dt {
	width: 192px;
	height:	11px;
	background: url(/grafx/blocks/bg_block_header.gif) no-repeat 0px 0px;
}
#colRight dd.mainTitle {
	color: #646466;
	font-weight: bold;
	font-size: 1.5em;
	margin: 0 0 15px 0;
	padding: 0 18px 0 18px;
}
#colRight dd.title {
	color: #646466;
	font-weight: bold;
	padding: 0 18px 0 18px;
}
#colRight dd.teaser {
	padding: 0 18px 0 18px;
}
#colRight dd.summary {
	color: #646466;
	padding: 0 18px 0 18px;
	margin: 3px 0 3px 0;
}
#colRight dd.link {
	padding: 0 18px 0 18px;
}
#colRight dd.link a{
	display: block;
	width: 90%;
	color: #0FA3E2;
	font-weight: bold;
	padding: 1px 0 10px 22px;
	margin: 0 0 10px 0;
	border-bottom: solid 1px #CCCCCC; 
	background: url(/grafx/arrow_double.gif) no-repeat 2px 5px;
}
#colRight dd.footer {
	width: 192px;
	height:	11px;
	margin: 15px 0 0 0;
	background: #FFFFFF url(/grafx/blocks/bg_block_footer.gif) repeat-y 0px 0px;
}

/* --------------------------------------------- // -------- Footer */

#footer {
	float: left;
	width: 986px;
	height: 45px;
	background: #FFFFFF url(/grafx/bg_footer.jpg) no-repeat 0px 0px;
	text-align:right;
}
/* --------------------------------------------- // -------- .wide
	Als wrapper class="wide" heeft dan wordt rechterkolom niet zichtbaar gezet en middenkolom breder.
 */
 
 .wide #colRight {
 	display: none;
 }
 
 .wide #colMiddle {
	width: 776px; /* 571 + 205 van colRight */
}

.wide #content {
	width: 704px; /* 499 + 205 van colRight */
	padding-left: 11px;
}

/* --------------------------------------------- // -------- Form */
.txtBox 
{
	width:100%;
	border: solid 1px #CCCCCC;
	padding: 0 0 0 3px;
	margin: 0 0 5px 0;
}

.button 
{
	background: #FFFFFF;
	border: solid 2px #CCCCCC;
	padding: 2px;
	margin: 5px 0 10px 0;
	cursor: pointer;	
	font-weight: bold;	
}