/* Site Name Here */
/* Phosphor Essence Ltd */


/* BROWSER WRANGLING */

/* mac hide\*/
html, body {
	height: 100%;
}
/* end hide */

html, body, #container {
/*	scrollbar-face-color: #333333;
	scrollbar-base-color: #999999;
	scrollbar-highlight-color: #E2E2E2;
	scrollbar-shadow-color: #000000;
	scrollbar-3dlight-color: #CCCCCC;
	scrollbar-arrow-color: #FFFFFF;
	scrollbar-track-color: #333333;*/
}

/*************************************************************************** 
* The "height" above is a hack for IE5+/Win. Below it's adjusted using 
* the child selector to hide from IE5+/Win. 
* Without this, Moz1.0 adds a vertical scrollbar, & Firefox1.0/Opera7.54 
* cover everything with the footer when the viewport gets too small. 
***************************************************************************/ 

html,body {
	padding: 0px;
	margin: 0px;
}

html>body #container {
	/* height: auto; */
}
body {
	text-align: center; /* keeps main container centered */
	background-image: url(../images/bg.gif);
	min-width: 760px; /* for mozilla */
	margin: 0px;
}

div,p {
	margin-top: 0px;
} /*clear top margin for mozilla*/



/* PAGE STRUCTURE DIVS */

#container {
	width: 820px;
	min-height: 2000px;
	height: 2000px;
	color: #000000;
	background-image: url(../images/bg_wrap.gif);
	background-repeat: repeat-y;
	background-color: #f5fac9;
	padding: 0px;
	margin-left: auto;
	margin-right: auto; /*keeps container in center of page*/
	text-align: left;
	position: relative;
/*	float: center;   Needs this to left-align the site in Firefox and Safari */
}

#logo {	
	width: 780px; 
	width: 186px; 
	float: left;
}

#top { /*this forms the right column as well as acting as a container*/
/*	width: 555px;
	float: left;
	padding-top: 120px; make room for header*/
}

#pre-hdr { /* e.g. "case study" label above CS project title */
	color: #666600;
	font-size: 1.05em;
	font-weight: 460;
	margin-top: 0px;
	margin-bottom: 10px;
	line-height: 1.8em;
	position: relative;
	left: 200px;
	top: 5px;
}

#nav {
	margin: 0px;
	padding: 0px;
/*	padding-top: 5px;
	padding-bottom: 5px;
	background-color: #EFECC1;*/
	clear: both;
	position: relative;
}

#nav-position { 
	top: 0px;
	left: 10px;
	width: 800px;
	height: 80px; /*this height +2 needs to go into content and leftcol-1 as a padding-top*/
	overflow: hidden;
	color: #000000;
	background-color: #e8ecdb;
	position: absolute;
	z-index: 100; /*this means it will sit on top of all other layers*/
}

#subnav {
	width: 160px;
	min-height: 490px;
	height: 490px;
	left: 10px;
	top: 60px;
	margin: 0px;
	padding: 0px;
	position: absolute;
}

#footer {
	width: auto;
	min-height: auto;
	height: 100%;
	margin: 0px;
	padding: 0px;
	margin-top: 50px;
	color: #000000;
	text-align: left;
	clear: both;
	left: 0px;
	background-color: #FFFFFF;
	position: relative;
}

#copyright {
	position: relative;
	float: left;
}

#topofpage-link {
	position: relative;
	float: right;
}



/* CONTENT DIV's */

#content {
	width: 800px;
	top: 80px;
	margin: 0px;
	padding: 0px;
	margin-left: 10px;
	padding-top: 20px;
	position: absolute;
/*	background-color: #f5fac9;*/
}
#content-default {
	width: 800px;
	height: 470px;
	top: 80px;
	margin: 0px;
	padding: 0px;
	padding-top: 20px;
	margin-left: 10px;
	position: absolute;
	background-color: #000000;
	background-image: url(../images/bg_poster.jpg);
	background-repeat: no-repeat;
}

#leftcol-1 {
	width: 275px;
	left: 200px;
/*	min-height: 340px;
	height: auto;*/
/*	padding-top: 10px; needed to make room for header*/
	vertical-align: top;
	float: left;
	position: relative; /*ie needs this to show float */
	z-index: 100;
}
#leftcol-1 p {
	margin-bottom: 10px;
}
#rightcol-1 {
	width: 275px;
	left: 225px;
/*	padding-top: 10px; needed to make room for header*/
	vertical-align: top;
	float: left;
	position: relative; /*ie needs this to show float */
}
#rightcol-default {
	width: 293px;
	left: 212px;
/*	padding-top: 10px; needed to make room for header*/
	vertical-align: top;
	float: left;
	position: relative; /*ie needs this to show float */
}

#leftcol-2 {
	width: 575px;
	left: 200px;
	padding-top: 30px; /*needed to make room for header*/
	padding-bottom: 10px;
	vertical-align: top;
	float: left;
	position: relative; /*ie needs this to show float */
}

#leftcol-2btm {
	width: 575px;
	left: 200px;
/*	padding-top: 30px; needed to make room for header*/
	vertical-align: top;
	float: left;
	position: relative; /*ie needs this to show float */
}


#pulloutbox-top {
	width: 265px;
	height: 25px;
	color: #ffffff;
	background-color: #ec1d25;
	text-align: left;
	padding: 0px;
	margin: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 15px;
}
#pulloutbox-btm {
	width: 265px;
	background-color: #ffffff;
	padding: 0px;
	margin: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 15px;
}
#pulloutbox2-top {
	width: 200px;
	height: 25px;
	color: #ffffff;
	background-color: #ec1d25;
	text-align: left;
	padding: 0px;
	margin: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 15px;
	margin-left: 30px;
}
#pulloutbox2-btm {
	width: 200px;
	background-color: #ffffff;
	padding: 0px;
	margin: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 15px;
	margin-left: 30px;
}


#popup {
	width: 520px;
	text-align: left;
	margin: 0px;
	padding: 0px;
	margin-left: 20px;
	margin-right: 20px;
	padding-left: 40px;
	padding-right: 40px;
	padding-top: 30px;
	padding-bottom: 20px;
	text-align: left;
/*	margin-left: 20px;
	margin-right: 20px; */
	background-image:url(../images/bg_wrap_nrw.gif);
	background-repeat: repeat-y;
/*	background-color: #f5fac9;*/
	position: relative;
}

#popup p {
	width: 440px;
}