.video-js .vjs-big-vr-play-button {
  width: 200px;
  height: 100px;
  background-image:
    url("play-vr.png");
  background-size: contain;
  background-color: rgba(0, 0, 0, 0.5)
}

.video-js .vjs-big-vr-play-button .vjs-icon-placeholder {
  display: none
}

:hover.video-js .vjs-big-vr-play-button {
  -webkit-transition: border-color 0.4s, outline 0.4s, background-color
    0.4s;
  -moz-transition: border-color 0.4s, outline 0.4s, background-color 0.4s;
  -ms-transition: border-color 0.4s, outline 0.4s, background-color 0.4s;
  -o-transition: border-color 0.4s, outline 0.4s, background-color 0.4s;
  transition: border-color 0.4s, outline 0.4s, background-color 0.4s
}

.video-js .vjs-big-vr-play-button::before {
  content: ''
}

.video-js canvas {
  cursor: move
}

.video-js .vjs-button-vr .vjs-icon-placeholder {
  height: 30px;
  width: 30px;
  display: inline-block;
  background:
    url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iI0ZGRkZGRiI+CiAgICA8cGF0aCBkPSJNMjAuNzQgNkgzLjIxQzIuNTUgNiAyIDYuNTcgMiA3LjI4djEwLjQ0YzAgLjcuNTUgMS4yOCAxLjIzIDEuMjhoNC43OWMuNTIgMCAuOTYtLjMzIDEuMTQtLjc5bDEuNC0zLjQ4Yy4yMy0uNTkuNzktMS4wMSAxLjQ0LTEuMDFzMS4yMS40MiAxLjQ1IDEuMDFsMS4zOSAzLjQ4Yy4xOS40Ni42My43OSAxLjExLjc5aDQuNzljLjcxIDAgMS4yNi0uNTcgMS4yNi0xLjI4VjcuMjhjMC0uNy0uNTUtMS4yOC0xLjI2LTEuMjh6TTcuNSAxNC42MmMtMS4xNyAwLTIuMTMtLjk1LTIuMTMtMi4xMiAwLTEuMTcuOTYtMi4xMyAyLjEzLTIuMTMgMS4xOCAwIDIuMTIuOTYgMi4xMiAyLjEzcy0uOTUgMi4xMi0yLjEyIDIuMTJ6bTkgMGMtMS4xNyAwLTIuMTMtLjk1LTIuMTMtMi4xMiAwLTEuMTcuOTYtMi4xMyAyLjEzLTIuMTNzMi4xMi45NiAyLjEyIDIuMTMtLjk1IDIuMTItMi4xMiAyLjEyeiIvPgogICAgPHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMGgyNHYyNEgwVjB6Ii8+Cjwvc3ZnPgo=)
    no-repeat left center
}