/**************************************************/
/*                    WebFonts                    */
/**************************************************/

@font-face {
    font-family: 'proximaNova';
    src: url('../fonts/proximanova-regular-webfont.eot');
    src: url('../fonts/proximanova-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/proximanova-regular-webfont.woff') format('woff'),
         url('../fonts/proximanova-regular-webfont.ttf') format('truetype'),
         url('../fonts/proximanova-regular-webfont.svg#proximaNova') format('svg');
    font-weight: normal;
    font-style: normal;
}

/**************************************************/
/*                     Font                       */
/**************************************************/
/*Fonts should only be defined as pixels on the html element. Other elements should use REM units.*/
html {
	font-size:13px;
}
body {
	font-family: 'proximaNova', Arial, sans-serif;
	font-size:1rem;
}
/*Link colors. To target data section only add main in front of the selector*/
a, a:visited {
	color:#136dd6;
}
a:hover, a:active {
	color:#06438a;
}
p {
    color:#333333;
}
/*Negative Account Balance*/
.text--negative {
	color:#ff0000;
}

/*Buttons*/
.button,.button.secondary{
	background-color:#cc1241; text-transform:uppercase; font-weight:bold; font-size:.9rem;
	color:#fff;
}
.button:hover,.button:focus, .button.secondary:hover, .button.secondary:focus{
	background-color:#88a9ba;
	color:#fff;
}
.accordion{
	padding-left:0 !important;
}
.accordion-title {
	background-color:#cc1241; text-transform:uppercase;
	color:#fff;
}
 .accordion-title:hover {
	background-color:#88a9ba;
	color:#fff;
}
.button.button-link:hover, .button.button-link:focus:enabled{
	color:#06438a;
}
.button.button-link {
	color:#136dd6;
	font-weight:bold;
}
/*OPTIONAL FONTS*/
input, select {

}
h1, h2, h3, .h1, .h2, .h3 {

}
h4, h5, h6, .h4, .h5, .h6 {

}
h1, .h1 {
	font-size:1.70rem;
}
h2, .h2 {
	font-size:1.40rem;
}
h3, .h3 {
	font-size:1.30rem;
}
h4, .h4 {
	font-size:1.10rem;
}
h5, .h5 {
	font-size:1rem;
}
h6, .h6 {
	font-size:.90rem;
}
h1 {color:#06438a;}
h2, h3 {color:#6a6a6a;}

/*Various alerts messages */
.alert--error {
	background:#fbeae9;
	border-color:#f7d6d3;
	color:#ad3123;
}
.alert--info {
	background:#d9edf7;
	border-color:#bce8f1;
	color:#2e6a87;
}
.alert--success {
	background:#dff0d8;
	border-color:#d6e9c6;
	color:#3a703c;
}
.alert--warning {
	background:#fffdd5;
	border-color:#ffe89e;
	color:#8c6b33;
}
.text--error {
	color:#ad3123;
}
.text--info {
	color:#2e6a87;
}
.text--muted {
	color:#999;
}
.text--success {
	color:#3a703c;
}
.text--warning {
	color:#8c6b33;
}
/**************************************************/
/*                     Layout                     */
/**************************************************/
body {
	background:#FFF;
}

/*Initiate flex layout*/
div.ebc-main > div.columns {
	display: flex;
	flex-direction:column;
}
header, footer {
	flex:none;
}
main {
	flex:1 0 auto;
	padding:var(--space) var(--space) 0;
	background:rgba(255,255,255,0.7);
}	
main::after{
	content: '\00a0';
	display:block;
	margin-top:var(--space);
	height:0px;
	visibility:hidden;
}

.wrapper {
	/*Fix for iPhones width */
	min-width:initial;
	/* Never make webpage less than 1100px wide */
}
/*Contains the Utility Navigation, Banner, and Primary Navigation*/
[role="banner"] {
	margin:0px;
}
body > div.row{

}
main{
	
}
main#main{
	max-width:1100px; width:100%; margin:0 auto; padding:20px 10px;
} 
main#main h2 {
	padding-top:10px;
}
header{
	width:100%; margin:0 auto !important;
}
header > div.row:nth-child(2){
	background-color:transparent; 
}
header div.row{

}
header > div.row.collapse:nth-of-type(2) {/*border-bottom:40px solid #00387a;*/}

header > div.row.collapse:nth-of-type(2) div.medium-12:first-of-type{
	float:none !important; max-width:1100px; margin:0 auto !important; float:none;
}
div.row.collapse.grid.expanded.no-print-information {
	
}
[role="banner"] {

}
[role="banner"] > div.row:first-child, [role="banner"] > div.row:first-child > div.medium-12 {
	
}
.bank-branding {
	background:url('../images/logo.png') no-repeat; height:40px; margin:28px 0 28px 10px;
}
.medium-12 {
}

table tr th {
	background-color:#00387a !important;
	color:#ffffff !important;
}
/*Transaction Table odd even row colors*/
table tbody tr:nth-child(odd){
	background:#f1f1f1;
}
table tbody tr:nth-child(even){
	background:#fff;
}

div [ng-controller*="AccountBalanceController"] {

}
.row {
	max-width:100%;
}
/*Reorder Home Page Right Column*/
#home-right {
	order:1;
	display:flex;
	flex-direction:column;
}
#home-pay-or-transfer {
	order:;
}
#home-quick-launch {
	order:;
}
#home-ad {
	order:;
}
#home-beavercreek {
	order:;
}
/*Fixes Home page ad resizing issue*/
#home-ad-viewer > ul, #home-ad-viewer > ul > li {
	height:auto !important;
	max-height:none !important;
}
/*correcting a wrapping issue with long transaction descriptions*/
#accounts-transactions table td div.ng-scope{
	word-wrap: break-word; word-break: break-all; word-break: break-word; overflow-wrap:break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto;
}
/**************************************************/
/*            Table Drop Shadows                  */
/**************************************************/
.slat {
	border-color:#c9c9c9;
	background-color:#FFFFFF;
}
/* Home Page Hover on Accounts BG */
.slat.slat--clickable:hover {
	background:#EEEEEE;
}
.table--underlined>thead>tr>th, .table--underlined>tbody>tr>th, .table--underlined>tbody>tr>td {

}
.table--underlined>thead tr:last-child th {

}
.table--underlined>tbody tr:last-child td, .table--underlined .no-border {
	border-bottom-width:0;
}
.table--underlined>tfoot td {
}

table.table--transfers tbody td {
}
.arrow {

}
.arrow--top-right:after {
	
}
.form__group--inline + p.push--large--one-quarter {
	display:none;
}

div.singleAccount .grid, .checkfree-widget-container, #home-beavercreek,#home-ad, #table--transactions, #searchTransactionsForm, div [data-ui-component*="account-details"], div [data-bind*="modal-wrapper"], #scheduled-transfers, #stopPaymentAdd, #stopPaymentList, #iframe, div [data-bind*="ChangePassword"], div [data-bind*="ChallengeQuestions"], div [data-bind*="with: Email"], div [data-bind*="with: Phone"],div [data-bind*="with: Phone"] + div.slat, div [data-bind*="with: Mobiliti"],div [data-bind*="with: Email"] + div.slat, div.slat, div [ng-controller*="FocusController"], div [ng-controller*="WireListController"], div [ng-controller*="TransferListController"], ul.accordion, table.table--stop-payments, div.callout.ng-scope, div#transactions-left, div#transactions-right{
	
}
form[name*="loginForm"] div.slat, div[ng-if*="!transferIssue"], div[ng-if*="!stopPayIssue"], form[name*="smallBusinessBillPayEnrollmentForm"] div.slat--last, div [ng-controller*="ProfileController"], div [ng-controller*="ReviewWireListController"] {

}
div [data-bind*="ChangePassword"], div [data-bind*="ChallengeQuestions"], div [data-bind*="with: Email"], div [data-bind*="with: Phone"],div [data-bind*="with: Phone"] + div.slat, div [data-bind*="with: Mobiliti"],div [data-bind*="with: Email"] + div.slat {
	margin-bottom:10px;
}

.mfp-content main {

}
.mfp-content div [data-bind*="modal-wrapper"] {

}
.callout, table.table--transfers tbody, table.table--stop-payments tbody, div.callout.ng-scope div.medium-12, .table--transactions-full tbody{
	background-color:transparent;
}
div [ng-controller*="FocusController"] table tbody tr td {

}
div [ng-controller*="FocusController"], div [ng-controller*="WireListController"], div [ng-controller*="TransferListController"] {
	padding:5px;
}


/*Transactions Padding */
div#accounts-transactions, div#accounts-transactions-search {
	
}
/* blends background of the More Transactions button on Account pages*/
table {background:#FFF; display:table !important;}
table tbody tr.batch1button {background:#FFF;}
table tbody tr.batch1button td {border-bottom:none;}

/* Changing Debit Colors */
td[ng-bind*="tran.DebitAmount"] {} 

/* Changing Credit Colors */
td[ng-bind*="tran.CreditAmount"] {} 

/*fixes insonsistent background on Stop Payment dropdowns*/
table.table--stop-payments tbody tr:nth-child(even), table.no-margin-bottom tbody tr {background-color: #f7f7f7;}
/**************************************************/
/*            Account Switcher                    */
/**************************************************/
#account-switcher-show {
	
}
#table--transactions tbody tr:nth-child(even), .table--trans-recent tbody tr:nth-child(even), #scheduled-transfers .table--underlined tbody tr:nth-child(even), #stopPaymentList .table--underlined tbody tr:nth-child(even), .table--underlined tbody tr:nth-child(even) {
	
}

button#account-switcher-show {
	font-size:1.6rem;
}
#account-switcher-show, #accountSwitcherHide, #account-switcher {

}
ul#account-switcher {
	background-color:#00387a;
	border: 1px solid #c9c9c9;
}
ul#account-switcher li {
	border-bottom:1px solid #FFF;
}
ul#account-switcher li a {
	color:#FFF; font-weight:normal;
}
ul#account-switcher li:hover {
	background:#416b9c;
}
ul#account-switcher li a:hover {

}


div#inactivityWarning {margin:0 auto; position:relative;}


/**************************************************/
/*            Utility Navigation                  */
/**************************************************/
/*Position of Utility Section*/
header div.collapse:nth-child(1) {

}
header div.collapse:nth-child(1) div.medium-12:nth-child(1) {
	max-width:1100px; margin:0 auto; float:none;
}              

/*Welcome Message*/
.message--welcome {
	margin-top:2px;
}
.message--welcome p {
	color:#6a6a6a;
}

/*Utility Navigation Buttons*/
.nav--utility {

}
.nav--utility li { 

}

.nav--utility a{
	color:#6a6a6a;
}

	.nav--utility a[href*="contact"]{background: transparent url('../images/contact.png') left no-repeat; padding-left:20px; margin-left:5px;}
	.nav--utility a[href*="location"]{background: transparent url('../images/location.png') left no-repeat; padding-left:20px; margin-left:5px;}
	.nav--utility a[href*="Mail"] {background: transparent url('../images/email.png') left no-repeat; padding-left:20px; margin-left:5px;}
	.nav--utility a[href*="Chat"] {background: transparent url('../images/chat.png') left no-repeat; padding-left:20px; margin-left:5px;}
	.nav--utility a[href*="Alerts"] {background: transparent url('../images/alerts.png') left no-repeat; padding-left:20px; margin-left:5px;}
	.nav--utility a[href*="Profile"] {background: transparent url('../images/profile.png') left no-repeat; padding-left:20px; margin-left:5px;}
	.nav--utility a[href*="Logout"] {background: transparent url('../images/logout.png') left no-repeat; padding-left:20px; margin-left:5px;}
	.nav--utility a[href*="Login"] {background: transparent url('../images/login.png') left no-repeat; padding-left:20px; margin-left:5px;}


.nav--utility a:hover {
	color:#000;
}

	.nav--utility a[href*="contact"]:hover {background: transparent url('../images/contact-hover.png') left no-repeat;}
	.nav--utility a[href*="location"]:hover {background: transparent url('../images/location-hover.png') left no-repeat;}
	.nav--utility a[href*="Mail"]:hover {background: transparent url('../images/email-hover.png') left no-repeat;}
	.nav--utility a[href*="Chat"]:hover {background: transparent url('../images/chat-hover.png') left no-repeat;}
	.nav--utility a[href*="Alerts"]:hover {background: transparent url('../images/alerts-hover.png') left no-repeat;}
	.nav--utility a[href*="Profile"]:hover {background: transparent url('../images/profile-hover.png') left no-repeat;}
	.nav--utility a[href*="Logout"]:hover {background:transparent url('../images/logout-hover.png') left no-repeat;}
	.nav--utility a[href*="Login"]:hover {background: transparent url('../images/login-hover.png') left no-repeat;}

/**************************************************/
/*            Primary Navigation                  */
/**************************************************/
header div.row.collapse:nth-of-type(3){
	/*height:100px; background:#416b9c; border-top:4px solid #FFF;*/
	height:36px; background:#00387a;
}
#badge-administration{
	margin-left: 5px;
}
.nav--primary {
	max-width:1100px; margin:0 auto; /*display: flex; flex-wrap: wrap; justify-content: center;*/
}
.nav--primary li{
	/*border-left:1px solid #FFF;*/
}
.nav--primary li:first-child {border-left:none;}
.nav--primary a, .nav--primary li.is--selected a {
	/*line-height:84px;*/ color:#FFF; font-size:1.4rem; font-weight:bold; background:transparent;
}
.nav--primary a:hover, .nav--primary li.is--selected a:hover {
	background:#FFF; color:#00387a;
}

/**************************************************/
/*            Account Navigation                  */
/**************************************************/
.nav--secondary {

}
.nav--secondary li a {
	background-color:#cc1241; text-transform:uppercase; font-weight:bold; color:#FFF; font-size:.9rem;
}

.nav--secondary li.is--selected a, .nav--secondary li.is--selected a:hover, .nav--secondary li a:hover {
	background:#88a9ba;
}
/**************************************************/
/*                 Footer                         */
/**************************************************/
.page--footer {
	width:100%; background:url('../images/ftr-border.png') repeat-x center -1px #00387a; padding-top:80px; margin-bottom:0;
}
.page--footer, .page--footer + div{

}
.page--footer div.medium-12 {

}
footer .callout {
	max-width:1100px; width:100%; margin:0 auto;
}
/*Hide FDIC/EHL Text*/
footer .callout > p.float-left {

}
footer nav{
	max-width:1100px; width:100%; margin:0 auto; padding:0 0 40px 0;
}
footer .callout p {
	color:#FFF; font-size:.9rem;
}
footer a.navitem {
	color:#FFF; font-size:1.1rem;
}

footer a.navitem:hover {
	color:#d0d0d0;
}

/**************************************************/
/*                Media Queries                   */
/**************************************************/
@media screen and (max-width: 960px) {
	.nav--primary a, .nav--primary li.is--selected a {padding:6px 12px !important; font-size:1.3rem;}
}
@media screen and (max-width: 800px) {
	/*This ensure ACH is visible at 768px*/
	main, main#main{
		padding:10px 0px;
	}


	.nav--primary a, .nav--primary li.is--selected a {padding:6px 8px !important; font-size:1.2rem;}
}
@media screen and (max-width: 700px) {
	.nav--primary a, .nav--primary li.is--selected a {font-size:1.1rem; padding:6px !important;}
}
@media screen and (max-width: 639px) {
	html {
		font-size:12px;
	}
	main#main {
		padding:10px;
	}
	header {height:auto;}
	
	/* 100% width for the Welcome Message and right aligned nav1 */
	header div.collapse:nth-child(1) div.medium-12:nth-child(1) div.float-right {width:100%;}
	.message--welcome {width:100%; padding:5px 5px 0 5px;}
	.message--welcome p:first-child {float:left;}
	.message--welcome p:last-child {float:right;}
	.nav--utility {width:100%; text-align:right;}
	/************************/

	.nav--utility a, .nav--utility a:hover {color:transparent; height:40px; width:40px;}
  
	.nav--utility a[href*="contact"]{background: transparent url('../images/contact-24.png') left no-repeat;}
	.nav--utility a[href*="location"]{background: transparent url('../images/location-24.png') left no-repeat;}
	.nav--utility a[href*="Mail"] {background: transparent url('../images/email-24.png') left no-repeat;}
	.nav--utility a[href*="Chat"] {background: transparent url('../images/chat-24.png') left no-repeat;}
	.nav--utility a[href*="Alerts"] {background: transparent url('../images/alerts-24.png') left no-repeat;}
	.nav--utility a[href*="Profile"] {background: transparent url('../images/profile-24.png') left no-repeat;}
	.nav--utility a[href*="Logout"] {background: transparent url('../images/logout-24.png') left no-repeat;}
	.nav--utility a[href*="Login"] {background: transparent url('../images/login-24.png') left no-repeat;}

	
	.nav--utility a[href*="contact"]:hover {background: transparent url('../images/contact-24-hover.png') left no-repeat;}
	.nav--utility a[href*="location"]:hover {background: transparent url('../images/location-24-hover.png') left no-repeat;}
	.nav--utility a[href*="Mail"]:hover {background: transparent url('../images/email-24-hover.png') left no-repeat;}
	.nav--utility a[href*="Chat"]:hover {background: transparent url('../images/chat-24-hover.png') left no-repeat;}
	.nav--utility a[href*="Alerts"]:hover {background: transparent url('../images/alerts-24-hover.png') left no-repeat;}
	.nav--utility a[href*="Profile"]:hover {background: transparent url('../images/profile-24-hover.png') left no-repeat;}
	.nav--utility a[href*="Logout"]:hover {background:transparent url('../images/logout-24-hover.png') left no-repeat;}
	.nav--utility a[href*="Login"]:hover {background: transparent url('../images/login-24-hover.png') left no-repeat;}
	
	
	header div.row.collapse:nth-of-type(3) {height:auto;}
	.nav--primary {display: block; background:#416b9c; height:auto; border-bottom:1px solid #416b9c;}
	.nav--primary li {height:50px; border-left:none; border-top:1px solid #FFF;}
	.nav--primary a, .nav--primary li.is--selected a  {line-height:37px; text-align:center; font-size:1.4rem;}
	
}
@media screen and (max-width: 410px) {
	.bank-branding {background-size:97%;}
}
@media screen and (max-width: 360px) {
	html {
		font-size:10px;
	}
	thead th, td {
		padding: 0px 2px;
		font-size: 1rem;
	}
}
@media print {
	html {
		font-size:14px;
	}
	header {
		display:none;
	}
	main{
		margin:0 !important;
	}
	main#main {
		height:50px;
		width:inherit;
		padding:0px;
	}
	div.ebc-main > div.columns {
		display: inherit;
	}
	div#transactions-left{
		width:100%;
	}
	footer {
		display:none;
	}
}