/*
 SilverStripe ee (effortless effort) Theme
 */
 
* {
	margin: 0;
	padding: 0;
}

html {

}

body {
 	font-size: 76%;  /* Do not use less then this 76% here.  See http://www.thenoodleincident.com/tutorials/typography/ */
	font-family: arial, helvetica, sans-serif;

 	margin-bottom: 40px;
	position: absolute;
	width: 100%;
	height: 100%;
	background: #121315 url("../images/ee-noise.jpg") 0 0 repeat;
}

/* gradient */
#Dharmakaya {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	/*background: transparent url("../images/gradient-1500x25.jpg") top center repeat-y; */
}

/* 900px Site Container Box - top to bottom - contains the stage*/

#CenterContainer {
	width: 900px;
	position:relative;
	top: 0px;
	margin: 0 auto;
	background: transparent;
	z-index : 1;
	
}

#TopOfStage { 
	position : absolute;
	background: transparent url("../images/top-of-stage-900x53.jpg") top center no-repeat; 
	top : 60px; 
 	left: 0px;
	height: 53px;
	width : 100%;
	margin : 0 auto;
	z-index : -1; /* behind logo */
}

#TopOfStageRelative {
	position : relative;
	height: 100%;
	width : 100%;
}

#NavMain {
		/* parent must be "position : relative" */
	position : absolute;
 	right: 0px; 
 	bottom: 7px; /* 7px stripe */
}

#NavMainAccent {
	position : absolute;
	
	left : 0px;
	bottom : 5px;
	
	width : 100%;
	height : 1px;

	z-index : 1; /* in case any issue with nav div covering me */
}

#Logo  {
	background: transparent url("../images/logo-ee.png") top left no-repeat; 
	position : absolute;
	top : 9px; 
	left : 8px; 
	z-index : 1;
	width : 370px;
	height : 95px;
}

#Logo a {
	width:100%; 
	height:100%; 
	display:block;
	/* This determines the color of the rectangle that appears momentarily as you click the link.  Can't seem to get rid of it. */
	color : #788e67; 
		/* These may not be necesary */
	text-decoration : none;
	border:none;

}

#CenterStage {
	position : absolute;
	background-color: #111111; 
	width : 100%;
	margin : 0 auto;
	top : 113px; /* 60px + 53px */
 	left: 0px;
	min-height: 400px;
}

/** Breadcrumb area and secondary nav menu **/

#NavSecondLine {
	position : relative;
	width : 100%;
	height : 24px;
}

/* We need this div in order to draw the accent over it.  See nav.css*/
#NavSecondLineAccent {
	position : absolute;
	
	left : 0px;
	bottom : 0px;
	
	width : 100%;
	height : 1px;

	z-index : 1; /* in case any issue with nav div covering me */
}

#NavBreadCrumbLine {
	position : relative;
	width : 100%;
}

	.noAccent#NavBreadCrumbLine {
		height : 16px;
		border-style : none;
	}

	.accent#NavBreadCrumbLine {
		height : 22px;
		border : 1px solid #1c1e1b;
	}


#Breadcrumbs { 
	position : absolute;
 	left: 0px; 
}

	.accent#Breadcrumbs {
	 	bottom: 4px; /* 1px stripe */
	}

	.noAccent#Breadcrumbs {
	 	bottom: 0px; /* no 1px stripe */
	}

#Layout {
	position : relative;
	width: 860px;
	margin : 0 auto;
	padding-top: 18px;
	overflow: hidden;
	height : auto;
	padding-left : 12px;
/*	background: #ddd; */
	margin-bottom : 30px; /* footer is absolute positioning, so won't normally get accounted for */
	margin-left : 10px;
}

#Content {
	padding: 0px;
	text-align: left;
	overflow: hidden;
}


/*************************************************************************************/
/** SITE LIST / SITE PAGE ************************************************************/
/*************************************************************************************/
/**/
/**/

#SiteList ul li
{
	clear : both;
 	list-style: none; 
}


#SiteList li .smallImage {
	margin-bottom : 8px;
}

#SiteList li.odd .smallImage {
	float : left;
	margin-right : 10px;
}

#SiteList li.even .smallImage {
	float : right;
	margin-left : 10px;
}

#SiteList .siteInfo {
	position : relative;
	top : 10px;
}

#SiteList li.odd .siteInfo {
	float : left;
}

#SiteList li.even .siteInfo {
	float : right;
}

#SiteList li.even p.siteInfoParagraph {
	text-align : right;
}

#SiteList img {
	opacity : 0.7; 
}

#SiteList img:hover {
	opacity : 1.0; 
	border-color: #788e67; /* don't use the brightest hilight here */

}




/*************************************************************************************/


#SitePage {
	min-height : 500px;
}

#SitePage #ImageStage {
	position : relative;
}

#SitePage #ImageStage #FeatureComments {
	margin-left : 6px;
}


#SitePage #SiteInfo {
/*	 background-color: #aaa; */
	position : absolute;
	left : 660px;
	top : 0px;
	width : auto;
	margin-top: 20px;
	padding-left: 12px;
}

#SitePage #SiteInfo p {
	margin: 0;
	margin-top: px;

}

#SitePage #SiteInfo #URL a {
 	color: #aaa; /* regular text, but a bit brighter */
}

#SitePage #SiteInfo #URL a:hover { 
	color: #badca1;
}

#SitePage #SiteInfo #Summary {
	margin-top : 12px;
	padding-right : 12px;
}


#SitePage #ImageStage {
/*	 background-color: #aaa; */
}

#SitePage #ImageStage #BackContainer {
	margin-top : 3px;
	width : 100%;
	text-align : right;
}

#SitePage #ImageStage #BackContainer a {
	margin-right : 6px;
}

/**/
/**/
/*************************************************************************************/
/** END SITE PAGE ************************************************************************/
/*************************************************************************************/