body.logged-in .non-logged-in,
body .logged-in {
    display: none;
}

body.logged-in .logged-in {
    display: block;
}

/* Family Tree by Jack */
.family-tree-container {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    background-size: 100% 100%;
/*     background-size: contain; */
    background-repeat: no-repeat;
    min-width: 1205px;
    min-height: 1000px;
/*     min-height: 846px; */
    padding: 45px;
/*     padding: 45px 90px; */
}
.family-plate {
    position: absolute;
    max-width: 100px;
    top: 100px;
    z-index: 1;
}
.family-plate.left-plate {
    left: 100px;
}
.family-plate.right-plate {
    right: 100px;
}

.family-tree-content{
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 800px;
	
/* 	Added by: toanbui217 */
	width: 100%;
	height: 100%;
/* 	End */
}
.family-tree-content .family-title-wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
}
.family-tree-content .family-title-wrapper .family-title {
    display: flex;
    justify-content: center;
    align-items: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    min-width: 300px;
    height: auto;
}

.family-tree-content .family-title-wrapper .family-title span {
    max-width: 156px;
    text-align: center;
    font-family: "Bona Nova", Sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: #4B2E1D;
    -webkit-text-stroke: 1px #2C1B10;
    text-stroke: 1px #2C1B10;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3), -1px -1px 1px rgba(255, 255, 255, 0.05);
	
/* 	Added by: toanbui217 */
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2; /* number of lines to show */
	line-clamp: 2;
	-webkit-box-orient: vertical;
/* 	End */
}

.family-tree-content .family-title-wrapper .family-decor {
    max-width: 109px;
    z-index: 2;
}

.family-tree-container.none-plate .family-tree-content .family-title-wrapper .family-title {
    min-width: 400px;
    background-position: center 18px;
}
.family-tree-container.none-plate .family-tree-content .family-title-wrapper .family-decor {
    max-width: 238px;
}
.family-tree-container.none-plate .family-tree-content .family-title-wrapper .family-title span {
    max-width: 180px;
}

.family-tree-content .family-content .node-name {
    font-family: "Bona Nova", Sans-serif;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 700;
    line-height: 26px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.family-tree-content .family-content .node-date {
    font-size: 8px;
    font-family: "Bona Nova SC", Sans-serif;
}

#family-tree {
	width: 100%;
	height: 950px;
    text-align: center;
}

/* Added by: toanbui217 */
/*#family-tree svg {
	width: 100%;
	height: 100%;
}*/
/* End */

.gia-pha-thien-chua #family-tree {
    top: 260px;
}

.gia-pha-phat-giao {
    padding: 50px 100px;
}

.gia-pha-phat-giao .family-plate{
    top: 275px;
}

.gia-pha-phat-giao #family-tree {
    top: 290px;
    left: 48px;
    right: 48px;
}

.add-root-family button{
    font-weight: bold;
    font-size: 18px;
    color: #4B2E1D;
    border: 1px solid #2C1B10;
}

/* New Tree Data CSS */
.avatar-in {
    width: 72px;
    height: 84px !important;
    object-fit: cover;
    border-radius: 8px !important;
    border: 3px solid white !important;
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
}

.node-info {
    position: absolute;
    top: 110px;
    width: 100%;
    padding: 0 10px;
    margin: 10px 0;
}

.node-info .info-name {
    font-family: "Bona Nova", Sans-serif;
/* 	Commented by toanbui217 */
/*     text-transform: uppercase; */
    font-size: 16px;
    font-weight: 700;
    line-height: 26px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    dominant-baseline: middle;
    color: #333333;
}

.node-info .info-date {
    font-size: 16px;
    color: #333333;
}
/* End New Tree Data CSS */