Open app where clicked

So I'm using a lightbox JS program and I'm trying to alter the CSS to fix an issue. The lightbox opens in the middle of the page, no matter what. I'm trying to get it to open over where the link was clicked instead of the middle of the page for every image. I'm much better versed in Js than CSS, so any help would be appreciated. Here is the full code, but I think the only 2 things of importance are mbCenter and mbMedia

#mbOverlay {
    position: fixed;
    z-index: 9998;
    top: 0;
    left: 0;
    width: 100%;
    height: 150%;
    background-color: 000000;
    cursor: pointer;
}

        /*  Fixes for older or limited browsers */

#mbOverlay.mbOverlayOpaque {
    background: transparent url(80.png) repeat;
}

#mbOverlay.mbOverlayAbsolute {
    position: absolute;
}

#mbOverlay.mbMobile {
    position: absolute;
    background-color: transparent;
}

#mbBottom.mbMobile {
    line-height: 24px;
    font-size: 16px;
}

        /*  Overlay panel styling   */

#mbCenter {
    position: absolute;
    z-index: 9999;
    left: 50%;
    padding: 10px;
    background-color: #000;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=180, Color='#000000'); /* For IE 5.5 - 7 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=180, Color='#000000')"; /* For IE 8 */
    -webkit-box-shadow: 0px 5px 20px rgba(0,0,0,0.50);
    -khtml-box-shadow: 0px 5px 20px rgba(0,0,0,0.50);
    -moz-box-shadow: 0px 5px 20px rgba(0,0,0,0.50);
    box-shadow: 0px 5px 20px rgba(0,0,0,0.50);
}

#mbCenter.mbLoading {
    background: #000 url(loading-dark.gif) no-repeat center;
        /*  This style is applied only during animation.    */
        /*  For example, the next lines turn off shadows    */
        /*  improving browser performance on slow systems.  */
        /*  To leave shadows on, just remove the following: */
    -webkit-box-shadow: none;
    -khtml-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

#mbMedia {
    position: relative;
    left: 0;
    top: 0;

        /*  Inline content styling  */

    font-family: Myriad, Verdana, Arial, Helvetica, sans-serif;
    line-height: 20px;
    font-size: 12px;
    color: #fff;
    text-align: left;
    background-position: center center;
    background-repeat: no-repeat;
}

        /*  Title, Caption and Button styling   */

#mbBottom {
    line-height: 10px;
    font-size: 12px;
    font-family: Myriad, Verdana, Arial, Helvetica, sans-serif;
    text-align: left;
    color: #999;
    min-height: 10px;
    padding: 0 0 6px;
}

#mbTitle, #mbPrevLink, #mbNextLink, #mbCloseLink {
    display: inline;
    color: #fff;
    font-weight: bold;
}

#mbNumber {
    display: inline;
    color: #999;
/*  line-height: 0.8em; */
    font-size: 0.8em;
    margin: auto 10px;
}

#mbCaption {
    display: block;
    color: #999;
    line-height: 1.6em;
    font-size: 0.8em;
}

#mbPrevLink, #mbNextLink, #mbCloseLink {
    float: right;
    outline: none;
    margin: 0 0 0 10px;
    font-weight: normal;
}

#mbPrevLink b, #mbNextLink b, #mbCloseLink b {
    color: #eee;
    font-weight: bold;
    text-decoration: underline;
}

#mbPrevLink big, #mbNextLink big, #mbCloseLink big {
    color: #eee;
    font-size: 1.4em;
/*  line-height: 0.9em;*/
    font-weight: bold;
}

#mbBottom a, #mbBottom a:link, #mbBottom a:visited {    /* Thanks to Danny Jung for feedback and corrections */
    text-decoration: none;
    color: #ddd;
}

#mbBottom a:hover, #mbBottom a:active {
    text-decoration: underline;
    color: #fff;
}

        /*  Error message styling   */

#mbError {
    position: relative;
    font-family: Myriad, Verdana, Arial, Helvetica, sans-serif;
    line-height: 20px;
    font-size: 12px;
    color: #fff;
    text-align: center;
    border: 10px solid #700;
    padding: 10px 10px 10px;
    margin: 20px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

#mbError a, #mbError a:link, #mbError a:visited, #mbError a:hover, #mbError a:active {
    color: #d00;
    font-weight: bold;
    text-decoration: underline;
}

I feel like background-position: center center; is the cause, but I'm not sure what to do with this info

Edit* Nevermind, I don't think background controls the placement.

Nevermind I found out why...I'm stuck with only being able to use html via iframe on host, and this depends on not being in an iframe, so it just doesn't work...great.