#diascope {
  position: relative;
  width: 760px;
  height: 490px;
}

#diascope #viewport {
  width: 100%;
  height: 490px;
}

#diascope #description {
  position: absolute;
  top: 490px;
  width: 760px;
}

#diascope #loading {
  width: 760px;
  height: 490px;
  text-align: center;
}

#diascope #loading img {
  position: relative;
  top: 220px;
}

#diascope #main-control {
  
}

#diascope #next {
  right: 0px;
  background-image:url('../diascope/arrow-right.png');
  background-repeat:no-repeat;
  background-position:center center;
  -moz-outline-style: none;
  outline: none;
}

#diascope #next:hover {
  background-image:url('../diascope/arrow-right-hover.png');
}

#diascope #back {
  background-image:url('../diascope/arrow-left.png');
  background-repeat:no-repeat;
  background-position:center center;
  -moz-outline-style: none;
  outline: none;
}

#diascope #back:hover {
  background-image:url('../diascope/arrow-left-hover.png');
}

#diascope .main-control {
  position: absolute;
  display: block;
  height: 100%;
  vertical-align: middle;
  z-index: 999;
  text-decoration: none;
  width: 30px;
}

#diascope .main-control:hover {

}