/* .md-typeset__scrollwrap {
  overflow-x: hidden !important;
} */

video {
  height: 100%;
  width: 100%;
  border: 1px solid #ccc;
}

.workingExample {
  position: relative;
}

.workingExample a {
  color: white;
  background-color: rgba(128, 128, 128, 0.5);
  position: absolute;
  bottom: 18px;
  right: 10px;
  font-family: monospace;
  font-size: 21px;
  padding: 0px 3px 0px 3px;
  user-select: none;
  line-height: 21px;
  border-radius: 2px;
}

.workingExample a:hover {
  color: white;
  background-color: rgba(255, 255, 255, 0.5);
}

.workingExample a:visited {
  color: white;
}

#sbcodeVideoDiv {
  display: none;
}

#sbcodePPVVDiv {
  display: none;
  border: 1px solid #666;
  padding: 4px;
  position: relative;
  background-color: --md-code-bg-color;
}

#sbcodePPVVDiv h2 {
  margin-top: 0px;
}

#sbcodePPVVDiv h3 {
  margin-top: 0px;
}

#sbcodePPVVDiv ul {
  font-size: 14px;
}

.ppvv-close-btn {
  position: absolute;
  top: 8px;
  right: 8px;
  border: none;
  background: transparent;
  font-size: 20px;
  font-weight: bold;
  cursor: pointer;
  padding: 0px 4px 0px 4px;
  border: 1px solid #666;
}

.ppvv-close-btn:hover {
  color: red;
}

/* .md-icon {
  margin-bottom: 7px;
} */

.ppvvbutton {
  position: relative;
  top: -4px;
  width: 122px;
  height: 40px;
  font-size: 14px;
  padding-top: 4px;
  color: white;
  background: #222;
  border: none;
  border-radius: 20px;
  cursor: pointer;
  transition: transform 0.15s ease;
}

.ppvvbutton:active {
  transform: scale(0.95);
}

/* neon border (inside) */
.ppvvbutton::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 3px;
  background: conic-gradient(from var(--angle, 0deg),
      red,
      orange,
      yellow,
      green,
      cyan,
      blue,
      violet,
      red);
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0.15;
  transition: opacity 0.5s ease;
  pointer-events: none;
}

/* show neon border on hover */
.ppvvbutton:hover::after {
  opacity: 1;
}