/* 
  == STRUCTURE: ========================
   * Page width:            1012 px
   * Number of columns:     4
   * Column width:          250 px
   * Margin width:          4 px
  ======================================
*/
.container {width:1012px;margin:0 auto;}
.showgrid {background:url(grid.png);}
body {margin:1.5em 0;}
div.span-1, div.span-2, div.span-3, div.span-4 {float:left;margin-right: 4px;}

div.last {margin-right:0;}
.span-1  { width: 250px;}
.span-2  { width: 504px;}
.span-3  { width: 758px;}
.span-4, div.span-4 { width: 1012px; margin: 0; }

.append-1  { padding-right: 254px;}
.append-2  { padding-right: 508px;}
.append-3  { padding-right: 762px;}

.prepend-1  { padding-left: 254px;}
.prepend-2  { padding-left: 508px;}
.prepend-3  { padding-left: 762px;}

div.border{padding-right:1px;margin-right:2px;border-right:1px solid #eee;}
div.colborder { padding-right:249px;margin-right:248px;border-right:1px solid #eee;}
.pull-1 { margin-left: -254px;}
.pull-2 { margin-left: -508px;}
.pull-3 { margin-left: -762px;}
.pull-4 { margin-left: -1016px;}

.pull-1, .pull-2, .pull-3, .pull-4 {float:left;position:relative;}

.push-1 { margin: 0 -254px 1.5em 254px;}
.push-2 { margin: 0 -508px 1.5em 508px;}
.push-3 { margin: 0 -762px 1.5em 762px;}
.push-4 { margin: 0 -1016px 1.5em 1016px;}

.push-1, .push-2, .push-3, .push-4 {float:right;position:relative;}

.clearfix:after,.container:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.clearfix,.container{display:inline-block;}
* html .clearfix,* html .container{height:1%;}
.clearfix,.container{display:block;}
.clear{clear:both;}