Refactor to new conventions

This refactors our current classnames to fit with new conventions that we've decided on. This will also *pummel* any unmerged local branches you have. Merge with caution!

I'm still gonna type up more formal conventions, but here are the basics:

**Modules** are *hyphen-separated*:
```css
.even-grid {}
```

**Subcomponents** of modules are separated with *double--hyphens*:
```css
.even-grid--item {}
```

**Modifiers** are *underscore_separated*:
```css
.even-grid--item_has-image {}
/* or */
.even-grid--item_is-active {}
```
**Only be as verbose as you need to be.** Don't allude to DOM structure when you don't need to:
```css
/* don't do */
.even-grid--contents--image {}

/* do */
.even-grid--image {}
```

---

One hole that these conventions might not account for is variants on modules (Snook calls them submodules). For example, if we needed a variant of `even-grid` to be styled to be extra wide. I'm not sure these conventions leave room for this.

Maybe we could use our modifier convention to account for these? That would look like this:

```css
.even-grid_wide { 
  /* styles for root of wide module variant */ 
}

.even-grid_wide--item {
  /* styles for a subcomponent of wide module variant,
  only if it needs special styling */ 
} 
```

```html
<div class="even-grid even-grid_wide">
  <div class="even-grid--item even-grid_wide--item"></div>
</div>
```
Thoughts?