.hktb__dialog-video {
  position: fixed;
  right: 20px;
  bottom: 0;
  z-index: 100;
  width: 480px;
  max-width: 480px;
  z-index: 100;
  height: 270px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}

.hktb__dialog-video.hktb__dialog-video--youtube {
  background-image: url('/content/dam/local-market-site/home/video-popup/youtube-poster.png');
}

.hktb__dialog-video.hktb__dialog-video--brightcove {
  background-image: url('/content/dam/local-market-site/home/video-popup/brightcove-poster.png');
}

.hktb__dialog-video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.hktb__dialog-video .close-video {
  /* display: none; */
  position: absolute;
  right: -12px;
  top: -12px;
  height: 26px;
  width: 26px;
  background: url('close-video.svg');
  background-repeat: no-repeat;
  background-size: 18px 18px;
  background-position: center;
  z-index: 101;
  cursor: pointer;
  background-color: #E9282F;
  border-radius: 50%;
  border: 2px solid #fff;
  filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.6));
}

.hktb__dialog-video video {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 1024px) {
  .hktb__dialog-video .close-video {
    height: 20px;
    width: 20px;
    background-size: 14px 14px;
    right: -10px;
    top: -10px;
  }

  .hktb__dialog-video {
    max-width: 280px;
    height: 160px;
  }
}

.hktb__dialog-video {
  display: none !important;
}