.touch {
  border-radius: 100px;
}

.video-react-load-progress {
  background: rgba(255, 255, 255, 0.3);
}

.video-player .video-react-control {
  width: 40px !important;
}

.video-player .video-react-control-bar .video-react-current-time {
  position: absolute;
  right: 110px;
}

.video-player .video-react-control-bar .video-react-duration {
  position: absolute;
  right: 80px;
}

.video-player .video-react-control-bar .video-react-progress-control {
  position: absolute;
  left: 48px;
  width: calc(100% - 189px) !important;
}

.video-player .video-react-control-bar .video-react-volume-menu-button-vertical {
  position: absolute;
  right: 40px;
  background-size: 16px 16px;
}

.video-player .video-react-control-bar .video-react-volume-menu-button-vertical:hover {
  color: #25b6ff;
}

.video-player .video-react-control-bar .video-react-volume-menu-button-vertical .video-react-volume-level {
  color: #ffffff !important;
  background: #25b6ff;
}

.video-player .video-react-control-bar .video-react-icon-fullscreen {
  position: absolute;
  right: 0px;
}

.video-player .video-react-control-bar .video-react-time-control {
  font-family: PingFangSC-Regular;
  font-size: 12px;
  color: #ffffff;
  text-align: left;
}

.video-player .video-react-controls-enabled .video-react-big-play-button {
  width: 2em;
  height: 2em;
  border-radius: 100px;
  margin-top: -1rem;
  margin-left: -1em;
  opacity: 0.7;
}

.video-player .video-react-controls-enabled .video-react-big-play-button:before {
  line-height: 56px;
}

.video-player:hover .video-react-controls-enabled .video-react-big-play-button {
  opacity: 1;
}

.video-react-load-progress div {
  border-radius: 100px;
  background: rgba(255, 255, 255, 0.5) !important;
}

.video-react .video-react-paused:hover {
  color: #25b6ff;
}

.video-react .video-react-paused:before {
  line-height: 36px;
}

.video-react .video-react-playing:hover {
  color: #25b6ff;
}

.video-react .video-react-playing:before {
  line-height: 36px;
}

.video-react-slider {
  background: rgba(255, 255, 255, 0.3) !important;
  border-radius: 100px;
}

.video-react-icon-fullscreen:before,
.video-react-icon-fullscreen-exit:before,
.video-react-slider-bar:before,
.video-react-icon-volume-off:before {
  content: '' !important;
}

.video-react-icon-fullscreen {
  background: url("./images/video-full-screen.svg") 50% 50% no-repeat !important;
}

.video-react-icon-fullscreen:hover {
  background: url("./images/blue-video-full-screen.svg") 50% 50% no-repeat !important;
}

.video-react-icon-fullscreen-exit {
  background: url("./images/video-exit-full-screen.svg") 50% 50% no-repeat !important;
}

.video-react-icon-fullscreen-exit:hover {
  background: url("./images/blue-vidoeo-exit-full-screen.svg") 50% 50% no-repeat !important;
}

.video-react-slider-bar:before {
  background-image: url("./images/video-paly-circle.svg") !important;
  background-color: #26B7FF;
  width: 12px;
  height: 12px;
  border-radius: 100px;
}

.video-react-icon-volume-off:before {
  background-image: url("./images/video-paly-circle.svg") !important;
  width: 18px;
  height: 16px;
}

.video-react .video-react-progress-control:hover .video-react-progress-holder {
  font-size: 1em;
}

.video-react-button {
  background: url();
}

.no-data-tool {
  background: #3e4e59;
  position: relative;
  height: 100%;
  width: 100%;
  border-radius: 2px;
  overflow: auto;
}

.no-data-tool .tool-content {
  width: 270px;
  height: 154px;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  text-align: center;
}

.no-data-tool .tool-content .video-tool-icon {
  display: inline-block;
  width: 143px;
  height: 89px;
  background: url("./images/video-play-fail-tool.svg") 50% 50% no-repeat;
}

.no-data-tool .tool-content .tool-text-big {
  display: inline-block;
  width: 100%;
  font-size: 14px;
  color: #ffffff;
  text-align: center;
  line-height: 20px;
  margin-top: 15px;
}

.no-data-tool .tool-content .tool-text-small {
  display: inline-block;
  width: 100%;
  font-size: 12px;
  color: #8f9ca6;
  text-align: center;
  line-height: 17px;
  margin-top: 5px;
}
