Advam registration 1, create markup, styles for- registration form, section headings and updated margins on header and footer templates.

I've included comments above more around following BEM naming and nesting, the following comments are how this UI would be better constructed in a OOCSS way:

This isn't **layout** it's more of a module and let's not tie it to Registration because it's too limiting as I can see reuse already in the logged-in screens:

![screen shot 2014-06-26 at 11 45 40 am](https://cloud.githubusercontent.com/assets/1342772/3393980/aa7e4130-fcd3-11e3-9133-84c036993e0e.png)
![screen shot 2014-06-26 at 12 28 56 pm](https://cloud.githubusercontent.com/assets/1342772/3394199/a983af9e-fcd9-11e3-9585-1222ce836c46.png)

So we can start by breaking this right down for high-reuse across the build:

- A new module called `.panel` to replace `.reg-form`. You can have a modifier `.panel--off-white` (better to be broad with your names rather than being too semantic like *disabled* as the use case for this style isn't always *disabled*) to give you the off-white bg color variation which replaces `.reg-form__section-header-disabled`. This module can include the black header e.g. `.panel__hdr` to replace `.reg-form__section-header`. For the padding go with the abstraction: `.islet` as that's what the abstractions are there for to save you writing the same CSS again and again and of course to ensure consistency across your UI, same with [this rule](https://github.com/westfield/registered_carpark_ui/pull/4/files#diff-d3f0fa1d53bd544fc430bbb41c632db0R11), basically all spacing stuff like that should be abstracted out.
- Look at adding a new `.container--narrow` which will apply the fixed width you need for the main content area when in non-palm as using `.container-non-palm` is not what you need as it's too wide.

*Really important when building UI to look at the entire app when writing new CSS rather than to just focus on the screen you're working on, that's the essence of OOCSS :)*