.embed-container {
  width: 640px;
  border: 1px solid #ccc;
  max-width: 100%;
  margin: 1em 0;
  aspect-ratio: 640 / 480;
  display: flex;
  justify-content: center;
  flex-direction: column;
}

.embed-container iframe {
  max-width: 100%;
}

.youtube-thumbnail {
  cursor: pointer;
  width: 100%;
  padding: 0;
  position: relative;
}
.youtube-thumbnail img {
  width: 100%;
  margin: 0;
}

.youtube-thumbnail.hide,
.consent-form.hide {
  display: none;
}

.consent-form {
  padding: 1em;
  display: flex;
  flex-direction: column;
  gap: 1em;
}

.consent-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
}

.consent-header {
  display: flex;
  justify-content: space-between;
}

.consent-header .close-consent {
  background: none;
  color: var(--text);
  border: 0;
  cursor: pointer;
}

button.consent-confirm,
.consent-nav .close-consent {
  background: none;
  border: none;
  border-bottom-width: medium;
  border-bottom-style: none;
  border-bottom-color: currentcolor;
  border-bottom: solid 1px;
  color: var(--brand);
  cursor: pointer;
}

.youtube-thumbnail img.play-button {
  position: absolute;
  width: 15%;
  top: 40%;
  left: 40%;
}
