body  {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
    /*width: 900px;*/
	margin: 0px; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
	background-color: #FFFFFF;
	/*background-color: #E4EAFE;*/
}

#container, #displayRoot {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	/*width: 880px; */ /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	height: 1120px;
	margin: 0px auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
}

h1 {
	text-align: center;
}

a {
	color: #F18109;
	text-decoration: underline;
}

.highlight_1 {
	color: #F18109;
	padding-top: 12px;
	padding-bottom: 12px;
}

.clickable_text {
	color: #F18109;
	text-decoration: underline;
	padding-top: 12px;
	padding-bottom: 12px;
	cursor: pointer;
}

img.center {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

a:hover {
	text-decoration:underline;
}

a:visited {
	color: #BDC115;
	text-decoration: none;
}

.outline_header_inline {
	font-weight: bold;
	margin-right: 8px;
}

.outline_header_block {
	font-weight: bold;
	padding-top: 12px;
}

.windowOverlay {
	position: absolute;
	color: #316296; /*rgb(49,98,150)*/
	text-align: left;
	background-color: #BDC015; /*rgb(189,192,21)*/
	border-style: solid;
	border-width: 5px;
	border-color: #BD60BE; /*rgb(192,96,190)*/
	border-radius: 15px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
}

.popUp {
	position: absolute;
	padding: 20px;
	display: none;
	overflow:auto;
	color: rgb(51,102,153);
	text-align: left;
	background-color: #C9C815; /*rgb(201,200,31)*/
	border-style: solid;
	border-width: 5px;
	border-color: #3E77A8; /*rgb(62,119,168)*/
	border-radius: 15px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
}

.allPurpose {
	top:132px;
	left:50px;
	width:750px;
	height:400px;
}

.messageWindow {
	top:132px;
	left:50px;
	width:400px;
	height:320px;
	background-color: #FFFFFF;
	border-color: #F39501; /*rgb(243,149,1)*/
}

.instructionsPopUp {
	top:72px;
	left:50px;
	width:960px;
	height:640px;
}

.privacyPopUp {
	top:72px;
	left:50px;
	width:960px;
	height:640px;
}

.loginPopUp {
	top:132px;
	left:50px;
	width:360px;
	height:240px;
}

.registerPopUp {
	top:132px;
	left:50px;
	width:380px;
	height:580px;
}

.enrollPopUp {
	top:132px;
	left:50px;
	width:360px;
	height:218px;
}

.delayPopUp {
	top:132px;
	left:50px;
	width:300px;
	height:110px;
}

.sourceFormPopUp {
	top:132px;
	left:50px;
	width:360px;
	height:262px;
}

.profilePopUp {
	top:132px;
	left:50px;
	width:742px;
	height:612px;
}

.infoPopUp {
	top:132px;
	left:60px;
	width:740px;
	height:457px;
}

.contactPopUp {
	top:132px;
	left:50px;
	width:700px;
	height:396px;
}

.orderPopUp {
	top:132px;
	left:50px;
	width:380px;
	height:480px;
}

.payPalPopUp {
	top:132px;
	left:50px;
	width:380px;
	height:480px;
}

.filler {
	height:40px;
}

select {
	background: transparent;
	padding: 2px;
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	border: 1px solid #F39501; /*rgb(243,149,1)*/
	height: 30px;
}

.transparent_class { /* See http://css-tricks.com/css-transparency-settings-for-all-broswers */
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}

.textButton #label {
	font-family:"Lucida Grande",Verdana,Tahoma,Arial;
	font-size:14px;
	color: #FFFFFF; /*rgb(255,255,255)*/
}

.textButton:hover #label {
	color: #3E77A8; /*rgb(62,119,168)*/
}

.textButton:active #label {
	color: #66CCFF; /*rgb(102,204,255)*/
}

.plainTextButton {
	font-family:"Lucida Grande",Verdana,Tahoma,Arial;
	font-size:14px;
	text-align: center;
	color: #FFFFFF; /*rgb(255,255,255)*/
	position: absolute;
	padding: 4px;
	background-color: #3E77A8; /*rgb(62,119,168)*/
	/*background-color: #4891F5;*/ /*rgb(72,145,215)*/
	border-style: solid;
	border-width: 4px;
	border-color: #DDDC3C; /*rgb(221,220,60)*/
	border-radius: 17px;
	-moz-border-radius: 17px;
	-webkit-border-radius: 17px;
	cursor: pointer;
}

.plainTextButton:hover {
	color: #3E77A8; /*rgb(62,119,168)*/
	background-color: #60F3FF; /*rgb(96,243,255)*/
}

.plainTextButton:active {
	color: #66CCFF; /*rgb(102,204,255)*/
	background-color: #4A81C2; /*rgb(74,129,194)*/
}

.smallTextButton {
	font-family:"Lucida Grande",Verdana,Tahoma,Arial;
	font-size:14px;
	text-align: center;
	color: #FFFFFF; /*rgb(255,255,255)*/
	background-color: #3E77A8; /*rgb(62,119,168)*/
	/*background-color: #4891F5;*/ /*rgb(72,145,215)*/
	border-style: solid;
	border-width: 2px;
	border-color: #DDDC3C; /*rgb(221,220,60)*/
	margin-right: 10px;
	cursor: pointer;
}

.smallTextButton:hover {
	color: #3E77A8; /*rgb(62,119,168)*/
	background-color: #60F3FF; /*rgb(96,243,255)*/
}

.smallTextButton:active {
	color: #66CCFF; /*rgb(102,204,255)*/
	background-color: #4A81C2; /*rgb(74,129,194)*/
}

.alignright {
	position: static;
	float: right;
	margin-left: 12px;
}

.alignleft {
	position: static;
	float: left;
	margin-right: 12px;
}

.clear {
	clear: both;
}

.splash {
	opacity: 1.0;               /* CSS3 */
	-moz-opacity: 1.0;          /* Older versions of Firefox */
	-khtml-opacity: 1.0;        /* Older versions of Safari */
	filter: alpha(opacity=100); /* Internet Explorer */
}

.debug_display {
	position: relative;
	width: 100%;
	height: 40px;
	margin: 4px;
	padding-bottom: 4px;
}

.debug_1 {
	position: absolute;
	top: 4px;
	left: 4px;
}

.element_display {
	width: 100%;
	margin: 2px;
	padding-bottom: 2px;
}

.element_display > p {
	margin: 0;
}

.framed_element_display {
	float: left;
	width: 100%;
	background-color: #3E77A8;
	margin: 4px;
	padding: 2px 2px 4px 4px;
	border-radius: 12px;
	-moz-border-radius: 12px;
	-webkit-border-radius: 12px;
}

.framed_element_display > p {
	margin: 0;
}

.labeled_box {
	float: left;
	width: 100%;
	background-color: #3E77A8;
	margin: 4px;
	padding-left: 4px;
	border-radius: 12px;
	-moz-border-radius: 12px;
	-webkit-border-radius: 12px;
}

.labeled_box .left_label {
	float: left;
	width: 5%;
	color: #F39501; /*rgb(243,149,1)*/
	margin-top: 2px;
}

.labeled_box .left_label > p {
	margin: 0;
}

.right_box {
	float: right;
	/*position: absolute;*/
	width: 95%;
	/*top: 0;
	right: 0;
	display: inline;*/
}

.power_display {
	border: 4px solid #C9C815;
	background-color: #3E77A8;
	margin: 4px;
	padding-bottom: 2px;
	padding-left: 12px;
	border-radius: 12px;
	-moz-border-radius: 12px;
	-webkit-border-radius: 12px;
}

.power_display:first-letter {
	margin-left: -8px;
}

.power_display > span + span {
	/* Selects the second span of the display, i.e., the value */
	color: #B6C416; /*rgb(182,196,22)*/
	margin-left: 6px;
}

.hidden_field {
	visibility: hidden;
}

.super_user_tools {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	text-align: left;
}

.super_user_tools textarea {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	border:none;
	width: 90%;
}

.borderless {
	border:none;
	font: 100% Verdana, Arial, Helvetica, sans-serif;
}

.super_user_tools .plainTextButton {
	position: relative;
}

#textMetrics {
    position: absolute;
    visibility: hidden;
    height: auto;
    width: auto;
	font-family:"Lucida Grande",Verdana,Tahoma,Arial;
	font-size:12px;
}

#topPanel {
	position: relative;
	width: 100%;
	/*height: auto;*/
	margin-top: 10px;
}

#odysseyLogo {
	width: 55%;
	height: auto;
	margin-right: 20px;
}

#welcome {
	position: absolute;
	top: 0;
	left: 57%;
	width: 40%;
}

/*
#login {
	position: absolute;
	left: 34%;
	top: 6px;
	display: none;
}
*/

#welcomeButtons {
	position: absolute;
	left: 57%;
	bottom: 0;
	z-index: 10;
}

#splashImage1 {
	position: absolute;
	/*width: 28.75%;*/
	top: 195px;
	left: 10%;
	z-index: 0;
}

#splashImage2 {
	position: absolute;
	/*width: 19%;*/
	top: 415px;
	left: 25%;
	z-index: 1;
}

#splashImage3 {
	position: absolute;
	/*width: 10.75%;*/
	top: 495px;
	left: 8%;
	z-index: 2;
}

#iframe {
	position: absolute;
	top:132px;
	left:50px;
	width:750px;
	height:400px;
	display: none;
	overflow:auto;
	color: #316296; /*rgb(49,98,150)*/
	text-align: left;
	background-color: #BDC015; /*rgb(189,192,21)*/
	border-style: solid;
	border-width: 5px;
	border-color: #BD60BE; /*rgb(192,96,190)*/
	border-radius: 15px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
}

#sourceTitle, #odysseyPanel {
	clear: both;
	width: 100%;
	padding-top: 20px;
	padding-bottom: 30px;
}

#odysseyPanel {
	position: relative;
	z-index: 10;
	display: none;
}

#odysseyWrapper {
	position: relative;
	width: 36%;
}

#odysseyDropdown, #challengeDropdown {
	position: relative;
	width: 35%;
	display: inline;
}

#odysseyLabel, #challengeLabel {
	position: relative;
	margin-left: 30px;
	margin-right: 12px;
	font-size: 14px;
}

#odysseyInfo {
	position: absolute;
	left: 9px;
	top: 26px;
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
}

#forumPanel {
	position: relative;
	width: 100%;
	margin-top: 30px;
	z-index: 50;
}

#sourceDropdown {
	position: relative;
	width: 98%;
}

#playerInfo {
	float: left;
	margin-left: 1%;
	width: 20%;
	/*background-color: #3E77A8; /*rgb(62,119,168)*/*/
	/*background-color: #6A88E0;*/ /*#F08009*/
	margin-right: 20px;
}

#forumBox {
	float: right;
	width: 75%;
}

#treePanel {
	float: left;
	width: 84%;
	padding-right: 8px;
}

#headers_container {
	float: left;
	width: 100%;
	display: block;
}

#fullTextPopUp {
	position: absolute;
	width: 63%;
	left: 23%;
	top: 50px; /* Will likely be overridden */
	padding-left: 19px;
	padding-right: 8px;
	background-color: #E4EAFE;
	border-style: solid;
	border-width: 2px;
	border-color: #A6A6A6;
	display: none;
}

#fullTextPopUp:after {
	/* See http://www.positioniseverything.net/easyclearing.html */
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

#footer {
	clear: both;
	width: 100%;
	text-align: center;
}

.forum_container {
	/*
	 * "divs _do_ grow to contain the divs inside them if they are
	 * themselves the "block formatting context boxes" for the floats, which
	 * they are if they are floated or positioned themselves."
	 * See http://bytes.com/topic/html-css/answers/582122-div-auto-height
	 */
	float: left;
	clear: left;
	width: 40%;
	height: 70%;
	/*
	border-style: solid;
	border-width: 3px;
	border-color: #808080;
	*/
}

.challenge_container {
	float: left;
	clear: left;
	margin: 0;
	/*
	border-style: solid;
	border-width: 3px;
	border-color: #000000;
	*/
}

.headers_container {
	float: left;
	clear: left;
	margin: 10px;
	/*width: 600px;*/ /* temporary? */
	/*
	border-style: solid;
	border-width: 3px;
	border-color: #ffff00;
	*/
}

.forum_challenge {
	float: left;
	background-color: #FFFFFF;
	margin-top: 4px;
	/*
	border-style: solid;
	border-width: 3px;
	border-color: rgb(0,0,0);
	*/
}

.post_wrapper {
	float: right;
	top: auto;
	height: auto;
}

.post {
	float: left;
	font-family: "Lucida Grande",Verdana,Tahoma,Arial,Helvetica,sans-serif;
	font-size: 12px;
	background-color: #FFFFFF;
	border-style: solid;
	border-width: 2px;
	border-color: #3E77A8; /*rgb(62,119,168)*/
	margin-top: 4px;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
	width: 100%;
}

.post_title_bar {
	position: relative;
	color: #FFFFFF;
	text-align: left;
	background-color: #3E77A8; /*rgb(62,119,168)*/
}

.conversation_opened {
	background-color: #C9C815; /*rgb(201,200,31)*/
}

.post_body {
	position: relative;
	color: #000000;
	text-align: left;
	margin-left: 4px;
	margin-right: 4px;
	background-color: #FFFFFF;
}

.post_summary {
	position: relative;
	/*width: 580px;*/
	color: #000000;
	text-align: left;
	background-color: #FFFFFF;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
}

.post_id {
	font-weight: bold;
}

.post_type {
	font-style: italic;
	margin: 0 0 0 6px;
}

.post_rating {
	margin: 0 0 0 6px;
}

.post_score {
	margin: 0 0 0 6px;
}

.post_participation {
	margin: 0 0 0 6px;
	color: #FFFFFF;
	font-weight: bold;
}

.post_attachments {
	float: left;
	font-weight: bold;
	font-style: italic;
	background-color: #FFFFFF;
	margin: 4px 0 0 6px;
	border-style: solid;
	border-width: 2px;
	border-color: #F39501; /*rgb(243,149,1)*/
	cursor: pointer;
}

.post_instructions {
	/*float: right;*/
	position: absolute;
	bottom: 0;
	right: 0;
	font-weight: bold;
	font-style: italic;
	color: #3E77A8; /*rgb(62,119,168)*/
	background-color: #FFFFFF;
	border-style: solid;
	border-width: 1px;
	border-color: #3E77A8; /*rgb(62,119,168)*/
	margin: 0 0 0 6px;
	cursor: pointer;
}

.post_instructions:hover {
	color: #FFFFFF; /*rgb(62,119,168)*/
	background-color: #3E77A8;
	border-color: #3E77A8; /*rgb(62,119,168)*/
}

.post_instructions:active {
	color: #F39501; /*rgb(243,149,1)*/
	background-color: #FFFFFF;
	border-color: #F39501; /*rgb(243,149,1)*/
}

.post_composer {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	float: left;
	clear: left;
}

.italics_button {
	font-style: italic;
}

.bold_button {
	font-weight: bold;
}

span .AMedit {
	border: 1px solid #ff0000;
}