* {
    box-sizing: border-box;
}
p { color: #fff;}

ul {
    padding: 10px;
}
#dock-container {
    position: fixed;
    bottom: 0;
    text-align: center;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 10px 10px 0 0;
}
#dock-container li {
    list-style-type: none;
    display: inline-block;
    position: relative;
}
#dock-container li img {
  width: 32px;
  height: 32px;
  -webkit-box-reflect: below 2px;
  -webkit-gradient:(linear, left top, left bottom, from(transparent),
  color-stop(0.7, transparent), to(rgba(255,255,255,.5))); 
  -webkit-transition: all 0.3s;
  -webkit-transform-origin: 50% 100%;
}
#dock-container li:hover img { 
  -webkit-transform: scale(2);
  margin: 0 2em;
}
#dock-container li:hover + li img,
#dock-container li.prev img {
  -webkit-transform: scale(1.5);
  margin: 0 1.5em;
}            
#dock-container li span {
    display: none;
    position: absolute;
    bottom: 80px;
    left: 0;
    width: 100%;
    background-color: rgba(0,0,0,0.75);
    padding: 4px 0;
    border-radius: 12px;
}
#dock-container li:hover span {
    display: block;
    color: #fff;
}