WIP WCAG page reflow

[lucascumsille]

Fixes: https://github.com/mysociety/societyworks/issues/4209

This PR looks to comply with the WCAG 1.4.10. Some px units haven been changed to REM, so they have a responsive behaviour. Also some improvements to the layout so users don't lose functionality when zooming in.

So far:

• I have decreased the font-size for the html element when zooming in the text is not massive.
• I have changed the the header units from PX to REM so the point above actually has also an impact on the logo.

Pending:

• I need to discuss with Matthew the best approach for the around page. The fix above has generated that the following view, instead of just showing the the mobile map, which was the default behaviour when zooming in 400%. However we might need to change that behaviour because to fulfil the WCAG 1.4.10 criteria

Content can be presented without loss of information or functionality, and without requiring scrolling in two dimensions for:
Which is what is happening at the moment, where users zooming in can't see list of reports, as they could before zooming in.

[Skip changelog]

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 85.29%. Comparing base (269b6c9) to head (205ce86).

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #4981      +/-   ##
==========================================
+ Coverage   82.60%   85.29%   +2.68%     
==========================================
  Files         393      351      -42     
  Lines       30718    25633    -5085     
  Branches     4866     4866              
==========================================
- Hits        25376    21864    -3512     
+ Misses       3893     2320    -1573     
  Partials     1449     1449              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.