body            { font-family: Palatino, "Century Schoolbook", Times, serif;
                   font-size: 1em; background-color: rgb(255, 255, 249);
                   padding: .5em; 
                   line-height: 1.2; 
                }
.banner         { text-align: center;
                  vertical-align: middle;
                  background-color: maroon; 
                }
                
        /* Note use of element DECENDENTS in several cases below.  For
        example, in the div class "div.img_caption h2" there is first
        a selector for the div class ""div.img_caption" and then a
        decendent selector for the "h2" element. 
        */
div.image       { text-align: center; }
div.image img   { border: 1px solid #999999; }
div.img_caption h2 { font-family: "Helvetica Neue", "Helvetica", "Arial Black", Arial, sans-serif; 
                     color: maroon; 
                     font-size: 1.2em;
                   }
div.img_caption p  { font-family: "Century Schoolbook", Palatino, serif; }

        /* Below is a very fancy selector combination: 
        
            "div.img_caption > p + p"
            
            First it starts with a class selector for "div.img_caption",
        followed by a CHILD SELECTOR (indicated by the ">" sign).  
        This means a match based on an element being the child of another.  
        This is more restrictive than a descendent selector, since only 
        a child will be matched.
            Second it contains a ADJACENT SIBLING selector (indicated 
            by the "+" sign as in "+ p." This allows the selection of
            an element that is the following adjacent sibling of another
            element.  Any text between the two elements is ignored; only
            elements and their positions in the document tree are
            considered.
        */
div.img_caption > p + p { font-size: 0.8em; font-family: "Neue Helvetica", Helvetica, sans-serif;  }

acronym     { text-transform: uppercase; font-size: smaller; }

#navigation { margin: 4em 0 0 1em; 
              vertical-align: top;
              line-height: 2em; 
              font-family: "Helvetica Neue", "Helvetica", sans-serif; 
              font-size: 1em;
              width: 100%;
              height: 100%;
            }
#display    { margin: 2em; padding: 2em; }
#start      { text-align: justify; 
              
              border: double 3px #999999; 
              margin: 2em; 
              padding: 2em; }

.center     { text-align: center; }


td   { padding: 2em; }