#familytree-container {
}
.linage {
  fill: none;
  stroke: #D2D2D2;
}

.marriage {
  fill: none;
  stroke: black;
}
.remove_gallery_img {
    position: relative;
    margin-top: 10px;
    margin-right: 10px;
}
.man .treedp {

  background-image: url('../img/male.png');
  background-color: lightblue;

}

.woman .treedp {
  background: url('../img/female.png') no-repeat;
}

.emphasis {
  font-style: italic;
}

.man > .nameLabel, .woman  > .nameLabel {
  margin-top: 10px;
  /*width: 150px;*/

}
.man, .woman {
  display:inline-block;
  position: relative;
    cursor: pointer;
  /*margin-top: 10px;*/

}
.man .treedp, .woman .treedp {
  border-radius: 50%;
  object-fit: cover;
  object-position: center right;
  height: 100px;
  width: 100px;

}
.man .treedp:hover, .woman .treedp:hover {


}

foreignObject {
transition: transform .1s ease-out;
  transform-origin: 50% 50%;
  transform-box: fill-box;
}

foreignObject:hover {
  transform: scale(1.2);
   z-index: 2;
   transform-origin:  50% 50%;
   transform-box: fill-box;
}

#memberinfo {
    height: 100%;
    width: 30em;
    position: fixed;
    z-index: 1002;
    top: 0;
    right: 0;
    overflow-x: hidden;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;
    background: #fff;
    -webkit-box-shadow: -8px 0px 40px -12px rgba(0,0,0,0.44);
    -moz-box-shadow: -8px 0px 40px -12px rgba(0,0,0,0.44);
    box-shadow: -8px 0px 40px -12px rgba(0,0,0,0.44);
    z-index: 1000;
}
#memberinfo-overlay {
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.5);
  z-index: 999;
  cursor: pointer;
}
.memberinfo-inner {
  padding: 20px;
}
.close-memberinfo {
    right: -30em !important;
}
.fr {
  float: right !important;
}
.fl {
  float: left !important;
}
@media (max-width: 992px)
{
  .loginmessage {
    /*position: static;*/
    width: auto;
  }
  .loginmessage > .alert {
    width: 430px;
    display: block;
  }
}
@media (max-width: 576px)
{
  #loginbox, .loginmessage, .loginmessage > .alert {
    width: 100%;
  }
}
.donations-message {
  background: #f2f2f2;
}

.control-block {
  height: 70px;
}

.navbar-brand {
  margin-right: 0;
}

@media only screen and (max-width: 600px) {
  .header .logo-container {
    padding: 30px 10px 10px;
    width: 120px;
  }
}

@media (max-width: 768px) {
  .control-block {
    float: right;
    display: flex;
    margin-right: 0;
    padding: 0;
  }
  .header {
    display: flex;
  }
}

.header .control-block .author-title>svg {
  margin-left: 10px;
  width: 10px;
  height: 10px;
}