// This script is intended to be used for recursive builds with:
//   * All links in one file
//   * No folder table
//   * Anchor links limited to 30 characters, and in one column
// Essentially, it looks a lot like a framed site, but prettier.

/HEAD
<style type="text/css">
HTML {font-size: small; font-family: sans-serif}
BODY {background: #E1E1E3;}
A {color: #003399; text-decoration: none}
A:hover {color: #FFF; background: #006699;}
A:visited {color: #656565}
A:visited:hover {color: #fff}
TABLE.generic {background: #DFDFDF; border-right: 1px solid; color: color:#5A666E;
   border-top: 1px solid; border-bottom: 0px solid; border-color: #EEE; }
TABLE.generic TD {border-left: 1px solid; border-bottom: 1px solid;
  border-color: #EEE; text-align: center}
TABLE.generic TH {border-left: 1px solid; border-bottom: 1px solid; text-align: center;
   background: #14719F; color: #FFF; border-color: #EEE; font-weight: bold}
// Note: The sole purpose of having two nearly identical tables is the <td> text-align's
TABLE.file-table {background: #DFDFDF; border-right: 1px solid; color:#5A666E;
   border-top: 1px solid; border-bottom: 0px solid; border-color: #EEE; }
TABLE.file-table TD {border-left: 1px solid; border-bottom: 1px solid;
  border-color: #EEE; }
TABLE.file-table TD.no-left {border-left: 0px}
TABLE.file-table TH {border-left: 1px solid; border-bottom: 1px solid; text-align: center;
   background: #99B5CD; color: #EEE; border-color: #EEE; font-weight: bold}
.anchor {font-weight: bold; border-top: 0px solid; text-align: center;
   border-bottom: 1px solid; background: #3883AC; color: #FFF; border-color: #EEE;
 text-align: center; font-size: medium; line-height: 1.05; }
.dark-blue {font-weight: bold; border-top: 0px solid; text-align: center;
   border-bottom: 1px solid; background:#00537D; color: #FFF; border-color: #EEE;}
.header {text-align: center; font-size: medium; line-height: 1.3}
.no-top-border {border-top: 0px}
.centered {margin: auto}
.no-lb {border-left: 0px}
.no-rb {border-right: 0px}
.rZ {text-align: right}
.row2 {background: #D3D3E1}
</style>
/ANCHOR
</td></tr>
<tr><td colspan="%%COLUMNS%" style="background: #badcd9; color: #595959"><center>Files: %%ANCHOR_TOTAL_FILES%&nbsp;&nbsp;&nbsp;&nbsp;Size: %%ANCHOR_TOTAL_SIZE%</center>
/TABLEHEADER
<table border="0" cellspacing="0" cellpadding="3" summary="file table" class="file-table centered">
/FILE_TABLE_ROW2
class="row2"
/TIME_TD
class="no-left"
/ANCHOR_TABLE_HEADER
<table border="0" cellspacing="0" cellpadding="3" summary="anchor table" class="generic centered">
/ANCHOR_TABLE_ROW2
class="row2"
/ANCHOR_TD
class="anchor"
//class="anchor" style="text-align: center; font-size: medium; line-height: 1.05"
/FOLDER_TABLE_HEADER
<table border="0" cellspacing="0" cellpadding="3" summary="folder table" class="generic centered">
/FOLDER_TABLE_ROW2
class="row2"
/FOLDER_HEADER
class="dark-blue" style="text-align: center"
/HEADER_STYLE
class="dark-blue header"
/HEAD
<style type="text/css">
#container
{
width: 97%;
margin: 10px auto;
background-color: #F3F3F3;
color: #333;
border: 1px solid gray;
line-height: 110%;
}

#top
{
padding: .5em;
background-color: #A6C0CC;
border-bottom: 1px solid gray;
line-height: 160%;
}

#top h1
{
padding: 0;
margin: 0;
}

#leftnav
{
float: left;
width: 16em;
margin: 0;
padding-top: 1em;
padding-left: 0.4em;
padding-right: 0.4em;
background-color: #F3F3F3;
}

#content
{
margin-left: 17em;
border-left: 3px solid gray;
padding: 1em;
}

#footer
{
clear: both;
margin: 0;
padding: .5em;
color: #333;
background-color: #ddd;
border-top: 1px solid gray;
font-size: x-small;
font-style: italic
}

#leftnav p { margin: 0 0 1em 0; }
#content h2 { margin: 0 0 .5em 0; }
</style>

/START
<div id="container">
<div id="top">
<h1>%%DIR</h1>
</div>
/BEFORE_ANCHORS
<div id="leftnav">
/BETWEEN_FILES_AND_FOLDERS
</div>
<div id="content">
/END
</div>
<div id="footer">
%%DATE
</div>
</div>