Thanks @creedon for the code and all the help you've provided in this thread.
I was trying it on my Squarespace 7.1 website but had to remove the code because I was having two issues with it which I couldn't solve. I am wondering if you might have any thoughts as what to tweak?
First, I was using the code to place a second button next to the default Squarespace navigation button. The positioning appeared correct on Chrome, but when viewed on Safari the two buttons were flush against each other with no padding in-between. Any way to make this consistent across browsers?
Second, I think when the coded button is next to the Squarespace 7.1 default nav button it takes on the same parameters. I.e., if I set the Squarespace button to open in a new tab then the coded one must as well. I'd like to set the Squarespace button to open in the same tab to an internal page and the coded button to open a file in a new tab. Is there any way to set the coded button to open in a new tab, where it doesn't take on the parameters of the other button to open in the same tab?