.video-medium .video-container {
  position: relative;
  overflow: hidden;
}
.video-medium .video-container video {
  height: auto;
  width: 100%;
  transition: transform 1s ease;
  transform: scale(1);
}
.video-medium .video-container video poster {
  width: 100%;
  height: auto;
}
.video-medium .video-container video:hover {
  transform: scale(1.02);
}
.video-medium .triangle-container {
  position: absolute;
  top: 45%;
  left: 45%;
  transform: translate(50%, 50%);
  width: 4em;
  width: clamp(2.4em, 8vw, 4em);
  height: 5em;
  height: clamp(1.7em, 7vw, 3em);
  aspect-ratio: 2/1;
  background-color: #fff;
  -webkit-clip-path: polygon(0% 0%, 100% 0, 100% 71%, 88% 100%, 0% 100%);
          clip-path: polygon(0% 0%, 100% 0, 100% 71%, 88% 100%, 0% 100%);
  margin: auto;
  display: grid;
  place-content: center;
}
.video-medium .triangle-container img {
  width: 1.3em;
  width: clamp(0.7em, 3vw, 1.3em);
}

@media (max-width: 500px) {
  .video-medium .video-container {
    position: relative;
    overflow: hidden;
  }
  .video-medium .video-container video {
    height: auto;
    width: 100%;
    transition: transform 1s ease;
    transform: scale(1);
  }
  .video-medium .video-container video poster {
    width: 100%;
    height: auto;
  }
  .video-medium .video-container video:hover {
    transform: scale(1.02);
  }
  .video-medium .triangle-container {
    position: absolute;
    top: 40%;
    left: 40%;
    aspect-ratio: 2/1;
    background-color: #fff;
    -webkit-clip-path: polygon(0% 0%, 100% 0, 100% 71%, 88% 100%, 0% 100%);
            clip-path: polygon(0% 0%, 100% 0, 100% 71%, 88% 100%, 0% 100%);
    margin: auto;
    display: grid;
    place-content: center;
  }
  .video-medium .triangle-container svg {
    background-size: 10px 10px;
  }
}