#lightbox
{
    position:           absolute;
    top:                40px;
    left:               0;
    width:              100%;
    z-index:            100;
    text-align:         center;
    line-height:        0;
    }

#lightbox a img
{
    border:             none;
}

#outerImageContainer
{
    position:           relative;
    background-color:   #fff;
    width:              250px;
    height:             250px;
    margin:             0 auto;
}

#imageContainer
{
    padding:            10px;
}

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

#hoverNav
{
    position:           absolute;
    top:                0;
    left:               0;
    height:             100%;
    width:              100%;
    z-index:            10;
}

#imageContainer>#hoverNav
{
    left:               0;
}

#hoverNav a
{
    outline:            none;
}

#prevLink, #nextLink
{
    width:              49%;
    height:             100%;
    background:         transparent url(http://www.ogin.net/lightbox/blank.gif) no-repeat; /* Trick IE into showing hover */
    display:            block;
}

#prevLink
{
    left:               0;
    float:              left;
}

#nextLink
{
    right:              0;
    float:              right;
}

#prevLink:hover, #prevLink:visited:hover
{
    background:         url(http://www.ogin.net/lightbox/prevlabel.gif) left 15% no-repeat;
}

#nextLink:hover, #nextLink:visited:hover
{
    background:         url(http://www.ogin.net/lightbox/nextlabel.gif) right 15% no-repeat;
}

#imageDataContainer
{
    font:               10px Verdana, Helvetica, sans-serif;
    background-color:   #fff;
    margin:             0 auto;
    line-height:        1.4em;
}

#imageData
{
    padding:            0 10px;
}

#imageData #imageDetails
{
    width:              70%;
    float:              left;
    text-align:         left;
}

#imageData #caption
{
    font-weight:        normal;
}

#imageData #numberDisplay
{
    display:            block;
    clear:              left;
    padding-bottom:     1.0em;
}

#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;  }

#overlay{
    position: absolute;
    top:                0;
    left:               0;
    z-index:            90;
    width:              100%;
    height:             500px;
    background-color:   #333;
    filter:             alpha(opacity=50);
    -moz-opacity:       0.5;
    opacity:            0.5;
    }

.clearfix:after {
    content:            "."; 
    display:            block; 
    height:             0; 
    clear:              both; 
    visibility:         hidden;
    }

* html>body .clearfix {
    display:            inline-block; 
    width:              100%;
    }

* html .clearfix {
    /* Hides from IE-mac \*/
    height:             1%;
    /* End hide from IE-mac */
    }

