html {padding-bottom:5.5%;position:relative;min-height:100%;
box-sizing:border-box;}
ul , body{
  margin:0;
  padding:0;
}
ul {
  background:#000;
  width:100%;
  font-size:0;
  position:absolute;
  bottom:0;
  left:0;
}
ul:before {
  content:'';
  display:inline-block;
  padding-top:1%;
  vertical-align:top;
}
li {
  display:inline-block;  
  vertical-align:top;
  text-align:center;
  background-size:auto 100%;
  background: url('../stammbaum/images/navig/css_sprites.png');
}
li:before {
  content:'';
  display:inline-block;
  vertical-align:middle;
}
li a {
  display:inline-block;
  font-size:16px;
  font-size:1rem;
  vertical-align:middle;
  line-height:5vw;
  height:5vw;
  width:8vw;
  /* to show them for tst */
  color:turquoise;
  text-shadow:0 0 0.5em lime;
}
#sp1 {
  width:2%;
  background-size:auto 100%;
}
#sp1:before {
  padding-top:.01%;
}
#sp2 {
  width:2%;
  background-size:auto 100%;
  background-position: 3% 0;
}
#sp2:before {
  padding-top:.01%;
}
#sp3 {
  width:2%;
  background-size:auto 100%;
  background-position: 5% 0;
}
#sp3:before {
  padding-top:2%;
}
#sp4 {
  width:2%;
  background-size:auto 100%;
  background-position: 7% 0;
}
#sp4:before {
  padding-top:2%;
}
#sp5 {
  width:2%;
  background-size:auto 100%;
  background-position: 69% 0;
}
#sp5:before {
  padding-top:2%;
}
#sp6 {
  width:14%;
  background-size:auto 100%;
  background-position: 88% 0;
}
#sp6:before {
  padding-top:2%;
}
#sp7 {
  width:11%;
  background-size:auto 100%;
  background-position: 100% 0;
}
#sp7:before {
  padding-top:2%;
}