.demo {
  position: relative;
}

.play-icon {
  width: 48px;
  height: 48px;
  background: url("/krpano/1.21/skin/vtourskin.png") no-repeat;
  background-position: 0px -480px;
  background-size: 96px 576px;
  cursor: pointer;
  z-index: 1;

  &.pause {
    background-position: -48px -480px;
  }
}

.transition {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 48px;
  height: 48px;
  opacity: 0;
  transform: translate(-50%, -50%);
}
.enter,
.exit {
  transition: opacity ease-in-out 0.2s;
}
.enter-active,
.enter-done {
  opacity: 1;
}
.exit-active,
.exit-done {
  opacity: 0;
}
