STB/stb/views/layout/css/baum.css

<style type="text/css" media="screen">

.hover
{
 background-color: #e0e0f7;
 z-index: 1;
}
.mask
{
 position: absolute;
 left: 45px;
 margin-top:15px;
 top:0;
 /* background-color: green;  */
 -moz-transition: all 0.5s ease 0s;
 -webkit-transition: all 0.5s ease 0s;
 transition: all 0.5s ease 0s;
 opacity: 0;
 z-index: 2;
}
.box{
 position: relative;
}

.box:hover .mask{
 margin-left: 0px;
 opacity: 1;
}

h1 {
	font-family:times new roman;
	font-size:14pt;
	font-weight:bold;
	font-style:italic;
	color:#000080;
	text-decoration:underline;
}
a {text-decoration:none;}
a:hover { font-weight:bold;color:red;}

/* Position des Dreiecks neben Box */
div.b {
  position: relative;
  top: -80px;
  left: 200px;
  width: 19px;
  height: 67px;
}
div.c {
  position: relative;
  top: -80px;
  left: 200px;
  width: 19px;
  height: 67px;
}
div.d {
  position: absolute;
  top: 40px;
  width: 25px;
  height: 15px;
}

@media print {
  a[href]:after {
    content: none !important;
  }
}

img {margin-top:0px;margin-bottom:0px;}

td {
	font-family:arial;
	font-size:10pt;
	padding-left:2px;
	padding-right:5px;
	text-align:center;
}

.person, .parents, .gparents  {
	border:solid 1px blue;
	border-radius: 5%;
	padding-top:5px;
	width:250px;
	height:110px;
	background-color:#FFFFFF;
}

.m_but{
  width:25px;height:15px;top:40px;position:absolute;
	background-color:#DDE;}

.btnuser {background-color:#FFB0B0;color:#000000;border-radius: 5px;}
.fambox,.mfambox,.fambox_small,.mfambox_small{
	width:250px;height:72px;position:absolute;z-index:5;
	background-color:#DDE;box-shadow:5px 5px 5px #666;border-radius:5px;padding:0px;
	text-align:center;} /*overflow:hidden; */
.fambox_small,.mfambox_small{width:190px;height:56px;}
.mfambox,.mfambox_small{background-color:#EEE}
.fambackground{width:211px;position:absolute;background:lightgrey;z-index:2;border-radius:12px}

.famname{position:absolute;width:240px;border-radius:12px;padding:5px;text-align:center;background:#EEE;
  height:30px; z-index:2;}
/* Mehr anzeigen: zusätzliche Daten zur Geburt */
.mehr {position: absolute;width:250px;border-radius:5px;padding: 5px;text-align:left;z-index: 9;
	margin-top:50px;background-color: #e0e0f7;box-shadow:5px 5px 5px #666;
	font-size: 14px;font-weight:lighter;}

.rect_1{position:absolute;height:25px;width:212px;border-bottom:solid thin black;
          border-left:solid thin black;border-right:solid thin black;z-index:3;}
.rect_10 {position:absolute;height:25px;width:212px;border:solid thin black;z-index:3;}

.rect_2{position:absolute;height:300px;width:280px;z-index:3;}
.rect_3{position:absolute;height:130px;width:740px;z-index:3;}

.line_v{position:absolute;background-color:#777;height:1px;width:212px;z-index:3}
.line_v1{position:absolute;background-color:#777;height:1px;width:15px;z-index:3}
.line_v2{position:absolute;background-color:#777;height:1px;width:165px;z-index:3;}

.line_h{position:absolute;background-color:#777;height:25px;width:1px;z-index:3}
.line_h1{position:absolute;background-color:#777;height:320px;width:1px;z-index:3}
.line_h2{position:absolute;background-color:#777;height:160px;width:1px;z-index:3}
.line_h3{position:absolute;background-color:#777;height:80px;width:1px;z-index:3}
.footer{position:absolute;background-color:#555;color:white;padding:10px;height:40px;width:100%;z-index:3}


.info {
  position:relative;
  float:left;
  height:50px;
  width:40px;
}
.info img {
  height:100%;
  border-radius:6px;
}
.info:hover img{
  position:absolute;
  left:0px;
  top:-60px;
  height:140px;
  width:112px;
  z-index:13;
}

#popup_1,#popup_2,#popup_3,#popup_4,#popup_5,#popup_6,#popup_7,#popup_8,#popup_9,
#popup_10,#popup_11,#popup_12,#popup_13,#popup_14,#popup_15 {
	background-color: white; /*#e0e0f7;*/
	width:220px;
	left: 0px;
  top: 0px;
	box-shadow:4px 4px 4px #999999;
	border:1px solid #777;
	border-radius:5px;
	padding: 0.4em;
	visibility: visible;
	position: relative;
	z-index: 12;
  }
}
</style>