body, html {

    margin: 0;

    padding: 0;

}



.overlay {

    position: fixed;

    bottom: 0;

    left: 0;

    width: 100%;

    background-color: rgba(0, 0, 0, 0.5); /* Adjusted for more transparency */

    display: flex;

    justify-content: center;

    align-items: center;

    z-index: 1000;

    padding: 10px 0;

}



.image-container {

    position: relative;

}



.image-container img {
    max-width: 1140px;
    width: 100%;
    max-height: 200px;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}



.close-btn {

    position: absolute;

    top: 10px;

    right: 10px;

    background-color: #ff5c5c;

    color: white;

    border: none;

    border-radius: 50%;

    width: 30px;

    height: 30px;

    text-align: center;

    cursor: pointer;

    font-size: 20px;

    line-height: 30px;

    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);

}



.close-btn:hover {

    background-color: #ff2e2e;

}