body {
  overflow-x: clip;
}
.sticky {
  position: -webkit-sticky; /* Safari */
  position: sticky;
  z-index: 900;
  /* just so that we can detect when the intersection becomes 100% */
  top: -1px;
}
#video-container{
    height: 25vh;
}

.small-text {
  font-size: 0.85em;
}
.hidden {
  display: none !important;
}

/* Bubble adjusted from https://codepen.io/AllThingsSmitty/pen/jommGQ */

.chat p {
  border-radius: 1.15rem;
  line-height: 1.15;
  padding: 0.5rem .875rem;
  position: relative;
  margin: 0.5rem 0;
  width: fit-content;
}

.chat p::before,
.chat p::after {
  bottom: -0.1rem;
  content: "";
  height: 1rem;
  position: absolute;
}

p.msg {
  align-items: flex-start;
  background-color: #e5e5ea;
  color: #000;
}

p.msg::before {
  border-bottom-right-radius: 0.8rem 0.7rem;
  border-left: 1rem solid #e5e5ea;
  left: -0.35rem;
  transform: translate(0, -0.1rem);
}

p.msg::after {
  background-color: #fff;
  border-bottom-right-radius: 0.5rem;
  left: 20px;
  transform: translate(-30px, -2px);
  width: 10px;
}