.markdown-body {
  border: 1px solid #ddd;
  border-radius: 3px;
  max-width: 90%;
  margin: 64px auto 51px;
  padding: 45px;
  font-size: large;
}

.floating-audio {
  position: fixed;
  left: 10%;
  bottom: 2rem;
  z-index: 9999;
  background-color: cyan;
  border: outset;
  border-radius: 15px;
  padding: 5px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  width: 80%;
}

.heading {
  background-color: black;
  color: white;
}

.active {
  background-color: #004040;
  font-weight: bold;
}

.markdown-body h5 {
  background-color: cyan;         /* Sets the background color to cyan */
  padding: 5px 10px;             /* Adds some internal spacing: 5px top/bottom, 10px left/right */
  display: inline-block;         /* Makes it behave like a button instead of taking full width */
  border: outset;                  /* Removes any default border */
  border-radius: 4px;            /* Adds slightly rounded corners */
  font-size: .75rem;              /* Sets a smaller font size */
  color: black;                 /* Sets text color (adjust as needed for contrast) */
  cursor: pointer;              /* Shows a hand cursor when hovering */
}

/* Optional: Add hover effect */
h5:hover {
  background-color: #00cccc;     /* Slightly darker cyan on hover */
}