/********************************************************************/
/*                                                                  */
/*                            Image Gallery                         */
/*                                                                  */
/********************************************************************/


#panGallery {
    background: #FFF;
    padding: 1em;
    box-shadow: 0 38px 20px -31px rgba(0,0,0,0.2);
}

#panGalleryHeadline h2 {
    font-size: 2.5em;
    font-weight: 800;
    padding: .5em 0 .5em 0;
    margin-top: 0;
}

#panDescription p {
    font-size: 1.2em;
    margin-bottom: 1em;
}

#panPageInfo {
    text-align: right;
}

#panGalleryCommand {
    text-align: right;
}

.galleryButtons {
    color: #FFF;
    text-decoration: none;
    font-size: 1em;
    padding: 0.2em 2.5em 0.2em 2.5em;
    background: #3b3b3b;
    border: 0;
    cursor: pointer;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

    .galleryButtons:hover {
        background: #000;
    }

#dlGallery {
    width: 100%;
    border: solid 2px #FFF;
}


    #dlGallery tbody tr {
        clear: both;
        padding: 0px;
        margin: 0px;
    }

        #dlGallery tbody tr td {
            display: table-cell;
            /*float: left;*/
            /*margin: 1% 0 1% 1.6%;*/
            width: 23%;
            /*height: 200px;*/
            position: relative;
            text-align: center;
            border: solid 1px #eeeeee;
            overflow: hidden;
            vertical-align: middle;
        }

            #dlGallery tbody tr td:hover {
                opacity: .85;
            }

            #dlGallery tbody tr td a {
                padding: 1em;
            }

            #dlGallery tbody tr td a {
                /*height: 150px;
                vertical-align: middle;*/
            }

#panGalleryMedia #lnkImage {
    display: inline-block;
}

#dlGallery tbody td:first-child {
    margin-left: 0;
}

#dlGallery tbody tr {
    zoom: 1; /* For IE 6/7 */
}


#dlGallery tbody td a img {
    /*height: 100%;*/
    width: 80%;
    /*border: solid 5px #3b3b3b;*/
    border-radius: 2px;
}

/********************************************************************/
/*                                                                  */
/*                              Lightbox                            */
/*                                                                  */
/********************************************************************/

#lightboxOverlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9999;
    background-color: black;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
    opacity: 0.85;
    display: none;
}

#lightbox {
    position: absolute;
    left: 0;
    width: 100%;
    z-index: 10000;
    text-align: center;
    line-height: 0;
    font-family: 'lucida grande', tahoma, verdana, arial, sans-serif;
    font-weight: normal;
}

    #lightbox img {
        width: auto;
        height: auto;
    }

    #lightbox a img {
        border: none;
    }

.lb-outerContainer {
    position: relative;
    background-color: white;
    *zoom: 1;
    width: 250px;
    height: 250px;
    margin: 0 auto;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
}

    .lb-outerContainer:after {
        content: '';
        display: table;
        clear: both;
    }

.lb-container {
    padding: 10px;
}

.lb-loader {
    position: absolute;
    top: 40%;
    left: 0%;
    height: 25%;
    width: 100%;
    text-align: center;
    line-height: 0;
}

.lb-nav {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 10;
}

.lb-container > .nav {
    left: 0;
}

.lb-nav a {
    outline: none;
}

.lb-prev, .lb-next {
    width: 49%;
    height: 100%;
    background-image: url('data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7');
    display: block;
}

.lb-prev {
    left: 0;
    float: left;
    cursor: pointer;
  
}

.lb-next {
    right: 0;
    float: right;
    cursor: pointer;
  
}

.lb-prev:hover {
    background: url(../css/images/prev.png) left 48% no-repeat;
    margin-left: 1em;
}

.lb-next:hover {
    background: url(../css/images/next.png) right 48% no-repeat;
    margin-right: 1em;
}

.lb-dataContainer {
    margin: 0 auto;
    padding-top: 5px;
    *zoom: 1;
    width: 100%;
    -moz-border-radius-bottomleft: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -ms-border-bottom-left-radius: 4px;
    -o-border-bottom-left-radius: 4px;
    border-bottom-left-radius: 4px;
    -moz-border-radius-bottomright: 4px;
    -webkit-border-bottom-right-radius: 4px;
    -ms-border-bottom-right-radius: 4px;
    -o-border-bottom-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

    .lb-dataContainer:after {
        content: '';
        display: table;
        clear: both;
    }

.lb-data {
    padding: 0 10px;
    color: #bbbbbb;
}

    .lb-data .lb-details {
        width: 85%;
        float: left;
        text-align: left;
        line-height: 1.1em;
    }

    .lb-data .lb-caption {
        font-size: 13px;
        font-weight: bold;
        line-height: 1em;
    }

    .lb-data .lb-number {
        display: block;
        clear: left;
        padding-bottom: 1em;
        font-size: 11px;
    }

    .lb-data .lb-close {
        width: 35px;
        float: right;
        padding-bottom: 0.7em;
        outline: none;
    }

        .lb-data .lb-close:hover {
            cursor: pointer;
        }

/********************************************************************/
/*                                                                  */
/*                            Responsive                            */
/*                                                                  */
/********************************************************************/

@media all and (max-width : 1000px) {


    #panGalleryMedia #lnkImage {
        display: inherit;
    }

    .lb-outerContainer {
        width: 90% !important;
        height: 90% !important;
    }

    .lb-dataContainer {
        width: 90% !important;
    }

    #lightbox img {
        width: 100% !important;
    }

    .lb-close {
        width: 10% !important;
        max-width: 30px !important;
    }

    #dlGallery {
        width: 100%;
    }

        #dlGallery tbody tr td {
            height: auto;
        }



            #dlGallery tbody tr td a img {
                /*display: block;*/
                position: relative;
                z-index: 1;
                /*height: 100px;
                width: 98%;*/
            }

            #dlGallery tbody tr td a {
                height: auto;
            }

        #dlGallery tbody td:first-child {
            margin-top: 1%;
        }
}

@media all and (max-width : 630px) {

    /*#dlGallery tbody tr td {
        width: 49%;
    }*/



    #dlGallery tbody tr td:nth-child(3) {
        margin-left: 0;
    }

    #dlGallery tbody tr td a img {
        /*display: block;*/
        position: relative;
        z-index: 1;
        padding: 1em;
        /*height: 110px;
            width: 98%;*/
    }
}

@media all and (max-width : 430px) {

    #dlGallery tbody td a img {
        height: 100%;
        /*border: 2px solid #3B3B3B;*/
        border-radius: 2px;
    }
}



/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */