There are two separate issues causing your problems, both of which look to be caused by global CSS on your web page that the Juicebox gallery is inheriting.
It looks like your web page uses the border-box model for all elements on the page (which affects the icons and thumbnail frames being offset) and sets a global font (which overrides the main image navigation buttons).

Try adding the following CSS to your gallery's 'jbcore/classic/theme.css' page which should solve the second issue (with the main image navigation buttons):

.jb-navigation .jbn-left-button, .jb-navigation .jbn-right-button {
    font-family: juicebox;
}

With regard to the first issue, try searching through the CSS on your web page for an entry such as:

* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

If you find such an entry, change it to:

body {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

... and then add the following CSS to your gallery's 'jbcore/classic/theme.css' page. This should fix the problem.

.juicebox-gallery a, .juicebox-gallery div, .juicebox-gallery h1, .juicebox-gallery h2, .juicebox-gallery h3, .juicebox-gallery h4, .juicebox-gallery p, .juicebox-gallery span, .juicebox-gallery u {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

Bug reports have been logged for both issues so the gallery elements affected should hopefully be better protected against global CSS in the next version of Juicebox.