body {
  font-size: 18px;
  color: #876863;
  background-color: black;
  font-family: "Garamond", "Times New Roman";
}

.table-wrapper {
  position: relative;
  width: 1525px;
  height: auto;
}

.table-background {
  display: block;
  width: 100%;
  height: auto;
}

.grid-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.box {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: auto;
  background: none;
  overflow: hidden;
}

/* ----------------------------
   Butterfly box (top)
---------------------------- */
.butterfly-box {
  top: 165px;
  left: 625px;
  width: 225px;
  height: 525px;
}

.swap {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
}

.swap img {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.swap img.gif {
  opacity: 0;
  pointer-events: none;
}

.swap:hover img.gif {
  opacity: 1;
}

.swap:hover img.still {
  opacity: 0;
}

.frame-box {
  top: 274px;
  left: 134px;
  width: 300px;
  height: auto;
}

.frame-box img {
  max-width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
}

.frame-box.hoverimage:hover {
  transform: scale(1.1);
}

.book-box {
  top: 500px;
  left: 305px;
  width: 618px;
  height: 275px;
}

.book-box img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.book-box.hoverimage:hover {
  transform: scale(1.1);
}

/* ----------------------------
   Skull (no hover)
---------------------------- */
.skull-box {
  top: 125px;
  left: 813px;
  width: 325px;
  height: 625px;
}

.skull-box img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

/* ----------------------------
   Movie camera (hover enlarges)
---------------------------- */
.camera-box {
  top: 393px;
  left: 1093px;
  width: 225px;
  height: 325px;
}

.camera-box img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.camera-box.hoverimage:hover {
  transform: scale(1.1);
}

/* ----------------------------
   Audio box
---------------------------- */
.audio-box {
  top: 0px;
  left: 0px;
  width: 110px;
  height: 200px;
  border: none;
}

.audio-box.hoverimage:hover {
  transform: scale(1.1);
}

#cena {
  display: none;
}

audio {
  width: 100%;
  margin: 20px 0;
}