What are those weird boxes and how do I get rid of them?

The missing icons are supplied by a font that is downloaded from the server (@font-face) as you can see by little boxes that show the hex code of the characters.

Make sure that you allow pages to choose their own colors.

• Firefox > Preferences > Content : Fonts & Colors > Colors : [X] "Allow pages to choose their own colors, instead of my selections above"

(deleted wrong answer)

Make sure that you allow pages to choose their own fonts.

• Tools > Options > Content : Fonts & Colors > Advanced: [X] "Allow pages to choose their own fonts, instead of my selections above"

You can check the gfx.downloadable_fonts.enabled pref on the about:config page and make sure that it is set to true (if necessary double-click the line to toggle its value).

I followed the path you gave above to colors and that didn't do it, but clicked on the Advanced button and checked the box for "Allow pages to choose their own . . . " and that was it! Yes, my beautiful background is now gone on the toolbar, but being able to see the buttons in my email is so much more important. Thanks so much!