Da się jakoś wyśrodkować obrazek w pionie w lightbox? Najbardziej jest to widoczne w trybie mobilnym. Horyzontalnie jest wyśrodkowany, ale gdy ekran ma proporcje telefonu (jest tak zawsze, ale wtedy najbardziej widoczne), to znajduje się na samej górze.
Dodatkowo obrazek po zwężeniu okna przeglądarki jest tak samo szeroki, dopiero po przewinięciu obrazka na następny jego szerokość jest dopasowana. Da się go skalować w czasie rzeczywistym?


.lb-disable-scrolling {
    overflow: hidden;
}

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

.lightbox {
    position: absolute;
    left: 0;
    width: 100%;
    z-index: 10000;
    text-align: center;
    line-height: 0;
    font-weight: normal;
    outline: none;
}

.lightbox .lb-image {
    display: block;
    height: auto;
    max-width: inherit;
    max-height: none;
    border-radius: 3px;
    border: 1px solid silver;
}

.lightbox a img {
    border: none;
}

.lb-outerContainer {
    position: relative;
    *zoom: 1;
    width: 250px;
    height: 250px;
    margin: 0 auto;
    border-radius: 4px;
    This is visible during transitions. */
    background-color: white;
}

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