@charset "utf-8";



.lightboxlike_background {
    position: fixed;
    z-index: 2000;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
/*
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
*/
}

.lightboxlike_dialog {
    /* box-shadow: 0 0 3px 3px #333; */
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    margin: auto;

    border: 3px #111 solid;
    background-color: rgba(0, 0, 0, 0.5);
}

.lightboxlike_background .close_button {
    position: absolute;
    z-index: 2500;
    top: 2%;
    right: 2%;
    width: 36px;
    height: 36px;
    cursor: pointer;

    line-height: 36px;
    text-align: center;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 3px 3px #333;
    text-shadow: 0 0 3px 3px #333;
    border: 2px #ccc solid;
    color: #ccc;
}

.lightboxlike_background .close_button::before {
    content: "";

    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

    width: 50%;
    height: 50%;
    margin-top: 39%;
    margin-left: 44%;

    border-top: 1px #fff solid;
    transform: rotate(-45deg);
}

.lightboxlike_background .close_button::after {
    content: "";

    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

    width: 50%;
    height: 50%;
    margin-top: 39%;
    margin-right: 44%;

    border-top: 1px #fff solid;
    transform: rotate(45deg);
}



.lightboxlike_background .close_button:hover {
    background-color: rgba(255, 255, 255, 0.9);
}

.lightboxlike_background .close_button:hover::before {
    border-top: 1px #111 solid;
}

.lightboxlike_background .close_button:hover::after {
    border-top: 1px #111 solid;
}



.lightboxlike_image,
.lightboxlike_video {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    max-width: 100%;
    max-height: 100%;
}

.close_overlay {
    position: absolute;
    z-index: 55;
    top: 0;
    left: 0;
    right: 0;
    bottom: auto;
    width: 100%;
    height: 90%;
    color: #fff;
}