/* CSS Document */

/* CSS for CFRA private pages.  All definitions in this page are exclusively used in the private section of CFRA.  */

#mainright {
		width: 48%;
		float:left;
		background:#fff;
		padding-bottom:12px;
		padding-left: 2px;
		padding-top: 20px;
		position: relative;
		}
	
#mainleft {
		width: 48%;
		float:left;
		background:#fff;
		padding-bottom:12px;
		padding-left: 0px;
		padding-top: 20px;
		position: relative;
		}


#tableright {
		width: 136px;
		float:left;
		background:#fff;
		padding-bottom:12px;
		padding-left: 2px;
		position: relative;		
		}
	
#tablecenter {
		width: 136px;
		float:left;
		background:#fff;
		padding-bottom:12px;
		padding-left: 2px;
		position: relative;		
		}
	
#tableleft {
		width: 136px;
		float:left;
		background:#fff;
		padding-bottom:12px;
		padding-left: 0px;
		position: relative;
		}
/* topBar: top grey bar containing search box */
#topBar {
	background-color: #000000;
	height: 113px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #163A66;	
}

#topBar img {
	vertical-align: bottom;
}

#lftBar {
    width:171px;
    top:109px;
    left:0px;
}


#lftBarFS {
    width:171px;
    top:95px;
    left:0px;
}



/* Defines right hand column of page - total width is 143 pixels, except on privacy page where photo takes up more space and requires more of a margin on both sides  */
#rgtBar {
	position:absolute;
	width:143px;
	top:30px;
	right:0px;
	margin-left: 6px;
	margin-right: 6px;	
}

/* Defines right hand column of page on privacy page and any other page that requires a photo of similar width */
#rgtBarPrivacy {
	position:absolute;
	width:163px;
	top:30px;
	right:0;
	margin-left: 6px;
	margin-right: 6px;	
}

/* This sets the "what is quickscore" tips farther down on the page */
#rgtBar #down {
top: 330px;
margin-top: 330px;
}

#rgtBarPrivacy #margin {
padding-right: 12px;
}

#tipDay {
	float:right;
	width:375px;
	margin-right: 25px;
	position:relative;
	margin-top: 32px;
}		

#topsearch {
	float:right;
	width:375px;
	margin-right: 25px;
	position:relative;
	margin-top: 18px;
}		

/* ---------- END OF DEFINITION OF PAGE SECTORS ----------  */	

/* SEMI-GRAPHICAL ELEMENTS:  DOGS, LINES, ANY NON-TEXT ITEMS THAT REQUIRE SPECIAL FORMATTING, AND SPECIAL SPACING NEEDS */	
/* orange dots that appear inside table (latest reports) in main part of page body  */ 	
.smallorangedots
{
	color: #FF6600;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
}

/* extends a horizontal rule to match the dividing lines defined by the rounded tab navigation */
hr.stretch {
	margin: 10px 0 10px 2px;
	width: 56.5em;
}

/* definition of data tables (on front page of private section) */
 .mainbodytable {
	border-width: 0 1px 1px;
	margin-left: 10px;
	margin-right: 10px;	
	overflow: auto; 
	width: 95%;	
	padding-left: 12px;
	padding-left: 12px;
	
}

/* handy class to force elements over to be right aligned */
 .floatright
 {
	 float: right;
	 margin-right: 4px;
 }
 
 /* handy class to force elements over to be left aligned */
 .floatleft 
 {
 	float: left; 
 }
 
 /* acts as a blockquote would without incurring additional spacing; this is used on the My CFRA page when a long series of lists need to be indented */
.indent {
	margin-left: 16px;
}

/* this is a hack to force an unordered list to lie closer up to the elements above it (normally the tag puts more space than is desirable between it and the element above) */
ul.closemargin {
	margin-top:-4px; 
}

/* a trick to force down the calendar graphic that needs to reside right next to input text fields on some of the search forms that appear at the top of certain pages */
.imgdown {
	padding-top: 14px; 
	padding-left: -15px;
	margin-right:10px; 
}

.calimgdown {
	padding-top: 14px; 
	padding-left: -15px;
	margin-right:10px; 
}


/*  ---------- END OF SEMI-GRAPHICAL ELEMENTS AND SPACING ELEMENTS----------  */

/* SPECIFIC TEXT FORMATTING - titles, ordinary text, and formatting for forms */

 #lftBar .loginID {
	position: absolute;
	top: 142px;
	left: 0px;
	width: 156px;
	height: 30px;
	font-family : Arial, Helvetica, sans-serif;
	font-size: 11px;
	background-color: #CCCCCC;
	color: #000000;
	float: none;
	text-align: left;
	vertical-align: middle;
	padding-top: 8px;
	padding: 8px;
	padding-left: 8px;
}		

 #lftBarFS .lefttextspace {
	position: absolute;
	top: 150px;
	left: 0px;
	width: 171px;
 } 

 
#lftBar .lefttextspace {
	position: absolute;
	top: 189px;
	left: 0px;
	width: 171px;
 } 
 
 
/* nodec: plain old black text with no special formatting */
.nodec {
	font-family : Arial, Helvetica, sans-serif;
	color: #000000;
	font-size: 12px;
	border: 0px;
	font-weight: bold;	/* padding: 5px 10px 2px; */
	}
	
 /* .bluetitle defines text that is either a title or important information - bolder, larger than other text.   */	
.bluetitle {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #163A66;
}

 /* .bluetitle defines text that is either a title or important information - bolder, larger than other text.   */	
.withline {
	border-bottom-color: #CCCCCC;
	border-bottom-style: solid;
	border-bottom-width: thin;
}

 /* .bluetitle defines text that is either a title or important information - bolder, larger than other text.   */	
.bluetextbold {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #163A66;
	line-height: 18px;	
}

 /* .bluetitle defines text that is either a title or important information - bolder, larger than other text.   */	
.blueformtitle {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #163A66;
}
 /* .bluetitle defines text that is either a title or important information - bolder, larger than other text.   */	
.whitetextbold {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #FFFFFF;
	line-height: 20px;	
	margin-left: 11px;	
}

 /* .bluetitle defines text that is either a title or important information - bolder, larger than other text.   */	
.bluetextnormal {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #163A66;
	line-height: 12px;	
}

 /* .bluetitlemargin: same as bluetitle but with 11 pixel margin   */	
.bluemargin {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #163A66;
	margin-left: 11px;
}

 /* .doclegend specifies how the text looks when defining specific icons (left hand navigation area)  */	
.doclegend
	{
	color: #333333;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	margin-left: 11px;
	line-height: 20px;
	} 	
		
.blacksmalltext
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
}

.blackspacedtext
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	word-spacing: 2px;	
}
/*  ---------- END OF SPECIFIC TEXT FORMATTING ----------  */

/*  ---------- HEADER TAGS  ----------  */

h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #000000;
	font-weight: bold;
}

/* header for main body of page:  dark blue font, slightly larger than normal text */
h3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #163A66;
}

/* header for main body of page:  black font, bold, same size as normal text */
 h4 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: bold;
	color: #000000;
}
/*  ---------- END HEADER TAGS  ----------  */

/*  ---------- FORMS FORMATTING ----------  */	
 /* .searchfield defines the way text input boxes look on forms */	
.searchfield
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: 12px;
}

 /* .button defines the way the form button looks */	
.button {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: 12px;
	background-color: #E4E4E4;
	border: 1px solid #999999;
	margin-left: 10px;
}

.button:active
 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: 12px;
	background-color: #E4E4E4;
	border: 1px solid #999999;
	margin-left: 10px;
}

/* this form button definition is used specifically on the "my cfra" page, where the buttons need to be equally spaced, text centered, width equal, and all falling right on top of one another */
.button2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: 12px;
	background-color: #E4E4E4;
	border: 1px solid #CCCCCC;
	margin-left: 10px;
	text-align:center;
	width: 120px;
}

 /* .button defines the way the form button looks on pages that have the  search boxes/search form up at the top of the page */	
.formbutton {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	background-color: #E4E4E4;
	border: 1px solid #CCCCCC;
	margin-top:18px;
	float:inherit;
}

/* defines size and height of input fields contained within a form */
.formfields {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: 12px;
	margin-right: 0;
	padding-right: 0;
	background-color:#FFFFFF;
}
/* defines size and height of input fields contained within a form that must stretch all the way across the container area */
.formfieldstretch {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: 12px;
	margin-right: 0;
	padding-right: 0;
	width: 90%;
	background-color:#FFFFFF;
}

/* defines the size of a textarea within a form that must stretch all the way across the container area */
.textareastretch {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: 12px;
	margin-right: 0;
	padding-right: 0;
	width: 98%;
	background-color:#FFFFFF;
}

 /* END OF FORMS FORMATTING */	
	
/*  ---------- TABLE AND CHART DEFINITIONS ----------  */	
/* definition of data tables (on front page of private section) */
 .charts {
    overflow: scroll; 
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding: 5px;
    margin: 0;
	border-color: #EEEEEE;
	border: solid 1px;
	background-color: #FFFFFF;
	color: #000000;		
	}
 
	ie.charts {
	overflow: scroll;
    overflow-y: scroll; 
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding: 5px;
    margin: 0;
	border-color: #EEEEEE;
	border: solid 1px;
	background-color: #FFFFFF;
	color: #000000;
	}

/* definition of header for data tables (on front page of private section) */
.chartheader 
{
	/*background-color: #860035; */
	background-color: #817e77;
	/*background-color: #817e77;*/
	color: #FFFFFF;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: bold;
	padding: 6px;
    margin: 0px;
}


/* definition of data tables (on front page of private section) */
 .charts {
	overflow-x: hidden;
	overflow-y: scroll; 
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding: 0px;
    margin: 0;
	border-color: #333333;
	border: solid 1px;
	background-color: #FFFFFF;
	color: #000000;
	
}
.charts h3 {
	font-size: 13px;
	font-weight: bold;
	color: #FFFFFF;
	background-color: #6699CC;
	margin: -5px -5px 15px -5px; /* negative margins offset the padding for the containing div */
    padding: 5px;
}

.charts p {  /* or whatever group you don't want margins around  */
margin: 5;
}
 .charts2 {
	overflow: auto; 
	height: 220px;	
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding: 6px;
    margin: 0;
	border-color: #6699CC;
	border: solid 1px;
	background-color: #FFFFFF;
	color: #163A66;
	width: 95%
}
.charts2 h3 {
	font-size: 13px;
	font-weight: bold;
	color: #FFFFFF;
	background-color: #6699CC;
	margin: -5px -5px 15px -5px; /* negative margins offset the padding for the containing div */
    padding: 5px;
}

/* rounded box for quotes */
.rbroundbox { 
	background: url(../images/nt.gif) repeat; 
	border-color: #495E76;
}

/* handling all four corners of the light blue rounded box */
.rbtop div { background: url(../images/tl.gif) no-repeat top left; }
.rbtop { background: url(../images/tr.gif) no-repeat top right; }
.rbbot div { background: url(../images/bl.gif) no-repeat bottom left; }
.rbbot { background: url(../images/br.gif) no-repeat bottom right; }

/* height and width stuff, width not really nessisary. */
.rbtop div, .rbtop, .rbbot div, .rbbot {
width: 100%;
height: 7px;
font-size: 1px;
}

/* content that goes in the rounded box */
.rbcontent { 
margin: 0 7px;
padding-left:20px; 
padding-right:20px;
}

.tabtitle2
{
	border-bottom: solid 1px #163A66;
	float: left;
	clear: left;
	margin: 0 0 0 2px;
	width: 57em;
	background-color:#CCCCCC;
	height: 30px;
	padding-top: 6px;
	padding-bottom: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #163A66;
}

/* defines width of table to match up with grey/blue bars on report lists */
.tabtable
{
width: 57em;
}

.tabtitle3
{
	border-bottom: solid 1px #163A66;
	float: left;
	clear: left;
	margin: 0 0 0 2px;
	width: 57em;
	background-color:#99ccff;
	height: 30px;
}

.tabtitle4
{
	clear: left;
	margin: 0 0 10px 2px;
	width: 57em;
	height: 1%; 
	border-bottom: solid 1px #163A66;
}

.tabtitle5
{
	clear: left;
	margin: 0 0 10px 2px;
	width: 57em;
	height: 1%; 
}

.mychart {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding: 5px;
	margin: 0;
	border-color: #6699CC;
	border: solid 1px;
	background-color: #FFFFFF;
	color: #163A66;
	width: 95%;
	padding-bottom: 15px;	
}
.mychart h3 {
	font-size: 13px;
	font-weight: bold;
	color: #FFFFFF;
	background-color: #6699CC;
	margin: -5px -5px 15px -5px; /* negative margins offset the padding for the containing div */
    padding: 5px;
}

.mychart p {  
margin: 0;
}

/* defines the table used in reporting with a light grey border all around */
.tablebordergrey
{
	border-color: #CCCCCC;
	border-width: 1px;
	border-style: solid;
	padding-bottom: 10px;
}

/* allows for left hand padding without insisting on padding all around (as a cellpadding attribute would do) */
td.tableborder {
	padding-left: 6px;
}
/*  ---------- END TABLE AND CHART DEFINITIONS ----------  */	


div.tabtitle
{
	border-bottom: solid 1px #163A66;
	float: left;
	clear: left;
	margin: 0 0 10px 2px;
	width: 57em;
}

div.tabtitle ul
{
		list-style: none;
		padding: 0;
		margin: 0;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
		color: #FFFFFF;
		font-weight:bold;
		background-color: #163A66;
		float: left;
}

.tabtitle li
{
		float: left;
		padding-right: 1px;
		border-bottom: 1px solid #163A66;
		margin-right: -1px;
		margin-bottom: -1px;
		padding-top: 1px;
		display: block;
	}
	
	.tabtitle span
{
		padding: 1px 10px 0 10px;
		margin: -1px -1px 0 0;
		display: block;
		background: transparent url(../images/right-li3.gif) right top no-repeat;
		position: relative;
		padding-bottom: 6px;
		padding-top: 6px;	
}	

/* This defines the blue rounded tab that is used NOT as a navigation tab, but as a page header, such as on the global report list page */

div.tabtitlenomargin
{
	border-bottom: solid 1px #163A66;
	float: left;
	clear: left;
	margin: 0 0 0 2px;
	width: 57em;
}
div.tabtitlenomargin ul
{
		list-style: none;
		padding: 0;
		margin: 0;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
		color: #FFFFFF;
		font-weight:bold;
		background-color: #163A66;
		float: left;
}

.tabtitlenomargin li
{
		float: left;
		padding-right: 1px;
		border-bottom: 1px solid #163A66;
		margin-right: -1px;
		margin-bottom: -1px;
		padding-top: 1px;
		display: block;
	}
	
	.tabtitlenomargin span
{
		padding: 1px 10px 0 10px;
		margin: -1px -1px 0 0;
		display: block;
		background: transparent url(../images/right-li3.gif) right top no-repeat;
		position: relative;
		padding-bottom: 6px;
		padding-top: 6px;	
}	

/* FORM SPECIFIC INFORMATION */
#theForm {
	width: 57em;
	}
#theForm fieldset {
	border: 0;
	margin: 0;
/*	padding: 1em; */
	float: left;
	display: block;
	padding-left: 10px;
	}
	
#theForm fieldset.box
{
	display: block;
	margin: 0 0 3em 0;
	padding: 0 1em 1em 1em;
	border-color: #666666;
	border-width: 1px;
}

#theForm fieldset legend span {
	display: none;
	}
#theForm fieldset.radio
{
	margin: 1em 0 2em 0;
}

#theForm fieldset.checkbox
{
	display: block;
}

#theForm fieldset.radio input
{
	float: left;
	width: auto;
}

#theForm fieldset.radio label
{
	font-weight: normal;
	float: right; 
}

#theForm fieldset.checkbox label
{
float: left;
width: 120px;
font-weight: bold;
}

#theForm input
{
	display: block;
	margin-right:0;
	padding-left: 10px;
}

#theForm input.submit
{
	clear: both;
}

#theForm label
{
	float: left;
	display: block;  
	margin: 1em 0 0 0;
	font-weight: bold;
	color:#163A66;
}

#theForm legend
{
	font-weight: bold;
	color:#163A66;
}

#theForm label.notbold
{
	font-weight: normal;
	color: #000000;
}

#theForm select
{
	display: block;
	margin-right: 10px;
}

#theForm br {clear:left;}

/* END FORM SPECIFIC INFORMATION */