.lightbox
{
    position: fixed;
    box-sizing: border-box;

    max-width: 100%;
    max-height: 100%;
    background-color: white;
    box-shadow: 0px 0px 20px 15px rgba(0,0,0, 0.5);
    z-index: 9991;
    overflow: auto;

    top: 50%; transform: translateY(-50%);
    margin: auto;
    left: 0; right: 0;
}


/*@media all and (max-width: 35em) {
    .light-box
    {
        left: 0;
    }
}
@media all and (min-width: 35em) {
    .light-box
    {
        margin: auto;
        top: 0; right: 0;
    }
}
@media all and (max-height: 45em) {
    .light-box
    {
        top: 0;
    }
}
@media all and (min-height: 45em) {
    .light-box
    {
        top: 50%;
        margin-top: -25%;
    }
}*/
.lightbox-blur-fx
{
    background-color: rgba(0,0,0, 0.7);
    filter: blur(0.25em);
    -webkit-filter: grayscale(100%) blur(0.25em);
}

.lightbox-click-blocker {
    display: block;
    
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(0,0,0, 0.9);
    z-index: 9990;
}
.lightbox-click-blocker:not(.active) {
    display: none;
}

.lightbox-fixed
{
    overflow: hidden;
}

.light-box-closeX
{
    font-family: Arial, Helvetica, sans-serif;
    /*float: right;*/
    font-weight: lighter;
    color: #000;
    margin-top: -0.1em;
    margin-right: 0.2em;
    font-size: 1.8em;
    /*color: white;*/
    line-height: 1em;
    padding: 0.1em;
    text-decoration: none;
    box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.35);
    border-radius: 1em;
    width: 1em;
    height: 1em;
    text-align: center;
    cursor: pointer;
    display: inline-block;
    position: absolute;
    right: 0;
    box-sizing:content-box;
}