body {
	font-family: "Bebas Neue", sans-serif;
	color: white;
	background-color: black;
	font-size: 100%;
	text-align: center;}

.video-modal {
  display: none;
  position: fixed;
  inset: 0;
  background-color: rgba(0,0,0,0);
  z-index: 999;
pointer-events: none;
}

.video-modal-content {
  position: absolute; /* required for click placement */
  transform: translate(-50%, -50%); /* centers the top-left at the click point */
	pointer-events: none;
}

.fade-out {
    opacity: 0;
    transition: opacity 0.6s ease-out;  /* adjust duration here */
}

#gifCaption {
    position: fixed;
    bottom: 40px;              /* adjust spacing */
    left: 50%;
    transform: translateX(-50%);
    color: white;
    font-family: Arial, sans-serif;
    font-size: 25px;           /* change size if needed */
    text-align: center;
    pointer-events: none;      /* taps go through the text */
    opacity: 0;
    transition: opacity 0.4s ease-in-out;
}