/*  *******************
 *  some overall styles
 */
body {
    color: black;
    margin: 20px;
    background: white url(BGkamon.jpg);
    font-family: georgia, "bitstream vera serif", serif;
    }
a:link {
    color: #dc143c;  /* crimson */
    text-decoration: none;
    }
a:visited {
    color: purple;
    text-decoration: none;
    }
a:hover {
    text-decoration: underline;
    }
a:active {
    color: red;
    text-decoration: none;
    }
hr  {
    height: 1px;
    border-color: black;
    border-style: solid;
    border-width: 1px 0px 0px 0px;
	}	

p, dl, ol, ul {
    font-size: 10pt;
    line-height: 115%;
    }
pre {
    font-size: 10pt;
    line-height: 100%;
    letter-spacing: -0.05em;
    }
ol li, ul li {
    margin-left: 20pt;
    }
ul  {
    list-style-type: square;
    }
abbr,
acronym {
    font-size: smaller;
    letter-spacing: 0.05em;
    }


/*  *****************
 *  the parts of body
 */
div#abody {
    padding: 40px;
    background: white none;
    }
div#ahead,
div#afoot {
    padding: 20px;
    text-align: center;
    border: 1pt solid black;
    background: #f08080 none;  /* f08080 = lightcoral */
    }
div#ahead h1 {
    width: 100%;
    filter: Shadow(Color="#ffffff",Direction="225");
    }
div#afoot {
    font-size: xx-small;
    font-family: verdana, tahoma, "bitstream vera sans", sans-serif;
    }
div#afoot a:link,
div#afoot a:visited,
div#afoot a:hover,
div#afoot a:active {
    color: black;
    text-decoration: none;
    }


/*  **************************
 *  style of header-info (#hi)
 */
div#hi {
    font-size: xx-small;
    font-family: verdana, tahoma, "bitstream vera sans", sans-serif;
    }


/*  ***********************
 *  style of surnames (.sn)
 */
span.sn {
    padding-left: 0.35em;       /* more inline word-spacing because of letter-spacing */
    padding-right: 0.35em;
    letter-spacing: 0.05em;     /* more letter-spacing because of all letters versal */
    text-transform: uppercase;
    }
#sifile span.sn {               /* do nothing in surnames index file for readability */
    padding: 0;
    letter-spacing: normal;
    text-transform: none;
    }
#pifile span.sn {
    font-weight: bold;
    }


/*  *********************
 *  style of family group
 */
table.famgroup {
    width: 100%;
    padding-left: 11pt;
    font-size: 9pt;
    background: white none;
    border: none;
    }
.famgroup th,
.famgroup td {
    padding: 2pt;
    vertical-align: top;
    border: 0.75pt solid white;
    }
.famgroup th {
    width: 10%;
    text-align: right;
    font-weight: normal;
    background: #e3e3e3 none; /* a lightgrey */
    }
.famgroup td {
    width: 40%;
    background: #f0f0f0 none; /* a lightgrey */
    }
.famgroup tr.hr td {
    background: white none; /* white on white */
    }
.famgroup tr.hr td hr {
    height: 1pt;
    color: #d3d3d3;
    border: none #d3d3d3;
    background: #d3d3d3 none;
    }
#fpfile div#abody h2 {
    padding: 5pt 0pt 2.5pt 10pt;
    border-color: black;
    border-width: 1pt 0pt 0pt 1pt;
    border-style: solid none none solid;
    }

/*  *****************************
 *  CSS-2 pseudoformat shows xref
 *  (the SPAN-id-attribute value)       (but only SPANs with id, not the surname-SPAN :-)
 */
#fpfile div#abody h2 span[id]:after {
    color: #d3d3d3;  /* lightgrey */
    content: " id: " attr(id);
    font-weight: normal;
    font-size: smaller;
    }


/*  ********************************
 *  style of individuals + relatives
 */
div.parent,
div.family,
#ipfile div#abody h3 {
    margin-left: 11pt;
    }
#ipfile div#abody h2 {
    padding: 5pt 0pt 2.5pt 10pt;
    border-color: black;
    border-width: 1pt 0pt 0pt 1pt;
    border-style: solid none none solid;
    }

/*  *****************************
 *  CSS-2 pseudoformat shows xref
 *  ( the H2-id-attribute value )
 */
#ipfile div#abody h2:after {
    color: #d3d3d3;  /* lightgrey */
    content: " id: " attr(id);
    font-weight: normal;
    font-size: smaller;
    }


/*  ******************
 *  style of pedigrees
 */
table.pedigree {
    width: 100%;
    font-size: 9pt;
    background: white none;
    border: none;
    }
.pedigree th,
.pedigree td {
    margin: 0;
    border: 0.75pt solid white;
    /*
    white-space: nowrap;
    */
    }
.pedigree th {
    padding: 4pt;
    text-align: left;
    background: #e3e3e3 none; /* lightgrey */
    font-family: verdana, tahoma, "bitstream vera sans", sans-serif;
    }
.pedigree td {
    padding: 2pt;
    background: #f0f0f0 none; /* a lighter lightgrey */
    }


/*  ********************
 *  links to p+s indices
 */
p.navhref {
    text-align: right;
    }
p.navhref a:link,
p.navhref a:visited,
p.navhref a:hover,
p.navhref a:active,
p.navhref a {
    padding: 6px;
    }


/*  **********************
 *  tabs of surnames-index
 */
h3.tabhref {
    text-align: center;
    }
h2.tabstop {
    padding: 2.5pt 0pt 2.5pt 10pt;
    border-color: black;
    border-width: 1pt 0pt 0pt 1pt;
    border-style: solid none none solid;
    }

#sifile div#abody p {
    padding-left: 11pt;
    }


/*  **********************************
 *  individual's GEDCOM-tagnames (.tn)
 */
dl.tn  {
    padding: 5pt;
    margin-left: 20pt;
    background-color: #f0f0f0;  /* a lighter lightgrey */
    }
dl.tn dt {
    font-size: 9pt;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 2.5pt;
    }
dl.tn dd {
    margin-bottom: 2.5pt;
    }

.pedigree td tt,
#ipfile ol li tt {      /* the <tt>+</tt> more-indicator */
    color: red;
    vertical-align: super;
    font-size: smaller;
    }
a.fn:before {
    content: " \0000B7";
    }