body
{
    font-family: verdana, sans-serif;
    font-size: 13px;
    color: #333333;
    box-sizing: border-box;
    background-color: #fff;
}
*, *:before, *:after {
    box-sizing: inherit;
  }
div.container
{
    max-width:1500px;
    padding: 10px 30px 18px 30px;
    color:#333;
}

h1.topofpage
{
    height:52px;
}

a {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

h1
{
    font-weight: bold;
    font-size: 24px;
}

h2
{
    font-weight: bold;
    font-size: 20px;
    margin-top:0px;
}

h3
{
    font-weight: bold;
    font-size: 16px;
    margin-block-end: 6px;
}

h4
{
    font-weight: bold;
    font-size: 14px;
    margin-block-end: 6px;
}

h5
{
    font-weight: bold;
    margin-block-end: 6px;
}

p.attribution
{
    font-size: 8pt;
}

.form-control {
    display: block;
    width: 100%;
    padding: 4px;
    line-height: 1.42857143;
    color: darkblue;
    background-color: #eee;
    border: 1px solid #ccc;
}

.btn {
    display: inline-block;
    padding: 4px 10px;
    margin-bottom: 0;
    font-weight: normal;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid #888;
    border-radius: 4px;
}

.btn-action {
    color: white;
    background-color: #1880a0;
}

.btn-sub {
    color: #831919;
    background-color: #eee;
}

.btn-link {
    color: white;
    background-color: #1880a0;
}

.btn-sm {
    padding: 0.25rem 0.5rem;
    font-size: .875rem;
    line-height: 1.5;
}

.navbar-form .form-control {
    display: inline-block;
    width: auto;
    vertical-align: middle;
}

.form-inline .form-control {
    display: inline-block;
    width: auto;
    vertical-align: middle;

}

.form-inline {
    background-color: #ddd;
    color: #333;    
}

table.form-table {
    max-width: 700px;
    background-color: #fff;
    color: #333;
}

table.form-table .form-control {
    width: auto;
    display: inline-block;
}

table.form-table td, th
{
    padding: 4px;
}

table.report
{
border: thin solid #333;
border-collapse:collapse;
background-color: #fff;
color:#333;
width: 100%;
}

table.report tbody > tr td
{
border: thin solid #333;
padding: 3px;
}

/* Search with results styles */
table.result {
    border:thin solid #ddd;
    border-collapse: collapse;    
    background-color: #fff;
    color: #333;
}
table.result tr:nth-of-type(even) {
    background-color: #666;
}
table.result th {
    text-align: left;
    border:thin solid #666;
    padding: 4px;
}
table.result td {
    text-align: left;
    border:thin solid #666;
    padding: 4px;
}

/* Styles used in search results */
tr.result td
{
padding: 4px;
}

tr.altresult
{
background-color: #eee;
}

td.subject
{
height: 60px;
background-color: #FFFFCC;
}

span.resultdetails
{
color: #008000;
font-size: 12px;
}

span.resultsiredam
{
font-size: 12px;
}

span.title
{
color: orangered;
}

.notice
{
font-size:12px;
background-color:#C0C0C0;
}

div.reportname
{
position: relative;
display: inline-block;
font-size: 14px;
}

div.printable
{
position: absolute;
top:4px;
right:10px;
}

div.headcontainer
{
display:flex;
width: 85%;
}

div.headleft {
    width:200px;
}

/* Styles used in pedigree */
div.subject
{
font-weight: bold;
font-size: 26px;
}

div.namewithtitles 
{
font-size: 26px;
}
.subjectcall {
    font-size: 16px;
    font-style: italic;
}

div.subjectdetails
{
color: #333;
font-size: 13px;
font-style: bold;
}

div.subjectlinks
{
font-size: 12px;
margin-top: 12px;
}

div.subjectlinks a
{
color: darkblue;
}

div.genlinks
{
color: darkblue;
margin: 6px 0px 4px 0px;
font-size: 12px;
}

div.genlinks a
{
color: #639aa3;
}

span.ancestor
{
font-size: 9pt;
}

span.ancestordetails
{
color: #333;
font-size: 12px;
word-break: break-word;
}

span.ancestorsiblings
{
color: #00B000;
font-size: 12px;
}

/* Styles used in site terms and conditions */
font.termsofuse
{
font-size: 13px;
}

font.termsofusebold
{
font-weight: bold;
font-size: 13px;
}

span.warning
{
color: Red;
font-size: 12px;
}

div.termsofuse
{
width:800px;
}

table.advanced th
{
background-color:ivory;
padding: 4px 0px 4px 0px;
font-weight:normal;
}

div.searchtitle
{
    color: #dc143c;
    font-size: 12pt;
    margin-bottom: 4px;
}

img.pedphoto
{
    border-width:thin;
    border-color: #aaaaaa;
    width: 180px;
}

footer
{
    margin-top: 10px;
    padding: 6px;
    background-color:#fff;
    color:#333;
}
div.blurb {
    font-size: smaller;
}
div.pagelinks {
    margin-top:6px;
    padding:6px;
}
div.pagelinks a
{
    padding: 0.25rem 0.5rem;
    line-height: 1.5;
    color: #333;
}

td.reportheader
{
height:60px;
position: relative;
}

ul.mainindex li
{
margin-bottom:30px;
list-style: none;
}
.pp-btn {
    background-color: #ddd;
    border: 1px solid #666;
    padding: 6px 12px;
    color:#831919;
}
.pp-btn:hover {
    text-decoration: none;
}
div.cellmarks
{
border: solid thin #333;
width:60px;
display: table-row;
}
span.mark
{
height: 10px;
width:30px;
display: table-cell;
}
span.sibhead {
    color:darkorange;
}
span.m_red
{
background-color:red;
}
span.m_orange
{
background-color:orange;
}
span.m_yellow
{
background-color:yellow;
}
span.m_green
{
background-color:green;
}
span.m_cyan
{
background-color:cyan;
}
span.m_blue
{
background-color:blue;
}
span.m_fuchsia
{
background-color:fuchsia;
}
span.m_purple
{
background-color:purple;
}
div.searchcellmarks
{
display:inline-block;
margin-left: 10px;
vertical-align: middle;
}
div.legend
{
margin-top:10px;
background-color: #fff;
color:#333;
padding: 4px;
}
div.legenditem
{
display:inline-block;
border:thin solid #333;
margin-left:6px;
padding:4px;
}
span.legendcolor
{
width:20px;
display:inline-block;
}
div.panel
{
box-sizing:border-box;
border: thin solid #333;
padding:20px;
}

ol {
    margin-block-start: 4px;
    margin-block-end: 4px;
}
ol li {
    margin-bottom: 4px;
}

.champion {
    color: red;
    font-weight: bold;
}
a.topofpage {
    padding-bottom: 10px;
    display: block;
    font-size: 24px;
    color: #333;
}
div.legendhead {
    display:inline-block;
}
table.search {
    width: 800px;
    border: thin solid #333333;
    border-collapse: collapse;
    color: #333;
    background-color: #fff;
}
table.search td {
    border: thin solid #333333;
    padding: 4px;
}
.ab {
    display: block;
}

span.abb::after {
    content: '\A\A';
    white-space: pre;
    line-height: 10px;
}
span.nick {
    display: block;
    padding-bottom: 8px;
    font-style: italic;
}
span.hip::before {
    content: 'HIP: ';
    display: block;
}
div.hi {
    text-decoration: underline;  
    margin-top:8px;  
}
div.healthsection
{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    text-align: left;
    gap:30px;
}
div.headsection
{
    text-align: left;
}
table.input {
    border-collapse: collapse;
    border: thin solid #333;
}

table.input td {
    padding: 4px;
    border: thin solid #333;
}
table.input td:first-child {
    width: 180px;
    background-color: ivory;
}
td.fieldvalue {
    width: 330px;
}
.ismale {
    background-color: #e6e6ff;
}
.isfemale {
    background-color: #ffe6e6;
}