* {
padding: 0;
margin: 0;
line-height: 1.3em;
}

html, body {
height: 100%; background: #3399FF; font-family: Arial, sans-serif; color: #227ad2; margin: 0;
}

#card {
background: url(shadow.gif) white; 
background-repeat: repeat-y; 
/* width: 130px; voor display mode */ 
width: 162px; 
height: 590px; 
text-align: left; 
padding: 5px; 
padding-left: 10px; 
padding-right: 8px; 
font-size: 80%; 
border: 1px solid #6289b1; 
border-left: 0; 
border-top: 1px solid #9fcee7;
}

#tools {
width: 60px; 
height: 597px; 
text-align: left; 
padding-right: 7px; 
padding-top: 3px; 
font-size: 65%; 
vertical-align: top; 
text-align: right;
}

img {
display:block;
}

#image_holder {
background: white; 
border-bottom: 1px solid #227ad2; 
border-right: 1px solid #999999; 
border-top: 1px solid #9fcee7; 
border-left: 1px solid #9fcee7;
width: 437px;
height: 600px;
}

#image {
display: inline;
border: 0;
width: 437px;
font-size: 80%;
}

#image_holder #animation object {margin-bottom: 0px;} 
html>/**/body #image_holder #animation object {margin-bottom: -5px;} /*hack for NON-IE, doesn't work for opera*/

#tools a {
color: #9fcee7; 
text-decoration: none; 
display: block;
}
#tools a#JHS {
color: #227ad2;
}
#tools {width: 60px; text-align: left; padding-right: 7px; padding-top: 3px; font-size: 65%; vertical-align: top; text-align: right;}
#tools a {color: #9fcee7; text-decoration: none; display: block;}
#tools a:hover {color: white}

a {color: #227ad2;}
a:hover {text-decoration: none;}

#pop {
font-size: 80%; 
border: 1px solid #999999;
border-top: 1px solid white;
width: 500px;
background: white;
text-align: left;
border-left: 1px solid white;
}
#popcontent {
padding-left: 50px;
padding-right: 50px;
}

#popshadow {
font-size: 80%; 
position: relative;
left: 0.4em;
top: 0.6em;
padding-left: 50px;
padding-right: 50px;
border: 1px solid black;
width: 400px;
background: black;
filter: alpha(opacity=30);
-moz-opacity: .3;
opacity: .3;
}

#overlay1 {
width: 100%; 
height: 100%; 
position: absolute; 
top: 0; 
left: 0; 
}

#overlay2 {
width: 100%; 
height: 100%; 
position: absolute; 
top: 0; 
left: 0; 
}

td {text-align: center;}

.vraag {
color: gray;
}

.vraag a {
text-decoration: none;
color: gray;
}

.antwoord {
color: black;
visibility: hidden; 
position: absolute; 
width: 370px;
border: 1px solid black; 
padding: 2px;
padding-left: 7px;
padding-bottom: 5px;
padding-right: 10px;
background: lightyellow; 
font-size: 95%;
}

#sluiten {
margin-left: 420px;
margin-top: 10px;
width: 130px;
padding: 3px;
padding-top: 1px;
text-align: center;
}

#titelbalk {
font-size: 95%;
width: 490px;
color: silver;
padding-left: 5px;
padding-right: 5px;
text-align: right;
}

em {
font-size: 150%;
font-style: normal;
}

textarea {
border: 1px solid gray;
width: 160px;
height: 300px;
font-family: Arial, sans-serif; color: #227ad2; 
font-size: 100%; 
overflow-y: scroll;
}

input {
border: 1px solid gray;
background: silver;
margin-top: 4px;
width: 162px;
}

#result_field {
background: white;
border-color: silver;
color: #227ad2;
}