﻿/****** Common styles with other pages *****/
.mobilepage p	{
	font-size: 14px;
	/*font-size: 1.4rem;*/
	line-height: 20px;
}

.mobilepage h3 {
	font-size: 16px;
	/*font-size: 1.6rem;*/
	line-height: 22px;
	font-weight: bold;
	margin-bottom: 19px;
}

.mobilepage .c-richtext {
margin: 30px 0px 8px; 
}


.mobilepage .c-h1 h1 {/* Overwrite margin for mobile - remove margin 0px for h1*/
margin-bottom: 18px;
}

.mobilepage .c-ht-text {
	font: 16px Arial, Helvetica, sans-serif;
	margin-top: 25px;
    line-height: 22px;
}

.mobilepage .content-sidebar {
	/*width: 280px;*/
    padding: 0 15px;
    background: url(/images/mobile-banking/bg_whitegray_verticalgradient.png) repeat-x top;
    border-radius: 0px 5px 0px 0px;
    /* background-color: #014488; */
}

.mobilepage #header-hero {
    top:20px; /* Move hero image down to include navigation*/
}

.mobilepage .header-hero-panel {
   width: 830px;
   padding: 25px 0px 0px 65px;
   text-align: left;
}

.mobilepage .header-hero-title {
    font: 66px/54px 'garagegothic-bold',Arial,sans-serif;
    text-transform: uppercase;
    margin: 0px 0px 15px;
    letter-spacing: -1px;
}

.mobilepage .header-hero-subtitle {
    font: 27px/30px 'garagegothic-bold',Arial,sans-serif;
    letter-spacing: -0.3px;
    margin: -4px 0px 25px;
}

.mobilepage .header-hero-title, .header-hero-subtitle {
    text-shadow: none;
}

.mobilepage #content-body {
    margin: 88px auto 0px auto;
}

.mobilepage #header-hero-container {
    padding: 0px 0px 0px 0px;
	margin: 0px;
}

.mobilepage #header-main {
    padding: 0px;
    margin: 0px;
}

.mobilepage #headerLogo {
    margin: 28px 0px 0px 0px;
}

.mobilepage .nav-utility-link {
/*display: block;*/
text-decoration: none;
font-size: 15px;
/*padding: 10px 10px;
height: 15px;*/
border: 1px solid transparent;
border-bottom: none;
}

/*.mobilepage .nav-utility-item.locations.hovering .nav-utility-dropdown {
	left: -100px;
}*/

/*.mobilepage .nav-utility-item.contact.hovering .nav-utility-dropdown {
	left: -68px;
    min-width: 197px;
    border-top:1px;
}*/

.mobilepage #nav-utility {
    margin: 16px 0px 59px 0px;
}

/*.mobilepage .locations .nav-utility-link {
	font-weight: normal;
	color: #014488;
	background: transparent;
	line-height: 15px;
    height: 15px;
	margin: 0;
    font-size:15px;
}*/

/*.mobilepage .nav-utility-link a 
{
    color: #014488;
}*/

/*.mobilepage .nav-utility-item.hovering .nav-utility-link.has-dropdown {
	border-color: #ddd;
	background-color: #f5f5f5;
	color: #014488;
	text-decoration: none;
}*/

/*.mobilepage .nav-utility-item.locations .nav-utility-dropdown:before {
    content: "";
    background-color: #ccc;
    display: inline-block;
    height: 1px;
    top: 0;
    right: 0;
    position: absolute;
    width: 310px;
}*/

.mobilepage .nav-utility-item.customer-service .nav-utility-dropdown:after { width: 95px;}

.mobilepage .content-main-double:after,
.mobilepage .content-main-sidebar:after {
	height: 0px;
}

.mobilepage .content-section-separator {
margin: 10px 0 0;
}


.mobilepage .c-footnote {
	font: 12px/16px Arial, sans-serif;
	/*margin-bottom: 12px;*/
	margin: 17px 0 0;
}

.mobilepage #footer-header {
    font: 14px;
    font-weight:bold;
    margin-top:15px;
}


.mobilepage row-100:after {
content: "";
display: table;
clear: both;
}

/*2 column body table*/

.mobilepage a {
    text-decoration:none;
	color: #014488;
    font-family: Arial;
    font-weight: normal;
}

ol.numbered_list {
    margin-top: 20px;
    margin-left: 40px;
	font-size: 14px;
	line-height: 20px;
}

ol.numbered_list li {
	list-style-type: decimal;
	padding-bottom: 15px;    
}

/***** Specific styles for mobile *****/
p.large {
  font-size:16px;
  line-height:22px;
  margin:18px 0 0;
}

h3.mobile {
	font-size: 16px;
	/*font-size: 1.6rem;*/
	line-height: 22px;
	font-weight: bold;
	margin-bottom: 19px;
}

h3.imgright {
	margin-top: 16px;
	margin-bottom: 0;
	}

span.supNum {
	font-size: 8px;
	font-size: 0.8rem;
    margin-left: 1px;
    position: relative;
	top: -5px;
    top: -0.5rem;
}

/*adding bottom Margin to P tags under subPara class*/
.subPara p{
	margin: 0 0 28px;
}

.mobilepage .bold-font {
    font-weight: bold;
}

/*List Mobile style. Originally in Mobile2.css*/
ul.listvisible li	{
	list-style-type:disc;
	font-size: 14px;
	line-height: 24px;
}

#home_cta_container p {
	line-height: 20px;
}

/*secondary title in the chart*/
.txt_gray_title {
    font-family: Arial;
    font-weight: normal;
	font-size: 16px;
	/*font-size: 1.6rem;*/
    color: #414042;
    line-height: 22px;
}

.txt_gray_small {
    font-family: Arial;
    font-weight: normal;
	font-size: 10px;
	/*font-size: 1.0rem;*/
    color: #414042;
    line-height: 22px;
}


/*positions line in table*/
.grayline {
    margin-top: 0px;
    vertical-align: middle;
}

.row {
	width: 100%;
	}

.row:after {
	content: "";
	display: table;
	clear: both;
	}

/* HOME PAGE 3 COLUMN IMAGE SECTION */
#home_cta_container p {
  line-height:20px;
}

.home_cta_threecolumns {
	padding: 0px;
    width: 610px;
    float: left;
}

.home_cta_threecolumns a {
	color: #014488;	
	font-weight: normal;
	background: transparent url(/images/mobile-banking/home_contents_links.png) right no-repeat;
	padding-right: 14px;
	background-position-y: 5px;
    text-decoration: none;
}

.home_cta_threecolumns a:hover {
    text-decoration:underline;
}

.home_cta_threecolumns h6
/*.home_cta_threecolumns p*/ {
	padding-right: 30px;
}

.home_cta_threecolumns div.column1{
	float:left;
	/*width: 182px;*/
	background: transparent;
	/*padding: 22px 10px 0px 0px;*/
    width:30%;
    padding-top: 30px;
    padding-right:30px;
}

div.home_cta_threecolumns.column1 p,
div.home_cta_threecolumns.column1 h3	{
	padding-left: 15px;
}

.home_cta_threecolumns div.column2 {
	float:left;
	background: transparent;
	/*width: 180px;
    padding: 22px 0px 0px 10px;*/
    width:30%;
    padding-top: 30px;
    padding-right:30px;
}
.home_cta_threecolumns div.column3 {
	float:left;
	background: transparent;
	/*width: 180px;*/
    width:30%;
    padding-top: 30px;
}

#home_cta_image1 {
    position: relative;
    left: 0px;
}
#home_cta_image1caption,
#home_cta_image2caption {
	padding-top: 14px;

}
#home_cta_image1description,
#home_cta_image2description{
	padding-top: 0;
	padding-bottom: 12px;
}
#home_cta_image3caption {
	padding-top: 13px;
	line-height: 22px;
	padding-right: 0px;	
}
#home_cta_image3description{
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 10px;
}

#home_cta_image2 {
    position: relative;
    left: -15px;
}

#home_cta_subtitle2 {
	padding-top: 30px;
}

#home_whatweoffer_divider {
	width: 654px;
	/*width: 65.4rem;*/
	height: 20px;
	position: relative;
	left: -30px;
	top: 24px;
	/*top: 2.4rem;*/
}

#home_whatweoffer_grid {
	padding-top: 24px;
}

#home_whatweoffer_grid p {
	padding-right: 30px;
}

#home_whatweoffer_grid .row1 {
    
}
#home_whatweoffer_grid .row2 {
    padding-top: 30px;
}
#home_whatweoffer_grid .row3 {
    padding-top: 28px;
    
}
#home_cta_image6description,
#home_cta_image9description {
	padding-right: 0px !important;
}

#common_cta_container,
#home_cta_container {
	width: 960px;
	/* width: 96rem; */
	top: -435px;
	position: relative;
	background: #EDEBEB;
	color: #414042;
	border: 1px solid #cecece;
	border-radius:6px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	behavior: url(/css/PIE.htc);
}


/*Right Column Common Open Account*/
.common_cta_open_account_twocolumns {
	padding-top: 5px;
	float: left;
}

#common_cta_open_account a {
	font-size: 14px;
	font-weight: bold;
	color: #014488;
	background: transparent url("/images/mobile-banking/home_contents_links.png") right no-repeat;
	padding-right: 12px;
	background-position-y: 6px;	
}


#common_cta_open_account a:hover {
    text-decoration: none;
}


#retirement_cta .row.firstrow,
#advisor_cta .row.firstrow {
	padding-top: 0px;
}

.advisor_cta_two_columns .advisor_cta_column1 {
	width: 164px;
}

.advisor_cta_two_columns .advisor_cta_column2 {
	padding-left: 5px;
	width: 400px;
}

.retirement_cta_two_columns,
.advisor_cta_two_columns {
	float: left;
	padding-top: 15px;
}

.retirement_cta_two_columns .retirement_cta_column1,
.advisor_cta_two_columns .advisor_cta_column1 {
	width: 164px;
}

.retirement_cta_two_columns .retirement_cta_column2 {
	padding-left: 20px;
	width: 400px;
}

.advisor_cta_two_columns .advisor_cta_column2 {
	padding-left: 5px;
	width: 400px;
}

.retirement_cta_two_columns .retirement_cta_column2 p  {
	padding-top: 11px;
}

.advisor_cta_two_columns .advisor_cta_column2 p  {
	padding-top: 2px;
}

/**** Primary Navigation ****/

#header_navigation_container {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 10px 0px 0px 0px;
	position: relative;
	overflow: visible;
    margin: 0 auto 0 auto;
	clear: both;
}
.mobile .container {
	width: 960px;
	/* width: 96rem; */
	margin: 0 auto 0 auto;
	clear: both;
	}

.mobilepage #nav-main {
    -moz-box-shadow: 0px 3px 3px #666;
    -webkit-box-shadow: 0px 3px 3px #666;
     box-shadow: 0px 3px 3px #666;
     behavior: url(/css/PIE.htc);
     position: relative;
     width:960px;
     -webkit-appearance: none;
}

.mobilepage #nav-main li {
	height: 43px;
	position: relative;
	margin: 0;
	padding: 0;
	z-index: 200;	
    display: inline;
	float: left;
	}

.mobilepage #nav-main li > a {
	width: 100%;
	height: 43px;
	line-height: 43px;
	font-weight: bold;
	display: block;
	float: left;
	color: #414042;
	text-align: center;
    text-decoration:none;
	margin: 0;
	padding: 0;
	zoom: 1;
	z-index: 200;		
	}

.mobilepage #nav-main li#subnav_1 a:hover,
.mobilepage #nav-main li#subnav_1.active > a
 {
	width: 240px;
	color: #555;
	background: url(/images/mobile-banking/mainNav_leftTab_active.png) left no-repeat;
}
	
.mobilepage #nav-main li#subnav_2 a:hover,
.mobilepage #nav-main li#subnav_2.active > a,
.mobilepage #nav-main li#subnav_3 a:hover,
.mobilepage #nav-main li#subnav_3.active > a
 {
	width: 240px;
	color: #555;
	background: url(/images/mobile-banking/mainNav_innerTab_active.png) center no-repeat;
}

.mobilepage #nav-main li#subnav_4 a:hover,
.mobilepage #nav-main li#subnav_4.active > a
 {
	width: 239px;
	color: #555;
	background: url(/images/mobile-banking/mainNav_rightTab_active.png) right no-repeat;
}

.mobilepage #nav-main li > a:hover, 
.mobilepage #nav-main li.hovering > a {
	text-decoration: none;
	}

.main_nav {
	clear: both;
	width: 100%;
	height: 43px;
	font-size: 15px;
	z-index: 200;		
	margin-top: 5px;
}

#subnav_1 {
	width: 240px;
	background: url(/images/mobile-banking/mainNav_leftTab_off.png) right no-repeat;
	}

#subnav_2 {
	width: 240px;
	background: url(/images/mobile-banking/mainNav_innerTab_off.png) right no-repeat;
	}

#subnav_3 {
	width: 240px;
	background: url(/images/mobile-banking/mainNav_innerTab_off.png) right no-repeat;
	}

#subnav_4 {
	width: 239px;
	background: url(/images/mobile-banking//mainNav_rightTab_off.png) right no-repeat;
	}


.mobilepage ul.numImage	{
margin-left: -5px;
margin-bottom: 25px;
font-size: 14px;
/*font-size: 1.4rem;*/
list-style-type: none;
}

/*Added to make ul in that class not padded to left*/ 
.mobilepage ul.mobile-tablet-bullets{
padding-left: 0px; 
}


.mobilepage ul.numImage li	{
margin-bottom: 12px;
}

.mobilepage ul.numImage	li span	{
position: relative;
bottom: 15px;
top:3px;
}

/*styling a server control*/
#base_0_header_0_searchComponent { 
	display: inline-block;
	vertical-align: middle;
}

.selfdirected_cta_twocolumns {
	padding-top: 14px;
    padding-bottom: 10px;
    width:600px;
}

#selfdirected_cta div.selfdirected_cta_twocolumns.column1{
	float:left;
	width: 302px;
	background: transparent;
}

#selfdirected_cta div.selfdirected_cta_twocolumns.column2 {
	background: transparent;
}

#selfdirected_cta div.selfdirected_cta_twocolumns.column1row2{
	float:left;
	width: 302px;
	padding-top: 39px;
}

#selfdirected_cta div.selfdirected_cta_twocolumns.column2row2 {
	padding-top: 39px;
	background: transparent;
}

/* Commands Table */
#textbanking_price_chart {
	width: 600px;
	/*width: 60rem;*/
	float: left;
	-webkit-box-shadow: 0px 10px 30px rgba(150, 150, 150, 0.75);
	-moz-box-shadow:    0px 10px 30px rgba(150, 150, 150, 0.75);
	box-shadow:         0px 10px 30px rgba(150, 150, 150, 0.75);	
	margin-top: 16px;
	/*margin-top: 1.6rem;*/
	margin-left: 0px;
	/*margin-left: 3rem;*/
	margin-bottom: 19px;
	/*margin-bottom: 1.9rem;*/
	padding: 0;
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-topright: 6px;
    -webkit-border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px; 
     border-radius: 6px 6px 6px 6px;
    behavior: url(/css/PIE.htc);
    position: relative;
    background: url("/images/mobile-banking/bg_gray_75.png");
    
}

#textbanking_price_chart div {
	height: 70px;
}

#textbanking_price_chart div.textbanking_price_chart_titlerow {
	background: #ffffff;
    height: 90px;	
    border: 1px solid #BDBDBD; 
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-topright: 6px;
    -webkit-border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px; 
     border-radius: 6px 6px 0px 0px;
     behavior: url(/css/PIE.htc);
     position: relative; /* this is required for PIE.htc to work properly */
	 overflow: hidden;

}

#textbanking_price_chart div.textbanking_price_chart_lastrow {
	background: #e6e6e6;
    border-left: 1px solid #BDBDBD;
    border-right: 1px solid #BDBDBD;
    border-bottom: 1px solid #BDBDBD;
    height: 90px;	
    -moz-border-radius-bottomleft: 6px;
    -moz-border-radius-bottomright: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -webkit-border-bottom-right-radius: 6px; 
     border-radius: 0 0 6px 6px;
     behavior: url(/css/PIE.htc);
     position: relative; /* this is required for PIE.htc to work properly */
	 overflow: hidden;

}

#textbanking_price_chart div.textbanking_price_chart_titlerow .textbanking_price_chart_col1
 {
	height: 80px;
    width: 281px;
	/*width: 28.1rem;*/
}

#textbanking_price_chart div.textbanking_price_chart_titlerow .textbanking_price_chart_col2
 {
    height: 75px;
    width: 275px;
	/*width: 27.5rem;*/ 
}

.textbanking_price_chart_col1 {
	width: 281px;
	/*width: 28.1rem;*/
	padding-left: 19px;
	padding-top: 15px;
	float: left;
	background: url("/images/mobile-banking/global_cta_side_top_20x1_shadow.png") repeat-y right;
	color: #6B6771;

}

.textbanking_price_chart_col2 {
	width: 275px;
	/*width: 27.5rem;*/
	padding-top: 15px;	
	float: right;
	background: url("/images/mobile-banking/global_cta_side_top_20x1_shadow.png") repeat-y right;
  
}

.textbanking_price_chart_col2 p {
	margin: 0 15px 0 10px;
}

.textbanking_price_chart_oddrow {
	background: #eeeeee;
    border-left: 1px solid #BDBDBD;
    border-right: 1px solid #BDBDBD;
    border-bottom: 1px solid #BDBDBD;
	overflow: hidden;
}

.textbanking_price_chart_evenrow {
	background: #e6e6e6;
    border-left: 1px solid #BDBDBD;
    border-right: 1px solid #BDBDBD;
    border-bottom: 1px solid #BDBDBD;
	overflow: hidden;
}

#textbanking_price_chart div.textbanking_price_chart_doublerow{
	height: 80px;
}

#selfdirected_price_chart div.selfdirected_price_chart_300pxrow{
	height: 300px;
}

/*removed from original css to avoid a fixed height for the table. table should be stretched according to content.*/
#selfdirected_price_chart div.selfdirected_price_chart_298pxrow{
	height: 284px
}

.textbanking_price_chart_cellwithSub{
	padding-top: 9px;
	margin: 0;
}

#textbanking_price_chart h3 {
margin-bottom: 0px;
}

/* selfdirected_price_chart character spacing adjustments */
#a1, 
#b1,
#c1,
#d1 {
	height: 120px;   
}

#a1 p, 
#b1 p,
#c1 p,
#d1 p{
	text-align: left; 
    padding-top: 5px;
    padding-bottom: 7px;
}

#b5,
#c5 {
	padding-right: 18px;
}

#b6,
#c6 {
	padding-left: 28px;

}

#b7,
#c7 {
	padding-top: 7px;
}

#b8,
#c8 {
	padding-left: 32px;	
}



/* Check Your Options table - 4 columns  */

#selfdirected_price_chart {
	width: 898px;
	/*width: 89.8rem;*/
	float: left;
	-webkit-box-shadow: 0px 10px 30px rgba(150, 150, 150, 0.75);
	-moz-box-shadow:    0px 10px 30px rgba(150, 150, 150, 0.75);
	box-shadow:         0px 10px 30px rgba(150, 150, 150, 0.75);	
	margin-top: 16px;
	/*margin-top: 1.6rem;*/
	/*margin-left: 30px;*/
	/*margin-left: 3rem;*/
	padding: 0px;
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-topright: 6px;
    -webkit-border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px; 
     border-radius: 6px 6px 6px 6px;
    behavior: url(/css/PIE.htc);
    position: relative;
    background-image: url("/images/mobile-banking/bg_gray_75.png");
    
}

#selfdirected_price_chart div {
	height: 63px;
}


.selfdirected_price_chart_oddrow {
	background: #eeeeee;
    border-left: 1px solid #BDBDBD;
    border-right: 1px solid #BDBDBD;
    border-bottom: 1px solid #BDBDBD;
	overflow: hidden;
}

#selfdirected_price_chart div.selfdirected_price_chart_lastrow {
	background: #eeeeee;
    border-left: 1px solid #BDBDBD;
    border-right: 1px solid #BDBDBD;
    border-bottom: 1px solid #BDBDBD;
    /*height: 90px;*/	/*remove to have the row stretch*/
    -moz-border-radius-bottomleft: 6px;
    -moz-border-radius-bottomright: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -webkit-border-bottom-right-radius: 6px; 
     border-radius: 0 0 6px 6px;
     behavior: url("/css/PIE.htc");
     position: relative; /* this is required for PIE.htc to work properly */
	 /*overflow: hidden;*/ /*remove to prevent hidden stretch row*/ 
}
.selfdirected_price_chart_evenrow {
	background: #e6e6e6;
    border-left: 1px solid #BDBDBD;
    border-right: 1px solid #BDBDBD;
    border-bottom: 1px solid #BDBDBD;
	overflow: hidden;
}

#selfdirected_price_chart div.selfdirected_price_chart_doublerow{
	height: 115px;
}

.selfdirected_price_chart_cellwithSub{
	padding-top: 9px;
	margin: 0;
}

.selfdirected_price_chart_titlerow .selfdirected_price_chart_col2 p, 
.selfdirected_price_chart_titlerow .selfdirected_price_chart_col3 p,
.selfdirected_price_chart_titlerow .selfdirected_price_chart_col4 p
{
    font-family: Arial;
    font-weight: bold;
	font-size: 18px;
	/*font-size: 1.8rem;*/
	line-height: 24px;
    color: #5B6771
}

#selfdirected_price_chart div.selfdirected_price_chart_titlerow {
	background: #ffffff;
    height: 110px;	
    border: 1px solid #BDBDBD; 
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-topright: 6px;
    -webkit-border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px; 
     border-radius: 6px 6px 0px 0px;
     behavior: url(/css/PIE.htc);
     position: relative; /* this is required for PIE.htc to work properly */
	 overflow: hidden;

}

#selfdirected_price_chart div.selfdirected_price_chart_titlerow .selfdirected_price_chart_col1
 {
	height: 127px;
    width: 213px;
	/*width: 21.3rem;*/
	text-align:center;
}

#selfdirected_price_chart div.selfdirected_price_chart_titlerow .selfdirected_price_chart_col2,
#selfdirected_price_chart div.selfdirected_price_chart_titlerow .selfdirected_price_chart_col3
 {
    height: 127px;
    width: 214px;
	/*width: 21.4rem;*/
}

.selfdirected_price_chart_col1 {
	width: 213px;
	/*width: 21.3rem;*/
	padding-left: 20px;
	padding-top: 17px;
	float: left;
	background: url("/images/mobile-banking/global_cta_side_top_20x1_shadow.png") repeat-y right;
	color: #6B6771;

}

.selfdirected_price_chart_col2 {
	width: 214px;
	/*width: 21.4rem;*/
	padding-top: 17px;	
	float: left;
	background: url("/images/mobile-banking/global_cta_side_top_20x1_shadow.png") repeat-y right;
  
}

.selfdirected_price_chart_col2 p {
	margin: 0 15px 0 15px;
}

.selfdirected_price_chart_col3 {
	width: 214px;
	/*width: 21.4rem;*/
	padding-top: 17px;	
	float:left;
    background: url("/images/mobile-banking/global_cta_side_top_20x1_shadow.png") repeat-y right;
    
}

.selfdirected_price_chart_col3 p {
	margin: 0 15px;
}

.selfdirected_price_chart_col4 {
	width: 225px;
	/*width: 22.5rem;*/
	padding-top: 14px;	
	float:left;
}

.selfdirected_price_chart_col4 p {
	margin: 0 15px;	
}

.cellcenter	{
	margin: 0 80px;
	text-align: center;
}