/* Style */
body {
 margin:0;
 padding:0; /* Need to set body margin and padding to get consistency between browsers. */
 background-color:#d9c561;
 color:#ffc373;
 font-family:Helvetica,Arial,sans-serif;
}
body.groups {
 background-color:#fff1ab;
}
h1 {
 font-size:32px;
 font-weight:normal;
 padding-left:20px;
 margin:0;
}
h2 {
 color:#033e6b;
 font-size:24px;
 font-variant:small-caps;
 padding-top:0;
 padding-bottom:14px;
 border-bottom:medium double #a60000;
 border-bottom-width:thick;
}
h3 {
 color:#a60000;
 font-size:larger;
 font-weight:bolder;
 font-style:italic;
}
h4 {
 color:#033e6b;
}
p {
 padding-left:40px;
}
blockquote {
 color:#033e6b;
 font-style:italic;
}
ol,ul {
 padding-left:60px;
}
a:link {
 color:#033e6b;
 text-decoration:underline;
}
a:visited {
 color:#800080;
}
a:hover {
 color:#ff4040;
}
a:active {
 color:#0b6184;
}
img.tree {
 margin:0 20px 0 0;
}
.highlight {
 background:#ff0;
 font-weight:bold;
 padding:0 2px;
}
input[type="text"] {
background-color:#ffffb2;
}
input[type="text"].required {
background-color:#0ff;
}

/* Layout */
#hdr {
 height:38px;
 background:#a60000;
 color:#eee;
 border:solid #000;
 border-width:1px 0;
 margin:20px 0 0 0;
}
#lh-col {
 position:absolute;
 top:80px;
 left:20px;
 width:186px;
 border:1px solid #000;
 background:#fff1ab;
 color:#333;
 margin:0;
 padding:0;
 height:300px;
}
#lh-col p {
 text-align:center;
 font-weight:bolder;
 color:#033e6b;
 margin:12px 0 0 0;
 padding:0;
}
#rh-col,#rh-col-groups {
 margin:20px 20px 20px 230px;
 border:1px solid #000;
 background:#fff1ab;
 color:#333;
 padding-left:20px;
 padding-right:20px;
 position:relative;
}
#rh-col-groups {
 border:0;
}

/* Navigation menu */
#navcontainer {
 width:180px;
 text-align:center;
}
#navcontainer ul {
 margin-left:0;
 padding-left:0;
 list-style-type:none;
 font-family:Helvetica,Arial,sans-serif;
 font-size:12px;
 font-weight:normal;
}
#navcontainer a {
 display:block;
 padding:3px;
 width:180px;
 background-color:#a60000;
 border-bottom:1px solid #eee;
}
#navcontainer a:link,#navlist a:visited {
 color:#eee;
 text-decoration:none;
 font-weight:bold;
}
#navcontainer a:hover {
 background-color:#ff4040;
 color:#ffde40;
 font-weight:bold;
}
#navcontainer li a#current {
 background:#033e6b;
 color:#ff0;
 font-weight:bold;
 border-bottom:1px solid #eee;
}
#w3c {
 text-align:center;
}
#w3c img {
 border:0;
 width:88px;
 height:31px
}

/* Ancestry tables (group pages)*/
table.ancestry {
 border:1px solid #000;
 border-collapse:collapse;
 font-size:9.0pt;
 font-family:sans-serif;
 background-color:#fff; 
 margin:0 0 0 40px;
}
.ancestry th {
 border:1px solid #000;
 border-collapse:collapse;
 padding:2px 4px;
 font-weight:bold;
 background-color:#f5f5f5;
}
th.name {
 width:140px;
}
th.date {
 width:80px;
}
th.place {
 width:100px;
}
.ancestry td {
 padding:2px 4px;
 border:1px solid #000;
 border-collapse:collapse;
}
td.generations {
 width:10px;
 float:none;
 text-align:center;
}

/* Results page */
#bottom { /* this is a Layout element */
 position:absolute;
 top:400px;
 left:20px;
 border:1px solid #000;
 background:#fff1ab;
 color:#333;
 padding:15px;
}
#bottom p {
 width:700px;
 margin:0;
 padding:0 20px 15px;
}
table.results {
 border:1px solid #000;
 border-collapse:collapse;
 font-size:8.5pt;
 font-family:Arial,Helvetica,sans-serif;
 background:#fff;
 width:1400px;
}
.results caption {
 font-size:large;
 font-weight:bolder;
 font-variant:small-caps;
}
tr.group   {background:#fff;}
tr.group1  {background:#adff2f;}
tr.group2  {background:#ff0;}
tr.group3  {background:#add8e6;}
tr.group4  {background:#f0e68c;}
tr.group5  {background:#ffc0cb;}
tr.group6  {background:#d3d3d3;}
tr.group7  {background:#0ff;}
tr.group8  {background:#ffd700;}
tr.group9  {background:#e6e6fa;}
tr.group10 {background:#dda0dd;}
tr.group11 {background:#7fffd4;}
tr.group12 {background:#ffc0cb;}
tr.group13 {background:#ff7f50;}

.results th {
 color:#00f;
 border:1px solid #000;
 vertical-align:top;
 text-align:center;
 background:#f5f5f5;
 padding:1px;
 width:13px;
}
th.dys,th.kit,th.ancestor,th.haplo,th.groupheader {
 color:#000;
 vertical-align:middle;
 width:auto;
}
th.dys {
 background:#ff0;
}
th.ancestor {
 width:320px;
}
th.red {
 color:#f00;
}
th.groupheader {
 border:1px solid #000;
 border-top-width:4px;
 font-size:9.0pt;
 text-align:left;
 font-weight:bold;
 padding:2px 5px;
}
.results td {
 border:1px solid #000;
 padding:1px;
 text-align:center;
}
td.kit {
 font-size:9.0pt;
}
td.ancestor {
 text-align:left;
}
td.haplo {
 color:#f00;
 font-weight:bold;
}
td.haploconfirmed {
 color:#008000;
 font-weight:bold;
}
td.haploblank {
 color:#000;
 font-weight:bold;
}
.slow {
 color:#fff;
 font-weight:bold;
 background:#00f;
}
.fast {
 color:#fff;
 font-weight:bold;
 background:#f00;
}