/*   
	Font Sizes at 62.5%
	 8px 	0.8em
	 9px 	0.9em
	10px 	1.0em
	11px 	1.1em
	12px 	1.2em
	13px 	1.3em
	14px 	1.4em
	15px 	1.5em
	16px 	1.6em
	17px 	1.7em
	18px 	1.8em
	19px 	1.9em
	20px 	2.0em

	z-index guide
	1000s	Page menu level
	2000s	Page menu button or icon level
	3000s	Popup level (under modals)
	4000s	Button / popup on other popup level (under modals)
	5000s	Modal level
	6000s	Popup (above modals)
	7000s	Button / Popup on other popup level

*/

/*BEGIN basic layout */
body {
/*	background: url('/projects/prototypes/fsd_dev/images/backgrounds/bg.png') repeat-x; */
	font: 62.5% Verdana, Arial, Geneva, Helvetica, sans-serif;
	color: #333;
}

.clear{ clear: both; }

div p{
	font-size: 1.2em;	/*12px at 62.5%*/
}

p {
	font-size: 1.2em;	/*12px at 62.5%*/
	margin: 10px 0 10px 0;
	padding: 0;
	line-height: 1.5;
}


/*BEGIN basic layout */
#container {
	width: 1024px;
/*	background: url('/projects/prototypes/fsd_dev/images/backgrounds/background_container_gradient.png') 0px 0px no-repeat; */
	margin: 0 auto 0;
	padding: 0;
	text-align: center;
	overflow: visible;
}

#wrapper {
	width: 992px;
	text-align: left;
	margin: 0 auto 0;
}

#header, #menu_bofa, #sub-header { width: 992px; }

#header_area {
	height: 75px;
	background: url('../images/backgrounds/background_header_red_gradient.png') 0px 0px repeat-x;
	overflow: visible;
	text-align:left;
}

#header_area_home {
	height: 141px;
	background: url('../images/images/logo-home.png') 10px 26px no-repeat;
	overflow: visible;
	position: relative;
}

.logo {
	height: 23px;
	width: 186px;
	float: left;
	display: block;
	background: url('../images/icons_and_logos/logo_bank_of_america_white.png') 0px 0px no-repeat;
	margin: 23px 25px 0px 25px;
}

/*BEGIN global menu items*/
ul.global_menu {
	list-style: none;
	position: relative;
	float: right;
	top: 9px;
	right: 15px;
	margin: 0;
}

ul.global_menu li {
	float: left;
	margin-left: 18px;
}

ul.global_menu li.dropdown a {
	background: url('/projects/prototypes/fsd_dev/images/buttons/button_arrow_down_65px.png') right center no-repeat;
	padding-right: 13px;
	text-decoration: none;
	font-size: 0.8em; /*8px at 62.5%*/
	color: #333;
	font-family: Verdana;
}

ul.global_menu li.secure a {
	color: #fff;
	font-weight: bold;
	font-family: Verdana;
}
/*END global menu items*/

#section_title {
	float: left;
	margin-top: 25px;
	text-align:left;
	font-size: 2.0em; /*20px at 62.5%*/
	font-family: Arial;
}

#sub-header {
	margin: 30px 0;
	padding-left: 28px;
}

#summary_area {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	padding: 0;
	margin: 0;
	border-style: solid;
	border-width: 1px;
	border-bottom-color: #c0c0c0;
	border-left-color: #dae3e9;
	border-top-color: #eef2f5;
	border-right-color: #d1dde5;
}

/*BEGIN All Content Blocks */
#content{ /*Container for all items in main content */
	display: block;  
	width: 992px;
	padding: 0px 10px 0px 10px;
	overflow: visible;
	margin: 30px 0px 0px 0px;
	*margin: 0px 0px 0px 0px; /*fix for ie7*/
}

.column, .column_right {   /*Governs all columns */
	display: block;
	padding: 0;
	overflow: visible;
	*overflow: hidden;
	_margin-bottom: 10px;
}

.column { 	float: left; }
.column_right {
	float: right;
	margin-right: 10px;
 }
.column_first { clear: both; }

/*BEGIN all Column Combinations */
.column_29, .column_29_right { width: 29px; }
.column_234, .column_234_right { width: 234px; }
.column_316, .column_316_right { width: 316px; }
.column_323, .column_323_right { width: 323px; } /*SPECIAL CASE using margin_right_30 class*/
.column_357, .column_357_right { width: 357px; }
.column_480, .column_480_right { width: 480px; }
.column_644, .column_644_right { width: 644px; }
.column_726, .column_726_right { width: 726px; }

.column_29, .column_234, .column_316, .column_357, .column_480, .column_644, .column_726 { 
	margin-right: 12px;
}
.column_29_right, .column_234_right, .column_316_right, .column_357_right, .column_480_right, .column_644_right, .column_726_right {
	margin-right: 0px;
}



/*END ALL Column Combinations */

/*END All Content Blocks */

#footer {
	clear: both;
	width: 992px;
	background-color: #f2f2f2;
	padding: 0px 0px 5px 12px;
	border-top:1px solid #ccc;
}
/*END basic Layout */


/*BEGIN reusable div areas */

.one_column {
	width: 992px;
	float: left;
}

.page_title_area, .page_title_area_medium {
	margin-top: 1px;
	width: 990px;
	padding: 0px;
	overflow: hidden;
	border-style: solid;
	border-width: 1px;
	border-bottom-color: #c0c0c0;
	border-left-color: #dae3e9;
	border-top-color: #eef2f5;
	border-right-color: #d1dde5;
}

.page_title_area {
	height: 63px;
	background: url('../images/backgrounds/background_blue_gradient_65pixel.png') 0px 0px repeat-x;
}

.page_title_area_medium {
	height: 90px;
	background: url('../images/backgrounds/background_grey_gradient_90pixels.png') 0px 0px repeat-x;
}

.page-title { margin: 10px 0px 0px 24px; }

.image_profile {
	position: relative;
	float: left;
	width: 42px;
	height: 42px;	
	background: url('/projects/prototypes/fsd_dev/images/icons_and_logos/icon_profile_default.png') 0px 0px no-repeat;
	margin: 10px 0px 0px 25px;
}

.image_profile_sidebar {
	position: relative;
	float: left;
	width: 60px;
	height: 60px;	
	background: url('/projects/prototypes/fsd_dev/images/2011/default_profile_image_large.png') 0px 0px no-repeat;
	margin: 0px 11px 0px 0px;
}

.page-title, .page-title-for-summary {
	font-family: Arial, Helvetica, sans-serif;
	float: left;
	width: 350px;
}

.page-title-medium { margin: 30px 0px 0px 25px; }

.page-title-normal {
	font-family: Arial, Helvetica, sans-serif;
	margin: 15px 0px 0px 25px;
}

.page-title-for-summary { margin: 25px 0px 1px 15px; }

.page-subtitle a {
	font-size: 1.1em; /*11px at 62.5%*/
	font-weight: normal;
}

#tools_module {
	display: inline-block;
	width: 720px;
	margin-bottom: 10px;
}
/*END reusable div areas */

/*BEGIN summary area layout */

.one_column_gradient_short {
	height: 79px;
	background: url('../images/backgrounds/background_header_light_blue_gradient_medium.png') 0px 0px repeat-x;
}

.one_column_gradient_two_state {
	height: 95px;
	background: url('../images/backgrounds/background_grey_gradient_two_state_for_tabbed_version.png') 0px 0px repeat-x;
}

.open_state {
	height: 241px;
	background-position: 0px -110px; 
}

.one_column_gradient {
	background: url('../images/backgrounds/background_grey_gradient.png') 0px 0px repeat-x;
	*background: url('/projects/prototypes/fsd_dev/images/2011/background_grey_gradient.png') 0px 0px repeat-x;  /*IE CHECK THIS FOR DIFF */
	*width: 958px; /*IE styles */
	*margin-left: 1px; /*IE styles */
	*padding: 15px; /*IE styles */
	*overflow: hidden;	/*IE styles */
}

.one_column_gradient_tall {
	height: 219px;
	background: url('../images/backgrounds/background_header_light_blue_gradient_tall.png') 0px 0px repeat-x;
}

.one_column_gradient_259px {
	height: 259px;
	background: url('../images/backgrounds/background_grey_gradient_259pixel.png') 0px 0px repeat-x;
}

.summary_column_wrapper {
	display: block;
	height: 137px;
	float: left;
	overflow: hidden;
	margin: 9px 25px 0px 15px;
	padding: 0px;
	line-height: 1.5;
	font-size: 1.2em;
}

.summary_column_left {
	text-align: left;
	float: left;
	margin: 0;
	border-top-style: solid;
	border-top-color: #ccc;
	border-top-width: 1px;
}

.summary_column_right {
	float: left;
	margin: 0;
	padding-left: 23px;
	border-top-style: solid;
	border-top-color: #ccc;
	border-top-width: 1px;
}
/*END summary area layout */

#alert {
	margin: 20px 0 0 20px;
	width: 940px;
}

#one_column, .one_column  {
	width: 992px;
	float: left;
	overflow: auto;
}

/*END Margins can be used with other styles as an added class */

/*BEGIN Search items*/
div.search {
	float: right;
	margin: 0;
	position: relative;
	right: 15px;
	top: -10px;
}

span.search {
	position: absolute;
	top: 36px;
	right: 15px;
	margin: 0;
}

input.search, input.search_tools, input.add_a_transaction_short,input.add_a_transaction_short_medium,input.add_a_transaction_long,input.add_a_transaction_longer {
	border: none;
	display:block;
	background: url('../images/backgrounds/background_search_204px.png') no-repeat;
	margin: 0 -40px 0 0;
	padding: 6px 30px 5px 10px;
	font-size: 1.1em; /*11px at 62.5%*/
	color: #333;
}

input.search, input.search_tools {width: 200px;}
input.add_a_transaction_short { width: 62px;}
input.add_a_transaction_short_medium { width: 72px;}
input.add_a_transaction_medium { width: 90px;}
input.add_a_transaction_long { width: 150px;}
input.add_a_transaction_longer { width: 300px;}

input.customize_account,input.add_a_transaction_medium {
	border: none;
	display: block;
	margin: 0 -40px 0 0;
	padding: 6px 30px 5px 10px;
	font-size: 1.1em; /*11px at 62.5%*/
	color: #f00;
}

input.customize_account,input.add_a_transaction_medium {
	width: 400px;
	padding: 6px 30px 5px 10px;
}

input.add_a_transaction_medium {
	padding: 6px 5px 5px 10px;
}

/*END Search items*/

/*BEGIN Summary Toggler */
#toggler {
	padding: 10px 15px; /* also temporary */
	float: right;
	z-index: 2000;
	right: 25px;
	top: 15px;
}

.toggler_up { background: url('../images/icons_and_logos/icon_arrow_wide_up.png') no-repeat; }
.toggler_down { background: url('../images/icons_and_logos/icon_arrow_wide_down.png') no-repeat; }
/*END Summary Toggler */

/* BEGIN Menu Navigation topnav items */
#menu {
	z-index: 2000; /*Menu on top of content */
	height: 34px;
	position: relative;
	margin-left: 0px;
	top: 0px;
	left: 0px;
}

ul.topnav {
	list-style: none;
	width: 992px;
	height: 35px;
	bottom: -1px;
	left: 0px;
	/**left: -5px;  IE styles */
	margin: 0;
	position: absolute;
	padding: 1px 0 0 0;
	background: url('../images/backgrounds/background_navigation.png') no-repeat;
}

ul.topnav li {
	float: left;
	margin: 0;
	padding: 0;
}

ul.topnav li.topitem {
	border-right:1px solid #a2a2a2;
	position: relative;
}


ul.topnav .toplink {
	border-left:1px solid #ffffff;
	border-right:1px solid #ffffff;
	float: left;
	line-height: 34px;
	font-size: 1.3em; /*13px at 62.5%*/
	text-align: center;
	padding: 0px 24px 0px 24px;  /*Added to remove the javascript width function in common.js*/
	*padding: 0px 25px 0px 23px;   /*IE styles */
}

ul.topnav a {
	color: #333;
}

ul.topnav li.topitem.firstlink .toplink {
	border-left: none;
}

ul.topnav li.topitem.active-tab, ul.topnav li.topitem.hover{
	background: url('../images/backgrounds/background_navigation_selected.png') repeat-x;
}

ul.topnav div.subnav {
	position: absolute; /*--Important - Keeps subnav from affecting main navigation flow--*/
	margin-top: 34px;
	left:-1px;
	display:none;
}

ul.topnav div.subnav.mega {
	margin-left: -490px;
	*margin-left: -480px;
}

ul.topnav div.subnav.mega a { /* added 6/27 */
	display: block; 
}

ul.topnav div.subnav div.last, ul.topnav div.subnav div.last_grey {
	padding-bottom: 20px;
	position: relative;
	float:left;
	padding-top: 15px;
}

ul.topnav div.subnav div.last {
	background: url('../images/backgrounds/background_menu_dropdown_border_left.png') bottom left no-repeat;
}

ul.topnav div.subnav div.last_grey {
	background: url('../images/backgrounds/background_menu_dropdown_border_left_grey_bottom.png') bottom left no-repeat;
}

ul.topnav div.subnav ul.dropdown-list {
	list-style: none;
	margin: 0 0 0 0;
	padding: 0px 0 5px 0;
	float: left;
	overflow: hidden;
	position:relative;
}

ul.topnav div.subnav ul.dropdown-list li {
	border-left: 1px solid #ddd;
	margin: 0 0 -100px;
	padding: 0 1px 100px;
	background: none;
	position:relative;
}
	
ul.topnav span.col-head {
	display: block; 
	clear: left; 
	margin: 0; 
	padding: 4px 20px 10px 20px;
	font-size: 1.2em; /*11px at 62.5%*/
	color: #333;
	font-weight: bold;
}

ul.topnav div.subnav ul.item-list {
	margin: 0;
	padding: 0;
	list-style: none;
	float: left;
}

ul.topnav div.subnav ul.item-list li {
	margin: 0; padding: 6px 0;
	border: none;
	clear:left;
	width: 100%;
	display: block;
}

ul.topnav div.subnav ul.item-list li:hover {
	background: #eee;
}
ul.topnav li div.subnav ul.item-list li a {
	border: none;
	padding: 0 20px;
	float: none;
	clear: none;
	font-family: verdana;
	font-size: 1.1em; /*11px at 62.5%*/
	color: #333;
}

ul.topnav div.subnav ul.item-list li .column_right {
 float: right;
 position: relative;
}

.border-right {
	float:left;
	padding-right: 8px;
	margin-right: -612px;
	background: url('../images/backgrounds/background_menu_dropdown_border_right.png') bottom right no-repeat;
}

.border-right-grey-bottom {
	background: url('../images/backgrounds/background_menu_dropdown_border_right_grey_bottom.png') bottom right no-repeat;
}

ul.topnav.home {
	width: 703px;
	height: 45px;
	bottom: 0px;
	left: 290px;
	background: url('../images/backgrounds/background_home_navigation.png') right top no-repeat;
}

ul.topnav.home .toplink {
	line-height: 45px;
	font-size: 1.9em; /*19px at 62.5%*/
	font-family: Arial; 
}

ul.topnav.home div.subnav {
	top: 45px;
}

ul.topnav.home li.topitem.active-tab, ul.topnav.home li.topitem.hover{
	background: url('../images/backgrounds/background_home_navigation_selected.png') repeat-x;
}

ul.topnav.home li.topitem.last, ul.topnav.home li.topitem.last .toplink {
	border-right: none;
}
/* END Menu Navigation topnav items */


/*************************/
/* BEGIN global_menu Navigation*/
/*************************/
#global_menu {
	position: relative;   /*IE styles */
	z-index: 2010;   /*IE styles */
}

#global_menu li {
	float: left;
	margin: 0;
	padding: 0;
}

.global_menu_link {
	color: white;
	height:15px;
	border-left:1px dotted #ffffff;
	border-right:1px dotted #ffffff;
	padding: 0px 16px 0px 16px;  /*Added to remove the javascript width function in common.js*/
	*padding: 0px 17px 0px 15px;   /*IE styles */
}

.global_menu_link.hover{
	color: #333;
	background: url('../images/backgrounds/background_global_menu_dropdown_border_right.png') top right no-repeat;
	background-color: white;
	border-right:1px solid #DB172A;
	height:25px;
	margin-top:-5px;
	padding-top: 5px;
}

#global_menu div.subnav {
	position: absolute; /*--Important - Keeps subnav from affecting main navigation flow--*/
	top: 20px;
	left: -391px;
	width: 556px;
	display:none;
}

#global_menu div.subnav div.last {
	padding-bottom: 2px;
	position: relative;
	float:left;
	padding-top: 15px;
	background: url('../images/backgrounds/background_global_menu_dropdown_border_left.png') bottom left no-repeat;
}

#global_menu div.subnav ul.dropdown-list {
	list-style: none;
	margin: 0 0 0 0;
	padding: 0px 0 5px 0;
	float: left;
	overflow: hidden;
	position:relative;
}

#global_menu div.subnav ul.dropdown-list li {
	border-left: 1px dotted #cecece;
	margin: 0 0 0px;
	padding: 0 1px 0px;
	background: none;
	position:relative;
}
	
#global_menu div.subnav ul.item-list {
	margin: 0; 
	padding: 0;
	list-style: none;
	float: left;
}

#global_menu div.subnav ul.item-list li {
	margin: 0; 
	padding: 6px 0 6px 0;
	border: none;
	clear:left;
	width: 100%;
	display: block;
	font-family: verdana;
	font-size: 1.1em; /*11px at 62.5%*/
}

#global_menu div.subnav ul.item-list li:hover {
	background: #DDEAF2;
}

#global_menu div.subnav ul.item-list li.underline {
	border-bottom: 1px dotted #999;
	padding-bottom: 15px;
	margin: -10px 20px 5px 20px;
	width: 150px;
}

#global_menu div.subnav ul.item-list li.underline:hover {
	background: none;
}

#global_menu div.subnav ul.item-list li a {
	border: none;
	padding: 0 20px;
	float: none;
	clear: none;
	color: #333;
}

#global_menu .border-right {
	float:left;
	background: url('../images/backgrounds/background_global_menu_dropdown_border_right.png') bottom right no-repeat;
	padding-right: 2px;
}

.grey_box{
	padding: 20px 0px 20px 0px;
	background-color: #888;
	width: 565px;
	_*width: 556px;  /* IE styles */
}
.global_language_box{
	padding: 0px 0px 0px 25px;
	color: white;
	line-height: 2.5em;
}

/* END global_menu Navigation*/


/*BEGIN B of A Design 09 layouts*/
#bofa_design_09_page, #bofa_homepage_2012, #bofa_site_key_2012, #interstitial_bamd, #bofa_design_09_account_overview, #bofa_account_details_credit_card_2012, #background_banner_design09_account_overview, #background_banner_design09_account_details, #background_banner_design09_cash_back {
	display: block;
	width: 992px;
	margin-left: auto;
	margin-right: auto;
}

#background_banner_design09_account_overview, #background_banner_design09_account_details, #background_banner_design09_cash_back {
	height: 114px;
}

#background_banner_design09_account_overview {
	background: url('/projects/prototypes/fsd_dev/images/backgrounds/background_banner_design09_account_overview.png') 0px 0px no-repeat;
}

#background_banner_design09_account_details {
	background: url('/projects/prototypes/fsd_dev/images/backgrounds/background_banner_design09_account_details.png') 0px 0px no-repeat;
}

#background_banner_design09_cash_back {
	background: url('/projects/prototypes/fsd_dev/images/backgrounds/background_banner_design09_cash_back.png') 0px 0px no-repeat;
}

#background_banner_design09_overview {
	background: url('/projects/prototypes/fsd_dev/images/backgrounds/background_banner_design09_overview') 0px 0px no-repeat;
	height: 114px;
}

#bofa_design_09_page {
	background: url('/projects/prototypes/fsd_dev/images/backgrounds/background_bofa_design09_banner.png') 0px 0px no-repeat;
	height: 109px;
}

#bofa_homepage_2012 {
	background: url('/projects/prototypes/fsd_dev/images/backgrounds/bofa_homepage_2012.png') 0px 0px no-repeat;
	height: 1000px;
}

#bofa_site_key_2012 {
	background: url('/projects/prototypes/fsd_dev/images/backgrounds/bofa_site_key_2012.png') 0px 0px no-repeat;
	height: 1000px;
}

#interstitial_bamd {
	background: url('/projects/prototypes/fsd_dev/images/backgrounds/interstitial_bamd.png') 0px 0px no-repeat;
	height: 1000px;
}

#bofa_design_09_account_overview {
	background: url('/projects/prototypes/fsd_dev/images/backgrounds/bofa_design_09_account_overview.png') 0px 0px no-repeat;
	height: 1031px;
}

#bofa_account_details_credit_card_2012 {
	background: url('/projects/prototypes/fsd_dev/images/backgrounds/bofa_account_details_credit_card_2012.png') 0px 0px no-repeat;
	width: 993px;
	height: 1380px;
}

#bofa_page_footer {
	display: block;
	background: url('/projects/prototypes/fsd_dev/images/backgrounds/background_bofa_auth_bottom.png') 0px 0px repeat-x;
	width: 992px;
	height: 47px
}
/*END B of A Design 09 layouts*/