/* the box is the outer bouding box of the page */
.box {
    overflow:    auto;
    border:      1px solid blue;
    margin:     0 0 0 0;
    width:      auto;
    padding:    1px;
    float:left;
}
/* each set of images / text lives inside a row */
.row {
    overflow:         auto;
    border:           1px solid red;
    background-color: white;
    padding:          1px;
    vertical-align:   middle;
    margin:           1px;
    width:            auto;
    margin-right:     auto;
    clear:            left;
    #border:          white;  /* IE gets the row heightwrong, so make the border white to hide the bug */
}
/* A cell is the container for (image + caption) or (identification text) or (navigatiom) */
.cell{
    display:         inline-block;
    clear:left;
    text-align:      center;
    padding:         1px;
    margin:          auto;
    font-family:     Arial;
    font-size:       12px;
    color:           black;
    background-color:#eee;
    vertical-align:  top;
    border:          solid #faa 1px;
    padding:         1px;
    margin:          1px;
}
/* A cl cell is a tight container around something */
.cl{
    display:         inline-block;
    text-align:      center;
    padding:         1px;
    margin:          1px;
    font-family:     Arial;
    font-size:       12px;
    color:           blue;
    background-color:#ddd;
    vertical-align:  middle;
    border:          0;
}
.bt{
    font-family:     Arial;
    font-size:       10px;
}
/* cells in the nav float */
#nav1 .cell, #nav2 .cell, #nav3 .cell, #nav4 .cell {
    float:           left;
    border: 1px solid green;
}
.column {
    float:           left;
    border:          0px;
    text-align:      center;
}
/* within a column, the cell clears left */
.column .cell {
    clear:left;
}
.txt{
  text-align: center;
  padding:      4px;
  margin-top:   1px;
  margin-bottom:1px;
  margin-left:  auto;
  margin-right: auto;
  font-family:  Arial;
  font-size:    12px;
  color:        black;
}
.date{
    display: inline;
    font-size: 10px;
    font-family: "Calibri", "Arial", "Helvetica", sans-serif;
    float:left;
    color: #888;
}
.title{
    display: inline;
    font-family: "Calibri", "Arial", "Helvetica", sans-serif;
    font-weight: bold;
}
.img{
}
#nav1, #nav2, #nav3, #nav4, #nav5, #nav6, #who1, #who2, #who3, #who4, #who5{
   margin-left:  5px;
   margin-right: 5px;
}
#header {
    text-align:     center;
    vertical-align: middle;
}
body, li, p {
    font-family: "Lucida Console", "Fixedsys", "Courier New", monospace;
    font-size: 13px;
    color: blue;
    text-align: center;
}
h1, h2, h3, h4, h5, .header {
    color: navy;
    font-weight: bold;
    font-family: "Calibri", "Lucida Sans", "Arial", "Helvetica", sans-serif;
}
.ok, .err {
    font-family: "Calibri", "Lucida Sans", "Arial", "Helvetica", sans-serif;
}
.ok {
    color: green;
}
.err {
    color: red;
}
