/* ------------------------------------------------------------------ */
/* Rheya 10 Zone Grid - 4 columns, 4 spanning zones, 1 Header and 1 Footer */
/* ------------------------------------------------------------------ */

/* 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 {
    background-color: #FFF;
    position: relative;
    width: 960px;
	margin: 10px;
    
    /* 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 {
	width: 580px;
	margin: 10px;
	float: left;
}
div#gridSpanningHeader {
	width: 580px;
	margin-bottom: 10px;
	float: left;
}
div#gridColumnContainer {
	width: 560px;
	padding: 10px;
	float: left;
	}
	div#gridLeftColumn {
		width: 215px;
		margin-right: 5px;
		float: left;
	}
	div#gridRightColumn {
		width: 340px;
		float: left;
	}
	div#gridColumnBottom {
		width: 560px;
		margin: 10px 0;
	}
div#gridMainRightColumn {
	width: 350px;
	margin: 10px 10px 10px 0;
	float: left;
	}
	div#gridMainSidebar {
		width: 350px;
	}
	div#gridAdSidebars {
		width: 350px;
		float: left;
		}
		div#gridMainSidebarJr {
			width: 215px;
			margin-right: 10px;
			float: left;
		}
		div#gridAdSidebar {
			width: 125px;
			float: left;
		}
	div#gridSidebarBottom {
		width: 350px;
	}