.tl {
    background-position : 0 0;
}

.t {
    background-position : 0 0;
}

.tr {
    background-position : 10px 0;
}

.mr {
    background-position : 10px 0;
}

.br {
    background-position : 10px 10px;
}

.b {
    background-position : 0 10px;
}

.bl {
    background-position : 0 10px;
}

.ml {
    background-position : 0 10px;
}

div.topBanner {
    width               : 984px;
    margin-left         : -15px;
    margin-right        : -15px;
    text-align          : center;
}

/********** lightbox start *********/
#lightbox {
    position            : absolute;
    left                : 0;
    width               : 100%;
    z-index             : 100;
    text-align          : center;
    line-height         : 0;
}

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

#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-image    : url( "data:image/gif;base64,AAAA" ); /* Trick IE into showing hover */
    display             : block;
}

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

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

#prevLink, #prevLink:visited {
    background          : url(../images/einvite/UI/prevlabel.gif) left 15% no-repeat;
}

#nextLink, #nextLink:visited {
    background          : url(../images/einvite/UI/nextlabel.gif) right 15% no-repeat;
}

#imageDataContainer, #imageDataContainerBottom {
    font                : 10px Verdana, Helvetica, sans-serif;
    background-color    : #fff;
    margin              : 0 auto;
    line-height         : 16px;
    overflow            : auto;
    width               : 100%;
}

#imageData, #imageDataBottom {
    padding             : 0 10px;
    color               : #666;
}

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

#imageData #caption, #imageDataBottom #captionBottom {
    font-weight         : bold;
}

#imageData #numberDisplay, #imageDataBottom #numberDisplayBottom {
    display             : block;
    clear               : left;
    padding-bottom      : 12px;
}

#imageData #bottomNavClose, #imageDataBottom #bottomNavCloseBottom {
    width               : 66px;
    float               : right;
    padding-bottom      : 8px;
    outline             : none;
}

#overlay {
    position            : absolute;
    top                 : 0;
    left                : 0;
    z-index             : 90;
    width               : 100%;
    height              : 500px;
    background-color    : #000;
}
/********* lightbox end **********/