/* CSS Document */

body{
background-color: #39d7fe;
margin: 0;
text-align: center;
font-family: "Trebuchet MS", verdana, arial, helvetica, sans-serif; color: #000;
font-size: 75%; /* = 12px */
}

div#main_container{
margin: 0 auto 0 auto;
width: 770px;
text-align: left;
}

/* KOP VAN DE SITE */

div#box1{
background: url(pix/header.gif) no-repeat 0 0;
width: 100%;
height: 130px;
}

/* DIT IS HET NAVIGATIEDEEL */

div#imagemap{
background: url(pix/menurood.gif) no-repeat 0 0;
float: left;
width: 270px;
height: 770px;
padding:0;
}

ul.navlist{
list-style: none;
margin-top:110px;
.margin-top: 110px; /* only IE7 */
_margin-top: 110px; /* IE6 */
margin-left: 31px; /* Firefox, and every other non-IE browser */
.margin-left: 71px; /* only IE7 */
_margin-left: 70px; /* IE6 */
} 

/* KNOP 1 */

li.nav1 {
height: 35px;
width: 120px;
padding:0;
border:0;
}

li.nav1 a, li.nav1 a:link, li.nav1 a:visited {
display:block;
}

li.nav1 img {
height:35px;
width:120px;
margin-top:20px;
border:0;
}

li.nav1 a:hover img {
visibility:hidden;
}

/* KNOP 2 */

li.nav2 {
height: 35px;
width: 135px;
margin-top:24px;
.margin-top:19px; /* only IE7 */
_margin-top:0px; /* IE6 */
margin-left:1px;
padding:0;
border:0;
}

li.nav2 a, li.nav2 a:link, li.nav2 a:visited {
display:block;
}

li.nav2 img {
height:35px;
width:135px;
border:0;
}

li.nav2 a:hover img {
visibility:hidden;
}

/* KNOP 3 */

li.nav3 {
height: 35px;
width: 120px;
margin-top:3px;
.margin-top:-2px; /* only IE7 */
_margin-top:0px; /* IE6 */
margin-left:2px;
padding:0;
border:0;
}

li.nav3 a, li.nav3 a:link, li.nav3 a:visited {
display:block;
}

li.nav3 img {
height:35px;
width:120px;
border:0;
}

li.nav3 a:hover img {
visibility:hidden;
}

/* KNOP 4 */

li.nav4 {
height: 35px;
width: 120px;
margin-top:2px;
.margin-top:-3px; /* only IE7 */
_margin-top:0px; /* IE6 */
margin-left:0px;
padding:0;
border:0;
}

li.nav4 a, li.nav4 a:link, li.nav4 a:visited {
display:block;
}

li.nav4 img {
height:35px;
width:120px;
border:0;
}

li.nav4 a:hover img {
visibility:hidden;
}

/* KNOP 5 */

li.nav5 {
height: 35px;
width: 120px;
margin-top:5px;
.margin-top:0px; /* only IE7 */
_margin-top:0px; /* IE6 */
margin-left:0px;
padding:0;
border:0;
}

li.nav5 a, li.nav5 a:link, li.nav5 a:visited {
display:block;
}

li.nav5 img {
height:35px;
width:120px;
border:0;
}

li.nav5 a:hover img {
visibility:hidden;
}

/* KNOP 6 */

li.nav6 {
height: 35px;
width: 120px;
margin-top:3px;
.margin-top:-2px; /* only IE7 */
_margin-top:0px; /* IE6 */
margin-left:0px;
padding:0;
border:0;
}

li.nav6 a, li.nav6 a:link, li.nav6 a:visited {
display:block;
}

li.nav6 img {
height:35px;
width:120px;
border:0;
}

li.nav6 a:hover img {
visibility:hidden;
}

/* KNOP 7 */

li.nav7 {
height: 35px;
width: 120px;
margin-top:3px;
.margin-top:-2px; /* only IE7 */
_margin-top:0px; /* IE6 */
margin-left:0px;
padding:0;
border:0;
}

li.nav7 a, li.nav6 a:link, li.nav7 a:visited {
display:block;
}

li.nav7 img {
height:35px;
width:120px;
border:0;
}

li.nav7 a:hover img {
visibility:hidden;
}

/* KNOP 8 */

li.nav8 {
height: 35px;
width: 120px;
margin-top:3px;
.margin-top:-2px; /* only IE7 */
_margin-top:0px; /* IE6 */
margin-left:0px;
padding:0;
border:0;
}

li.nav8 a, li.nav8 a:link, li.nav8 a:visited {
display:block;
}

li.nav8 img {
height:35px;
width:120px;
border:0;
}

li.nav8 a:hover img {
visibility:hidden;
}


/* TEKSTGEDEELTE */

div#box3a{
background: url(pix/body01.gif) no-repeat 0 0;
float: left;
width: 500px;
height: 770px;
}

div#box3{
background: url(pix/body02.gif) no-repeat 0 0;
float: left;
width: 500px;
height: 770px;
}

.tekst{
margin: 0 70px 16px 20px;
}

h1{
margin: 85px 70px 14px 20px;
font-size: 125%;
}

h2{
margin: 16px 60px 14px 20px;
font-size: 110%;
}

.ondertitel{
margin: 10px 70px 16px 20px;
font-style:italic;

}

ul.lijstje{
margin: 0 70px 16px 20px;
font-weight:bold;
}


/* BUITEN DE BLAUWE LIJN */

div#box4{
clear:left;
width: 100%;
height: 50px;
} 

#w3c{
float:left;
border:0;
}

#copyright{
float:right;
}

/* DIT IS DE STIJLCODE VAN DE TEST */

div,span,td{
	color: #000000;
}

div.Titles{
	padding: 0.5em;
	text-align: left;
	color: #000;
}

button{
	display: inline;
	font-size: 100%; /* Required to make IE scale button caption text size! */
}

.ExerciseTitle{
	font-size: 125%;
	color: #000;
	margin-top: 85px;
}

div#Timer{
	padding: 0.3em;
	margin-left: 20px;
	margin-right: auto;
	text-align: left;
}

span#TimerText{
	padding: 0.3em;
	border-width: 1px;
	border-style: solid;
	font-weight: bold;
	display: none;
}

div.ControlButtons{
	text-align: left;
	margin-left: 15px;
}

.Instructions{
	margin-top: 1em;
}

.DecisionPointTitle{
	text-align: left;
	margin-left: 15px;
}

.DecisionPointText{
	text-align: left;
	margin: auto auto auto 0px;
}

td#AssetDisplay{
	display: none;
}

div.Assets{
	margin: 0px;
}

table.AssetTable{
	border-width: 3px;
	border-style: double;
	border-color: #000;
	padding: 0.3em;
}

table.AssetTable th{
	background-color: #000;
	color: #ffffff;
	padding: 0.3em;
}

div.LinkList{
	margin-top: 10px;
}

table.LinkTable{
	margin-left: 0;
	margin-right: auto;
	text-align: left;
}

.FeedbackText{
	color: #000000;
}

table.DPTable{
	margin-left: 0;
	margin-right: auto;
	border-width: 0px;
	padding: 10px;
	vertical-align: top;
}

div.Feedback {
	background-color: #ffffff;
	left: 33%;
	width: 34%;
	top: 33%;
	z-index: 1;
	border-style: solid;
	border-width: 1px;
	padding: 5px;
	text-align: left;
	color: #000000;
	position: absolute;
	display: none;
}

div.DecisionPoint{
	background-color: #ffffff;
	text-align: left;
	color: #000;
	padding: 0.5em;
	border-style: solid;
	border-width: 1px 1px 1px 1px;
	border-color: #ffffff;
	margin: 1px 50px 1px 1px;
}

.FuncButton {
	text-align: left;
	border-style: solid;

	border-left-color: #d6ffff;
	border-top-color: #d6ffff;
	border-right-color: #577f7f;
	border-bottom-color: #577f7f;
	color: #000;
	background-color: #ffffff;

	border-width: 2px;
	padding: 3px 6px 3px 6px;
	cursor: pointer;
}

.FuncButtonUp {
	color: #ffffff;
	text-align: left;
	border-style: solid;

	border-left-color: #d6ffff;
	border-top-color: #d6ffff;
	border-right-color: #577f7f;
	border-bottom-color: #577f7f;

	background-color: #000;
	color: #ffffff;
	border-width: 2px;
	padding: 3px 6px 3px 6px;
	cursor: pointer;
}

.FuncButtonDown {
	color: #ffffff;
	text-align: left;
	border-style: solid;

	border-left-color: #577f7f;
	border-top-color: #577f7f;
	border-right-color: #d6ffff;
	border-bottom-color: #d6ffff;
	background-color: #000;
	color: #ffffff;

	border-width: 2px;
	padding: 3px 6px 3px 6px;
	cursor: pointer;
}

/*BeginNavBarStyle*/

div.NavButtonBar{
	background-color: #999999;
	text-align: left;
	margin: 2px 0px 2px 0px;
	clear: both;
}

.NavButton {
	border-style: solid;
	
	border-left-color: #cccccc;
	border-top-color: #cccccc;
	border-right-color: #4c4c4c;
	border-bottom-color: #4c4c4c;
	background-color: #999999;
	color: #000;

	border-width: 2px;
	cursor: pointer;	
}

.NavButtonUp {
	border-style: solid;

	border-left-color: #cccccc;
	border-top-color: #cccccc;
	border-right-color: #4c4c4c;
	border-bottom-color: #4c4c4c;
	color: #999999;
	background-color: #000;

	border-width: 2px;
	cursor: pointer;	
}

.NavButtonDown {
	border-style: solid;

	border-left-color: #4c4c4c;
	border-top-color: #4c4c4c;
	border-right-color: #cccccc;
	border-bottom-color: #cccccc;
	color: #999999;
	background-color: #000;

	border-width: 2px;
	cursor: pointer;	
}

a{
	color: #0000cc;
}

a:visited{
	color: #0000ff;
}

a:hover{
	color: #0000cc;
}