/** CSS for TreeView module - Daniel Faivre, 2011
 *
 * WARNING : DO NOT edit this file !!! To create a theme for the treeview module,
 * just add in your theme's CSS file the properties you want to customize according to your theme
 * All the properties that can be styled in your own theme are followed with the comment "customizable"
 * CSS classes should allways be declared under their container to avoid unwanted side effects and speed-up CSS drawing.
 *
 * DO NOT change ANYTHING else : changing others parameters without extreme caution AND complete cross-browser validation DESTROY the tree design !!!
 *
 * Treeview styles: this module can print pretty big trees and offer different styles for the tree itself, for screen, printing, or both.
 * Look at the embedded samples in the /treeview/css/styles directory to learn how to make your own tree styles.
 */

.tv_out {
  position: relative;
  overflow: hidden;
  height: 100%;
  width: 100%;
  border: thin solid #dfdfdf; /* customizable */
  min-height: 500px; /* customizable, not mandatory, but should be set to have allways something to display */
  max-height: 10000px; /* customizable, not mandatory, but should be set not too high to limit the size of ajax requests and not too low to enable whole big trees printing */
  /* background: #fffff8; /* customizable */
}
.tv_out img {
  border: 0;
}

.tv_in {
	clear: both;
  position: relative; /* required for re-calculating size on ajax updates */  
  left: 0;
  top: 0;
  cursor: move;
  display: inline-block; /* prevent from blinking on IE */
}
.tv_in table.tv_tree, .tv_in table.tv_tree tbody, .tv_in table.tv_tree tr, .tv_in table.tv_tree td {
  border: 0 none;
  padding: 0;
  margin: 0;
  background: none;
}
.tv_in table.tv_tree {	
  border-collapse: collapse;
}

/* Border (also need, and have, class table.tv_tree) */
table#tvTreeBorder td#tv_tree_topleft {
  height: 50px;
  width: 50px;
  background: url(treetopleft.gif); /* customizable */
}
table#tvTreeBorder td#tv_tree_top {
  height: 50px;
  text-align: center;
  vertical-align: bottom;
  background: url(treetop.gif) repeat-x; /* customizable */
}
table#tvTreeBorder td#tv_tree_top div{
  font-family: Garamond, Times, serif; /* customizable */
  font-size: 16px; /* customizable */
}
table#tvTreeBorder td#tv_tree_topright {
  height: 50px;
  width: 50px;
  background: url(treetopright.gif); /* customizable */
}
table#tvTreeBorder td#tv_tree_left {
  width: 50px;
  min-width: 50px;
  background: url(treeleft.gif) repeat-y; /* customizable */
}
table#tvTreeBorder td#tv_tree_right {
  width: 50px;
  min-width: 50px;
  background: url(treeright.gif) repeat-y; /* customizable */
}
table#tvTreeBorder td#tv_tree_bottomleft {
  height: 50px;
  width: 50px;
  background: url(treebottomleft.gif); /* customizable */
}
table#tvTreeBorder td#tv_tree_bottom {
  height: 50px;
  background: url(treebottom.gif) repeat-x; /* customizable */
}
table#tvTreeBorder td#tv_tree_bottomright {
  height: 50px;
  width: 50px;
  background: url(treebottomright.gif); /* customizable */
}

/* tree */
#tv_tree {
  background: url(tree.jpg); /* customizable */
}
/* horizontal and vertical lines color */
#tv_tree div.tv_vline, #tv_tree div.tv_hline {
  background-color:  #81A9CB; /* customizable : should be the same color than in background images of td.tv_vline_x */
}

/* TD container for a vertical line */
#tv_tree table.tv_tree td.tv_vline {
  width: 1px;
  background-repeat: repeat-x;
  background-position: 50% 50%;
  height: 100%; /* required */
}
#tv_tree table.tv_tree td.tv_vline_h {
  background-image: url(vline.jpg); /* customizable : image color must be the same color than div.tv_vline and div.tv_hline */
}
#tv_tree table.tv_tree td.tv_vline_t {
  vertical-align: bottom;
  background-image: url(vline_t.gif); /* customizable : image color must be the same color than div.tv_vline and div.tv_hline */
}
#tv_tree table.tv_tree td.tv_vline_b {
  vertical-align: top;
  background-image: url(vline_b.gif);  /* customizable : image color must be the same color than div.tv_vline and div.tv_hline */
}
#tv_tree table.tv_tree td.tv_vline_c, .tv_in table.tv_tree td.tv_vline_h {
  vertical-align: middle;
}
#tv_tree table.tv_tree td.tv_vline_c {
  height: 1px;
}
/* vertical line drawing */
#tv_tree table.tv_tree div.tv_vline {
  width: 1px;
}
#tv_tree table.tv_tree div.tv_vline_t, #tv_tree table.tv_tree div.tv_vline_b {
  height: 50%;
}
#tv_tree table.tv_tree div.tv_vline_c {
  height: 1px;
	overflow: hidden; /* required for IE */
}
#tv_tree table.tv_tree div.tv_vline_h {
  height: 100%;
}

/* horizontal line drawing */
#tv_tree td.tv_hline, #tv_tree div.tv_hline {
	overflow: hidden; /* required for IE */
  width: 8px; /* customizable */
}
#tv_tree div.tv_hline {
  height: 1px;
}

/* Person or couple(s) box style */
#tv_tree div.tv_box {
  border: thin outset #81A9CB; /* customizable */
  background: #fffdfd; /* customizable */
  margin-top: 2px;
  margin-bottom: 2px;
  padding: 0;
  width: 180px; /* customizable: initial box width */
  cursor: help; /* customizable */
  border-collapse: collapse; /* required */
  border-radius: 4px; /* customizable */
  box-shadow: 1px 1px 2px #cfcfdf; /* customizable */
  filter: progid:DXImageTransform.Microsoft.dropShadow(color=#cfcfdf, offX=1, offY=1, positive=true); /* customizable */
}
#tv_tree div.boxExpanded {
  width: 250px; /* customizable: initial expanded box width */
}
#tv_tree div.tv_box div.tvM {
  background:  #f5fdff; /* customizable */
  color: #220000; /* customizable */
}
#tv_tree div.tv_box div.tvF {
  background:  #fff8f5; /* customizable */
  color: #000022; /* customizable */
}
#tv_tree div.tv_box span.tvSexSymbol {
	font-weight: bold;
	font-family: x-large, serif; /*Arial Unicode MS, monospace; customizable, BUT test required for ALL browsers */
  vertical-align: top;
  margin: 1px;
}
#tv_tree div.tv_box span.tvM {
	color: #8f8fdf; /* customizable */
}
#tv_tree div.tv_box span.tvF {
	color: #df8f8f; /* customizable */
}

#tv_tree div.tv_box div.tvM, #tv_tree .tv_box div.tvF {
  border: 0;
  margin: 0;
  padding: 1px;
  padding-left: 4px;
  padding-right: 4px;
  border-radius: 4px; /* customizable */
}
#tv_tree div.tv_box i.dates {
	float: right;
	font-size: 75%;
	margin-left: 4px;
}
#tv_tree div.tv_box img.tv_treelink {
  height: 15px;
  width: 15px;
  float: right;
}
#tv_tree div.tv_box img.tv_box_loading {
  height: 12px;
  width: 12px;
  margin: 2px;
  float: right;
}
#tv_tree div.tv_box div.tv_person_expanded {
  min-height: 50px;
  padding: 2px;
}
#tv_tree div.tv_box img.pedigree_image_portrait, #tv_tree div.tv_box img.pedigree_image_landscape {
  max-width: 50px;
  _width: 50px; /* hack for IE versions that do not understand max-width */
  max-height: 50px;
  margin: 2px;
}
#tv_tree div.tv_box div.tv_person_expanded a {
  font-weight: bold;
}

/* The toolbox style. Button's images come from the active theme */
#tv_tools, #tvStylesSubmenu {
  display: inline-block;
  position: absolute;
  left: 0;
  top: 0;
 	padding: 0;
 	margin: 0; /* required */
  z-index: 90; /* should be < 100 because 100 is the z-index of WT menus */
  background-color: #efefef; /* customizable */
  border: 1px outset #dfdfdf; /* customizable */
  border-radius: 4px; /* customizable */
  box-shadow: 1px 1px 2px #cfcfdf; /* customizable */
  filter: progid:DXImageTransform.Microsoft.dropShadow(color=#cfcfdf, offX=1, offY=1, positive=true); /* customizable */  
}

/* styles submenu */
#tvStylesSubmenu {
	display: none;
  left: 0;
  top: 0;
	z-index: 91; /* just over  tv_tools */ 
}

#tv_tools ul {
  list-style: none;
  margin: 0;
  padding: 0; /* required */
}
#tv_tools li.tv_button {
	float: left;
	position: relative;
  padding: 0; /* required */
 	margin: 0;
  width: 24px;
  height: 24px;
  text-align: center;
  vertical-align: middle;
  border: thin solid #efefef; /* customizable */
  background-color: #efefef; /* customizable */
  border-radius: 4px;
}
#tvStylesSubmenu li.tv_button {
	float : none;
}
#tv_tools li.tv_button a {
  margin: 0;
  display: block;
}
#tv_tools li.tv_button:hover {
  background: #fffdfd; /* customizable */
  border: thin outset #fdfffd; /* customizable */
  cursor: pointer;
}
.tv_button a:hover, a:active {
  background: #fffdfd; /* customizable */
}
#tv_tools li.tvPressed {
  border: thin inset #ffffff; /* customizable */
}
#tv_tools ul li img {
  border: none;
  margin: 0;
  padding: 0;
  max-width: 22px;
  max-height: 22px;
  _width: 22px; /* hack for ie */
  _height: 22px; /* hack for ie */
  cursor: pointer;
  text-align: center;
  vertical-align: middle;
}
#tv_tools ul li a.help img.icon {
  margin: 0;
  margin-top: 3px;
  padding: 0;
  width: 15px;
  height: 15px;
}

#tvToolsHandler {
	float: left;
  cursor: move;
  height: 22px;
  width: 2px;
  border: thin inset #f6f6f6; /* customizable */
  margin: 2px;
  overflow: hidden; /* required for IE */
}

#tvToolsHandler:hover {
  border: thin outset #f6f6f6; /* customizable */
}