﻿/* Lightbox generic */
#lightbox {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 500;
    display: none;
}

    #lightbox .lightbox-header {
        position: relative;
        height: 35px;
    }

        #lightbox .lightbox-header h2 {
            margin: 0;
            margin-bottom: 10px;
        }

        #lightbox .lightbox-header .close {
            display: block;
            background-image: url(/Resources/Images/Sprite.png);
            background-repeat: no-repeat;
            position: absolute;
            top: 0;
            right: 0;
            width: 18px;
            height: 18px;
            background-position: 0 -327px;
        }

    #lightbox .overlay {
        background-color: rgba(0, 0, 0, 0.5);
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
    }

    #lightbox.loader .overlay {
        background-color: rgba(0, 0, 0, 0.5);
    }

    #lightbox .content,
    #lightbox .loader {
        padding: 1.5em 2em;
        background-color: white;
        color: black;
        width: 80%;
        margin: 0 auto;
        overflow: auto;
    }

    #lightbox .content {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    #lightbox.loader .content {
        display: none;
    }

    #lightbox .loader {
        width: 200px;
        text-align: center;
        display: none;
        font-size: 2em;
    }

        #lightbox .loader img {
            display: block;
            width: 31px;
            margin: 0 auto 1em;
        }

        #lightbox.loader .loader {
            display: block;
        } 
