row alignment right

With SiteOrigin Page Builder, I’m trying to create fixed navigation buttons (SiteOrigin Button) on both sides of the browser window (vertically about middle and outside the main region/area). I want the buttons to be only on certain pages, and each page has individually linked buttons.

I can do a 2-column row that’s full-width-stretched and have buttons fixed on the stretched ends of the row using the row’s CSS Styles:
position: fixed;
width: 100%;
top: 40%;
z-index: 10;
and aligning the buttons to left and right. So they stick to the edges of the browser window about half way down.

My problem is that, if I have widgets with hovering functions, the hover does not work when the mouse pointer is in the same height than the buttons (the row).

I can do a button on left side and shrink the row width to, let’s say 60px:
position: fixed;
width: 60px;
top: 40%;
z-index: 10;
and the button row does not interfere with the hovering (the row is not over the hovered item).

However, I cannot make the 60px wide row aligned to right side. How would I be able to do that? Or any other ideas/ways to do the fixed buttons located on both sides and on the edges of the browser window (about half way down).

(I’ve not found a proper plugin for my purpose, so I would like to do my buttons with the Page Builder, if possible.)

For the moment, I’m working local (MAMP), so unfortunately there’s no link to my pages.

Please help! Thanks in advance!