Mobile menus and other front end tweaks

This PR includes some fixes here and there that cropped up after the design refresh/restructuring from earlier. It should also deal with issue https://github.com/MarkUsProject/Markus/issues/1490.

It also includes mobile-friendly menus, which are mainly targeted at students, although they work for admins and TAs too, but the content for those users wouldn't really scale well on smaller screens anyway.

The web font used for MarkUs is now imported in a `link` in the HTML instead of an `@import` in the CSS to make it a bit more efficient.

Background colour was lightened up to increase contrast. Bonus marks in the marks summary was put into a table instead of using floats.

Note: the `transition`s for the mobile menus don't seem to work properly in Firefox (despite transitions working for other things), but works fine in Chromium. I'm not too bothered by this since I doubt many people use Firefox on their mobile devices anyway, and it's not really an issue.

Note: this PR does not include the new style guide's UI library. That will be done at a later date, since it will require some major restructuring. Instead, this is sort of an incremental update to ensure things are working nicely.