help me find my 1px vert. misalignment in my top nav CSS (pls – going bonkers)

Question: Can someone help me find a 1px (vertical) misalignment in my top nav CSS code for my TwentyFourteen theme?

Details:

Web site:

Issue: If one looks at the top navigation bar where the “About JR”, twitter genericon, and LinkedIn genericon are located, you will notice that all three are 1px from the top. As such they overflow on the red bottom border of the top nav by 1px. On the other hand, the search function in the same top nav is perfectly aligned to the top. This issue is visible on the desktop version of FF, Chrome, and Safari. I did not see the issue on the horizontal layout of the mobile version.

Standard CSS that comes with TwentyFourteen: (with very, very few modifications)
Add’l CSS file:
I use this CSS file to keep the original file “intact” while not having to create a child theme.

Stretch goal: While we are at it and looking at my code, you will notice that the three elements on the left have different horizontal spacing that the search toggle… if we can fix that too…

PS: I’m more than happy to provide any details requested.