/* ------------------------------------------------------------------ */
/* Eibon 10 Zone Grid */
/* ------------------------------------------------------------------ */

/* Clamp the entire content of the page to a fixed width,
 * and center it.
 */
div#gridClamp {
  width: 980px;
  margin: 0 auto;
}

/* Main content div, below the navigation. Here basically to provide
 * a background color.
 */
div#gridMain {
  position: relative;
  width: 980px;
    
    /* We need to float this element because it contains only floated 
     * elements. If we didn't, the computed height would be 0, because
     * floated elements are not usually part of the computed height of
     * the containing block. Making this element float ensures that the
     * floated child elements are part of the computed height.
     * See the CSS 2.1 spec, sections 10.6.6 and 10.6.7.
     */
  float: left;
}

div#gridFrame {
  float: left;
	margin: 10px;
}

div#gridColumnContainerTop,
div#gridColumnContainerBottom {
  float: left;
}

div#gridTopColumnLeft {
  float: left;
  width: 450px;
  margin-right: 10px;
}
div#gridTopColumnRight {
  float: left;
  width: 330px;
  margin-right: 10px;
}
div#gridTopSidebar {
  float: right;
  width: 160px;
}

div#gridBottomSidebarLeft  {
  float: left;
  width: 160px;
  margin-right: 10px;
}
div#gridBottomColumnRight {
  float: left;
  width: 450px;
}

div#gridRightColumn {
  float: right;
  width: 330px;
}
div#gridSidebarContainer {
  float: left;
}
div#gridSecondarySidebarLeft {
  float: left;
  width: 160px;
  margin-right: 10px;
}
div#gridSecondarySidebarRight {
  float: left;
  width: 160px;
}

div#gridBottomSidebar {
  float: right;
  width: 330px;
}