.lightbox{
    cursor:pointer;
    position:fixed;
    width:100%;
    height:100%;
    top:0;
    left:0;
    background:url(data:image/png;
    base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAIElEQVQ4T2NkYGDYDMRkA8ZRAxhGw4BhNAyA+WAYpAMAIFgLQfO9BoEAAAAASUVORK5CYII=);
    background:rgba(0,0,0,.7);
    -webkit-filter:none!important;
    z-index:9997
}
.lightbox img{
    display:block;
    position:absolute;
    border:5px solid #fff;
    box-shadow:0 0 20px #000;
    border-radius:1px
}
body.blurred>*{
    -webkit-filter:blur(2px);
    -webkit-transform:translate3d(0,0,0)
}
.lightbox__loading{
    background:url(loading.gif) center center no-repeat;
    width:32px;
    height:32px;
    margin:-16px 0 0 -16px;
    position:absolute;
    top:50%;
    left:50%
}
.lightbox__caption{
    display:none;
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
    text-align:center;
    z-index:9998;
    background:#000;
    background:rgba(0,0,0,.7)
}
.lightbox__caption p{
    margin:0 auto;
    max-width:70%;
    display:inline-block;
    padding:10px;
    color:#fff;
    font-size:12px;
    line-height:18px
}
.lightbox__button{
    position:absolute;
    z-index:9999;
    background:center center no-repeat;
    width:32px;
    height:32px;
    opacity:.4;
    -webkit-transition:all .3s;
    -moz-transition:all .3s;
    -ms-transition:all .3s;
    transition:all .3s
}
.lightbox__button:focus,.lightbox__button:hover{
    opacity:1;
    -webkit-transform:scale(1.4);
    -moz-transform:scale(1.4);
    -ms-transform:scale(1.4);
    transform:scale(1.4)
}
.lightbox__close{
    right:10px;
    top:10px;
    background-image:url(close.png)
}
.lightbox__nav{
    top:50%;
    margin-top:-16px
}
.lightbox__nav--next{
    right:10px;
    background-image:url(next.png);
    margin-right:20%;
}
.lightbox__nav--prev{
    left:10px;
    background-image:url(previous.png);
    margin-left:20%;
}