body
{   font-family: "Georgia", "Times New Roman", serif;
    z-index: 1;
    /* I can't use "auto" for the margins because of IE 5 & 6. Also, IE 5 & 6
       do not support "max-width". Because of these issues, I have to wrap everything
       in a <div id="ie-fix"> and set "text-align: center" here.
    */
    text-align: center;
    background-image: url('images/background.gif');
    background-color: #ffffee
    /* For browsers that support the standards correctly, use the following and
       remove the "ie-fix" style and <div>.

    margin-left: auto;
    margin-right: auto;
    max-width: 34em;
    text-align: justify;
    */
}

div#ie-fix
{   width: 40em;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
    background: rgb(255, 255, 255);
}

div#article
{   width: 34em;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
    background: rgb(255, 255, 255);
}

div#navigation
{   font-family: "Verdana", "Arial", "Helvetica", sans-serif;
    text-align: center;
}

p
{   margin-top: 0.2em;
    margin-bottom: 0.3em;
    text-indent: 1.5em;
}

p.dedication
{   text-align: center;
    text-indent: 0;
}

p.toc
{   line-height: 1.4em;
    text-indent: -1.5em;
    margin-left: 1.5em;
}

p.first
{   text-indent: 0;
}

p.poem
{   font-style: italic;
    margin-left: 1.5em;
    margin-top: 0.8em;
    margin-bottom: 0.8em;
    text-indent: 0;
}

p.quote
{   font-style: italic;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0.8em;
    margin-bottom: 0.8em;
    text-indent: 0;
    text-align: center;
    max-width: 28em;
}

p.end
{   margin-top: 0.5em;
    font-weight: bold;
    text-align: center;
}

p.license
{   text-align: left;
}

h1
{   margin-top: 0.6em;
    margin-bottom: 0.6em;
    text-align: center;
    font-size: 1.2em;
    page-break-before: always;
}

hr.pagebreak
{   text-align: center; /* IE 6 needs this. Firefox centers the rule without it. */
    width:66%;
    margin-top: 1.2em;
    margin-bottom: 1.2em;
}

div.img-center
{   text-align: center;
    page-break-inside: avoid;
}

span.dropcap
{   float: left;
    font-size: 3em;
    line-height: 0.7em;
    margin-top: 0em;
    margin-bottom: 0;
}

/* The following four "a.info" styles create a "tooltip" popup when you hover
    the mouse over specified terms. I am using this for popup definitions.

    Don't use this for epub. Atrributes "position" and "z-index" are optional
    CSS according to OPS spec.
*/

a.info
{   position: relative;
    /* z-index: 24; */
    background-color:#ffffc0;
    color: #000000;
    text-decoration: none;
}

a.info:hover
{   /* z-index: 25; */
    background-color:#ffff00;
}

a.info span
{   display: none;
}

/* The span will only display on hover. */
a.info:hover span
{
    display: block;
    /* It seems that Opera 9 has a bug. It won't display the popup on hover
        with the position set to "absolute". I'm not going to try to fix this.
    */
    z-index: 25;
    position: absolute;
    top: 2em;
    left: -2em;
    width: 8em;
    border: 1px solid #000000;
    padding: 0.2em;
    background-color: #ffff00;
    color: #000000;
    text-align: center;
    text-indent: 0;
}