I just installed the Juicebox Lite (JB) version on a web site that I am building in my production server, else I'd send you a link.  When I add the code to an existing template of my web site, the JB gallery appears and functions well...except for a large gap above and below the main image being displayed.

I have changed the color of the background to help determine if the gap is caused by my code or the code of JB. The gap seems to be caused somewhere within JB code. I am using the Bootstrap Grid for Responsive web design for the web page, and I don't know if that is what is causing the gap. But when I use the "Inspect Element" function of my browser, the affected area doesn't show any Bootstrap CSS references that would cause gaps.

When I shrink the height of the browser window itself, by using mouse handles to shorten the height of the browser, the gaps respond and shrink when the height is reduced, then grow as the browser height it increased. If I decrease the percentage of galleryHeight in the script from 100% to 75%, the gaps decrease. However, if I move the browser width to emulate that of a table or cellphone, the gap remains constant and doesn't adapt to the new screen size.

Does anyone have a suggestion on how to make the gallery height (padding, margin, or otherwise) remove the gaps above and below the main image? -- Thanks!