.fredPed2
{color:blue;font-weight:bold;}

      body {

      background-attachment: fixed;

      background-image: url(yourImage.gif);

      background-repeat: no-repeat;

      background-position: right top;

      }

div#page {
  position: relative;
  top: 3px;
  margin-left: auto;
  margin-right: auto;
  width: 999px;
}
div#bodyFix {
  position: relative;
  top: 10px;
  margin-left: auto;
  margin-right: auto;
  width: 999px;

}


div#footer {
  position: relative;
  top: 94em;
  margin-left: auto;
  margin-right: auto;
  width: 999px;

}

fieldset {
  font-weight:bold; font-size: 18px;
  border-color: green;
}

table#vLine1 {
  position: absolute;
  top: 10em;
  left: 400px;  /* Because top and right are defined, appears in top right */
  width: 8px;
  height: 95px;
  background: green;
}
table#hLine1 {
  position: absolute;
  top: 10em;
  left: 400px;  /* Because top and right are defined, appears in top right */
  width: 40px;
  height: 8px;
  background: green;
}
table#vLine2 {
  position: absolute;
  top: 22.3em;
  left: 400px;  /* Because top and right are defined, appears in top right */
  width: 8px;
  height: 95px;
  background: green;
}
table#hLine2 {
  position: absolute;
  top: 28em;
  left: 400px;  /* Because top and right are defined, appears in top right */
  width: 40px;
  height: 8px;
  background: green;
}

table#vLine3 {
  position: absolute;
  top: 46em;
  left: 400px;  /* Because top and right are defined, appears in top right */
  width: 8px;
  height: 95px;
  background: green;
}
table#hLine3 {
  position: absolute;
  top: 46em;
  left: 400px;  /* Because top and right are defined, appears in top right */
  width: 40px;
  height: 8px;
  background: green;
}
table#vLine4 {
  position: absolute;
  top: 58.3em;
  left: 400px;  /* Because top and right are defined, appears in top right */
  width: 8px;
  height: 95px;
  background: green;
}
table#hLine4 {
  position: absolute;
  top: 64em;
  left: 400px;  /* Because top and right are defined, appears in top right */
  width: 40px;
  height: 8px;
  background: green;
}
table#vLine5 {
  position: absolute;
  top: 22.3em;
  left: 332px;  /* Because top and right are defined, appears in top right */
  width: 8px;
  height: 22px;
  background: green;
}
table#hLine5 {
  position: absolute;
  top: 23.5em;
  left: 230px;  /* Because top and right are defined, appears in top right */
  width: 110px;
  height: 8px;
  background: green;
}
table#vLine6 {
  position: absolute;
  top: 24.5em;
  left: 332px;  /* Because top and right are defined, appears in top right */
  width: 8px;
  height: 439px;
  background: green;
}
table#hLine6 {
  position: absolute;
  top: 24.5em;
  left: 200px;  /* Because top and right are defined, appears in top right */
  width: 140px;
  height: 8px;
  background: green;
}

table#vLine7 {
  position: absolute;
  top: 20em;
  left: 200px;  /* Because top and right are defined, appears in top right */
  width: 8px;
  height:80px;
  background: green;
}

table#hLine7 {
  position: absolute;
  top: 20em;
  left: 230px;  /* Because top and right are defined, appears in top right */
  width: 8px;
  height:64px;
  background: green;
}



div#horse{
  position: absolute;
  top: 0em;
  left: 8%;  /* Because top and right are defined, appears in top right */
  width: 60%;
  color:green;font-weight:bold;
  font-size: 40px;
}

.pedH4 {
  color:green;font-weight:bold;
  font-size: 26px;
}

div#horsePic {
  position: absolute;
  top: 10em;
  left: 2%;  /* Because top and right are defined, appears in top right */
  width: 27%;
  color:green;font-weight:bold;
  background-color: green;
}

div#horsePic1 {
  position: absolute;
  top: 28em;
  left: 3%;  /* Because top and right are defined, appears in top right */
  width: 24%;
  color:green;font-weight:bold;
}
div#horsePic2 {
  position: absolute;
  top: 47em;
  left: 3%;  /* Because top and right are defined, appears in top right */
  width: 24%;
  color:green;font-weight:bold;
}
div#horsePic3 {
  position: absolute;
  top: 66em;
  left: 3%;  /* Because top and right are defined, appears in top right */
  width: 24%;
  color:green;font-weight:bold;
}


div#horsePic4 {
  position: absolute;
  top: 70em;
  left: 32%;  /* Because top and right are defined, appears in top right */
  width: 24%;
  color:green;font-weight:bold;
}

div#horsePic5 {
  position: absolute;
  top: 74em;
  left: 61%;  /* Because top and right are defined, appears in top right */
  width: 24%;
  color:green;font-weight:bold;
}

div#father {
  position: absolute;
  top: 16em;
  left: 30%;
  width: 22%;
  color:brown;font-weight:bold;
}
div#mother {
  position: absolute;
  top: 52em;
  left: 30%;
  width: 22%;
  color:brown;font-weight:bold;
}

/* Grand Ancestry is below */
div#grandFather1 {
  position: absolute;
  top:  7em;
  left: 44%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:red;font-weight:bold;
}

div#grandMother1 {
  position: absolute;
  top: 25em;
  left: 44%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:red;font-weight:bold;
}

div#grandFather2 {
  position: absolute;
  top:  43em;
  left: 44%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:red;font-weight:bold;
}

div#grandMother2 {
  position: absolute;
  top: 62em;
  left: 44%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:red;font-weight:bold;
}

/* Great Grand Ancestry is below */
div#greatGrandFather1 {
  position: absolute;
  top: 2em;
  left: 62%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:blue;font-weight:bold;
}
div#greatGrandMother1{
  position: absolute;
  top: 11em;
  left: 62%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:blue;font-weight:bold;
}

div#greatGrandFather2 {
  position: absolute;
  top: 20em;
  left: 62%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:blue;font-weight:bold;
}
div#greatGrandMother2{
  position: absolute;
  top: 29em;
  left: 62%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:blue;font-weight:bold;
}
/* above here works */

div#greatGrandFather3 {
  position: absolute;
  top: 39em;
  left: 62%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:blue;font-weight:bold;
}
div#greatGrandMother3{
  position: absolute;
  top: 48em;
  left: 62%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:blue;font-weight:bold;
}

div#greatGrandFather4 {
  position: absolute;
  top: 57em;
  left: 62%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:blue;font-weight:bold;
}
div#greatGrandMother4{
  position: absolute;
  top: 66em;
  left: 62%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:blue;font-weight:bold;
}


/* Great Great Grand Ancestry is below */
div#greatGreatFather1 {
  position: absolute;
  top: 1em;
  left: 81%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:magenta;font-weight:bold; 
}
div#greatGreatMother1 {
  position: absolute;
  top: 5em;
  left: 81%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:magenta;font-weight:bold;
}
div#greatGreatFather2 {
  position: absolute;
  top: 10em;
  left: 81%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:magenta;font-weight:bold;
}
div#greatGreatMother2 {
  position: absolute;
  top: 14em;
  left: 81%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:magenta;font-weight:bold;
}

div#greatGreatFather3 {
  position: absolute;
  top: 19em;
  left: 81%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:magenta;font-weight:bold;
}
div#greatGreatMother3 {
  position: absolute;
  top: 23em;
  left: 81%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:magenta;font-weight:bold;
}

div#greatGreatFather4 {
  position: absolute;
  top: 28em;
  left: 81%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:magenta;font-weight:bold;
}
div#greatGreatMother4 {
  position: absolute;
  top: 32em;
  left: 81%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:magenta;font-weight:bold;
}

div#greatGreatFather5 {
  position: absolute;
  top: 38em;
  left: 81%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:magenta;font-weight:bold;
}
div#greatGreatMother5 {
  position: absolute;
  top: 42em;
  left: 81%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:magenta;font-weight:bold;
}

div#greatGreatFather6 {
  position: absolute;
  top: 47em;
  left: 81%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:magenta;font-weight:bold;
}
div#greatGreatMother6 {
  position: absolute;
  top: 51em;
  left: 81%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:magenta;font-weight:bold;
}


div#greatGreatFather7 {
  position: absolute;
  top: 56em;
  left: 81%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:magenta;font-weight:bold;
}
div#greatGreatMother7 {
  position: absolute;
  top: 60em;
  left: 81%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:magenta;font-weight:bold;
}

div#greatGreatFather8 {
  position: absolute;
  top: 65em;
  left: 81%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:magenta;font-weight:bold;
}
div#greatGreatMother8 {
  position: absolute;
  top: 69em;
  left: 81%;  /* Because top and right are defined, appears in top right */
  width: 16%;
  color:magenta;font-weight:bold;
}