#myImage {
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.image-container {
  position: relative; /* Make container a positioning reference */
  overflow: hidden; /* Hide anything outside the area of the picture */
}

.image-container img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
  display: block; /* Makes image a block level element to fill all available space */
}

.button-container {
  position: fixed;
  bottom: 10px; /* Adjust distance from bottom */
  right: 10px; /* Adjust distance from right */
  background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent background */
  padding: 5px;
  border-radius: 5px;
}

.image-name {
  position: fixed;
  bottom: 10px;            /* Adjust distance from the top */
  left: 10px;           /* Adjsut distance from the left */
  color: white;         /* Example text color */
  font-weight: bold;    
  background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent background */
  padding: 5px;
}

/* Other styles */

.overlay-options label {
  color: white; /* Set the font color to white */
}