/*
  versie 4.1 balk nav final
*/



html { min-height: 100%; margin-bottom: 1px; }
body { margin: 0; font-size: 76%; font-family: Arial; background: #fff; color: #5d5d5d }


#container { width: 81.2em; height: auto; padding-top: 0; margin: 1em auto; background: white; border: 0.05em solid #fff; }

#header { width: auto; height: 24em;}

#h_top { height: 21.8em; }

#img_logo { width: 60em; height: 6.6em; }

#user { float: right;}


#navi ul { float: left; width: 100%; margin: -3px 0 0 0; padding: 0; list-style: none; background: #35405C; }
#navi li { float: left; margin-right: 0.2em; margin-top: 0.3em; padding: 0em; background: #35405C; }
#navi a { display: block; background:#35405C; padding: 0.5em 1em; color: white;  text-decoration: none; font-weight: bold}
#navi a:hover { text-decoration: underline;}
#navi li#current { background-image: #FFFFFF; }
#navi li#current a { background: #FFFFFF; color: #35405C; }
#navi li#current a:hover { text-decoration: none; }
/* MAC */
#header a { float: none; }
/* IE5-MAC */

#subnav { float: left; width: 100%;  margin: 0; padding: 0; list-style: none; background: white; padding: 0.6em 0 }
#subnav span a {color: blue}
#subnav span a:HOVER {text-decoration: none; color: blue}
#footer { margin: 1.3em 0; width: 100%; text-align: center; font-size: 0.9em; display: block; line-height: 2em; }

a { color: blue; text-decoration: none;}
p a:HOVER { color: blue; text-decoration: underline}
td a:HOVER { color: blue; text-decoration: underline}
td a {font-size: 80%}
td b {font-size: 80%}



h1,h2,h3,h4,h5 { margin: 0 0 0.5em 0; text-align: justify; font-weight: bold}
h2,h3,h4,h2 a, #subnav a, legend { color: #35405C; text-decoration: none; }
p {font-size: 95%; line-height: 1.5em;}

#content h1 { font-size: 1.4em; color: #35405C}
#content h2 { font-size: 1.3em; }
#content h3 { font-size: 1.2em; }
#content h4 { font-size: 1em; }

#navi_options { margin: 0 20.5em 0 0; }
#navi_options.signedin { margin: 0; width: 43%; }
#navi_options p { padding: 0 0 0 0.8em }
#navi_options .box { margin: 0 0 0.8em 0; border-color: #35405C; border-style: solid; border-width: 0 0 0 0.2em; background: url(/css/behind_box.png) bottom right no-repeat; }
#navi_options .box h2, #navi_options .box_inactive h2 { margin: 0.3em 0 0.3em 0.6em; }
#navi_options .box p, #navi_options .box_inactive p { margin: 0.3em 0 0.3em 1em; padding: 0 0 1em 0; }
#navi_options .box_inactive { margin: 0 0 0.8em 0; color: #fff; border-color: #fff; border-style: solid; border-width: 0 0 0 0.2em; background: url(behind_box.png) bottom right no-repeat; }
#navi_options .box_inactive a { color: #fff; text-decoration: none; }

#toolboxesLeft {float: right;}
.tool_box { padding: 0.5em; margin: 0; width: 18em; border: 0.06em solid #fff; background-color: #B7C6FF; text-align: right;  }
.tool_box a { font-size: 0.8em; }
.tool_box p { text-align: left; font-weight: bold; }
.tool_box dl { margin: 0 0 0.5em 0; padding: 0; width: 100%; }
.tool_box dt { float: left; margin: 0; padding: 0; width: 45%; text-align: right; }
.tool_box dd { margin: 0; }
.tool_box label { padding: 0.3em 0; }
.tool_box input.text { width: 105px; font-size: 1.3em; margin: 0.1em 0; }
.tool_box input.button { font-size: 1.1em; }

#home_progress { float: right; margin: 0; width: 55%; }

a.button { color: #636363; font-size: 0.9em; margin: 0 0 0 0.2em; text-decoration: none; background: white; font-weight: bold; padding: 0.3em 0.4em; border-width: 0 0.05em 0.05em 0; border-style: solid; border-color: #fff; }

#pageHelpText { margin-bottom: 0.5em }

#myCourses .active .block { padding: 0.8em 0.8em 0 0.8em; border: 0.01em solid #fff; margin: 0.4em 0 1em 0; }
#myCourses .active .block h3 { margin: 0 0 1.3em 0; }
#myCourses .active .block h4 { margin: 0 0 1em 0; }
#myCourses .active .block span.right { float: right; text-align: right; }
#myCourses .active .block span.right strong { font-size: 0.8em; color: #999999; }
#myCourses .active .block #voortgang { height: 5em; }
#myCourses .active .block #voortgang p.link { text-align: right; }
#myCourses .active .block #left { width: 49%; float: left; margin: 0 1em 0 0; }
#myCourses .active .block #right { width: 49%; float: left; }

#myCourses dl.inactive { list-style: none; margin: 0; padding: 0; }
#myCourses dl.inactive dt { height: 1.53em; padding: 0.4em 0.6em; margin: 0.16em 0; color: #636363; border-width: 0 0 0 0.15em; border-style: solid; border-color: #fff; background: url(/css/behind_dt.png) repeat-y; }
#myCourses dl.inactive dt span { float: right; height: 1.55em}

.progress .bar { width: 100%; height: 1.5em; text-align: right; background: url(/css/progressbar.png); }
.progress .bar img { float: right; height: 100%; }
.progress .bar p { margin: 0; padding: 0.1em 0 0 0; color: white; font-weight: bold; font-size: 0.9em; }
.progress .bar_empty { width: 100%; height: 1.5em; text-align: right; background: url(/css/progressbar_back.png);}
.progress .bar_empty img { float: right; height: 100%; }
.progress .bar_empty p { margin: 0; padding: 0.1em 0 0 0; color: black; font-weight: bold; font-size: 0.9em; }
.progress .title { font-size: 0.9em; padding: 0.2em 0.4em; position: relative; color: #636363; font-weight: bold; background: rgb(245,245,245); border-width: 0 0.05em 0 0; border-color: #fff; border-style: solid; }

#cursus_onderdelen #left { width: 70%; margin: 0 1.6em 0 0; float: left; }
#cursus_onderdelen #right { width: 27%; float: left; }
#cursus_onderdelen #left .block  h4 { margin: 0.5em 0; }
#cursus_onderdelen #right .block  { margin: 0 0 1em 0; }
#cursus_onderdelen #right .block ol {list-style-type: square; padding-left:-1em; padding-bottom: 1em; line-height: 1.5em;}
#cursus_onderdelen #right .block li {margin-left: -1em}
#cursus_onderdelen #right .block ol li span {font-weight: bold}

#cursus_onderdelen .block  { margin: 0 0 1em 0; padding: 0; border-color: #35405C; border-style: solid; border-width: 0 0 0 0.2em; background: url(/css//behind_box_high.png) bottom right no-repeat; }
#cursus_onderdelen .block dl, #cursus_onderdelen .block h3, #cursus_onderdelen .block h4 { padding: 0 0.8em; }
#cursus_onderdelen .block img.graph { padding: 0.3em 0.8em 0 0.8em; }
#cursus_onderdelen .block a p  { text-decoration: underline; }
#cursus_onderdelen .block p  { padding: 0.1em 0.8em 1em 0.8em; }
#cursus_onderdelen .block dl { margin: 0 0.3em 0 0.8em; padding: 0.3em 0; }
#cursus_onderdelen .block dl dt { height: 1.53em; padding: 0.4em 0.6em; margin: 0.16em 0; border-width: 0 0 0 0.15em; border-style: solid; border-color: #d2d2d2; background: url(/css/behind_dt.png) repeat-y; }
#cursus_onderdelen .block dl dt.enabled { border-color: #8ecd0b; font-weight: bold; }
#cursus_onderdelen .block dl dt span { float: right; height: 1.53em; }
#cursus_onderdelen .block .bottom { width: auto; height: 0.3em; font-size: 0.4em; }

form div.formBox {border: 0.05em #fff solid; padding: 1em; margin-top: 1em}
form div.formBox div { display: block; clear: both; padding-top: 1em }
form div.formBox div label, form div.formBox div.checkBox { width: 10em; float: left; text-align: right; font-weight: bold; margin-right: 0.5em}
form div.formBox div input { width: 15em }
div.formButtons {margin-top: 1em}

.myTable, .myFilledTable {width: 100%; font-size: 110%;}
.myTable {border: 1px #fff solid}
.myTable tr.header, myFilledTable tr.header {background: url('/logos/gradienttest.png'); font-size: 12px; border: 1px #fff solid}
.myTable2 tr.header2 {background: white; border-bottom: 1px red solid;}
.myTable2, .myTable2 tr.header2 {border: 1px #fff solid;  width: 100%}
.myFilledTable tr.subHeader {background: white; font-size: 12px;}
.myFilledTable tr.even {background: white;}
table.myTable tr.header td b{font-size: 100%}
/*
form { margin: 0; padding: 0; }
form div { border: 0.05em solid #fff; margin: 1em 0; padding: 0.8em 0.8em 0.5em 0.8em; background: white; }
form div input { margin: 0.5em 0; }
form div input.checkbox { margin: 0 0.5em 0 0; padding: 0; float: left; }
form div label { display: block; font-weight: bold; }
form div span { font-size: 0.9em; color: #636363; line-height: 0.1em; }
*/

div#displayTopicContent, div#displayPartNavi {border: 0.05em #fff solid}
div#displayTopicContent div#header, div#displayPartNavi div#header {background: #fff; font-weight: bold}
form div.partNaviSelected {background: white}
form div.partNavi span.unselected {line-height: 1em}
form div.partNavi span.selected {background: black; line-height: 1em}

/* exercise and status style 3.0 */
DIV#sendEssay, DIV.essayItem, DIV.itemDiv { display: none; width: 640px; z-index: 0 }
SPAN.correct { font-size: 20px; color: green; }
SPAN.incorrect { font-size: 20px; color: red; }
SPAN.unscored { font-size: 20px; color: blue; }
SPAN.notdone { font-size: 20px; color: yellow; }
hr.answer { color: #008800; }
hr.feedback { color: #008800; }
.statusHeader {	font-style: italic; }
.correctOption { font-weight: bold; }
.wrongOption { color: #BBBBBB; }
table.status { border: 1px solid #008800; }
td.correct { background-color: green; }
td.incorrect { background-color: red; }
td.unscored { background-color: blue; }
td.notdone { background-color: yellow; }
A.number { text-decoration: none; }