/* breakpoints */
/* breakpoints */
.videoelement {
  background-color: var(--clr-primary);
  --font-clr: var(--white);
}
.videoelement video {
  border-radius: 1.875rem;
}
.videoelement video::cue {
  font-size: 1.5rem;
  color: white;
  background-color: rgba(0, 0, 0, 0.7);
}
.videoelement .video__title {
  position: absolute;
  top: 2rem;
  left: 2rem;
  color: var(--white);
  z-index: 22;
  max-width: calc(100% - 8rem);
  font-size: 1.875rem;
  line-height: 3.125rem;
  font-family: var(--font-coheadline);
}
@media (max-width: 767.98px) {
  .videoelement .video__title {
    font-size: 1rem !important;
    line-height: 1.5rem;
  }
}
.videoelement .play__button {
  position: absolute;
  top: 2rem;
  right: 2rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  background-color: var(--clr-primary);
  z-index: 20;
}
.videoelement .play__button i {
  color: var(--white);
  font-size: 2rem;
}
.videoelement .play__button i.bi-pause-fill {
  display: none;
}
.videoelement .play__button.playing i.bi-play-fill {
  display: none;
}
.videoelement .play__button.playing i.bi-pause-fill {
  display: block;
}
.videoelement .subtitle__button {
  position: absolute;
  bottom: 2rem;
  right: 2rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  background-color: var(--clr-primary);
  z-index: 20;
}
.videoelement .subtitle__button i {
  color: var(--white);
  font-size: 1.5rem;
}
.videoelement .subtitle__button i.bi-cc-square-fill {
  display: none;
}
.videoelement .subtitle__button.active i.bi-cc-square {
  display: none;
}
.videoelement .subtitle__button.active i.bi-cc-square-fill {
  display: block;
}
.videoelement .signet {
  width: 125px;
  margin-top: -50px;
  left: 50%;
  transform: translateX(-50%);
  position: relative;
}
@media (max-width: 767.98px) {
  .videoelement .signet {
    width: 60px;
  }
}
.videoelement__graphic {
  position: absolute;
  right: 0;
  bottom: 0;
  max-width: 50vw;
}
@media (max-width: 767.98px) {
  .videoelement__graphic {
    max-width: 40vw;
  }
}
.videoelement .video__element__title--holder {
  margin-bottom: 4rem;
  --font-clr: white;
  font-family: var(--font-coheadline);
}
@media (max-width: 1399.98px) {
  .videoelement .video__element__title--holder {
    margin-bottom: 1.75rem;
  }
}
@media (max-width: 1199.98px) {
  .videoelement .video__element__title--holder {
    margin-bottom: 1.5rem;
  }
}
@media (max-width: 991.98px) {
  .videoelement .video__element__title--holder {
    margin-bottom: 1.25rem;
  }
}
.videoelement .video__element__title--holder * {
  color: var(--headline-clr, var(--font-clr));
}
.element.videoelement.space-top {
  margin-top: -1px !important;
  padding-top: 0 !important;
}
.element.videoelement.space-bottom {
  margin-bottom: -1px !important;
  margin-top: -1px !important;
}
/*# sourceMappingURL=data:application/json,%7B%22version%22%3A3%2C%22sources%22%3A%5B%22%2Fthemes%2Fheimattage%2Fscss%2Felements%2F_videoelement.scss%22%2C%22%2Fthemes%2Fheimattage%2Fscss%2Felements%2F..%2Fsettings%2Fbreakpoints.scss%22%5D%2C%22names%22%3A%5B%5D%2C%22mappings%22%3A%22AAAA%3BAAAA%3BAAGA%3BAAAA%3BAAAA%3BAAAA%3BAAIE%3BAAAA%3BAAAA%3BAAGE%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAOF%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BACuBE%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BADNF%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAaE%3BAAAA%3BAAAA%3BAAAA%3BAAIE%3BAAAA%3BAAAA%3BAAOE%3BAAAA%3BAAAA%3BAAIA%3BAAAA%3BAAAA%3BAAON%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAaE%3BAAAA%3BAAAA%3BAAAA%3BAAIE%3BAAAA%3BAAAA%3BAAOE%3BAAAA%3BAAAA%3BAAIA%3BAAAA%3BAAAA%3BAAON%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAChEE%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAD4EF%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAOA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAKA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BACxFE%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BADyGA%3BAAAA%3BAAAA%3BAAMJ%3BAAAA%3BAAAA%3BAAAA%3BAAKA%3BAAAA%3BAAAA%3BAAAA%22%7D */