/* $Id: main.css,v 1.2 2004/04/19 16:27:56 aaffleck Exp $ */
/* WC Default Skin */
/* Main Site Structure */
body
{
	margin: 0px;
	padding: 0px;
	font-family: Verdana, Trebuchet MS, Arial, Helvetica, Sans-serif;
	font-size: xx-small; /* See below */
	voice-family: "\"}\"";
	voice-family: inherit;
	font-size: x-small; /* See below */
}

/* IE handles font sizes differently than other browsers. So, we define them one way
   for those browsers and another for IE. The construct immediately above and below this
   comment is only visible to non-IE browsers allowing us to define the xx-small that
   IE needs and the x-small the others all need. */

html>body
{
	font-size: x-small;
}

#pageHeader
{
	position: relative;
	background-image: url(/images/gen-header_bg_tile.gif);
	background-repeat: repeat-x;
	background-position: 0 0;
	margin-bottom: 5px;
}

#pageBody
{
	position: relative;
	margin: 0px;
	padding: 0px;
	height: 100%;
}

#navigation
{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 150px;
	margin: 0px;
	padding: 0px;
	font-size: xx-small;
}

#pageContentThreeColumns
{
	position: absolute;
	top: 0px;
	left: 0px;
	padding-left: 150px;
	padding-right: 150px;
}

#pageContentNavOnly
{
	position: absolute;
	top: 0px;
	left: 0px;
	padding-left: 150px;
}

#pageContentSidebarOnly
{
	position: absolute;
	top: 0px;
	left: 0px;
	padding-right: 150px;
}

#pageContentFullScreen
{
	position: absolute;
	top: 0px;
	left: 0px;
}

#pageFooter
{
	border-top: 1px solid silver;
	margin-top: 15px;
	color: gray;
	font-size: xx-small;
	margin-left: 10px;
	margin-right: 10px;
	padding-bottom: 20px;
}

#sidebar
{
	position: absolute;
	top: 0px;
	right: 15px;
	margin-right: -15px;
	width: 150px;
}

/* Header Specific Styles */
#pageHeader h1
{
	position: absolute;
	right: 15px;
	top: 35px;
	color: white;
	text-align: right;
	padding: 0px;
	margin: 0px;
	text-decoration: none;
	border-bottom: 0px;
}

#topNav
{
	margin-top: 6px;
	border-bottom: 1px solid #869AAE;
	font-size: xx-small;
	padding-left: 10px;
	padding-right: 10px;
	color: #869AAE;
	font-weight: bold;
	vertical-align: middle;
	width: 100%;
}

#topNav a:link, #topNav a:visited
{
	font-weight: bold;
	color: #1F2B85;
	text-decoration: none;
}

#topNav a:hover
{
	font-weight: bold;
	color: #163EFC;
	text-decoration: underline;
}

#topNav img
{
	padding-left: 10px;
}

#topNav form
{
	padding: 0px;
	margin: 0px;
}

/* navigation specific styles */
#navigation ul
{
	list-style: none;
	margin-left: 10px;
}

#navigation ul li
{
	padding-bottom: 8px;
}

#navigation a:link, #navigation a:visited
{
	text-decoration: none;
}

#navigation a:hover
{
	color: #163EFC;
	text-decoration: underline;
}

/* pageFooter specific styles */
#pageFooter p
{
	margin: 0px;
	padding: 0px;
}

/* Sidebar specific styles */
#sidebar h2.ceptitle
{
	font-weight: bold;
	font-size: x-small;
	border: 0px;
}

#sidebar ul
{
	padding-top: 0px;
	margin-top: 0px;
	padding-bottom: 0px;
	margin-left: 15px;
	padding-left: 0px;
}

#sidebar li
{
	font-size: x-small;
	font-weight: normal;
	padding-bottom: 5px;
	margin-left: 5px;
}

#sidebar li p
{
	margin: 0px;
	padding: 0px;
	color: #000;
	margin-left: 0px;
}

#sidebar .cepdescription
{
	margin-left: 0px;
	margin-top: 0px;
	padding-top: 0px;
	padding-bottom: 10px;
	padding-left: 7px;
	font-size: x-small;
}

#sidebar p.cepdescription
{
	margin-left: 0px;
	margin-top: 0px;
	padding-top: 0px;
	padding-left: 5px;
	margin-bottom: 5px;
}

/* General Styles (not panel specific) */
p
{
	padding-left: 10px;
	padding-right: 10px;
	margin-top: 0px;
}

h1, h2, h3, h4, h5, h6
{
	color: #546D85;
	margin-left: 10px;
	margin-right: 10px;
}

h1
{
	font-size: large;
	font-weight: bold;
	padding-bottom: 0;
	margin-bottom: 3px;
	border-bottom: 1px solid #546D85;
}

h2
{
	font-size: medium;
	font-weight: bold;
	padding-bottom: 0;
	margin-bottom: 3px;
	border-bottom: 1px solid #546D85;
	text-transform: none;
}

h3
{
	font-size: small;
	font-weight: bold;
	padding-bottom: 0;
	margin-bottom: 3px;
}

h4
{
	font-size: x-small;
	font-weight: bold;
}

h5
{
	font-size: xx-small;
	font-weight: bold;
}

h6
{
	font-size: xx-small;
	font-style: normal;
	font-weight: bold;
}

fieldset
{
	border-color: #9FB7D1;
	border-width: 1px;
	border-style: solid;
	margin: 5px;
}

legend
{
	font-size: small;
	font-weight: bold;
	color: #546D85;
}

a:link, a:visited
{
	font-weight: bold;
	color: #1F2B85;
}

a:hover
{
	color: #163EFC;
}

div.box
{
	border: none;
	margin: 0em 0em 2em 0em;
	padding: 5px;
}

div.box ul
{
	padding-left: 0px;
	margin-left: 20px;
	padding-right: 5px;
	margin-top: 0px;
}

div.box ul li
{
	padding-bottom: 3px;
}

div.box h1
{
	background: #869AAE;
	border: 1px solid #869AAE;
	border-style: solid solid none solid;
	color: white;
	padding: 0em 1em 0em 1em;
	text-transform: lowercase;
	display: inline;
	height: 1em;
	margin: 0px;
	font-size: x-small;
}

div.body h2
{
	text-transform: lowercase;
	display: block;
	font-size: small;
	line-height: 1.2em;
	padding-top: 0px;
	margin-top: 3px;
	margin-bottom: 3px;
}

div.box h3
{
	font-size: 1em;
}

div.box div.body
{
	background: transparent;
	border-collapse: collapse;
	border: 1px solid #869AAE;
	padding-top: 5px;
}

.boxDetails
{
	text-align: right;
}

div.box .content
{
	padding: 1em;
}

div.box a.close
{
	float: right;
	text-transform: none;
	border-left: 1px solid #8CACBB;
	padding: 0em 0.2em;
}

div.box .even
{
	background-color: #F7F9FA;
}

div.box .odd
{
	background-color: transparent;
}

div.box input
{
	font-size: 100%;
}

.accessKey
{
	text-decoration: underline;
	font-weight: bold;
}

.warning
{
	font-size: x-small;
	color: red;
}

.bigWarning
{
	font-size: medium;
	color: red;
}

/* Content Items Styling */
.contentItem p
{
}

.contentItem img
{
	margin-bottom: 5px;
}

.contentItem li
{
	margin-left: 20px;
}

.contentItem ul
{
	padding-left: 10px;
	margin-left: 30px;
}

.contentItem ol
{
}

.contentItem li p
{
	margin: 0px;
	padding: 0px;
}

.formLabel
{
	font-weight: bold;
}

.formData
{
	margin-left: 20px;
	margin-top: 0px;
	margin-bottom: 0px;
}

.formIncorrect
{
	color: red;
}

.formCorrect
{
	color: green;
}

.formError
{
	font-weight: bold;
	color: red;
}

.formCompletion
{
	font-weight: bold;
	color: gray;
	margin-top: 10px;
}

.formButtons
{
}

.formIncorrectImg
{
	width: 16px;
	height: 16px;
	background-color: #FFF;
	background-image: url(/images/incorrect.gif);
	background-position: 0 0;
}

.formCorrectImg
{
	width: 16px;
	height: 16px;
	background-color: #FFF;
	background-image: url(/images/correct.gif);
	background-position: 0 0;
}

div.instructions
{
	border-color: #869AAE;
	border-width: 1px;
	border-style: solid;
	background-color: #C7DFFF;
	margin-left: 10px;
	margin-right: 10px;
	margin-top: 10px;
	margin-bottom: 50px; /* Yes, this is high. See below. */
	padding-bottom: 0px;
	height: auto;
}

/* This next bit hides this particular margin for the div.instructions box from MSIE.
   IE, for some reason needs the value to be high, like 50 to push the next item down 
   enough on the page whereas all other browsers do the correct thing and 10 is sufficient
   So, we define it to be 50 for IE and then redefine it to be 10 in a way that all browsers
   but IE can understand. */
   
div>div.instructions {
	margin-bottom: 10px;
}

div.instructions h2, div.instructions h1, div.instructions h3
{
	padding: 0px;
}

.hidden
{
	display: none;
}

.videoDisplay { padding-left: 13px; }

.pageMenuRightCell, .pageMenuLeftCell
{
	vertical-align: top;
	padding: 5px;
}