/* Family */
.family .dropdown-menu{
    transform: translate3d(0px, 25px, 0px)!important;
	line-height:1.3;
	font-size:15px;
    width: 200px !important;
}


    
.family .dropdown-item{
    padding: 5px 0 0 10px;
	margin:0;
}

.family .dropdown-item .icon {
	text-align:center;width:25px;float:left;
}
.family .dropdown-item .icon2 {
	text-align:center;margin-left:25px;width:25px;float:left;
}

.family {
	margin:auto;
	min-width: 750px;
	max-width: 960px;
	font-family:'Fira Sans', sans-serif;
	font-size:15px;
} 

.family .dropdown-toggle::after {
    display:none;
}

.family .bloodline {
	position:absolute; right:2px; line-height:0; text-align:right;
}
	
.family .tp-cell {
	position:relative;
	width: 245px; 
	border-radius: 5px;
	margin:0 auto;
}

.tp-cell-parent {
	width: 250px; 
	border-radius: 5px;
	position:relative;
}
.family td {
 padding:0;
 }


.family .tp-mp-cell {
	position:relative;
	width: 245px; 
	border: 1px groove darkgray; 
	border-radius: 5px;
	margin:0 10px 20px 10px;
}

.family .person {
	padding: 6px;
}

.family .person .name{
	text-align: center;
	font-weight: 500;
	line-height: 1.3;
	font-size:15px;
	margin-bottom:3px;
}	

.family .main-person {
	padding: 10px;
}

.family .main-person .name{
	font-size:18px; line-height:1.3; font-weight:500;
}	


.family .person .detail{
text-align: left;
font-size: 14px;
line-height: 1.25;	
}	

.family .person .detail .section  {
	margin-top:2px;
}

.family .person .detail .section .label {
	float:left;
}

.family .person .detail .section .content {
	margin-left:17px;
}

.family .main-person .detail{
text-align: left;
line-height: 1.25;	
font-family:'Fira Sans', sans-serif;
font-size:15px;
font-weight:400;
}	

.family .main-person .detail .section  {
	margin-top:5px;
}

.family .main-person .detail .section .label {
	float:left;
}

.family .main-person .detail .section .content {
	margin-left:18px;
}

.family .main-cell {
	margin:auto;
	max-width:325px;
}

.family .main-photo {
	width:200px;
	margin:auto;
	text-align:center;
}


.family .main-photo img {
	display:block;
	margin:auto;
	box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.2);
	padding:2px;
	background-color:#eeeeee;
	border:1px solid gray;
}
.family .main-note {
	overflow:hidden;
	max-width:265px;
	margin:10px auto;
	font-size:13px;
	line-height: 1.3;	
	padding:8px;
	box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.2);
}

.family .main-note .brk {
	height:4px;line-height:4px;
}

.family .camicon {
	float:left;
	font-size:14px;
	line-height:1;
	margin:2px 10px 2px 4px;
}

.tp-bg-dark .family .camicon {
	color:DarkGray;
}

.tp-bg-light .family .camicon {
	color:DimGray;
}

.tp-bg-dark .family .tp-cell {
	border: 1px solid #eeeeee; 
}

.tp-bg-dark .family .tp-cell-parent {
	border: 1px solid #eeeeee; 
}

.tp-bg-light .family .tp-cell  {
	border: 1px solid gray; 
	background: rgba(255, 255, 255, 0.1);
}

.tp-bg-light .family .tp-cell-parent  {
	border: 1px solid gray; 
	background: rgba(255, 255, 255, 0.1);
}

.tp-bg-dark .family .main-note {
	background: rgba(125, 125, 125, 0.1);
	
}

.tp-bg-light .family .main-note  {
	background: rgba(255, 255, 255, 0.1);
}


/* Ancestors */
.ancestors { font-family: Verdana, Arial, Helvetica, sans-serif;}


.ancestors {
	position: relative;
	margin:auto;
} 

.ancestors .tp-cell {
	position:absolute;
	width: 255px; height: 50px;
	border: 1px solid olive; 
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
	box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.2);
}

.ancestors .tp-cell-female {
	position:absolute;
	width: 255px; height: 50px;
	background-color:#FEEAEA;
	border: 1px solid olive; 
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
	box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.2);
}

.ancestors .tp-cell-male {
	position:absolute;
	width: 255px; height: 50px;
	background-color:#EAEAFE;
	border: 1px solid olive; 
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
	box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.2);
}

.ancestors .tp-cell-no-photo {
	position:absolute;
	width: 205px; height: 50px;
	background: rgba(255, 255, 255, 0.5);
	border: 1px solid olive; 
	border-radius: 5px;
	box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.2);
}

.ancestors .tp-cell-np-male {
	position:absolute;
	width: 205px; height: 50px;
	background-color:#EAEAFE;
	border: 1px solid olive; 
	border-radius: 5px;
	box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.2);
}

.ancestors .tp-cell-np-female {
	position:absolute;
	width: 205px; height: 50px;
	background-color:#FEEAEA;
	border: 1px solid olive; 
	border-radius: 5px;
	box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.2);
}

.ancestors .person {
	color:black;
	padding:4px;
	text-align: center;
}

.ancestors .bloodline {
	position:absolute; right:2px; line-height:0; text-align:right;
}
.ancestors .person .name {
	text-overflow: ellipsis;
	white-space: nowrap; overflow:hidden;
	padding:0 5px 0 5px;
}

.ancestors .person .name a {
	color: black;
}

.ancestors .person .name a:hover {
	color: blue;
}

.ancestors .person .dates {
}

.ancestors .photo {
	padding: 0;
	float: left;
}

/* Photo Tree */
.photo-tree-cell {
	width:170px;
	aborder:1px solid black;
	margin:5px auto;
	abackground: rgba(0, 0, 0, 0.1);
}

.photo-tree-cell .photodiv {
	height:127px;
	background: rgba(0, 0, 0, 0.1);
}

.photo-tree-cell .name {
	font-family:'Fira Sans', sans-serif;
	font-size:13px;
	text-align:center;
	text-overflow: ellipsis;
	white-space: nowrap; overflow:hidden;
	margin:2px 0 2px 0;
}
.thumbnail-170 {
  position: relative;
  width: 170px; height: 127px; overflow: hidden;
  margin:0;
}
.thumbnail-170 img {
  position: absolute;
  left: 50%; top: 50%; height: 100%; width: auto;
  -webkit-transform: translate(-50%,-50%);
      -ms-transform: translate(-50%,-50%);
          transform: translate(-50%,-50%);
}


.portrait-127 {
  position: relative;
  width: 127px; height: 127px; overflow: hidden;
}
.portrait-127 img {
  position: absolute;
  left: 50%; top: 60%; width: 100%; height: auto;
  -webkit-transform: translate(-50%,-50%);
      -ms-transform: translate(-50%,-50%);
          transform: translate(-50%,-50%);
}

.portrait-105 {
  position: relative;
  width: 105px; height: 127px; overflow: hidden;
}
.portrait-105 img {
  position: absolute;
  left: 50%; top: 60%; width: 100%; height: auto;
  -webkit-transform: translate(-50%,-50%);
      -ms-transform: translate(-50%,-50%);
          transform: translate(-50%,-50%);
}

.icon-d { 
	color: yellow; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: brown; 
}