
/* <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< */
/* Styles below this point represent the master stylesheet for Next Gen CeB, as rendered within Internet Explorer. Last updated 01-11-2006. */
/* This stylesheet is generously formatted and commented. The file should be tightened up considerably, for performance reasons, before being put into production. */

/* As of 01-11-2006, this stylesheet uses percentages in place of keywords for dynamic font resizing. */

/* -------------------------------------------------- */
/* -------------------------------------------------- */
/* COMMON STUFF */
/* -------------------------------------------------- */
/* -------------------------------------------------- */

.minimumPageWidth {
/* All pages that display in the primary browser window use a spacer graphic to enforce a minimum width for the page content. */
/* CSP equivalent: None. CSP enforces minimum content width, but it uses a different technique. */
	width:0px;
}
body {
/* Defines the base properties for the page as a whole. */
/* CSP equivalent: body. Note that body is an HTML tag, not a class. */
	background-color:#F1E9B1;	/* Basic Background Color (white) */
}
.leftGutter {
/* All pages that display in the primary browser window use a spacer graphic to enforce a minimum width for the margins on the left and right of the primary page contents. */
/* CSP equivalent: CSP uses a different technique to enforce page margins. For CSP pages, the left margin is hardcoded at 25px. */
	width:25px;
}
.rightGutter {
/* All pages that display in the primary browser window use a spacer graphic to enforce a minimum width for the margins on the left and right of the primary page contents. */
/* CSP equivalent: CSP uses a different technique to enforce page margins. For CSP pages, the right margin is hardcoded at 10px. */
	width:10px;
}
.pageTitle {
/* Defines the properties for the page title. */
/* CSP equivalent: body-title. */
	text-align:left;  /* Do not center. */
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	color:#672200;	/* Heading Text Color (dark blue) */
	font-size:115%; /* default relative Font Size; replaces medium */
	font-weight:bold;
}
.pageSubTitle {
/* Defines the properties for the page sub-title. */
/* CSP equivalent: NEW-body-subheading. */
	text-align:left;  /* Do not center. */
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	color:#672200;	/* Heading Text Color (dark blue) */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	text-decoration:none;
	font-weight:bold;
}
.instructionalText {
/* Defines the properties for basic text within any page. The most common application is to the instructional text paragraph at the top of a page. */
/* CSP equivalent: body-instruction. */
	text-align:left;  /* Do not center. */
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	color:#000000;	/* Basic Text Color (black) */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:normal;
}
		/* Nested link properties. */
		/* CSP equivalent: Inherited link properties for body-instruction. */
		.instructionalText A:link {
			color:#616D14;	/* Basic Link Color (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.instructionalText A:visited {
			color:#616D14;	/* Basic Link Color - Visited (purple) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.instructionalText A:hover {
			color:#795707;	/* Basic Link Color - Hover (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}

.instructionalTextStrong {
/* Allows a span of instructional text to be highlighted, such as the "changes not yet submitted" text that appears on preview pages. The default highlighting will be a bold treatment. Although a color change or background change is possible, such an effect cannot currently be mimicked within CSP pages. Should be applied to a SPAN, not a TD. Does not explicitly accommodate embedded links. */
/* CSP equivalent: None. Instructional text is usually bolded directly through a nested STRONG tag. */
	font-weight:bold;
}
.instructionalText ul  {
/* Applied to a UL tag that appears within an instructional text paragraph, or cell. Used primarily for the "What would you like to do?" link lists that appear at the bottom of form confirmation pages. */
/* Note: This style combination eliminates an early Next Gen style called formNextLinks. */
/* CSP equivalent: No direct equivalent. CSP used a table structure and their body-instruction tag for similar content on their Main Menu page. However, no CeB client will make use of that Main Menu page. */
	margin-top:5px;
	margin-bottom:5px;
}
.instructionalText li {
/* Applied to an LI tag that appears within an instructional text paragraph, or cell. Used primarily for the "What would you like to do?" link lists that appear at the bottom of form confirmation pages. */
/* Note: This style combination eliminates an early Next Gen style called formNextLinks. */
/* CSP equivalent: No direct equivalent. CSP used a table structure and their body-instruction tag for similar content on their Main Menu page. However, no CeB client will make use of that Main Menu page. */
	padding-top:4px;
	list-style-type:disc;
}
.pageNote {
/* Defines the properties for a client-defined page note. Typically, a page note can be inserted near the bottom of a page. */
/* CSP equivalent: None. */
	text-align:left;  /* Do not center. */
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	color:#000000;	/* Basic Text Color (black) */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:normal;
}
		/* Nested link properties. */
		/* CSP equivalent: None. */
		.pageNote A:link {
			color:#616D14;	/* Basic Link Color (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.pageNote A:visited {
			color:#616D14;	/* Basic Link Color - Visited (purple) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.pageNote A:hover {
			color:#795707;	/* Basic Link Color - Hover (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}

.pageNoteStrong {
/* Allows a span of page-note text to be highlighted. The default highlighting will be a bold treatment. Should be applied to a SPAN, not a TD. Does not explicitly accommodate embedded links. */
/* CSP equivalent: None. */
	font-weight:bold;
}
.helpLine {
/* Defines the base properties for items that appear in the bottom-of-the-page help line. Note though that link definitions can override some or all of these properties. */
/* CSP equivalent: all-style-help. Note though, that CSP does not currently use this class in the help line, instead using body-instruction. A change has been requested. */
	text-align:left;
	background-color:#F1E9B1; /* Basic Background Color (white) */
 	color:#000000;	/* Basic Text Color (black) */
 	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-weight:normal;
}
		/* Nested link properties. */
		/* CSP equivalent: Inherited link properties for all-style-help. */
		.helpLine A:link {
			color:#616D14;	/* Basic Link Color (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.helpLine A:visited {
			color:#616D14;	/* Basic Link Color - Visited (purple) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.helpLine A:hover {
			color:#795707;	/* Basic Link Color - Hover (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}

.noBreakSpan {
/* Used to keep multi-word action links from line-breaking in an awkward way. Applied to a SPAN, nested within an A (anchor). */
/* CSP equivalent: NEW-nobreak. */
	white-space:nowrap;
}
.pageSpacer {
/* Rarely used. Applied at the TD level in a layout table to provide a little more vertical white space between page elements. See the Account Activity page for an example.  */
/* By default, this class is identical to the formSpacer class. However it is kept separate just in case the form background color ever deviates from the general page background (which it shouldn't).  */
/* CSP equivalent: none. */
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	/* height is not offered for branding. */
	height:11px;
	/* font-size is not offered for branding. */
	font-size:2px;
}


/* -------------------------------------------------- */
/* COMMON STUFF: Vertical Spacing */
/* -------------------------------------------------- */

.mainContentBlock {
/* Description TBD. */
	margin-top:0px;
	margin-bottom:0px;
}
.pageTitleBlock {
/* Description TBD. */
/* Note to Mark: We should talk about the margin-top setting. I originally had margin-top set to 19px to match the offset that CSP uses today. Please take a look at a production Paytrust page, and you'll see that CSP creates the space above the title with an extra TR and a spacer graphic. We will have to determine what we want CSP to do differently in order to match the 10px spacing you want. I believe we will have to get them to drop the spacer-row approach altogether or we will not be able to offer our clients the ability to brand the navigation panel with an explicit border. Have a look and then let's discuss. */
	margin-top:10px;
	margin-bottom:10px;
}
.formBlock {
/* Description TBD. */
 	margin-top:0px;
	margin-bottom:0px;
}
.dataTableBlock {
/* Description TBD. */
	margin-top:10px;
	margin-bottom:10px;
}
.helpLineBlock {
/* Description TBD. */
	margin-top:19px;
	margin-bottom:10px;
}
.messageBlock {	
/* Description TBD. */
	margin-top:0px;
	margin-bottom:0px;
}
.focusBlock {
/* Description TBD. */
 	margin-top:0px;
	margin-bottom:4px;
}

/* -------------------------------------------------- */
/* COMMON STUFF: Error messages and informational messages  */
/* -------------------------------------------------- */

.errorTextTop {
/* Sets the properties for top-of-the-page error text. */
/* CSP equivalent: body-error. */
	text-align:left;
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	color:#FF0000;  /* matches CSP's hard-coded red error text */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:normal;
}
.errorText {
/* Sets the properties for error text that is local to the control in error. Generally assigned to a TD. */
/* CSP equivalent: body-error. */
	text-align:left;
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	color:#FF0000;  /* matches CSP's hard-coded red error text */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:normal;
	padding-top:12;
	padding-bottom:2;
}
.errorTextNested {
/* Sets the properties for error text that is local to the control in error. Used specifically for error text that has to be nested in a way that disallows the padding settings of errorText. Generally assigned to a DIV. */
/* CSP equivalent: body-error. */
	text-align:left;
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	color:#FF0000;  /* matches CSP's hard-coded red error text */
	font-size: 80%;	/* NEEDS TO BE 80%, BUT NESTING WITH formText CAUSES A PROBLEM.  */
	font-weight:normal;
	padding-top:2;
	padding-bottom:2;
}


.formText .errorTextNested {
/* Added on 01-12-2006 to properly set the relative font size for error text that displays nested in the formText class, as done on some complex forms.  */
/* Sets the properties for error text that is local to the control in error. Used specifically for error text that has to be nested in a way that disallows the padding settings of errorText. Generally assigned to a DIV. */
/* CSP equivalent: body-error. */
	font-size: 100%;	
	/* NOTE: because errorTextNested displays within the formText class, 100% rather than 80% is used here.  */
	/* All other styles below should match the errorTextNested class. */
	text-align:left;
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	color:#FF0000;  /* matches CSP's hard-coded red error text */
	
	font-weight:normal;
	padding-top:2;
	padding-bottom:2;
}


.errorTextTable {
/* Sets the properties for error text that is local to the control in error. Used specifically for error text that has to be nested in a data table. Generally assigned to a DIV. */
/* CSP equivalent: body-error. */
	text-align:left;
	background-color:#F1E9B1;  /*  Basic Background Color (white) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	color:#FF0000;  /* matches CSP's hard-coded red error text */
	font-size: 100%;	/*  default relative Font Size; replaces x-small.  100% used here rather than 80% because this class inherits from the tableText class. */
	font-weight:normal;
	padding-bottom:4;
}
		/* Alternate color values for errorTextTable */
		.tableTextAlt .errorTextTable {
		/* If the client's branding defines alternate row colors in data tables: (1) the background color of the error text needs to be synced with that of tableTextAlt, and (2) the font color might need to be modified to display well with the background color. */
		/* CSP equivalent: none. */
			background-color:#F1E9B1;
			color:#FF0000;  /* matches CSP's hard-coded red error text */
		}

.messageTextTop {
/* Sets the properties for top-of-the-page message text, such as confirmation text. */
/* CSP equivalent: Currently there is no direct CSP equivalent. */
	text-align:left;
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	color:#CC6600;  /* matches CSP's hard-coded orange message text */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:normal;
}
		/* Nested link properties. */
		/* CSP equivalent: None. */
		.messageTextTop A:link {
			color:#616D14;  /* matches CSP's hard-coded orange message text */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.messageTextTop A:visited {
			color:#616D14;  /* matches CSP's hard-coded orange message text */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.messageTextTop A:hover {
			color:#795707;  /* matches CSP's hard-coded orange message text */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		
/* -------------------------------------------------- */
/* COMMON STUFF: But rarely used */
/* -------------------------------------------------- */

sup {
	/* This HTML tag is used to superscript footnote glyphs (like daggers and double-daggers). No properties other than maybe line-height should be set here because the tag is used in more than one context, such as in the column heading of a data table and in an instructional-text paragraph beneath a data table. Font properties and background color and such is handled through implicit inheritance, and sizing and placement is handled automatically by the browser rendering engine. */
/* CSP equivalent: None. */
 	font-weight:normal;

}
.pageTitleLinks {
/* Currently this class is used exclusively to style the "Print-friendly view" link that shows at the top of select pages. */
/* CSP equivalent: None. */
	text-align:left;
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	color:#000000;	/* Basic Text Color (black) */
	font-family:verdana,arial,helvetica,sans-serif;	/* Small Font Family */
	font-size:65%;	
	/*  default relative Font Size; replaces xx-small  */
	font-weight:normal;
}
		/* Nested link properties. */
		/* CSP equivalent: None. */
		.pageTitleLinks A:link {
			color:#616D14;	/* Basic Link Color (bright blue) */
			font-weight:normal;
				text-decoration:underline;
				font-style : normal;
		}
		.pageTitleLinks A:visited {
			color:#616D14;	/* Basic Link Color - Visited (purple) */
			font-weight:normal;
				text-decoration:underline;
				font-style : normal;
		}
		.pageTitleLinks A:hover {
			color:#795707;	/* Basic Link Color - Hover (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}

.hiddenLabel {
/* While we want all field controls to have labels -- for accessibility reasons -- we have at least one special case where there is no room for a label. (See the account-focus drop-down on the Account Activity page.) The hiddenLabel class lets us establish a label but (almost completely) hide it from sighted viewers. */
/* CSP equivalent: None. */
	/* It is critical that the background color and the text color are the same. */
	background-color:#F1E9B1; /* Basic Background Color (white) */
	color:#FFFFFF; /* Basic Background Color (white) */
	font-size:1px;
	margin:0px;
}


/* -------------------------------------------------- */
/* -------------------------------------------------- */
/* DATA TABLES */
/* -------------------------------------------------- */
/* -------------------------------------------------- */

/* -------------------------------------------------- */
/* DATA TABLES: Column Headings */
/* -------------------------------------------------- */

th {
/* The text-transform property enforces the Metavante site-copy standard for capitalizing multi-word column labels within data tables. This definition was added because we have the case of certain balance labels needing to be used in more than one context with more than one capitalization scheme. These labels are stored in sentence case (e.g., "Available balance") for use as field labels and converted to an initial-cap scheme (e.g., "Available Balance") when used as column headings. This text-transform property is not brandable. */
	text-transform:capitalize;
}

.tableHeadingText {
/* Defines the base properties for the data-table cells that contain the column headings. This class is specifically for columns that hold text data. There are separate classes for columns that hold date or currency data. */
/* CSP equivalent: grid-style-header-text. */
	text-align:left;
	background-color:#616D14;
	color:#FFFFFF;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
 	font-weight:bold;
}
.tableHeadingCurrency {
/* Defines the base properties for the data-table cells that contain the column headings. This class is specifically for columns that hold currency data. There are separate classes for columns that hold text or date data. */
/* CSP equivalent: grid-style-header-currency. */
	text-align:right;
	background-color:#616D14;
	color:#FFFFFF;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-weight:bold;
}
.tableHeadingDate {
/* Defines the base properties for the data-table cells that contain the column headings. This class is specifically for columns that hold date data. There are separate classes for columns that hold text or currency data. */
/* CSP equivalent: grid-style-header-date. */
	text-align:left;
	background-color:#616D14;
	color:#FFFFFF;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-weight:bold;
}

/* For data-table column headings, the following three definitions define the actual color and text decoration of the heading text. The class must be assigned to an A (anchor) tag. */
/* CSP equivalent: Inherited link properties for NEW-grid-header-link. */
.tableHeadingLink:link {
/*	background-color:#616D14;  */
	color:#FFFFFF;
	text-decoration:underline;
}
.tableHeadingLink:visited {
	/*background-color:#616D14; */
	color:#FFFFFF;
	text-decoration:underline;
}
.tableHeadingLink:hover {
	text-decoration:underline;
	/*background-color:#616D14;  */
	color:#FFFFFF;
}

.tableHeadingSortKey {
/* Sets the background color for the data-table column heading that is currently associated with the primary sort key. */
/* CSP equivalent: NEW-sorted-column. */
	background-color:#d1a352;
}
		/* Nested link properties. Note that a link that appears within a column heading will always be tagged with the tableHeadingLink class. */
		/* CSP equivalent: Inherited link properties for NEW-sorted-column. */
		.tableHeadingSortKey .tableHeadingLink:link {
			color:#513003;	/* Basic Text Color (black); NOT Basic Link Color (bright blue) */
			text-decoration:underline;
		}
		.tableHeadingSortKey .tableHeadingLink:visited {
			color:#513003;	/* Basic Text Color (black); NOT Basic Link Color - Visited (purple) */
			text-decoration:underline;
		}
		.tableHeadingSortKey .tableHeadingLink:hover {
			color:#513003;	/* Basic Text Color (black); NOT Basic Link Color - Hover (bright blue) */
			text-decoration:underline;
		}

/* -------------------------------------------------- */
/* DATA TABLES: Data Cells */
/* -------------------------------------------------- */

.tableText {
/* Styles the data-table cells that contain text data. This class is specific to the first true data row in a data table, and then every other data row. */
/* CSP equivalent: grid-style-text. */
	text-align:left;
	background-color:#CFA43F  ;
	color:#000000;	/* Basic Text Color (black) */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
}
		/* Nested link properties. */
		/* CSP equivalent: Inherited link properties for grid-style-text. */
		.tableText A:link {
			color:#616D14;
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.tableText A:visited {
			color:#616D14;
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.tableText A:hover {
			color:#795707;
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}

.tableTextAlt {
/* Styles the data-table cells that contain text data. This class is specific to the second true data row in a data table, and then every other data row. */
/* CSP equivalent: grid-style-text-alt. */
	text-align:left;
	background-color:#F1E9B1;
	color:#000000;	/* Basic Text Color (black) */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
}
		/* Nested link properties. */
		/* CSP equivalent: Inherited link properties for grid-style-text-alt. */
		.tableTextAlt A:link {
			color:#616D14;
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.tableTextAlt A:visited {
			color:#616D14;
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.tableTextAlt A:hover {
			color:#795707;
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}

.tableCurrency {
/* Styles the data-table cells that contain currency data. This class is specific to the first true data row in a data table, and then every other data row. */
/* CSP equivalent: grid-style-currency. */
	text-align:right;
	background-color:#CFA43F  ;
	color:#000000;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	text-decoration:none;
}
.tableCurrencyAlt {
/* Styles the data-table cells that contain currency data. This class is specific to the second true data row in a data table, and then every other data row. */
/* CSP equivalent: grid-style-currency-alt. */
	text-align:right;
	background-color:#F1E9B1;
	color:#000000;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	text-decoration:none;
}
.tableDate {
/* Styles the data-table cells that contain date data. This class is specific to the first true data row in a data table, and then every other data row. */
/* CSP equivalent: grid-style-date. */
	text-align:left;
	background-color:#CFA43F  ;
	color:#000000;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	text-decoration:none;
}
.tableDateAlt {
/* Styles the data-table cells that contain date data. This class is specific to the second true data row in a data table, and then every other data row. */
/* CSP equivalent: grid-style-date-alt. */
	text-align:left;
	background-color:#F1E9B1;
	color:#000000;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	text-decoration:none;
}

.tableDataStrong {
/* Used when one or more data cells in a table require bolding or some other style change.  Currently set up to cascade on the
 the existing tableText, tableCurrency, and tableDate classes.  For instance, the style call would read as class="tableText tableDataStrong" */
	font-weight: bold;
}


.tableNoteBlock {
/* A data table sometimes embeds a second line of data within a data cell. By wrapping that extra data in a DIV, and applying this style to the DIV, we fine tune the spacing above and below the second line of data. */
/* CSP equivalent: None. The spacing between a first and second line of data in a data cell is not controlled. */
 	margin-top:5px;
	margin-bottom:0px;
}
.tableNote {
/* Sets select properties for a second line of data within a data-table cell. Applied to a SPAN tag, nested within a tableNoteBlock DIV. Alignment should be inherited from the TD in which the note appears. */
/* This class is specific to the first true data row in a data table (after the header row), and then every other data row. */
/* CSP equivalent: There is a grid-font-note class, but evidence of its use has not yet been found. Instead, use of NEW-grid-font-note-strong is widespread, and occassionally grid-style-text is used. */
	font-family:verdana,arial,helvetica,sans-serif;	/* Small Font Family */
	font-size:80%;	/*  default relative Font Size; replaces xx-small, but 80% due to inheritance.  */
	color:#000000;	/* Basic Text Color (black) */
	font-weight:normal;
	/* NOT align */
 }
 .tableNoteStrong {
 /* Can be used to highlight a second line of data. For example, a "Not yet cleared" line might require more visual attention than a category line. Should be applied to a SPAN tag nested within a tableNote SPAN. It is possible to apply more than a font-weight specification. (Note that at small font sizes, a bold distinction is not discernable.) */
/* This class is specific to the first true data row in a data table (after the header row), and then every other data row. */
/* CSP equivalent: NEW-grid-font-note-strong is equivalent to the combined effect of tableNote and tableNoteStrong. */
 	font-weight:bold;
 }
.tableNoteAlt {
/* See the description for tableNote. The tableNoteAlt class is specific to the second true data row in a data table, and then every other data row. */
/* CSP equivalent: None. For a class like NEW-grid-font-note-strong, CSP does not allow differentiation across alternating row colors. */
	font-family:verdana,arial,helvetica,sans-serif;	/* Small Font Family */
	font-size:80%;	/*  default relative Font Size; replaces xx-small, but 80% due to inheritance.  */
	color:#000000;	/* Basic Text Color (black) */
	font-weight:normal;
	/* NOT align */
 }
 .tableNoteStrongAlt {
 /* See the description for tableNote. The tableNoteAlt class is specific to the second true data row in a data table, and then every other data row. */
/* CSP equivalent: None. For a class like NEW-grid-font-note-strong, CSP does not allow differentiation across alternating row colors. */
 	font-weight:bold;
 }
 .tableNoteLinks {
/* Styles the payment links that appear in the Accounts Overview tables. */
	color:#000000;	/* Basic Text Color (black) */
	font-family:verdana,arial,helvetica,sans-serif;	/* Small Font Family */
	font-size:80%;	/*  default relative Font Size; replaces xx-small, but 80% due to inheritance.  */
	font-weight:normal;
}
		/* Nested link properties. */
		.tableNoteLinks A:link {
			color:#616D14;
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.tableNoteLinks A:visited {
			color:#616D14;
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.tableNoteLinks A:hover {
			color:#795707;
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
	
.tableNoteLinksAlt {
/* Styles the payment links that appear in the Accounts Overview tables. */
	color:#000000;	/* Basic Text Color (black) */
	font-family:verdana,arial,helvetica,sans-serif;	/* Small Font Family */
	font-size:80%;	/*  default relative Font Size; replaces xx-small, but 80% due to inheritance.  */
	font-weight:normal;
	}
		/* Nested link properties. */
		.tableNoteLinksAlt A:link {
			color:#616D14;
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.tableNoteLinksAlt A:visited {
			color:#616D14;
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.tableNoteLinksAlt A:hover {
			color:#795707;
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
 
 .tableButtonRowText {
/* Used within data tables that require form-terminating buttons and/or links. */
/* See also the FORMS section of this stylesheet for the definition of:
		.tableButtonRowText .formButton
	This definition has to be defined later in the stylesheet, after formButton is defined. */
/* CSP equivalent: NEW-grid-button-row. */
	background:#FFFFFF;  /* default white background */
	color:#000000;	/* Basic Text Color (black) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	text-align:left;  /* default left alignment */
}
		/* Nested link properties. */
		/* CSP equivalent: Inherited link properties for NEW-grid-button-row. */
		.tableButtonRowText A:link {
			color:#616D14;	/* Basic Link Color (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.tableButtonRowText A:visited {
			color:#616D14;	/* Basic Link Color - Visited (purple) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.tableButtonRowText A:hover {
			color:#795707;	/* Basic Link Color - Hover (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}

.tableTotal {
/* Styles the total row in a data table. Currently made to resemble CSP. */
/* CSP equivalent: TBD. */
	background-color:#FFFFFF;	/* Basic Background Color (white) */
	color:#000000;	/* Basic Text Color (black) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:bold;
	/* text-align likely will need to be removed -- temp for now. */
	text-align:right;    
}

.tableGroupOne {
/* Styles the heading row of a super-category group in a data table. Currently used only in a user report. */
/* CSP equivalent: None. */
	background-color:#616D14;
	color:#FFFFFF;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
 	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */ 
 	text-decoration:none;
 	font-weight:bold;
	padding-top:25px;
}
.tableGroupTwo {
/* Styles the heading row of a category group in a data table. Currently used only in a user report. */
/* CSP equivalent: None. */
	background-color:#616D14;
	color:#FFFFFF;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
 	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */ 
 	text-decoration:none;
 	font-weight:bold;
}
.tableGroupTwoNested {
/* Currently identical to tableGroupTwo. Could allow for spacing adjustments. (Also, a stronger distinction is needed for the print-friendly versions of these classes.) */
/* CSP equivalent: None. */
	background-color:#F6F6F6;
	color:#000000;	/* Basic Text Color (black) */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
 	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */ 
 	text-decoration:none;
 	font-weight:bold;
}
.tableGroupOneTotal {
/* Styles the total row of a super-category group in a data table. Currently used only in a user report. */
/* CSP equivalent: None. */
	background-color:#FFFFFF;
	color:#000000;	/* Basic Text Color (black) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:bold;
	text-align:right;    
}
.tableGroupTwoTotal {
/* Styles the total row of a category group in a data table. Currently used only in a user report. */
/* CSP equivalent: None. */
	background-color:#FFFFFF;
	color:#000000;	/* Basic Text Color (black) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:bold;
	text-align:right;    
}
.tableDataIndent {
/* Supplements the style of a data-table cell. Currently used only in a user report. */
/* CSP equivalent: None. */
	padding-left:31px;
}


/* -------------------------------------------------- */
/* -------------------------------------------------- */
/* FORMS */
/* -------------------------------------------------- */
/* -------------------------------------------------- */

/* -------------------------------------------------- */
/* FORMS: Label-Control Pairs and Label-Data Pairs */
/* -------------------------------------------------- */

.formLabel {
/* Styles the labels associated with text-entry fields and select (drop-down) lists. This class is also used for the labels that appear on preview and confirmation/receipt pages. */
/* CSP equivalent: Serves the purpose of form-style-label and form-style-label-req, because CeB will not distinguish required fields typographically. (Instead, optional fields have "(optional)" added to the text of their labels.) */
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	color:#000000;	/* Basic Text Color (black) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	text-align:left;
	text-decoration: none;
}
.formLabelStrong {
/* ADDDED 8/1/05 DURING CATEGORY MANAGEMENT.  /*
/* Styles the labels above columns of form controls. */
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	color:#000000;	/* Basic Text Color (black) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:bold;
}

.formData {
/* Styles the data that appears on preview pages and confirmation/receipt pages. This style should not be applied to instructional text. The intent of this class is to eventually allow data to have a unique look. */
/* CSP equivalent: Equates roughly to form-style-text, although CSP currently uses form-style-text for a variety of form elements. */
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	color:#000000;	/* Basic Text Color (black) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:normal;
}
.formDataStrong {
/* Allows a span of data to be highlighted, such as a confirmation number. The default highlighting will be a bold treatment, although a color change or background change is possible. Should be applied to a SPAN, not a TD. Does not explicitly accommodate embedded links. */
/* CSP equivalent: Roughly equivalent to form-style-text-strong, although that class is meant more as a TD-level class. */
	font-weight:bold;
}
.formText {
/* Styles select text that appears within a form, including the text associated with a radio button or a checkbox, and the text that might precede a field, such as a dollar sign. This style is separate from pageText to better coordinate with CSP. */
/* CSP equivalent: Equates roughly to form-style-text, although CSP currently uses form-style-text for a variety of form elements. */
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	color:#000000;	/* Basic Text Color (black) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:normal;
}
		/* Nested link properties. */
		/* CSP equivalent: Inherited link properties for form-style-text. */
		.formText A:link {
			color:#616D14;	/* Basic Link Color (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.formText A:visited {
			color:#616D14;	/* Basic Link Color - Visited (purple) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.formText A:hover {
			color:#795707;	/* Basic Link Color - Hover (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}

.formTextStrong {
/* Allows a span of text within a form to be highlighted. This class, which is used rarely, can be applied to the text label of checkboxes or radio buttons to give the effect of an embedded subheading. This class is not intended to be used on field labels. The default highlighting will be a bold treatment. Although a color change or background change is possible, such an effect cannot currently be mimicked within CSP pages. Should be applied to a SPAN, not a TD. Does not explicitly accomodate embedded links. */
/* CSP equivalent: None. Form text is usually bolded directly through a STRONG tag. */
	font-weight:bold;
}		
.formTextBlock {
/* A form sometimes embedds a sentence or paragraph of text under a form control to provide explanation. That text should always be placed in a separate row beneath the corresponding control, but even then, the text needs to be wrapped in a DIV. That DIV uses formTextBlock to establish the desired vertical spacing for positioning the text between the control above it and any controls below it. */
/* CSP equivalent: None. CSP sometimes uses an embedded layout table and spacer rows (tagged with the form-misc-spacer class). */
 	margin-top:0px;
	margin-bottom:5px;
}
.formCellIndent {
/* In a complex form, the designer will occassionally want to indent a section of the form without incurring the overhead of a more complex TABLE structure. This class does the trick on the cheap. Generally applied at the TD level and often doubled-up with another style class applied to the same TD. For an example use, see the form page for recurring credit card payments. */
/* There is no need to offer this style as brandable. It is a style class, versus being hardcoded, simply so we can ensure consistent use. */
/* CSP equivalent: None. */
	padding-left:20px;
}

/* -------------------------------------------------- */
/* FORMS: Miscellaneous */
/* -------------------------------------------------- */

.formRule {
/* Styles the horizontal rules, or lines, that mark the beginning and end of the form on a page, or separates the sections of longer forms. */
/* CSP equivalent: form-misc-rule. Note that the CSP style is not an exact equivalent. Branding changes should be limited to the rule color until CSP is able to remove the noshade and size properties from the HTML declaration of HR tags. By removing those properties -- and using the new style definition below -- HRs can be consistently styled (and seen) across all browser types. */
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	/* The height setting adjusts the size of the HR. This size must match the pixel size of the border-bottom style below. Due to browser compatibility, clients should not change the height and pixel size for this style. */
	height:1px;  
	/* The border setting clears all borders so that one border style consistently styles the HR tag. */
	border:0px;  
	border-bottom:solid 1px #C1C1C1;
}
.formSectionHeading {
/* Styles the subheadings that are sometimes used in multi-section forms. */
/* CSP equivalent: form-style-subheader. */
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	color:#672200;	/* Heading Text Color (dark blue) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:bold;
	text-decoration:none;
}
.formButtonSection {
/* Styles the data-table cells that hold a form's row of buttons. This class is unusual in that it is applied to two nesting TDs (within every button row) to ensure proper display of the background color. */
/* CSP equivalent: form-misc-buttonAlign. */
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	text-align:left;
}
.formButton {
/* Defines the various properties of form buttons. Note that by default, no properties are defined, allowing the browser and platform to determine the default look. The commented-out properties below appear simply to indicate the properties that can be applied. */
/* CSP equivalent: NEW-formbutton. */
	/* background-color:#ADAECE; */
	/* color:#000000; */
	/* font-weight:normal; */
	/* border-bottom:thin solid #6B6D7B; */
	/* border-right:thin solid #6B6D7B; */
	/* border-top:thin solid #EFEBEF; */
	/* border-left:thin solid #EFEBEF; */
	font-size: 80%;
}
.tableButtonRowText .formButton {
/* Lets buttons have different properties when located within a data-table's button row. */
/* This definition needs to be placed in the stylesheet below the definitions for tableButtonRowText and formButton. */
/* CSP equivalent: NEW-formbutton nested within NEW-grid-button-row. */
}
.lowProfileButton {
/* By pairing this class with the formButton class, a button can be given a slightly smaller size (overall, but mostly in height). This is useful for buttons that are placed directly alongside a data-entry field or a drop-down list control. (Internet Explorer's default display of a button is a bit too big and looks awkward when placed adjacent to these other controls.) */
/* CSP equivalent: None. */
	font-size: 85%;
}
input,select,textarea {
/* These specifications are needed to ensure that font preferences are carried to the form controls that accept and display text. Note: (1) Even if a relative font size is used, IE will not perform user-initiated size changes. (2) Other properties such as text color or background color should not be specified. Such values will carry somewhat unpredictably to certain button controls. */
/* CSP equivalent: Not explicitly defined yet. Will likely sync with CSP's font family and size properties as defined by CSP's form-style-text class. */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size:100%;	
	
	/*  default relative Font Size; replaces xx-small. NOTE: 1-11-06: FIREFOX SHOWS THIS AS TOO SMALL */
	/*  100% rather than 80% displays the appropriate size even though x-small was previously used. */
		/* NOTE: font was origionally set to x-small --> 100%, but inheritance requires 80% to be used. */

	/* NOT color */
	/* NOT background-color */
}
.formSpacer {
/* Rarely used. Applied at the TD level in a form page to provide a little more vertical white space between groups of controls. See the Transaction Detail page for an example.  */
/* CSP equivalent: form-misc-spacer. */
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	/* height is not offered for branding. */
	height:11px;
	/* font-size is not offered for branding. */
	font-size:2px;
}


/* -------------------------------------------------- */
/* -------------------------------------------------- */
/* PAGE-SPECIFIC STYLES */
/* -------------------------------------------------- */
/* -------------------------------------------------- */

/* -------------------------------------------------- */
/* PAGE-SPECIFIC STYLES: Login */
/* -------------------------------------------------- */

.disclaimerTextBlock {
/* Description TBD. */
	margin-top:25px;
	margin-bottom:0px;
	background-color:#F1E9B1;	/* Basic Background Color (white) */
}
.loginTextBlock {
/* Description TBD. */
	
	font-family:arial,helvetica,sans-serif;
	margin-top:0px;
	margin-bottom:0px;
	font-family:verdana,arial,helvetica,sans-serif;	/* Small Font Family */
	background-color:#F1E9B1;	/* Basic Background Color (white) */
}
#forgotYourPasswordLink {
/* Allows special definition of the "Forgot your password?" link on the Login page. Note that by default, no properties are defined, and this link appears like any other link within instructional text. The commented-out properties below appear simply to indicate some of the properties that can be applied. */
/* CSP equivalent: none. */
	/* color:red; */
	/* font-weight:bold; */
	/* text-decoration:underline; */
}
.loginGutters {
/* Unlike other pages, the Login page always gets equal left and right gutters. */
/* CSP equivalent: None. */
	width:25px;
}

/* -------------------------------------------------- */
/* PAGE-SPECIFIC STYLES: Accounts Overview */
/* -------------------------------------------------- */

.accountOverviewGutters {
/* Unlike other pages, the Accounts Overview page has reduced left and right gutters. */
/* CSP equivalent: None. */
	width:15px;
}

.tableTopAction {
/* assigned to the div that displays one or more links directly above a data table. For instance, the Customize your accounts link
on the Accounts Overview page. */
		text-align: right;
		margin-bottom: 0px;
		margin-top: 0px;
		font-family:arial,helvetica,sans-serif;
		font-size: 80%;	/*  default relative Font Size; replaces x-small  */
}

		.tableTopAction A:link {
			color:#616D14;	/* Basic Link Color (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
}

		.tableTopAction A:visited {
			color:#616D14;	/* Basic Link Color - Visited (purple) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.tableTopAction A:hover {
			color:#795707;	/* Basic Link Color - Hover (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}

.fpsMessageBlock {
/* Surrounds the default styled Forgotten Password reminder text at top of Accounts Overview page. */
	margin-top:5px;
	margin-bottom:15px;
	padding-left:6px;
	padding-right:6px;
	border-top:1px dashed #E5E5E5;
	border-bottom:1px dashed #E5E5E5;
	text-align:left;
	/* The default background color might be changed to #EAF1F7 (light blue). */
	background-color:#F1E9B1;	/* Basic Background Color (white) */
}
		/* nested styles within the fpsMessageBlock  */
		.fpsMessageBlock h3 {
			margin-top:4px;
			text-align:left;
			/* The default background color might be changed to #EAF1F7 (light blue). */
			background-color:#F1E9B1;	/* Basic Background Color (white) */
			color:#672200;	/* Heading Text Color (dark blue) */
			font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
			font-size: 80%;	/*  default relative Font Size; replaces x-small  */
			font-weight:bold;
			text-decoration:none;
			margin-bottom:0px
		}
		.fpsMessageBlock p {
			text-align:left;
			/* The default background color might be changed to #EAF1F7 (light blue). */
			background-color:#F1E9B1;	/* Basic Background Color (white) */
			color:#000000;	/* Basic Text Color (black) */
			font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
			font-size: 80%;	/*  default relative Font Size; replaces x-small  */
			font-weight:normal;
			margin-top:4px;
			margin-bottom:8px
		}
		.fpsMessageBlock A:link {
			color:#616D14;	/* Basic Link Color (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
			
		}
		.fpsMessageBlock A:visited {
			color:#616D14;	/* Basic Link Color - Visited (purple) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.fpsMessageBlock A:hover {
			color:#795707;	/* Basic Link Color - Hover (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}		
		
.rightSidePanel {	
	padding-top:15px;
	margin-right:15px;
	background-color:#F1E9B1;	/* Basic Background Color (white) */
	padding-bottom:4px;
	/*  height is not offered for branding; this may be needed if offering background color for rignt panel as branding */
	/*  height: 450px; */
}
.statusBox {
/* Sets the border color and spacing above and below the status panel. */
	border:1px solid #e3cc8b;
	margin-bottom:15px;
}
.statusBoxBackground {
	background-color:#f8f4d8;
}
.statusBoxText {
	text-align:left;
	color:#000000;	/* Basic Text Color (black) */
	font-family:verdana,arial,helvetica,sans-serif;	/* Small Font Family */
	font-size:65%;	/*  default relative Font Size; replaces xx-small  */
}
		/* Nested link properties. */
		.statusBoxText A:link {
			color:#616d14;
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.statusBoxText A:visited {
			color:#616d14;  
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.statusBoxText A:hover {
			color:#95a244; 
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		
.statusBoxTitle
		{
		/* sets the style for the title in the Status Box.  */
		text-align:left;
	 	color: navy;
		font-size:65%;	/*  default relative Font Size; replaces xx-small  */
		font-family:verdana,arial,helvetica,sans-serif;	/* Small Font Family */
		font-weight: bold;
		}

.adBox {
	background-color:#F1E9B1;	/* Basic Background Color (white) */
	/* 	border:1px solid #A1BCD2; */
	margin-bottom:15px;
}
.educationBox {
/* Sets the border, background color, and spacing on the outside of the education text section. */
	background-color:#FFFFFF;	/* Basic Background Color (white) */
	border:1px solid #A1BCD2;
	margin-bottom:15px;
}

.educationBoxText
	{
	/* */
	background-color:#FFFFFF;
	}
		
	/* nested styles for the educationBoxText  */
			.educationBoxText h3
				 {
				 /* */
				 	margin-top: 3px; 
					margin-bottom: 2px;
					font-family:verdana,arial,helvetica,sans-serif;	/* Small Font Family */
					font-size:65%;	/*  default relative Font Size; replaces xx-small  */
					font-weight:bold;
					color:#000000;  /* default black text */
				}

			.educationBoxText P
			 {
				font-family:verdana,arial,helvetica,sans-serif;	/* Small Font Family */
				font-size:65%;	/*  default relative Font Size; replaces xx-small  */
				color:#000000;  /* default black text */
				font-weight:normal;
				margin:0px;
				padding-bottom: 5px;
				
			}
			.educationBoxText A:link 
				{
				color:#0000DE;  /* default blue link */
				text-decoration:underline;
				}
			
			 .educationBoxText A:visited 
			 	{
					color:#663399;  /* default purple visited link */
					text-decoration:underline;
				}
			.educationBoxText A:hover
				 {
					color:#0000DE;  /* default blue hover link */
					text-decoration:underline;
				}
		/* end of educationBoxText styles */			

.greetingText {
/* Styles the last login date and greeting text that displays under the Accounts Overview page title. Default displays non-bold text. */
	font-family:verdana,arial,helvetica,sans-serif;	/* Small Font Family */
	font-size:65%;	/*  default relative Font Size; replaces xx-small  */
	font-weight:normal;
}
.dataTableStackSpace {
/* Sets the vertical spacing between the multiple tables on the Accounts Overview page. Not currently offered for branding. */
	height:15px;
}

.accountDisclaimerText {
/* Contains any client-specified legal disclaimer text at bottom of the Accounts Overview page. Enables clients to display a border, if desired. Text is styled through the <p>, <a>, and <h3> nested styles below. */
	margin-top:20px;
	margin-bottom:10px;
	padding:5px;
	border-top:1px dashed #A1BCD2;
	border-bottom:1px dashed #A1BCD2;
	background-color:#F1E9B1;	/* Basic Background Color (white) */
}
		/* Nested styles within accountDisclaimerText. */
		.accountDisclaimerText h3 {
			margin-top:4px;
			text-align:left;
			/* The default background color might be changed to #EAF1F7 (light blue). */
			background-color:#F1E9B1;	/* Basic Background Color (white) */
			color:#3162A6;	/* Heading Text Color (dark blue) */
			font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
			font-size: 80%;	/*  default relative Font Size; replaces x-small  */
			font-weight:bold;
			text-decoration:none;
			margin-bottom:0px;
		}
		.accountDisclaimerText p {
			text-align:left;
			/* The default background color might be changed to #EAF1F7 (light blue). */
			background-color:#F1E9B1;	/* Basic Background Color (white) */
			color:#000000;	/* Basic Text Color (black) */
			font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
			font-size: 80%;	/*  default relative Font Size; replaces x-small  */
			font-weight:normal;
			margin-top:4px;
			margin-bottom:8px
		}
		.accountDisclaimerText A:link {
				color:#616D14;	/* Basic Link Color (bright blue) */
				text-decoration:underline;
				font-style : normal;
				font-weight:normal;
		}
		.accountDisclaimerText A:visited {
				color:#616D14;	/* Basic Link Color - Visited (purple) */
				text-decoration:underline;
				font-style : normal;
				font-weight:normal;
		}
		.accountDisclaimerText A:hover {
				color:#795707;	/* Basic Link Color - Hover (bright blue) */
				font-weight:normal;
				text-decoration:underline;
				font-style : normal;
				
		}

/* -------------------------------------------------- */
/* PAGE-SPECIFIC STYLES: Customer Service Index */
/* -------------------------------------------------- */

.indexList {
/* Applied to the UL tag of a link list. */
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	margin-top:5px;
	margin-bottom:5px;
	margin-left:0px;
	padding-left:0px;
}
.indexListItem {
/* Applied to the LI tag in a link list. */
/* CSP equivalent: No direct equivalent. CSP used a table structure and their body-instruction tag for similar content on their Main Menu page. However, no CeB client will make use of that Main Menu page. */
/* This style class is used on the index pages for both Customer Service and Open an Account pages. */	
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	color:#000000;	/* Basic Text Color (black) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 100%;	/*  default relative Font Size; replaces x-small.  100% used in place of 80% because of inheritance from formText class.  */
	font-weight:normal;
	list-style-type:none;
	padding-top:4px;
}
		/* Nested link properties. */
		/* CSP equivalent: No direct equivalent. See comment on indexListItem. */
		.indexListItem A:link {
			color:#616D14;	/* Basic Link Color (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.indexListItem A:visited {
			color:#616D14;	/* Basic Link Color - Visited (purple) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.indexListItem A:hover {
			color:#795707;	/* Basic Link Color - Hover (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
.indexListItemStrong {
/* Allows a span of text within a link list to be highlighted. This class is currently not used in the standard product; it's presence here is anticipatory. The default highlighting will be a bold treatment. A color change or background change is possible. Should be applied to a SPAN, not an LI. Does not explicitly accomodate embedded links, but is instead intented to be used with site copy that complements a link-list item. */
/* CSP equivalent: None. */
	font-weight:bold;
	color:#CC6600;  /* matches CSP's hard-coded orange message text */
}		
.indexListItemBlock {
/* While this style is not currently used in the standard product, it is anticipated that we might want to include a full sentence of text that is associated with a link-list item, but nicely positioned below that item. Such a sentence would be placed in a DIV styled with this style (indexListItemBlock). */
/* CSP equivalent: None. */
 	margin-top:2px;
	margin-bottom:3px;
	background-color:#F1E9B1;	/* Basic Background Color (white) */
}

/* The following two styles were used in an early mockup of the Customer Service Index page. Consider these tags deprecated. They will be removed from the final stylesheet. */
/* .customerServiceListItems {
	padding-top:3px;
	padding-bottom:3px;
} */
/* .customerServicePageText {
	text-align:left;
	background-color:#FFFFFF;
	color:#000000;
	font-family:arial,helvetica,sans-serif;
	font-size:x-small;
	font-weight:normal;
} */



/* -------------------------------------------------- */
/* PAGE-SPECIFIC STYLES: Contact Us */
/* -------------------------------------------------- */

.messageArea {
/* sets the width of the message textarea control to keep it from shrinking in Mozilla browsers. */
/* not open for branding. */
	width: 475px;
}


/* -------------------------------------------------- */
/* PAGE-SPECIFIC STYLES: FPS */
/* -------------------------------------------------- */

.fpsImageRow
/* Used to control the placement, padding, and background color for the optional graphic on the FPS pages.  Applied to a div. */
{
	background-color:#F1E9B1;  /* Basic Background Color (white).*/
	text-align: center;
	padding-top:10px; 
	padding-bottom:10px; 
}



/* ------------------------------------------ */
/* ------------------------------------------ */
/* STANDARD HTML TAGS FOR BLOCKS OF FULLY-    */
/* CUSTOMIZABLE HTML                          */
/* ------------------------------------------ */
/* ------------------------------------------ */
/* Thes tags are to be used exclusively within sections of a page that can be fully customized by clients. While clients do not have to use these tags, the default content for fully customized sections will. */
/* CSP or CeB Classic equivalent: None. Use of standard HTML tags is a new approach, being tried as an improvement and in anticipation of Next Gen's use of more blocks of fully-customizable HTML (e.g., for new marketing pages). */

h3 {
	text-align:left;
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	color:#672200;	/* Heading Text Color (dark blue) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:bold;
	text-decoration:none;
	margin-top:16px;
	margin-bottom:0px
}
p {
	text-align:left;
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	color:#000000;	/* Basic Text Color (black) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:normal;
	margin-top:4px;
	margin-bottom:8px
}
		/* Nested link properties. */
		p A:link {
	color:#616D14;
	/* Basic Link Color (bright blue) */
			text-decoration:underline;
			font-style : normal;
			font-weight:normal;
}
		p A:visited {
			color:#616D14;	/* Basic Link Color - Visited (purple) */
			text-decoration:underline;
			font-style : normal;
			font-weight:normal;
		}
		p A:hover {
			color:#795707;	/* Basic Link Color - Hover (bright blue) */
			text-decoration:underline;
			font-style : normal;
			font-weight:normal;
		}

.firstHeadingInSection {
/* Used within blocks of fully-customizable HTML. Can be applied to the first heading in a layout column so that this instance of the heading can be aligned with the top of the layout column. */
	margin-top:0px;
	margin-bottom:0px
}
.disclaimerText {
	text-align:left;
	background-color:#F1E9B1;  /* Basic Background Color (white) */
	color:#000000;	/* Basic Text Color (black) */
	font-family:verdana,arial,helvetica,sans-serif;	/* Small Font Family */
	font-size:65%;	/*  default relative Font Size; replaces xx-small  */
	font-weight:normal;
}
		/* Nested link properties. */
		.disclaimerText A:link {
				color:#616D14;	/* Basic Link Color (bright blue) */
				font-weight:normal;
				text-decoration:underline;
				font-style : normal;
		}
		.disclaimerText A:visited {
				color:#616D14;	/* Basic Link Color - Visited (purple) */
				font-weight:normal;
				text-decoration:underline;
				font-style : normal;
		}
		.disclaimerText A:hover {
				color:#795707;	/* Basic Link Color - Hover (bright blue) */
				font-weight:normal;
				text-decoration:underline;
				font-style : normal;
		}

/* If STRONG tags or EM tags are used within fully customizable text blocks, the browser should be allowed to render these tags as it sees fit. That is, properties for these tags should not be explicitly defined within the stylesheet. */

/* Inline styles can be used within fully customizable text blocks, however it should be remembered that different browsers vary in their interpretation of relative font keywords. If new styles classes are created for clients, remember that they may need to be defined within multiple browser-specific stylesheets. */

/* In addition to the definitions and styles listed in this section of the stylesheet, customizable text blocks can take advantage of other CeB styles that might prove useful, such as noBreakSpan (e.g., for keeping a phone number from breaking across lines). */


/* ------------------------------------------ */
/* ------------------------------------------ */
/* PRINT-FRIENDLY STYLES    */
/* ------------------------------------------ */
/* ------------------------------------------ */
/* These tags are to be used exclusively for print-friendly pages, such as the print-friendly version of the Account Activity page. These styles are NOT standard brandable, which means the color and font properties specified here will be the same for all clients. Those default colors (black, white, and gray) and fonts have been selected to print cleanly for all users without requiring special printer settings. While platinum branding options are being considered, the practical range of customization is limited due to the constraints of printing (especially the constraint that both Internet Explorer and Netscape do not print background colors by default, which makes things like alternating row colors impractical and even detrimental). */
	
.pfBody {
/* Needed to override any non-white background color that might be set through the stylesheet's definition for the BODY tag. */
	background-color:#F1E9B1;
}
.pfPageTitleBlock {
/* Print-friendly equivalent of pageTitleBlock. */
	margin-top:10px;
	margin-bottom:10px;
}
.pfPageTitle {
/* Print-friendly equivalent of pageTitle. */
	text-align:left;
	background-color:#F1E9B1;
	font-family:arial,helvetica,sans-serif;
	color:#672200;
	font-size:medium;
	font-weight:bold;
}
.pfPageTitleLinks {
/* Print-friendly equivalent of pageTitleLinks. */
	text-align:left;
	background-color:#F1E9B1;
	color:#000000;
	font-family:arial,helvetica,sans-serif;
	font-size:65%;	/*  default relative Font Size; replaces xx-small  */
	font-weight:normal;
}
		/* Nested link properties. */
		/* The appearance of the "Print window" and "Close window" links are determined by the browser. That way, they'll get some color and be more noticeable, which is good. */
		.pfPageTitleLinks A:link {}
		.pfPageTitleLinks A:visited {}
		.pfPageTitleLinks A:hover {}
			
@media print {
	/* Hides the "Print window" and "Close window" links when the page is actually printed. */
    .pfPageTitleLinks {visibility:hidden;}
}
.pfMessageBlock {	
/* Print-friendly equivalent of messageBlock. */
/* This class will likely be eliminated because the print-friendly page will not likely have to handle error conditions. */
	margin-top:0px;
	margin-bottom:0px;
}
.pfErrorTextTop {
/* Print-friendly equivalent of errorTextTop. */
/* This class will likely be eliminated because the print-friendly page will not likely have to handle error conditions. */
	text-align:left;
	background-color:#F1E9B1;
	font-family:arial,helvetica,sans-serif;
	color:#000000;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:normal;
}
.pfMainContentBlock {
/* Print-friendly equivalent of mainContentBlock. */
	margin-top:0px;
	margin-bottom:0px;
}
.pfDataTable {
/* Defines a simple cross-browser look for outlining the cells of the data table. */
	border:1px solid gray;
	border-collapse:collapse;
}
.pfPageSubTitle {
/* Print-friendly equivalent of pageSubTitle. */
	text-align:left;
	background-color:#F1E9B1;
	color:#000000;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-family:arial,helvetica,sans-serif;
	text-decoration:none;
	font-weight:bold;
}
.pfInstructionalText {
/* Print-friendly equivalent of instructionalText. */
	text-align:left;
	background-color:#F1E9B1;
	font-family:arial,helvetica,sans-serif;
	color:#000000;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:normal;
}
.pfDataTableBlock {
/* Print-friendly equivalent of dataTaleBlock. */
	margin-top:15px;
	margin-bottom:15px;
}
.pfTableHeadingText {
/* Print-friendly equivalent of tableHeadingText. */
	border:1px solid gray;
	background-color:#616D14;
	color:#FFFFFF;
	font-family:arial,helvetica,sans-serif;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:normal;
	font-style:italic;
	text-align:left;
}
.pfTableHeadingCurrency {
/* Print-friendly equivalent of tableHeadingCurrency. */
	border:1px solid gray;
	background-color:#616D14;
	color:#FFFFFF;
	font-family:arial,helvetica,sans-serif;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:normal;
	font-style:italic;
	text-align:right;
}
.pfTableHeadingDate {
/* Print-friendly equivalent of tableHeadingDate. */
	border:1px solid gray;
	background-color:#616D14;
	color:#FFFFFF;
	font-family:arial,helvetica,sans-serif;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:normal;
	font-style:italic;
	text-align:left;
}

.pfTableText {
/* Print-friendly equivalent of tableText. */
	border:1px solid gray;
	background-color:#CFA43F  ;
	color:#FFFFFF;
	font-family:arial,helvetica,sans-serif;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	text-align:left;
}
.pfTableCurrency {
/* Print-friendly equivalent of tableCurrency. */
	border:1px solid gray;
	background-color:#CFA43F  ;
	color:#FFFFFF;
	font-family:arial,helvetica,sans-serif;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	text-align:right;
}
.pfTableDate {
/* Print-friendly equivalent of tableDate. */
	border:1px solid gray;
	background-color:#CFA43F  ;
	color:#FFFFFF;
	font-family:arial,helvetica,sans-serif;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	text-align:left;
}
.pfTableNoteBlock {
/* Print-friendly equivalent of tableNoteBlock. */
		margin-top:5px;
	margin-bottom:0px;
}
.pfTableNote {
/* Print-friendly equivalent of tableNote. */
	color:#000000;
	font-family:arial,helvetica,sans-serif;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:normal;
	}
.pfTableNoteStrong {
/* Print-friendly equivalent of tableNoteStrong. */
	font-weight:bold;
}

.pfTableGroupOne {
/* Print-friendly equivalent of tableGroupOne. */
	border:1px solid gray;
	background-color:#F1E9B1;
	color:#000000;
	font-family:arial,helvetica,sans-serif;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	text-align:left;
 	font-weight:bold;
	padding-top:25px;
}
.pfTableGroupTwo {
/* Print-friendly equivalent of tableGroupTwo. */
	border:1px solid gray;
	background-color:#F1E9B1;
	color:#000000;
	font-family:arial,helvetica,sans-serif;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	text-align:left;
 	font-weight:bold;
}
.pfTableGroupTwoNested {
/* Print-friendly equivalent of tableGroupTwoNested. Differs from pfTableGroupTwo by having no border property. */
	background-color:#F1E9B1;
	color:#000000;
	font-family:arial,helvetica,sans-serif;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	text-align:left;
 	font-weight:bold;
}
.pfTableGroupTwoTotal {
/* Print-friendly equivalent of tableGroupTwoTotal. */
	border:1px solid gray;
	background-color:#FFFFFF;
	color:#000000;
	font-family:arial,helvetica,sans-serif;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	text-align:right;
 	font-weight:bold;
}
.pfTableGroupOneTotal {
/* Print-friendly equivalent of tableGroupOneTotal. */
	border:1px solid gray;
	background-color:#FFFFFF;
	color:#000000;
	font-family:arial,helvetica,sans-serif;
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	text-align:right;
 	font-weight:bold;
}

/* The text-transform property that is assigned to the TH tag carries through to the print-friendly page. A special print-friendly style is not needed to maintain the proper behavior. If the print-friendly styles are moved to a separate stylesheet, the TH behavior will have to be copied over. */
/* The noBreakSpan and tableDataIndent tags are also used in print-friendly report pages but do not require explicit print-friendly counterparts. Again, though, if the print-friendly styles are split out, these dependencies will have to be accounted for. */

/* -------------------------------------------------- */
/* -------------------------------------------------- */
/* COMMON DEFAULT CSS VALUES */
/* -------------------------------------------------- */
/* -------------------------------------------------- */

/* The following color values are used within multiple style classes. Their repeated and related use within the default color scheme is intentional. While clients will be free to change the colors used within individual style classes, it's a good starting point to keep certain color values related across classes. */
/* color:#000000; */			/* Basic Text Color (black) */
/* color:#3162A6; */			/* Heading Text Color (dark blue) */
/* color:#0000DE; */			/* Basic Link Color (bright blue) */
/* color:#663399; */			/* Basic Link Color - Visited (purple) */
/* color:#0000DE; */			/* Basic Link Color - Hover (bright blue) */
/* background-color:#FFFFFF; */	/* Basic Background Color (white) */

/* The following font values are used within multiple style classes. Their repeated and related used is intentional. While clients will be free to change font settings within individual style classes, it's a good starting point to keep certain font values related across classes. */
/* font-family:arial,helvetica,sans-serif; */			/* Basic Font Family */
/* font-size:x-small; */								/* Basic Font Size */
/* font-family:verdana,arial,helvetica,sans-serif; */	/* Small Font Family */
/* font-size:xx-small; */								/* Small Font Size */


/* -------------------------------------------------- */
/* -------------------------------------------------- */
/* DEFAULT LAYOUT PROPERTIES */
/* -------------------------------------------------- */
/* -------------------------------------------------- */

/* The following property values are hardcoded into the mockups, but in the production code, these values will be read in from client-specific property files. The mockup HTML includes comments indicating where these properties should be applied. */
/* overallAlignment set to "left" */
/* constrainedWidth set to "500" */
