div.column { display: block; float: left; margin:0; margin-bottom:30px;}
div.clearer { clear: both; float: none; overflow: hidden; }

/* Use padding on the .inner element to set the gutter on columns. */
div.column .inner { padding: 0 15px; }

/* 960px Width / 8 Columns */
body.eight .one    { width: 12.5%; }
body.eight .two    { width: 25%; }
body.eight .three  { width: 37.5%; }
body.eight .four   { width: 50%; }
body.eight .five   { width: 62.5%; }
body.eight .six    { width: 75%; }
body.eight .seven  { width: 87.5%; }
body.eight .eight  { clear: both; float: none; }

/* 960px Width / 10 Columns */
body.ten .one      { width: 10%; }
body.ten .two      { width: 20%; }
body.ten .three    { width: 30%; }
body.ten .four     { width: 40%; }
body.ten .five     { width: 50%; }
body.ten .six      { width: 60%; }
body.ten .seven    { width: 70%; }
body.ten .eight    { width: 80%; }
body.ten .nine     { width: 90%; }
body.ten .ten      { clear: both; float: none; }

/* 960px Width / 12 Columns */
body.twelve .one      { width: 8.3%; }
body.twelve .two      { width: 16.6%; }
body.twelve .three    { width: 25%; }
body.twelve .four     { width: 33.3%; }
body.twelve .five     { width: 41.6%;}
body.twelve .six      { width: 50%; }
body.twelve .seven    { width: 58.3% }
body.twelve .eight    { width: 66.6%; }
body.twelve .nine     { width: 75%; }
body.twelve .ten      { width: 83.3%; }
body.twelve .eleven   { width: 91.6%; }
body.twelve .twelve   { clear: both; float: none; }

/* Alternate Column Styles, for use inside existing columns */
.half { width: 50%;}
.quarter { width: 25%;}
.third { width: 33.3%;}