Add "Community Favorite Crops" to home page

This PR does a couple things besides suck down time and spawn ebola jokes:

* Community favorite crops on the homepage! (based on number of associated guides, only 3 show on mobile).
* Super neat, smooth scroll, button/title thing for the featured crops
* Better CSS for the ~~super hacked~~ home nav

@rickcarlino @simonv3 Please check my actual code (things like `Routes.rb` to make sure I didn't break anything)

Hooray!
![mean kid](https://cloud.githubusercontent.com/assets/220240/4896124/f175b7a2-63f4-11e4-94b9-eb0e6904d1e3.jpg)

Something like this wouldn't work?

```javascript
$(window).load(function() {
  var pageHeight = $($('.hero')[0]).height();
  // get the height including margins of the featured crops title
  var titleHeight = $($('.explore-community-favorites')[0]).outerHeight(true);

  // On resize, recalculate the above values
  $(window).resize(function() {
    pageHeight = $($('.hero')[0]).height();
    titleHeight = $($('.explore-community-favorites')[0]).outerHeight(true);
  })

  $(window).scroll(function() {
    updateTitleBackground($(window).scrollTop(), pageHeight, titleHeight);
  })
});
```

`pageHeight` and `titleHeight` should still refer to the variables set in `.load()` because that's still the same scope.