[data-url] .clickable {
  cursor: pointer;
}

a, a:hover, a:visited {
  color: unset;
}

img.media, video.media {
  width: 100%;
  aspect-ratio: 16/9;
  object-fit: contain;
  object-position: center;
}

img.media.square, video.media.square {
  aspect-ratio: 1;
}

.scalable-html {
  --cols: 1;
  font-size: calc(16px / var(--cols));
  --bs-spacer: calc(1rem / var(--cols)) !important;
}
.scalable-html h1 {
  font-size: 2.5em !important;
}
.scalable-html h2 {
  font-size: 2em !important;
}
.scalable-html h3 {
  font-size: 1.75em !important;
}
.scalable-html h4 {
  font-size: 1.5em !important;
}
.scalable-html h5 {
  font-size: 1.25em !important;
}
.scalable-html h6 {
  font-size: 1em !important;
}

.scalable-html .display-1 {
  font-size: 5em !important;
}
.scalable-html .display-2 {
  font-size: 4.5em !important;
}
.scalable-html .display-3 {
  font-size: 4em !important;
}
.scalable-html .display-4 {
  font-size: 3.5em !important;
}
.scalable-html .display-5 {
  font-size: 3em !important;
}
.scalable-html .display-6 {
  font-size: 2.5em !important;
}


.scalable-html.col-6, .scalable-html.col-md-6, .scalable-html.col-lg-6 {
    --cols: 2;
}

.scalable-html.col-4, .scalable-html.col-md-4, .scalable-html.col-lg-4 {
    --cols: 3;
}

.scalable-html.col-3, .scalable-html.col-md-3, .scalable-html.col-lg-3 {
    --cols: 4;
}

.scalable-html.col-2, .scalable-html.col-md-2, .scalable-html.col-lg-2 {
    --cols: 6;
}