[TASK] Use utility classes to replace individual margin and padding lines in css

[MagdalenaLarge]

Description

Blocked by: #223

We aim to replace every individual margin and padding declaration css by extending our utility classes. This will allow us to reuse code and have a single point of update if these sizes need to change in the future.

Task
Identify where we could reuse the utility classes for margins and padding and replace the lines with extending the utility classes like this example below. The sizes can be found in _margin.scss and _padding.scss. Because the utility classes use !important as default, use the new functionality to remove this where this causes issues by overriding styles we may not want to.

Example
Before:

After: