#imageforcaption {
    position: relative;
    display: inline-block;
    width: 100%; /* Ensure the image takes up the full width */
}

.photo-credit {
    position: absolute;
    bottom: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.7); /* Background with opacity */
    color: #fff; /* White text */
    padding: 5px 8px;
    font-size: 10px; /* Smaller font size */
    border-radius: 3px 0 0 0; /* Rounded corner at the top-left of the credit box */
    z-index: 10;
    max-width: 100%; /* Prevent credit from overflowing */
    text-align: right; /* Align text to the right */
    white-space: nowrap; /* Prevent the text from wrapping */
    overflow: hidden; /* Ensure long text stays within the box */
    text-overflow: ellipsis; /* Add ellipsis if the text is too long */
    margin: 0; /* Remove any potential margin */
}

/* Container for image caption (if present) */
.image-caption-container {
    width: 100%;
    margin: 0;
    padding: 0;
    position: relative;
}

/* Styling for the image caption */
.image-caption {
    background: rgba(241, 241, 241, 0.8); /* Light gray background */
    padding: 10px;
    font-size: 10px; /* Smaller font size */
    color: #333; /* Darker text color */
    width: 100%;
    box-sizing: border-box;
    text-align: left;
    justify-content: center;
    margin: 0;
    position: relative;
    font-style: italic;
    border-top: 1px solid #ddd; /* Add a border at the top of the caption for separation */
}

@media (prefers-color-scheme: dark) {
	.image-caption{
	    color: #fff; /* White text */
	    background: rgba(50, 50, 50, 0.8); /* Light gray background */

	}
}

.flexslider .slides img {
    width: 100%;
}