/* CSS styles for "GDRP for videos", by Rik de Boer, Melbourne 2021 */
.video-img-overlay {
  height: 100%;
  position: absolute;
  width: 100%;
}
.video-text-overlay {
  background-color: #f6f6f6;
  border: 1px solid #555;
  border-radius: 10px;
  color: #555;
  font-family: Helvetica, sans-serif;
  font-size: 1.2rem;
  font-weight: 300;
  margin: 0 auto;
  max-width: 800px;
  padding: 1rem;
  position: relative;
  text-align: center;
  top: 30px;
  width: 80%;
}
.video-text-overlay > button {
  background-color: #555;
  border: none;
  border-radius: 6px;
  color: white;
  display: block;
  height: 2.5rem;
  margin: 0.75rem auto 0;
}
.video-text-overlay > button:hover {
  background-color: #111;
}

/** Font and padding adjustments for narrow screens */
@media all and (max-width: 540px) {
  .video-text-overlay {
    font-size: 0.8rem;
    padding: 0.8rem;
    top: 20px;
    width: 85%;
  }
  .video-text-overlay > button {
    height: 1.75rem;
  }
}

img.video-config-thumbnail {
  max-height: 64px;
  vertical-align: middle;
}