/* UI */
.qp-ui-mask-modal {
  background-color: rgba(0, 0, 0, 0.5);
  height: 100%;
  left: 0;
  opacity: 0.1;
  top: 0;
  visibility: hidden;
  width: 100%;
  z-index: 3;
  position: fixed;
  transition: visibility 0 linear 0.4s, opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  transform: translateZ(0);
}

.qp-ui-mask-modal.qp-ui-mask-visible {
  opacity: 1;
  visibility: visible;
  transition-delay: 0;
}

.qp-ui-mask-disable-scroll,
.qp-ui-mask-disable-scroll body {
  overflow: hidden;
}

.qp-ui-side-nav-drawer {
  -webkit-overflow-scrolling: touch;
  overflow-x: hidden;
  overflow-y: auto;
}

.goog-zippy-header {
  cursor: pointer;
}

.qp-ui-video-player video {
  display: block;
  height: auto;
  width: 100%;
  
}

.qp-ui-video-player-mouse {
  cursor: pointer;
  position: relative;
	
}

.qp-ui-video-player-mouse:after {
  background: rgba(0, 0, 0, 0.5) url("../res/play.png") no-repeat center center;
  background-size: 72px 72px;
  bottom: 0;
  content: '';
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
	border-radius: .5rem;
}

@media screen and (max-width: 760px) {
  .qp-ui-video-player-mouse:after {
    background-size: 56px 56px;
  }
}

.qp-ui-video-player-mouse.qp-ui-video-player-playing:after {
  background-image: url("../res/pause.png");
  opacity: 0;
  transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1), background 0 ease 0.2s;
}

.qp-ui-video-player-mouse.qp-ui-video-player-playing.qp-ui-video-player-hover:after {
  opacity: 1;
}

.qp-ui-video-player-touch {
  height: 0;
  overflow: hidden;
  position: relative;
  padding-bottom: 36.84%;
}

.qp-ui-video-player-touch video {
  bottom: 0;
  height: 101%;
  left: 0;
  margin: auto 0;
  position: absolute;
  right: 0;
  top: 0;
}