Style distribution choice, add compass for border radius mixin

Gemfile

@@ -29,6 +29,7 @@ gem 'representative_view'
 # in production environments by default.
 group :assets do
   gem 'sass-rails',   '~> 3.2.3'
+  gem 'compass-rails'
   gem 'coffee-rails', '~> 3.2.1'
 
   # See https://github.com/sstephenson/execjs#readme for more supported runtimes

Gemfile.lock

@@ -162,6 +162,7 @@ GEM
       xpath (~> 1.0.0)
     childprocess (0.3.6)
       ffi (~> 1.0, >= 1.0.6)
+    chunky_png (1.2.7)
     climate_control (0.0.3)
       activesupport (>= 3.0)
     cocaine (0.5.1)
@@ -179,6 +180,12 @@ GEM
       active_link_to (~> 1.0.0)
       paperclip (>= 2.3.0)
       rails (>= 3.0.0)
+    compass (0.12.2)
+      chunky_png (~> 1.2)
+      fssm (>= 0.2.7)
+      sass (~> 3.1)
+    compass-rails (1.0.3)
+      compass (>= 0.12.2, < 0.14)
     database_cleaner (0.7.1)
     debugger (1.1.4)
       columnize (>= 0.3.1)
@@ -210,6 +217,7 @@ GEM
       i18n (~> 0.4)
     ffaker (1.12.1)
     ffi (1.3.1)
+    fssm (0.2.10)
     haml (3.1.6)
     highline (1.6.11)
     hike (1.2.1)
@@ -383,6 +391,7 @@ DEPENDENCIES
   capybara
   coffee-rails (~> 3.2.1)
   comfortable_mexican_sofa
+  compass-rails
   database_cleaner (= 0.7.1)
   debugger-linecache
   factory_girl_rails

app/assets/stylesheets/store/openfoodweb.css.scss

@@ -1,4 +1,5 @@
-@import 'screen';
+@import "screen";
+@import "compass/css3/border-radius";
 
 a:hover {
   color: lighten($link_text_color, 20) !important;
@@ -23,7 +24,8 @@ nav #main-nav-bar {
   li {
     &#current-distributor {
       float: right;
-      margin-right: 24px;
+      clear: right;
+      margin: 0.5em 5px 0 0;
 
       a {
         font-size: 12px;
@@ -63,6 +65,25 @@ nav#filters {
 }
 
 
+/* Distributor / order cycle selection */
+#distribution-choice {
+  overflow: auto;
+  margin-bottom: 2em;
+  padding: 5px;
+  border: 2px solid #ccc;
+  @include border-radius(10px);
+
+  .distributors {
+    float: left;
+    margin-right: 4em;
+  }
+
+  .order-cycles {
+    float: left;
+  }
+}
+
+
 /* Style the product source on the product details page in the
  * same manner as the product properties table above it.
  */
@@ -139,7 +160,7 @@ ul.product-listing {
 #products-local ul {
   margin-bottom: 1em;
   padding: 10px;
-  border-radius: 10px;
+  @include border-radius(10px);
   background-color: #def;
 }