/**
 * Screen styles
 * This is the main site styling.
 */

/**
 * Color pallette
 * EAEAEA	Grey		Main background
 * EC761C	Orange	Header background
 * F1F5FE	Blue		Content header background, table header cell background
 * 448888	Blue		Content link hover/focus
 * 276DF3	Blue		Menu section title, menu item link/active, content item link/active/visited
 */

/* Entities */

html {
	/*background-color: #FFF;*/
	background-color: #ffffff;
}

body {
	/* Allow absolutely-positioned children to align relative to the body */
	position: relative;
	margin: 1.8em;											/* 18px */
	margin-top: 0em;
	padding-bottom: 1.8em;
	background-color: #EAEAEA;
	font-family: Arial, Helvetica, FreeSerif, sans-serif; 
	border-width: 2px;
 	border-style: solid;
 	border-color: #000000;
}

#header {
	height: 7.8em;
	margin-bottom: 1.2em;								/* 12px */
	padding: 0 1.2em;										/* 12px */
	background-color: #ffffff; // #6684C0;
}

#header h1 {
	float: left;
	width: 50%;
	color: #000;
	font-size: 2.4em;										/* 24px */
	line-height: 2em;										/* 24px */
}

#header #right-half {
	float: left;
	width: 50%;
}

#header #right-half p {
	margin: 0;
	color: #000;
	line-height: 2em;
	text-align: right;
}

#header #right-half p a {
	color: #000;
}

#header #language {
	float: right;
	margin-top: 5px;
}

/* Previously menuOutside */
#menu {
	/* The menu is positioned absolutely over an open area created with the content's left margin */
	position: absolute;
	top: auto;
	left: 1.8em;											/* 18px */
	width: 15em;											/* 150px */
	padding: 0.75em 0.25em;								/* 3px */
}

/* The main menu title, previously menuSectionHead */
#menu h3 {
	margin: 0;
	font-size: 1.2em;										/* 12px */
	line-height: 1.5em;									/* 18px */
}

/* Menu items now exist as a proper list */
#menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Indent nested lists, creating a sub-menu effect */
#menu ul ul {
	margin-left: 1em;
}

/* Previously menuSectionContent */
#menu a {
	/* Replaced explicitely marked-up menu items with styling applied directly to links */
	display: block;
	margin-bottom: 0.25em;								/* 3px */
	padding-left: 1em;									/* 12px */
	color: #276DF3;
	text-decoration: none;
}

#menu a:visited {
	color: #276DF3;
}

#menu a:hover,
#menu a:focus {
	color: #8BACF8;
}

#menu a:active {
	color: #276DF3;
}

/* Denotes current page, previously menuSectionContent-Current */
#menu a.current {
	color: #FFF;
	background-color: #000;
	font-weight: 700;
}

/* Denotes an open section, implying contained sub-menus */
#menu a.open {
	color: #000;
	font-weight: 700;
}

#content-shadow {
	position: relative;
	/* The content area covers the full width of the page, with this extra left margin applied to provide an area for the menu to be positioned */
	margin-left: 19.1em;									/* 191px */
	/* Takes up space needed for shadow background images */
	padding: 0 1.8em 0 0;								/* 18px */
	background-image: url('../graphic/layout/content-shadow-right.png');
	background-repeat: repeat-y;
	background-position: top right;					/* 2px */
	background-color: #FFF;
}

#content-shadow div.top-right {
	position: absolute;
	top: 0;
	right: 0;
	width: 1.8em;											/* 18px */
	height: 1.8em;											/* 18px */
	background-image: url('../graphic/layout/content-shadow-top-right.png');
	background-repeat: no-repeat;
	background-position: bottom left;
}

#content-shadow div.bottom {
	position: relative;
	height: 1.8em;											/* 18px */
	background-image: url('../graphic/layout/content-shadow-bottom.png');
	background-repeat: repeat-x;
	background-position: top;
}

#content-shadow div.bottom div.left {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 1.8em;											/* 18px */
	height: 1.8em;											/* 18px */
	background-image: url('../graphic/layout/content-shadow-bottom-left.png');
	background-repeat: no-repeat;
	background-position: top right;
}

#content-shadow div.bottom div.right {
	position: absolute;
	bottom: 0;
	right: -1.8em;											/* 18px */
	width: 1.8em;											/* 18px */
	height: 1.8em;											/* 18px */
	background-image: url('../graphic/layout/content-shadow-bottom-right.png');
	background-repeat: no-repeat;
	background-position: top left;
}

/* Previously adminBody (sorta) */
#content {
	position: relative;
	min-height: 20em;										/* 200px */
	margin-top: 1.8em;									/* 18px */
	padding: 0 1.2em;										/* 12px */
	color: #000;
	background-color: #FFF;
}

/* Main content title */
#content h3 {
	margin: 0 -0.5em 0.5em -0.5em;					/* 12px */
	padding: 0.5em;										/* 12px */
	font-size: 2.4em;										/* 24px */
	line-height: 1em;										/* 24px */
	font-weight: 500;
	color: #000;
	background-color: #F1F5FE;
}

#content h3 a:hover,
#content h3 a:focus,
#content h3 a:active {
	color: #8BACF8;
}

#content a,
#content a:link,
#content a:visited,
#content a:active {
	color: #276DF3;
}

#content a:hover,
#content a:focus {
	color: #448;
}

#content-bottom {
	clear: both;
	height: 0;
	font-size: 0;
	line-height: 0;
}

/* Archetypes */

input {
	font-weight: 500;
}

div.logo {
	/* Center embedded logo objects */
	text-align: center;
}

div.logo object {
	background-color: #09C;
}

p.error {
	color: #FF0000;
	font-weight: 700;
}

p.strong {
	font-weight: 700;
}

div.report {
	position: relative;
	/* Display scroll bars to handle oversized tables */
	overflow: scroll;
	/* Remove the unneeded vertical scroll bar. This is technically a CSS3 property, but is well-supported */
	overflow-y: auto;
}

/* Previously reportTitle */
div.report h4 {
	margin-bottom: 1.28em;								/* 18px */
	font-size: 1.4em;										/* 14px */
	line-height: 1.28em;									/* 18px */
}

div.report form.entryForm fieldset {
	/* Get rid of redundant side padding on nested forms */
	padding-left: 0;
	padding-right: 0;
}

div.print_user_results a{
	padding-left: 5em;
	font-size: 1.4em;
	color: #ff0000;
}

form.entryForm fieldset{
	border: 0;
}

form.entryForm legend {
	margin-left: 0;
	padding: 0;
	font-weight: 700;
}

form.entryForm legend {
	margin-left: 0;
	padding: 0;
	font-weight: 700;
}

form.entryForm legendParen {
	font-weight: 500;
}

form.entryForm legend input {
	margin-left: 1em;										/* 12px */
}

span.legend_alt {
	position: absolute;
	right: 2em;
	top: 0em;
	font-weight: 500;
}

form.entryForm h4 {
	font-size: 1em;										/* 12px */
	line-height: 1.5em;									/* 18px */
}

form.entryForm p {
	clear: both;
	margin: 0;
	padding: 0.5em 0;										/* 6px */
	font-size: 1em;										/* 12px */
	line-height: 1.5em;									/* 18px */
}

form.entryForm label.text,
form.entryForm label.password,
form.entryForm label.textarea {
	display: block;
	float: left;
	clear: both;
	width: 9em;												/* 108px */
	padding-right: 1em;									/* 12px */
	text-align: right;
}

form.entryForm label.wide-text {
	display: block;
	width: 40em;	
	text-aligh: left;
	float: right;
}

form.entryForm label.checkbox,
form.entryForm label.radio {
	padding-left: 1em;									/* 12px */
}


form.entryForm wide_label.text {
	display: block;
	clear: both;									/* 108px */
	padding-left: 4em;	
}



form.entryForm input.text,
form.entryForm input.password {
	float: left;
}

form.entryForm input.showTopScoresNumberEntry {
	width: 3em;			
}

form.entryForm input.checkbox,
form.entryForm input.radio,
form.entryForm input.submit {
	margin-left: 10em;									/* 96px */
}

table.dataTable {
	width: 59em;											/* 708px */
	margin-left: 0.1em;
	border-color: #CCC;
}

table.dataTable.summaryTable {
	width: 40em;											/* 708px */
}

table.dataTable caption {
	position: relative;
	padding-bottom: 0.5em;
	font-weight: 700;
	text-align: left;
}

table.dataTable caption input {
	/* Position and elevate to solve an issue with Firefox not being able to click the links */
	position: relative;
	z-index: 2;
	margin-left: 1em;										/* 12px */
}

/* Upper page links are displayed as part of the table caption, aligned to the top right edge */
table.dataTable caption span.pageLinks {
	display: block;
	/* Position and elevate to solve an issue with Internet Explorer not being able to click the links */
	position: relative;
	z-index: 1;
	margin-top: -1.5em;									/* 18px */
	font-weight: 500;
	text-align: right;
}

table.dataTable th,
table.dataTable td {
	border-color: #CCC;
}

table.dataTable tbody td input.checkbox,
table.dataTable tbody td input.radio {
	margin: 0;
}

table.dataTable thead tr,
table.dataTable tfoot th {
	background-color: #F1F5FE;
}

table.dataTable thead th,
table.dataTable thead td {
	white-space: nowrap;
}

/* Alternating rows */
table.dataTable tbody tr.mod2-0 {
	background-color: #FAFAFA;
}

/* Cells holding only a form control */
table.dataTable tbody td.control {
	text-align: center;
}

/* Cells holding either small amounts of data or numbers */
table.dataTable th.short,
table.dataTable td.short,
table.dataTable th.number,
table.dataTable td.number {
	text-align: center;
	white-space: normal;
}

/* Manual wrap override */
table.dataTable th.wrapped,
table.dataTable td.wrapped {
	white-space: normal;
}

/* Manual nowrap override */
table.dataTable td.no-wrap,
table.dataTable td.no-wrap {
	white-space: nowrap;
}

/* Lower page links are displayed using a footer row */
table.dataTable tfoot td.pageLinks {
	text-align: right;
}

dl.answersList {
	margin: 0 0 0 2em;									/* 24px */
	border-left: 0.1em solid #000;					/* ~1px */
	font-size: 1em;										/* 12px */
}

dl.answersList dt {
	padding-left: 0.5em;									/* 6px */
}

dl.answersList dd.correct {
	font-weight: bold;
}

dl.answersList dd.chosen {
	margin-left: 1em;
	padding-left: 1em;
	background-image: url('../graphic/layout/checkmark.gif');
	background-repeat: no-repeat;
}

table.legendTable {
	margin-left: 0.1em;
	width: 15em;
	border-color: #CCC;
}

table.legendTable caption {
	position: relative;
	padding-bottom: 0.5em;
	font-weight: 700;
	text-align: left;
}

table.legendTable thead th {
	text-align: center;
}

/* Page hierarchy/breadcrumb trail navigation bar */
ul.navBar {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 1em;										/* 24px */
}

ul.navBar li {
	/* Line the list items up horizontally */
	display: inline;
	padding: 0 0.25em;									/* 3px */
}

ul.navBar li a {
	color: #003;
}

p.textfield {
	margin-bottom: 0;
}

p.textfield strong {
	float: left;
	display: block;
	width: 9em;												/* 108px */
	padding-right: 1em;
	text-align: right;
}

/* Page-Specific */

/* Shrink and center the login and logoff pages */
#login,
#logoff {
	width: 60em;											/* 400px */
	margin: 1.8em auto;									/* 18px */
}

#login #header h1,
#logoff #header h1 {
	float: none;
	width: auto;
	text-align: center;
}

#login #header #right-half,
#logoff #header #right-half {
	display: none;
}

#login #content-shadow,
#logoff #content-shadow {
	margin: 0 0 0 1.8em;									/* 18px */
}

#login #content {
	margin: 0;
}

#logoff #content {
	margin: 0;
	background-color: transparent;
}

#logoff #content h3 {
	margin-bottom: 1.5em;								/* 36px */
	text-align: center;
}

#logoff #content p {
	text-align: center;
}

#logoff #content a:link,
#logoff #content a:visited {
	font-size: 1.5em;										/* 18px */
	text-decoration: underline;
}

/* View Results -> Report Options form */
#viewOptions input.checkbox {
	margin-left: 0;
}

#viewResults #content h3 {
	position: relative;
	z-index: 1;
}

#viewResults #exportMenu {
	position: absolute;
	z-index: 1;
	bottom: -2em;
	right: 0.5em;
	height: 2em;
	overflow: visible;
	margin: 0;
	padding: 0;
	font-size: 0.5em;
}

#viewResults #exportMenu dt {
	margin-bottom: 0.5em;
	text-align: right;
	cursor: pointer;
	color: #276DF3;
}

#viewResults #exportMenu dt:hover {
	color: #448888;
}

#viewResults #exportMenu dd {
	display: none;
	margin-top: -0.25em;
	padding: 0.5em 1em;
	border-width: 0 0.25em 0.25em 0;
	border-style: solid;
	border-color: #C1C5CE;
	background-color: #F1F5FE;
}

#viewResults #exportMenu:hover dd {
	display: block;
}

#admin #invitationFormContainer {
	width: 60em;								/* 600px */
	height: 50em;							
	background-color: #EFEFEF;
	font-weight: 500;
}

#admin #invitationFormContainer h3 {
	position: relative;
	margin-bottom: 2;
	padding: 0 0.5em;
	background-color: #F1F5FE;
	font-size: 1.6em;
	line-height: 1.5em;
}

#admin #invitationFormContainer h2 {
	display: inline;
	position: relative;
	margin-left: 5px;
	margin-bottom: 0px;
	margin-top: 0px;
	padding: .5em;
	background-color: #6699CC;
	font-size: 1.4em;
	line-height: 1.5em;
}

#admin #invitationFormContainer form {
	margin: 0px;
	}

#admin #invitationFormContainer #closeButton {
	position: absolute;
	top: 0em;
	right: 0em;
	padding: 0.25em;
	cursor: pointer;
}

#admin #invitationFormContainer #closeButton:hover {
	background-color: #CCC;
}

#admin #invitationFormContainer form {
	padding: 0 1em;
}

#admin #invitationFormContainer form fieldset {
	margin: 0;
	padding: 0;
	border: 0;
}

#admin #invitationFormContainer form fieldset legend {
	margin: 0 0 1em 0;
	padding: 0;
}

#admin #invitationFormContainer div.group {
	margin: 5px;
	padding: .5em;
	background-color: #CCC;
}

#admin #invitationFormContainer label {
	font-weight: bold;
}


#admin #invitationFormContainer form fieldset input.button {
	margin: 0;
}

#admin #invitationFormContainer #nextButton {
	position: absolute;
	bottom: 0.25em;
	right: 5em;
	width: 5em;
	font-weight: 700;
	width: 5em;
}

#admin #invitationFormContainer #doneButton {
	position: absolute;
	bottom: 0.25em;
	right: 5em;
	font-weight: 700;
	width: 5em;
}

#admin #invitationFormContainer #cancelButton {
	position: absolute;
	bottom: 0.25em;
	left: 5em;
	width: 5em;
}

#admin #invitationFormContainer #backButton_1, #backButton_2 {
	position: absolute;
	bottom: 0.25em;
	left: 5em;
	width: 5em;
}

#admin #invitationFormContainer #sendButton {
	position: absolute;
	bottom: 0.25em;
	right: 5em;
	width: 5em;
	font-weight: 700;
}

#admin #invitationFormContainer form fieldset ul {
	width: 48em;
	font-size: 1em;
}

#admin #invitationFormContainer form fieldset p {
	margin: 0;
	font-size: 1em;
}

#admin #invitationFormContainer  ul#existingUsers {
	height: 6em;
	width: 550px;
	margin: 0 0 1em 0;
	padding: 0;
	border-width: 1px;
	border-style: solid;
	border-color: #CCC;
	list-style: none;
	overflow-y: scroll;
	background-color: #FFF;
}

#admin #invitationFormContainer #existingUsers li{
	float: left;
	width: 20em;
	margin: 0;
	padding: 0.25em 0 0 0.25em;;
}

#admin #invitationFormContainer li input.checkbox {
	margin-left: 0;
}

#admin #invitationFormContainer #sharingOption li{
	list-style-type: none;
}

#admin #invitationFormContainer #sharingOption li input.radio {
	margin-left: 10;
}

#admin #invitationFormContainer textarea {
	display: block;
	width: 100%;
	//margin-bottom: 1em;
}

#admin #invitationFormContainer #newInvites {
	height: 5em;
}

#admin #invitationFormContainer #message {
	height: 8em;
}

#admin #invitationFormContainer p.caption {
	font-size: 1em;
	color: #666;
}

#admin #invitationFormContainer #invitationPreview textarea {
	height: 5em;
	background-color: #F0F0F3;
}

#admin #invitationFormContainer #invalidInvites-label {
	color: #660000;
}

#admin #invitationFormContainer #invitationPreview #invalidInvites {
	border-color: #FF6666;
	background-color: #F3F0F0;
}

#admin #invitationFormContainer #sendProgress,#getLinkProgress  h4 {
	margin-top: 10em;
	margin-bottom: 2em;
	text-align: center;
}

#admin #invitationFormContainer #sendProgress,#getLinkProgress p {
	text-align: center;
}

#admin #invitationFormContainer #successMessage h4 {
	margin-top: 10em;
	margin-bottom: 2em;
	text-align: center;
}

#admin #invitationFormContainer #successMessage p {
	text-align: center;
}

#admin #invitationFormContainer #failMessage h4 {
	margin-top: 5em;
	margin-bottom: 2em;
	text-align: center;
}

#admin #invitationFormContainer #failMessage p {
	text-align: center;
}

#control_overlay {
	background-color: #000;
}

/*
.tooltip {
	border:1px solid #000;
	background-color:#fff;
	height:25px;
	width:200px;
	font-family:"Lucida Grande",Verdana;
	font-size:10px;
	color:#333;
}

.simple_window {
	width:250px;
	height:50px;
	border:1px solid #000;
	background-color:#fff;
	padding:10px;
	text-align:left;
	font-family:"Lucida Grande",Verdana;
	font-size:12px;
	color:#333;
}

.window {
	background-image:url("../graphic/layout/modal-window-background.png");
	background-position:top left;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	padding:10px;
	font-family:"Lucida Grande",Verdana;
	font-size:13px;
	font-weight:bold;
	color:#fff;
	text-align:center;
	min-width:150px;
	min-height:100px;
}

.window .window_contents {
	margin-top:10px;
	width:100%;
	height:100%;	
}

.window .window_header {
	text-align:center;
}

.window .window_title {
	margin-top:-7px;
	margin-bottom:7px;
	font-size:11px;
	cursor:move;
}

.window .window_close {
	display:block;
	position:absolute;
	top:4px;
	left:5px;
	height:13px;
	width:13px;
	background-image:url("/stylesheets/window_close.gif");
	cursor:pointer;
    cursor:hand;
}*/