
/* webdev: Pim Rijpsma, pim@fabrique.nl */

body{ background: #FFF; margin: 0; padding: 0; font: 68%/1.4em Verdana, Geneva, Arial, Helvetica, sans-serif; color: #000; min-width: 994px; }
* html body { width: 994px; }

img, img a{ border: none; }
a{ text-decoration: none; color: #000; }
a:hover{ text-decoration: underline; color: #91002D; }
p{ padding: 0; margin: 0.2em 0 1.2em 0; }

h1, h2, h3, h4, h5{ color: #91002D; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; }
h1{ font-size: 130%; }
h2{ font-size: 130%; }
h3{ font-size: 110%; }
h4{ font-size: 105%; }
h5{ font-size: 100%; }

/* toolbox */
.center{ margin: auto auto; width: auto; }
.centerdiv{ width: 960px; margin: auto auto; }
.centertxt{ text-align: center; }
.clear{ clear: both !important; display: block; width: 100%; }
.desc{ font-size: 92%; color: #000; font-style: normal; }
.bigger{ font-size: 120%; }
.date{ color: #000; }
.left{ float: left;}
.leftimg{ margin: 4px 8px 8px 0; float: left; }
.lefttxt { text-align: left; }
.padding{ padding: 10px; }
.cont_padding{ padding: 30px; float: left; }
.viewpage .cont_padding{ padding: 30px 30px 30px 30px; float: left; }
.fpadding{ padding: 0 6px 6px 6px; }
.rbox{ margin: 0 0 12px 12px; }
.lbox{ margin: 0 12px 12px 0; }
.paddingtxt{ padding: 0 12px 0 0; }
.right{ float: right; }
.rightimg{ float: right; margin: 4px 0 8px 8px; }
.righttxt{ text-align: right; }
.block{ display: block; }
.wrap{ width: auto; }
.nowrap{ white-space: nowrap }
.hide{ display: none; }
.show {display:block !important;}
.auto{ width: auto; }
.third{ width: 30%;  }
.twothird{ width: 60%;  }
.full{ width: 100% !important; }
.half{ width: 44%; }
.noclear{ clear: none; display: inline; }
.nobgimg{ background-image: none !important; }
.nobg{ background: none !important; }
.georgia{ font-family: georgia, "Times New Roman", Times, serif }
.roman{ list-style: upper-roman;  }
.smallcaps{ font-variant: small-caps; }
.pagebreak{ page-break-before: always !important; display: none; }

ul.index{ list-style: none; margin: 0 0 0 5em; padding: 0; }
ul.index li{ padding: 0.2em 0; position: relative; }
ul.index li a{ display: block; position: relative; }
ul.index span{ width: 4em; margin: -0.1em 0 0 -5em; display: block; position: absolute; }

.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
/*.clearfix { display: inline-block; }*/
html[xmlns] .clearfix { display: block; }
* html .clearfix { height: 1%; }

hr{ border: none; float: left; margin: 0; width: 99%; clear: both; display: block; background: #999999; color: #999999; line-height: 1px; height: 1px; }

a.arrowback{ background: url(../images/nav_arrow_up.gif) 0.4em 0.8em no-repeat; padding-left: 1.4em !important; }
a.arrowdown{ background: url(../images/nav_arrow_down.gif) 0.4em 0.8em no-repeat; padding-left: 1.4em !important; }
a.vergroot{ background: url(../images/icon_vergroot.gif) 0em 0em no-repeat; padding-bottom: 0.2em; padding-left: 1.8em !important; }
a.download{ background: url(../images/icon_download.gif) 0em 0em no-repeat; padding-bottom: 0.2em; padding-left: 1.8em !important; }

.pager{ display: block; clear: both; width: 100%; text-align: center; margin: 0 0 2em 0; }
.pager span{ margin: 0 0 0 2em; }
.pager span a{ text-decoration: underline; }
.pager .next a{ float: right; background: url(../images/icon_next_page.gif) center right no-repeat; padding-right: 1.8em !important;  }
.pager .prev a{ float: left; background: url(../images/icon_prev_page.gif) center left no-repeat; padding-left: 1.8em !important;  }

.pageview{ width: 100px; float: left; margin: 0 10px; padding: 0 0 3em 0; position: relative; }
.pageview div{ float: left; }
.pageview a{ height: 96px; width: 49px; top: 0; position: relative; border: 2px none #F6F5F3; float: left; }
.pageview a:hover{  height: 92px; width: 45px; text-decoration: none; top: 0; position: relative; border: 2px solid #91002D; }
.pageview a span{ cursor: pointer; background: #FFF; width: 100%; text-align: center; position: absolute; bottom: 0; left: 0; }
.pageview a:hover span{ background: #91002D; color: #FFF; text-align: center; width: 100%; position: absolute; bottom: 0; left: 0;}
.pageview .start{ position: relative; left:50px; }

.rondleidingen { margin: 2em 0 0 0; }

.pagescoller{ background: #EDE9E0; margin: 1em 0 0 0; overflow: hidden; }
.pagescoller h5{ background: url(../images/icon_bladeren.gif) #DED6C7 0.4em 0.4em no-repeat; padding-left: 1.8em !important; width: 100%; color: #000; margin: 0;  }
.pagescoller .pager{ display: block; clear: both; width: 100%; text-align: center; margin: 0; }
.pagescoller .pageview{ width: 100px; float: left; margin: 0 5px; padding: 0 0 1em 0; position: relative; }
.pagescoller .pageview a span{ cursor: pointer; background: #F4F2EC; width: 100%; text-align: center; position: absolute; bottom: 0; left: 0; }
.pagescoller .pageview a:hover span{ background: #91002D; color: #F4F2EC; text-align: center; width: 100%; position: absolute; bottom: 0; left: 0;}
.pageview a.selected{  height: 92px; width: 45px; text-decoration: none; top: 0; position: relative; border: 2px solid #91002D; }
.pageview a.selected span{ background: #91002D; color: #FFF; text-align: center; width: 100%; position: absolute; bottom: 0; left: 0;}
.pageview a.selected:hover{  height: 92px; width: 45px; text-decoration: none; top: 0; position: relative; border: 2px solid #B11F4C; }
.pageview a.selected:hover span{ background: #B11F4C; color: #FFF; text-align: center; width: 100%; position: absolute; bottom: 0; left: 0;}

/* de regel .sidetext {width: 500px; height: 800px; overflow: auto; } is toegevoegd om het scrollen van een transcriptie mogelijk te maken binnen de html-versie - Marcel Rijs 25.08.2010*/
.sidetext {width: 500px; height: 800px; overflow: auto; }
.sidetext .line-lead{ position: absolute; margin: -0.05em 0 0 !important; margin-left: -3em; padding: 0; width: 1em; color: #000; font-family: Georgia !important; font-weight: bold; line-height: 104%; text-align: right; text-indent: 0; }
.sidetext .five-lines-lead { font-size: 7.6em; left: -0.7em; }
.sidetext .four-lines-lead{ font-size: 6em; left: -0.55em; }
.sidetext .three-lines-lead{ font-size: 4.4em; left: -0.4em; }
.sidetext .two-lines-lead{ font-size: 2.8em; left: -0.15em; }
.sidetext .one-line-lead{ font-size: 1.4em; left: -0.15em; }

.inpage{ background:#FBFBFA;width:520px !important; }
.viewpage{ background: url(../images/inpage_background.gif) top left repeat-y; }

.sidetext{ position: relative; max-width: 45%; }
* html .sidetext{ width: 400px; }
.sidetext .hrline{ padding: 1.2em 0; }
* html .sidetext .hrline{ padding: 1.2em 0 0 0; }
.sidetext .whiteline{ padding: 0 0 1.2em 0; }
.sidetext .line{ position: relative; padding: 0 0 0 7em; }
.sidetext .linenr{ position: absolute; left: 4em; display: block; color: #999999; }
.sidetext .note{ text-align: right; width: 6.75em; position: absolute; margin-left: -7em; display: block; color: #000; }
.sidetext .indent, .sidetext .indent2 { display: block; position: relative; text-indent: 3em; }
.sidetext .chap{ display: block; color: #999; font-size: 110%; margin: 0.75em 0 0.75em 6.5em; line-height: 140%; }
.sidetext .column { width: auto; color: #999; font-size: 110%; font-weight: bold; margin-top: 0.25em; }
.sidetext .title { color: #999; font-size: 110%; margin: 0.75em 0 0.75em 6.5em; line-height: 140%; }
.sidetext .audio { margin: 0.75em 0 0.75em 6.5em; }
.sidetext .audio a { padding: 0 0 0 15px; background: url(../images/icon_audio.gif) no-repeat; font-weight: bold; color: #91000D; }
.sidetext img { padding: 0 0 0.75em 0; }
.sidetext hr{  border: none; width: 99%; clear: both; display: block; background: #999999; color: #999999; line-height: 1px; height: 1px; float: left; }

#framework{ width: 100%; overflow: hidden; position: relative; }
#framework .container{ width: 95%; margin: auto auto; background: #F6F5F3; }
#header{ background: url(../images/header_backdots.gif) #FFF repeat-x; height: 50px; }
#navigation{ background: #E0D8C6; width: 100%; float: left; height: auto; }
#nav{ width: 95%; margin: auto auto; background: #91002D; color: #FFF; }
#nav a{ color: #FFF; }
#nav ul{ list-style: none; margin: 0; padding: 0; }
#nav ul li { display: inline; }
#nav ul li a{ padding: 0.2em 1em 0.2em 0.2em; float: left;}
