
/* -------------------------------------------------- */
/* GLOBAL TEMPLATE STYLES: Accessibility */
/* -------------------------------------------------- */
/* The accessiblity styles are NOT brandable. */

.skipLinks {
   /* visibility:hidden; */
   font-family:arial,helvetica,sans-serif;   /* Basic Font Family */
   font-size:.01em;
   text-decoration:none;
   position:absolute;
   left:-999px;
   width:990px;
}
.ceb_skipLinks {
	/* visibility:hidden; */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size:.01em;
	text-decoration:none;
	position:absolute;
	left:-999px;
	width:990px;
}
.ceb_skipLinkLand {
/* Purposely kept blank to eliminate style conflicts. */
}

/* -------------------------------------------------- */
/* GLOBAL TEMPLATE STYLES: Page Titles								*/
/* -------------------------------------------------- */
.ceb_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;
}

.ceb_pageTitle {
/* Defines the properties for the page title. */
/* CSP equivalent: body-title. */
	text-align:left;  /* Do not center. */
	background-color:#FFFFFF;  /* Basic Background Color (white) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	color:#002654;	/* Heading Text Color (dark blue) */
	font-size:115%; /* default relative Font Size; replaces medium */
	font-weight:bold;
}

/* -------------------------------------------------- */
/* GLOBAL TEMPLATE STYLES: Banner */
/* -------------------------------------------------- */

.ceb_bannerBackground {
	background-color:#FFFFFF;	/* Basic Background Color (white) */
	width:100%;
}
.ceb_utilityLinks {
/* Sets the font characteristics for the utility links. For simpicity, this single class is applied to the table that holds the utility links. These styles cascade to the link-specific styles specified in the utilityLinks A: styles. */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 80%;	/* default relative Font Size; replaces x-small */
	color:#000000;	/* Basic Text Color (black) */
	text-decoration:none;
}
		/* Nested link properties. */
		.ceb_utilityLinks A:link {
			color:#000000;
			text-decoration:none;
		}
		.ceb_utilityLinks A:visited {
			color:#000000;
			text-decoration:none;
		}
		.ceb_utilityLinks A:hover {
			color:#000000;
			text-decoration:none;
		} 
	
.ceb_utilityLinkStrong {
/* Attached to a span around the sign off link. */
	font-weight:bold;
}
.ceb_utilityLinksRow {
/* Sets the background color for the utility links row. When the background color is changed, it carries to the entire width of the screen. While padding between the links is hardcoded in the HTML table, padding to the right of this section is set with this style. This parameter is not brandable. */
	background-color:#FFFFFF;	/* Basic Background Color (white) */
	padding-right: 3px;
}
.ceb_bannerProductName {
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size:105%; /* default relative Font Size; */
	font-weight:bold;
	color:#3162A6;	/* Heading Text Color (dark blue) */
	white-space:nowrap;
	/* padding-right controls the space between the right edge of the product name and the edge of the browser window. */	
	padding-right:8px;
	/* padding-top controls the vertical alignment of the product name so that it aligns with the bank name in the graphic. Note that this takes trial and error to align these and padding-bottom may be needed depending on the graphic provided by clients. */	
	padding-top:14px;
}

/*	-----------------------------------------------------------------------	*/
/*	Styles for the Tab Bar Menu across the top of the page.              	*/
/*	-----------------------------------------------------------------------	*/

.ceb_tabBar
/* used to set the placement and overall parameters for tab bar.  Should not be opened for branding. */
{
		float: left;
}

.ceb_tabLineBackground
	{
	background-color:#FFFFFF; 
	height: 2px;
	}
	
	/* sets the background color for the line that replaces the tabs on the login and progress pages.  */
	/* unless specifically overidden by clients, the background color for this class should match the background color in the 
			.tabBackground class below. */
			
	/* clients can set a color for this cell or use an image for the background as done below. If using an image, a background color 
		should also be specified so that a color displays if the image cannot be found. */
	/* the default height is set to 2, but clients can override the size to meet their branding reqs. */
		
	/* following image used as a test condition 	
		background-image: url(H:\e-Banking\CeB 2005 Projects\P0014825 - Next Gen UI Upgrade\3 Design & Construction\PDU -- Iteration 9\Iteration 9 -- tab bar -- 11-14-05\Graphics\line_for_tab_bar_base.jpg);
	*/




.ceb_tabBackground
	{
	/* sets the background color for the tabs.  For the text-based tab bar, this color shows between each tab. */
	/* clients can set a color for this cell or use an image for the background as done below.  */
		background-color:#CADCEB; 
	}
	

.ceb_tabCell
{	
	/* Applied to each table cell <td> that contains a tab.  Not open for branding. */
	/* Each cell has an onClick event, and this style ensures that the mouse cursor displays the standard clickable style. */
	cursor: pointer;

	/* NOTE: Use the following padding styles when clients have the default text-based menus.  */
		padding-top     : 2;
	    padding-bottom  : 2;
	    padding-left    : 1;
	    padding-right   : 1;

	
	/*  NOTE: Use the following padding styles for clients that have the image-based menu.  */
	/*
		padding-top     : 2;
	    padding-bottom  : 2;
	    padding-left    : 1;
	    padding-right   : 1;
	*/
}


/* NOTE: if borders, padding, and font changes are made to the tabUnselected class, they same formatting styles also 
			need to be carried to the tabSelected and tabHover classes.  Otherwise the tabs will vary in size and 
			format when the user hovers or selects a tab.  For instance, if a tab displays a 1px border on hover, the 
			1px border also needs to be built in the tabUnselected and tabSelected classes, but it can be made the same
			color as the background color so that it's hidden from the user. 
*/

.ceb_tabUnselected
	{ 
/* styles the tabs in the unselected state.  The styles apply to a div. */

	background-color:#002654;  /*  (default blue background) */
	color:#EAF1F7; /*white*/
	font-family:Verdana, Arial, Helvetica, sans-serif;
		
	font-size: 70%; 		/* default text size that enables users to resize it with their browser.  */
	font-weight:bold; 

	 white-space:nowrap;    
	
	padding-left: 15px;  	
	padding-right: 15px;	
	padding-top: 2px;		
	padding-bottom: 2px;	
	
	border: thin solid #002654;

	/* Each cell has an onClick event, and this style ensures that the mouse cursor displays the standard clickable style. */
	cursor: pointer;
	}
	


.ceb_tabHover
	{
	/* styles the tabs in the hover state.  The styles apply to a div. */

	background-color:#EAF1F7;
	color:#002654; 
	font-family:Verdana, Arial, Helvetica, sans-serif;
		
	font-size: 70%; /* default text size that enables users to resize it with their browser.  */
	font-weight:bold;  

	white-space:nowrap;		

	padding-left: 15px;  	
	padding-right: 15px;
	padding-top: 2px;	
	padding-bottom: 2px;
	
	border: thin solid #002654;

	/* Each cell has an onClick event, and this style ensures that the mouse cursor displays the standard clickable style. */
	cursor: pointer;
	}

.ceb_tabSelected
	{
	/* styles the tabs in the selected state.  The styles apply to a div. */

	background-color:#EAF1F7; /*blue*/
	color:#002654; /* dark blue */
	font-family:Verdana, Arial, Helvetica, sans-serif;
		
	font-size: 70%; 		/* default text size that enables users to resize it with their browser.  */
	font-weight:bold; 
	white-space:nowrap;		
	
	
	padding-left: 15px;  	
	padding-right: 15px;
	padding-top: 2px;	
	padding-bottom: 2px;
	
	border: thin solid #002654;

	/* Each cell has an onClick event, and this style ensures that the mouse cursor displays the standard clickable style. */
	cursor: pointer;
	}

/* The following classes style the links that are included in tab.ceb_ */
.ceb_tabUnselected A:link{color:#EAF1F7; /*white*/ text-decoration:none;}
.ceb_tabUnselected A:visited{color:#EAF1F7; /*white*/ text-decoration:none;}
.ceb_tabUnselected A:active{color:#EAF1F7; /*white*/ text-decoration:none;}

.ceb_tabHover A:link{color:#002654; /*white*/ text-decoration:none;}
.ceb_tabHover A:visited{color:#002654; /*white*/ text-decoration:none;}
.ceb_tabHover A:active{color:#002654; /*white*/ text-decoration:none;}

.ceb_tabSelected A:link{color:#002654; /*white*/ text-decoration:none;}
.ceb_tabSelected A:visited{color:#002654; /*white*/ text-decoration:none;}
.ceb_tabSelected A:active{color:#002654; /*white*/ text-decoration:none;}

/* -------------------------------------------------- */
/* GLOBAL TEMPLATE STYLES: Left navigation panel */
/* -------------------------------------------------- */

.ceb_sideNavPanel {
/* Sets the background color for all sections in the nav panel. If desired, clients can override this color for each individual section of links. Also sets the border around the entire nav panel, if desired, and the padding at the very bottom of the nav panel. */ 
	background-color:#CADCEB;
	padding-bottom:4px;
	/* height is not offered for branding; it sets the minimum height of the nav panel. */
	height:450px;  
}
.ceb_sidePanelSectionTop {
/* Sets the margin around all links above the quicklinks section. */
/* Note: The background color is set in the sidepanel class and, if needed, overidden in the leftPanelItem class. */		
	margin-left:8px;
	margin-right:8px;
	margin-top:12px;
}
.ceb_quickLinksSection {
/* Sets the margin, border, and background color for the quicklinks section. The default brand does not display a border around this section. */
	margin-left:8px;
	margin-right:8px;
	margin-top:22px;
	background-color:#B6CFE4;
	border:thin solid #002654
	/* border is not displayed in the default brand. */
	
}
.ceb_leftPanelItem {
/* Sets the text properties for the links above the quicklinks section. Note that this class does not style the current page indicator AND this class carries styles to the HTML link anchors. */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 80%;	/* default relative Font Size; replaces x-small */
	font-weight:normal;
	color:#000000;	/* Basic Text Color (black) */
	/* If background-color is not specified, as is the default, then the 
	background color applied in the sideNavPanel class displays. */
	padding:4px;
}
		/* Nested link properties. */
		.ceb_leftPanelItem A:link {
			color:#002654;
			font-weight:bold;
			text-decoration:none;
			font-style : normal;
		}
		.ceb_leftPanelItem A:visited {
			color:#002654;
			font-weight:bold;
			text-decoration:none;
			font-style : normal;
		}
		.ceb_leftPanelItem A:hover {
			color:#0066CC;
			font-weight:bold;
			text-decoration:none;
			font-style : normal;
		}
	
.ceb_leftPanelItemCurrent {
/* Sets the text properties for the current page indicator AND this class carries styles to the HTML link anchors. */
	background-color:#EAF1F7;
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 80%;	/* default relative Font Size; replaces x-small */
	font-weight:bold;
	color:#0066CC;	/* Basic Text Color (black) */
	padding:4px;
	border:thin solid #000000;
}
.ceb_sidePanelSectionRule {
/* Sets the color and size (height) of the line that separates groups of 
links above the quick links section. */
	background-color:#CADCEB;
	padding:0px;
	height:1px;
}
.ceb_quickLinksCategory {
/* This style class sets:
	1.	The color and padding within the quicklink section.  
	2.	The font style for the title of the Quick links section.  
		(Note the spacing between links is set with the quickLinkItem class.) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 80%;	/* default relative Font Size; replaces x-small */
	font-weight:normal;
	color:#000000;	/* Basic Text Color (black) */
	padding:4px;
}
.ceb_quickLinksIndent {
/* Sets the size of the indent for links that appear in the Quicklinks section. Does not indent the title of the quicklinks section. */
	margin-left:8px;
}
.ceb_quickLinkItem {
/* Sets the text styles for all links within the quicklinks section. */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 80%;	/* default relative Font Size */
	font-weight:normal;
	color:#000000;	/* Basic Text Color (black) */
	padding:4px;
}
		/* Nested link properties. */
		/* Sets any additional styles for all links within the quicklinks section. For convenience, basic text properties cascade from the quickLinkItem style class. */
		.ceb_quickLinkItem A:link {
			color:#002654;
			font-weight:bold;
			text-decoration:none;
			font-style : normal;
		}
		.ceb_quickLinkItem A:visited {
			color:#002654;
			font-weight:bold;
			text-decoration:none;
			font-style : normal;
		}
		.ceb_quickLinkItem A:hover {
			color:#0066cc;
			font-weight:bold;
			text-decoration:none;
			font-style : normal;
		}

.ceb_sidePanelSection {
/* Sets the margin and background color around any client-specific content included at the bottom of the nav panel. This section does not appear unless the client is displaying custom content in the bottom section of the nav panel. And, this section is hardcoded to appear at the bottom of the navigation panel. Clients can tweak this by adding padding to the bottom of this class. */
	margin-left:8px;
	margin-right:8px;
	margin-top:50px;
}
.ceb_sidePanelSectionItem {
/* Sets the text characteristics of items that appear in the optional sidePanelSection area of the nav panel. If clients want a border around the content in this section, the border style should be assigned as part of this style class. */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size:65%;	/* default relative Font Size; replaces xx-small */
	font-weight:normal;
	color:#000000;	/* Basic Text Color (black) */
}		
.ceb_sidePanelRunningTextSection {
/* Sets the margin around the section that contains the running text at the top of the Customer Service and Apply for Products tabs. As the default, these styles wil match the sidePanelSectionTop class, but clients can change this for greater flexibility. */
	margin-left:8px;
	margin-right:8px;
	margin-top:12px;
}
.ceb_sidePanelRunningText {
/* Sets the text properties for the client text at the top of the Customer Service and Apply for Products tabs. As the default, these styles will match the leftPanelItem class, but clients can change this for greater flexibility. */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	font-size: 80%;	/*  default relative Font Size; replaces x-small  */
	font-weight:normal;
	color:#000000;	/* Basic Text Color (black) */
	/* If background-color is not specified, as is the default, then the 
	background color applied in the sideNavPanel class displays. */
	padding:4px;
}


/* -------------------------------------------------- */
/* Footer styles*/

/* This section includes default styles to help clients and conversions build a footer.  */
/* By default, the product doesn't have a footer, but clients can build a footer to display on all pages */
/* -------------------------------------------------- */

.ceb_footerSection {
/* Provides a default style for setting the padding and color for the footer section.   */
/* As a default, this style class applies to a div within the <td> that contains the footer.   */
	padding:2px;
	border-top: 1px solid #E5E5E5;
	background-color: white;
}	


.ceb_footerText {
/* Provides a default style for text and links within the footer.  */
/* CSP equivalent: None. */
	text-align:left;  /* Do not center. */
	background-color:#FFFFFF;  /* Basic Background Color (white) */
	font-family:arial,helvetica,sans-serif;	/* Basic Font Family */
	color:#000000;	/* Basic Text Color (black) */
	font-size:65%;	/*  default relative Font Size; replaces xx-small  */
	font-weight:normal;
}
		/* Nested link properties. */
		/* CSP equivalent: None. */
		.ceb_footerText A:link {
			color:#0000DE;	/* Basic Link Color (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.ceb_footerText A:visited {
			color:#663399;	/* Basic Link Color - Visited (purple) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}
		.ceb_footerText A:hover {
			color:#0000DE;	/* Basic Link Color - Hover (bright blue) */
			font-weight:normal;
			text-decoration:underline;
			font-style : normal;
		}

.ceb_footerRule {
/* Provides a default style for a horizontal rules within the footer.  */
/* As a default, the styles match the formRule style class, but clients can change this if using a footer. */
	background-color:#FFFFFF;  /* 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;  */
}

/* -------------------------------------------------- */
/* end of footer styles */
/* -------------------------------------------------- */
