#soundToggle {
    position: fixed;
    bottom: 20px;
    right: 20px;
    padding: 10px;
    background-color: #008CBA;
    color: white;
    border: none;
    border-radius: 5px;
}

body {
    display: grid;
    justify-content: center;
    align-items: center;
    height: 100vh;
    margin: 0;
    background-color: #f0f0f0;
    background-image: url('https://pub-053dc43895a24c2da400ee0c12ebdec4.r2.dev/stained.jpg');
}

.audio-container {
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.media-container {
    margin: 0 auto;
    max-width: 80%;
    padding: 20px;
}

.media-item {
    background: #000; /* Your preferred background color */
    border-radius: 25px; /* Adjust for desired curvature */
    overflow: hidden; /* Ensure content respects border radius */
    margin-bottom: 35px; /* Space between items */
}

.media-item img {
    display: block; /* Remove any default inline spacing */
    width: 100%; /* Ensure image fills the container */
    height: 98vh; /* Maintain aspect ratio */
}

.media-item video {
    display: block; /* Remove any default inline spacing */
    width: 100%; /* Ensure content fills the container */
    height: 200vh; /* Adjust this value as needed to maintain aspect ratio */
    object-fit: cover; /* This can help maintain aspect ratio for videos */
}