Hi NoVex. What you are doing there is really unreliable even on desktop browsers. When I opened your page, the icons were way off to the right, a long way from the boxes.
It's never a good idea to attempt to align elements with a background image. It just doesn't work. A better approach is to remove the yellow squares from the background image and keep them as a single, separate image (you only need one image, as they are all the same). Then give the anchors a width and height equal to the dimensions of the yellow square and place the square as a background image on each. That way, the icons can't stray from the background square. You then need to center the icons within the anchor, which should be easy enough with padding or whatever.
The next issue is to position the anchors inside the header area. There are various ways to do that, but I would probably just float them. However, at the moment the background image on the banner doesn't fit the banner container at wider screen widths, so it looks a bit rotten. On modern browsers, you can fix that with the background-size property. But you might be better off filling the banner area with a background color that visually extends the image left and right.