Changing separating | to be border line (Bug 1279996)

To avoid the separating line between items in top right menu and in
the footer menu being read by some screen readers I've changed the
pipe char to be css border left.

Also dropped one of the top menu border bars when on small screens

Change-Id: I3e23fbf8fbad2480c9e9aaae56eda60fc7dede66
Signed-off-by: Robert Lyon <robertl@catalyst.net.nz>
Merge "Changing separating | to be border line (Bug 1279996)"