/* LIGHTBOX
######################################################## */
#imagelightbox
{
    position: fixed;
    z-index: 9999;
        box-shadow: 0 10px 70px rgba(0,0,0,0.9);
}

#imagelightbox-close { display: none; }

        /* OVERLAY */

        #imagelightbox-overlay
        {
            background-color: rgba( 0, 0, 0, .8 );
            position: fixed;
            z-index: 9998;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
        }

        /* ARROWS */

        .imagelightbox-arrow
        {
            display: block; padding:50px 20px;
            background:none; border:none; font-size:50px; line-height: 1em;
            position: fixed;
            z-index: 10001;
            top: 50%;
            transform: translateY(-50%);
            cursor: pointer;
            color:#fff;
        }

            .imagelightbox-arrow-left   { left: 0; }
            .imagelightbox-arrow-right  { right: 0; }

        .imagelightbox-arrow:hover { background:none; }


        /* ACTIVITY INDICATION */

        #imagelightbox-loading,
        #imagelightbox-loading div
        {
            border-radius: 50%;
        }
        #imagelightbox-loading
        {
            width: 2.5em; /* 40 */
            height: 2.5em; /* 40 */
            background-color: #444;
            background-color: rgba( 0, 0, 0, .5 );
            position: fixed;
            z-index: 9997;
            top: 50%;
            left: 50%;
            padding: 0.625em; /* 10 */
            margin: -1.25em 0 0 -1.25em; /* 20 */

            -webkit-box-shadow: 0 0 2.5em rgba( 0, 0, 0, .75 ); /* 40 */
            box-shadow: 0 0 2.5em rgba( 0, 0, 0, .75 ); /* 40 */
        }
            #imagelightbox-loading div
            {
                width: 1.25em; /* 20 */
                height: 1.25em; /* 20 */
                background-color: #fff;

                -webkit-animation: imagelightbox-loading .5s ease infinite;
                animation: imagelightbox-loading .5s ease infinite;
            }

            @-webkit-keyframes imagelightbox-loading
            {
                from { opacity: .5; -webkit-transform: scale( .75 ); }
                50%  { opacity: 1;  -webkit-transform: scale( 1 ); }
                to   { opacity: .5; -webkit-transform: scale( .75 ); }
            }
            @keyframes imagelightbox-loading
            {
                from { opacity: .5; transform: scale( .75 ); }
                50%  { opacity: 1;  transform: scale( 1 ); }
                to   { opacity: .5; transform: scale( .75 ); }
            }

@media only screen and (max-width: 767px) {
#imagelightbox { transform: scale(1.5); }
.imagelightbox-arrow { display: none!important; }


        /* CLOSE */

        #imagelightbox-close { display:block; position: fixed; z-index: 10000; top:12px; right:12px; border:none; background-color:rgba(0,0,0,0.8); width:50px; height:50px; border-radius: 50px; color:#fff; }
        #imagelightbox-close:before, #imagelightbox-close:after {
            width: 2px;
            background-color: #fff;
            content: '';
            position: absolute;
            top: 20%;
            bottom: 20%;
            left: 50%;
            margin-left: -1px;

          }
          #imagelightbox-close:before {
                -webkit-transform: rotate( 45deg );
                -ms-transform: rotate( 45deg );
                transform: rotate( 45deg );
            }
            #imagelightbox-close:after {
                -webkit-transform: rotate( -45deg );
                -ms-transform: rotate( -45deg );
                transform: rotate( -45deg );
            }
}