/* ------------ Tree --------------- */
#tree {
  position: relative;
  /*overflow: hidden;*/
}

#tree .vscroll { display: none; }
#tree .hscroll { display: none; }

/*
#tree .vscroll {
  position: absolute;
  left: 100%;
  margin-left: -16px;
  width: 16px;
  top: 0%;
  height: 24.99em;
  background-color: green;
  opacity: .5;
}

#tree .hscroll {
  position: absolute;
  left: 0%;
  width: 100%;
  top: 100%;
  margin-top: -16px;
  margin-right: 1em;
  height: 16px;
  background-color: red;
  opacity: .5;
}
*/

#tree #treeframe {
  margin-right: 16px;
  margin-bottom: 16px;
  position: relative;
  height: 100%;
  overflow: hidden;
  background: url(bg.php) repeat 50% 50%;
  font-size: 70%;
}

#tree #treeframe-inner {
  /*width: 100%;*/
  position: relative;
  left: 0px;
  top: 0px;
  overflow: hidden;
  padding: 0px;
  height: 100%;
  
}

#tree #treeframe-primary {
  position: absolute;
  left: 0em;
  top: 0em;
  height: 20em;
  width: 100%;
  overflow: hidden;
}

#tree #treeframe-children {
  position: absolute;
  left: 0em;
  top: 9em;
  width: 100%;
  height: 30em;
  overflow: hidden;
}

#tree img { border: none; }

#tree .marriagelink {
  height: 1em;
  text-align: center;
  border-bottom: 1px solid #651313;
}

#tree .marriagelinkdummy {
  height: 1em;
  text-align: center;
  border-bottom: 1px dotted #651313;
}

#tree .marriagelink span {
  font-size: 80%;
  display: none;
}

#tree .marriagelink em {
  font-size: 80%;
  font-style: normal;
}

#tree .spouseswitcher {
  /*border: 1px solid #800B10; */
  text-align: center;
  /*background-color: #DAB359;*/
  color: #800B10;
  padding-top: 2px;
}

#tree ul.nodisplay, #tree ul.nodisplay li {
  position: absolute;
  left: 0%;
  top: 0%;
  width: 100%;
  height: 100%;
  margin: 0px;
  padding: 0px;
  list-style: none;
}

#tree h3.nodisplay, #tree h4.nodisplay, #tree hr.nodisplay {
  display: none;
}

#tree #treeBorderTop {
  position: absolute;
  left: 0%;
  top: 0%;
  width: 100%;
  height: 32px;
  background: url(skin/border-top.png) no-repeat 0% 0%;
  z-index: 1000;
}

* html #tree #treeBorderTop {
  background: transparent;
  filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='skin/border-top.png', sizingMethod=crop);
}


#tree #treeBorderBottom {
  position: absolute;
  left: 0%;
  top: 100%;
  width: 100%;
  margin-top: -48px;
  height: 32px;
  background: url(skin/border-bottom.png) no-repeat 0% 0%;
  z-index: 2000;
}

* html #tree #treeBorderBottom {
  background: transparent;
  filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='skin/border-bottom.png', sizingMethod=crop);
  margin-top: -47px;
}

#tree #treeBorderLeft {
  position: absolute;
  left: 0%;
  top:  0%;
  width: 32px;
  height: 100%;
  background: url(skin/border-left.png) no-repeat 0% 0%;
  z-index: 1001;
}

* html #tree #treeBorderLeft {
  background: transparent;
  filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='skin/border-left.png', sizingMethod=crop);
  height: expression(this.parentNode.offsetHeight + "px");
}


#tree #treeBorderRight {
  position: absolute;
  left: 100%;
  top: 0%;
  width: 32px;
  height: 100%;
  margin-left: -48px;
  background: url(skin/border-right.png) no-repeat 0% 0%;
  z-index: 1001;
}

* html #tree #treeBorderRight {
  background: transparent;
  filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='skin/border-right.png', sizingMethod=crop);
  height: expression(this.parentNode.offsetHeight + "px");
  margin-left: -48px;
}

#tree .node {
  position: absolute;
  border: 1px solid #800B10; 
  text-align: center;
  background-color: #DAB359;
  color: #800B10;
  font-family: Georgia, serif;
  margin: 0px;
  padding: 0px;
  text-indent: 0px;
}

#tree .node-primary {
  position: absolute;
  border: 2px solid #800B10; 
  text-align: center;
  background-color: #DAB359;
  color: #800B10;
  font-family: Georgia, serif;
  font-weight: bold;
}

#tree .node-spouse {
  position: absolute;
  border: 1px solid #800B10; 
  text-align: center;
  background-color: #EDDA94;
  color: #800B10;
  font-family: Georgia, serif;
}

#tree .node-dummy {
  border: 1px dotted #800B10; 
  /*background-color: #ffffcc;*/
  background: transparent;
  color: #800B10; 
  font-weight: normal;
  font-style: italic;
}

#tree .node a.fulllink {
  position: absolute;
  left: 0%; top: 0%; width: 100%; height: 100%;
  border-right: 2px solid #BFBF98;
  border-bottom: 2px solid #BFBF98;
  margin-top: 1px;
  margin-left: 1px;
}

#tree .node-primary a.fulllink { margin-left: 2px; margin-top: 2px; }

#tree .node .name { display: block; }

#tree .node-dummy .name { padding-top: 1em; }

#tree .node .lifespan { display: block; color: #9B3E30; font-size: 80%; font-style: italic; }

#tree .node a:link {
  text-decoration: none;
  color: #651313;
}

#tree .node a:visited {
  text-decoration: none;
  color: #651313;
}

#tree .node a:hover {
  text-decoration: none;
  color: #800B10;
}

#tree .node a:active {
  text-decoration: none;
  color: #800B10;
}

/*
#tree .node a.biolink {
  position: absolute;
  left: -.35em;
  bottom: -.35em;
  width: 2em;
  height: 1em;
  background-color: #800B10; 
  color: #FAF6BD;
}
*/

#tree .node a.biolink {
  position: absolute;
  left: .25em;
  bottom: .25em;
  width: 16px;
  height: 16px;
  /*text-indent: -10000px;
  background: url(info.gif);*/
  display: block;
}

/*
#tree .node a.editlink {
  position: absolute;
  left: 3em;
  bottom: -.35em;
  width: 2em;
  height: 1em;
  background-color: #800B10; 
  color: #FAF6BD;
}*/

#tree .node a.editlink {
  position: absolute;
  right: .25em;
  bottom: .25em;
  width: 32px;
  height: 16px;
  /*background-color: #800B10; 
  color: #FAF6BD;*/
}

#tree .spouseswitcher .spousebtn {
  top: 0%; width: 1em; height: 1em;
}

#tree a.minibtn {
  text-decoration: none;
  display: block;
  text-align: center;
}

#tree a.minibtn:link, #tree a.minibtn:visited {
  background-color: #AE6036; 
  color: #FEFECB;
  border-left: 2px solid #C48C4A;
  border-top: 2px solid #C48C4A;
  border-right: 2px solid #800B10;
  border-bottom: 2px solid #800B10;
}

#tree a.minibtn:hover {
  background-color: #B67252;
  color: #FEFECB;
  border-left: 2px solid #DEC099;
  border-top: 2px solid #DEC099;
  border-right: 2px solid #A0483E;
  border-bottom: 2px solid #A0483E;
}

#tree a.minibtn:active {
  background-color: #AE6036;
  color: #FEFECB;
  border-left: 2px solid #A0483E;
  border-top: 2px solid #A0483E;
  border-right: 2px solid #DEC099;
  border-bottom: 2px solid #DEC099;
}

#tree a.minibtn span {
  position: absolute;
  left: 0%; top: 0%; width: 100%; height: 100%;
  border-right: 1px solid #440D0E;
  border-bottom: 1px solid #440D0E;
  margin-top: 2px;
  margin-left: 2px;
  /*display: block;*/
  font-size: 70%;
  line-height: 1em;
}

* html #tree a.minibtn span { cursor: hand; }

#tree .disabledminibtn {
  background: #D7B082;
  border-left: 2px solid #E2C68C;
  border-top: 2px solid #E2C68C;
  border-right: 2px solid #C0856F;
  border-bottom: 2px solid #C0856F;
  color: #FFFFCD;
  display: block;
}

#tree .disabledminibtn span {
  position: absolute;
  left: 0%; top: 0%; width: 100%; height: 100%;
  border-right: 1px solid #A2866E;
  border-bottom: 1px solid #A2866E;
  margin-top: 2px;
  margin-left: 2px;
  display: block;
  font-size: 70%;
  line-height: 1em;
}

* html #tree .disabledminibtn span { cursor: arrow; }

/* ------------------------------------- */

/*
#tree h2 {
  position: absolute;
  left: 32px;
  top: 32px;
}
*/

#floatingFrameHolder {
  position: absolute;
  left: 100%;
  width: 30%;
  margin-left: -48px;
  top: 24px;
  height: 80%;
  /*border: 2px solid red;*/
}

.floatingFrame {
  position: relative;
  font-size: 80%;
  left: -12em;
  width: 12em;
  height: 10em;
  overflow: hidden;
  background-color: #ffffcc;
  opacity: 0.75;
  filter:alpha(opacity=75);
  border: .25em solid black;
  color: black;
}

.floatingFrameInner {
  position: absolute;
  /*
  width: 11.65em;
  height: 14.65em;
  */
  width: 100%; height: 100%;
  margin: 0px;
  /*padding: .2499em;*/
  padding: 0px;
  overflow: hidden;
  opacity: .99;
  filter:alpha(opacity=99);
}

.floatingFrame h3 {
  border-bottom: 2px solid black;
  margin: 0px;
  padding: 2px;
  font-size: 120%;
  background-color: #eedb96;
}

.floatingFrame p {
  margin: 0px;
  padding: 0px;
  text-align: justify;
}