/* cpr.css - Cascading style sheet for Calibrated Peer Review (CPR). */

/* Body */

body
{
	background: #FFFFFF;
	font-family: Verdana, Arial, Helvetica, Sans-Serif;
	font-size: 75%;
	color: #000000;
}

/* Body of header used when an admin or instructor enters as another user. */
body.header
{
	background: #F3F3F3;
	font-family: Verdana, Arial, Helvetica, Sans-Serif;
	font-size: 75%;
	color: #000000;
}

/* Headings used on CPR home page. */

h1.title
{
	margin: 0;
	font-weight: bold;
	font-family: Tahoma, Arial, Helvetica, Sans-Serif;
	font-size: 275%;
}

h2.slogan
{
	margin: 0.6em 0 0 0;
	font-weight: normal;
	font-family: Tahoma, Arial, Helvetica, Sans-Serif;
	font-size: 165%;
}

h2.location
{
	margin: 1em 0 0 0;
	font-weight: normal;
	font-family: Tahoma, Arial, Helvetica, Sans-Serif;
	font-size: 200%;
	color: #0023A4;
}

h2.version
{
	margin: 0;
	font-weight: normal;
	font-family: Tahoma, Arial, Helvetica, Sans-Serif;
	font-size: 145%;
}

/* Headings used elsewhere */

h1
{
	margin: 0.6em 0 0.6em 0;
	padding: 0;
	font-weight: bold;
	font-family: Tahoma, Arial, Helvetica, Sans-Serif;
	font-size: 165%;
}

h2
{
	margin: 0 0 0.3em 0;
	padding: 0;
	font-weight: bold;
	font-family: Tahoma, Arial, Helvetica, Sans-Serif;
	font-size: 135%;
}

h3
{
	margin: 0 0 0.3em 0;
	padding: 0;
	font-weight: bold;
	font-family: Tahoma, Arial, Helvetica, Sans-Serif;
	font-size: 120%;
}

h4
{
	margin: 0 0 0.3em 0;
	padding: 0;
	font-weight: bold;
	font-family: Tahoma, Arial, Helvetica, Sans-Serif;
	font-size: 100%;
}

h5
{
	margin: 0 0 0.3em 0;
	padding: 0;
	font-weight: bold;
	font-family: Tahoma, Arial, Helvetica, Sans-Serif;
	font-size: 100%;
}

h6
{
	margin: 0 0 0.3em 0;
	padding: 0;
	font-weight: bold;
	font-family: Tahoma, Arial, Helvetica, Sans-Serif;
	font-size: 100%;
}

/* Paragraphs */

p
{
	margin-top: 0.6em;
	margin-bottom: 0.6em;
	line-height: 1.5em;
}

p.title
{
    margin: 0.6em 0 0.6em 0;
    padding: 0;
    font-weight: bold;
    font-family: Tahoma, Arial, Helvetica, Sans-Serif;
    font-size: 165%;
}

/* Anchors */

a:link, a:visited
{
	color: #0066FF;
	text-decoration: none;
}

a:hover
{
	color: #0066FF;
	text-decoration: underline;
}

/* Assignment name links */
a.assignment-link
{
	font-weight: normal;
}

/* File links */
a.file-link
{
	font-weight: normal;
}

/* Filter links */
.filter-link
{
	padding: 2px;
	font-weight: bold;
	font-size: 120%;
}

/* Institution links */
a.institution-link
{
	font-weight: normal;
}

/* Navigation links */
a.nav-link
{
	font-weight: normal;
}

/* Popup window links */
a.popup-link
{
	font-weight: normal;
}

/* User links */
a.user-link
{
	font-weight: normal;
}

/* Images */

img
{
	border: 0;
}

/* Lists */

ol
{
	margin-top: 0.6em;
	margin-bottom: 0.6em;
	line-height: 1.5em;
}

ol li
{
	margin-bottom: 0.3em;
	line-height: 1.5em;
}

ul
{
	margin-top: 0.6em;
	margin-bottom: 0.6em;
	line-height: 1.5em;
}

ul li
{
	margin-bottom: 0.3em;
	line-height: 1.5em;
}

/* Tables */

table
{
	margin: 0;
	padding: 0;
	border: 0;
	border-collapse: separate;
	font-size: 100%;
}

td.completed
{
	background: #FFFFFF;
}

td.white
{
	background: #FFFFFF;
}

/* Table used for the top-level menu bar. This is a horizontal strip along 
the top of a page that has the buttons HOME, CPR TIME, LOG OUT, and so on 
along the left side and the text Calibrated Peer Review (R) along the 
right side. */

table.menubar
{
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	border-collapse: collapse;
	background: #0066FF;
	color: #FFFFFF;
}

td.menubar
{
	padding: 0;
}

td.menubar-btn
{
	width: 100px;
	text-align: center;
}

td.menubar-div
{
	width: 20px;
	text-align: center;
}

a.menubar:link, a.menubar:visited
{
	font-weight: bold;
	color: #FFFFFF;
	text-decoration: none;
}

a.menubar:hover
{
	font-weight: bold;
	color: #FFFFFF;
	text-decoration: underline;
}

/* Table used for the manage assignment menubar. This is a horizontal strip 
that appears below the top-level menubar in the instructor interface with
links like Assignment Home, Student Progress, Student Results, Problem List, 
Tools, and so on. */

table.manage-assign-menubar
{
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
}

td.manage-assign-menubar-btn
{
	padding: 6px;
	border: 0;
	background: #D7D7D7;
	font-weight: bold;
}

td.manage-assign-menubar-btn-active
{
	padding: 6px;
	border: 0;
	background: #FF0000;
	color: #FFFFFF;
	font-weight: bold;
}

a.manage-assign-menubar:link, a.manage-assign-menubar:visited
{
	font-weight: bold;
	text-decoration: none;
}

a.manage-assign-menubar:hover
{
	font-weight: bold;
	text-decoration: underline;
}

/* Table that display links to tools. */

table.tools
{
	margin: 1.2em 0 0.6em 0;
	padding: 0;
	border: 0;
}

th.tools-heading1
{
	padding: 3px;
	border: 0;
	background: #C3C3C3;
	font-weight: bold;
	font-family: Tahoma, Arial, Helvetica, Sans-Serif;
	font-size: 130%;
}

th.tools-heading2
{
	padding: 3px;
	border: 0;
	background: #DBDBDB;
	font-weight: bold;
	font-family: Tahoma, Arial, Helvetica, Sans-Serif;
	font-size: 105%;
}

td.tools-anchor
{
	width: 33.3333%;
	height: 2.5em;
	padding: 0px 3px;
	border: 0;
	background: #EBEBEB;
	font-weight: bold;
	font-size: 100%;
}

td.tools-description
{
	width: 66.6666%;
	padding: 0px 3px;
	border: 0;
	background: #F3F3F3;
	font-size: 90%;
}

/* Tables without borders used for layout. */

table.layout
{
	margin: 0;
	padding: 0;
	border: 0;
	border-collapse: collapse;
}

td.layout
{
	padding: 0;
	border: 0;
	vertical-align: top;
}

td.layout-middle
{
	padding: 0;
	border: 0;
	vertical-align: middle;
}

/* Table used to display actual information instead of for layout. */

table.info
{
	margin: 1.2em 0 0.6em 0;
	padding: 0;
	border: 0;
}

th.info-heading1
{
	padding: 3px;
	border: 0;
	background: #C3C3C3;
	font-weight: bold;
	font-family: Tahoma, Arial, Helvetica, Sans-Serif;
	font-size: 130%;
}

th.info-heading2
{
	padding: 3px;
	border: 0;
	background: #DBDBDB;
	font-weight: bold;
	font-family: Tahoma, Arial, Helvetica, Sans-Serif;
	font-size: 105%;
}

th.info-heading3
{
	padding: 3px;
	border: 0;
	background: #E3E3E3;
	font-weight: bold;
	font-family: Tahoma, Arial, Helvetica, Sans-Serif;
	font-size: 100%;
}

td.info
{
	padding: 3px;
	border: 0;
	background: #F3F3F3;
	vertical-align: top;
}

table.info blockquote
{
	margin: 0 0 0 3em;
}

table.info td
{
	padding: 3px;
	border: 0;
	vertical-align: top;
}

td.info-highlight
{
	padding: 3px;
	border: 0;
	background: #EBEBEB;
	vertical-align: top;
}

td.info-attention
{
	padding: 3px;
	border: 0;
	background: #FF4040;
	vertical-align: top;
	color: inherit;
}

td.info-completed
{
	padding: 3px;
	border: 0;
	vertical-align: top;
}

td.info-not-started
{
	padding: 3px;
	border: 0;
	background: #FF4040;
	vertical-align: top;
	color: inherit;
}

td.info-not-completed
{
	padding: 3px;
	border: 0;
	background: #FF9F40;
	vertical-align: top;
	color: inherit;
}

td.info-hanging-indent
{
	padding-left: 3em;
	text-indent: -1em;
}

/* Table used in tool pages in wizard format. (That is, tools that are 
broken up into two more more steps, each on a separate page, with Back 
and Next buttons. */

table.wizard-btns
{
	margin: 1.8em 0 0.6em 0;
	padding: 0;
	border: 0;
	border-collapse: collapse;
}

/* Strip that lists the wizard's steps: 1. A > 2. B > 3. C, and so on. */
td.wizard-steps
{
	padding: 4px 2px;
	width: 100%;
	background: #EBEBEB;
	font-weight: bold;
	color: #666666;
}

span.active-step
{
	color: #FF4040;
}

/* Strip that contains the wizard's buttons: Back, Next, Cancel. */
td.wizard-btns
{
	padding: 4px 2px;
	background: #EFEFEF;
	border-collapse: collapse;
}

/* Table that contains a wizard rule. */
table.wizard-rule
{
	margin: 0;
	padding: 4px 2px;
	border: 0;
	border-collapse: collapse;
}

/* Left side of horizontal rule that contains a bullet and text. */
td.wizard-rule-left
{
	width: 50%;
	padding: 4px 4px;
	border: 0;
	border-collapse: collapse;
	background: #0066FF;
	font-weight: bold;
	color: #FFFFFF;
}

/* Right side of horizontal rule that contains an actual rule. */
td.wizard-rule-right
{
	width: 50%;
	border: 0;
	border-collapse: collapse;
	color: #0066FF;
}

/* Horizontal rule. */
td.wizard-rule-right hr
{
	color: #0066FF;
}

/* Assignment navigation panel. */

body.navigation-panel
{
	background: #F3F3F3;
	font-family: Tahoma, Arial, Helvetica, Sans-Serif;
	font-size: 75%;
	color: #000000;
}

table.navigation-panel
{
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 125%;
}

/* Title in the navigation panel. */
table.navigation-panel span.title
{
	color: #000000;
}

/* Available link in the navigation panel. */
table.navigation-panel span.nav-link-available
{
	font-weight: bold;
	color: #0000FF;
}

/* Unavailable link; grayed out. */
table.navigation-panel span.nav-link-unavailable
{
	font-weight: bold;
	color: #999999;
}

/* Current stage. */
table.navigation-panel span.nav-link-current
{
	font-weight: bold;
	color: #0000FF;
}

table.navigation-panel hr
{
	width: 162px;
	height: 1;
	color: #CCCCCC;
}

/* Table generated by a RadioButtonList */

table.rbl
{
	margin: 0;
	padding: 0;
	border: 0
}

table.rbl td
{
	padding: 0;
	border: 0
}

/* Divs */

div.left
{
	float: left;
}

div.right
{
	float: right;
}

div.attention
{
	width: 75%;
	padding: 0 0.6em 0 0.6em;
	border-style: solid;
	border-width: 2px;
	border-color: #FF0000;
	background-color: #FFCCCC;
}

/* Spans */

span.active
{
	color: #007F00;
}

span.attention
{
	color: #FF4040;
}

span.big-text
{
	font-weight: bold;
	font-size: 100%;
}

span.bigger-text
{
	font-weight: bold;
	font-size: 115%;
}

span.button-name
{
	font-weight: bold;
}

span.control-label
{
	font-weight: bold;
}

span.copyright
{
	font-size: 90%;
}

span.cpr-name
{
	font-style: italic;
}

span.correct
{
	color: #009900;
}

span.emphasis
{
	font-style: italic;
}

span.example
{
	font-size: 90%;
	color: #666666;
}

span.grayed
{
	color: #999999;
}

span.incorrect
{
	color: #FF4040;
}

span.instruction
{
	font-size: 90%;
	color: #666666;
}

span.not-available
{
	font-style: italic;
}

span.note
{
	font-size: 100%;
}

span.paused
{
	color: #FF4040;
}

span.tip
{
	font-size: 100%;
}

span.tool-name
{
	font-weight: bold;
}

span.validation-message
{
	color: #FF4040;
}

span.warning
{
	font-weight: bold;
	color: #FF4040;
}

/* Font family */

.monospace
{
	font-family: monospace, monospace;
}

/* Text alignment */

.left
{
	text-align: left;
}

.center
{
	text-align: center;
}

.right
{
	text-align: right;
}

/* */

.clear-both
{
	clear: both;
}

/* */

.control-label
{
	font-weight: bold;
}

.no-wrap
{
	white-space: nowrap;
}

/* Background colors for table cells. */

.medium-background
{
	background: #DFDFDF;
}

/* Class for input elements of types button and submit. Used to fix the
stupid IE stretched button bug. */

.button
{
	overflow: visible;
	width: auto;
	padding-left: 1.2em;
	padding-right: 1.2em;
}
