html, body{
  width: 100%;
  height: 100%;
  /* background-image: -moz-radial-gradient(50% 50%, circle farthest-corner, #FFF 20%, #efeee7);
  background-image: -webkit-radial-gradient(50% 50%, circle farthest-corner, #FFF 20%, #efeee7);
  background-image: -o-radial-gradient(50% 50%, circle farthest-corner, #FFF 20%, #efeee7);
  background-image: -ms-radial-gradient(50% 50%, circle farthest-corner, #FFF 20%, #efeee7);
  background-image: radial-gradient(50% 50%, circle farthest-corner, #FFF 20%, #efeee7); */
}
#info-container{
  position: absolute;
  width: 5rem;
  left: 50%;
  top: 50%;
  margin-left: -2.5rem;
  margin-top: 3rem;
  font-family: "Times New Roman",Georgia,Serif;
  font-style: italic;
  font-weight: bold;
  text-shadow: #CCC -1px -1px 2px;
  text-align: center;
}
#container {
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -2.5rem;
  margin-top: -2.5rem;
  width: 5rem;
  height: 5rem;
  /* background-color: #FFF; */
  /* border: 20px solid #FFF; */
  /* -moz-box-shadow: 0 0 30px #CCC;
  -webkit-box-shadow: 0 0 30px #CCC;
  -o-box-shadow: 0 0 30px #CCC;
  -ms-box-shadow: 0 0 30px #CCC; */
  /* box-shadow: 0 0 30px #CCC; */

}
.img_p {
  position: absolute;
  width: 5rem;
  height: 5rem;
  /* background-image: url(http://edankwan.github.io/PerspectiveTransform.js/img/lenna.jpg); */
  background-size: contain;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.pt {
  position: absolute;
  width: 15px;
  height: 15px;
  margin-left: -7.5px;
  margin-top: -7.5px;
  border-radius: 15px;
  /* background-color: #F00; */
  cursor: pointer;
}