/* override YUI template to force 762 page width, 171 left col */
/* width in em's = pixels / 13, or pixels / 13.3333 for IE     */
#doc2 
{/*
	width: 58.615em;
    *width: 57.150em;
	*/
    width: 20.615em;
    *width: 20.155em;

}

.yui-t1 .yui-b {
    width: 20.154em;
    *width: 12.825em;
}

.yui-t1 #hd-right, .yui-t1 #ft-right {    
    margin-left: 0;
	width: 20.154em;
    *margin-left: 12.900em;    
}

.yui-t1 .yui-e {
    width: 15.154em;
    *width: 14.825em;
}


#doc3 {
	min-width: 350px;
}

.headersmall {
	min-width: 300px;
	height: 70px;
	text-align: left;
}

/* change from centered to left-aligned */
body {text-align: left;}
#doc2 {margin: 10px 10px;}

#bd {
    background-image: url(images/header_title.gif);
    background-repeat: repeat-y;
}

#bd.loginpage 
{
    background-image: none;
}

#hd-left 
{
    background-image: url(images/hdr_logo.gif);
    background-repeat:no-repeat;
    background-position: left top;
}

#hd-right
{
    background-image: url(images/hdr_title.gif);   
    background-repeat: no-repeat; 
    background-position: right top;      
}


#hd-left-bar {
	background-color: #236AA3;
	font-size: 12px;
	font-weight: bold;
	color: #FFFFFF;
	text-align: center;
}

#hd-right-bar {
	background-color: #E1EAFD;
	font-size: 10px;
	font-weight: normal;
	color: #FFFFFF;
	text-align: center;
}

#ft-left {
	background-color: #236AA3;
	color: #fff;
}

#ft-right {
	background-color: #d4dcf4;
	color: #fff;
}

/*.FunctionNavTitle 
{
    background-image: url(images/nav_section.gif);      
}*/

/* ELEMENT SPECIFIC CLASSES */

.resultsNameLink
{

	font-size: 12px;
	font-weight: bold;
	color: #4F60D5;
	text-align: left;
	text-decoration: underline;
}

.resultsNameLink:hover
{
	color: #0033FF;
}

.contentLinkSmall
{

	font-size: 11px;
	font-weight: normal;
	color: #4F60D5;
	text-decoration: underline;
}

.contentLinkSmall:hover
{
	color: #0033FF;
}

/*CONTENT ___________________________________*/
.LandingTitle
{
	font-size: 20pt;
	font-weight: normal;
	color: #DD5000;
}

.BodyTitle
{
	font-size: 13pt;
	font-weight: normal;
	color: #236AA3;
}

.BodyTitleItalic
{
	font-size: 16pt;
	font-weight: normal;
	font-style: italic;
	color: #236AA3;
}

.BodyDescription {
	font-size: 11px;
	font-weight: normal;
	font-style: normal;
	color: #000000;
	padding-left: 2px;
}

/*.BodyDescription
{
	font-size: 12px;
	font-weight: bold;
	font-style: normal;
	color: #2E5AA1;
	padding-left: 2px;
}*/

.Asterisk {
	font-size: 11px;
	font-weight: bold;
	color: #FF0000;
	padding-right: 2;
}

.Warning
{
	font-size: 11px;
	color: #FF0000;
	text-wrap:normal;
}

.checkbox
{
	font-size: 11px;
	font-weight: normal;
	color: #000000;
	line-height: 11pt;
	text-decoration: none;
	text-align: left;
}

.body
{
	font-size: 11px;
	font-weight: normal;
	color: #000000;
	text-decoration: none;
}


.bodyBold
{
	font-size: 11px;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
	vertical-align:middle;
}

.bodyLarge
{
	font-size: 15px;
	font-weight:bold;
	color: #000000;
	text-decoration: none;
}

.resultsName
{
	font-size: 12px;
	font-weight: bold;
	color: #879BC3;
	text-decoration: none;
	text-align: left;
	text-transform: uppercase;
}


.tableCellRule
{
	background-color: #C1C7DF;
	height: 1px;
}

.textButton, .TextButton
{
	font-size: 10px;
	font-weight: bold;
	color: #FFFFFF;
	text-align: center;
	background-color: #236AA3;
	border: solid 1px #879BC3;
	text-transform: uppercase;
	cursor: pointer;
	cursor: hand;
}

.link
{
	font-size: 11px;
	font-weight: normal;
	color: #4F60D5;
	text-align: left;
	padding: 1px 2px 1px 2px;
}

.nolink
{
	font-size: 11px;
	font-weight: bold;
	color: #000000;
	text-align: left;
	text-decoration: none;
	padding: 1px 2px 1px 2px;
}

.CommonNavItem {
	font-size: 13px;
	font-weight: bold;
	color: #236AA3;
	padding: 1px 10px 1px 10px;
	text-decoration: none;
	text-transform: uppercase;
}

.CommonNavItem:hover
{
	text-decoration: underline;
	color:blue;
}

.CommonNavSpacerDark
{
	background-color: #83AECF;
}

.CommonNavSpacerLight
{
	background-color: #FFFFFF;
}

.CommonNavItemLarge {
	font-size: 16px;
	font-weight: bold;
	color: #000000;
	padding: 2px 10px 2px 10px;
	text-decoration: none;
	text-transform: uppercase;

	background: #FFFFFF;
	border: solid 1px #000000;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	
	
	display: inline-block;
	font-weight: bold;
	line-height: 30px;
	margin-right: 5px;
	text-align: center;
	width: 30px;
}

	.CommonNavItemLarge:hover {
		text-decoration: underline;
	}

/* Dropdown Button */
/*.dropbtn {
	background-color: #04AA6D;
	color: white;
	padding: 16px;
	font-size: 16px;
	border: none;*/
.dropbtn {
	/*height: 29px;
	width: 29px;
	vertical-align: bottom;
	color: white;
	padding: 16px;
	font-size: 16px;
	border: none;*/
	font-size: 16px;
	font-weight: bold;
	color: #000000;
	padding: 2px 10px 2px 10px;
	text-decoration: none;
	text-transform: uppercase;
	background: #FFFFFF;
	border: solid 1px #000000;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	display: inline-block;
	font-weight: bold;
	line-height: 30px;
	margin-right: 5px;
	text-align: center;
	width: 30px;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
	position: relative;
	display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
	display: none;
	position: absolute;
	min-width: 100px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	z-index: 1;
}

	/* Links inside the dropdown */
	.dropdown-content a {
		color: black;
		padding: 12px 16px;
		font-size: 14px;
		text-decoration: none;
		display: block;
		text-align:left;
	}

		/* Change color of dropdown links on hover */
		.dropdown-content a:hover {
			background-color: #ddd;

		}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
	display: block;
	background-color:white;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
	background-color: #ddd;
}

.accordion {
	top: 50%;
}

.accordion__item__title {
	display: block;
	cursor: pointer;
	font-size: 14px;
	font-weight: bold;
	color: #236AA3;
	padding: 10px 1px 1px 1px;
	text-decoration: none;
	text-align: left;
	/*	background-color: #BDCBE7;*/
	/*background-image: url(images/nav_section.gif);*/
	text-transform: uppercase;
	line-height: 25px;
	padding-top: 5px;
}

.accordion__item__title:hover {
	text-decoration:underline;
	color:blue;
}

/*.accordion__item__title:before {*/
/*		content: "+";
		position: absolute;
		right: 20px;
		top: 50%;
		font-size: 2rem;
		line-height: 2rem;
		margin-top: -1rem;
		font-weight: bold;*/
		/*content: '+';
		color: black;
		position: absolute;
		top: 50%;
		right: 20px;
		font-size: 12px;
		font-weight: bold;
		transform: translateY(-50%);
	}*/

/*.accordion__item:nth-of-type(2n) .accordion__item__title {
	background: #FFFFFF;
}*/

.accordion__item__content {
	display: none;
	font-size: 14px;
	font-weight: bold;
	padding: 1px 10px 10px 1px;
	color: #236AA3;
	text-decoration: none;
	text-align: left;
	line-height:20px;
	
}

	.accordion__item__content:target {
		display: block;
	}






.res-circle {
	/* (A) PERCENTAGE WIDTH & BORDER RADIUS */
	width: 10%;
	border-radius: 50%;
	/* (B) BACKGROUND COLOR */
	background: #bcd6ff;
	/* (C) NECESSARY TO POSITION TEXT BLOCK */
	line-height: 2;
	position: relative;
}
	/* (D) MATCH HEIGHT */
	.res-circle::after {
/*		content: "";*/
		display: block;
		padding-bottom: 100%;
	}

.res-sphere {
	/* (A) PERCENTAGE WIDTH & BORDER RADIUS */
	width: 20%;
	border-radius: 50%;
	/* (B) FAKE 3D SPHERE */
	/* http://www.colorzilla.com/gradient-editor/ */
	background: linear-gradient(135deg, #a7cfdf 0%,#23538a 100%);
	/* https://html-css-js.com/css/generator/box-shadow/ */
	box-shadow: inset -8px -7px 4px 0px rgba(0,0,0,0.3);
}

	/* (C) MATCH HEIGHT */
	.res-sphere:after {
		display: block;
		padding-bottom: 100%;
	}

.avatar {
	/* Center the content */
	display: inline-block;
	vertical-align: middle;
	/* Used to position the content */
	position: relative;
	/* Colors */
	background-color: rgba(0, 0, 0, 0.3);
	color: #fff;
	/* Rounded border */
	border-radius: 50%;
	height: 48px;
	width: 48px;
}

.avatar__letters {
	/* Center the content */
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
}

.dataTable tr
{
	font-size:12px;
}

.dataTable td
{
	font-size:10px;
}

.fauxBox
{
	min-height:1.2em;
	background-color:#FFFFFF;
	border:1px solid #7F9DB9;
	padding:3px;
}
/* IE6- hack */
* html .fauxBox {
	height: 1.2em;
}

.rule {margin: 10px 0px; *margin: 0px;}

/*SUBMENU (LEFT MENU)_______________________________________*/

.FunctionNavTitle
{
	font-size: 14px;
	font-weight: bold;
	color: #91938D;
	padding: 1px 13px 1px 1px;
}

.FunctionNavItem {
	font-size: 13px;
	font-weight: bold;
	padding: 1px 10px 2px 1px;
	color: black;
	text-decoration: none;
	text-align: right;
	/*display: none;
	background: rgba(0,0,0,.95);
	padding: 40px 0 0 40px;
	position: fixed;*/ /* Fixed position */
	/*top: 0;
	right: 0;*/ /* Sidebar initial position. "right" for right positioned menu */
	/*height: 100%;
	z-index: 2;
	transition: 0.5s;*/ /* CSS transition speed */
	/*width: 250px;
	font: 20px "Courier New", Courier, monospace;
	box-sizing: border-box;*/
}

.FunctionNavItem:hover
{
	color: #4F60D5;
	text-decoration: underline;
}

.FunctionNavBackground
{
	background-color: #FFFFFF;
}




/*FOOTER_______________________________________*/


.contactText {
	xxfont-size: 1em;
	xx *font-size: 1em;
	font-weight: normal;
	color: #FFFFFF;
	padding: 1px 13px 1px 1px;
	text-decoration: none;
	text-align: left;
}

.contactText:hover
{
	xxfont-size: 1em;
	xx*font-size: 1em;
	font-weight: normal;
	color: #BBC9E6;
	padding: 1px 13px 1px 1px;
	text-decoration: none;
}

.copyrightText {
	xxfont-size: 1em;
	xx *font-size: 1em;
	font-weight: normal;
	color: steelblue;
	padding: 1px 13px 1px 1px;
	text-decoration: none;
	text-align: left;
}

/*TEST TABLE_______________________________________*/


/*DAVE'S STYLES */
.SectionTable
{
	border: 1px solid #979494;
	background-color: #EBEBEB;
}

.SectionTitle
{
	font-size: 11px;
	font-weight: bold;
	font-style: normal;
	height: 21px;
	color: #FFFFFF;
	background-color: #236AA3;
	padding: 3px 3px 3px 8px;
}

.SectionTitleText
{
	font-size: 11px;
	font-weight: bold;
	font-style: normal;
	color: #FFFFFF;
}

.SectionSubTitle
{
	font-size: 11px;
	color: #000000;
	font-weight: bold;
	text-decoration: none;
	text-align: left;
	padding: 3px 3px 3px 3px;
	background-color: #B9C5DE;
}

.SectionDescription
{
	font-size: 11px;
	font-style: normal;
	color: #000000;
	padding: 3px 10px 10px 10px;
}

.SectionText, .sectionText
{
	font-size: 11px;
	font-style: normal;
	color: #000000;
	padding: 3px 10px 3px 10px;
}

.SectionTextItalic
{
	font-size: 11px;
	font-style: italic;
	color: #000000;
	padding: 3px 10px 3px 10px;
}

.ValidationSummary
{
	padding: 3px 10px 3px 10px;
}

.PagingFooterLink
{
	color: #24A585;
	text-decoration: underline;
}

.PagingFooterNoLink
{
	color: #24A585;
	text-decoration: none;
}

.fieldLabel
{
	font-size: 11px;
	color: #000000;
	text-align: right;
}

.fieldLabelBold
{
	font-size: 11px;
	font-weight: bold;
	font-style: normal;
	color: #000000;
	text-align: right;
}

.fieldLabelLeft
{
	font-size: 11px;
	font-style: normal;
	color: #000000;
	text-align: left;
}

.fieldReadOnly
{
	font-size: 11px;
	font-weight: normal;
	color: #000000;
	text-decoration: none;
	padding-left: 5px;
}

.SectionText-Error
{
	font-size: 11px;
	color: #FF0000;
	font-weight: bold;
}

.SectionText-Success
{
	font-size: 11px;
	font-weight: bold;
	color: #008000;
}

.resultsNameLinkInactive
{
	font-weight: bold;
	font-size: 12px;
	color: #91938D;
	text-decoration: none;
	text-align: left;
}

.bodyItalic
{
	font-size: 11px;
	color: #000000;
	font-style: italic;
	text-decoration: none;
}

/* ASSESSMENT STYLES ____________________________ */
.AssessmentBanner {
	font-size: 11px;
	font-weight: bold;
	color: #000000;
	background-color: #BDCBEF;
}			
.AssessmentExamTitle {				
	font-size: 20px; 
	font-weight: bold;
	color: #161F6E;
}			
.AssessmentExamDescription {
	font-size: 11px;
	font-weight: bold;
	color: #000000;
}			
.AssessmentExamHeader {
	font-size: 11px;				
	color: #000000;			
}			
.AssessmentQuestionContainer {
	margin-right: 20px;
	background-color: #EFEFF7;
	border: 1px solid #BDCBEF;
	padding: 10px;
}
.AssessmentQuestionTitle {				
	font-size: 20px; 
	font-weight: bold;
	color: #161F6E;
}	
.AssessmentQuestionDescription {
	font-size: 14px;				
	font-weight: bold;
	color: #161F6E;			
}
.AssessmentQuestionVerbiage {	
	font-size: 11px;
	font-weight: bold;
	color: #000000;
}
.AssessmentQuestionAnswers {
	font-size: 11px;
	color: #000000;
}
.AssessmentQuestionValidation{
	font-size: 11px;
	font-weight: bold;
	color: red;			
}						

.AssessmentResultsColumn {
	color: #161F6E; 
	font-weight: normal; 
	text-transform: uppercase;
}

/* The main calendar widget.  DIV containing a table. */

.calendar {
  position: relative;
  display: none;
  border-top: 2px solid #fff;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  border-left: 2px solid #fff;
  font-size: 11px;
  color: #000;
  cursor: default;
  background: #c8d0d4;
  font-family: tahoma,verdana,sans-serif;
}

.calendar table {
  border-top: 1px solid #000;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  border-left: 1px solid #000;
  font-size: 11px;
  color: #000;
  cursor: default;
  background: #FFFFFF;
  font-family: tahoma,verdana,sans-serif;
}

/* Header part -- contains navigation buttons and day names. */

.calendar .button { /* "<<", "<", ">", ">>" buttons have this class */
  text-align: center;
  padding: 1px;
  border-top: 1px solid #fff;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  border-left: 1px solid #fff;
}

.calendar .nav {
  background: transparent url(menuarrow.gif) no-repeat 100% 100%;
}

.calendar thead .title { /* This holds the current "month, year" */
  font-weight: bold;
  padding: 1px;
  border: 1px solid #000;
  background: #236AA3;
  color: #fff;
  text-align: center;
}

.calendar thead .headrow { /* Row <TR> containing navigation buttons */
}

.calendar thead .daynames { /* Row <TR> containing the day names */
}

.calendar thead .name { /* Cells <TD> containing the day names */
  border-bottom: 1px solid #000;
  padding: 2px;
  text-align: center;
  background: #EBEBEB;
}

.calendar thead .weekend { /* How a weekend day name shows in header */
  color: #f00;
}

.calendar thead .hilite { /* How do the buttons in header appear when hover */
  border-top: 2px solid #fff;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  border-left: 2px solid #fff;
  padding: 0px;
  background-color: #d8e0e4;
}

.calendar thead .active { /* Active (pressed) buttons in header */
  padding: 2px 0px 0px 2px;
  border-top: 1px solid #000;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  border-left: 1px solid #000;
  background-color: #b8c0c4;
}

/* The body part -- contains all the days in month. */

.calendar tbody .day { /* Cells <TD> containing month days dates */
  width: 2em;
  text-align: right;
  padding: 2px 4px 2px 2px;
}
.calendar tbody .day.othermonth {
  font-size: 80%;
  color: #aaa;
}
.calendar tbody .day.othermonth.oweekend {
  color: #faa;
}

.calendar table .wn {
  padding: 2px 3px 2px 2px;
  border-right: 1px solid #000;
  background: #EBEBEB;
}

.calendar tbody .rowhilite td {
  background: #d8e4e0;
}

.calendar tbody .rowhilite td.wn {
  background: #c8d4d0;
}

.calendar tbody td.hilite { /* Hovered cells <TD> */
  padding: 1px 3px 1px 1px;
  border: 1px solid;
  border-color: #fff #000 #000 #fff;
}

.calendar tbody td.active { /* Active (pressed) cells <TD> */
  padding: 2px 2px 0px 2px;
  border: 1px solid;
  border-color: #000 #fff #fff #000;
}

.calendar tbody td.selected { /* Cell showing selected date */
  font-weight: bold;
  padding: 2px 2px 0px 2px;
  border: 1px solid;
  border-color: #000 #fff #fff #000;
  background: #d8e0e4;
}

.calendar tbody td.weekend { /* Cells showing weekend days */
  color: #f00;
}

.calendar tbody td.today { /* Cell showing today date */
  font-weight: bold;
  color: #00f;
}

.calendar tbody .disabled { color: #999; }

.calendar tbody .emptycell { /* Empty cells (the best is to hide them) */
  visibility: hidden;
}

.calendar tbody .emptyrow { /* Empty row (some months need less than 6 rows) */
  display: none;
}

/* The footer part -- status bar and "Close" button */

.calendar tfoot .footrow { /* The <TR> in footer (only one right now) */
}

.calendar tfoot .ttip { /* Tooltip (status bar) cell <TD> */
  background: #EBEBEB;
  padding: 1px;
  border: 1px solid #000;
  background: #83AECF;
  color: #fff;
  text-align: center;
}

.calendar tfoot .hilite { /* Hover style for buttons in footer */
  border-top: 1px solid #fff;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  border-left: 1px solid #fff;
  padding: 1px;
  background: #d8e0e4;
}

.calendar tfoot .active { /* Active (pressed) style for buttons in footer */
  padding: 2px 0px 0px 2px;
  border-top: 1px solid #000;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  border-left: 1px solid #000;
}

/* Combo boxes (menus that display months/years for direct selection) */

.calendar .combo {
  position: absolute;
  display: none;
  width: 4em;
  top: 0px;
  left: 0px;
  cursor: default;
  border-top: 1px solid #fff;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  border-left: 1px solid #fff;
  background: #d8e0e4;
  font-size: 90%;
  padding: 1px;
  z-index: 100;
}

.calendar .combo .label,
.calendar .combo .label-IEfix {
  text-align: center;
  padding: 1px;
}

.calendar .combo .label-IEfix {
  width: 4em;
}

.calendar .combo .active {
  background: #c8d0d4;
  padding: 0px;
  border-top: 1px solid #000;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  border-left: 1px solid #000;
}

.calendar .combo .hilite {
  background: #048;
  color: #aef;
}

.calendar td.time {
  border-top: 1px solid #000;
  padding: 1px 0px;
  text-align: center;
  background-color: #EBEBEB;
}

.calendar td.time .hour,
.calendar td.time .minute,
.calendar td.time .ampm {
  padding: 0px 3px 0px 4px;
  border: 1px solid #889;
  font-weight: bold;
  background-color: #fff;
}

.calendar td.time .ampm {
  text-align: center;
}

.calendar td.time .colon {
  padding: 0px 2px 0px 3px;
  font-weight: bold;
}

.calendar td.time span.hilite {
  border-color: #000;
  background-color: #667;
  color: #fff;
}

.calendar td.time span.active {
  border-color: #f00;
  background-color: #000;
  color: #0f0;
}