@charset "utf-8";
/* CSS Document */

/* COMIC COVER HOVER COLOR CHANGE ADDED 03-03-2026 */

.cover-image-hover {
    /* Optional: smooth transition effect */
    transition: filter 0.3s ease;
}

.cover-image-hover:hover {
    /* Example: turn the image black and white */
    filter: grayscale(100%);
    /* Example: change the brightness */
    /* filter: brightness(150%); */
    /* You can use other filter options like sepia, hue-rotate, etc. */
}

/* FADED BACKGROUND IMAGE */

.my-faded-background-container {
    position: relative; /* Contains the absolutely positioned pseudo-element */
    min-height: 400px; /* Ensure the container has height */
    isolation: isolate; /* Creates a new stacking context */
    padding: 100px; /* Add padding so content isn't right at the edge */
}

.my-faded-background-container::before {
    content: "";
    background-image: url('/images/Dan-at-Bell-2024-Cropped.jpg'); /* Replace with your image path */
    background-size: cover; /* Ensures the image covers the entire area */
    background-position: center; /* Centers the image */
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0.3; /* Adjust opacity (0.0 to 1.0) for the fade effect */
    z-index: -1; /* Pushes the background behind the content */
}

.content-wrapper {
    position: relative; /* Ensures content is above the pseudo-element background */
    z-index: 1;
}