#tree {
height: auto;
overflow: scroll;
}
#info {
border-left: #ccc dashed 1px;
height: auto;
padding: 1rem !important;
z-index: 2;
}
.showinfo {
position: fixed;
padding-right: 1rem !important;
top: 5px;
bottom: 50px;
overflow-y: scroll;
z-index: 3;
}
body[size=xxl] #tree {
width: 60%;
}
body[size=xxl] #info {
width: 40%;
}
body[size=xxl] .showinfo {
width: 39%;
max-width: 40%;
}
body[size=xl] #tree {
width: 60%;
}
body[size=xl] #info {
width: 40%;
}
body[size=xl] .showinfo {
width: 39%;
max-width: 40%;
}
body[size=lg] #tree {
width: 50%;
}
body[size=lg] #info {
width: 50%;
}
body[size=lg] .showinfo {
width: 49%;
max-width: 50%;
}
body[size=md][window=i] #tree {
width: 30%;
}
body[size=md][window=i] #info {
width: 70%;
}
body[size=md][window=i] .showinfo {
width: 69%;
max-width: 70%;
}
body[size=md][window=t] #tree {
width: 100%;
}
body[size=md][window=t] #info {
display: none
}
body[size=sm][window=i] #tree,
body[size=xs][window=i] #tree {
display: none;
}
body[size=sm][window=i] #info,
body[size=xs][window=i] #info,
body[size=sm][window=i] .showinfo,
body[size=xs][window=i] .showinfo {
width: 100%;
border-left: none;
}
body[size=sm][window=t] #tree,
body[size=xs][window=t] #tree {
width: 100%;
}
body[size=sm][window=t] #info,
body[size=xs][window=t] #info,
body[size=sm][window=t] .showinfo,
body[size=xs][window=t] .showinfo {
display: none
}
#buttons {
position: fixed;
bottom: 5px;
right: 20px;
height: auto;
z-index: 10;
}
#buttons div {
width: 100%;
}
.node {
cursor: pointer;
}
.node circle {
fill: #fff;
stroke: steelblue;
stroke-width: 2px;
}
.node circle.M {
stroke: steelblue;
}
.node circle.M.J {
stroke: #900;
}
.node circle.F {
stroke: #090;
}
.node text {
font: 12px sans-serif;
}
.link {
fill: none;
stroke: #ccc;
stroke-width: 2px;
}
span.J svg,
span.J a,
.jcolor,
.christ {
color: #c00;
}
path.J {
stroke: #c00 !important;
}
path.multi {
stroke-dasharray: 2;
stroke: #090 !important;
}
path.deu {
stroke-dasharray: 5;
}
path.unknown {
stroke-dasharray: 5 5 2 5;
stroke: #f90 !important;
}
.node {
cursor: pointer;
}
hr {
margin-top: 1rem;
margin-bottom: 1rem;
border: 0;
border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.ui-tooltip {
background-color: white;
}
.ui-bible-tooltip {
display: none;
position: absolute;
z-index: 1001;
font-weight: normal;
font-size: 14px;
line-height: 1.3;
padding: .75rem;
max-width: 400px;
left: 50%;
width: 100%;
color: #fff;
background: #333;
box-shadow: 0 0 10px #333
}
.ui-bible-tooltip .more {
font-style: italic;
font-size: xx-small
}
.ui-bible-tooltip .info {
font-size: x-small
}
.ui-bible-tooltip .tooltip-title {
font-weight: bold;
font-size: 1.2em;
margin-bottom: 5px
}
.ui-bible-tooltip p {
text-indent: 1em
}
abbr,
.bibletip {
white-space: nowrap;
}
.img-thumbnail {
padding: 10px;
}
#loader {
position: fixed;
top: 20px;
left: 20px;
}
.nav-lang.active {
font-weight: bold;
}
.first-show {
-webkit-border-radius: .25rem .25rem 0 0 !important;
-moz-border-radius: .25rem .25rem 0 0 !important;
border-radius: .25rem .25rem 0 0 !important;
border-top-width: 1px !important;
}
.form-group {
position: relative;
}
#people-fltr {
padding-right: 40px !important;
}
#count {
position: absolute !important;
right: 10px;
top: 10px;
}
li.li-people-name .badge {
margin-left:10px;
}
.show-on-mobile {
display: none !important;
}
abbr[title], acronym[title] {
text-decoration: none!important;
border-bottom: 1px dotted;
}
.blink {
animation: blink 1s linear infinite
}
@keyframes blink {
from {
fill: white;
}
to {
fill: #f90;
}
}