.cor-video-preview {
  display: grid;
  place-items: center;
  position: relative;
}

.cor-video-preview:before {
  --icon-size: 50px;
  content: " ";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='var(--icon-size)' height='var(--icon-size)' fill='white' class='bi bi-play-circle' viewBox='0 0 16 16'%3E%3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z'/%3E%3Cpath d='M6.271 5.055a.5.5 0 0 1 .52.038l3.5 2.5a.5.5 0 0 1 0 .814l-3.5 2.5A.5.5 0 0 1 6 10.5v-5a.5.5 0 0 1 .271-.445z'/%3E%3C/svg%3E");
  height: var(--icon-size);
  position: absolute;
  width: var(--icon-size);
  z-index: 2;
}

.cor-video-preview:after {
  background-color: rgba(0, 0, 0, 0.25);
  content: " ";
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 1;
}

.cor-video-container ul li,
.cor-video-container h5 {
  margin: 0;
}

.cor-video-container [role="button"] {
  --space: var(--space-2xs);
  align-items: flex-start;
}

.cor-video-container [role="button"],
.cor-video-container [role="button"] h5 {
  color: var(--link-color);
  font-weight: bold;
  font-size: var(--step--4);
  text-decoration: none;
} 

.cor-video-container [role="button"]:hover,
.cor-video-container [role="button"]:hover h5 {
  text-decoration: underline;
} 
