
/* - columns.css - */
@media screen {
/* The 16-column Deco Grid System. 
 * For the 12-column variant, see decogrids-12.css.
 *
 * Cells are 4% width, 1.125% left/right margin.
 * 
 * If page width is fixed to 960px width:
 * Cell will be equivalent to 40px, left/right margin will be 10px.
 */

div.row {
  float: left;
  width: 100%;
  display: block;
  position: relative;
}
div.cell {
  position: relative;
  float: left;
  left: 100%;
}

/* Width classes. 
   For a given cell width, the calculation is: width: (6.25*n - 2.25)% */
div.width-1  { width: 5px   }
div.width-2  { width: 110px }
div.width-3  { width: 170px }
div.width-4  { width: 230px }
div.width-5  { width: 290px }
div.width-6  { width: 350px }
div.width-7  { width: 410px }
div.width-8  { width: 470px }
div.width-9  { width: 530px }
div.width-10 { width: 590px }
div.width-11 { width: 650px }
div.width-12 { width: 710px }
div.width-13 { width: 770px }
div.width-14 { width: 830px }
div.width-15 { width: 890px }
div.width-16 { width: 950px }


/* Positioning classes, these are subtracting from a rightmost 
   position, which is why they seem the wrong way around */
/* For a given position, the calculation is margin-left: -100 + (6.25*n) + 1.125 */
div.position-0  { margin-left: -955px }
div.position-1  { margin-left: -895px }
div.position-2  { margin-left: -835px }
div.position-3  { margin-left: -775px }
div.position-4  { margin-left: -715px }
div.position-5  { margin-left: -655px }
div.position-6  { margin-left: -595px }
div.position-7  { margin-left: -535px }
div.position-8  { margin-left: -475px }
div.position-9  { margin-left: -415px }
div.position-10 { margin-left: -355px }
div.position-11 { margin-left: -295px }
div.position-12 { margin-left: -235px }
div.position-13 { margin-left: -175px }
div.position-14 { margin-left: -115px }
div.position-15 { margin-left:  -55px }

/* End of the core Deco Grid System */

/* Convenience classes — ¼, ½, ¾ widths and ¼, ½, ¾ positions. 
   Not strictly necessary. */
div.width-1\3a 2 { width:    470px } /* .width-1:2 */
div.width-1\3a 4 { width:    230px } /* .width-1:4 */
div.width-3\3a 4 { width:    710px } /* .width-3:4 */
div.width-full   { width:    955px  } 
div.position-1\3a 4 {margin-left:    -715px;} /* .position-1:4 */
div.position-1\3a 4b {margin-left:    -710px;} /* .position-1:4 + 5px margin right */
div.position-1\3a 2 {margin-left:    -475px} /* .position-1:2 */
div.position-1\3a 2b {margin-left:    -470px} /* .position-1:2  + 5px margin right */
div.position-3\3a 4 {margin-left:    -235px;} /* .position-3:4 */


/* Special classes for ⅓, ⅔ widths and ⅓, ⅔ positions. 
These do not strictly conform to the grid, but are useful for certain layouts. */
div.width-1\3a 3 { width: 31.08%; } /* .width-1:3 */
div.width-2\3a 3 { width: 64.42%; } /* .width-2:3 */
div.position-1\3a 3 {margin-left: -65.545%;} /* .position-1:3 */
div.position-2\3a 3 {margin-left: -32.205%;} /* .position-2:3 */

}

