/* Dont include .back in migration to STS */
/* Sign on Form */
#signOnForm{
	float:left;
	overflow:visible;
}
/* General Form Styles */
/* General Form Styles */
/* Genearl Form Styles */
.main-content form,
.form-style {
	background: #efefef; /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(229,229,229,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(229,229,229,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Opera 11.10+ */
	background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* W3C */
	clear:both;
	line-height:1.3em;	
	overflow:auto;
	width:100%;
    border: 1px solid #cccccc;
}
.main-content form.no-borders,
.main-content form.hidden {
    border: none;
	background: transparent;
}
.main-content form.no-borders-bg {
    border: none;
}
.main-content form#accountSelectionForm {
	-webkit-border-radius: 4px 4px 0 0;
	border-radius: 4px 4px 0 0;
}
.main-content form ul,
.main-content .form-style ul,
.main-content form li,
.main-content .form-style li {
	background-image: none;
	list-style-type: none;
	position: relative;
	float: left;
	width: 100%;
}
.main-content ul.form-style{
	margin-bottom: 10px;
	padding-left: 0;	
}
.main-content form ul,
.main-content ul.form-style ul{
	margin: 0;
	padding: 0;
}
.main-content .form-style > ul {
	padding-left: 0;
}
.main-content form li,
.main-content .form-style li,
.form-style .main-content li{
	background-image:none;
	border-bottom: 1px solid #CCC;
	padding: 10px 0;
	margin:0;
}
.main-content span.padding {
	padding: 10px 0;
}
.main-content form li.last{
	border-bottom:none;
}
.main-content form table,
.main-content form table.branded {
	margin-bottom:0;
	border:none;
}
.main-content form.contact-us ul li,
.main-content td.no-bottom-border {
	border-bottom:none;
}
.main-content form.no-bottom-borders li,
.main-content form li.no-bottom-border,
.form-style.no-bottom-borders li,
.form-style li.no-bottom-border{
	border-bottom:none;
	padding-bottom:0;
}
.main-content form.no-bottom-borders ul.btn{
	padding-bottom:10px;
}
.main-content form li.no-top-border{
	padding-top:0;
}
.main-content form li li,
.main-content .form-style li li{
	border-bottom: none;
	padding: 5px 0;
	width:90%;
}
.main-content form li p {
	padding-right: 10px;
}
.main-content form li p.no-bottom-margin{
	margin-bottom:0;
}
.main-content form li p.alert{
	margin-right:10px;
}
.main-content form li ul {
	clear: left;
}
/* Disabled LI sections */
.main-content form li.disabled label{
	color:#999;
}
/* Clear Styles */
.main-content form.clear-styles,
.main-content .form-style.clear-styles{
	background:transparent;
	background-color:transparent;
	border:none;
}

/* All these items float left in forms*/
.main-content form label,
.main-content .form-style label,
.main-content .label-title,
.main-content form .label-content,
.main-content .form-style .label-content,
.main-content form div.notification
	/* div seems to work better for floats than spans */ {
	float: left;
}

/* For notifications in forms within agreements, TR: 5/7/13 */
.main-content .static form div.notification {
	float:none;
}


.main-content form label,
.main-content .form-style label,
.main-content .label-title,
.main-content form label.above + .label-content,
.main-content .label-title.above + .label-content,
.main-content form div.notification,
.main-content form .signature .sign,
.main-content form li p,
.main-content .form-style li p, 
.main-content .form-style li.action-message-toggle-container span.toggle-trigger,
.main-content .form-style li.action-message-toggle-container div.toggle {
	margin-left:10px;
}

.main-content form .label-title{
	margin-bottom:5px;
}
.main-content form .label-title-send{
	font-weight: bold;
	float: left;
	padding: 2px 0;
	margin-bottom:5px;
	margin-left:0;
	width: 200px;
}
/* Buttons */
.main-content form ul.btn,
.main-content .form-style ul.btn {
	margin:10px 5px 5px 0px;
}

.main-content form ul.btn li,
.main-content .form-style ul.btn li,
.pop-up.form-style .main-content ul.btn li {
	border-bottom: none;
}

/* Labels and Label Title */
.main-content form label{
	position:relative;
}
.main-content form label,
.main-content .form-style label,
.main-content .label-title{
	width: 200px;
}
.main-content form label,
.main-content .form-style label,
.main-content .label-title,
.main-content form fieldset .label-title{
	font-weight: bold;
	padding: 2px 0;	
}

.main-content form label.above,
.main-content .label-title.above {
	width: 95%;
}
.main-content form ul ul li label,
.main-content form ul ul li .label-title,
.main-content ul.form-style ul li .label-title,
.main-content .label-title.descriptive{
	border-bottom: none;
	font-weight: normal;
}
.main-content .widget form label.inline {
	width: auto;
	margin-right: 5px;
}
.main-content form label.example{
	font-weight:normal;
} 

/* Inline Field */
.inline-field{
	clear:left;
}
.inline-field select,
.inline-field input{
	float:none;
}

/* Disabled Fields */
.main-content form input.disabled,
.main-content form select.disabled,
.main-content form input.no-edit,
.main-content form select.no-edit{
	background-color: #E7E7E7;
}

.main-content form input.disabled,
.main-content form select.disabled{
	border-color: #CCC;
}

/* Non Editable Fields */
/* Field symbol (symbol that should appear in line before a field, i.g. "$")*/
.main-content form label .field-symbol {
	position:absolute;
	line-height: 1.6em;
	right:3px;
	top:0;
}

.main-content .field-suffix {
	line-height: 1.9em;
}

/* Example and Field Detail */
.main-content .field-detail{ 
	/* font-size:.846em; */
	font-size:.846em;
	font-weight:normal;
	line-height:1.2em;
	margin-top:5px;
	/* If margin left is required, apply it to a specific element inside field-detail. TR, 5-22-12 */
	/* margin-left:8px; */
}
/*.main-content form .example.inline{
	display:inline-block;
	vertical-align:middle;
}*/
.main-content form .field-detail li{
	list-style-type:none;
}

/* Description */
.main-content form .description {
	display: block;
	font-weight:normal;
	padding:2px 0 0 4px;
}

/* Notification */
.main-content form .notification{
	padding-right: 10px;
}

.main-content .toggle form+.notification {
	margin-top: 10px;
}
.main-content form .label-content .notification{
	float: none;
	margin:0;
}

/* General Label Content */
.main-content form .label-content .image {
	margin-bottom: 10px;
}
.main-content form .label-content p{
	margin-left:0;
}
.main-content form p.indent{
	margin-left:25px;
}
.main-content form .label-content.static span {
	display: block;
	margin-bottom: 3px;
}
.main-content form input,
.main-content form select,
.main-content .form-style input,
.main-content .form-style select{
	border: 1px solid #7F9DB9;
	/* Default firefox color, so all browsers look the same */
	margin-right: 4px;
}
.main-content form li.checkbox input.checkbox{
	border:none;
}
.main-content input,
.main-content select,
.main-content option {
	height: auto;
	padding: 1px;
}
.main-content input {
	min-height: 20px;
}
.main-content select {
	height:1.8em;
}

/* Label Content Buttons */
.main-content form .label-content ul.btn {
	float:left;
}
/* Example and Field Detail */
.main-content .field-detail ul,
.main-content .field-detail li{
	float:none;
}
.main-content .field-detail ul{
	margin-left:10px;
}
.main-content .field-detail li{
	line-height:1.1em;
	list-style-type:disc;
	margin-bottom:5px;
	padding:0;
}
.main-content form .example {
	color: #777;
	display: block;
	margin: 4px 5px;
	padding: 0;
}
/* Text area */
textarea {
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	max-width: 350px; /* So we don't break the horizontal layout */
	min-height: 100px;
	min-width: 350px;
	width: 350px;
}

/* Error Field and Message */
.main-content form input.errorField,
.main-content form select.errorField,
.main-content form textarea.errorField,
.main-content form li.error span,
.main-content div.error /* for smc */{
	background-color: #FFF;
	border-color: #C00;
	border-style: solid; 
}
.main-content form li.error {
	border: none;
	padding: 0;
}
.main-content div.error /* for smc */{
	margin-bottom:10px;
}
.main-content form input.errorField,
.main-content form select.errorField,
.main-content form textarea.errorField{
	border-width: 1px;
}
.main-content form li.error span,
.main-content div.error /* for smc */ {
	background-image:url(../img/icon-field-error.png);
	background-repeat:no-repeat;
	background-position:5px 5px;
	border-width: 2px;
	display: block;
	color: #C00;
	/* margin-top: -1px; */
	padding:5px 10px 5px 25px;
	font-size:.846em;
}

/* Action Errors */
.main-content form div.error-message,.main-content .form-style div.error-message {
	background-color: #FFF;
	background-image: url(../img/icon-field-error.png);
	background-position:5px center;
	background-repeat:no-repeat;
	border:2px solid #C00;
	padding:4px 25px 5px;
}

/* Radio and Checkbox */
.main-content form li.radio li {
	padding-left: 20px;
}
.main-content form li.radio li label {
	width: 170px;
}
.main-content form fieldset li.radio label.long {
	width:250px;
}
.main-content form label.radio,
.main-content form label.checkbox {
	width: 90%; /* To widen clickable area */
}
.main-content form input.radio,
.main-content form input.checkbox {
	border: none;
	height: auto;
	vertical-align: middle;
	margin-left: 0;
	width: 15px;
}
.main-content form .column input.checkbox {
	float:left;
}
.main-content form label.radio .description,
.main-content form label.checkbox .description{
	margin-left: 20px;
}

.main-content form li.checkbox ul li label,
.main-content form li.checkbox ul li .label-title{
	margin-left:0;
}

/* Field group (multiple fields stacked within the same control list */
.main-content .field-group select,
.main-content .field-group input {
	margin-bottom: 10px;
}

/* Outside of .option-selector, this rule would break address components, and maybe other things: */
.main-content .option-selector .field-group input {
	display: list-item;
}

/* Checkbox/Radio with Label Content */
.main-content form ul.checkbox li .label-content,
.main-content form ul.radio li .label-content,
.main-content form li.checkbox .label-content,
.main-content form li.checkbox ul {
	margin-left:30px;
}

.main-content form li.checkbox.label-content-right .label-content{
	margin-left:0;
}
.main-content form li.checkbox ul{
	/* width:auto; */
	/* Changed width to 90% to fix auto wrapping bug on income tab. TR, 6-27-12 */
	max-width:90%;
	
}

/* Control List */
.main-content form .control-list li {
	display: list-item;
}

.main-content form .control-list li,
.main-content .widget form .control-list li{
	padding-top: 0;
	padding-bottom: 0;
}

.main-content form .control-list label,
.main-content form li.radio .control-list label{
	width: 90%;
}

/* Static Control List */
.main-content form ul.static-control-list li,
.main-content .form-style ul.static-control-list li{
	background-image:url(../img/bullet-form-static-control-list.png);
	background-position:0 center;
	padding-left:15px;
	margin-left:15px;
}
.main-content form ul.static-control-list li.no-bullet,
.main-content .form-style ul.static-control-list li.no-bullet{
	background-image:none;
}

/* Error and Quickhelp icons */
.main-content .label-title+.icon {
	padding-left: 5px;
}

/* Fieldsets */
.main-content form fieldset,
.main-content .form-style fieldset {
	border: 1px solid #BDBDBD;
	margin:0 0 10px 10px;
	overflow:auto;
	padding:0 0 10px 0;
	position:relative;
	width:678px;
}
.main-content form fieldset legend,
.main-content .form-style fieldset legend {
	background:#EFEFEF;
	color:#000; /* For IE 7 */
	font-size:.846em;
	margin-left:10px;
	padding:3px;
	text-transform:uppercase;
}
.main-content form li fieldset ul,
.main-content .form-style li fieldset ul,
.main-content span.width-auto {
	/* dont change with width. the fieldset li depends on it */
	width:auto;
}
.main-content form li fieldset li,
.main-content .form-style li fieldset li {
	padding:5px 0;
	/* Don't change this width */
	width:100%;
}
.main-content form fieldset label,
.main-content form fieldset .label-title,
.main-content .form-style fieldset label,
.main-content .form-style fieldset .label-title {
	width:189px;
}

.main-content form ul fieldset ul li label,
.main-content form ul fieldset ul li .label-title,
.main-content .form-style ul fieldset ul li label,
.main-content .form-style ul fieldset ul li .label-title {
	font-weight:bold;
}

.main-content form ul fieldset ul li li label,
.main-content .form-style ul fieldset ul li li label {
	font-weight: normal;
}

/* Action Links */
/* Links on form review pages that allow for editing or removing list items */
.main-content form ul.action-links{
	width:auto;
	float:right;
	margin-right:10px;
}
.main-content form .action-links li{
	font-size:.846em;
	width:auto;
	float:left;
	padding:0;
	border-right:1px solid #BDBDBD;
}
.main-content form .action-links li a{
	padding:0 5px;
}
.main-content form .action-links li.last{
	border-right:none;
}

/* Label and field widths */
.main-content input{
	width:150px; /* Standard width if there is not one defined(medium) */
}
.main-content select{
	width:154px; /* Standard width if there is not one defined(medium) */
}
.main-content .xx-short {
	width: 35px;
}
.main-content .x-short{
	width: 70px;	
}
.main-content .short,
.main-content .form-style label.short {
	width:100px;
}
.main-content .long {
	width: 250px;
}
.main-content .x-long {
	width: 320px;
}
.main-content .xx-long {
	width: 420px;
}
.main-content .xxx-long {
	width: 450px;
}
.main-content .address-city {
	width: 173px;
}

.main-content .address-state {
	width: 57px;
}
.main-content .address-zip {
		width: 70px;
}
.main-content .stay-together > * {
	float: left;
}

.main-content input.card-expiration-date.long {
	width: 45px;
}

.main-content input.card-expiration-date {
	width: 30px;
}

/* To fix auto wrapping of "/" between fields on date fields when error occurs*/
.main-content .card-expiration-date+img+div {
	display:inline;
}

.main-content .short.social-security-number,
.main-content .short.date-of-birth {
	width: 20px;
}

.main-content input.social-security-number,
.main-content input.phone-number,
.main-content input.date-of-birth {
	width: 28px;
}

.main-content .long.phone-number,
.main-content .long.social-security-number,
.main-content .short.account-number {
	width: 36px;
}

.main-content input.social-security-number.last-four {
	width: 36px;
}

.main-content .long.date-of-birth {
	width: 40px;
}

.main-content form .name-instructions {
	padding: 10px;
	font-weight: bold;
}

.main-content .amount {
	text-align: right;
}

/* Icons */
.main-content form ul.icons {
	width: auto;
}

/* Date Picker */
.main-content form input.date-picker,
.main-content form input.time-picker,
.main-content form input.date-time-picker{
	background:#FFF url(../img/icon-date-picker.png) 95% center no-repeat;
	padding-right:25px;
	width:75px;
	font-size:11px;
}
/* css for timepicker */
.main-content form input.time-picker {
	background-image: url(../img/icon-time-picker.png);
}
.main-content form input.date-time-picker{ 
	width: 130px; 
}
.ui-timepicker-div { 
	font-size: 10px; 
}
.ui-timepicker-div .ui-widget-header { 
	margin-bottom: 8px; 
}
.ui-timepicker-div dl { 
	text-align: left; 
}
.ui-timepicker-div dl dt { 
	height: 25px; 
	margin-bottom: -25px; 
}
.ui-timepicker-div dl dd { 
	margin: 0 10px 10px 65px; 
}
.ui-timepicker-div td { 
	font-size: 90%; 
}
.ui-tpicker-grid-label { 
	background: none; 
	border: none; 
	margin: 0; 
	padding: 0; 
}
.ui-widget.ui-datepicker select {
	font-size:9px;
	width:168px;
}
/* Signature */
.main-content form li.signature{
	padding-top:30px; /* For writing room on print out */
}
.signature .sign,
.signature .date{
	display:inline;
}
.signature .date{
	margin-left:50px;
}

.signature .sign:after{
	content:":__________________________________";
}
.signature .date:after{
	content:":______ / ______ / ______";
}

	/* Component (LI) with Brand Logo */

	form li.brand-logo .label-content .bank-address,
	form li.brand-logo img.brand-logo {
		float:left;
		width:220px;
	}
	
	form li.brand-logo img.brand-logo {
		margin-left:10px;
	}

/* End of General Form Styles */
/* --------------------------------------------------------------------- */

/* Widgets */
/* Widgets */
/* Widgets */
.main-content .widget,
.main-content .widget label,
.main-content .widget select,
.main-content .widget input{
	font-size: 1em;
}
.main-content .widget form li {
	width: 100%;
}
.main-content .widget form .column li label,
.main-content .widget form .column li .label-title {
	font-weight: bold;
}

.main-content .widget form .column li li label,
.main-content .widget form .column li li .label-title {
	font-weight: normal;
}

.main-content .widget form .column li {
	padding-left: 0;
}

.main-content .widget form .column li,
.main-content .widget.column form li{
	border-bottom: none;
}

.main-content .widget form .label-content li {
	padding-left: 0;
}

.main-content .widget .label-title+.label-content {
	width: 150px;
}

.main-content .widget .label-title.above + .label-content {
	width: 100%;
}

/* Error Message */
.main-content .widget form li.error {
	padding: 0;
}

/* Widget Label and Input Widths */
.main-content .widget form label,
.main-content .widget .label-title,
.main-content .widget form label.radio.short{
	width: 150px;
}

.main-content .widget form label.above,
.main-content .widget .label-title.above,
.main-content .widget form label.radio{
	width: 90%;
}

.main-content .widget select {
	margin-right: 0;
	width: 145px;
}

.main-content .widget .xx-short {
	width: 40px;
}

.main-content .widget .x-short {
	width: 60px;
}

.main-content .widget .short {
	width: 80px;
}

.main-content .widget select.long {
	width: 200px;
}

.main-content .widget select.xx-long {
	width:295px;
}

.main-content .widget form input.xx-long,
.main-content .widget form label.xx-long{
	width: 298px;
}

/* Update Account Name */
.main-content .accounts form.update-account-name {
	width: 190px;
	float: left;
}

.main-content .accounts form.update-account-name input {
	margin-right: 0;
	text-align: left;
	width: 185px;
}

.main-content .accounts form.update-account-name li {
	border-bottom: none;
	padding:0;
}
.main-content .accounts form.update-account-name li .btn {
	float:left;
	margin-top:5px;
}
/* Custom widget LI spacing */
.main-content .billpay-container form .payment li,
.main-content .sched-pay-and-trans form li,
.main-content .transfer-funds form li{
	padding:5px 0;
}
.main-content .billpay-container form .payment .control-list li{
	padding:0;
}
.main-content #add-payee_add-payee-for-business-with-account-number-submit .x-long {
	width: 410px;
}

/* End of Widgets */
/* --------------------------------------------------------------------- */

/* Component Formatting */
/* Component Formatting */
/* Component Formatting */

/* Confirm pop-up */
.pop-up.form-style.confirm {
	padding: 10px;
}

/* Tabs */
.main-content .tab-panes .pane form {
	margin: 0 -10px;
	width: auto;
}
.main-content .tab-panes .pane form,
.pane-content form {
	border:none;
	background:transparent;
}
/* Transfer Funds */
.main-content .transfer-funds form .field-detail li{
	list-style-type:none;
	padding:0;
}
.main-content .transfer-funds form li .label-content label.singleAccountLabel{
	display:none;
}

/* Make a Payment */
.main-content form .amount-to-pay-w-options .label-title,
.main-content form .amount-to-pay-w-options .field-detail {
	display:list-item;
	float:none;
}
.main-content form .amount-to-pay-w-options .label-title{
	margin-bottom:0;
}
.main-content form .amount-to-pay-w-options .field-detail{
	margin:0 0 10px 10px;
}

/* Scheduled Payments and Transfers */
.main-content .sched-pay-and-trans form{
	margin-bottom: 0px;
}

/* Account List */
.main-content form.account-list li{
	padding-left:0;
	padding-right:0;
	width:100%;
}

.main-content form ul.account-list {
	background-color:transparent;
	margin-bottom:0;
}

/* Toggles */
.main-content .toggle form{
	margin-bottom:0;
}

/* Forms in Pop-ups */
.pop-up .main-content form,
.pop-up .form-style,
body.form-style {
	border-radius: 0;
    border: none;
	-webkit-box-shadow: none;
}
.pop-up form,
.pop-up.form-style {
	width: auto;
	padding: 0;
	border:none;
}
.pop-up form{
	margin-bottom:0;
}
.pop-up.form-page-style {
	background-color: #EFEFEF;
	padding:0;
}
.pop-up .main-content .form-style ul{
	float:none;
}
/* Forms in panes */
/* Forms in panes */
/* Forms in panes */

.main-content .tab-panes form {
    width: auto;
}

/* Forms in panes */

/* BDC Enrollment Form */
.main-content.mobile-responsive select {
	background: url(/images/br_down.png) no-repeat right #fff;
    font-weight: bold;
    border-radius: 2px;
    width: 35%;
    height: 40px;
    line-height: normal;
    padding: 5px 15px;
    color: #000;
    font-family: "Roboto", "Helvetica Neue", "Helvetica", sans-serif;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.main-content.mobile-responsive li {
	background-image: none;
	padding-left: 0;
	border: none
}

.main-content.mobile-responsive form {
	background-color: white;
	border: none;
	box-shadow: none;
	background: white;
}

.main-content.mobile-responsive form label,
.main-content.mobile-responsive form .label-content {
	float: none;
	margin: 0;
}

.main-content.mobile-responsive input.phone-number {
	width: 40px;
	height: 30px;
    float: left;
    margin-right: 10px;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border: 1px solid #ccc;
    padding: 3px 3px;
    transition: box-shadow .3s ease-in-out;
 }
 
.main-content.mobile-responsive input.phone-number:focus {
	border-color: #ccc !important;
	box-shadow: 0 0 4px 0 rgba(7, 184, 169, .7);
	outline: 2px solid #6495ed;
}
 
.main-content.mobile-responsive .stay-together > * {
  	padding-right: 6px;
  	padding-top: 6px;
}

/* END BDC Enrollment Form */
/* BDC Exlore Form */
.main-content.mobile-responsive .bdc-explore-form li {
	list-style-type: disc;
	padding: 0;
}

.main-content.mobile-responsive .bdc-explore-form .pricing-detail li {
	list-style-type: none;
}

.main-content.mobile-responsive .bdc-explore-form .pricing-detail .price-detail-title-li{
	padding-bottom: 10px;
	text-decoration: strong;
}

.main-content.mobile-responsive .bdc-explore-form .pricing-detail .price-detail-li {
	list-style-type: none;
}

/* END BDC explore */

.tooltip .tooltip-link {
	color: white;
	text-decoration: underline;
}