1. minor changes to CSS

2. arrows added to walkthrough navigation
3. added new files to the list of sources
4. extra div-s added to metasytnax for the sake of validity
5. hyperlink added to the reference index page
6. changed the note about fastcgi being the only supported inface
7. flushing added to calendar for a bit of performance analysis.

7 files changed, 131 insertions, 90 deletions

diff --git a/htdocs/ancestry/layout.chtml b/htdocs/ancestry/layout.chtml
index df34ad7..4551d04 100644
--- a/htdocs/ancestry/layout.chtml
+++ b/htdocs/ancestry/layout.chtml
@@ -1,69 +1,69 @@
 % html(); return; /* vim:set ft=sitecing: */
 %%derive page = "/ancestry/page.chtml";
 <%decl>
  #define PN_PREV(h,d,t) urlPrev=h; descPrev=d; titlePrev=t;
  #define PN_NEXT(h,d,t) urlNext=h; descNext=d; titleNext=t;
 </%decl>
 %%impl #include <sitecing/util.h>
 %%impl #include "acconfig.h"
 %%var bool b_svn = false;
 %%var std::string urlPrev;
 %%var std::string descPrev;
 %%var std::string titlePrev;
 %%var std::string urlNext;
 %%var std::string descNext;
 %%var std::string titleNext;
 <%constructor>
  if(strstr(PACKAGE_STRING,"svn"))
   b_svn = true;
 </%constructor>
 <%method void prevnext() %>
 % if(urlPrev.empty() && urlNext.empty()) return;
 % if(descPrev.empty() && descNext.empty()) return;
  <div class="prevnext">
 % if(!(urlPrev.empty() || descPrev.empty())) {
-   <a class="prevnext-prev" href="<% urlPrev %>" title="<% sitecing::html_escape(titlePrev.empty()?descPrev:titlePrev) %>"><% sitecing::html_escape(descPrev) %></a>
+   <a class="prevnext-prev" href="<% urlPrev %>" title="<% sitecing::html_escape(titlePrev.empty()?descPrev:titlePrev) %>">&#9668;&nbsp;&nbsp;<% sitecing::html_escape(descPrev) %></a>
 % }
 % if(!(urlNext.empty() || descNext.empty())) {
-   <a class="prevnext-next" href="<% urlNext %>" title="<% sitecing::html_escape(titleNext.empty()?descNext:titleNext) %>"><% sitecing::html_escape(descNext) %></a>
+   <a class="prevnext-next" href="<% urlNext %>" title="<% sitecing::html_escape(titleNext.empty()?descNext:titleNext) %>"><% sitecing::html_escape(descNext) %>&nbsp;&nbsp;&#9658;</a>
 % }
  </div>
 </%method>
 <%method void body() %>
  <div id="content">
   <%code>
    if(!access(WEB_RUN_ROOT "/conf/banner_top",R_OK)) {
     pass_file_through(WEB_RUN_ROOT "/conf/banner_top");
    }
    prevnext();
    content();
    if(b_strict && !access(WEB_RUN_ROOT "/conf/banner_bottom",R_OK)) {
     pass_file_through(WEB_RUN_ROOT "/conf/banner_bottom");
    }
   </%code>
  </div>
  <div id="sidepanel">
 % sidepanel();
  </div>
 </%method>
 <%method void content() %>
 </%method>
 <%method void sidepanel() %>
  <h1><% PACKAGE_STRING %></h1>
 % if(b_svn) {
    <h2>The site is running source from the source repository which may differ
    from the one available for download. You can check it out from the <a
    href="http://kin.klever.net/sitecing/repository">source repository</a>.</h2>
 % }
 % /* thank MSIE for this awful formatting */
  <ul><li><a href="/" title="introduction to site-C-ing">overview</a><ul><li><a href="/simple" title="building a really simple page">simple page</a></li></ul></li><li><a href="/exceptions/" title="exceptions handling">exceptions</a><ul><li><a href="/exceptions/preprocess" title="preprocessor errors">preprocess</a></li><li><a href="/exceptions/compile" title="compiler errors">compile-time</a></li><li><a href="/exceptions/runtime" title="runtime exceptions">runtime</a></li></ul></li><li><a href="/quickref/" title="quick reference">reference</a><ul><li><a href="/quickref/metasyntax" title="meta syntax">syntax</a></li></ul></li><li><a href="/sources" title="browse this site source files">sources</a></li></ul>
   <%code>
    if(!access(WEB_RUN_ROOT "/conf/banner_side",R_OK)) {
     pass_file_through(WEB_RUN_ROOT "/conf/banner_side");
    }
   </%code>
  <ul><li><a href="http://kin.klever.net/sitecing/" title="main site-C-ing page">site-C-ing</a></li><li><a href="http://kin.klever.net/sitecing/sources" title="site-C-ing download page">downloads</a></li></ul>
  <div class="copyright">
   &copy; <a href="http://www.klever.net/">Klever Group</a>
  </div>
 </%method>
diff --git a/htdocs/ancestry/sources.chtml b/htdocs/ancestry/sources.chtml
index 35ced64..1d9fcc9 100644
--- a/htdocs/ancestry/sources.chtml
+++ b/htdocs/ancestry/sources.chtml
@@ -1,78 +1,82 @@
 <%decl>
  typedef struct {
   const char *dir;
   const char *name;
   const char *desc;
  } sourcefile_t;
  extern sourcefile_t source_files[];
  extern int source_files_count;
 </%decl>
 <%impl>
  sourcefile_t source_files[] = {
   { "", 0, "the root" },
    { "", "configure.ac", "main configuration file" },
    { "", "acinclude.m4", "autoconf macros" },
    { "", "autogen.sh", "shell script for building out of source repository" },
    { "", "Makefile.am", "automake makefile template" },
    { "", "NEWS.xml", "news since the last release (if any)" },
    { "", "NEWS.xsl", "the styleshhet to make a plaintext version of NEWS.xml" },
    { "", "COPYING", "copyright notice" },
    { "", "AUTHORS", "Klever dissected" },
   { 0, 0, 0 },
   { "bin", 0, "various scripts" },
    { "bin", "build.in", "the template of the script used to precompile the code" },
    { "bin", "run.in", "the template of the script used to start fastcgi server" },
   { 0, 0, 0 },
   { "conf", 0, "configuration files" },
    { "conf", "dudki.conf.in", "the template for the dudki daemon configuration file" },
    { "conf", "httpd.conf.in", "the template for the apache configuration" },
    { "conf", "sitecing.conf.in", "the template for the site-C-ing configuration" },
   { 0, 0, 0 },
   { "htdocs", 0, "the source files" },
    { "htdocs", ".htaccess", "apache access-control file" },
    { "htdocs", "index.chtml", "the introduction" },
    { "htdocs", "sources.chtml", "the source browser" },
    { "htdocs", "style.css", "the CSS style sheet" },
    { "htdocs", "view.chtml", "the source viewer" },
    { "htdocs/examples", 0, "examples" },
     { "htdocs/examples", "calendar.chtml", "really simple page" },
    { 0,0,0 },
    { "htdocs/exceptions", 0, "exceptions handling overview" },
     { "htdocs/exceptions", "index.chtml", "the overview" },
     { "htdocs/exceptions", "preprocess.chtml", "preprocessor exceptions" },
     { "htdocs/exceptions", "compile.chtml", "compile-time exceptions" },
     { "htdocs/exceptions", "runtime.chtml", "runtime exceptions" },
     { "htdocs/exceptions/development", 0, "development-mode exceptions samples" },
      { "htdocs/exceptions/development", ".htaccess", "apache access control file" },
      { "htdocs/exceptions/development", ".scrc", "site-C-ing local configuration" },
      { "htdocs/exceptions/development", "preprocess.chtml", "the file that can not be preprocessed" },
      { "htdocs/exceptions/development", "runtime.chtml", "exception thrown at runtime" },
      { "htdocs/exceptions/development", "compile.chtml", "the file that can not be compiled" },
      { "htdocs/exceptions/development", "erroneous.h", "the file to include for more errors" },
      { "htdocs/exceptions/development", "compile.html", "compile-time exception handler output" },
     { 0,0,0 },
     { "htdocs/exceptions/production", 0, "production-mode exceptions samples" },
      { "htdocs/exceptions/production", ".htaccess", "apache access control file" },
      { "htdocs/exceptions/production", ".scrc", "site-C-ing local configuration" },
      { "htdocs/exceptions/production", "preprocess.chtml", "the file that can not be preprocessed" },
      { "htdocs/exceptions/production", "runtime.chtml", "exception thrown at runtime" },
      { "htdocs/exceptions/production", "compile.chtml", "the file that can not be compiled" },
      { "htdocs/exceptions/production", "erroneous.h", "the file to include for more errors" },
      { "htdocs/exceptions/production", "compile.html", "compile-time exception handler output" },
     { 0,0,0 },
+    { "htdocs/quickref", 0, "reference documentation" },
+     { "htdocs/quickref", "index.chtml", "the overview" },
+     { "htdocs/quickref", "metasyntax.chtml", "component meta syntax quick reference" },
+    { 0,0,0 },
    { 0,0,0 },
    { "htdocs/handlers", 0, "exception handlers" },
     { "htdocs/handlers", ".htaccess", "apache access-control file" },
     { "htdocs/handlers", "exception_dev", "development mode exception handler" },
     { "htdocs/handlers", "exception_prod", "production mode exception handler" },
    { 0,0,0 },
    { "htdocs/ancestry", 0, "base components to build the rest upon" },
     { "htdocs/ancestry", ".htaccess", "apache access control file" },
     { "htdocs/ancestry", "page.chtml", "the xhtml skeleton" },
     { "htdocs/ancestry", "layout.chtml", "the layout for the most pages" },
     { "htdocs/ancestry", "sources.chtml", "the list of files for source browser" },
    { 0,0,0 },
   { 0,0,0 }
  };
  int source_files_count = sizeof(source_files)/sizeof(*source_files);
 </%impl>
diff --git a/htdocs/examples/calendar.chtml b/htdocs/examples/calendar.chtml
index eea20cb..85aa7ba 100644
--- a/htdocs/examples/calendar.chtml
+++ b/htdocs/examples/calendar.chtml
@@ -1,101 +1,102 @@
 <%impl>
  /* vim:set ft=sitecing: */
  #include <time.h>
  #include <konforka/exception.h>
 </%impl>
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+% __SCIF->flush();
 <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
  <head>
   <title>really simple page</title>
   <style type="text/css">
    table.calendar {
     font-family: monospace;
    }
    table.calendar th.heading {
     border: double blue 3px;
    }
    table.calendar td {
     text-align: right;
     margin: 0.5ex; padding: 2px;
     border: solid 1px black;
    }
    table.calendar .wd-0, table.calendar .wd-6 {
     color: red;
    }
    table.calendar td.unexistant {
     border: none;
    }
    table.calendar td.today {
     background: #ffffc0;
     color: blue;
     font-weight: bold;
    }
   </style>
  </head>
  <body>
 % /* Just call the calendar member function */
 % calendar();
  </body>
 </html>
 <%method void calendar() %>
  <%code>
   time_t tt = time(0);
   struct tm t;
   if(!localtime_r(&tt,&t))
    throw konforka::exception(CODEPOINT,"couldn't fetch current date");
   char h[16];
   if(strftime(h,sizeof(h),"%B, %Y",&t)>=sizeof(h))
    throw konforka::exception(CODEPOINT,"couldn't produce heading for the calendar");
   int today = t.tm_mday;
   t.tm_mday = 1;
   tt=mktime(&t);
   if(!localtime_r(&tt,&t))
    throw konforka::exception(CODEPOINT,"couldn't fetch current date");
   int dim = 31;
   if(t.tm_mon==3 || t.tm_mon==5 || t.tm_mon==8 || t.tm_mon==10) {
    dim = 30;
   }else if(t.tm_mon==1) {
    dim = (t.tm_year%4)?28:29;
   }
  </%code>
  <table class="calendar">
   <tr>
    <th class="heading" colspan="7"><% h %></th>
   </tr>
   <tr>
    <th class="wd-0">Sun</th>
    <th class="wd-1">Mon</th>
    <th class="wd-2">Tue</th>
    <th class="wd-3">Wed</th>
    <th class="wd-4">Thu</th>
    <th class="wd-5">Fri</th>
    <th class="wd-6">Sat</th>
   </tr>
   <%code>
    int dow=0; int dom=1-t.tm_wday;
    for(;;dom++,dow=(dow+1)%7) {
     if(!dow) {
      <%output>
       <tr>
      </%output>
     }
     bool be = (dom>=1 && dom<=dim);
     std::string ec = be?" existant":" unexistant";
     if(dom==today)
      ec+=" today";
     <%output><td class="wd-<% dow %><% ec %>"></%output>
     if(be) {
      <%output><% dom %></%output>
     }
     <%output></td></%output>
     if(dow==6) {
      <%output>
       </tr>
      </%output>
      if(dom>=dim)
       break;
     }
    }
   </%code>
  </table>
 </%method>
diff --git a/htdocs/index.chtml b/htdocs/index.chtml
index e8cedda..20d34c2 100644
--- a/htdocs/index.chtml
+++ b/htdocs/index.chtml
@@ -1,49 +1,51 @@
 % html(); return; /* vim:set ft=sitecing: */
 %%derive layout = "/ancestry/layout.chtml";
 <%constructor>
  PN_NEXT("/simple","simple page","building a really simple page");
 </%constructor>
 <%codemethod string title() %>
  return "introduction";
 </%codemethod>
 <%method void content() %>
  <h1>introduction to site-C-ing</h1>
  <p>
   This is a sample site, which is supposed to demonstrate <em>site-C-ing</em>
   features. Since the <em>site-C-ing</em> is still at the early stages of
   development or rather proof of concept, this site is also far from being
   complete. I am planning to add more pages as the time permits, though.
  </p>
  <p>
   Once you download and install <a
   href="http://kin.klever.net/sitecing/">site-C-ing</a> you may wish to try
   this sample site for yourself. The source is available from <a
   href="http://kin.klever.net/sitecing/sources">the site-C-ing download
   page</a>. After you download the source code, you should configure it using
   the ever so popular <code>configure</code> script. It is likely that you will
   want to pass the <code>--with-vhostname</code> option to configure to name
   the apache virtual host.
  </p>
  <p>
   The configure script will generate the apache vhost configuration for you,
   which you can <code>Include</code> in the main apache configuration file.
  </p>
  <p class="note">
   Note, that the configuration is tailored for apache 2.x. It is no problem to
   get it working with apache 1.3.x, although I haven't tried and so I am not
   sure if it will run out of the box (your patches are <a
   href="mailto:sitecing-patches@klever.net">welcome</a>). Also note that you
-  will need <a href="http://fastcgi.com/">mod_fastcgi</a> apache module, which
-  is the only CGI-interface supported by the <em>site-C-ing</em> engine at the
-  moment.
+  may need <a href="http://fastcgi.com/">mod_fastcgi</a> apache module,
+  although now that fastcgi is not the only supported interface you may get the
+  thing running with 'plain' CGI with a bit of tweaking. Again, if you got it
+  working without breaking the fastcgi part your patches are <a
+  href="mailto:sitecing-patches@klever.net">welcome</a>.
  </p>
  <p>
   Once you get it all done you will want to restart your apache and start the
   <em>site-C-ing</em> fastcgi server by issuing the <code>make restart</code>
   command.
  </p>
  <p>
   Before you download it, you may wish to <a href="/sources" title="source
   browser">examine the sources</a> to learn more about how it is done.
  </p>
 </%method>
diff --git a/htdocs/quickref/index.chtml b/htdocs/quickref/index.chtml
index 20ef217..d139190 100644
--- a/htdocs/quickref/index.chtml
+++ b/htdocs/quickref/index.chtml
@@ -1,16 +1,17 @@
 % html(); return; /* vim:set ft=sitecing: */
 %%derive layout = "/ancestry/layout.chtml";
 <%constructor>
  PN_PREV("/exceptions/runtime","runtime","runtime exceptions");
  PN_NEXT("/quickref/metasyntax","syntax","meta syntax");
 </%constructor>
 <%codemethod string title() %>
  return "quick reference";
 </%codemethod>
 <%method void content() %>
  <h1>site-C-ing quick reference</h1>
  <p>
   I am hoping to put together some quick reference documentation here. For now,
-  I am adding the component meta-syntax quick reference.
+  I am adding the <a href="/quickref/metasyntax">component meta-syntax quick
+  reference</a>.
  </p>
 </%method>
diff --git a/htdocs/quickref/metasyntax.chtml b/htdocs/quickref/metasyntax.chtml
index a63f596..4efc37c 100644
--- a/htdocs/quickref/metasyntax.chtml
+++ b/htdocs/quickref/metasyntax.chtml
@@ -1,344 +1,371 @@
 % html(); return; /* vim:set ft=sitecing: */
 %%derive layout = "/ancestry/layout.chtml";
 <%constructor>
  PN_PREV("/quickref/","quick reference","quick reference");
  PN_NEXT("/sources","sources","source browser");
 </%constructor>
 <%codemethod string title() %>
  return "meta syntax quick reference";
 </%codemethod>
 <%method void content() %>
  <h1>site-C-ing meta syntax quick reference</h1>
 
  <h2>Table of Contents</h2>
 
  <ul class="quickref toc">
   <li><a href="#qr__line">% ...</a></li>
   <li><a href="#qr__inline">&lt;% ... %&gt;</a></li>
   <li><a href="#qr__code">&lt;%code&gt;</a></li>
   <li><a href="#qr__codemethod">&lt;%codemethod ... &gt;</a></li>
   <li><a href="#qr__constructor">&lt;%constructor&gt;</a></li>
   <li><a href="#qr__decl">&lt;%decl&gt;</a></li>
   <li><a href="#qr___decl">%%decl</a></li>
   <li><a href="#qr___derive">%%derive</a></li>
   <li><a href="#qr__destructor">&lt;%destructor&gt;</a></li>
   <li><a href="#qr__impl">&lt;%impl&gt;</a></li>
   <li><a href="#qr___impl">%%impl</a></li>
   <li><a href="#qr__method">&lt;%method ... &gt;</a></li>
   <li><a href="#qr__output">&lt;%output&gt;</a></li>
   <li><a href="#qr___pragma">%%pragma</a></li>
   <li><a href="#qr___var">%%var</a></li>
  </ul>
 
  <dl class="metasyntax quickref">
 
 % /* % */
   <dt>
    <a id="qr__line" name="qr__line" title="line of code">
     <code>% <kbd>line of code</kbd></code>
    </a>
   </dt>
   <dd>
    <p>
     Break out into the code mode for just one line.
    </p>
    <blockquote class="qr_sample">
-    &nbsp;&lt;body&gt;<br/>
-    <em><a href="#qr__line" title="% description">%</a> for(int t=0;t&lt;10;t++) {<br/></em>
-    &nbsp;&nbsp;&nbsp;Here is the way we count.&lt;br/&gt;<br/>
-    &nbsp;&nbsp;&nbsp;Just saying out loud: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;br/&gt;<br/>
-    <em><a href="#qr__line" title="% description">%</a> }<br/></em>
-    &nbsp;&lt;/body&gt;
+    <div>
+     &nbsp;&lt;body&gt;<br/>
+     &nbsp;&nbsp;Here is the way we count.&lt;br/&gt;<br/>
+     <em><a href="#qr__line" title="% description">%</a> for(int t=0;t&lt;10;t++) {<br/></em>
+     &nbsp;&nbsp;&nbsp;Just saying out loud: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;br/&gt;<br/>
+     <em><a href="#qr__line" title="% description">%</a> }<br/></em>
+     &nbsp;&lt;/body&gt;
+    </div>
    </blockquote>
   </dd>
 
 % /* <% %> */
   <dt>
    <a id="qr__inline" name="qr__inline" title="output expression">
     <code>&lt;% <kbd>expression</kbd> %&gt;</code>
    </a>
   </dt>
   <dd>
    <p>
     &lt;&lt; <kbd>expression</kbd> into output stream (think c++).
    </p>
    <blockquote class="qr_sample">
-    <a href="#qr__line" title="% description">%</a> for(int t=0;t&lt;10;t++) {<br/>
-    &nbsp;&nbsp;&nbsp;Here is the way we count.&lt;br/&gt;<br/>
-    <em>&nbsp;&nbsp;&nbsp;Just saying out loud: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;br/&gt;<br/></em>
-    <a href="#qr__line" title="% description">%</a> }
+    <div>
+     &nbsp;&nbsp;Here is the way we count.&lt;br/&gt;<br/>
+     <a href="#qr__line" title="% description">%</a> for(int t=0;t&lt;10;t++) {<br/>
+     <em>&nbsp;&nbsp;&nbsp;Just saying out loud: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;br/&gt;<br/></em>
+     <a href="#qr__line" title="% description">%</a> }
+    </div>
    </blockquote>
   </dd>
 
 % /* %code */
   <dt>
    <a id="qr__code" name="qr__code" title="switching to code mode">
     <code>
      &lt;%code&gt; <kbd>...</kbd> &lt;/%code&gt;
     </code>
    </a>
   </dt>
   <dd>
-    Escape from the output mode to code mode. Opposite to <code><a href="#qr__output" title="&lt;%output&gt; description">&lt;%output&gt;</a></code>. Roughly the same as <code><a href="#qr__output" title="&lt;%output&gt; description">&lt;/%output&gt;</a> <kbd>...</kbd> <a href="#qr__output" title="&lt;%output&gt; description">&lt;%output&gt;</a></code> (note the reverse order), but more self-explanatory and applies to more cases.
+    <p>
+     Escape from the output mode to code mode. Opposite to <code><a href="#qr__output" title="&lt;%output&gt; description">&lt;%output&gt;</a></code>. Roughly the same as <code><a href="#qr__output" title="&lt;%output&gt; description">&lt;/%output&gt;</a> <kbd>...</kbd> <a href="#qr__output" title="&lt;%output&gt; description">&lt;%output&gt;</a></code> (note the reverse order), but more self-explanatory and applies to more cases.
    </p>
    <blockquote class="qr_sample">
-    &lt;body&gt;<br/>
-    <em>&nbsp;<a href="#qr__code" title="&lt;%code&gt; descrption">&lt;%code&gt;</a><br/></em>
-    &nbsp;&nbsp;for(int t=0;t&lt;10;t++) {<br/>
-    &nbsp;&nbsp;&nbsp;<a href="#qr__output" title="&lt;%output&gt; descrption">&lt;%output&gt;</a><br/>
-    &nbsp;&nbsp;&nbsp;&nbsp;Here is the way we count.&lt;br/&gt;<br/>
-    &nbsp;&nbsp;&nbsp;&nbsp;Just saying out loud: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;br/&gt;<br/>
-    &nbsp;&nbsp;&nbsp;<a href="#qr__output" title="&lt;%output&gt; descrption">&lt;/%output&gt;</a><br/>
-    <em>&nbsp;<a href="#qr__code" title="&lt;%code&gt; descrption">&lt;/%code&gt;</a><br/></em>
-    &lt;/body&gt;
+    <div>
+     &lt;body&gt;<br/>
+     <em>&nbsp;<a href="#qr__code" title="&lt;%code&gt; descrption">&lt;%code&gt;</a><br/></em>
+     &nbsp;&nbsp;for(int t=0;t&lt;10;t++) {<br/>
+     &nbsp;&nbsp;&nbsp;<a href="#qr__output" title="&lt;%output&gt; descrption">&lt;%output&gt;</a><br/>
+     &nbsp;&nbsp;&nbsp;&nbsp;Here is the way we count.&lt;br/&gt;<br/>
+     &nbsp;&nbsp;&nbsp;&nbsp;Just saying out loud: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;br/&gt;<br/>
+     &nbsp;&nbsp;&nbsp;<a href="#qr__output" title="&lt;%output&gt; descrption">&lt;/%output&gt;</a><br/>
+     <em>&nbsp;<a href="#qr__code" title="&lt;%code&gt; descrption">&lt;/%code&gt;</a><br/></em>
+     &lt;/body&gt;
+    </div>
    </blockquote>
   </dd>
 
 % /* %codemethod */
   <dt>
    <a id="qr__codemethod" name="qr__codemethod" title="member function definition">
     <code>
      &lt;%codemethod <kbd>return_type_t</kbd> <kbd>member_name</kbd>(<kbd>args,...</kbd>) %&gt;<br/>
      &nbsp;<kbd>code</kbd><br/>
      &lt;/%codemethod&gt;
     </code>
    </a>
   </dt>
   <dd>
    <p>
     Define the member function. Essentially equivalent to <code><a href="#qr__method" title="&lt;%method ... %&gt; description" class="internal">&lt;%method</a> <kbd>...</kbd> <a href="#qr__method" title="&lt;%method ... %&gt; description" class="internal">%&gt;</a><a href="#qr__code" title="&lt;%code&gt; description" class="internal">&lt;%code&gt;</a> <kbd>...</kbd> <a href="#qr__code" title="&lt;%code&gt; description" class="internal">&lt;/%code&gt;</a><a href="#qr__method" title="&lt;%method ... %&gt; description" class="internal">&lt;/%method&gt;</a></code>.
    </p>
    <blockquote class="qr_sample">
-    <em><a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">&lt;%codemethod</a> std::string ua() <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">%&gt;</a><br/>
-    &nbsp;return __CGI-&gt;get_meta("USER_AGENT");<br/>
-    <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">&lt;/%codemethod&gt;</a><br/></em>
-    The user agent is: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> ua() <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a><br/>
+    <div>
+     <em><a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">&lt;%codemethod</a> std::string ua() <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">%&gt;</a><br/>
+     &nbsp;return __CGI-&gt;get_meta("USER_AGENT");<br/>
+     <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">&lt;/%codemethod&gt;</a><br/></em>
+     The user agent is: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> ua() <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a><br/>
+    </div>
    </blockquote>
   </dd>
 
 % /* %constructor */
   <dt>
    <a id="qr__constructor" name="qr__constructor" title="constructor code">
     <code>
      &lt;%constructor&gt;<br/>
      &nbsp;<kbd>code</kbd><br/>
      &lt;/%constructor&gt;
     </code>
    </a>
   </dt>
   <dd>
    <p>
     Provide the code for constructor.
    </p>
    <blockquote class="qr_sample">
-    <a href="#qr___var" title="%%var description">%%var</a> bool is_msie;<br/>
-    <em><a href="#qr__constructor" title="&lt;%constructor&gt; description">&lt;%constructor&gt;</a><br/>
-    &nbsp;is_msie = (__CGI-&gt;get_meta("USER_AGENT").find("MSIE")!=string::npos);<br/>
-    <a href="#qr__constructor" title="&lt;%constructor&gt; description">&lt;/%constructor&gt;</a><br/></em>
+    <div>
+     <a href="#qr___var" title="%%var description">%%var</a> bool is_msie;<br/>
+     <em><a href="#qr__constructor" title="&lt;%constructor&gt; description">&lt;%constructor&gt;</a><br/>
+     &nbsp;is_msie = (__CGI-&gt;get_meta("USER_AGENT").find("MSIE")!=string::npos);<br/>
+     <a href="#qr__constructor" title="&lt;%constructor&gt; description">&lt;/%constructor&gt;</a><br/></em>
+    </div>
    </blockquote>
   </dd>
 
 % /* %decl / %%decl */
   <dt>
    <a id="qr___decl" name="qr___decl" title="verbatim declaration">
     <code>%%decl <kbd>line of code</kbd></code>
    </a>
   </dt>
   <dt>
    <a id="qr__decl" name="qr__decl" title="verbatim declaration">
     <code>
      &lt;%decl&gt;<br/>
      &nbsp;<kbd>lines of code</kbd><br/>
      &lt;/%decl&gt;
     </code>
    </a>
   </dt>
   <dd>
    <p>
     Put the line(s) of code into the resulting <em>.h</em> file before the
     class declaration.
    </p>
    <blockquote class="qr_sample">
-    <em><a href="#qr___decl" title="%%decl description">%%decl</a> #include &lt;string&gt;<br/></em>
-    <a href="#qr___var" title="%%var description">%%var</a> std::string str = "default"<br/>
-    <em><a href="#qr__decl" title="&lt;%decl&gt; description">&lt;%decl&gt;</a><br/>
-    &nbsp;typedef int integer_t;<br/>
-    <a href="#qr__decl" title="&lt;%decl&gt; description">&lt;/%decl&gt;</a><br/></em>
-    <a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;%method</a> void do_nothing(integer_t input) <a href="#qr__method" title="&lt;%method ... %&gt; description">%&gt;</a><br/>
-    &nbsp;nothing is done<br/>
-    <a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;/%method&gt;</a>
+    <div>
+     <em><a href="#qr___decl" title="%%decl description">%%decl</a> #include &lt;string&gt;<br/></em>
+     <a href="#qr___var" title="%%var description">%%var</a> std::string str = "default"<br/>
+     <em><a href="#qr__decl" title="&lt;%decl&gt; description">&lt;%decl&gt;</a><br/>
+     &nbsp;typedef int integer_t;<br/>
+     <a href="#qr__decl" title="&lt;%decl&gt; description">&lt;/%decl&gt;</a><br/></em>
+     <a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;%method</a> void do_nothing(integer_t input) <a href="#qr__method" title="&lt;%method ... %&gt; description">%&gt;</a><br/>
+     &nbsp;nothing is done<br/>
+     <a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;/%method&gt;</a>
+    </div>
    </blockquote>
   </dd>
 
 % /* %%derive */
   <dt>
    <a id="qr___derive" name="qr___derive" title="base class(es) specification">
     <code>%%derive <kbd>name</kbd> = "<kbd>base-component</kbd>";</code>
    </a>
   </dt>
   <dd>
    <p>
     Inherit what is there to be inherited from the base component specified.
    </p>
    <blockquote class="qr_sample">
-    <em><a href="#qr___derive" title="%%derive description">%%derive</a> pagelayout = "/ancestry/page_layout.chtml";<br/></em>
-    <a href="#qr__line" title="% description">%</a> pagelayout::member_function();
+    <div>
+     <em><a href="#qr___derive" title="%%derive description">%%derive</a> pagelayout = "/ancestry/page_layout.chtml";<br/></em>
+     <a href="#qr__line" title="% description">%</a> pagelayout::member_function();
+    </div>
    </blockquote>
   </dd>
 
 % /* %destructor */
   <dt>
    <a id="qr__destructor" name="qr__destructor" title="destructor code">
     <code>
      &lt;%destructor&gt;<br/>
      &nbsp;<kbd>code</kbd><br/>
      &lt;/%destructor&gt;
     </code>
    </a>
   </dt>
   <dd>
    <p>
     Provide the code for destructor.
    </p>
    <blockquote class="qr_sample">
-    <a href="#qr___var" title="%%var description">%%var</a> type_t *tmp = 0;<br/>
-    <a href="#qr__constructor" title="&lt;%constructor&gt; description">&lt;%constructor&gt;</a><br/>
-    &nbsp;tmp = new type_t(type_t::option_1);<br/>
-    <a href="#qr__constructor" title="&lt;%constructor&gt; description">&lt;/%constructor&gt;</a><br/>
-    <em><a href="#qr__destructor" title="&lt;%destructor&gt; description">&lt;%destructor&gt;</a><br/>
-    &nbsp;delete tmp;<br/>
-    <a href="#qr__destructor" title="&lt;%destructor&gt; description">&lt;/%destructor&gt;</a><br/></em>
+    <div>
+     <a href="#qr___var" title="%%var description">%%var</a> type_t *tmp = 0;<br/>
+     <a href="#qr__constructor" title="&lt;%constructor&gt; description">&lt;%constructor&gt;</a><br/>
+     &nbsp;tmp = new type_t(type_t::option_1);<br/>
+     <a href="#qr__constructor" title="&lt;%constructor&gt; description">&lt;/%constructor&gt;</a><br/>
+     <em><a href="#qr__destructor" title="&lt;%destructor&gt; description">&lt;%destructor&gt;</a><br/>
+     &nbsp;delete tmp;<br/>
+     <a href="#qr__destructor" title="&lt;%destructor&gt; description">&lt;/%destructor&gt;</a><br/></em>
+    </div>
    </blockquote>
   </dd>
 
 % /* %impl / %%impl */
   <dt>
    <a id="qr___impl" name="qr__impl" title="verbatim definition">
     <code>%%impl <kbd>line of code</kbd></code>
    </a>
   </dt>
   <dt>
    <a id="qr__impl" name="qr__impl" title="verbatim definition">
     <code>
      &lt;%impl&gt;<br/>
      &nbsp;<kbd>lines of code</kbd><br/>
      &lt;/%impl&gt;
     </code>
    </a>
   </dt>
   <dd>
    <p>
     Put the line(s) of code into the resulting <em>.cc</em> implementation file
     before any members definitions.
    </p>
    <blockquote class="qr_sample">
-    <em><a href"#qr___impl" title="%%impl description">%%impl</a> #include &lt;string.h&gt;<br/></em>
-    <a href="#qr__method" title="&lt;%method ... %gt; description">&lt;%method</a> void output_if_contains(const char *haystack,const char *needle) <a href="#qr__method" title="&lt;%method ... %gt; description">%&gt;</a><br/>
-    <a href="#qr__line" title="% description">%</a> if(strstr(haystack,needle)) {<br/>
-    &nbsp;&nbsp;&nbsp;<a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> haystack <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a><br/>
-    <a href="#qr__line" title="% description">%</a> }<br/>
-    <a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;/%method&gt;</a><br/>
-    <em><a href="#qr__impl" title="&lt;%impl&gt; description">&lt;%impl&gt;</a><br/>
-    &nbsp;#include &lt;konforka/exception.h&gt;
-    &nbsp;static const char *tokens[] = {<br/>
-    &nbsp;&nbsp;"token 1", "token 2", "token 3"<br/>
-    &nbsp;};<br/>
-    <a href="#qr__impl" title="&lt;%impl&gt; description">&lt;/%impl&gt;</a><br/></em>
-    <a href="#qr__method" title="&lt;%method ... %gt; description">&lt;%method</a> void output_token(int toknum) <a href="#qr__method" title="&lt;%method ... %gt; description">%&gt;</a><br/>
-    &nbsp;<a href="#qr__code" title="&lt;%code&gt; description">&lt;%code&gt;</a><br/>
-    &nbsp;&nbsp;if(toknum&lt;0 || toknum&gt;=(sizeof(tokens)/sizeof(*tokens)))<br/>
-    &nbsp;&nbsp;&nbsp;throw konforka::exception(CODEPOINT,"out of bounds");<br/>
-    &nbsp;<a href="#qr__code" title="&lt;%code&gt; description">&lt;/%code&gt;</a><br/>
-    &nbsp;<a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> tokens[toknum] <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a><br/>
-    <a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;/%method&gt;</a><br/>
+    <div>
+     <em><a href="#qr___impl" title="%%impl description">%%impl</a> #include &lt;string.h&gt;<br/></em>
+     <a href="#qr__method" title="&lt;%method ... %gt; description">&lt;%method</a> void output_if_contains(const char *haystack,const char *needle) <a href="#qr__method" title="&lt;%method ... %gt; description">%&gt;</a><br/>
+     <a href="#qr__line" title="% description">%</a> if(strstr(haystack,needle)) {<br/>
+     &nbsp;&nbsp;&nbsp;<a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> haystack <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a><br/>
+     <a href="#qr__line" title="% description">%</a> }<br/>
+     <a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;/%method&gt;</a><br/>
+     <em><a href="#qr__impl" title="&lt;%impl&gt; description">&lt;%impl&gt;</a><br/>
+     &nbsp;#include &lt;konforka/exception.h&gt;
+     &nbsp;static const char *tokens[] = {<br/>
+     &nbsp;&nbsp;"token 1", "token 2", "token 3"<br/>
+     &nbsp;};<br/>
+     <a href="#qr__impl" title="&lt;%impl&gt; description">&lt;/%impl&gt;</a><br/></em>
+     <a href="#qr__method" title="&lt;%method ... %gt; description">&lt;%method</a> void output_token(int toknum) <a href="#qr__method" title="&lt;%method ... %gt; description">%&gt;</a><br/>
+     &nbsp;<a href="#qr__code" title="&lt;%code&gt; description">&lt;%code&gt;</a><br/>
+     &nbsp;&nbsp;if(toknum&lt;0 || toknum&gt;=(sizeof(tokens)/sizeof(*tokens)))<br/>
+     &nbsp;&nbsp;&nbsp;throw konforka::exception(CODEPOINT,"out of bounds");<br/>
+     &nbsp;<a href="#qr__code" title="&lt;%code&gt; description">&lt;/%code&gt;</a><br/>
+     &nbsp;<a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> tokens[toknum] <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a><br/>
+     <a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;/%method&gt;</a><br/>
+    </div>
    </blockquote>
   </dd>
 
 % /* %method */
   <dt>
    <a id="qr__method" name="qr__method" title="member function definition">
     <code>
      &lt;%method <kbd>return_type_t</kbd> <kbd>member_name</kbd>(<kbd>args,...</kbd>) %&gt;<br/>
      &nbsp;<kbd>code</kbd><br/>
      &lt;/%method&gt;
     </code>
    </a>
   </dt>
   <dd>
    <p>
     Define the member function. Essentially equivalent to <code><a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description" class="internal">&lt;%codemethod</a> <kbd>...</kbd> <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description" class="internal">%&gt;</a><a href="#qr__output" title="&lt;%output&gt; description" class="internal">&lt;%output&gt;</a> <kbd>...</kbd> <a href="#qr__output" title="&lt;%output&gt; description" class="internal">&lt;/%output&gt;</a><a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description" class="internal">&lt;/%codemethod&gt;</a></code>.
    </p>
    <blockquote class="qr_sample">
-    <em><a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;%method</a> void emphasized(const char *t) <a href="#qr__method" title="&lt;%method ... %&gt; description">%&gt;</a><br/>
-    &nbsp;&lt;em&gt;<a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;/em&gt;<br/>
-    <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">&lt;/%method&gt;</a><br/></em>
-    <a href="#qr__line" title="% description">%</a> emphasized("emphasized text");
+    <div>
+     <em><a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;%method</a> void emphasized(const char *t) <a href="#qr__method" title="&lt;%method ... %&gt; description">%&gt;</a><br/>
+     &nbsp;&lt;em&gt;<a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;/em&gt;<br/>
+     <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">&lt;/%method&gt;</a><br/></em>
+     <a href="#qr__line" title="% description">%</a> emphasized("emphasized text");
+    </div>
    </blockquote>
   </dd>
 
 % /* %output */
   <dt>
    <a id="qr__output" name="qr__output" title="switching to output mode">
     <code>
      &lt;%output&gt; <kbd>...</kbd> &lt;/%output&gt;
     </code>
    </a>
   </dt>
   <dd>
    <p>
     Escape from the code mode to output mode. Opposite to <code><a href="#qr__code" title="&lt;%code&gt; description">&lt;%code&gt;</a></code>. Roughly the same as <code><a href="#qr__code" title="&lt;%code&gt; description">&lt;/%code&gt;</a> <kbd>...</kbd> <a href="#qr__code" title="&lt;%code&gt; description">&lt;%code&gt;</a></code> (note the reverse order), but more self-explanatory and applies to more cases.
    </p>
    <blockquote class="qr_sample">
-    <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">&lt;%codemethod</a> void count() <a href="#qr__codemethod" title="&lt;%codemethod ... &gt; description">%&gt;</a><br/>
-    &nbsp;for(int t=0;t&lt;10;t++) {<br/>
-    <em>&nbsp;&nbsp;<a href="#qr__output" title="&lt;%output&gt; descrption">&lt;%output&gt;</a><br/>
-    &nbsp;&nbsp;&nbsp;Here is the way we count.&lt;br/&gt;<br/>
-    &nbsp;&nbsp;&nbsp;Just saying out loud: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;br/&gt;<br/>
-    &nbsp;&nbsp;<a href="#qr__output" title="&lt;%output&gt; descrption">&lt;/%output&gt;</a><br/></em>
-    <a href="#qr__codemethod" title="&lt;/%codemethod ... %&gt; description">&lt;/%codemethod&gt;</a><br/>
-    <a href="#qr__line" title="% description">%</a> count();
+    <div>
+     <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">&lt;%codemethod</a> void count() <a href="#qr__codemethod" title="&lt;%codemethod ... &gt; description">%&gt;</a><br/>
+     &nbsp;for(int t=0;t&lt;10;t++) {<br/>
+     <em>&nbsp;&nbsp;<a href="#qr__output" title="&lt;%output&gt; descrption">&lt;%output&gt;</a><br/>
+     &nbsp;&nbsp;&nbsp;Here is the way we count.&lt;br/&gt;<br/>
+     &nbsp;&nbsp;&nbsp;Just saying out loud: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;br/&gt;<br/>
+     &nbsp;&nbsp;<a href="#qr__output" title="&lt;%output&gt; descrption">&lt;/%output&gt;</a><br/></em>
+     <a href="#qr__codemethod" title="&lt;/%codemethod ... %&gt; description">&lt;/%codemethod&gt;</a><br/>
+     <a href="#qr__line" title="% description">%</a> count();
+    </div>
    </blockquote>
   </dd>
 
 % /* %%pragma */
   <dt>
    <a id="qr___pragma" name="qr___pragma" title="pragma">
     <code>
      %%pragma <kbd>pragma_name</kbd><br/>
      %%pragma <kbd>pragma_name</kbd>=<kbd>pragma_value</kbd>
     </code>
    </a>
   </dt>
   <dd>
    <p>provide pseudo instructions to the preprocessor. At this time only pragma
    named <code>main</code> is defined, which instructs preprocessor to discard
    the 'main' member that would be generated for the component and call the
    <code>main</code> member of the named base class.</p>
    <blockquote class="qr_sample">
-    <a href="#qr___derive" title="%%derive description">%%derive</a> pagelayout = "/ancestry/page_layout.chtml";<br/>
-    <em><a href="#qr___pragma" title="%%pragma description">%%pragma</a> main=pagelayout</em>
+    <div>
+     <a href="#qr___derive" title="%%derive description">%%derive</a> pagelayout = "/ancestry/page_layout.chtml";<br/>
+     <em><a href="#qr___pragma" title="%%pragma description">%%pragma</a> main=pagelayout</em>
+    </div>
    </blockquote>
   </dd>
 
 % /* %%var */
   <dt>
    <a id="qr___var" name="qr___var" title="member variable declaration">
-    <code>%%var <kbd>type_t</kbd> <kbd>varname</kbd>;<br/>
-    <code>%%var <kbd>type_t</kbd> <kbd>varname</kbd> = <kbd>initalizer</kbd>;<br/>
+    <code>%%var <kbd>type_t</kbd> <kbd>varname</kbd>;</code><br/>
+    <code>%%var <kbd>type_t</kbd> <kbd>varname</kbd> = <kbd>initalizer</kbd>;</code><br/>
    </a>
   </dt>
   <dd>
    <p>
     Define the member variable with optional default value (suitable for
     putting into the <code>: <kbd>varname</kbd>(<kbd>initializer</kbd>)</code>
     part of the c++ constructor.
    </p>
    <blockquote class="qr_sample">
-    <em><a href="#qr___var" title="%%var description">%%var</a> std::string strval = "default value";<br/>
-    <a href="#qr___var" title="%%var description">%%var</a> int usecount = 0;<br/>
-    <a href="#qr___var" title="%%var description">%%var</a> int whatnot;</em>
+    <div>
+     <em><a href="#qr___var" title="%%var description">%%var</a> std::string strval = "default value";<br/>
+     <a href="#qr___var" title="%%var description">%%var</a> int usecount = 0;<br/>
+     <a href="#qr___var" title="%%var description">%%var</a> int whatnot;</em>
+    </div>
    </blockquote>
   </dd>
 
  </dl>
 </%method>
diff --git a/htdocs/style.css b/htdocs/style.css
index 96e4c59..28aa8df 100644
--- a/htdocs/style.css
+++ b/htdocs/style.css
@@ -1,256 +1,262 @@
 body {
  font-family: sans-serif;
  font-size: 11pt;
 }
 
 a:link, a:visited {
  text-decoration: none;
 }
 a:link:hover, a:visited:hover {
  text-decoration: underline;
 }
 p {
  margin: 1ex 1em;
  text-indent: 2em;
  text-align: justify;
 }
 p.note {
  margin-left: 10%;
  border-width: 1px 1px 1px 6px;
  border-color: gray gray gray #0000a0;
  border-style: solid solid solid double;
  padding: 1ex 1ex 1ex 2em;
  font-size: 80%;
  background: #c0c0e0;
  color: #202020;
 }
 code a,
 code {
  color: #d04040;
 }
 em {
  white-space: nowrap;
 }
 
 div.google_ad {
  text-align: center;
  margin: 1ex;
 }
 div.google_ad.top {
  padding-bottom: 1ex;
  border-bottom: 1px gray solid;
 }
 div.google_ad.bottom {
  padding-top: 1ex;
  border-top: 1px gray solid;
 }
 
 div#sidepanel {
  position: absolute; top: 0px; left: 0px;
  margin: 0px;
  width: 20%;
  font-size: 80%;
 }
 div#content {
  position: absolute; top: 0px; right: -0px;
  margin: 0px;
  width: 80%;
 }
 
 div#sidepanel h1 {
  font-size: 80%;
  text-align: center;
  font-weight: normal;
  color: #004080;
  white-space: nowrap;
  margin-top: 2ex; margin-bottom: 2ex;
 }
 div#sidepanel h2 {
  font-size: 80%;
  text-align: justify;
  font-weight: normal;
  color: gray;
  margin: 1ex 1ex;
 }
 div#sidepanel ul {
  padding: 1ex 0.5ex 1ex 1ex;
  margin: 0.5ex;
  border-color: #c0c0c0 #404040 #404040 #c0c0c0;
  border-width: 1px 2px 2px 1px;
  border-style: solid;
  background: #d0d0d0;
  list-style-type: none;
 }
 div#sidepanel ul ul {
  margin: 0px; padding: 0px;
  border: none 0px;
 }
 div#sidepanel li {
  list-style-type: none;
  margin: 0px; padding: 0px;
  display: block;
 }
 div#sidepanel ul a {
  display: block;
  padding: 1px 1ex;
  margin: 0.5ex;
  border: 1px solid gray;
  text-decoration: none;
  background: white;
  color: black;
 }
 div#sidepanel ul a:hover {
  background: gray;
  color: white;
 }
 div#sidepanel ul ul a {
  padding-left: 2.5ex;
  background: #e0e0e0;
 }
 div#sidepanel div.copyright {
  text-align: center;
 }
 
 div#content h1 {
  font-size: 140%;
  color: gray;
  font-weight: bold;
  text-align: center;
  margin: 1em;
  clear: both;
 }
 div#content h2 {
  font-size: 140%;
  color: #8080a0;
  font-weight: bold;
  text-align: center;
  margin: 1em;
  clear: both;
 }
 div#content p a {
  font-weight: bold;
 }
 div#content p a.internal {
  font-weight: inherit !important;
 }
 
 div.insert {
  text-align: center;
 }
 iframe#insert {
  border: 1px solid black;
 }
 
 div.source h1 {
  background: #e0e0e0;
  border: 1px solid #808080;
  padding-left: 1em;
  margin: 0px;
  font-size: 100%;
  color: #000060;
  overflow: hidden;
 }
 div.source ul {
  background: #80c0c0;
  margin: 0px;
  padding: 1px 0px;
  font-family: monospace;
  font-size: 80%;
  overflow: hidden;
  width:100%;
 }
 div.source li {
  list-style-type: none;
  white-space: nowrap;
  margin: 0px 0.5ex;
 }
 
 ul.sourcebrowser {
  font-size: 70%;
 }
 ul.sourcebrowser ul.dir {
  padding: 1px 0px 2px 1em;
  margin: 1px 0px 1px 0px;
 }
 ul.sourcebrowser li.dir {
  margin: 1px 0px 1px 0px;
 }
 ul.sourcebrowser li.file {
  list-style-type: none;
  white-space: nowrap;
  display: inline;
 }
 ul.sourcebrowser li.file a {
  border: 1px solid gray;
  padding: 1px 0.5ex;
  text-decoration: none;
  font-family: monospace;
 }
 ul.sourcebrowser li.file a:hover {
  background: gray;
  border: 1px solid black;
  color: white;
 }
 
 div.prevnext {
  margin: 1ex;
 }
 div.prevnext a {
  margin: 0.5ex 1em; padding: 0.2ex 0.5ex;
  display: block; width: 30%;
  border: solid 1px gray;
  color: black;
  text-decoration: none;
 }
 div.prevnext a.prevnext-prev {
  float: left;
  text-align: left;
 }
 div.prevnext a.prevnext-next {
  float: right;
  text-align: right;
 }
 div.prevnext a:hover {
  background: gray;
  border: black 1px solid;
  color: white;
+ text-decoration: none;
 }
 
 ul.quickref.toc {
  margin: 1em 20%;
  font-size: 90%;
  border: solid 1px gray;
 }
 
 dl.quickref {
  margin: 1ex 1em;
+ overflow: hidden;
 }
 dl.quickref dt {
  margin: 0.4ex;
  padding: 2px 0.5ex;
  background: #e0e0e0;
  display: compact;
 }
 dl.quickref dd {
  margin: 0px 0.4ex 0.4ex 10%;
  padding: 0px;
- border: 1px solid grey;
+ border: 1px solid gray;
+ overflow: hidden;
 }
 dl.quickref code kbd {
  font-style: italic;
  color: #0000c0;
 }
 dl.quickref blockquote {
  background: #ffffc0;
  padding: 4px;
  border: dotted 1px gray;
  font-family: monospace;
+ font-size: 90%;
+ overflow: hidden;
 }
 dl.quickref blockquote em {
  display: block;
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  font-style: inherit !important;
  background: #ffc0c0;
+ overflow: hidden;
 }