Account for browser/device safe area in a-content class

[planktonic]

See https://webkit.org/blog/7929/designing-websites-for-iphone-x/

atoms/content/ doesn’t currently account for any safe-area-inset-* values. So when fullscreen layouts are required to work on landscape, there are currently either borders at the sides, or the risk of the “notch” overlapping content.

Content class is already concerned with how our content aligns with the screen edges, and making sure there’s available space. Adding this functionality to a different class would encourage users to have nested elements applying padding keeping content away from the screen edges.