/*
 * CSS file for Wizards of the Coast Judge Center
 * By Collin Jackson for Wizards of the Coast
 * Initial version January 2005
 * Copyright 2005-2007
 * All rights reserved.
 */
/*****************************************************************
 * EXAM CONTENT SLICE
 * This style is used to display exams
 ****************************************************************/
#ExamContent
{ 
 font-family: Arial, Helvetica, sans-serif;
 padding: 5px 25px 25px 25px; 
}

#ExamContent h1
{
  text-align: center;
}

#ExamContent h2
{
  text-align: center;
}
#ExamContent h3
{
  margin-top: 0em;
  margin-bottom: 0.5em;	
}
tr.compactexamheader h1
{
	font-size: x-large;
	padding: 0px;
	margin: 0px;
}
/*****************************************************************
 * FOOTER
 * The footer displays final information at the end of the document.
 ****************************************************************/
div#footer p
{
  text-align: center;
  font-size: xx-small;
}

/*****************************************************************
 * DATAGRID/PAGER
 * The paged datagrid allows the user to browse records from a large table
 ****************************************************************/
div.datagridpager
{
	font-size: smaller;
}
div.datagridpager div.results
{
	float: left;
}
div.datagridpager div.links
{
	float: right;
}
div.datagridpager .sizeselector
{
	font-size: smaller;
}
.selectdatagrid
{
	font-size: smaller;
}
.itemsummary
{
	/* font-size: smaller; */
}
.adminonly
{
	font-size: smaller;
	clear:both;
}
.querybuilder
{
	font-size: smaller;
	clear: both;
}
.selectable  /* e.g. selectable datagrid */
{
	cursor: pointer;
	color: #2222DD;
}
/*****************************************************************
 * ITEM SUMMARY
 * Used to describe all the interesting fields of an item
 ****************************************************************/
.itemsummaryitem
{
	padding: 1px 1em 1px 1em;
}
/*****************************************************************
 * HISTORY GRID
 * Used to describe a series of comments over time
 ****************************************************************/
table.historygrid
{
	font-size: smaller; 
}
/*****************************************************************
 * PERSONSELECTOR
 * Used to select an individual
 ****************************************************************/
table.inlineselector
{
  display: inline; 
  vertical-align: bottom
}
/*****************************************************************
 * MISCELLANEOUS CLASSES
 * Classes that denote meaning of a particular span
 ****************************************************************/
a.popup 
{
	background-image: url(../images/popup.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	padding-left: 17px;
}

.message {
	font-weight: bold;
}

.alert {
	font-weight: bold;
	color:#BB0000;
}
.indented { padding-left: 1em; padding-right: 1em; }
.markuptag
{
	color: #118855;
}

.edited { display: block; margin-left: 2em; }
.answer { display: block; margin-left: 2em; }
.subitem { display: block; margin-left: 2em; }

/* class for display of images in the people view */
.headshot 
{
	float: right;
	margin-left: 1em; 
	text-align: center;
}

div#divEventContactInstructions p { padding: 3px; }
div#divEventContactInstructions 
{
	background-color: #A9A9A9; margin-left: 1em;
	margin-right: 1em; 
}
.privatemessage { width: 90% }
.privatemessagetext { width: 100% }
a#lnkTournamentOrganizerInstructions { FONT-SIZE: xx-small; FLOAT: right; }

table.dashboard { font-size: small; }
table.dashboard td { vertical-align: top; }

/*****************************************************************
 * RULEBOOK CLASSES
 * Classes for display of the game rulebook
 ****************************************************************/
#rulebookpage
{ 
 font-family: Arial, Helvetica, sans-serif;
 color: #000000;
 padding: 5px 25px 25px 25px; 
}
#rulebookselector 
{ 
    border-collapse: collapse;
	position: absolute;
    left: 0px;
    top: 0px;
    /* this lets IE mimic position: fixed, but it looks bad */
    /*
    top: expression( ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) + 'px' );
    */
}
div > #rulebookselector, form > input.printbutton
{
    top: 0px;
    /* position: fixed; */ /* for newer browsers */   
}
#rulebookselector table.innertable
{
	border-right: 3px solid #6565CC;	
	border-bottom: 3px solid #6565CC;	
    background-image: url(../images/keylinetile4.gif);
}
#rulebookselector td b { margin-left: 2px; }
/* #rulebookselector .rulebookdropdowns select.smaller { width: 100%; } */
#rulebookpage .big-rulebook-buttons { text-align: center;  }
#rulebookpage .big-rulebook-button { width: 48%; margin-bottom: 3em; }
#rulebookpage .big-rulebook-button img { cursor: pointer; }
#rulebookpage .buttonlabel { font-size: larger; font-weight: bold; }
#rulebooklogos { text-align: center; margin-top: 100px; }
.rulebook .anonymousrule { }
.rulebook .namedrule { display: block; margin-left: 1em; margin-top: 0.5em; }
.rulebook .level0 .sectiontitle { font-size: x-large; }
.rulebook .level1 .sectiontitle { font-size: larger; }
.rulebook .level0 .sectiontitle, .rulebook .level1 .sectiontitle, 
.rulebook .level2 .sectiontitle, .rulebook .level3 .sectiontitle,
.rulebook .level4 .sectiontitle { font-weight: bold; }
#rulebookpage .level1 { margin-left: 1em; }
#rulebookpage .level2 { margin-left: 2em; }
#rulebookpage .level3 { margin-left: 3em; }
#rulebookpage .level4 { margin-left: 4em; }
.rulebookname { display:block; text-align: center; font-size: xx-large; font-weight: bold; }
.centeredalert { margin: 4em; text-align: center; display:block; }
.rulebook .ruleblock
{ 
    margin-top: 0.75em;
    clear: both; 
}
#rulebookpage br { display: none; }
#rulebookpage .ruleblock br { display: inline; }
#rulebookpage .ruleblock ul br, #rulebookpage .ruleblock ol br { display: none; }
#rulebookpage #footertext br { display: inline; }

#rulebookpage img.floating { float: left; margin-right: 1em; }

#rulebookpage a.rulepagelink:link,
#rulebookpage a.rulepagelink:visited { color: #00A; text-decoration: none; }

#rulebookpage .tableofcontentscontainer
{
    text-align: center; 
    margin-top: 1em;
}
#rulebookpage input.search { width: 200px; }
#rulebookpage #progressarea { }
#rulebookpage .tableofcontents
{
    padding-top: 0.5em;
    text-align: left;
    background-color: #CCCCCC; border: 1px solid black; margin: auto; width: 500px;
    font-size: smaller;
}
#rulebookpage .tableofcontents .tableofcontentstitle
{
    margin-left: 1em;
    font-size: x-large;
    font-weight: bold;
}

#rulebookpage .hint { font-size: smaller; }
#rulebookpage .clearsearch { font-size: smaller; }
#rulebookpage a.masthead { color: #000000; text-decoration: none; }
#rulebookpage a#x 
{ 
    z-index: 500;
    float: right; 
    margin-right: 2px; 
    font-size: 0pt;
}
#rulebookpage a#x img { width: 7px; height: 7px; vertical-align: top; }
#rulebookpage td.shadow img { display: none; }
#rulebookpage td.shadow > img { display: inline; }
#rulebookpage td.shadow
{
    height: 8px;
    font-size: 0pt;
}
#rulebookpage img.shadow-s 
{ 
    height: 8px;
    width: 100%;
    position: relative;
    top: -8px;
    left: -10px;
}
#rulebookpage img.shadow-se 
{
    height: 8px; 
    width: 10px; 
    float: right;
}

#rulebookpage img.wizards-rules-logo
{
    width: 110px;
    height: 66px;
}
#rulebookpage img.wizards-rules-logo#restore
{
    position: absolute; top: 2px; left: 2px;
}
.rulebook .revision 
{ 
    float: right; 
}
.rulebook .sidebyside
{
    width: 50%;
    border: 2px solid #BB0000; 
    background-color: #FFF;
    margin-bottom: 4px;
}
.rulebook .sidebyside .revisiondescription { float: right; }
.rulebook .revisiondescription
{
    background-color: #BB0000;
    padding: 3px;
    color: #FFFFFF;   
}
.rulebook .revisiontextdata
{
    display: block;
    padding: 5px; 
    background-color: #FFF;
}
#rulebookpage .rulebook .Example,
#rulebookpage .rulebook .Ruling,
#rulebookpage .rulebook .JudgeComment,
#rulebookpage .rulebook .RnDComment { padding: 0.3em; margin-left: 4em; margin-right: 4em; }
#rulebooklegalnotice { margin-top: 2em; }
#rulebookpage .rulebook .Example .anonymousrule, .rulebook .Example .namedrule
{ font-style: italic; }

#rulebookpage .rulebook .Example .sectiontitle,
#rulebookpage .rulebook .Ruling .sectiontitle,
#rulebookpage .rulebook .JudgeComment .sectiontitle,
#rulebookpage .rulebook .RnDComment .sectiontitle { font-size: medium; }

#rulebookpage .rulebook .Ruling { border: 2px solid #0A0; }
#rulebookpage .rulebook .JudgeComment { border: 2px solid #C70; }
#rulebookpage .rulebook .RnDComment { border: 2px solid #00A; }

#rulebookpage .ExampleExample { font-style: italic; }
#rulebookpage .RulingExample { color: #0A0; }
#rulebookpage .JudgeCommentExample { color: #C70; }
#rulebookpage .RnDCommentExample { color: #00A; }

/*****************************************************************
 * EXAM CLASSES
 * Classes for display of the judge exam
 ****************************************************************/

.oracledatalist-normal { font-size: small; }
.oracledatalist-compressed { font-size: x-small; }
.oracledatalist-tiny { font-size: xx-small; }

.oracletext
{
    display: block;
	padding-right: 5px;
	margin-top: 0.5em;
	padding-left: 5px;
	padding-bottom: 5px;
	margin-left: 0.25em;
	margin-right: 0.25em;
	border: black solid;
	padding-top: 5px;
	background-color: #dddddd;
}

.originaltext
{
    padding-top: 1em; 
    border-top: 2px solid black;
}
.oracletitle
{
    font-weight: bold;
    white-space: nowrap;
}
.minititle
{
    text-align: center;
}
.minisubtitle
{
    font-style: italic;
    text-align: center;
    font-size: smaller;
    border-bottom: 1px solid black;
    margin-bottom: 2px;
}
table.stat
{
    color: White;
    width: 100%;
    height: 24px;
    max-height: 24px;
    border-collapse: collapse;
}
div.statspacer { height: 1px; }
div.statspacer img { width: 10em; height: 1px; }
table.stat td { vertical-align: middle; padding: 0px; }
td.lstat, td.rstat { background-color: Black; }
td.lstat { text-align: left; width: 48%; border-left:10px solid black;}
td.rstat { text-align: right; border-right:10px solid black; } 
table.stat td b { font-size: larger; padding-right: 1em; }
td.mstat
{
    width: 18px;
    background-image: url(../images/stat-middle.gif);
    background-repeat: no-repeat;
    background-position: center;
}
div.statcard
{ 
    float: right;
    position: relative;
    padding-left: 1em;
}
a.selectedstatcardlink
{
    color: #FF00FF;
}
a.statcardlink:visited, a.statcardlink:link, a.statcardlink:active
{
    color: blue;
}
.confidentialitynotice
{
	font-weight: bold;
	text-align: center;
	margin-bottom: 2px;
}
tr.answeroption
{
	vertical-align: text-top;
}
tr.answeroption td
{
	margin-left: 1em;
	margin-top: 1em;
}
tr.answeroption td div
{
    position:relative;
    z-index: 150;
}
/* An alternate way of doing highlights. Brittle.
.highlight
{
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
    height: 0px;
    height: 100%;
    width: 100%;
    z-index: -1;
    overflow: hidden;
}
.highlight img 
{
    display: none;
}
.highlight > img
{
    display: block;
    height: 300px;
    width: 100%;
}
*/
.fixednotice
{
    position: absolute;
	z-index:500;
	background:#cc4444;
	color:white;
	font-size:75%;
	top:0;
	right:0;
	padding:2px;
}
#printmonitor
{
    position: absolute;
	top: 5px;
	right: 5px;    
	width: 100px;
	text-align: center;
}
.printinstructions
{
    font-style: italic;
    font-size: x-small;
}
input.printbutton
{
	font-size: x-large;
}
span.examgriditem
{
	display: block;  
}
/* For obscure reasons we are using these as pagebreaks */
/* It makes it easy for us to find them in javascript using
   getElementsByTagName */
var
{
	display:block;	
	margin-top: 1em;
	margin-left: 5em;
	margin-right: 5em;
	margin-bottom: 1em;
	border-top: 1px solid #333;
}
.examgridcolumn
{
/*	float: left; */
}
.correct
{
	/* color: black; */  
}
.incorrect
{
	color:#BB0000;
}
td.displayindexlabel
{
	width: 1.5em;
}
td.letter 
{
	width: 1em;
	height: 1em;
	text-align: center;
}
td.letter img
{
	width: 1em;
	height: 1em;	
}
.examresults
{
    border: 2px solid black;
    font-weight: bold;
    display: block;
    text-align: center;
    margin: 2em;
    padding: 0.5em;
}
/*** NAV BAR 2.0 STYLES ************************************/

/* forces scroll bar, so it doesn't appear mid-load */
HTML {
  height: 100%; 
  margin-bottom: 1px;
}
body 
{
  font-family: Arial, sans-serif;
}
a img { border: 0px; }
a:hover { border: 0px; } /* IE hack */
.tabstrip a { text-decoration: none; }

a.navlink div { text-align: center; }

/* mouseover logic. could be done with javascript instead */
a.navlink img { display: block; margin: auto; }
a.navlink img.mouseover { visibility: hidden; position: absolute; left: 0px;}
a.navlink:hover img { display: none; }
a.navlink:hover img.mouseover { visibility: visible; position: static; margin: auto; display: block; }

table#navbartable img { height: 20px; }
table#navbartable img.icon { height: 65px; }
table#navbartable img.logo { margin-top: 17px; height: 40px; }

.headerpanel {
  z-index: 10;
  font-size: 12px;
  text-align: right;
  padding-left: 249px;
  padding-right: 5px;
  white-space: nowrap;
}
div#identitypanel { font-weight: bold; } 
div#identitypanel a { text-decoration: none; }
#systemmessage
{
	background-color: #000000; 
	position: absolute;
	display: block; 
	z-index: 1000;
}
#systemmessage .content
{
    white-space: nowrap;
    font-size: 12px;
	position: relative;
	top: -1px;
	left: -1px;
	background:#c44;
	color: #ffffff;
	padding: 2px 2px 2px 2px; 
	text-align: center;
}
#systemmessage input
{
	font-size: 9px;
}

#footertext
{
    z-index: 1;
    clear: both;
    text-align: center;
    font-size: 9px;
}
img.instructions-logo { float: right; margin-right: 1em; width: 100px; height: 100px; }
.siteguidelogos { float:right; margin-right: 1em; text-align: center; }
.siteguidelogos img { display: block; }
/*****************************************************************
 * TABSTRIP/MULTIPAGE
 * The tabstrip/multipage UI allows the user to select from panes
 * of related information
 ****************************************************************/
.multitab
{
	padding-top: 10px;
}
.nontabbedpage
{
	padding-top: 30px;
}
.multipage 
{
	border-collapse: collapse;
	position: relative;
	top: -5px;
    display: inline-table !important;
}
.querybuilder a, .selectdatagrid a, .adminonly a, .datagridpager a
{ 
	text-decoration: none; 
}
table.tabstrip td *
{
	vertical-align: top;	
}
table.tabstrip {
  border-collapse: collapse;
  position: relative;
  z-index: 101;
  height: 24px;
  margin-left: 130px;
}

#bandwidthpref 
{
    FONT-SIZE: xx-small; FLOAT: right; MARGIN-RIGHT: 3em; POSITION: relative; TOP: -5px
}

#esrb
{
    text-align: center;
}

.imagethumbnail
{
    padding-top: 3em
}

.paddedtable
{
    padding: 3px;
}