css guide part 1

I have written the first part of the css guide - currently i have omitted most of the smaccs naming conventions and variable / mxins guidlines for CSS preprocessors. however i think there is enough to review currently and get feelings for what is here so far. 

Can we group the recommended and not recommendeds together. On first reading I thought that .error was a bad css name rather than the fact it shouldn't be a type of div.