.video {
  margin-top: 1rem;
  width: 100%;
  margin-bottom: 1em;
  position: relative;
  margin-top: 5rem;
  /* margin-bottom: 5rem; */
}

.video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.custom-button {
  /* Rozměry a základní vzhled */
  position: absolute;
  top: 50%;
  left: 50%;
  /* Posune celý kruh přesně do středu kontejneru */
  transform: translate(-50%, -50%);

  display: flex;
  align-items: center;
  /* Vertikální zarovnání na střed */
  /* Mezera mezi šipkou a textem */
}

/* Styl pro šipku */
.custom-button .arrow {
  /* Vytvoření trojúhelníku směřujícího doprava: */
  /* 1. Horní a dolní rámeček jsou průhledné (vytvoří boční strany) */
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;

  /* 2. Levý rámeček je bílý (vytvoří hrot trojúhelníku) */
  /* Velikost tohoto borderu určuje velikost šipky */
  border-left: 15px solid #ffffff;

  /* Mezera mezi šipkou a textem */
  margin-right: 15px;
  /* margin-left: 5px; */
}

/*VIDEO PRELOADER */


/* Kontejner pro zachování poměru stran (16:9) */
.video-container {
  position: relative;
  width: 100%;
  /*padding-bottom: 56.25%; Poměr 16:9 */
  height: 100%;
  cursor: pointer;

  background-color: transparent;
  margin-top: 4rem;
}

/* Styly pro náhled a VLOŽENÝ VIDEO element */
.video-thumbnail,
.video-container video {
  position: relative;

  width: 100%;
  height: 100%;
  border: none;
  transition: opacity 0.3s ease;
}