/*
Theme Name: Bank Pinnacle
Version: 112.1
Requires at least: 4.7
Requires PHP: 5.2.4
Author: Pinnacle Bank wp
Description: The Pinnacle Bank for WordPress takes us back to the blog, featuring a full range of post formats, each displayed beautifully in their own unique way. Design details abound, starting with a vibrant color scheme and matching header images, beautiful typography and icons, and a flexible layout that looks great on any device, big or small.
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------

	0. 	CSS Reset
	1. 	Document Setup
	2. 	Element Base
	3. 	Helper Classes
	4. 	Site Header
	5. 	Menu Modal
	6. 	Search Modal
	7. 	Page Templates
		a. 	Template: Cover Template
		c. 	Template: Full Width
	8.  Post: Archive
	9.  Post: Single
	10. Blocks
	11. Entry Content
	12. Comments
	13. Site Pagination
	14. Error 404
	15. Widgets
	16. Site Footer
	17. Media Queries

----------------------------------------------------------------------------- */


/* -------------------------------------------------------------------------- */

/*	0. CSS Reset
/* -------------------------------------------------------------------------- */


@import url('https://use.typekit.net/ekx6vxv.css');

* { margin: 0px; padding: 0px; -webkit-font-smoothing: antialiased; box-sizing: border-box; -webkit-box-sizing: border-box; -webkit-text-size-adjust: none; }
html, body {  width: 100%; font-size: 16px; line-height: 24px; color: #17215C; font-family: "Area Normal"; background: #fff; }

*::-webkit-input-placeholder { opacity:1; color: #999899; }
*::-moz-placeholder {opacity:1;color: #999899; }
*:-ms-input-placeholder {opacity:1;color: #999899; }

input[type=checkbox]{ -webkit-appearance: checkbox; margin: 0px 0 0 0px; display: inline-block; vertical-align: top; }
button, input, textarea, select { -webkit-appearance: none; -webkit-border-radius: 0px; font-family: 'Area Normal'; }
input, textarea {-webkit-appearance: none;-webkit-border-radius: 0px; font-family: 'Area Normal' !important;}

:focus,input:focus, textarea:focus { outline: none; }
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; vertical-align: baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
:focus { outline: none; }

/* common */
a { transition: all 0.5s; -webkit-transition: all 0.5s; -ms-transition: all 0.5s; text-decoration: none; outline: none; }
ul { list-style: none; }
.clear { clear: both; overflow: hidden; }
img { border: 0px; outline: none; display: block; max-width: 100%; }

.flexed { display: flex; -webkit-display: flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; }
.flex-center { align-items:center; -webkit-align-items:center; }
.flex-space-between { justify-content: space-between; -webkit-justify-content: space-between; }

h1,h2,h3,h4,h5,h6 { font-family: 'Area Extended'; font-weight: 700;  }

h1 { color: #0E153E; font-family: 'Area Extended'; font-size: 48px; font-style: normal; font-weight: 800; line-height: normal; letter-spacing: 1.44px; }
h2 { padding: 0 0 25px; color: #17215C; font-family: 'Area Extended'; font-size: 24px; font-style: normal; font-weight: 600; line-height: 1.4; }
h3 { font-size: 32px; line-height: 1.2; font-family: 'Area Extended'; }
h4 { font-size: 20px; line-height: 24px; }
h5 { font-size: 18px; line-height: 22px; }
h6 { font-size: 16px; line-height: 20px; }

p { padding-bottom: 20px; }

.listing li { padding: 0 0 0 30px; position: relative; }
.listing li:before { width: 5px; height: 5px; border-radius:50%; -webkit-border-radius:50%; -ms-border-radius:50%; background:#000; content:''; position:absolute; left:0px; top:13px; } 

.locationlink {
	padding: 10px 0 0;
    }
    
   .locationlink a {
  color: #73243e;
  font-size: 22px;
  font-weight: 700;
  text-transform: uppercase;
  font-family: 'Area Normal';
  }


.transition-announcement { background: #4FBE73; color: #17215C; padding: 10px 40px; width: 100%; box-sizing: border-box; }
.transition-announcement__inner { max-width: 1600px; margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px 24px; }
.transition-announcement__text { margin: 0; font-family: 'Area Normal', sans-serif; font-weight: 600; font-size: 17px; color: #17215C; line-height: 1.3; padding: 0; vertical-align: middle; }
.transition-announcement__buttons { display: flex; flex-wrap: wrap; gap: 14px; }
.transition-announcement__btn { display: inline-block; background: transparent; color: #17215C; font-family: 'Area Normal', sans-serif; font-weight: 700; font-size: 14px; padding: 8px 20px; border: 1.5px solid #17215C; border-radius: 4px; text-decoration: none; line-height: 1.2; transition: background .2s ease, color .2s ease; }
.transition-announcement__btn:hover, .transition-announcement__btn:focus { background: #17215C; color: #fff; }
@media (max-width: 768px) {
	.transition-announcement { padding: 10px 16px; }
	.transition-announcement__inner { flex-direction: column; text-align: center; gap: 10px; }
	.transition-announcement__text { font-size: 15px; }
	.transition-announcement__buttons { flex-wrap: nowrap; width: 100%; gap: 10px; }
	.transition-announcement__btn { flex: 1 1 0; min-width: 0; text-align: center; font-size: 13px; padding: 8px 10px; }
}

.news_detail_sec .author-footer,
.author-footer { position: relative; display: block; height: 327px; margin: 50px 0; overflow: hidden; background-color: #0E153E; background-image: url('assets/images/jamie-footer-bg.png'); background-repeat: no-repeat; background-position: center center; background-size: cover; color: #fff; }
.author-footer__photo { position: absolute; left: 134px; top: 29px; width: 341px; height: 299px; }
.author-footer__photo img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: bottom center; }
.author-footer__body { position: absolute; left: 517px; top: 64px; right: 40px; }
.news_detail_sec .author-footer__name,
.author-footer .author-footer__name { font-family: 'Area Extended', sans-serif; font-weight: 700; font-size: 36px; line-height: 34px; letter-spacing: 0.72px; color: #fff; margin: 0 0 20px; padding: 0; }
.news_detail_sec .author-footer__title,
.author-footer .author-footer__title { font-family: 'Area Extended', sans-serif; font-weight: 700; font-size: 24px; line-height: 36px; letter-spacing: 0.5px; color: #31D0FF; margin: 0; padding: 0; }
.news_detail_sec .author-footer__nmls,
.author-footer .author-footer__nmls { font-family: 'Area Extended', sans-serif; font-weight: 700; font-size: 16px; line-height: 36px; letter-spacing: 0.32px; color: #fff; margin: 0; padding: 0; }
.news_detail_sec .author-footer__email,
.author-footer .author-footer__email { font-family: 'Area Extended', sans-serif; font-weight: 700; font-size: 16px; line-height: 36px; letter-spacing: 0.32px; color: #fff; margin: 0; padding: 0; }
.author-footer__email a { color: #fff; text-decoration: none; border-bottom: 1px solid transparent; transition: border-color .2s ease; }
.author-footer__email a:hover, .author-footer__email a:focus { border-color: rgba(255,255,255,0.6); }
.news_detail_sec .author-footer__phones,
.author-footer .author-footer__phones { font-family: 'Area Extended', sans-serif; font-weight: 700; font-size: 16px; line-height: 36px; letter-spacing: 0.32px; color: #fff; margin: 0; padding: 0; }
.author-footer__phones .label { color: #31D0FF; font-weight: 700; }
.author-footer__phones .sep { color: #31D0FF; padding: 0 12px; }
.author-footer__phones a { color: #fff; text-decoration: none; border-bottom: 1px solid transparent; transition: border-color .2s ease; }
.author-footer__phones a:hover, .author-footer__phones a:focus { border-color: rgba(255,255,255,0.6); }
@media (max-width: 1100px) {
	.author-footer__photo { left: 60px; width: 280px; height: 246px; }
	.author-footer__body { left: 380px; top: 50px; }
}
@media (max-width: 768px) {
	.news_detail_sec .author-footer,
	.author-footer { display: flex; flex-direction: column; height: auto; padding: 32px 24px; text-align: center; }
	.author-footer__photo { position: static; width: 220px; height: auto; margin: 0 auto 20px; }
	.author-footer__body { position: static; }
	.news_detail_sec .author-footer__name,
	.author-footer .author-footer__name { font-size: 28px; line-height: 1.1; margin-bottom: 10px; }
	.news_detail_sec .author-footer__title,
	.author-footer .author-footer__title { font-size: 20px; line-height: 1.3; margin-bottom: 8px; }
	.news_detail_sec .author-footer__nmls,
	.news_detail_sec .author-footer__email,
	.news_detail_sec .author-footer__phones,
	.author-footer .author-footer__nmls,
	.author-footer .author-footer__email,
	.author-footer .author-footer__phones { line-height: 1.6; }
	.author-footer__phones .sep { padding: 0 8px; }
}

/* ── Community child pages (About > Community Events, VCF, CRA, Employee, School) ── */
.community-page { position: relative; }
.community-wrapper { max-width: 1240px; margin: 0 auto; padding: 0 40px; }
.community-hero { position: relative; width: 100%; height: 425px; background: #d9d9d9; }
.community-hero .community-hero__img { display: block; width: 100%; height: 100%; object-fit: cover; }
.community-hero__logo { position: absolute; right: 130px; bottom: -64px; width: 234px; z-index: 2; }
.community-hero__logo img { display: block; width: 100%; height: auto; }
.community-intro { position: relative; padding: 80px 0 60px; }
.community-intro .community-eyebrow { font-family: 'Area Extended', sans-serif; font-weight: 500; font-size: 18px; letter-spacing: 0.54px; color: #17215C; text-transform: uppercase; margin: 0 0 20px; }
.community-intro .community-title { font-family: 'Area Extended', sans-serif; font-weight: 800; font-size: 32px; letter-spacing: 0.96px; color: #17215C; margin: 0 0 30px; line-height: 1.15; }
.community-intro__body { font-family: 'Area Normal', sans-serif; font-weight: 600; font-size: 20px; letter-spacing: 0.8px; color: #17215C; line-height: 1.5; max-width: 868px; }
.community-intro__body p { margin: 0 0 16px; }
.community-intro__body p:last-child { margin-bottom: 0; }
.community-divider { width: 229px; height: 3px; background: #31D0FF; border: 0; margin: 30px 0 0; }
.community-intro__icon { position: absolute; right: 130px; top: 80px; width: 174px; }
.community-intro__icon img { display: block; width: 100%; height: auto; }
.community-intro__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 340px); gap: 56px; align-items: center; }
.community-intro--has-image .community-intro__body { max-width: none; }
.community-intro__media img { display: block; width: 100%; height: auto; border-radius: 16px; }

.community-collage-section { padding: 40px 0 80px; }
.community-collage__intro { font-family: 'Area Normal', sans-serif; font-size: 18px; color: #17215C; margin: 0 0 32px; max-width: 868px; }
.community-collage { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
.community-collage__cell { aspect-ratio: 256 / 248; overflow: hidden; border-radius: 16px; background: #f5f5f5; }
.community-collage__cell:nth-child(3),
.community-collage__cell:nth-child(4) { grid-column: span 2; aspect-ratio: 541 / 248; }
.community-collage__cell img { width: 100%; height: 100%; object-fit: cover; display: block; }

.community-two-col { padding: 60px 0; }
.community-two-col.has-gray-bg { background: #f5f5f5; }
.community-two-col__grid { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: 60px; align-items: center; }
.community-two-col__grid.is-image-right { grid-template-columns: minmax(0, 1fr) minmax(0, 340px); }
.community-two-col__image img { width: 100%; height: auto; display: block; }
.community-two-col__image img[src$=".svg"] { width: auto; max-width: 240px; margin: 0 auto; }
.community-two-col__heading { font-family: 'Area Extended', sans-serif; font-weight: 800; font-size: 32px; letter-spacing: 0.96px; color: #17215C; margin: 0 0 20px; line-height: 1.15; }
.community-two-col__body { font-family: 'Area Normal', sans-serif; font-weight: 600; font-size: 20px; color: #17215C; line-height: 1.5; }
.community-two-col__body p { margin: 0 0 16px; }
.community-two-col__body p:last-child { margin-bottom: 0; }
.community-two-col__body strong { font-weight: 800; }
.community-two-col__grid.is-image-right .community-two-col__image { order: 2; }

.community-card-grid { padding: 60px 0; }
.community-card-grid__inner { display: grid; gap: 30px; }
.community-card-grid.cols-2 .community-card-grid__inner { grid-template-columns: repeat(2, 1fr); }
.community-card-grid.cols-3 .community-card-grid__inner { grid-template-columns: repeat(3, 1fr); }
.community-card-grid.cols-4 .community-card-grid__inner { grid-template-columns: repeat(4, 1fr); }
.community-card { background: transparent; }
.community-card.has-bg { background: #f5f5f5; padding: 32px; }
.community-card__image { margin: 0 0 20px; }
.community-card__image img { width: 100%; height: auto; display: block; }
.community-card__heading { font-family: 'Area Extended', sans-serif; font-weight: 800; font-size: 24px; color: #17215C; margin: 0 0 12px; line-height: 1.2; }
.community-card__copy { font-family: 'Area Normal', sans-serif; font-size: 16px; color: #17215C; line-height: 1.5; margin: 0 0 18px; }
.community-card__copy p { margin: 0 0 12px; }
.community-card__copy ul, .community-intro__body ul, .community-two-col__body ul { list-style: disc; padding-left: 24px; margin: 0 0 12px; }
.community-card__copy ul li, .community-intro__body ul li, .community-two-col__body ul li { margin: 0 0 4px; line-height: 1.5; }

.community-embed { padding: 40px 0 80px; }
.community-embed__heading { font-family: 'Area Extended', sans-serif; font-weight: 800; font-size: 24px; color: #17215C; margin: 0 0 24px; text-align: center; }
.community-embed__body { min-height: 200px; }

.community-cta { background: #0E153E; padding: 56px 0; color: #fff; }
.community-cta .community-cta__heading { font-family: 'Area Extended', sans-serif; font-weight: 800; font-size: 32px; letter-spacing: 0.96px; color: #fff; margin: 0 0 18px; line-height: 1.15; }
.community-cta .community-cta__body { font-family: 'Area Normal', sans-serif; font-weight: 600; font-size: 20px; color: #fff; line-height: 1.4; margin: 0 0 28px; max-width: 868px; }
.community-cta .community-cta__body p { margin: 0 0 16px; color: #fff; }
.community-cta .community-cta__body p:last-child { margin-bottom: 0; }
.community-cta__form { margin-top: 28px; max-width: 720px; }
.community-cta__form .wpcf7-form > p { margin: 0 0 20px; color: #fff; }
.community-cta__form .wpcf7-form label { display: block; color: #fff; font-family: 'Area Normal'; font-weight: 600; padding-bottom: 8px; font-size: 15px; }
.community-cta__form .wpcf7-form-control:not(.wpcf7-submit) { display: block; width: 100%; padding: 10px 14px; border: 1px solid rgba(255,255,255,0.4); background: rgba(255,255,255,0.08); color: #fff; border-radius: 4px; font-family: 'Area Normal'; font-size: 16px; box-sizing: border-box; }
.community-cta__form textarea.wpcf7-form-control { min-height: 120px; resize: vertical; }
.community-cta__form .wpcf7-form-control:not(.wpcf7-submit)::placeholder { color: rgba(255,255,255,0.6); }
.community-cta__form .wpcf7-form-control:not(.wpcf7-submit):focus { outline: none; border-color: #31D0FF; }
.community-cta__form .wpcf7-form .messagebg { display: block; font-size: 13px; color: rgba(255,255,255,0.7); margin-bottom: 16px; }
.community-cta__form .wpcf7-submit { display: inline-block; background: transparent !important; color: #31D0FF; border: 2px solid #31D0FF; padding: 10px 24px; font-family: 'Area Extended'; font-weight: 800; letter-spacing: 0.6px; border-radius: 3px; cursor: pointer; font-size: 15px; margin-top: 4px; }
.community-cta__form .wpcf7-submit:hover { background: #31D0FF !important; color: #0E153E; }

.vallant-events-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.vallant-events-list__item { margin: 0; }
.vallant-events-list__link { display: flex; gap: 20px; align-items: center; padding: 18px 20px; background: #F8F8F8; border-left: 4px solid #31D0FF; border-radius: 4px; text-decoration: none; color: #17215C; transition: background .15s ease, transform .15s ease; }
.vallant-events-list__link:hover { background: #EFF8FB; transform: translateX(2px); }
.vallant-events-list__date { flex: 0 0 64px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 8px 0; background: #17215C; color: #fff; border-radius: 4px; line-height: 1; }
.vallant-events-list__month { font-family: 'Area Extended', sans-serif; font-size: 12px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; padding-bottom: 2px; }
.vallant-events-list__day { font-family: 'Area Extended', sans-serif; font-size: 24px; font-weight: 800; }
.vallant-events-list__body { display: flex; flex-direction: column; gap: 4px; }
.vallant-events-list__title { font-family: 'Area Extended', sans-serif; font-size: 18px; font-weight: 700; color: #17215C; }
.vallant-events-list__meta { font-family: 'Area Normal', sans-serif; font-size: 14px; color: #5A6378; }
.vallant-events-list__venue { font-family: 'Area Normal', sans-serif; font-size: 13px; color: #5A6378; }
.vallant-events-empty { font-family: 'Area Normal', sans-serif; font-size: 16px; color: #5A6378; text-align: center; padding: 32px 0; }

.community-btn { display: inline-block; font-family: 'Area Extended', sans-serif; font-weight: 900; font-size: 15px; letter-spacing: 0.6px; padding: 12px 24px; border-radius: 3px; border: 2px solid #31D0FF; color: #0E153E; background: transparent; text-decoration: none; line-height: 1.2; transition: background .2s ease, color .2s ease; }
.community-btn:hover, .community-btn:focus { background: #31D0FF; color: #0E153E; }
.community-btn--dark { color: #0E153E; }
.community-cta .community-btn,
.community-btn--outline-cyan { color: #fff; }
.community-cta .community-btn:hover,
.community-cta .community-btn:focus,
.community-btn--outline-cyan:hover,
.community-btn--outline-cyan:focus { background: #31D0FF; color: #0E153E; }

@media (max-width: 900px) {
	.community-hero { height: 320px; }
	.community-hero__logo { right: 24px; bottom: -40px; width: 160px; }
	.community-intro { padding: 56px 0 40px; }
	.community-intro .community-title,
	.community-two-col__heading,
	.community-cta .community-cta__heading { font-size: 26px; }
	.community-intro__body, .community-two-col__body, .community-cta .community-cta__body { font-size: 17px; }
	.community-intro__icon { position: static; margin-top: 24px; width: 120px; }
	.community-intro__grid { grid-template-columns: 1fr; gap: 28px; }
	.community-two-col__grid, .community-two-col__grid.is-image-right { grid-template-columns: 1fr; gap: 28px; }
	.community-two-col__grid.is-image-right .community-two-col__image { order: 0; }
	.community-card-grid.cols-2 .community-card-grid__inner,
	.community-card-grid.cols-3 .community-card-grid__inner,
	.community-card-grid.cols-4 .community-card-grid__inner { grid-template-columns: 1fr; }
	.community-collage { grid-template-columns: repeat(2, 1fr); gap: 16px; }
	.community-collage__cell, .community-collage__cell:nth-child(3), .community-collage__cell:nth-child(4) { grid-column: auto; aspect-ratio: 1 / 1; }
}

.work_more.bankers-cols-2 { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 40px; }
.work_more.bankers-cols-3 { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 32px; }
.work_more.bankers-cols-2 > h2, .work_more.bankers-cols-2 > h3, .work_more.bankers-cols-3 > h2, .work_more.bankers-cols-3 > h3 { grid-column: 1 / -1; }
@media (max-width: 900px) {
	.work_more.bankers-cols-3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
	.work_more.bankers-cols-2, .work_more.bankers-cols-3 { grid-template-columns: 1fr; }
}

.page-template-template-business-and-commercial-credit-card .column-top { justify-content: flex-start !important; }
.page-template-template-business-and-commercial-credit-card .column-item .column-bottom .wp-block-button__link { height: auto !important; }
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 .column-item > .column-bottom .form-wrap { margin-top: auto !important; }
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 .column-item > .column-bottom .bottom-buttons { margin-top: 0 !important; padding-top: 24px !important; }

.page-id-60 .contentintrobar .textbg h4.ql-heading { margin: 0 0 28px; }
.page-id-60 .contentintrobar .textbg .ql-block { line-height: 1.6; }
.page-id-60 .contentintrobar .textbg .leadership-closing { margin-top: 28px; font-weight: 700; color: #17215C; }
.page-id-60 .leadership-grid { display: flex; justify-content: space-between; align-items: flex-start; gap: 40px; margin: 60px 0 20px; flex-wrap: wrap; }
.page-id-60 .leadership-card { flex: 1; min-width: 220px; max-width: 320px; text-align: center; margin: 0; padding: 0; }
.page-id-60 .leadership-card img { display: block; width: 100%; max-width: 260px; height: auto; margin: 0 auto 20px; }
.page-id-60 .leadership-card .leadership-name { font-family: 'Area Extended', sans-serif; font-weight: 700; font-size: 22px; color: #17215C; margin: 0 0 6px; line-height: 1.2; }
.page-id-60 .leadership-card .leadership-title { font-family: 'Area Normal', sans-serif; font-weight: 400; font-size: 15px; color: #17215C; margin: 0; line-height: 1.4; }
.page-id-60 .leadership-card .leadership-title .sep { color: #00B5C2; margin: 0 6px; }
@media (max-width: 768px) {
	.page-id-60 .leadership-grid { flex-direction: column; align-items: center; gap: 40px; }
	.page-id-60 .leadership-card { max-width: 280px; }
}

.page-id-794 .inner-banner-bar.meet_pinny_banner { background-position: right top !important; height: auto !important; min-height: 0 !important; max-height: none !important; aspect-ratio: 2055 / 639; }
.page-id-794 .inner-banner-bar.meet_pinny_banner .wrapper,
.page-id-794 .inner-banner-bar.meet_pinny_banner .wrapper2 { max-height: none !important; }
@media (max-width: 900px) {
	.page-id-794 .inner-banner-bar.meet_pinny_banner { aspect-ratio: auto !important; min-height: 300px !important; height: 300px !important; max-height: 300px !important; background-position: 80% center !important; background-size: cover !important; }
}
.page-id-501 .busines-contant-bar.loans .info ul { padding-bottom: 0; }
.page-id-151 .contentintrobar.graybg { background-color: transparent; }
.page-id-151 .mortgage_contant_bar { display: none; }

.page-id-794 .contentintrobar .textbg:after { content: ""; display: block; width: 110px; height: 3px; background: #00B5C2; margin: 24px 0 4px; }

.pinny-howitworks { background: #f4f4f4; padding: 80px 0 100px; width: 100%; }
.pinny-howitworks .wrapper { max-width: 1210px; margin: 0 auto; padding: 0 20px; }
.pinny-howitworks .howitworks-grid { display: flex; gap: 60px; align-items: flex-start; flex-wrap: wrap; }
.pinny-howitworks .howitworks-images { flex: 0 0 42%; max-width: 42%; position: relative; padding-bottom: 220px; }
.pinny-howitworks .howitworks-images .atm-photo { display: block; width: 100%; height: auto; border-radius: 4px; }
.pinny-howitworks .howitworks-images .standing-pinny { position: absolute; right: -200px; bottom: -50px; width: 100%; height: auto; z-index: 2; }
.pinny-howitworks .howitworks-content { flex: 1; min-width: 0; }
.pinny-howitworks .howitworks-content h2,
.pinny-howitworks .howitworks-content h3 { color: #4CB856; font-family: 'Area Extended'; font-size: 32px; font-weight: 700; line-height: 1.2; margin: 32px 0 16px; }
.pinny-howitworks .howitworks-content h2:first-child,
.pinny-howitworks .howitworks-content h3:first-child { margin-top: 0; }
.pinny-howitworks .howitworks-content p { color: #17215C; font-size: 18px; line-height: 1.5; margin: 0 0 14px; font-family: 'Area Normal'; }
.pinny-howitworks .howitworks-content p strong { font-weight: 700; }
.pinny-howitworks .howitworks-content ul { list-style: none; padding: 0; margin: 8px 0 18px; }
.pinny-howitworks .howitworks-content ul li { position: relative; padding-left: 18px; font-size: 18px; color: #17215C; line-height: 1.7; font-family: 'Area Normal'; }
.pinny-howitworks .howitworks-content ul li:before { content: "\2022"; position: absolute; left: 0; top: 0; color: #17215C; font-size: 18px; line-height: 1.7; }
.pinny-howitworks .howitworks-content ol { list-style: decimal outside !important; padding-left: 28px; margin: 8px 0 22px; }
.pinny-howitworks .howitworks-content ol li { display: list-item !important; list-style: decimal outside !important; font-size: 18px; color: #17215C; line-height: 1.8; font-weight: 700; font-family: 'Area Normal'; padding-left: 6px; }
.pinny-howitworks .howitworks-content ol li::marker { color: #17215C; font-weight: 700; }
@media (max-width: 900px) {
  .pinny-howitworks .howitworks-grid { flex-direction: column; gap: 28px; }
  .pinny-howitworks .howitworks-images { flex: 0 0 100%; max-width: 100%; padding-bottom: 0; }
  .pinny-howitworks .howitworks-images .standing-pinny { right: 2%; bottom: 0; width: 35%; }
  .page-template-template-pinny-atm .contentintrobar .textbg ul,
  .page-template-template-pinny-atm .contentintrobar .textbg ul li { text-align: left; }
}
#back-to-top { box-shadow: 0px 0px 15px rgba(0,0,0,0.4) inset; -webkit-box-shadow: 0px 0px 15px rgba(0,0,0,0.4) inset; -ms-box-shadow: 0px 0px 15px rgba(0,0,0,0.4) inset; position: fixed; bottom: 20px; display: none; right: 15px; z-index: 9999; width: 34px; height: 34px; cursor: pointer; border-radius: 50%; -webkit-border-radius: 50%; transition: opacity 0.2s ease-out; -webkit-transition: opacity 0.2s ease-out; opacity: 0; background: #006bb6; }
#back-to-top:after { width: 0px; height: 0px; content: ''; position: absolute; left: 50%; top: 50%; border: 10px solid transparent; border-bottom-color: #fff; margin: -15px 0 0 -10px; }
#back-to-top.show { opacity: 0.8; }


#back-to-top.show:hover { opacity: 1; }
a.close, a.mobilemenu { display: none; }

#wrapper { padding-bottom: 0; width: 100%; position: relative; }

.wrapper { max-width: 1170px; padding: 0 15px; position: relative; margin:0 auto; }
.wrapper2 { max-width: 1230px; padding: 0 15px; position: relative; margin:0 auto; }

/*header-part*/
#header-part { width: 100%; background: #17215C; }

/* header-bar */
.header-bar, #header-part { position: relative;z-index: 111; }
.header-bar { padding: 0 15px; display: flex; flex-wrap: wrap; max-width: 1400px; margin: 0 auto; }
.fdic-sign-bar { position: absolute; top: 16px; left: 0; right: 0; max-width: 1400px; margin: 0 auto; padding: 0 15px 0 28px; pointer-events: none; }
.fdic-sign-bar img { display: block; width: 390px; max-width: 100%; height: auto; }
.header-bar .logo { padding: 52px 5px 30px 13px; width: 33%; }
.header-bar .header-right { padding: 23px 3px 8px 0px; width: 67%; }
.header-bar .topmenu { padding-bottom: 13px; width: 100%; display: flex; justify-content: flex-end; align-content: center; }
.header-bar .topmenu ul { list-style: none; display: flex; align-items: center; }
.header-bar .topmenu li { padding: 0px 22px 0px 9px; }
.header-bar .topmenu li a { display: flex; align-content: center; color: #FFF; font-family: 'Area Normal'; font-size: 12px; font-style: normal; font-weight: 400; line-height: normal; letter-spacing: 0.36px; }
.header-bar .topmenu li a img { display: block; margin-right: 5px; }
.header-bar .topmenu li a:hover { color: #31D0FF; }
.header-bar .topmenu li a { }
.header-bar a.tel { color: #31D0FF; font-family: 'Area Normal'; font-size: 12px; font-style: normal; font-weight: 800; line-height: normal; letter-spacing: 0.36px;
 }
.header-bar .innermenubg { display: flex; width: 100%; align-items: center; justify-content: flex-end; }
.header-bar .innermenubg ul { list-style: none; display: flex; justify-content: flex-end; }
.header-bar .innermenubg ul.menu > li { padding: 0px 11px 0px 0px; }
.header-bar .innermenubg li a { color: #FFF; text-align: right; font-family: 'Area Normal'; font-size: 14px; font-style: normal;font-weight: 400; line-height: normal; letter-spacing: 0.42px; transition: 0s all; }
.header-bar .innermenubg li a:hover { color: #31D0FF !important; font-weight: 700; font-family: 'Area Normal'; }
.header-bar .innermenubg li.current-menu-item > a,
.header-bar .innermenubg li.current-menu-parent > a,
.header-bar .innermenubg li.current-menu-ancestor > a,
.header-bar .innermenubg li.current_page_item > a,
.header-bar .innermenubg li.current_page_parent > a,
.header-bar .innermenubg li.current_page_ancestor > a,
.header-bar #mega-menu-wrap-primary #mega-menu-primary > li.mega-current-menu-item > a.mega-menu-link,
.header-bar #mega-menu-wrap-primary #mega-menu-primary > li.mega-current-menu-parent > a.mega-menu-link,
.header-bar #mega-menu-wrap-primary #mega-menu-primary > li.mega-current-menu-ancestor > a.mega-menu-link,
.header-bar #mega-menu-wrap-primary #mega-menu-primary > li.mega-current_page_item > a.mega-menu-link,
.header-bar #mega-menu-wrap-primary #mega-menu-primary > li.mega-current_page_parent > a.mega-menu-link,
.header-bar #mega-menu-wrap-primary #mega-menu-primary > li.mega-current_page_ancestor > a.mega-menu-link { color: #31D0FF !important; font-weight: 700; font-family: 'Area Normal'; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:has(.mega-current-menu-item) > a.mega-menu-link,
.header-bar #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:has(.mega-current-menu-parent) > a.mega-menu-link,
.header-bar #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:has(.mega-current-menu-ancestor) > a.mega-menu-link,
.header-bar #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:has(.current-menu-item) > a.mega-menu-link,
.header-bar #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:has(.current-menu-parent) > a.mega-menu-link,
.header-bar #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:has(.current-menu-ancestor) > a.mega-menu-link,
.header-bar #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:has(.current_page_item) > a.mega-menu-link,
.header-bar #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:has(.current_page_parent) > a.mega-menu-link,
.header-bar #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:has(.current_page_ancestor) > a.mega-menu-link,
.header-bar .innermenubg ul.menu > li:has(.current-menu-item) > a,
.header-bar .innermenubg ul.menu > li:has(.current-menu-parent) > a,
.header-bar .innermenubg ul.menu > li:has(.current-menu-ancestor) > a,
.header-bar .innermenubg ul.menu > li:has(.current_page_item) > a,
.header-bar .innermenubg ul.menu > li:has(.current_page_parent) > a,
.header-bar .innermenubg ul.menu > li:has(.current_page_ancestor) > a { color: #31D0FF !important; font-weight: 700; font-family: 'Area Normal'; }
.header-bar .innermenubg { }
.header-bar .innermenubg a.login { padding: 5px 10px; line-height: 21px; display: inline-block; border-radius: 3px; border: 2px solid #31D0FF; color: #31D0FF; font-family: 'Area Extended'; font-size: 13px; font-style: normal; font-weight: 800; letter-spacing: 0.52px; background: #0E153E; text-transform: none; }
.header-bar .innermenubg a.login:hover { background: #31D0FF; color: #fff; }
.header-bar .innermenubg { }
.header-bar { }
.header-bar { }

.header-bar #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link { padding: 0px 20px 0px 11px; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item > ul.mega-sub-menu { padding: 40px 0; /*opacity: 1 !important; visibility: visible;*/ margin-top: 18px; min-height: 463px; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item > ul.mega-sub-menu:after { content: ""; position: absolute; left: 0; right: 0; top: -18px; height: 18px; display: block; z-index: 11; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item#mega-menu-item-22110 > ul.mega-sub-menu { min-height: 585px; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item#mega-menu-item-22111 > ul.mega-sub-menu { min-height: 585px; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item > ul.mega-sub-menu:before { content: ""; position: absolute; left: 50%; top: 0px; width: 100vw; height: 100%; transform: translateX(-50%); background: #0e153f url(assets/images/footer-bg.png) right -115px top no-repeat; background-size: auto 100%; display: block!important; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item > ul.mega-sub-menu li.mega-menu-item { padding: 0px 0px 0px 60px; position: relative; z-index: 10; width: 33.33%; max-width: 350px; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item > ul.mega-sub-menu li.widget_text { padding: 8px 45px 0px 60px; max-width: 300px; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item > ul.mega-sub-menu li.mega-menu-item:nth-child(2) { padding-left: 50px; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item > ul.mega-sub-menu li.mega-menu-item:not(:last-child):after { content: ""; position: absolute; right: 0px; top: 0px; width: 2px; height: 100%; background: #2fbeec; display: block; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item > ul.mega-sub-menu li.mega-menu-item ul { display: block; position: relative; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item > ul.mega-sub-menu li.mega-menu-item ul.sub-menu { padding-left: 50px; display: block; position: absolute; left: 100%; top: 0px; border-left: #2fbeec solid 2px; height: 100%; width: 350px; display: none; min-height: 383px; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item#mega-menu-item-22111 > ul.mega-sub-menu li.mega-menu-item ul.sub-menu { width: 400px;}

.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item > ul.mega-sub-menu li.mega-menu-item ul li { padding: 0px 30px 13px 0; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item#mega-menu-item-22111 > ul.mega-sub-menu li.mega-menu-item ul.sub-menu li { padding-bottom: 6px; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item > ul.mega-sub-menu li.widget_text h4 { font-family: 'Area Extended'; letter-spacing: 0.56px; padding-bottom: 20px; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item > ul.mega-sub-menu li.widget_text p { font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; letter-spacing: 0.32px; font-family: 'Area Normal'; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item > ul.mega-sub-menu li.widget_text p strong { font-weight: 800; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item > ul.mega-sub-menu li.mega-menu-item ul li:last-child { padding-bottom: 0px; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item > ul.mega-sub-menu li.mega-menu-item ul li a:hover { font-family: 'Area Normal'; color: #31D0FF; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item > ul.mega-sub-menu li.mega-menu-item ul li a.mega-menu-link { padding: 0px; }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item > ul.mega-sub-menu { }
.header-bar #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item-has-children > a.mega-menu-link > span.mega-indicator { display: none; }
.header-bar .mobileshow { display: none; }
#wrapper { overflow-x: hidden; }

/* Homepage */

a.accountopen { position: fixed; right: 0px; top: 40%; width: 46px; display: block; z-index: 99; }
a.accountopen img { display: block; width: 100%; height: auto; margin: 0; }

.hero-bar { position: relative; }
.hero-bar img { width: 100%; height: auto; max-height: 393px; object-fit: cover; mix-blend-mode: multiply; opacity: 0.9; z-index: 10; position: relative; }
.hero-bar:after { content: ""; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background: linear-gradient(173deg, #31D0FF -15.97%, #0E153E 109.88%); }
.hero-bar h1 { padding: 0px 20px; margin: 0px; text-align: center; position: absolute; left: 0px; top: 50%; z-index: 12; transform: translateY(-50%); color: #FFF;
text-align: center; font-family: 'Area Extended'; font-size: 48px; font-style: normal; font-weight: 700; line-height: normal; letter-spacing: 1.44px; width: 100%; }
.hero-bar .videobg { position: relative; }
.hero-bar .videobg video { width: 100%; height: auto; object-fit: cover; }
.hero-bar.videobgmain:after { opacity: 0; visibility: hidden; }
.hero-bar { }

.introcontent-bar { padding: 45px 0px 78px 0px; text-align: center; background: #efefef; }
.introcontent-bar .wrapper { max-width: 845px; }
.introcontent-bar h2 { padding: 0px 0px 30px; margin: 0px; color: #17215C; font-family: 'Area Extended'; font-size: 24px; font-style: normal; font-weight: 600; line-height: 1.25; }
.introcontent-bar h2 strong { font-weight: 900; }
.introcontent-bar p { padding: 0px 0px 35px; color: #17215C; font-family: 'Area Normal'; font-size: 16px; font-style: normal; font-weight: 600;
line-height: 125.378%; }
.introcontent-bar { }
.introcontent-bar { }
.introcontent-bar { }

.imgcontent-bar { position: relative; margin-top: -65px; }
.imgcontent-bar .wrapper { max-width: 1270px; padding: 0px; }
.imgcontent-bar .bankingbox { display: flex; flex-wrap: wrap; }
.imgcontent-bar .item-block { padding: 0 50px; width: 50%; text-align: center; }
.imgcontent-bar figure { border-bottom: #32d0ff solid 3px; }
.imgcontent-bar figure img { display: block; margin: 0 auto; }
.imgcontent-bar .info { padding: 20px 45px 50px; }
.imgcontent-bar h3 { padding: 0px 0px 18px; color: #17215C; font-family: 'Area Extended'; font-size: 32px; font-style: normal; font-weight: 700; line-height: normal; letter-spacing: 0.96px; }
.imgcontent-bar p { padding-bottom: 25px; color: #17215C; font-family: 'Area Normal'; font-size: 16px; font-style: normal; font-weight: 600; line-height: 123.378%; }
.imgcontent-bar { }
.imgcontent-bar { }
.imgcontent-bar { }
.imgcontent-bar { }

.middlebanner-bar { position: relative; }
.middlebanner-bar .mainimg { display: block; width: 100%; height: auto; object-fit: cover; }
.middlebanner-bar .text { padding: 11px 15px 20px 40px; position: absolute; right: 50%; top: 50%; margin-right: -588px; max-width: 100%; width: 390px; border-left: #fff solid 3px; transform: translateY(-45%); min-height: 220px; }
.middlebanner-bar h3 { padding: 0px 0px 21px; color: #0E153E; font-family: 'Area Extended'; font-size: 32px; font-style: normal; font-weight: 800; line-height: normal; letter-spacing: 0.96px; }
.middlebanner-bar p { padding-bottom: 20px; color: #0E153E; font-family: 'Area Normal'; font-size: 16px; font-style: normal; font-weight: 600; line-height: 123.378%; }
.middlebanner-bar.block2 { border-bottom: #34d1fe solid 7px; -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.2); box-shadow: 0 2px 2px 0 rgba(0,0,0,0.2); }
.middlebanner-bar.block2 .mainimg { object-position: top; }
.middlebanner-bar.block2 .text { right: auto; left: 50%; margin: 0px 0px 0px -620px; width: 550px; transform: translateY(-53%); border-left: #32d0ff solid 3px; }
.middlebanner-bar.block2 { }
.middlebanner-bar.block2 { }
.middlebanner-bar.block2 { }
.middlebanner-bar { }
.middlebanner-bar { }
.middlebanner-bar { }

.contentimglist-bar { padding: 52px 0px 0px 0px; overflow: hidden; }
.contentimglist-bar .wrapper { padding: 0px 0px 0px 80px; max-width: 1400px; display: flex; flex-wrap: wrap; }
.contentimglist-bar .text { padding: 20px 40px 0px 42px; width: 39%; border-left: #31D0FF solid 3px; }
.contentimglist-bar .text h3 { padding-bottom: 20px; color: #17215C; font-family: 'Area Extended'; font-size: 32px; font-style: normal; font-weight: 800; line-height: normal; letter-spacing: 0.96px; }
.contentimglist-bar .text p { padding-bottom: 30px; color: #17215C; font-family: 'Area Normal'; font-size: 16px; font-style: normal; font-weight: 600; line-height: 123.378%; }
.contentimglist-bar .text a.button { padding: 5px 22px; }
.contentimglist-bar .text { }
.contentimglist-bar .text { }
.contentimglist-bar .imagelist { width: 61%; }
.contentimglist-bar .imagelist ul { list-style: none; display: flex; width: 100%; }
.contentimglist-bar .imagelist li { padding: 0 20px 0 6px; width: 33.33%; }
.contentimglist-bar .imagelist li img { display: block; width: 100%; height: 262px; object-fit: cover; }
.contentimglist-bar .imagelist { }
.contentimglist-bar .imagelist { }
.contentimglist-bar .imagelist { }
.contentimglist-bar .imagelist { }
.contentimglist-bar .imagelist { }
.contentimglist-bar .imagelist { }
.contentimglist-bar { }
.contentimglist-bar { }
.contentimglist-bar { }
.contentimglist-bar { }
.contentimglist-bar { }
.contentimglist-bar { }

/* Homepage */



/* .right-bar */
.header-bar .right-bar { width: 84.6%; }
.header-bar a.mobilemenu { display: none; }

/* header-top */
.header-top { width: 100%; background: #17215C; }
.header-top .menu-main-menu-container { float: left; }
.header-top ul { padding: 0 0 0 70px; float: left; display: -webkit-flex; display: flex; justify-content: flex-end; align-items: center; }
.header-top ul li { display: inline-block; }
.header-top ul li a { padding: 4px 14px; font-size: 14px; letter-spacing: 0.36px; color: rgba(255,255,255,0.8); display: inline-block; }
.header-top a.search_icon { padding: 4px 49px 4px 62px; letter-spacing: 0.36px; font-size: 16px; margin: 0 0 0 21px; color: rgba(255,255,255,0.8); float: left; background:  url(assets/images/search-icon-custom.png) no-repeat 37px center;background-size:15px; }
.header-top a.search_icon:hover, .header-top ul li a:hover, .header-top ul li.current-menu-item a { background-color: #17215C; }
.header-top .menubg { float: right; }

/* header-midd */
.header-midd { width: 100%; background: #17215C; align-items: center; }
.header-midd ul { padding: 0 0 0 115px; float: left; }
.header-midd ul li { margin-left: 85px; display: inline-block; }
.header-midd ul li:first-child { margin-left:0; }
.header-midd ul li a { padding: 15px 0px; display: inline-block; letter-spacing: 0.26px; color: rgba(255,255,255,1); transition: all 0.5s; }
.header-midd ul li:hover a, .header-midd ul li.current-menu-item a, .header-midd ul li.current-page-ancestor a { text-decoration:underline;  color: #fff; }
.mac-os .header-bottom ul li a{padding-top:27px;padding-bottom:23px;} 
.header-midd a.login { padding: 15px 35px; min-width:340px; float: right; font-size: 20px; color: rgba(255,255,255,1); text-align: center; background: #17215C; display: inline-block; text-transform: uppercase; font-family: 'Area Normal'; font-weight:700; }
.header-midd a.login:hover { background: #074d3a; }
/* header-bottom */
.header-bottom { width: 100%; background: #fff; }
.header-bottom ul li { float: left; position: relative; }
.header-bottom ul li a { width: 228px; padding: 25px 15px; font-size: 16px; text-align: center; border-right: 1px solid #efeff0; display: inline-block; color: #5f5e5e; }

.header-bottom ul li:last-child a { border-right: 0px; padding-right: 0; }

.header-bottom ul li a:hover, .header-bottom ul.menu > li:hover > a, .header-bottom ul.menu > li.current-menu-ancestor > a { background-image: linear-gradient(#fefefe, #dcdcdd); }
.header-bottom ul.menu > li.current-menu-item > a, .header-bottom ul.menu > li.current-menu-parent > a { background-color: #fefefe; background-image: linear-gradient(#fefefe, #dcdcdd); }
.header-bottom ul li ul { position: absolute; left: 0px; top: 100%; display: none; border: #DEDFE0 solid 1px; width: 355px; background: #fff; }
.header-bottom ul li:hover > ul { display: block; }
.header-bottom ul li li.height-none ul {background: transparent;border: transparent;}
.header-bottom ul li li { float: none; border-bottom: #DEDFE0 solid 1px; }
.header-bottom ul li li a { padding: 18px 15px; position: relative; line-height: 26px; text-align: left; display: block; border: 0px; width: auto; background: none; }
.header-bottom ul li li > a:hover, .header-bottom ul li li:hover > a, .header-bottom ul li li.current-menu-item > a, .header-bottom ul li li.current-menu-parent > a { color: #fff; background: #17215C; }
.header-bottom ul li ul { }
.header-bottom ul li li { position: static; }
.header-bottom ul li li ul {
  top: -1px;
  left: 100%;
  max-height: 400px;
  min-height: 100%;
  overflow-y: scroll; /* Always show the vertical scroll bar */
  overflow-x: hidden; /* Prevent horizontal scrolling if unnecessary */
  background: #F4F4F4;
}

/* For WebKit browsers (Chrome, Safari, Edge) */
.header-bottom ul li li ul::-webkit-scrollbar {
  width: 8px; /* Ensures scrollbar is visible */
}

.header-bottom ul li li ul::-webkit-scrollbar-thumb {
  background: #999; /* Color of the scrollbar thumb */
  border-radius: 4px; /* Rounded corners for better aesthetics */
}

.header-bottom ul li li ul::-webkit-scrollbar-track {
  background: #F4F4F4; /* Matches the container's background */
}

/* Optional: For consistent behavior on Firefox */
.header-bottom ul li li ul {
  scrollbar-width: thin; /* Always show a thin scrollbar */
  scrollbar-color: #999 #F4F4F4; /* Thumb and track colors */
}


.header-bottom ul li li ul li a { background: #F4F4F4; }
.header-bottom ul li li ul li a:hover { background: #17215C; }
.header-bottom ul li li ul li a sup { font-size: 70%; vertical-align: top; }
.header-bottom ul li li.menu-item-has-children > a:after { content: ""; position: absolute; right: 15px; top: 28px; width: 10px; height: 10px; border-bottom: #72a086 solid 2px; border-right: #72a086 solid 2px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); }
.header-bottom ul li li.menu-item-has-children > a:hover:after, .header-bottom ul li li.menu-item-has-children:hover > a:after, .header-bottom ul li li.menu-item-has-children.current-menu-parent > a:after { border-bottom: #fff solid 2px; border-right: #fff solid 2px; transform: rotate(135deg); -webkit-transform: rotate(135deg); }

.mobielmenubar { display: none; }

/* banner-bar */
.parent-pageid-653 .inner-banner-bar h1 {text-transform: initial;}
.banner-bar { width: 100%; height: 390px; background-repeat: no-repeat; background-size: cover; position: relative; }
.banner-bar11:before { content: ""; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;  background: linear-gradient(
    to top,
    rgba(90, 55, 45, 0.3),   /* shadow tone: warm dark */
    rgba(240, 210, 180, 0.3)  /* highlight tone: warm light */
  ); mix-blend-mode: color;  pointer-events: none; }
.banner-bar.faqs { height: 447px; }
.banner-bar .subtext { padding: 36px 0; width: 100%; text-align: center; max-width: 1280px; justify-content: flex-end; display: flex; align-items: center; margin: 0 auto; height: 100%; }
.banner-bar .subtext .wrapper { max-width: 580px; padding: 0px; margin: 0px; }
.banner-bar .subtext h1 { color: #0E153E; font-family: 'Area Extended'; font-size: 48px; font-style: normal; font-weight: 800; line-height: 60px; letter-spacing: 1.44px; padding-bottom: 10px; }

/* content-part */
#content-part { width: 100%; position: relative; }

/* proud-bar */
.proud-bar { padding: 50px 0 120px; width: 100%; text-align: center; position: relative; z-index: 1; background-repeat: no-repeat; background-position: center; }
.proud-bar:before { content: ""; width: 100%; height: 423px; position: absolute; bottom: 0; left: 0;/* background: url(assets/images/proud_Bg.png) no-repeat center */; z-index: -1; }

.page-investment-services .proud-bar .wrapper:after { left: auto; right: 0px; }
.proud-bar h2 { padding: 0 0 10px; font-size: 30px; line-height: 1.2; }
.proud-bar p { max-width: 580px; margin: 0 auto; font-size: 18px; line-height: 31px; }
.proud-bar p em { font-size: 18px; font-family: 'Area Extended'; }
.page-id-553 .proud-bar p {max-width: 575px;}
/* accounts-abr */
.accounts-abr { padding: 0 0 100px; width: 100%; }
.accounts-abr .item-bar { margin: 0 0 45px; display: -webkit-flex; display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; }
.accounts-abr .item-bar .text { width: 45%;  }
.accounts-abr .item-bar .text .sub { margin: 0 -25px 0 0; padding: 55px 31px 55px 62px; text-align: center; background: #f0f0f0; box-shadow: 0 8px 5px -6px rgba(0,0,0,0.2); position: relative; }
.accounts-abr .item-bar .text .sub p { padding-bottom: 43px; }
.accounts-abr .item-bar .text .sub h2 { position: relative; left: 15px; font-family: 'Area Extended'; font-weight: 700; }

.learnBtn11, body .wp-block-button__link, body .wpcf7-submit { text-align: center; transition:all 0.3s; -webkit-transition:all 0.3s; background: none !important; color: #0E153E; font-size: 15px; line-height: 26px; padding: 5px 12px; cursor: pointer; font-family: 'Area Extended'; font-weight: 800; letter-spacing: 0.6px; display: inline-block; border-radius: 3px; border: 2px solid #31D0FF; }
body .wp-block-button__link:hover, body .wpcf7-submit:hover { color: #0E153E; background:#31D0FF !important; }
.wpcf7-submit { border-radius: 0px; -webkit-border-radius: 0px; cursor: pointer; }

.learnBtn { text-align: center; transition:all 0.3s; -webkit-transition:all 0.3s; background: none !important; color: #0E153E; font-size: 15px; line-height: 20px; padding: 8px 12px; cursor: pointer; font-family: 'Area Extended'; font-weight: 800; letter-spacing: 0.6px; display: inline-block; border-radius: 3px; border: 2px solid #31D0FF; }
.edu-form .form-group .learnBtn { border: 2px solid #31D0FF !important; }
.learnBtn:hover { color: #0E153E; background:#31D0FF !important; }

.accounts-abr .item-bar .image { width: 55%; position: relative; }
.accounts-abr .item-bar .image img { width: 100%; }
.accounts-abr .item-bar .image:before { content: ""; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;  background: linear-gradient(
    to top,
    rgba(90, 55, 45, 0.3),   /* shadow tone: warm dark */
    rgba(240, 210, 180, 0.3)  /* highlight tone: warm light */
  ); mix-blend-mode: color;  pointer-events: none; }
.accounts-abr .text .sub:after { content: ""; position: absolute; right: -153px; top: 0px; width: 153px; height: 100%; background-repeat: no-repeat; background-size: 100% 100%; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 600 530' preserveAspectRatio='none'%3E%3Cpolygon points='0,0 900,800 0,530' style='fill:%23f0f0f0;' /%3E%3C/svg%3E"); box-shadow: 0 8px 5px -6px rgba(0,0,0,0.2); }
.accounts-abr .item-bar .text:nth-of-type(2) .sub { margin: 0 0 0 -25px; background: #17215C; }
.accounts-abr .item-bar .text:nth-of-type(2) .sub h2 { color: #fff; left: 0; }
.accounts-abr .item-bar .text:nth-of-type(2) .sub p { color: #fff; }
.accounts-abr .item-bar .text:nth-of-type(2) .sub:after {  left: -152px; right: auto; top: 0px; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 600 530' preserveAspectRatio='none'%3E%3Cpolygon points='600,0 800,530 0,530' style='fill:%2342748d;' /%3E%3C/svg%3E"); }
.accounts-abr .item-bar:nth-of-type(2n) { flex-direction: row-reverse; }
.accounts-abr .item-bar:nth-of-type(2n) .text .sub { margin: 0 0 0 -25px; background: #17215C; }
.accounts-abr .item-bar:nth-of-type(2n) .text .sub h2 { color: #fff; left: 0; }
.accounts-abr .item-bar:nth-of-type(2n) .text .sub p { color: #fff; }
.accounts-abr .item-bar:nth-of-type(2n) .text .sub:after {  left: -152px; right: auto; top: 0px; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 600 530' preserveAspectRatio='none'%3E%3Cpolygon points='600,0 800,530 0,530' style='fill:%2317215C;' /%3E%3C/svg%3E"); }
.accounts-abr .item-bar:nth-of-type(2n) .learnBtn { color: #fff; }
.accounts-abr .item-bar:nth-of-type(2n) .learnBtn:hover { color: #0E153E; }
.accounts-abr.about { padding-bottom: 0px; }
.accounts-abr.about .item-bar { margin-bottom: 135px; }
.page-philanthropy .accounts-abr.about { padding-top: 130px; }

/* community-bar */
.community-bar { margin: 0 0 0px; width: 100%; height: 499px; background-size: cover; background-repeat: no-repeat; display: -webkit-flex; display: flex; justify-content: space-between; flex-wrap: wrap; position: relative; }
.community-bar .left { width: 46%; background: rgba(0,0,0,0.3); display: flex; align-items: center; justify-content: center; flex-wrap: wrap; position: relative; }
.community-bar .left .sub { width: 100%; text-align: center; }

.community-bar .left .video_thumb, .busines-contant-bar .video_bar .video_thumb { padding: 90px 0 0 0; display: inline-block; font-size: 18px; line-height: 22px; text-transform: uppercase; color: #fff; background: url(assets/images/video_img.png) no-repeat; background-position: center top; letter-spacing: 0.72px; }
.community-bar .left .video_thumb:hover, .busines-contant-bar .video_bar .video_thumb:hover { opacity: 0.50; }
.community-bar .left img { margin: 0 auto; }

.community-bar .right { padding: 120px 140px 120px 160px; width: 54%;background: rgba(23,33,92,0.7); text-align: center; box-shadow: -5px 0 5px -5px rgba(0,0,0,0.2);  position: relative; }
.community-bar .right h3 { padding: 0 0 80px; color: #fff; line-height: 42px; position: relative; }
.community-bar .right h3:before { content: ""; margin: 0 auto; width: 126px; height: 1px; position: absolute; bottom: 43px; left: 0; right: 0; background: rgba(255,255,255,0.75); }
.community-bar .right p { padding: 0 23px; font-size: 20px; color: #fff; }
.community-bar .video { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; }
.community-bar .video .videobg { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; }
.community-bar.onlinebanking .right { padding: 100px 140px 100px 160px; box-shadow: 0px 0 0px 0px rgba(0,0,0,0); background: none; z-index: 10; text-align: left; }
.community-bar.onlinebanking .right:before { transform: skew(-15deg,0); -webkit-transform: skew(-15deg,0); content:''; width: 5000px; height: 100%; background: rgba(2,84,66,1); position: absolute; right: 100px; top:0; }
.community-bar.onlinebanking .right p { position: relative; }
.community-bar.onlinebanking h3 { font-size: 50px; font-family: 'Area Extended'; font-weight: normal; }
.community-bar.onlinebanking h3:before { display: none; }
.community-bar.onlinebanking .textcnt { float: right; max-width: 600px; padding-right: 50px; }
.community-bar.onlinebanking:before { content: ""; z-index: 10; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background: rgba(0,0,0,0.3); }
.community-bar.onlinebanking .left { background: none; z-index: 11; }
.community-bar.onlinebanking { height: 463px; }
.community-bar.onlinebanking { }
.community-bar.onlinebanking { }
.community-bar.onlinebanking { }

/* improve-bar */
.improve-bar { margin: 0; width: 100%; position: relative; }
.improve-bar .subtext { display: -webkit-flex; display: flex; justify-content: space-between; flex-wrap: wrap; max-height: 465px; overflow: hidden; }
.improve-bar .content {width: 45%;background: #17215C;position: relative;z-index: 1;display: flex;flex-wrap: wrap;align-items: center;justify-content: flex-end;}
.improve-bar .content:after { content: ""; width: 100%; height: 100%; position: absolute;     right: -58px; top: 0px;  background: #17215C; transform-origin: bottom left; -ms-transform: skew(-14deg, 0deg); -webkit-transform: skew(-14deg, 0deg); transform: skew(-14deg, 0deg); z-index: -1; box-shadow: 2px 0 7px -2px rgba(0,0,0,.2); }
.improve-bar .content .text { width: 500px; float: right; padding: 0px 0 0; position: relative; left: 35px; height: 85%; }
.improve-bar .content .text h2 { color: #fff; font-weight: normal; font-family: 'Area Extended'; padding: 0 0 45px; letter-spacing: 0.44px; }
.improve-bar .content .text h2 a { color: #fff; }
.improve-bar .content .text p { color: #fff; padding: 0 160px 40px 0; line-height: 1.2; }
.improve-bar .image { width: 55%; }
.improve-bar .image img { width: 100%; }
.tipsmore_btn { padding: 17px 48px 21px; color: #fff; font-size: 24px; background: #17215C; position: absolute; top: -33px; right: 0; letter-spacing: 0.14px; }
.tipsmore_btn:hover { background: #31D0FF; color: #17215C; }

/* popup */
.searchbar { padding: 58px 38px 40px; text-align: center;  position: absolute; top: 50px; right: 50%; margin-right: -683px; width: 340px; background: #fff; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;  -webkit-transform: translate(0px, -100%) scale(0, 0); -moz-transform: translate(0px, -100%) scale(0, 0); -ms-transform: translate(0px, -100%) scale(0, 0); -o-transform: translate(0px, -100%) scale(0, 0); transform: translate(0px, -100%) scale(0, 0); opacity: 0; display: none; box-shadow: -4px 7px 5px -5px rgba(0,0,0,0.2); text-align: center; }
.searchbar input#s:not([type='submit']) { padding: 10px 15px 15px 45px; width: 100%; font-size: 14px; color: #333; font-family: 'Area Normal'; font-weight: 600; border: none; border-bottom: 1px solid #31D0FF; border-radius: 0px; -webkit-border-radius: 0px;background: url(assets/images/search-icon.png) no-repeat 10px center;background-size: 17px;}
.searchbar.open { -webkit-transform: translate(0px, 0px) scale(1, 1); -moz-transform: translate(0px, 0px) scale(1, 1); -ms-transform: translate(0px, 0px) scale(1, 1);
-o-transform: translate(0px, 0px) scale(1, 1); transform: translate(0px, 0px) scale(1, 1); opacity: 1; z-index: 126; display: block; }
.searchbar .close { width: 27px; height: 27px; background: rgba(160, 160, 160, 0.45); border-radius: 100%; display: flex;
align-items: center; position: absolute; top: 12px; left: 12px; cursor: pointer; }
.searchbar .close img { margin: 0 auto; }
.searchbar .btn {line-height: 21px;font-size: 16px;color: #17215C !important;letter-spacing: 0.72px;display: inline-block;text-transform: none;font-family: 'Area Normal'; font-weight: 700; margin: 40px 0 0;padding: 8px 25px;cursor: pointer;transition: all 0.5s;border-radius: 3px !important;-webkit-border-radius: 3px;border: 2px solid #31D0FF !important;background: #fff !important;}
.searchbar .btn:hover { background: #31D0FF !important; color: #17215C !important; }

/* contctbar */
.contctbar { padding: 38px 25px 8px 33px; width: 523px; background: #42748d; text-align: left; }
.contctbar h4 { padding: 0 0 48px; font-size: 25px; color: #fff; text-align: center; font-family: 'Area Extended';}
.contctbar .formbox { width: 100%; margin: 0 0 22px;  display: -webkit-flex;  display: flex; flex-wrap: wrap; justify-content: space-between; } 
.contctbar .formbox .inputfild { width: calc(50% - 15px); }
.contctbar .formbox .inputfild .wpcf7-text, .contctbar .formbox .inputfild .wpcf7-number, .contctbar .formbox .inputfild textarea { width: 100%; padding: 12px 5px; font-size: 17px; color: #0E153E; border: none; border-radius: 0px; background: #f4f4f4; }
.contctbar .formbox .wpcf7-not-valid { border: 1px solid #f00 !important; }
.contctbar .formbox .inputfild label { margin: 0 0 2px; display: block; color: #fff; font-family: 'Area Normal'; }
.contctbar .formbox .box { width: calc(100% - 0px); }
.contctbar .formbox .inputfild .huisnr { width: 130px; }
.contctbar .formbox textarea { height: 122px; resize: none; }
.contctbar .wpcf7-submit { margin: 0 0 30px; float: right; padding: 15px 21px 8px; border: 0px; }
.contctbar .formbox .item {  }
.contctbar .formbox .item h5 { padding: 0 0 5px; font-size: 18px; color: #fff; font-family: 'Area Extended'; letter-spacing: 0.34px; }
.contctbar .formbox .item p { padding: 0; color: #fff; line-height: 1.2; }
.contctbar .close { border: 1px solid #fff; }
.contctbar .phone, .contctbar a[href^="tel:"] { cursor: text; color: #fff; }
.contctbar .formbox .item .viewall { margin: 20px 0 0; display: inline-block; color: #fff; text-decoration: underline; }
.contctbar .formbox .item .viewall:hover { opacity: 0.5; }
.contctbar .messagebg { float: left; width: 50%; color: #fff; font-style: italic; font-size: 14px; line-height: 18px; }
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}
.page-id-508 .busines-contant-bar ol li {padding: 0 0 0 0px;position: relative;font-size: 20px;color: #0E153E;font-family: 'Area Normal';font-weight: 300;line-height: 29px;}
.page-id-508 .busines-contant-bar ol li strong { font-weight: 700; }

/* loginbar */
.loginbar { top: 94px; padding: 58px 38px 25px; }
.loginbar .selectinput { width: 100%; padding: 10px 5px; line-height: 24px; display: block; text-align: left; color: #333; font-family: 'Area Normal'; border: 1px solid #999899; font-size: 16px; background: url(assets/images/select_bg.png) no-repeat right center; border-radius: 0px; -webkit-border-radius: 0px; }
.loginbar .enroll { margin: 35px 0 0; display: block; color: #333; font-size: 15px; text-decoration: underline; }
.loginbar .Privacy { margin: 0;  font-size: 13px; text-decoration: none; }
.loginbar .loginoptions { position: relative; }
.loginbar .loginoptions ul { padding: 10px 0; display: none; position: absolute; left: 0px; top: 46px; width: 100%; border: 1px solid #999899; border-top: 0px; background: #fff; }
.loginbar .loginoptions li { padding: 0 15px; text-align: left; font-size: 16px; line-height: 24px; }
.loginbar .loginoptions li a { display: block; color: #999899; }
.loginbar .loginoptions li a:hover { color: #17215C; }
.loginbar .login-notice { margin: 0 0 26px; padding: 14px 16px; background: #f1f7f4; border-left: 3px solid #45B97A; color: #17215C; font-size: 13px; line-height: 1.5; text-align: left; }
.loginbar .login-notice p { margin: 0; }
.loginbar { }
.loginbar { }
.loginbar { }


/* footer-part */
#footer-part { width: 100%;  }
#footer-part .wrapper { max-width: 1400px; }

.footer-bar { padding: 30px 0px 28px 0px; background: #0e153f url(assets/images/footer-bg.png) right 115px top no-repeat; background-size: auto 100%; }
.footer-bar .wrapper { display: flex; flex-wrap: wrap; }
.footer-bar .socialicons { padding: 30px 20px 0px 32px; width: 34%; }
.footer-bar .socialicons h3 { padding-bottom: 20px; color: #31D0FF; font-family: 'Area Extended'; font-size: 28px; font-style: normal; font-weight: 700; line-height: 34px; letter-spacing: 0.56px; }
.footer-bar .socialicons ul { padding-bottom: 25px; list-style: none; display: flex; margin-left: -8px; }
.footer-bar .socialicons li { padding-right: 16px; }
.footer-bar .socialicons li a { color: #fff; font-size: 22px; }
.footer-bar .socialicons p { padding: 0px; color: #FFF; font-family: 'Area Normal'; font-size: 14px; font-style: normal; font-weight: 400; line-height: 40px; letter-spacing: 0.28px; }
.footer-bar .footer-newsletter { max-width: 360px; padding: 6px 0 24px; }
.footer-bar .footer-newsletter h4 { color: #31D0FF; font-family: 'Area Extended'; font-size: 18px; font-weight: 700; letter-spacing: 0.4px; padding: 0 0 6px; }
.footer-bar .footer-newsletter .hsfc-Heading { display: none; }
.footer-bar .footer-newsletter .hsfc-Step__Content { padding: 0; text-align: left; }
.footer-bar .footer-newsletter .hsfc-Form { font-family: 'Area Normal', sans-serif; }
.footer-bar .footer-newsletter .hsfc-RichText, .footer-bar .footer-newsletter .hsfc-RichText p { color: rgba(255,255,255,0.75); font-size: 12px; line-height: 1.45; text-align: left; }
.footer-bar .footer-newsletter .hsfc-RichText a { color: #31D0FF; }
.footer-bar .footer-newsletter .hsfc-FieldLabel { color: #fff; font-size: 13px; text-align: left; }
.footer-bar .footer-newsletter .hsfc-TextInput { padding: 8px 10px; border-radius: 3px; border: 0; font-size: 14px; }
.footer-bar .footer-newsletter .hsfc-CheckboxField span, .footer-bar .footer-newsletter .hsfc-CheckboxField label { color: rgba(255,255,255,0.85); font-size: 12px; text-align: left; }
.footer-bar .footer-newsletter .hsfc-Button { background: transparent !important; color: #fff !important; border: 2px solid #31D0FF !important; border-radius: 3px; padding: 9px 26px; font-family: 'Area Extended'; font-weight: 800; font-size: 14px; letter-spacing: 0.5px; cursor: pointer; transition: all .3s; }
.footer-bar .footer-newsletter .hsfc-Button:hover { background: #31D0FF !important; color: #0E153E !important; }
.footer-bar .footer-newsletter .hsfc-NavigationRow__Buttons { justify-content: flex-start; }
.footer-bar .footer-menu { width: 44%; }
.footer-bar .footer-menu ul { padding: 13px 0 13px 2px; list-style: none;  column-count: 2;  column-gap: 20px; position: relative; }
.footer-bar .footer-menu li { padding: 0px 0; break-inside: avoid; -webkit-column-break-inside: avoid; page-break-inside: avoid; }
.footer-bar .footer-menu li a { color: #FFF; font-family: 'Area Normal'; font-size: 14px; font-style: normal; font-weight: 400; line-height: 36px; letter-spacing: 0.28px; display: block; }
.footer-bar .footer-menu li a:hover { text-decoration: underline; }
.footer-bar .footer-menu ul:before { content: ""; position: absolute; left: 42%; top: 0px; margin-left: -2px; width: 2px; height: 100%; background: #32d0ff; }
.footer-bar .footer-menu { }
.footer-bar .footer-menu { }
.footer-bar { }
.footer-bar { }
.footer-bar { }
.footer-bar { }
.footer-bar .logosbg { position: absolute; right: 40px; bottom: 10px; display: flex; align-items: flex-end; }
.footer-bar .logosbg img { display: block; margin-left: 31px; width:42px }
.footer-bar .logosbg { }
.footer-bar .logosbg { }
.footer-bar .logosbg { }
.footer-bar { }

.footer-bar { position: relative; }
.footer-bar .wrapper { align-items: flex-start; }
.footer-bar .socialicons, .footer-bar .footer-menu, .footer-bar .footer-newsletter--cta { box-sizing: border-box; }
.footer-bar .socialicons { width: 30%; }
.footer-bar .footer-menu { width: 40%; }
.footer-bar .footerlogos { width: 0; }
.footer-bar .footer-newsletter--cta { width: 30%; max-width: none; padding: 34px 24px 0 24px; }
.footer-bar .footer-newsletter--cta h4 { font-size: 22px; line-height: 1.25; padding-bottom: 12px; }
.footer-bar .footer-newsletter--cta .footer-newsletter__blurb { margin: 0 0 20px; max-width: 300px; color: rgba(255,255,255,0.8); font-family: 'Area Normal'; font-size: 14px; line-height: 1.55; }
.footer-bar .footer-newsletter__open { background: #31D0FF; color: #0E153E; border: 2px solid #31D0FF; border-radius: 3px; padding: 11px 32px; font-family: 'Area Extended'; font-weight: 800; font-size: 14px; letter-spacing: 0.5px; cursor: pointer; transition: all .3s; }
.footer-bar .footer-newsletter__open:hover { background: transparent; color: #31D0FF; }
.newsletter-modal { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; padding: 24px; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .25s ease, visibility .25s ease; }
.newsletter-modal.is-open { opacity: 1; visibility: visible; pointer-events: auto; }
.newsletter-modal__overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(7,11,32,0.74); }
.newsletter-modal__dialog { position: relative; z-index: 1; width: 100%; max-width: 440px; max-height: 90vh; overflow-y: auto; background: #0e153f; border: 1px solid rgba(49,208,255,0.45); border-radius: 8px; padding: 38px 34px 30px; box-shadow: 0 24px 70px rgba(0,0,0,0.55); }
.newsletter-modal__close { position: absolute; top: 12px; right: 16px; padding: 4px; background: none; border: 0; color: rgba(255,255,255,0.7); font-size: 28px; line-height: 1; cursor: pointer; transition: color .2s; }
.newsletter-modal__close:hover { color: #31D0FF; }
.newsletter-modal .footer-newsletter { max-width: none; padding: 0; }
.newsletter-modal .footer-newsletter h4 { font-size: 22px; padding-bottom: 6px; }

.footer-top { padding: 20px 0 14px; width: 100%; background: #535458; }
.footer-top .wrapper { display: flex; flex-wrap: wrap; justify-content: space-between; }
.footer-top #menu-footer-menu li { padding: 0 10px 0 0px; display: inline-block; }
.footer-top #menu-footer-menu li a { display: inline-block; font-size: 20px; line-height: 1.4; color: #fff; } 
.footer-top #menu-footer-menu li:hover a { color: #17215C; }
.footer-top .right li { margin: 0 0 0 4px; width: 28px; height: 28px; display: inline-block; transition: all 0.5s; }
.footer-top .right li a { width: 28px; height: 28px; line-height: 25px; text-align: center; font-size: 12px; color: #535458; display: inline-block; opacity: 1; }
.footer-top .right li a:hover { opacity: 0.8; }
.footer-news { padding: 70px 0 25px; width: 100%; position: relative; z-index: 1; }
.footer-news:after { content: ""; width: 100%; height: 218px; position: absolute; bottom: 0; left: 0; background: url(assets/images/footer_Bg.png) no-repeat; z-index: -1; }
.footer-news h3 { padding: 0 0 10px; color: #17215C; text-align: center; }
.footer-news p { color: #535458; text-align: center; font-family: 'Area Normal'; opacity: 0.8; } 
.footer-news .wpcf7 form { padding: 0 0 0 100px; max-width: 990px; margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; }
.footer-news p { padding-bottom: 0px; }
.footer-news .wpcf7 form .box { width: calc(40% - 40px); }
.footer-news .wpcf7 form .box label { display: block; font-size: 16px; color: #999899; font-family: 'Area Normal'; }
.footer-news .wpcf7 form .box input { padding: 12px 15px; font-size: 16px; width: 100%; border: 1px solid #b6b5b6; background: #fff; border-radius: 0px; -webkit-border-radius: 0px; }
.footer-news .wpcf7 form .signbox { padding-top: 18px; width: calc(21% - 0px); } 
.footer-news .wpcf7 form .wpcf7-submit { margin: 24px 0 0; padding: 15px 0 9px; font-size: 18px; width: 100%; background: #17215C;; color: #fff; border: none; text-transform: uppercase; font-family: 'Area Normal'; transition: all 0.5s; cursor: pointer; border-radius: 0px; -webkit-border-radius: 0px; }
.footer-news .wpcf7 form .wpcf7-submit:hover { background: #17215C; }
.footer-news .wpcf7 form .box input::-webkit-input-placeholder, .contctbar .formbox .inputfild .custom_fild::-webkit-input-placeholder { color: #999899; opacity: 0.6; }
.footer-news .wpcf7 form .box input::-moz-placeholder, .contctbar .formbox .inputfild .custom_fild::-moz-placeholder {opacity:1;color: #999899; opacity: 0.6; }
.footer-news .wpcf7 form .box input:-ms-input-placeholder, .contctbar .formbox .inputfild .custom_fild:-ms-input-placeholder {opacity:1;color: #999899; opacity: 0.6;  }
.learnBtn:hover, .footer-news .wpcf7 form .sign_btn:hover { background: #17215C; }
span.wpcf7-not-valid-tip { display: none !important; }
.wpcf7-not-valid { border-color: #f00 !important; }
div.wpcf7-response-output { text-align: center; width: 100%; border: 0px; color: #f00; }
div.wpcf7-mail-sent-ok { color: #063; }
.contctbar div.wpcf7-response-output { color: #fff; border: #F57E80 solid 2px; }
.contctbar div.wpcf7-mail-sent-ok { color: #fff; border: #17215C solid 2px; }

.footer-news .fotrlist { padding: 95px 0 0; width: 100%; text-align: center; }
.footer-news .fotrlist ul { }
.footer-news .fotrlist ul li { padding: 0px 15px 0 17px; display: inline-block; font-size: 15px; color: #838383; font-size: 15px; border-left: 1px solid #838383;  position: relative; line-height: 1; font-family: 'Area Normal'; }
.footer-news .fotrlist ul li:first-child { padding-left: 0; border-left: none; }
.footer-news .fotrlist ul li:last-child { padding-right: 0; }
.footer-news .fotrlist ul li a { color: #838383; }
.footer-news .fotrlist ul li a:hover { color: #17215C; }
.footer-news .footerlogo img { position: absolute; left: 20px; bottom: 20px; }
.footer-news .footerlogo img:nth-child(2) { left: auto; right: 20px; }
.footer-news .footerlogo .footerimg2 img { left: auto; right: 20px; }
.footer-news a.closebtn { display: none; }
.footer-news a.learnBtn.mobile { display: none; }

/* karn sir css */

.button { text-align: center; transition:all 0.3s; -webkit-transition:all 0.3s; background: none !important; color: #0E153E; font-size: 15px; line-height: 20px; padding: 8px 12px; cursor: pointer; font-family: 'Area Extended'; font-weight: 800; letter-spacing: 0.6px; display: inline-block; border-radius: 3px; border: 2px solid #31D0FF;  }
.button:hover { color: #0E153E; background:#31D0FF !important; }
.button2 { border: 2px solid #FFF; background: #E3DFDF !important; }
.button2:hover { border: 2px solid #31D0FF; color: #0E153E; background:#31D0FF !important; }
.button2 { }
.btn-main { font-weight: 800 !important; }

/*inner-banner-bar*/
.inner-banner-bar { margin-bottom: 26px; width: 100%; background-position: center center; background-size:cover; position: relative; }
.inner-banner-bar112:before { content: ""; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;  background: linear-gradient(
    to top,
    rgba(90, 55, 45, 0.3),   /* shadow tone: warm dark */
    rgba(240, 210, 180, 0.3)  /* highlight tone: warm light */
  ); mix-blend-mode: color;  pointer-events: none; }
.inner-banner-bar1:before { z-index:1; content:''; width: 50%; height: 100%; position: absolute; left:0; top:0;
background: -moz-linear-gradient(left, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(left, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(to right, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=1 );
 }
 
 
.page-id-2650 .inner-banner-bar11:before {
content: '';
background: -moz-linear-gradient(left, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(left, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(to right, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=1 );
}

.page-id-2650 .inner-banner-bar .text:before {transform: skew(-28deg,0);background: rgba(2,84,66,0.70);}
.page-id-2650 .inner-banner-bar:after {
content: '';
box-shadow: 0 1px 15px rgba(0, 0, 0, 0.16);
-webkit-box-shadow: 0 1px 15px rgba(0, 0, 0, 0.16);
background-color: #f0f0f0;
z-index: 1;
}
.inner-banner-bar .text { position: relative; min-height:390px; display: flex; -webkit-display: flex; align-items:center; -webkit-align-items:center; width: 100%; max-width: 520px; color: #fff; text-align: center; }
.inner-banner-bar .text { min-height: 390px; }
.parent-pageid-227 .inner-banner-bar .text, .page-template-template-news .inner-banner-bar .text, .page-template-template-saving-accounts-parent .inner-banner-bar .text, .page-template-template-checking-accounts .inner-banner-bar .text, .page-mobile-banking .inner-banner-bar .text { min-height: 390px; }
.inner-banner-bar.about .text { min-height: 390px; }
.inner-banner-bar .text11:before { transform: skew(-28deg,0); -webkit-transform: skew(-28deg,0); content:''; width: 5000px; height: 100%; background: rgba(2,84,66,0.70); position: absolute; right:-110px; top:0; }
.inner-banner-bar { width: 100%; height:100%; content:''; }
.page-id-521 .credit-banner-bar .text h2{padding-bottom:0px;} 
.inner-banner-bar .inner { width: 100%; position: relative; z-index:1; }
.inner-banner-bar h2 { color: #0E153E; font-family: 'Area Extended'; font-size: 48px; font-style: normal; font-weight: 800; line-height: 60px; letter-spacing: 1.44px; padding-bottom: 10px; }
.inner-banner-bar .subtitle, .inner-banner-bar h1 { color: #0E153E; text-align: center; font-family: 'Area Extended'; font-size: 18px; font-style: normal; font-weight: 700; line-height: normal; letter-spacing: 1.44px; text-transform: uppercase; padding-bottom: 7px; }
.inner-banner-bar1:after { content:''; display: block; position:absolute; bottom:-26px; left: 0; width: 100%; height: 26px; box-shadow: 0 1px 15px rgba(0, 0, 0, 0.16); -webkit-box-shadow:0 1px 15px rgba(0, 0, 0, 0.16); background-color: #f0f0f0; z-index: 1; } 
.inner-banner-bar h1.customhead { font-size: 45px; line-height: 53px; color: #fff; font-family: 'Area Extended'; font-weight: normal; }

/*inner-banner2*/
.inner-banner2 { margin-bottom: 26px; text-align:center; width: 100%; min-height:390px; background-position: center center; background-size:cover; position: relative; }
.inner-banner2 .text { min-height: 390px; }
.inner-banner2 .text  { position: relative; min-height:390px; display: flex; -webkit-display: flex; align-items:center; -webkit-align-items:center; width: 100%; max-width: 1230px; padding: 0 15px; color: #fff; text-align: center; margin: 0 auto; }
.inner-banner2 .text .wrapper2 { max-width: 520px; margin: 0px; padding: 0px; }
.inner-banner2 h1 { font-size: 45px; line-height: 55px; font-family: 'Area Extended';font-weight: 700; }
.inner-banner21:after { content:''; display: block; position:absolute; bottom:-26px; left: 0; width: 100%; height: 26px; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); background-color: #f0f0f0; } 

.page-template-template-holiday .inner-banner2:after { display: none; }

/*news_detail_sec*/
.news_detail_sec { width: 100%; }
.news_detail_sec h1 { padding-bottom: 7px; color: #0E153E; font-size: 45px; line-height: 55px; font-family: 'Area Extended'; font-weight: 400; }
.news_detail_sec .date {  position: relative; z-index:1; color: #0E153E; font-size: 16px; line-height: 22px; font-family: 'Area Extended'; padding: 0 0 15px; display: block; }
.news_detail_sec .featured_banner img,
.news_detail_sec .featured_banner { width: 100%; }
.news_detail_sec .featured_banner {  margin-bottom: 49px; } 
.news_detail_sec .cont_row { border-bottom: 1px solid #535458; margin: 0 -10px 50px; padding-bottom: 20px; display: flex; -webkit-display: flex; align-items:flex-start; }
.news_detail_sec .col { padding: 0 10px; flex:1; -webkit-flex:1; }
.news_detail_sec p, .news_detail_sec li { font-size: 18px; line-height: 22px; font-family: "Myriad Pro", 'TradeGothic'; padding-bottom: 22px; color: #0E153E; }
.news_detail_sec img.featured { margin: 30px 0; width: 100%; }
.news_detail_sec .back_to_blog { color: #999899; text-decoration:underline; }
.news_detail_sec .back_to_blog .mobile { display: none; }
.news_detail_sec .back_to_blog:hover { text-decoration:none; } 
.news_detail_sec .contentblock { column-count: 2; column-gap: 40px; }

.news_detail_sec .contentblock { }
.news_detail_sec .contentblock.show_area {column-count: 1;}

.news_detail_sec .contentblock ul {
	list-style: disc;
	margin: 0 0 0 15px;
}

/*top_search_bar*/
.top_search_bar { width: 100%; overflow: hidden; }
.top_search_bar .search { float: right; width: 100%; max-width: 530px; }
.top_search_bar label { line-height: 21px; color: #999899; font-size: 16px; display: block; padding-bottom: 5px; }
.top_search_bar .search-btn1 { padding: 10px 10px; transition:all 0.3s; -webkit-transition:all 0.3s; width: 187px; float: right; height: 45px; background: #17215C; color: #ffffff; font-size: 18px; text-transform: uppercase; text-transform: uppercase; border:0; cursor: pointer; font-family: 'Area Normal'; letter-spacing: 0.02em; border-radius: 0px; -webkit-border-radius: 0px; }
.top_search_bar .search-btn1:hover { background:#17215C; }
.top_search_bar .field { width: calc(100% - 209px); float: left; height: 46px; border: 1px solid rgba(153, 152, 153, 0.72); background-color: rgba(255, 255, 255, 0.78); font-size: 16px; padding: 10px 15px; color: #999899; border-radius: 0px; -webkit-border-radius: 0px; }

/*news_sec*/
.news_sec { margin: 140px 0 7px 0; padding: 45px 0 90px; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); width: 100%; background: #f0f0f0; }
.news_sec.globalnews { margin-top: 0px; }
.news_sec .row { padding: 80px 0; margin: 0 -8px; width: calc(100% + 16px); display: flex; -webkit-display: flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; }
.news_sec .rowbg { padding: 80px 0; }
.news_sec #oldlist, .news_sec #newlist { margin: 0 -8px; width: calc(100% + 16px); display: flex; -webkit-display: flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; }
.news_sec .news_col { margin: 0 8px 18px 8px; text-align:center; padding: 0 15px 55px; width: calc(33.33% - 16px); background:#ffffff; position: relative; overflow: hidden; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); transition: transform 0.3s ease, box-shadow 0.3s ease; }
.news_sec .news_col:hover { transform: translateY(-6px); box-shadow: 0 10px 18px rgba(0, 0, 0, 0.18); -webkit-box-shadow: 0 10px 18px rgba(0, 0, 0, 0.18); }
.news_sec .news_col:after { margin: 0 -38% -38% 0; width:200px; height: 200px; background:#fafafa; content:''; position:absolute; right:0; bottom:0; transform: rotate(48deg); }
.news_sec .news_col .pic img { width: 100%; transition:all 0.3s; -webkit-transition:all 0.3s; }
.news_sec .news_col:hover img { transform: scale(1.1); -webkit-transform: scale(1.1); } 
.news_sec .news_col .pic { width: auto; display: block; margin: 0 -15px 15px; overflow: hidden; }
.news_sec h3 { position: relative; z-index:1; min-height:123px; padding-bottom: 15px; color: #17215C; font-size: 30px; line-height: 36px; font-family: 'Area Extended'; font-weight: 400; }
.news_sec h3 a { display: inline-block; color: #17215C; } 
.news_sec h3 a:hover { text-decoration: none; color: #000; } 
.news_sec .date { position: relative; z-index:1; color: #0E153E; font-size: 16px; line-height: 22px; font-family: 'Area Extended'; padding: 0 0 5px; display: block; }
.news_sec .more, .news_sec .btn1 { position: relative; z-index:1; display: block; text-decoration:underline; line-height: 21px; color: #999899; font-size: 16px; position:absolute; left:50%; transform: translate(-50%,0); -webkit-transform: translate(-50%,0); bottom:22px; }
.news_sec .more:hover, .news_sec .btn1 { color: #17215C; }
.news_sec .button, .news_sec .btn-row { display:  table; margin:55px auto 0; }
.news_sec.other { margin-top:100px; background:#fbfbfb; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16) inset; -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16) inset; text-align:center; padding:85px 0 25px; }
.news_sec.investparent { margin-top: 20px; }
.news_sec.other h2 { font-family: 'Area Extended'; font-weight:400; color: #0E153E; font-size: 40px; line-height: 50px; }
.news_sec.other .row { padding-top: 35px; }
.news_sec.resourcecenter { padding-top: 67px; margin-top: 0px; }
.news_sec.resourcecenter { }
.news_sec.resourcecenter { }
.news_sec.resourcecenter { }
.news_sec.resourcecenter { }
.news_sec.resourcecenter { }
.news_sec.resourcecenter { }

/*breadcrumb_sec*/
.breadcrumb_sec { padding: 60px 0 40px; width: 100%; }  
.breadcrumb_sec li { opacity: 0.42; color: #0E153E; font-size: 14px; display: inline-block; vertical-align: top; }
.breadcrumb_sec li a { color: #0E153E; display: block; text-decoration: underline; }
.breadcrumb_sec li a:after { content: '>'; display: inline-block; vertical-align: top; margin: 0 4px; }
.breadcrumb_sec li a:hover { text-decoration:none; }

/*error_box*/
.error_box { padding: 70px 0; width: 100%; }
.error_box .wrapper2 { display: flex; -webkit-display: flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; align-items:center; -webkit-align-items:center; justify-content:space-between; -webkit-justify-content:space-between;  }
.error_box .left { width: 50%; padding-right:50px; }
.error_box .right { max-width: 466px; width: 50%; }
.error_box h1 { color: #17215C; font-size: 64px; line-height: 70px; font-weight: normal; font-family: 'Area Extended'; }
.error_box h1 strong { font-size: 83px; line-height: 90px; display: block; font-family: 'Area Extended'; padding-bottom: 10px; }
.error_box p { color: #0E153E; font-size: 16px; line-height: 22px; padding: 20px 0 100px; font-family: 'Area Normal'; font-weight:300; }

.error_box.error_box_v2 { padding: 100px 0 80px; }
.error_box.error_box_v2 .wrapper2 { max-width: 1280px; margin: 0 auto; padding: 0 40px; gap: 40px; align-items: center; }
.error_box.error_box_v2 .left { flex: 1 1 0; min-width: 0; padding-right: 0; }
.error_box.error_box_v2 .right { flex: 0 1 560px; max-width: 560px; }
.error_box.error_box_v2 .right img { display: block; width: 100%; max-width: 100%; height: auto; margin: 0 auto; }
.error_box.error_box_v2 .eyebrow { color: #17215C; font-family: 'Area Extended', sans-serif; font-size: 18px; font-weight: 500; letter-spacing: 0.54px; text-transform: uppercase; padding: 0 0 32px; margin: 0; }
.error_box.error_box_v2 h1 { color: #17215C; font-family: 'Area Extended', sans-serif; font-size: 32px; line-height: 1.2; font-weight: 800; letter-spacing: 0.96px; padding: 0 0 24px; margin: 0; }
.error_box.error_box_v2 .lead { color: #17215C; font-family: 'Area Normal', sans-serif; font-size: 20px; line-height: 1.4; font-weight: 600; letter-spacing: 0.8px; padding: 0 0 40px; margin: 0; }
.error_box.error_box_v2 .buttons { display: flex; gap: 20px; flex-wrap: wrap; }
.error_box.error_box_v2 .buttons .button { min-width: 132px; padding: 8px 12px; text-decoration: none; line-height: 22px; }
@media (max-width: 900px) {
	.error_box.error_box_v2 { padding: 60px 0; }
	.error_box.error_box_v2 .wrapper2 { flex-direction: column-reverse; }
	.error_box.error_box_v2 .left, .error_box.error_box_v2 .right { width: 100%; max-width: 100%; }
	.error_box.error_box_v2 h1 { font-size: 26px; }
	.error_box.error_box_v2 .lead { font-size: 18px; }
	.error_box.error_box_v2 .right { max-width: 560px; margin: 0 auto; }
	.error_box.error_box_v2 .left { text-align: center; }
	.error_box.error_box_v2 .buttons { justify-content: center; flex-wrap: nowrap; gap: 10px; }
	.error_box.error_box_v2 .buttons .button { min-width: 0; flex: 1 1 0; padding: 8px 10px; font-size: 14px; }
}

/*search_sec*/
.search_sec { padding: 70px 0; width: 100%; }
.search_sec .search-bar { max-width:340px; position: relative; margin-bottom: 92px; }
.search_sec .field { padding: 0 0 10px 60px; width: 100%; height: 35px; color: #999899; font-size: 16px; border:0; border-bottom: 1px solid #999899; background: url(assets/images/search-icon.png) 10px 4px no-repeat; background-size:15px auto; border-radius: 0px; -webkit-border-radius: 0px; }
.search_sec .wrapper2 { max-width:965px; }
.search_sec .field {}
.search_sec .results { text-align:center; display: block;  padding: 20px 0 0 0; color: #848484; }
.search_sec p { line-height: 19px; letter-spacing: 0.01em; color: #5f5e5e; padding-bottom: 25px; font-family: 'Area Normal'; font-weight:300; }
.search_sec .search_row { width: 100%; padding-bottom: 50px; margin-bottom: 45px; border-bottom: 1px solid #cccccc; }
.search_sec h3 { font-size: 35px; line-height: 40px; font-family: 'Area Extended'; font-weight:normal; color: #17215C; padding-bottom: 20px; }
.search_sec h3 a { color: #17215C; } 
.search_sec .search_row:last-child { padding-bottom:0; margin-bottom:0; border-bottom:0; }

/*who_we_are_sec*/
.who_we_are_sec { display: flex; -webkit-display: flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; align-items:center; -webkit-align-items:center; padding: 70px 0 80px; width: 100%; min-height:685px; background: url(assets/images/mountain.png) center bottom no-repeat; }
.who_we_are_sec .text { margin: 0 110px 0 35px; border-left: 14px solid #17215C; padding: 0 0 0 20px; }
.who_we_are_sec .text h2 { font-family: 'Area Extended'; font-weight: 400; }
.who_we_are_sec p { line-height: 19px; padding:0; }
.who_we_are_sec h3 { width:100%; margin-top:-10px; float: left; letter-spacing: 0.02em; padding-bottom: 25px; font-size: 45px; line-height: 50px; color: #17215C; font-family: 'Area Extended'; font-weight:300; /*font-family: 'TradeGothicNextLTPro-Lt';*/ }

/*mid_banner*/
.mid_banner { width: 100%; min-height:395px; position: relative; background-position: center center; background-size:cover; display: flex; -webkit-display: flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; align-items:center; -webkit-align-items:center; background-attachment: fixed; }
.mid_banner:after { width: 100%; height: 100%; content:''; position:absolute; left:0; top:0; background: rgba(3,86,66,0.77); }
.mid_banner .wrapper2 { position: relative; z-index:1; }
.mid_banner h2 { padding-bottom: 0px; font-size: 66px; line-height:72px; color: #fff; font-family: 'Area Extended'; font-weight: 400; }

/*features_sec*/
.features_sec { padding: 130px 0 55px; margin-bottom: 90px; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); width: 100%; background: #f0f0f0; }
.features_sec .row { display: flex; -webkit-display: flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; justify-content:space-between; -webkit-justify-content:space-between;  }
.features_sec .row .col { padding: 55px 45px 125px; text-align:center; width: calc(33.33% - 25px); background:url(assets/images/box-bg.png) center bottom no-repeat; background-size: 100% auto; position: relative; margin-bottom: 40px; }
.features_sec .wrapper { max-width: 1250px; }
.features_sec h3 { padding-bottom: 25px; font-size: 30px; line-height: 36px; color: #0E153E; }
.features_sec p { letter-spacing: 0.01em; line-height: 25px; color: #0E153E; }


.features_sec ul {
    letter-spacing: 0.01em;
    line-height: 25px;
    color: #0E153E;
    list-style: disc;
    margin: 0 15px;
    padding: 0;
}

.button_rows {
    margin: 0 auto 75px;
}

.button_rows .row {
    display: flex;
    -webkit-display: flex;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    justify-content: space-between;
    -webkit-justify-content: space-between;
}

.button_rows .row .col a {
    justify-content: center;
    align-items: center;
    display: flex;
    min-height: 95px;
}


.button_rows .row .col { padding: 0 0 25px; text-align:center; width: calc(33.33% - 25px);   }
.page-id-60 .frequently_bar.faqs { padding: 0px; }

/*map_sec*/
.map_sec { width: 100%; min-height:480px; position: relative; margin-bottom: 0px; background-position: left center; background-size:cover; }
.map_sec #wpsl-wrap { margin-bottom: 0px; }
.map_sec .wpsl-search { padding: 45px 52px; z-index: 101; width: 445px; position: absolute; left: 0px; top: 115px; background: #f0f0f0; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); }
.map_sec #wpsl-result-list { display: none; }
.map_sec #wpsl-gmap { width: 100%; height: 480px !important; }
.map_sec .wpsl-input { display: block; }
.map_sec #wpsl-search-btn, .map_sec #wpsl-search-wrap div { margin: 0px; float: none; display: block; }
.map_sec .wpsl-input label { color: #535458; font-family: 'Area Normal'; font-weight: 700; font-size: 20px; font-weight: bold; float: none; width: 100%; display: block; text-align: center; }
.map_sec #wpsl-search-input { float: left; width: 145px; display: block; color: #535458; font-family: 'Area Normal'; font-size: 14px;
font-weight: 400; letter-spacing: 1.4px; border: 0px; border-bottom: 1px solid #535458; border-radius: 0px; -webkit-border-radius: 0px; background: none; }
.map_sec #wpsl-results { display: none !important; }
.map_sec #wpsl-search-wrap .wpsl-select-wrap { float: right; width: 80px; }
.map_sec .wpsl-search-btn-wrap { padding-top: 40px; width: 100%; clear: both; text-align: center; }
.map_sec #wpsl-radius label { display: none; }
.map_sec .wpsl-dropdown { border: 0px; border-radius: 0px; -webkit-border-radius: 0px; background: none; border-bottom: 1px solid #535458; }
.map_sec .wpsl-selected-item:after { border: 0px; width: 7px; height: 22px; right: 0px; margin-top: -7px; background:url(assets/images/arrow-updown.png) no-repeat; }
.map_sec #wpsl-search-btn { text-align: center; transition: all 0.3s; -webkit-transition: all 0.3s; background: #17215C; color: #ffffff; font-size: 18px; line-height: 25px; padding: 12px 42px 8px; text-transform: uppercase; border: 0; cursor: pointer; font-family: 'Area Extended'; letter-spacing: 0.02em; min-width: 188px;    display: inline-block; border-radius: 0px; vertical-align: top; }
.map_sec  #wpsl-search-btn:hover { background: #17215C; }
.map_sec { }
.map_sec { }

/*intro_sec*/
.intro_sec { padding: 60px 0 25px; width: 100%; min-height: 460px; display: flex; -webkit-display: flex; align-items: center; -webkit-align-items: center; background: url(assets/images/mountain.png) center 70px no-repeat; }
.intro_sec .text { border-left: 1px solid rgba(0,0,0,0.1); border-right: 1px solid rgba(0,0,0,0.1); max-width: 740px;margin: 0 auto; text-align: center; padding: 0 90px 30px; }
.intro_sec p { color: #17215C; font-size: 18px; line-height: 31px; }
.intro_sec h3 { font-size: 30px; line-height: 36px; padding-bottom: 10px; font-family: 'Area Extended'; font-weight: normal; color: #0E153E; }

/*full_video_sec*/
.full_video_sec { margin-bottom: 192px; text-align: center; width: 100%; min-height: 420px; background-position: center center; background-size: cover; position: relative;  display: flex; -webkit-display: flex; align-items: center; -webkit-align-items: center; }
.full_video_sec:after { width: 100%; height: 100%; content: ''; position: absolute; left: 0; top: 0; background: #42748d;  opacity: 0.71; }
.full_video_sec .video .videobg { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position:center center; }
.full_video_sec .wrapper2 { z-index: 1; position: relative; }
.full_video_sec h3 { color: #fff; line-height: 42px; }
.full_video_sec .video_thumb { padding: 90px 0 0 0; display: inline-block; vertical-align: top; margin: 50px 0 0 0; font-size: 18px; line-height: 22px; text-transform: uppercase; color: #fff; background: url(assets/images/video_img.png) no-repeat; background-position: center top; }
.full_video_sec .video_thumb:hover { opacity: 0.50; }


/*service_box*/
.service_box { padding: 185px 0 130px; width: 100%; background: #f0f0f0; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); position: relative; z-index: 10; }
.service_box .col { margin-bottom: 83px; width: calc(50% - 42px); background: #fff; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); padding: 50px; text-align: center; border-top:  25px solid #17215C;    display: flex;
    flex-wrap: wrap;align-items: center;justify-content: center;}
.service_box .row { max-width: 970px; margin: 0 auto; }
.service_box h4 { padding: 0 0 15px; line-height: 36px; color: #17215C; font-size: 30px; font-weight: 400; }
.service_box p { font-size: 16px; line-height: 29px; color: #17215C; padding-bottom: 30px; }

/*investment_sec*/
.investment_sec { text-align: center; padding: 80px 0 65px; width: 100%; }
.investment_sec h2 { padding-bottom: 100px; font-family: 'Area Extended'; }
.investment_sec .row { padding-top: 150px; margin: 0 -80px; }
.investment_sec .col { text-align: center; width: 33.33%; padding:  0 80px 125px; }
.investment_sec .col img { margin: 0 auto 8px; }
.investment_sec .icon { transition: all 0.3s; -webkit-transition: all 0.3s; max-width: 135px; display: inline-block; vertical-align: top; }
.investment_sec .col span { display: block; color: #0E153E; font-family: "Helvetica Neue"; font-size: 30px; line-height: 36px; font-weight: 700; padding: 25px 0 0 0 ;}
.investment_sec .wrapper { max-width: 1200px; }
.investment_sec .col a:hover .icon { transform: translate(0,-10px); -webkit-transform: translate(0,-10px); }
.investment_sec .col a:hover span { color: #000; }

/* ============= */

/* ============= */
.location-bar { overflow: hidden; }
.location-bar .maplist { overflow: hidden; position: relative; }
.location-bar .wpsl-search { float: none; margin-bottom: 12px; padding: 12px 12px 0 12px; background: #f4f3f3; }
.location-bar .wpsl-search { padding: 15px 55px 25px; float: left; z-index: 101; width: 450px; background: #091545; }
.location-bar #wpsl-gmap { width: calc(100% - 450px); height: 610px !important; }
.location-bar .wpsl-input { display: block; }
.location-bar #wpsl-search-btn, .map_sec #wpsl-search-wrap div { margin: 0px; float: none; display: block; }
.location-bar .wpsl-input label { color: #fff; font-family: 'Area Extended'; font-weight: 400; font-size: 20px; float: none; width: 100%; display: block; text-align: center; }
.location-bar #wpsl-search-input { float: left; width: 145px; display: block; color: #fff; font-family: 'Area Extended'; font-size: 14px;
font-weight: 400; letter-spacing: 1.4px; border: 0px; height: 38px; border-bottom: 1px solid #31cffe; border-radius: 0px; -webkit-border-radius: 0px; background: none; }
.location-bar #wpsl-results { display: none !important; }
.location-bar #wpsl-search-wrap .wpsl-select-wrap { float: right; width: 80px; }
.location-bar .wpsl-search-btn-wrap { padding-top: 40px; width: 100%; clear: both; text-align: center; }
.location-bar #wpsl-radius label { display: none; }
.location-bar .wpsl-dropdown { border: 0px; border-radius: 0px; -webkit-border-radius: 0px; background: none; border-bottom: 1px solid #31cffe; }
.location-bar .wpsl-selected-item:after { border: 0px; width: 9px; height: 22px; right: 0px; margin-top: -8px; background:url(assets/images/arrow-blue.png) no-repeat; }
.location-bar #wpsl-search-btn { text-align: center; transition: all 0.3s; -webkit-transition: all 0.3s; background: none; color: #fff; font-size: 16px; line-height: 21px; padding: 5px 15px; text-transform: none; cursor: pointer; font-family: 'Area Extended' !important; font-weight: 600; letter-spacing: 0.72px; min-width: 101px;    display: inline-block; border-radius: 3px; border: #32d0ff solid 2px; }
.location-bar #wpsl-search-btn:hover { color: #091545; background: #32d0ff; }
.location-bar #wpsl-result-list { float: left; width: 450px; margin: 0px; }
.location-bar #wpsl-search-btn, .location-bar #wpsl-search-wrap div { float: none; display: block; margin: 0px auto; }
.location-bar #wpsl-wrap .wpsl-selected-item { color: #fff; }
.location-bar .bottomcontent { padding: 25px 0; }
.location-bar .innercontent { padding: 35px 0px 28px 115px; overflow: hidden; max-width: 1310px; margin: 0 auto; border: #17215C solid 1px; }
.location-bar .innercontent h3 { padding-bottom: 10px; color: #17215C; font-size: 30px; }
.location-bar .innercontent .info { padding-right: 180px; float: left; width: 575px; }
.location-bar .innercontent p { color: #17215C; font-size: 18px; line-height: 24px; }
.location-bar .innercontent a.tel, .location-bar .innercontent a.email { float: left; margin-right: 95px; color: #17215C; font-family: 'Area Normal'; font-size: 20px; font-weight: 700; line-height: 35px; margin-top: 30px; }
.location-bar .innercontent a.email { margin-right: 0px; }
.location-bar .innercontent { }
.location-bar .innercontent { }
.location-bar #wpsl-wrap { margin-bottom: 0px; background: #F0F0F0; }
.location-bar #wpsl-result-list ul { padding: 15px 20px 0px 20px; }
.location-bar #wpsl-wrap #wpsl-result-list li { padding: 16px 15px 15px 90px; min-height: 110px; position: relative; margin-bottom: 15px; border: 0px; background: #fff url(assets/images/location-Icon.svg) 10px 16px no-repeat; cursor: pointer; overflow: visible; background-size: 40px; }
.location-bar #wpsl-result-list li p { margin: 0px; padding: 0px; font-family: 'Area Normal'; font-size: 14px; line-height: 22px; color: #0f2065;padding-right:68px;}
div#reorder {max-width: 500px;width: 100%;margin: 0 auto;text-align: center;}
div#reorder button.fancybox-button {top: 9px;right: 8px;}
.location-bar .wpsl-store-details.wpsl-store-listing { color: #0f2065; }
.location-bar .wpsl-store-details.wpsl-store-listing:before {
    border-top: 5px solid #00d9ff;
    border-left: 4px solid rgba(0, 0, 0, 0);
    border-right: 4px solid rgba(0, 0, 0, 0);
}
.wpsl-store-details.wpsl-store-listing.wpsl-active-details:before { border-top: none; }
.wpsl-more-info-listings h3 { font-size: 18px !important; }


div#investment_services {max-width: 500px;width: 100%;margin: 0 auto;text-align: center;}
div#investment_services button.fancybox-button {top: 9px;right: 8px;}

.learnBtn {
    cursor: pointer;
}

.exitpop {
        background-color: #fcfcee;
        background-image: url(assets/images/exitpop.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        height: 413px;
        width: 734px;
    position: relative;
    }
    .exitpopin {
        padding: 45px 60px 93px;
        line-height: 33px;
        text-align: center;
        color: #fff;
        font-family: 'Area Normal';
        font-size: 21px;
        font-weight: 200;
    }

.eptext {
    border: solid 1px #fff;
    padding: 40px;
}
    .eplink {
        position: relative;
        top: 38px;
    }
    .ui-dialog-titlebar-close, .ui-dialog-buttonpane {
        display: none;
    }
    .ui-dialog {
        height: 413px !important;
        width: 734px !important;
        z-index: 200;
    }
    .ui-widget-overlay {
        background: #ffffff;
        opacity: .50;
        position: fixed;    
        filter: Alpha(Opacity=50);
        position: fixed;
        top: 0;
        width: 100%;
        height: 100%;
    }

.mobile_only {
    display: none;
}

@media only screen and (max-width: 768px) {
    .ui-dialog {
        height: auto !important;
        width: 85% !important;
    }
    
    .eptext {
        padding: 30px;
    }
    
    .exitpopin {
        line-height: 24px;
        font-size: 16px;
        padding: 55px 15px 80px;
    }
    
    .mobile_only {
        display: inline-block;
    }
    
    .desktop_only {
        display: none;
    }
}




.intro_sec p a.reorder_btn:hover {opacity: 0.5;}
.intro_sec p a.reorder_btn {transition:ease-in-out 0.4s;}
.location-bar #wpsl-result-list li p strong { color: #0f2065; font-size: 17px; font-family: 'Area Extended'; font-weight: 600; }
.location-bar #wpsl-result-list li p strong a { color: #0f2065; }
.location-bar #wpsl-result-list li p.wpsl-contact-details { padding: 0px; margin: 0px; }
.location-bar #wpsl-result-list li p.wpsl-contact-details strong { font-size: 15px; }
.location-bar #wpsl-result-list li .wpsl-direction-wrap { position: absolute; right: 15px; top: 20px; font-size: 14px; font-family: 'Area Normal'; font-weight: 600; color: #0f2065; }
.location-bar #wpsl-result-list li .wpsl-direction-wrap a { display: none; }
.location-bar #wpsl-result-list li a.backstore { position: absolute; left: 0px; top: -25px; font-size: 13px; font-family: 'Area Normal'; color: #000; text-transform: uppercase; display: none; }
.location-bar .fullcontent { padding: 20px 0px 0px 0px; display: none; }
.location-bar #wpsl-result-list li .fullcontent p { padding-bottom: 15px; font-size: 16px; line-height: 20px; }
.location-bar #wpsl-result-list li .fullcontent h3 { padding-bottom: 10px; color: #17215C; font-size: 22px; font-family: 'Area Normal'; font-weight: 700; }
.location-bar #wpsl-result-list li .fullcontent h4 { padding-bottom: 4px; font-size: 18px; line-height: 23px; font-family: 'Area Normal'; font-weight: 700; color: #0E153E; }
.location-bar #wpsl-result-list li.activelocation { margin-top: 26px; }
.location-bar span.within, .map_sec #wpsl-search-wrap span.within { color: #fff; position: absolute; left: 180px; top: 46px; font-size: 16px; }
.map_sec #wpsl-search-wrap span.within { color: #000; }
.location-bar #wpsl-result-list li .fullcontent { }
.location-bar #wpsl-result-list li .fullcontent { }
.location-bar #wpsl-stores { height: 403px !important; }
.location-bar { }
.location-bar { }

/* busines-contant-bar */
.busines-contant-bar { padding: 49px 0 23px; width: 100%;  }
.busines-contant-bar.report_card { padding: 74px 0 80px; }
.busines-contant-bar.savingac { padding: 56px 0 4px; }
.busines-contant-bar.savingac .subtext { text-align: center; }
.busines-contant-bar .subtext h3, .busines-contant-bar.report_card h1 { padding: 30px 0 35px; color: #17215C; font-family: 'Area Extended'; font-size: 32px; font-style: normal; font-weight: 700; line-height: normal; letter-spacing: 0.96px; text-align: center; }
.busines-contant-bar.savingac .subtext h3 { padding: 30px 0 40px; }
.busines-contant-bar .subtext .info h4 { font-size: 35px; color: #17215C; margin-bottom: 15px; }
.page-retirement-planning .busines-contant-bar .subtext .info h4 { padding-top: 50px; }
.busines-contant-bar.report_card h1 { padding: 30px 0 53px; }
.busines-contant-bar  p { padding: 0; font-size: 18px; color: #17215C; line-height: 1.6; font-family: 'Area Normal'; font-weight:300; }
.busines-contant-bar .get_started { font-size: 20px; line-height: 1.45; padding: 0 0 45px; text-align: center;  }
.busines-contant-bar.savingac .subtext p { padding-bottom: 30px; font-weight: 400; }
.busines-contant-bar.savingac .subtext .button { padding: 10px 25px; min-width: inherit; margin-top: 31px; }
.busines-contant-bar.personal-bar { padding: 55px 0 79px; }
.busines-contant-bar.personal-bar.treschild { padding: 55px 0 115px; }
.busines-contant-bar.loans { padding-bottom: 70px; }
.busines-contant-bar.loans .intro { padding-top: 7px; padding-bottom: 20px; text-align: center; }
.busines-contant-bar.loans .intro p { line-height: 25px; }
.busines-contant-bar.loans .info ul { padding-bottom: 68px; margin-left: 140px; }
.busines-contant-bar ol { }
.busines-contant-bar ol li { padding-bottom: 20px; font-size: 20px; line-height: 29px; }
.busines-contant-bar ol { }
.busines-contant-bar ol { }

.mortgage_contant_bar .subtext ul { padding-bottom: 68px; margin-left: 140px; }
.mortgage_contant_bar .subtext ul li {
  padding: 0 0 0 24px;
  position: relative;
  font-size: 20px;
  color: #0E153E;
 font-family: 'Area Normal';
  font-weight: 300;
  line-height: 29px; 
}
.mortgage_contant_bar .subtext ul li::before {
  content: "";
  width: 13px;
  height: 15px;
  position: absolute;
  top: 9px;
  left: 0;
  background: url(assets/images/check_icon.png) no-repeat;
}

.busines-contant-bar.investparent { padding: 92px 0 115px; }
.busines-contant-bar.investparent .intro { margin: 0 auto; max-width: 930px; }
.busines-contant-bar.investparent .intro p { line-height: 31px; }
.busines-contant-bar.investchild { padding-bottom: 32px; }
.busines-contant-bar.investchild .work_more { padding-top: 43px; padding-bottom: 0px; text-align: center; }
.busines-contant-bar.investchild h4, .busines-contant-bar.investparent h4 { padding: 140px 0 63px; font-size: 48px; line-height: 1.25; color: #17215C; font-family: 'Area Extended'; font-weight: 400; text-align: center; }
.busines-contant-bar.investchild .info ul { padding-top: 5px; max-width: 670px; margin: 0 auto; }
.page-business-financial-planning .busines-contant-bar.investchild .info ul { padding-bottom: 0px; padding-left: 0px; max-width: 350px; }
.busines-contant-bar .strategies { padding-bottom: 80px; }

.page-template-template-investment-strategies .busines-contant-bar .strategies { padding-bottom: 40px; }

.busines-contant-bar.retirement h4 { padding: 75px 0 63px; }
.busines-contant-bar.retirement .image { padding-top: 120px; }
.busines-contant-bar.retirement .image h2 { font-family: 'Area Extended'; font-weight: 400; text-align: center; }
.busines-contant-bar.retirement .image { }
.busines-contant-bar.retirement .image { }
.busines-contant-bar.retirement .image { }
.busines-contant-bar.banking_content { padding: 38px 0 14px; }
.busines-contant-bar.banking_content .work_more { padding-bottom: 9px; }
.busines-contant-bar.personalloan { padding: 55px 0 23px; }
.busines-contant-bar.personalloan .intro { padding-bottom: 46px; text-align: center; }
.busines-contant-bar.personalloan .intro p { line-height: 25px; }
.busines-contant-bar.personalloan .info ul { padding: 0 0 65px 290px; }
.busines-contant-bar.personalloan .info ul li { font-weight: 400; }
.busines-contant-bar.personalloan { }

.busines_list { padding: 0 0 75px 150px; }
.busines_list li { padding: 0 0 0 24px; position: relative; font-size: 20px; color: #0E153E; font-family: 'Area Normal'; font-weight:300; line-height: 1.5; }
.busines_list li:before { content: ""; width: 13px; height: 15px; position: absolute; top: 9px; left: 0; background: url(assets/images/check_icon.png) no-repeat; }
.contact_btn { display: table;  margin: 0 auto; min-width: 215px; }
.page-certificate-of-deposit .info + .contact_btn { margin-top: -35px; }
.page-template-template-saving-accounts-child.page-certificate-of-deposit .info + .contact_btn { margin-top: 0px; }

 .busines-contant-bar .video_bar { max-width: 1090px; margin: 83px auto 0; height: 558px; background-repeat: no-repeat; background-size: cover; }
 .busines-contant-bar .video_bar .overlay { width: 100%; height: 100%; background: rgba(96,95,95,0.8); display: flex; align-items: center; justify-content: center; }
 /* .busines-contant-bar .video_bar span { margin: 10px 0 0; font-size: 18px; display: block; letter-spacing: 0.72px; text-transform: uppercase; color: #fff; }
 .busines-contant-bar .video_bar a img { margin: 0 auto; } */

.busines-contant-bar .sub_contant { padding: 70px 0 0; }
.busines-contant-bar .work_more p { padding: 0 0 44px; line-height: 31px; }
.busines-contant-bar .childpage p { padding-bottom: 30px; line-height: 25px; }
.busines-contant-bar .buttons { padding: 20px 0px 50px 0px; text-align: center; }

.page-template-template-investment-strategies .busines-contant-bar .buttons { padding: 0px 0px 0 0px; text-align: center; }

.busines-contant-bar .funds { padding: 0 0 100px; }
.busines-contant-bar  p span { color: #17215C; }
.busines-contant-bar .info ul { padding: 0 0 75px 150px; }
.page-template-template-retirement-calculator .busines-contant-bar .info ul { padding: 0 0 75px 0px; max-width: 300px; margin: 0 auto; }
.busines-contant-bar .info ul li { padding: 0 0 0 24px; position: relative; font-size: 18px; color: #17215C; font-family: "Area Normal"; font-weight: 400; line-height: 29px; }
.busines-contant-bar .info ul li:before { content: ""; width: 13px; height: 15px; position: absolute; top: 9px; left: 0; background: url(assets/images/check_icon.png) no-repeat; }
.page-template-template-checking-accounts .busines-contant-bar .info ul, .page-template-template-checking-accounts-child .busines-contant-bar .info ul { /*padding-left: 0px; text-align: center;*/ }
.page-template-template-checking-accounts .busines-contant-bar .info ul li:before, .page-template-template-checking-accounts-child .busines-contant-bar .info ul li:before { /*left: auto; margin-left: -15px; */}
.busines-contant-bar.childpage { padding-bottom: 85px; }
.busines-contant-bar.childpage .subtext h3 { padding-top: 18px; }
.busines-contant-bar.childpage .info ul { padding-bottom: 43px; }
.busines-contant-bar.treschild { }
.busines-contant-bar.treschild h3 { padding: 0 30px 65px; }
.busines-contant-bar.treschild .subtextintro { padding-bottom: 25px; }
.busines-contant-bar.treschild .info { padding-bottom: 30px; }
.busines-contant-bar.treschild .subtextintro p { padding-bottom: 20px; padding-top: 0px; text-align: left; }
.parent-pageid-653 .busines-contant-bar { padding-top: 60px; }
.parent-pageid-653 .busines-contant-bar .info ul { padding: 0 0 45px 150px; }
.parent-pageid-653 .busines-contant-bar .buttons { padding: 63px 0px 40px 0px; }
.parent-pageid-653 .busines-contant-bar .bottomcontent { padding: 15px 0px 8px 0px; max-width: 650px; margin: 0 auto; text-align: center; }
.parent-pageid-653 .busines-contant-bar .bottomcontent p { font-size: 14px; line-height: 18px; }
.parent-pageid-691 .busines-contant-bar .bottomcontent { padding: 50px 0px 0px 0px; max-width: 650px; margin: 0 auto; text-align: center; }
.parent-pageid-691 .busines-contant-bar .bottomcontent p { padding-bottom: 0px; font-size: 14px; line-height: 18px; }
.busines-contant-bar { }
.busines-contant-bar { }

#iframevideo iframe { width: 100% !important; height: 100% !important; }
.fancybox-slide--html #iframevideo .fancybox-close-small { top: 10px; }
#iframevideo { background: none; overflow: hidden; }

 .business-banner-bar .text:before { right: -60px; }
 .business-banner-bar .text { max-width: 580px; } 

 /* money_market_bar */
 .money_market_bar {  margin: 0 0 0px; width: 100%; padding: 88px 0 0px; background: #f0f0f0; }
 .money_market_bar .wrapper { max-width: 1220px; }
 .money_market_bar .itembox { display: -webkit-flex; display: flex; flex-wrap: wrap; justify-content: center; }
 
 .money_market_bar .itembox .item { margin: 0 21px 40px; padding: 60px 40px 65px; width: calc(33.3% - 43px); background: #fff; text-align: center; border-top: 22px solid #17215C; position: relative; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); transition: transform 0.3s ease, box-shadow 0.3s ease; }
 .money_market_bar .itembox .item:hover { transform: translateY(-6px); box-shadow: 0 10px 18px rgba(0, 0, 0, 0.18); }
 .money_market_bar .itembox .item::after { content: none; }
 .money_market_bar .itembox .item::before { content: none; }
 .money_market_bar .itembox .item h3 { padding: 0 0 13px; font-size: 30px; font-family: "Area Extended"; font-weight: 700; color: #17215C; }
 .money_market_bar .itembox .item p { padding: 0 0 20px; color: #17215C; font-family: 'Area Normal'; font-size: 14px; font-style: normal; font-weight: 600; line-height: 123.378%; }
 .money_market_bar .itembox .item .learnBtn,   .mayalso_bar .itembox .item .text .learnBtn { padding: 10px 42px; }


 .money_market_bar .itembox .item .learnBtnDiv { 
padding: 11px 15px;
position: absolute;
bottom: 10px;
width: 80%;
left: 0;
right: 0;
margin: 0 auto;}

.footnote {
padding: 10px 0 0;
font-size: 12px;
color: #17215C;
line-height: 1.76;
font-family: "Area Normal";
font-weight: 400;
display: block;
}

.itembox_p {
    min-height: 350px;
}

 .money_market_bar .itembox .item  .account { margin: 20px 0 0; color: #17215C; display: none; font-family: 'Area Normal'; font-weight:300; text-decoration: underline; }
 .money_market_bar .itembox .item  .account:hover { color: #17215C; }
 .money_market_bar.savingac { padding-bottom: 45px; margin-bottom: 0px; }
 .money_market_bar.savingac .wrapper { max-width: 1290px; }
 .money_market_bar.savingac .itembox .item { margin: 0 32px 85px; padding: 57px 38px 57px; width: calc(33.3% - 64px); border-top-width: 25px; }
 .money_market_bar.savingac .itembox .item h3 { padding-bottom: 24px; min-height: 100px; }
 .money_market_bar.savingac .itembox .item p { padding-bottom: 30px; font-size: 16px; font-weight: 400; line-height: 29px; min-height: 140px; }
 .money_market_bar.savingac .itembox .item::after { border-left: 177px solid #fff; border-right: 178px solid #fff; border-bottom: 20px solid transparent; }
 .money_market_bar.savingac .itembox { justify-content: center; }
 .money_market_bar.savingac.savingchild .itembox { justify-content: center; }
 .money_market_bar.savingchild { padding-top: 105px; }
 .money_market_bar.savingchild .itembox .item { padding-bottom: 60px; margin-bottom: 104px; }
 .money_market_bar.treasury { padding-bottom: 0px; }
 .money_market_bar.treasury .itembox .item { padding: 38px 50px 60px; margin-bottom: 165px; }
 .money_market_bar.treasury .itembox .item h3 { padding-bottom: 44px; }
 .money_market_bar.treasury .itembox .item p { padding-bottom: 43px; }
 .money_market_bar.treasury .itembox .item .learnBtn { 
    padding: 10px 35px;
    position: absolute;
    bottom: 25px;
    left: 0;
    right: 0;
    width: 215px;
    margin: 0 auto;
}
 .money_market_bar.treasury { }
 .money_market_bar.treasury { }
 .money_market_bar.treasury { }
 .money_market_bar.businessloan { }
 .money_market_bar.businessloan .itembox .item { padding: 38px 30px 50px; margin-bottom: 117px; }
 .money_market_bar.businessloan .itembox .item p { padding-left: 15px; padding-right: 15px; }
 .money_market_bar.businessloan .itembox .item p + p { display: none; }
 .money_market_bar.investparent { padding: 105px 0 37px; margin-bottom: 100px; -webkit-box-shadow: 0 2px 5px 1px rgba(0,0,0,0.2); box-shadow: 0 2px 5px 1px rgba(0,0,0,0.2); }
 .money_market_bar.investparent .itembox .item { min-height: 410px; }
 .money_market_bar.investparent .itembox .item p { padding-left: 20px; padding-right: 20px; }
 .money_market_bar.investparent { }
.parent-pageid-633 .money_market_bar.totally_free_bar { padding: 82px 0 0px; margin-top: 33px; }
.parent-pageid-633 .money_market_bar.totally_free_bar .wrapper2 { max-width: 1360px; }
.parent-pageid-633 .money_market_bar.totally_free_bar .itembox .item { width: calc(25% - 32px); margin: 0 11px 100px; padding: 36px 20px 40px; }
.parent-pageid-633 .money_market_bar.totally_free_bar .itembox .item h3 { min-height: 68px; }
.parent-pageid-633 .money_market_bar.totally_free_bar .itembox .item .learnBtn { padding: 12px 30px; width: 95%; }
.parent-pageid-653 .money_market_bar.totally_free_bar .itembox .item { width: calc(33% - 95px); margin: 0 47px 100px; padding: 36px 20px 40px; }
.parent-pageid-653 .money_market_bar.totally_free_bar .wrapper2 { max-width: 1230px; }
.parent-pageid-653 .money_market_bar.totally_free_bar {padding: 82px 0 0px;   }
.parent-pageid-653 .money_market_bar.totally_free_bar { }
.parent-pageid-653 .money_market_bar.totally_free_bar { }
.parent-pageid-653 .money_market_bar.totally_free_bar { }

.money_market_bar.twobytow { }
.money_market_bar.twobytow .wrapper > .itembox { max-width: 840px; margin: 0 auto; }
.money_market_bar.twobytow .itembox .item { width: calc(50% - 64px); }
.money_market_bar.twobytow { }


 /* mayalso_bar */
 .mayalso_bar { margin: 0 0 60px; padding: 80px 0 80px; width: 100%; background: rgba(240,240,240,0.28); border: 1px solid rgba(112, 112, 112, 0.2); }
	.mayalso_bar.temp-hide {display: none;}
 .mayalso_bar .wrapper { max-width: 1270px; }
 .mayalso_bar h2 { padding-bottom: 28px; font-size: 40px; color: #0E153E; font-family: 'Area Extended';line-height: 1.3; text-align: center; }
 
 .mayalso_bar .itembox { padding: 70px 0 0; display: -webkit-flex; display: flex;  justify-content: space-between; flex-wrap: wrap; }
 .mayalso_bar .itembox .item { width: calc(50% - 15px);  display: -webkit-flex; display: flex;  justify-content: space-between; flex-wrap: wrap; overflow: hidden; position: relative; margin-bottom: 30px; }
 .mayalso_bar .itembox .item .text { padding: 35px 10px 35px; width: 50%; background: #f0f0f0; position: relative; z-index: 1;display: flex;flex-wrap: wrap;align-items: center;}
 .mayalso_bar .itembox .item:nth-of-type(211) .text { padding: 70px 10px 42px; }
 .mayalso_bar .itembox .item .text:after { content: ""; width: 100%; height: 101%; position: absolute; right: -98px; top: 0px;  background: #f0f0f0; transform-origin: bottom left; -ms-transform: skew(13deg, 0deg); -webkit-transform: skew(13deg, 0deg); transform: skew(13deg, 0deg); z-index: -1; box-shadow: 2px 0 7px -2px rgba(0,0,0,.2); }
 .mayalso_bar .itembox .item .text .sub { position: relative; left: 30px; }
 .mayalso_bar .itembox .item .text h3 { padding: 0 0 15px; font-size: 30px; color: #0E153E; font-family: 'Area Extended';}
 .mayalso_bar .itembox .item:nth-of-type(2) .text h3 { }
 .mayalso_bar .itembox .item .text p { color: #17215C; line-height: 1.2; padding: 0 0 30px; }
 .mayalso_bar .itembox .item:nth-of-type(2) .text p { }
 .mayalso_bar .itembox .item .image { position: absolute; right: 0px; top: 0px; width: 70%; }
 .mayalso_bar .itembox .item .image:after { content: ""; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;  background: linear-gradient(
    to top,
    rgba(90, 55, 45, 0.3),   /* shadow tone: warm dark */
    rgba(240, 210, 180, 0.3)  /* highlight tone: warm light */
  ); mix-blend-mode: color;  pointer-events: none; }
.inner-banner-bar1:before { z-index:1; content:''; width: 50%; height: 100%; position: absolute; left:0; top:0;
background: -moz-linear-gradient(left, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(left, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(to right, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=1 );
 }
 .mayalso_bar .itembox .item .image img { width: auto; min-height: 308px; }
 .mayalso_bar.creditcard .itembox .item:nth-of-type(2) .text { padding: 35px 10px 42px; }
 .mayalso_bar.creditcard .itembox .item:nth-of-type(2) .text p { padding: 0 0 30px; }


 /* personal-bar */
 .personal-bar p { padding: 0px 0 30px; }
.personal-bar h5 { padding-bottom: 15px; color: #17215C; }


 /* other_services_bar */
.other_services_bar { width: 100%; padding: 44px 0 115px; }
.other_services_bar h2 { padding-bottom: 30px; font-size: 48px; color: #17215C; text-align: center; font-family: 'Area Extended'; font-weight: 400; }
.other_services_bar .itembox { padding: 50px 0 0; }
.other_services_bar .itembox .items { display: -webkit-flex; display: flex;  justify-content: space-between; flex-wrap: wrap; }
.other_services_bar .itembox .items:nth-child(even) { flex-direction: row-reverse;}
.page-mobile-banking .other_services_bar .itembox .items:nth-child(even) { flex-direction: inherit;}
.other_services_bar .itembox .text { margin: 0 0 20px; padding: 50px 40px 22px 45px; border-top: 26px solid #17215C; width: calc(50% - 5px); background: #fcfcfc; text-align: center; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); }

 .other_services_bar .itembox .text:nth-of-type(4) { padding: 65px 40px 45px 45px; }
 .other_services_bar .itembox .text h3 { padding: 0 0 20px; font-size: 30px; color: #17215C; }
 .other_services_bar .itembox .text:nth-of-type(4) h3 { padding: 0 0 40px; }
 .other_services_bar .itembox .text p { padding: 0 0 35px; text-align: left; font-size: 18px; line-height: 31px; color: #0E153E; font-family: 'Area Normal';font-weight:300; }
 .other_services_bar .itembox .text:nth-of-type(4) p { padding: 0 0 45px; }
 .other_services_bar .itembox .text.image { border: none; padding: 0;  box-shadow: inherit; background: transparent; }
 .other_services_bar.mobile_content_bar { }
 .other_services_bar.mobile_content_bar ol { padding: 5px 40px 0px 27px; list-style: none; text-align: left; counter-reset: item; }
 .other_services_bar.mobile_content_bar ol li { padding: 0px 0px 30px 20px; color: #0E153E; font-size: 18px; font-family: 'Area Normal';font-weight: 400; line-height: 31px; counter-increment: item; position: relative; }
 .other_services_bar.mobile_content_bar ol li:before { content: counter(item)'.'; position: absolute; left: 0px; top: 0px; color: #17215C; font-family: 'Area Normal'; font-size: 18px; font-weight: 800; line-height: 31px; }
 .other_services_bar.mobile_content_bar { }

 /* management-bar */
 .management-bar .learnBtn { padding: 12px 52px 12px; }

 /* personal-credit */
 .benefits_list { padding: 0 0 0 300px; }

 /* get_started_bar */
 .get_started_bar { padding: 77px 0 0px; background: rgba(240,240,240,0.28); border: 1px solid rgba(112, 112, 112, 0.1); }
 .get_started_bar h2 { padding: 0px 0 64px; font-family: 'Area Extended'; font-size: 32px; font-style: normal; font-weight: 700; line-height: normal; letter-spacing: 0.96px; text-align: center; }
 .get_started_bar .itembox .item { width: calc(33.3% - 16px); margin: 0 8px 100px; padding: 47px 60px 85px 50px; display: block !important; }
 .get_started_bar .itembox .item h3 { min-height: 50px; font-size: 24px; }
 .get_started_bar .itembox .item h3 img { margin: 0 auto; }
 .get_started_bar .itembox .item  p { text-align: left; }
 .get_started_bar .itembox .item::after { border-left: 190px solid #fff;  border-right: 190px solid #fff }
 .get_started_bar .itembox .item::before { border-left: 190px solid rgba(0, 0, 0, 0.16); border-right: 190px solid rgba(0, 0, 0, 0.16); }
.get_started_bar .itembox .item .contents { min-height: 360px; }

 /* totally_free_bar */
 .totally_free_bar .wrapper2 { max-width: 982px; }
 .totally_free_bar .itembox .item { width: calc(33.3% - 17px); margin: 0 8px 100px; padding: 36px 32px 125px; }
 .totally_free_bar .itembox .item::after { border-left: 150px solid #fff;  border-right: 150px solid #fff }
 .totally_free_bar .itembox .item::before { border-left: 150px solid rgba(0, 0, 0, 0.16); border-right: 150px solid rgba(0, 0, 0, 0.16); }
 .totally_free_bar .itembox .item .month_list { padding-top: 4px; padding-bottom: 16px; }
 .totally_free_bar .itembox .item .month_list li { padding: 25px 0 0; font-size: 13px; color: #17215C; line-height: 1.76; font-family: 'Area Normal';  font-weight: 700; }
 .totally_free_bar .itembox .item .month_list li span { display: block; font-weight: 400; }
 .totally_free_bar .itembox .item h3 { font-size: 23px; min-height: 68px; }
 .totally_free_bar .itembox .item .learnBtn { padding: 10px 34px 10px; }

 /* michael_shelby_bar */
 .michael_shelby_bar { width: 100%; padding: 0 0 80px; }
 .michael_shelby_bar .itembox { display: -webkit-flex; display: flex;  justify-content: space-between; flex-wrap: wrap; }
 .michael_shelby_bar .itembox .item { margin: 100px 0 0; width: calc(50% - 35px); display: -webkit-flex; display: flex;  justify-content: space-between; flex-wrap: wrap; }

 .michael_shelby_bar .itembox .item .image { width: 40%; }
 .michael_shelby_bar .itembox .item .text { padding: 0 0 0 20px; width: 60%; }
 .michael_shelby_bar .itembox .item .text h3 { font-size: 32px; color: #17215C; font-family: 'Area Extended'; line-height: 1.3; }
 .michael_shelby_bar .itembox .item .text span { font-size: 20px; color: #17215C; }
 .michael_shelby_bar .itembox .item .text h4 { padding: 40px 0 0; font-size: 18px; color: #17215C; font-family: 'Area Extended'; }
 .michael_shelby_bar .itembox .item .text p { padding: 8px 0 0; font-size: 18px; color: #17215C; }
 .michael_shelby_bar .itembox .item .text  p a { color: #45B97A; word-break: break-all; }

.phone[href^="tel:"] { cursor: text; }
.email:hover { color: #17215C !important; }

 /* credit-banner-bar */
 .credit-banner-bar .text { max-width: 450px; min-height: 580px; }
 .credit-banner-bar .text:before { right: -30px; }
 .credit-banner-bar .text p { padding: 20px 97px 30px 0; }
 .credit-banner-bar .learnBtn { padding: 12px 47px 12px; }

 /* frequently_bar */
.frequently_bar { padding: 80px 0 45px; width: 100%; }
.frequently_bar.faqs { padding-top: 3px; }
.frequently_bar h2 { padding: 0 0 65px; font-size: 48px; color: #17215C; font-family: 'Area Extended';  font-weight: 400; text-align: center; }

.accordion_bar { padding: 80px 0; background: #fcfcfc; }
.accordion_bar .accordion-item h3.active { border-bottom: none; }
.accordion_bar .accordion-item:nth-of-type(1) h3 { border-top: 2px solid #29475c; }  
.accordion_bar .accordion-item { position: relative; width: 100%; height: auto; border-bottom: 2px solid #29475c; }
.accordion_bar .accordion-item > h3 { position: relative; padding: 24px 20px 23px 40px; color: #17215C; font-size: 25px; line-height: 1.3; font-family: 'Area Extended';  font-weight: 700; display: block; -webkit-transition:all 0.2s linear; -moz-transition:all 0.2s linear; transition:all 0.2s linear; }
.accordion_bar .accordion-item > h3 i { float: left; font-size: 16px; color: #fff; margin-top: 2px;  width: 27px;  height: 27px; line-height: 27px; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; text-align: center;  background: #d3d3d3; position: absolute; top: 25px; left: 0; }
 
.accordion_bar .accordion-item .content { padding: 0 10px 0 45px; display : none; }
.accordion_bar .accordion-item .content p { padding: 0 15px 20px 0; color: #0E153E; margin: 0; font-size: 18px; line-height: 1.72; }

/* seven_smart_bar */
.seven_smart_bar { padding: 0 0 80px; background: #fff; webkit-box-shadow: 0 8px 6px -4px rgba(0,0,0,0.1); -moz-box-shadow: 0 8px 6px -4px rgba(0,0,0,0.1); box-shadow: 0 8px 6px -4px rgba(0,0,0,0.1); }
.seven_smart_bar h1 { padding: 0 0 20px; font-family: 'Area Extended'; }
.seven_smart_bar .date { padding: 0 0 20px; } 
.seven_smart_bar .learnBtn { min-width: 190px; text-align: center; }

/* mayalso */
.news_sec.other.mayalso { margin-bottom: 0px; box-shadow: inherit; border: 1px solid rgba(112, 112, 112, 0.1); }
.mayalso h3 { font-family: 'Area Extended'; padding: 0 20px; }
.mayalso .item { width: 100%; position: relative; }

.mayalso .sub { padding: 3px 8px; background: #17215C; display: -webkit-flex; display: flex; justify-content: space-between; flex-wrap: wrap; position: absolute; bottom: 0; left: 0; right: 0; }
.mayalso .sub p { padding: 0; font-size: 14px; color: #fff; font-family: 'Area Normal';  font-weight: 300; } 
.mayalso .sub .date { color: #fff; font-size: 14px; }
.mayalso .news_col { padding: 0 0 55px; }

/* .blog_banner */
.blog_banner:before { background: none; }
.blog_banner .text:before { background: rgba(2,84,66,1); }
.blog_banner .learnBtn {  margin: 40px 0 0; } 

/* blog_post_bar */
.blog_post_bar {  margin: 0; padding: 60px 0 90px;}
.blog_post_bar .news_col h3 { padding: 0 15px; }

/* select_bar */
.resourcecenter .top_search_bar { overflow: visible; }
.top_search_bar .select_bar { float: left; position: relative; }
.resourcecenter .top_search_bar .select_bar  { max-width: 100%; }
.top_search_bar .select_bar .selectinput { display: block; width: 290px; padding: 10px 15px; color: #999899; border: 1px solid rgba(153, 152, 153, 0.26); font-size: 16px; border-radius: 0px; background: #fff url(assets/images/select_bg.jpg) no-repeat right center; }
.top_search_bar .select_bar .selectinput.active { background: #fff url(assets/images/select_bg_active.jpg) no-repeat right center; }
.top_search_bar .search-btn { width: 166px; padding: 3px 0; height: auto; border-radius: 13px; border: 2px solid #17215C; background: none; font-size: 15px; color: #17215C; }
.top_search_bar .selectgroup { margin-right: 65px; width: 290px; position: relative; z-index: 101; float: left; }
.top_search_bar .selectgroup ul { position: absolute; left: 0px; top: 46px; display: none; width: 100%; border-left: #e4e4e4 solid 1px; border-right: #e4e4e4 solid 1px; background: #fff; }
.top_search_bar .selectgroup ul li { border-bottom: #e4e4e4 solid 1px; }
.top_search_bar .selectgroup ul li a { padding: 10px 15px 10px 45px; display: block; color: #999899; font-size: 16px; position: relative; }
.top_search_bar .selectgroup ul li a:before { content: ""; position: absolute; left: 15px; top: 13px; width: 14px; height: 14px; border: #cfcfcf solid 1px; border-radius: 50%; -webkit-border-radius: 50%; background: #f0f0f0; }
.top_search_bar .selectgroup ul li a.active:after { content: ""; position: absolute; left: 17px; top: 15px; width: 12px; height: 12px; border-radius: 50%; -webkit-border-radius: 50%; background: #6c9982; }
.top_search_bar .selectgroup { }
.top_search_bar .selectgroup { }
.top_search_bar .selectgroup { }
.top_search_bar .tags { padding-top: 8px; float: left; }
.top_search_bar .tags a { margin-right: 5px; float: left; padding: 3px 10px; font-size: 13px; font-weight: bold; line-height: 16px; height: auto; border-radius: 20px; border: 2px solid #17215C; background: none; font-size: 15px; color: #17215C; }

body .fancybox-close-small { width: 27px; height: 27px; right: 0px; background: url(assets/images/close-btn.png) no-repeat; background-color: transparent !important; }
body .fancybox-close-small svg { opacity: 0; }
body.page-template-template-saving-accounts-parent .fancybox-close-small svg { opacity: 1; }
body.page-template-template-saving-accounts-parent .fancybox-close-small { width: 45px; height: 45px; }


.blog_post_bar .group { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; }

.accounts-abr.top_space { padding: 130px 0 0; }

/*.fancybox-slide--html { padding: 200px 120px 110px !important; }
.fancybox-content { background: #f8fbfd; padding: 0 !important; border-radius: 10px;}
.fancybox-slide--html .fancybox-close-small span { display: none;}
.fancybox-slide--video .fancybox-content video { }*/
#myVideo { width: 640px; padding-bottom: 56.25% !important; }
#myVideo video { width: 100% !important; height: 100% !important; position: absolute; left: 0px; top: 0px; }

.filteraccounts { background: #f8fbfd; padding: 0 !important; border-radius: 10px; width: 1160px;}
.filteraccounts .fancybox-close-small span { display: none;}
.filteraccounts .fancybox-close-small { background: none; }

.popup-contact-box .fancybox-close-small { padding: 0px !important; right: 30px !important; top: 20px !important; }

.filter_popup { position: relative; }
.filter_popup h2 { padding: 50px 0 40px; font-size: 30px; color: #17215C; font-family: 'Area Extended'; border-bottom: 2px solid #dbdbdb; font-weight: 300; text-align: center; }
.filter_popup .wrapper { padding: 0; }
.filter_popup  .itembox { padding: 0 90px; }
.filter_popup  .itembox .subtext { padding: 60px 0; display: -webkit-flex; display: flex; justify-content: space-between; flex-wrap: wrap; border-bottom: 2px solid #dbdbdb; position: relative; align-items: center; }
.filter_popup  .itembox .text .yearage { font-size: 30px; color: #17215C; font-family: 'Area Extended'; font-weight: 700; display: block; line-height: 1.2; }
.filter_popup .itembox .subtext:last-child { border-bottom: none; }
.filter_popup .itembox .subtext .clearbtn { font-size: 25px; color: #17215C; text-decoration: underline; }
.filter_popup .itembox .subtext .clearbtn:hover  { color: #17215C; }

#popupresults { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 101; display: none; background: rgba(0,0,0,0.5); }
#popupresults .popup-contact-box { position: absolute; left: 50%; top: 50%; width: 1160px; max-height: 80%; overflow: auto; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); border-radius: 20px; -webkit-border-radius: 20px; background: #fff; }
#popupresults .loan_results .itembox .approxi a.learnBtn { }

/* / Toggle Btn / */
.switch-tab-btn { margin: 0; cursor: pointer; display: none; background: #fff; border-bottom: none;  }
.switch-tab-btn input { opacity: 0;  width: 0; height: 0; }
.switch-tab-btn .switch-slider { width: 143px;  height: 45px;  display: inline-block; vertical-align: middle;  position: relative; background-color: #c1c1c1;
    -webkit-transition: .4s; transition: .4s; border-radius: 30px; text-transform: uppercase; overflow: hidden; color: #fff; }
.switch-tab-btn .switch-slider span { display: block; width: 33.33%; height: 100%; float: left; position: relative; }
.switch-tab-btn .switch-slider { }
.switch-tab-btn .switch-slider { }
.switch-tab-btn .switch-slider:before { position: absolute; content: ""; height: 45px; width: 45px; margin: 0 auto; left: 0; right: 0; top: 0; background-color: #fff; -webkit-transition: .4s; transition: .4s; border-radius: 100%;  -webkit-transform: translateX(0);  -ms-transform: translateX(0); transform: translateX(0);  }
.switch-tab-btn input:checked ~ .switch-slider, .switch-tab-btn.active .switch-slider { background-color: #17215C; }
.switch-tab-btn input:checked ~ .switch-slider:before, .switch-tab-btn.active .switch-slider:before { -webkit-transform: translateX(43px);  -ms-transform: translateX(43px); transform: translateX(43px); }
.switch-tab-btn .switch-slider.yesactive, .switch-tab-btn .switch-slider.noactive { background-color: #17215C; }
.switch-tab-btn .switch-slider.yesactive:before { -webkit-transform: translateX(50x);  -ms-transform: translateX(50px); transform: translateX(50px); }
.switch-tab-btn .switch-slider.noactive:before { -webkit-transform: translateX(-50px);  -ms-transform: translateX(-50px); transform: translateX(-50px); }
.switch-tab-btn .inner { display: inline-block; vertical-align: middle; text-align: center; padding: 0 14px; font-size: 22px; color: #17215C; font-family: 'Area Normal'; font-weight: 300; }
.switch-tab-btn .switch-slider .present, .switch-tab-btn .switch-slider .absent {  font-size: 1.3vw !important; padding: 0.04vw 0.5vw; }

/* 13-04 ================= */
/* services_busines_bar */
.services_busines_bar .benefits_list { padding: 0 0 100px 400px; }
.services_busines_bar .contact_btn {  padding: 10px 20px; min-width: 190px; }

/* services_contant_bar */
.services_contant_bar { padding: 0px 0 90px; width: 100%; }
.services_contant_bar p { padding: 0 0px 45px; font-size: 17px; color: #0E153E; line-height: 1.22; font-family: 'Area Normal'; font-weight: 700; text-align: center; }
.services_contant_bar .finra { color: #777777; text-decoration: underline; }
.services_contant_bar .finra:hover { color: #17215C; }
.services_busines_bar .subtext .image { padding: 100px 0 0; }
.services_busines_bar .subtext .image img { margin: 0 auto; }
.services_contant_bar .insured_list { padding: 17px 20px; max-width: 1000px; text-align: center; border: 1px solid #0E153E; margin: 0 auto; }
.services_contant_bar .insured_list li { padding: 0 5px 0 1px; line-height: 16px; display: inline-block; font-family: 'Area Normal';font-weight: 700; color: #0E153E; border-right: 1px solid #0E153E; }
.services_contant_bar .insured_list li a  { line-height: 1; display: inline-block; font-size: 17px; color: #0E153E; font-family: 'Area Normal'; font-weight: 700; text-align: center; }
.services_contant_bar .insured_list li:last-child { border-right: none; }
.services_contant_bar .insured_list li a:hover { color: #17215C; }
.services_contant_bar.services_contant {  padding: 40px 0 160px;  }

/* mortgage_banner */
.mortgage_banner { position: relative; z-index: 1; }
.banner-bar .one_stap { background: rgba(41,71,92,0.7); }
.banner-bar .one_stap h1 { font-family: 'Area Extended'; font-weight: 700; font-style: italic; }

/* mortgage_contant_bar */
.mortgage_contant_bar { padding: 74px 0 17px; width: 100%; background: #f0f0f0; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); }
.heading_2, .mortgage_contant_bar h2 { padding: 0 0 55px; font-size: 48px; text-align: center; color: #17215C; font-family: 'Area Extended'; font-weight: normal; }
.mortgage_contant_bar .subtext { max-width: 945px; margin: 0 auto; }
.mortgage_contant_bar .subtext p { padding: 0 0 32px; font-size: 18px; line-height: 31px; color: #0E153E; }
.mortgage_contant_bar .button{ margin: 20px auto 0; padding: 10px 23px; }
.mortgage_contant_bar .btn_group { padding: 30px 0 0; width: 100%; text-align: center; }
.mortgage_contant_bar .btn_group a { margin: 0 0 0 40px; font-size: 16px; color: #999899; text-decoration: underline; text-transform: uppercase; }
.mortgage_contant_bar .btn_group a:hover { color: #17215C; }

.mortgage_contant_bar .btn_group p a:first-child {
    margin: 0;
}
.inner-banner-bar .is-layout-flex.wp-block-buttons { justify-content: center; padding-top: 10px; }

/* what_would_bar */
.what_would_bar { padding: 150px 0 130px; width: 100%; }
.what_would_bar .wrapper { max-width: 1240px; }
.what_would_bar .itembox { padding: 55px 0 0; display: -webkit-flex; display: flex;  justify-content: space-between; flex-wrap: wrap; }
.what_would_bar .itembox .text { margin: 0 0 20px; width: calc(33.33% - 15px); background: #fff; text-align: center; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); }
.what_would_bar .itembox .text img { width: 100%; }
.what_would_bar .itembox .text .sub { padding: 35px 30px 55px 50px; }
.what_would_bar .itembox .text h3 { padding: 0 0 30px; font-size: 30px; color: #17215C; font-family: 'Area Extended'; }
.what_would_bar .itembox .text p { padding: 0 20px 38px 13px; text-align: left; font-size: 18px; line-height: 1.7; color: #0E153E; font-family: 'Area Normal'; font-weight:300; }

/* estimate_bar */
.estimate_bar { padding: 0 0 50px; } 
.estimate_bar .item-bar { margin: 0 0 130px; }  

/* checkout_bar */
.checkout_bar { margin: 0; width: 100%; background-repeat: no-repeat; background-size: cover; height: 567px; background-position: bottom; }
.checkout_bar .itembox { display: -webkit-flex; display: flex;justify-content: flex-end; flex-wrap: wrap; }
.checkout_bar .itembox .text  { padding: 125px 0; width: 50%; text-align: center; }
.checkout_bar .itembox .text h2 { padding: 0 0 50px; color: #fff; }
.checkout_bar .learnBtn { padding: 12px 43px 12px; }

.inner-banner-bar.inner-bay-home-banner .text:before { background: rgba(47, 97, 123, 0.59); } 
.inner-bay-home-banner .learnBtn { margin: 50px 0 0; }
.inner-bay-home-banner p { padding: 30px 0 0; }

/* process_bar */
.process_bar { padding: 90px 0 60px; width: 100%; }
.process_bar .contact { margin: 10px 0 35px; }
.process_bar .contact h3 {height: 74px;padding: 0px 25px 0px;font-size: 30px;color: #fff;font-family: 'Area Extended';background: #265468;position: relative;box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);display: flex;flex-wrap: wrap;align-items: center;}
.process_bar .contact h3:after{ content: ""; position: absolute; right: 0px; bottom: 0; width: 0; height: 0;  border-right: 25px solid white; border-top: 40px solid transparent; border-bottom: 40px solid transparent; }
.process_bar .contact h3:before{ content: ""; position: absolute; right: -4px; bottom: 0; width: 4px; height: 100%; background: #fff; }
.process_bar .contact h3 span {margin-top: 0px;opacity: 0.47;padding-right: 10px;}
.process_bar .contact .sub { padding: 18px 60px 8px 122px; }
.process_bar .contact:nth-of-type(1) .sub { }
.process_bar .contact .sub p { padding: 0; font-size: 18px; line-height: 1.72; color: #0E153E; }
.dot_list { padding: 0 0 0px 20px; } 
.dot_list li { font-size: 18px; line-height: 1.72; padding: 0 0 0 10px; position: relative; }
.dot_list li:before { content: ""; width: 4px; height: 4px; border-radius: 100%; position: absolute; top: 15px; left: 0; background: rgba(0,0,0,0.4); }
.process_bar .contact .sub .learnBtn { margin: 30px auto 0; display: table; }
.process_bar .contact ul { padding: 0 0 8px 20px; } 
.process_bar .contact ul li { font-size: 18px; color: #0E153E; line-height: 1.72; padding: 0 0 0 10px; position: relative; }
.process_bar .contact ul li:before { content: ""; width: 8px; height: 8px; border-radius: 100%; position: absolute; top: 12px; left: 0; background: rgba(0,0,0,0.4); }
.process_bar.mortgagechild .contact ul li { padding: 0 0 0 15px; }
.process_bar.mortgagechild .contact ul li strong { font-family: 'Area Normal';}

/* mortgageis_bar */
.mortgageis_bar { width: 100%; padding: 82px 0 100px; } 
.mortgageis_bar .itembox { padding: 45px 0 0; display: -webkit-flex; display: flex;  justify-content: space-between; flex-wrap: wrap; }
.mortgageis_bar .itembox .text { padding: 40px 0 50px; margin: 0 0 20px; width: calc(50% - 8px); background: #fff; border-top: 25px solid #31D0FF; text-align: center; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); }
.mortgageis_bar .itembox .text:nth-of-type(1) { padding: 40px 0 28px; }
.mortgageis_bar .itembox .text h3 { padding: 0 0 20px; font-size: 30px; color: #31D0FF; font-family: 'Area Extended'; }
.mortgageis_bar .itembox .text p { padding: 0 40px 0 47px; text-align: left; font-size: 18px; line-height: 1.7; color: #0E153E; font-family: trade-gothic-next, sans-serif; font-weight:300; }
.mortgageis_bar .itembox .btn_group { padding: 30px 0 0; width: 100%; text-align: center; }
.mortgageis_bar .itembox .btn_group a { margin: 0 0 0 40px; font-size: 16px; color: #fff; text-decoration: underline; text-transform: uppercase; }
.mortgageis_bar .itembox .btn_group a:hover { color: #17215C; }
.mortgageis_bar .itembox .text.readytake, .mortgageis_bar .itembox .text:last-child { text-align: center; background: #31D0FF; }
.mortgageis_bar .itembox .text.readytake h3, .mortgageis_bar .itembox .text:last-child h3 { color: #fff; }
.mortgageis_bar .itembox .text.readytake .learnBtn, .mortgageis_bar .itembox .text:last-child .learnBtn { margin: 25px 0 0; padding: 12px 23px 12px; }
/* .mortgageis_bar .itembox .text:last-child p { text-align: center; } */
.mortgageis_bar .itembox .text:last-child a { margin: 0 20px; color: #fff; text-decoration: none; }
.mortgageis_bar .itembox .text:last-child a.button { margin: 0 0 30px; text-decoration: none; }
.mortgageis_bar.mortvideo_bar .itembox .text { padding: 0; border: none; position: relative; margin: 0 auto; background-color: #29475c; }
.mortgageis_bar.mortvideo_bar .itembox .text img { height: 305px;
width: auto;
text-align: center;
margin: 0 auto; }
.mortgageis_bar.mortvideo_bar .itembox .text:before { content: ""; width: 100%; height: 372px; z-index: 2; position: absolute; top: 0;
    left: 0; bottom: 0; right: 0; }
.mortgageis_bar.mortvideo_bar .itembox { padding: 0; }
.mortvideo_bar .itembox .text .video_thumb { padding: 90px 0 0 0; display: inline-block; font-size: 18px; line-height: 22px; text-transform: uppercase; color: #fff; background: url(assets/images/video_img.png) no-repeat; background-position: center top; letter-spacing: 0.72px; position: absolute; top: 33%; left: 0; right: 0;   z-index: 3; transform: translate(0, -33%); }

.page-id-16905 .mortvideo_bar .itembox .text .video_thumb {
  top: 23%;
}

.page-id-16905 .mortvideo_bar .itembox .text .sub {
  margin-top: 0;
    min-height: 290px;
}

.page-id-2650  .mortvideo_bar .itembox .text .video_thumb{top: 18%;}
.page-id-2650 .mortgageis_bar.mortvideo_bar .itembox .text{background: #29475c;}
.mortvideo_bar .itembox .text .video_thumb:hover { opacity: 0.50; }
.mortvideo_bar .itembox .text .sub { padding: 20px 10px 20px 30px;
background: #29475c;
position: relative;
z-index: 3;
margin-top: 0;
min-height: 200px; }
.mortvideo_bar .itembox .text .sub h3 { color: #fff; min-height: auto; font-family: 'Area Extended'; font-weight: normal; text-align: left; } 
.mortvideo_bar .itembox .text .sub p { color: #fff; padding-left: 0px; font-family: 'Area Normal'; font-size: 16px; line-height: 29px; }


.mortgage_contant_bar .accordion_bar { padding: 40px 0 100px; background: transparent; max-width: 1080px; margin: 0 auto; }
.mortgage_contant_bar .accordion_bar .accordion-item h3 { color: #31D0FF; }

/* prequalified_bar */
.prequalified_bar { padding: 45px 0 170px; text-align: center; }
.prequalified_bar h2 { padding: 0 0 55px; font-size: 48px; text-align: center; color: #17215C; font-family: 'Area Extended'; font-weight: normal; }
.heading_2 span { font-size: 36px; font-family: 'Area Extended'; display: block; }
.prequalified_bar h2 strong { font-size: 36px; font-family: 'Area Extended'; display: block; font-weight: normal; }
.video_watch .fancybox-button svg { width: 27px; height: 27px; line-height: 20px; color: #fff; border-radius: 100%; position: absolute; top: -40px; right: 4px;  background: rgba(160, 160, 160, 0.45); border: 1px solid #ffffff; }

/*.fancybox-content { overflow: initial !important; }
#video-content iframe { width: 100%; height: 560px; }
.video_watch.fancybox-content { max-width: 84% ; }*/

/* personal_chek_bar */
.busines-contant-bar.personal_chek_bar .subtext h2 { padding: 30px 0 40px; }
.personal_chek_bar p { text-align: center; }

/* interest_checking */
.interest_checking { }
.money_market_bar.interest_checking .itembox .item { width: calc(25% - 17px); padding: 36px 25px 40px; }

.interest_checking .wrapper { max-width: 1300px; }

/* pinnacle_checking_bar */
.pinnacle_checking_bar { padding: 35px 0 95px; }
.pinnacle_checking_bar h3 { padding: 0 0 40px; font-size: 48px; color: #17215C; font-family: 'Area Extended'; font-weight: 400; text-align: center; }
.pinnacle_checking_bar p { padding: 0 10px 47px; font-size: 18px; color: #17215C; line-height: 25px; text-align: center; font-family: 'Area Normal'; font-weight:300; }
.pinnacle_checking_bar ul { padding: 0 0 60px; width: 100%; text-align: center; }
.pinnacle_checking_bar ul li { display: inline-block;     padding: 0 7px; }
.pinnacle_checking_bar ul li a { color: #17215C; font-size: 16px; font-family: 'Area Normal'; font-weight:300; text-decoration: underline; }
.pinnacle_checking_bar ul li a:hover { color: #17215C; }
.pinnacle_checking_bar p.gift_will, .pinnacle_checking_bar h4 { font-size: 15px; font-weight: 400; text-align: center; font-family: 'Area Extended'; font-weight:300; line-height: 25px; }
.mayalso_bar.savings_bar .itembox .item .text { padding: 65px 10px 50px; }
.mayalso_bar.savings_bar .itembox .item:nth-of-type(2) .text { padding: 65px 10px 50px; }
.mayalso_bar.savings_bar .itembox .item:nth-of-type(2) .text p { padding: 0 0 30px; }
.savings_bar .itembox .item .image img { height: 100%; object-fit: cover; object-position: right; }

/* notice_banner */
.notice_banner { border-bottom: none; height: 537px; box-shadow: inherit; }

/* mortgagecalculator */
.mortgagecalculator-bar { padding-top: 40px; min-height: 500px; }

/* privacy_content_bar */
.privacy_content_bar { padding: 150px 0 0px; width: 100%; }
.privacy_content_bar table { border-collapse:collapse; caption-side:bottom; width: 100%; border-spacing: 0; margin: 0 0 65px; }
.privacy_content_bar th, .privacy_content_bar td { border: solid 1px #0E153E; padding: 10px 15px;  }
.privacy_content_bar table.reasons { background: #fcfcfc; }
.privacy_content_bar .personal { margin: 0; }
/* .personal td { padding: 0; border: none;  } */

.privacy_content_bar td.types { }
.privacy_content_bar table td { font-size: 20px; color: #0E153E; vertical-align: middle; }
.privacy_content_bar table td p { padding: 10px 0; }
.privacy_content_bar table td.factbox { padding: 55px 20px; vertical-align: middle; width: 113px; text-align: center; background: #eaeaea; }
.privacy_content_bar table td.subfact, .privacy_content_bar table.facts tr:first-child td:first-child { padding: 4px 20px; text-align: center; background: #535458; color: #fff; }
.privacy_content_bar table.facts tr:first-child td:nth-child(2) { background: #eaeaea; padding: 7px 20px; }
.privacy_content_bar table.facts tr:first-child td:nth-child(2) p { }
.privacy_content_bar .sociles { padding: 0 0 0 27px; }
.privacy_content_bar table.facts ul, .privacy_content_bar table.weare ul { padding: 10px 40px; float: left; width: calc(50% + 15px); border-top: solid 1px rgba(112, 112, 112, 0.7); border-right: solid 1px rgba(112, 112, 112, 0.7); margin-left: -15px; margin-bottom: -10px; }
.privacy_content_bar table.facts ul + ul, .privacy_content_bar table.weare ul + ul { border-right: 0px; margin-left: 0px; margin-right: -20px; }
.privacy_content_bar table.weare ul { border-bottom: solid 1px rgba(112, 112, 112, 0.7); }
.privacy_content_bar table.weare ul { width: calc(50% + 20px); margin-left: -20px; margin-bottom: 20px; }

.privacy_content_bar table.facts ul li, .privacy_content_bar table.weare ul li { position: relative; padding: 0 0 0 10px; line-height: 1.5;  }
.privacy_content_bar table.facts ul li:before, .privacy_content_bar table.weare ul li:before { content: ""; width: 5px; height: 5px; border-radius: 100%; background: #0E153E; position: absolute; top: 15px; left: 0; }
.privacy_content_bar table.weare ul.fullview { width: auto; float: none; border: 0px; margin: 0px 0px 20px 0px; }
.privacy_content_bar table.facts { }
.privacy_content_bar .sociles li { position: relative; padding: 0 0 0 10px; line-height: 1.5; }
.privacy_content_bar .sociles li:before { content: ""; width: 5px; height: 5px; border-radius: 100%; background: #0E153E; position: absolute; top: 15px; left: 0; }
.privacy_content_bar table th { font-size: 20px; font-family: 'Area Extended'; vertical-align: middle; }
.privacy_content_bar .reasons th, .privacy_content_bar .reasons tr:first-child td { padding: 20px 30px 27px; width: 33.33%; text-align: center !important; background: #eaeaea;  font-size: 20px; font-family: "Helvetica Neue"; font-weight: 700; vertical-align: middle;  }
.privacy_content_bar .reasons td { padding: 16px 35px 20px 15px; text-align: center; vertical-align: middle; }
.privacy_content_bar  td.question { padding: 8px 20px; }
.privacy_content_bar .weare th { padding: 20px 20px; text-align: left; color: #0E153E; background: #eaeaea; }
.privacy_content_bar .reasons tr:first-child td { padding: 20px; text-align: left !important; font-weight: 400; background: none; }
.privacy_content_bar .reasons tr:first-child td p { padding-bottom: 0px; }
.privacy_content_bar .reasons tr td ul { list-style: disc; padding-left: 20px; }
.privacy_content_bar .reasons tr td ul { }
.privacy_content_bar .sharing { padding: 0 0 40px; }
.privacy_content_bar .weare td { padding: 20px 20px; }
.privacy_content_bar .weare td.types { padding: 0; border: none; }
.privacy_content_bar .common li { font-style: italic; }
.privacy_content_bar td a.phone, .privacy_content_bar td a.email { color: #0E153E; }
.privacy_content_bar .bank_offers td { vertical-align: middle; }
.privacy_content_bar .bank_offers td.prohibit { padding: 25px 20px; }
.privacy_content_bar .immediately, .privacy_content_bar ol { padding: 0 20px 0 50px; }
.privacy_content_bar .immediately li, .privacy_content_bar ol li { padding: 0 0 20px; line-height: 1.2; }
.privacy_content_bar .weare td.provid, .privacy_content_bar .weare th:first-child { width: 364px; vertical-align: middle; }
.privacy_content_bar .weare th:first-child { border-right: 0px; }
.privacy_content_bar .weare th:nth-child(2) { border-left: 0px; }
.privacy_content_bar table.definitions td.factbox, .privacy_content_bar .definitions th:first-child { padding: 7px 5px; width: 112px; }
.privacy_content_bar table.definitions th:first-child { padding: 7px 15px; }
.privacy_content_bar table.definitions ul { margin: 0px; border: 0px; width: auto; float: none; }
.privacy_content_bar table.definitions ul li { font-style: italic; }
.privacy_content_bar table.firstchild { margin-bottom: 0px; border-bottom: 0px; }
.privacy_content_bar table.firstchild th { color: #0E153E; }
.privacy_content_bar table.firstchild tr:last-child td { border-bottom: 0px; }
.privacy_content_bar table.bank_offers1 td:first-child { color: #0E153E !important; background: #eaeaea !important; }
.privacy_content_bar table.bank_offers1 td:nth-child(2) { background: none !important; }
.privacy_content_bar table.bank_offers1 { margin-bottom: 0px; }
.privacy_content_bar table.lastchild td { color: #0E153E !important; background: #fcfcfc !important; border-top: 0px; }
.privacy_content_bar table.reasons3 { }
.privacy_content_bar .reasons3 tr:first-child td { text-align: center !important; background: #eaeaea; font-weight: 700; }

/* holiday_ba */
.holiday_bar { padding: 130px 0 60px; }
.holiday_bar .reasons2 th { padding: 10px 10px 40px; border: none; text-align: center; font-size: 25px; color: #0E153E; }
.holiday_bar .reasons2 td { text-align: center; }
.holiday_bar .reasons2 td:first-child { text-align: left; width: 50%; }
.holiday_bar .reasons2 th:first-child { width: 35%; }
.holiday_bar .reasons2 tr:nth-child(even) td { background: #fcfcfc; }

/* popmoney_bar */
.popmoney_bar { padding: 80px 0 0px; }
.popmoney_bar img { margin: 0 auto; }
.popmoney_bar .wp-block-image { margin-bottom: 60px; }
.popmoney_bar .subtext { padding: 60px 0 0; }
.popmoney_bar p { font-size: 18px; line-height: 31px; color: #0E153E; }

/* get_started_bar */
.process_bar.started_bar { padding: 42px 0 60px; }
.started_bar h2.heading_2 { padding: 0px 0 42px; font-size: 48px; color: #17215C; font-family: 'Area Extended'; font-weight: 400; }  
.process_bar.started_bar .contact h3 { background: #17215C; }
.process_bar.started_bar .contact { margin: 10px 0 0px; }
.process_bar.started_bar .contact .sub p { padding: 0 0 35px; }
.process_bar.started_bar .contact .sub p.send_mony { padding: 0; }

/* started_bar */
.started_bar .contact .sub .dot_list { padding: 0 0 35px; }
.started_bar table { border-collapse:collapse; caption-side:bottom; width: 100%; border-spacing: 0; margin: 10px 0 45px; background: #fcfcfc; }
.started_bar th, .started_bar td { border: solid 2px rgba(112, 112, 112, 0.7); }
.started_bar tr:first-child td { padding: 25px 0;  background: #17215C; font-size: 18px; color: #ffffff; line-height: 1.1;  font-family: 'Area Extended'; font-weight: 700; }
.started_bar td { padding: 25px 0; text-align: center; vertical-align: middle; font-size: 18px; color: #0E153E; ffont-family: 'Area Normal'; font-weight: 400; }
.started_bar tr:nth-of-type(1) th { border-left: none; }
.started_bar th:last-child { border-right: none; }
.started_bar td:first-child { border-left: none; }
.started_bar td:last-child { border-right: none; }
 
/* Privacy_bar */
.Privacy_bar { width: 100%; padding: 100px 0 100px; }
.Privacy_bar h2, .Privacy_bar h1 { padding: 0 0 8px; font-size: 45px; color: #0E153E; line-height: 1.66; font-family: 'Area Extended';font-weight: normal; }
.Privacy_bar p { padding-bottom: 22px; font-size: 18px; color: #0E153E; line-height: 23px; font-family: 'Area Normal'; font-weight:400; }
.Privacy_bar h4 { color: #0E153E; font-size: 18px; padding-bottom: 21px; }
.noticeText h1 { font-family: 'Area Extended'; font-weight: 700; font-style: italic; }


.Privacy_bar ul {
    list-style: disc;
    color: #0E153E;
    font-size: 18px;
   font-family: 'Area Normal';
    margin: 0 0 20px 40px;
}

.Privacy_bar ul li {
    padding: 5px 0;
}

.Privacy_bar ol {
    color: #0E153E;
    font-size: 18px;
    font-family: 'Area Normal';
    margin: 0 0 0 20px;
}


.Privacy_bar ol li {
    padding: 5px 0;
}


/*  banking_banner  */
.banking_banner .text { max-width: 550px; }
.banking_banner  .text:before{ right: -60px; }
/* mobile_content_bar */
.mobile_content_bar { padding: 76px 0 80px; }
.mobile_content_bar .wrapper { max-width: 1270px; }
.mobile_content_bar .sub_using { max-width: 950px; margin: 0 auto; } 
.mobile_content_bar .sub_using p, .banking_bar p { font-size: 18px; color: #0E153E; line-height: 1.72; font-family: 'Area Normal'; font-weight:300; }
.mobile_content_bar .sub_using p { line-height: 31px; }
.mobile_content_bar .itembox .text { border-top: 44px solid #17215C; }
.mobile_content_bar .itembox .access { padding: 0px 73px 0 40px; }
.mobile_content_bar .itembox .access li { padding: 0 0 30px; font-size: 18px; color: #0E153E; line-height: 1.72; font-family: 'Area Normal'; font-weight:300; text-align: left; }
.mobile_content_bar .itembox .access li:last-child { padding: 0; }
.mobile_content_bar .itembox .text h3 { padding: 0 0 30px; }
.mobile_content_bar .itembox .image img { width: 100%; }

/* banking_bar */
.banking_bar { width: 100%; padding: 0 0 80px;  }
.banking_bar h3 { padding-bottom: 35px; font-size: 30px; color: #17215C; text-align: center; }
.banking_bar .itembox { padding: 28px 0 0; display: -webkit-flex; display: flex; justify-content: space-between; flex-wrap: wrap; }
.banking_bar .itembox .text { width: calc(50% - 5px); }
.banking_bar .itembox .text p { padding: 0; }
.banking_bar .itembox .text .dot_list { padding: 0 0 0 45px; }
.banking_bar .itembox .text .dot_list li { margin: 5px 0 0; }
.banking_bar .itembox .text ul { padding: 0 0 0px 45px; } 
.banking_bar .itembox .text ul li { font-size: 18px; line-height: 31px; color: #0E153E; padding: 0 0 0 10px; position: relative; }
.banking_bar .itembox .text ul li:before { content: ""; width: 6px; height: 6px; border-radius: 100%; position: absolute; top: 13px; left: 0; background: rgba(0,0,0,0.4); }
.mobile_content_bar .itembox .text.image { background: transparent; }
.banking_bar .buttons { text-align: center; }

/* reorder_bar */
.reorder_bar .itembox .text p { text-align: center; padding: 0 0 20px; } 
.reorder_bar .itembox .text:nth-of-type(4) { padding: 50px 40px 45px 45px; }
.reorder_bar .itembox .text:nth-of-type(4) h3 { padding: 0 0 20px; }
.reorder_bar .itembox .text:nth-of-type(4) p { padding: 0 0 20px;}

/* qualified_bar */
.qualified_bar p { padding: 0 0 30px; max-width: 1015px; margin: 0 auto; }
.qualified_bar .button { padding: 10px 38px; }
.qualified_bar .contact_btn { min-width: 188px; }

.traditional_bar { padding: 45px 0 90px; }
.traditional_bar .subtext h2, .traditional_bar .subtext h3 { padding: 8px 0 15px; }
.traditional_bar .itembox { padding: 42px 0 0; display: -webkit-flex; display: flex; justify-content: space-between; flex-wrap: wrap; }
.traditional_bar .itembox .text { width: calc(50% - 40px); }
.traditional_bar .itembox .text h4 { padding: 0 0 15px; font-size: 25px; color: #17215C; line-height: 1.3; font-family: 'Area Extended'; }
.traditional_bar .subtext p { line-height: 31px; }
.busines_list.text-list { padding: 0; }
.traditional_bar .itembox .text ul li { margin: 10px 0 0; }
.traditional_bar .itembox ul { padding: 0px; }

/* personal_image */
.personal_image img { width: 100%; }

.roth_bar .subtext p { padding: 0 0 25px; text-align: center; }

/* contact_banner */
.contact_banner { height: 425px; }

/* can_help_bar */
.can_help_bar { padding: 58px 0 110px; }
.can_help_bar .subtext h2 { padding: 0 0 37px; text-align: center; font-family: 'Area Extended'; font-size: 48px; font-weight: 400; }
.can_help_bar .subtext p { padding: 0 0 74px; text-align: left; max-width: 925px; margin: 0; line-height: 1.5; }
.can_help_bar .formbox { margin: 0 0 25px;  display: -webkit-flex;  display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; } 
.can_help_bar .formbox .inputfild { width: calc(50% - 33px); }
.can_help_bar .formbox .inputfild .custom_fild { width: 100%; padding: 15px 20px; font-size: 17px; color: #515151; font-weight: 300; border: none; background-color: #f0f0f0;  }
.can_help_bar .formbox .inputfild label { margin: 0 0 14px; display: block; font-size: 21px; color: #17215C; font-family: 'Area Extended'; } 
.can_help_bar .formbox .inputfild .huisnr { width: 130px; }
.can_help_bar .formbox textarea { height: 285px; resize: none; }
.can_help_bar .formbox .inputfild.box { margin: 20px 0 0; width: calc(100% - 0px); }
.can_help_bar .formbox .inputfild label span { font-size: 15px; color: #0E153E; font-family: 'TradeGothic';}
.can_help_bar button { padding: 10px 25px; }
.can_help_bar .wpcf7 { overflow: hidden; margin: 0 0 25px; }
.can_help_bar .wpcf7 p { padding-bottom: 22px; float: left; width: calc(50% - 50px); margin: 0 50px 0 16px; }
.can_help_bar .wpcf7 p:nth-child(odd) { margin-right: 0px; }
.can_help_bar .wpcf7 label { margin: 0 0 10px; display: block; font-size: 21px; color: #17215C; font-family: 'Area Normal';} 
.can_help_bar .wpcf7 .wpcf7-text, .can_help_bar .wpcf7 .wpcf7-number, .can_help_bar .wpcf7 textarea { width: 100%; padding: 15px 20px; font-size: 17px; color: #515151; font-weight: 300; border: none; border-radius: 0px; -webkit-border-radius: 0px; background-color: #f0f0f0; }
.can_help_bar .wpcf7 p.msg { padding-top: 16px; margin-right: 0px; width: calc(100% - 32px); }
.can_help_bar .wpcf7 label small { color: #0E153E; font-family: 'Area Normal'; font-size: 15px; }
.can_help_bar .wpcf7 p.msg label { margin-bottom: 14px; }
.can_help_bar .wpcf7 textarea { height: 285px; resize: none; }
.can_help_bar .wpcf7 .wpcf7-not-valid { border: #f00 solid 1px !important; }
.can_help_bar .wpcf7 div.wpcf7-response-output { float: left; width: 100%; text-align: center; }
.can_help_bar .wpcf7 { }
.can_help_bar .wpcf7 { }
.can_help_bar { }

.report_card { padding: 50px 0 150px; }
.report_card .subtext h2 { padding: 45px 0 60px; }
.report_card .itembox { max-width: 670px;  margin: 0 auto; }
.report_card .itembox .text { text-align: center; }
.report_card .itembox .text  img { margin: 0 auto; }
.report_card .itembox .text p { padding: 30px 0 0; font-size: 20px; font-family: 'Area Normal'; font-weight:400; }
.report_card .itembox .text p span { display: block; font-size: 30px; color: #0E153E; line-height: 1; font-weight: 800; }
.report_card .itembox .text p span a { color: #0E153E; }

/* auto_loans_bar */
.auto_loans_bar { padding: 50px 0 110px; }
.auto_loans_bar .subtext p { text-align: center; }
.auto_loans_bar .subtext .benefits_list { padding: 0 0 0 390px; }
.auto_loans_bar .subtext h2 { padding: 40px 0 30px; }

/* calculator_bar */
.calculator_bar { padding: 55px 0 40px; width: 100%; background: #f0f0f0; }
.calculator_bar h2 { padding: 0 0 10px; font-family: 'Area Extended'; font-weight:300; color: #17215C; } 
.calculator_bar p { text-align: center; }
.calculator_bar form { max-width: 820px; margin: 35px auto 0; }
.calculator_bar .formbox { margin: 0 0 20px;  display: -webkit-flex;  display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; } 
.calculator_bar .formbox .inputfild { width: calc(50% - 16px); }
.calculator_bar .formbox .inputfild .custom_fild { width: 100%; padding: 12px 20px; font-size: 17px; color: #515151; font-weight: 300; border: none; background-color: #ffff;  }
.calculator_bar .formbox .inputfild label { margin: 0 0 0; display: block; font-size: 16px; color: #0E153E; font-family: 'Area Normal'; font-weight:300;} 
.calculator_bar .formbox .inputfild .huisnr { width: 130px; }
.calculator_bar .formbox textarea { height: 285px; resize: none; }
.calculator_bar .formbox .inputfild label span { font-size: 15px; color: #0E153E; font-family: 'Area Normal'; }
.calculator_bar .formbox .submit_btn { margin: 23px 0 0; display: -webkit-flex;  display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; }
.calculator_bar .formbox .submit_btn .button { padding: 10px 24px; }
.calculator_bar .formbox .inputfild .express { text-align: left; font-size: 11px; line-height: 1.2; }
.calculator_bar .formbox.rateas { margin: 0 0 5px; }
.common-checkmark-list-items ul li,
.checking-account-need-help-section .need-help-location-detail .detail { color: #17215C !important; }

/* speakbanker_bar */
.speakbanker_bar .itembox { max-width: 860px; margin: 0 auto; }
.get_started_bar.speakbanker_bar .itembox .item { width: calc(50% - 45px); }

/* loan_results */
.loan_results .itembox .subtext { padding: 70px 0 65px; }
.loan_results .itembox .subtext .text { width: calc(50% - 2px);  }
.loan_results .itembox .subtext .text .number { font-size: 22px; color: #17215C; font-family: 'Area Normal'; font-weight:300; }
.loan_results .itembox .subtext .results { width: 70%; padding: 0; }
.loan_results .itembox .subtext .text p.yearage { padding: 0; } 
.loan_results .itembox .approxi { padding: 50px 0; }

.debit_card_bar { padding: 40px 0 85px; }
.busines-contant-bar.debit_card_bar h3 { padding-bottom: 25px; }
.busines-contant-bar.debit_card_bar p { padding: 0 0 40px; line-height: 31px; }
.busines-contant-bar.debit_card_bar .subtext h2 { padding: 30px 0 28px; }
.debit_card_bar .subtext .contact_btn { margin: 20px auto 0; min-width: 187px; }


.busines-contant-bar .work_more ul {
    padding: 0 0 30px 0;
}

.busines-contant-bar .work_more ul li {
    padding: 0 0 3px 24px;
    position: relative;
    font-size: 18px;
    color: #0E153E;
    font-family: 'Area Normal';
    font-weight: 300;
    line-height: 29px;
}

.busines-contant-bar .work_more ul li::before {
    content: "";
    width: 13px;
    height: 15px;
    position: absolute;
    top: 8px;
    left: 0;
    background: url(assets/images/check_icon.png) no-repeat;
}

.faqs .accordion-item img {
    display: inline-block;
}

.faqs .accordion-item .appdownloads {
    width: 100%;
    text-align: center;
    margin: 5px auto 20px;
}

/* banking_app_bar */
.banking_app_bar { width: 100%; padding: 0 0 30px; }
.banking_app_bar .innertext { max-width: 690px; margin: 0 auto; text-align: center; }
.banking_app_bar .innertext h2, .banking_app_bar .innertext h3 { padding: 0 0 40px; font-family: 'Area Extended'; font-weight: 400; color: #17215C; font-size: 48px; }
.banking_app_bar .innertext p { padding: 0 0 30px; font-size: 18px; color: #0E153E; line-height: 1.72; font-family: 'Area Normal'; font-weight:300; }
.banking_app_bar .innertext .appgoogle { display: inline-block; margin: 30px 13px 0; }
.banking_app_bar .innertext .appgoogle img { margin: 0 auto; }

/* asked_bar */
.asked_bar { padding: 80px 0 125px; }

/* meet_pinny_banner */
.meet_pinny_banner .text { max-width: 600px; }
.meet_pinny_banner .text:before { right: -20px; }
.meet_pinny_banner p { font-size: 20px; line-height: 1.4; font-family: "Helvetica Neue"; }
.meet_pinny_banner h1 sup { font-size: 26px; }

.bank_debit_bar { padding: 80px 0 96px; }
.bank_debit_bar p { padding: 0 0 41px; line-height: 31px; } 
.bank_debit_bar .subtext h5 { padding-bottom: 40px; font-size: 20px; color: #17215C; font-family: 'Area Extended'; font-weight: 700; text-align: center; }
.bank_debit_bar .subtext .innerBox { margin: 50px auto 0; max-width: 760px; overflow: hidden; }
.bank_debit_bar .subtext .innerBox ul { padding-left: 55px; width: 50%; float: left; }
.bank_debit_bar .subtext .innerBox .inner .dot_list { padding: 0; }
.bank_debit_bar .subtext .innerBox ul li { font-size: 21px; line-height: 32px; color: #0E153E; padding: 0 0 12px 15px; position: relative; }
.bank_debit_bar .subtext h4 { padding-bottom: 20px; }
.bank_debit_bar .subtext ul { margin-top: 24px; }
.bank_debit_bar .subtext ul li { padding-bottom: 8px; }
.bank_debit_bar .subtext .innerBox ul li:before { content: ""; width: 8px; height: 8px; border-radius: 100%; position: absolute; top: 13px; left: 0; background: rgba(0,0,0,0.4); }

/* Check-mark list utility: use class="check-list" on a <ul> to render check icons instead of bullets */
ul.check-list,
.busines-contant-bar ul.check-list,
.busines-contant-bar .info ul.check-list,
.busines-contant-bar .subtext ul.check-list { list-style: none !important; list-style-type: none !important; padding-left: 0 !important; margin-left: 0 !important; }
ul.check-list li,
.busines-contant-bar ul.check-list li,
.busines-contant-bar .info ul.check-list li,
.busines-contant-bar .subtext ul.check-list li { position: relative !important; padding-left: 32px !important; list-style: none !important; list-style-type: none !important; display: block !important; }
ul.check-list li:before {
	content: "" !important;
	display: inline-block !important;
	position: absolute !important;
	left: 0 !important;
	top: 8px !important;
	width: 18px !important;
	height: 18px !important;
	background: url(assets/images/check_icon.png) no-repeat center center !important;
	background-size: contain !important;
	border-radius: 0 !important;
}

/* pinny_process_bar */
.pinny_process_bar { width: 100%; height: 406px; display: flex; align-items: center; flex-wrap: wrap;  background-repeat: no-repeat; background-size: cover; }
.pinny_process_bar .content { padding: 60px 0 55px; width: 610px; position: relative; z-index: 1; }
.pinny_process_bar .content:before { z-index: 1; content: ''; width: 50%; height: 100%; position: absolute;  left: 0;  top: 0; background: -moz-linear-gradient(left, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%); background: -webkit-linear-gradient(left, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); background: linear-gradient(to right, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=1 ); }
.pinny_process_bar .content:after { transform: skew(-28deg,0); -webkit-transform: skew(-28deg,0); content: ''; width: 5000px; height: 100%; background: rgba(23,33,92,0.70); position: absolute; right: -110px; top: 0; }
.pinny_process_bar .content .text { padding: 0 36px 0 0; float: right; position: relative; z-index: 1; }
.pinny_process_bar .content .text h2 { padding: 0; font-size: 48px; color: #ffffff; font-family: 'Area Extended'; font-weight: 700; }
.pinny_process_bar .content .text h2 sup { font-size: 28px; }

/* driveup_bar */
.driveup_bar { padding: 121px 0 90px; width: 100%; } 
.driveup_bar .wrapper { max-width: 1210px; }
.driveup_bar .itembox  { display: -webkit-flex;  display: flex; flex-wrap: wrap; justify-content: space-between; }
.driveup_bar .itembox .image1 { width: 75%; position: relative; }
.driveup_bar .itembox .image1 img { float: left; position: relative; z-index: 2; }
.driveup_bar .itembox .text { margin: 120px 0 0 -30px; padding: 45px 22px 39px 100px; float: left;  background: #fcfcfc; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.25); position: relative; z-index: 1; }
.driveup_bar .itembox .text:after { content: ""; width: 100%; height: 100%; position: absolute; right: -58px; top: 0px; background: #fcfcfc; transform-origin: bottom left; -ms-transform: skew(-14deg, 0deg); -webkit-transform: skew(-14deg, 0deg); transform: skew(-14deg, 0deg); z-index: -1; box-shadow: 3px 6px 4px -2px rgba(0,0,0,.2);
}
.driveup_bar .itembox .text ol li { font-size: 24px; color: #17215C; line-height: 1.45; font-family: 'Area Normal';font-weight: 700; }
.driveup_bar .itembox .image2 { width: 25%; }
.driveup_bar .itembox .image2 img { position: relative; right: -20px; top: -25px; }

/* full_watch_bar */
.full_watch_bar { margin: 0 0 60px; width: 100%; height:500px; background-repeat: no-repeat; background-size: cover; }
.full_watch_bar .overlay { width: 100%; height: 100%; background: rgba(0, 0, 0, 0.33); display: flex; align-items: center; justify-content: center; }
.full_watch_bar .video_thumb { padding: 90px 0 0 0; display: inline-block; vertical-align: top; font-size: 18px; line-height: 22px; text-transform: uppercase; color: #fff; background: url(assets/images/video_img.png) no-repeat; background-position: center top; }


/* whowe-box */
.whowe-box { padding: 90px 0 0;  width: 100%; overflow: hidden; }
.whowe-box h2 { padding: 0 0 10px;color: #0E153E;font-family: 'Area Extended'; font-size: 30px;font-weight: 700;} 
.whowe-box .whowe-top p {padding-bottom: 10px; color: #0E153E; font-size: 18px; font-family: 'Area Normal'; font-weight: 400;line-height: 31px; max-width: 569px; margin:0 auto;}
.whowe-box .whowe-top p strong { opacity:.48; }
.whowe-box .whowe-top { padding-top: 60px; width: 100%; text-align: center; background: url('./assets/images/whowe-bg.png')no-repeat; background-position:36px 5px; min-height: 423px; position: relative; }
.whowe-box .whowe-top:after { content:""; background:#f2f2f2; width: 2px; height: 236px; position: absolute; right: 25px; top: 45px; display: block}
.whowe-box .whowe-top:before { content:""; background:#f2f2f2; width: 2px; height: 234px; position: absolute;left: 24px; top: 42px; display: block}




/* .whowe-box .whowe-top:after{ content:""; display: block; width: 100%; background-image: linear-gradient(-1deg, rgba(240, 240, 240, 0.23) 0%, rgba(120, 120, 120, 0.35) 100%); opacity: 0.19; } */
.whowe-box .whowe-top img { margin:20px auto 0; } 

.information-list {  width: 100%; max-width: 980px; margin:30px auto 0; display: flex; flex-wrap: wrap; }
.information-list h3 { margin: 17px 0 21px; color: #17215C; font-size: 30px; font-family: 'Area Extended'; font-weight: normal;}
.information-list p { margin: 0 0 30px; color: #17215C;font-family: 'Area Normal'; font-weight: 400;font-size: 18px; line-height: 22px; }
.information-list ul { margin: 0 0 30px; padding: 0 0 0 16px; list-style: disc;}
.information-list li { padding-bottom: 5px; color: #17215C;font-family: 'Area Normal'; font-weight: 400;font-size: 18px; line-height: 22px; letter-spacing: -.1px; list-style: disc;}
.information-list .info-text { padding-left:62px; width: 30.5%; border-right: 1px solid #f2f2f2; padding-right: 38px;}
.information-list .info-text:first-child { padding-left: 0; }
.information-list .info-text:last-child { padding-right: 0; border: 0; width: 32%; }
.information-list .info-text:nth-child(2){ padding-right: 52px;width: 37.5%; padding-left: 70px; }

.newmap-box { width: 100%; overflow: hidden; margin: 40px 0 0;}
.newmap-box .wrapper { max-width: 1252px; }
.newmap-box .newmap-block { width: 100%; position: relative; }
.newmap-box .newmap-text { width: 100%; max-width: 830px; margin:0 auto;}
.newmap-box .newmap-text .left { width: 100%;}
.newmap-box .newmap-text .right { width: 100%;}
.newmap-box .loaction { display: flex; width: 100%; align-items: center; position: relative; text-align: center; align-content: center;}
.newmap-box .loaction .loaction-text { margin: 50px auto 75px; width: 202px; height: 202px; background-color: #17215C; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.newmap-box .loaction .loaction-text h5 {width: 192px;height: 192px;border: 1px solid #ffffff; border-radius: 50%; color: #ffffff;font-size: 16px;font-weight: bold;line-height: 23px; font-family: 'Area Extended'; display: flex;align-items: center;justify-content: center; flex-wrap: wrap; padding-top: 62px; position: relative; text-transform: uppercase;}
.newmap-box .loaction .loaction-text h5 em { 
font-size: 70px;
  font-style: normal;
  font-weight: bold;
  display: block;
  position: absolute;
  top: 64px;
  left: 0;
  right: 0;
  text-align: center;
  line-height: 50px;
}

/* directors-box */
.directors-box { margin-top: -17px; width: 100%; overflow: hidden; }
.directors-box .directors-top { padding: 63px 0 116px;  width: 100%; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);background-color: #17215C; position: relative;}
.directors-box .directors-top:after { content:""; background: url('./assets/images/directors-line.png')no-repeat; width: 100%; background-size: cover; height: 77px; position: absolute; bottom: 0; opacity: .14;}
.directors-box .directors-top h2 { color: #ffffff;font-size: 49px;font-weight: normal;line-height: 57px; font-family: 'Area Extended'; text-align: center; letter-spacing: -2.2px; padding-bottom: 15px; position: relative; left: -50px;}
.directors-box .directors-top p { padding: 0; font-size: 18px; font-family: 'Area Normal'; font-weight: 400;line-height: 25px; color: #ffffff;}
.directors-box .directors-top p strong { font-family: 'Area Normal'; font-weight: normal;}
.directors-box .directors-text { width: 100%; max-width: 570px; margin: 0 auto; position: relative; left: 50px;}

.directors-list { width: 100%; overflow: hidden; padding: 130px 0 0; }
.directors-list .directorlist { width: 100%; display: flex; flex-wrap: wrap;  justify-content: space-evenly; -webkit-justify-content: space-evenly; max-width: 960px; margin: 0 auto; }
.directors-list .directorlist img { margin:0 auto; }
.directors-list .directorlist h4 { padding: 0; color: #17215C;font-family: 'Area Extended'; font-size: 18px;font-weight: normal; line-height: 18px;}
.directors-list .directorlist p { padding: 0; color: #17215C;font-family: 'Area Normal'; font-size: 18px;font-weight: normal; line-height: 22px;}
.directors-list .directorlist .img { min-height: 141px; margin-bottom: 22px;}
.directors-list .director-info {width: 33.33%; text-align: center; margin-bottom: 80px;}

.plas-box { margin-top: 65px;  width: 100%; overflow: hidden; }
.plas-box .plas-block { width: 100%; max-width: 538px; margin: 0 auto;display: flex;
flex-wrap: wrap;}
.plas-box .plas-block h3 { color: #17215C;font-size: 23px;font-weight: normal; font-family: 'Area Extended'; min-height: 60px; margin-bottom: 14px; display: flex; align-items: center;
justify-content: center;}
.plas-box .plas-block p { padding: 0 0 30px;
  color: #5c5c5c;
  font-family: 'Area Normal';
  font-size: 18px;
  font-weight: normal;
  line-height: 22px;
  min-height: 163px;}
.plas-box .plas-block .plaslist  { margin: 0 auto 100px; padding: 65px 36px 65px; width: 48%;background: #fff;text-align: center; border-top: 15px solid #17215C; border-top-width: 15px;position: relative;box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);position: relative; max-width: 258px; min-height: 345px; margin-right: 2%; }
.plas-box .plas-block .plaslist:first-child { position: relative; left:-4px; }
.plas-box .plas-block .plaslist:last-child { margin-right: 0; }
.plas-box .plas-block .plaslist:before { content: "";  position: absolute;top: 100.5%;left: 0px;border-left: 129px solid rgba(0, 0, 0, 0.16);border-right: 129px solid rgba(0, 0, 0, 0.16);border-bottom: 20px solid transparent; z-index: 1; }
.plas-box .plas-block .plaslist::after { content: "";  border-left: 129px solid #fff; border-right: 129px solid #fff; border-bottom: 20px solid transparent; top: 100%;left: 0px;z-index: 2; display: block; position: absolute; }
.plas-box .plas-block a.learnBtn { padding: 10px; width: 189px; font-size: 18px; letter-spacing: 0.72px; }

.reports-box { width: 100%; overflow: hidden; margin-top: 48px; margin-bottom: 120px; }
.reports-box .reports-block { width: 100%; max-width: 903px; margin:0 auto; }
.reports-box .reports-block .reports-list { padding-top: 20px; padding-left: 32px; width: 100%; border-top: 2px solid #284e63;}
.reports-box .reports-block h3 { padding-top: 10px; margin-bottom: 17px; color: #17215C;font-size: 19px;font-weight: normal; ffont-family: 'Area Extended';letter-spacing: -1px; position: relative; cursor: pointer; } 
/* .reports-box .reports-block h3:after { content:""; background: url('./assets/images/minus-icon.png')no-repeat; width: 22px; height: 22px; left: -32px;top: 8px;
display: inline-block; position: absolute; } */
.reports-box .reports-block .reports-list:first-child h3 { padding:0; } 
.reports-box .reports-block .reports-list:first-child h3:after { top:-2px; } 

.reports-box .reports-block ul { list-style: none; display: flex; flex-wrap: wrap; width: 100%; max-width: 750px; margin-left: 10px; display: none; overflow: hidden; }
.reports-box .reports-block p {
    display: none;
}
.reports-box .reports-block .reports-list:first-child ul { display: block; }
.reports-box .reports-block ul li { width: 50%; margin-bottom: 23px; float: left; }
.reports-box .reports-block ul li a { padding-left: 36px; padding-top: 9px; display: block;color: #5c5c5c;font-size: 18px;font-weight: normal;font-family: 'Area Normal'; position: relative; }
.reports-box .reports-block ul li a:after { content:""; background: url('./assets/images/pdf-icon.png')no-repeat; width: 27px; height: 36px; position: absolute; left: 0; top: 3px; }

.reports-box .reports-block h3 i { float: left; font-size: 16px; color: #fff; margin-top: 2px;  width: 22px;  height: 22px; line-height: 22px; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; text-align: center;  background: #cbd5d7; position: absolute; top: 7px; left: -32px; }
.reports-box .reports-block .reports-list:first-child  h3 i {top: -2px;}




/* popup */

/*.pinnacle_content.fancybox-content { max-width: 730px; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); }
.pinnacle_content.fancybox-content { border-radius: inherit; } */

.pinnacle_content { width: 100%; height: 100%; position: fixed; left: 0px; top: 0px; z-index: 1; background: rgba(0,46,34,0.67); }
.pinnacle_content .terms_bar { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); max-width: 734px; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); width: 100%; background-repeat: no-repeat; background-size: cover; }
.pinnacle_content .terms_bar .overlay { padding: 60px 65px; width: 100%; height: 100%; background: rgba(115, 37, 62, 0.7); }
.pinnacle_content .terms_bar .content { padding: 40px 26px 40px 35px; border: 1px solid #fff; }
.pinnacle_content .terms_bar .content p { font-size: 26px; color: #fff; line-height: 1.5; text-align: center; padding: 0; }
.pinnacle_content .fancybox-close-small { padding: 0px !important; left: 10px; top: 10px !important; width: 27px; border: 1px solid #fff; background: rgba(160, 160, 160, 0.45); height: 27px; border-radius: 100%; color: #fff !important; }
.pinnacle_content span.close { width: 27px; height: 27px; background: rgba(160, 160, 160, 0.45); border-radius: 100%; display: flex;
align-items: center; position: absolute; top: 12px; left: 12px; cursor: pointer; }
.pinnacle_content span.close img { margin: 0 auto; }

/* loby_hours_bar */
.loby_hours_bar {  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); max-width: 734px; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); width: 100%; background: #fff; }
.loby_hours_bar .image img { width: 100%; }
.loby_hours_bar .itembox { padding: 30px 40px 20px 50px; display: -webkit-flex;  display: flex; flex-wrap: wrap; justify-content: space-between; }
.loby_hours_bar .itembox .text_left { width: 55%; }
.loby_hours_bar .itembox .text_left h2 { padding: 0 0 20px; font-size: 25px; color: #005941; font-family: 'Area Extended'; }
.loby_hours_bar .itembox .text_left h2 sub { font-size: 15px; }
.loby_hours_bar .itembox .text_left p { padding: 0; font-size: 18px; color: #6b6b6b; line-height: 1.2; }
.loby_hours_bar .itembox .text_left p sub, .loby_hours_bar .itembox .text_right p sub { font-size: 10px; }

.loby_hours_bar .itembox .text_right { width: 32%; }
.loby_hours_bar .itembox .text_right h3 { padding: 0 0 5px; font-size: 20px; color: #005941; font-family: 'Area Extended'; }
.loby_hours_bar .itembox .text_right p { font-size: 16px; color: #0E153E; line-height: 1.2; }
.loby_hours_bar .itembox .text_right p span { display: block; }

.navigation.pagination { padding: 30px 0; }
.navigation.pagination h2.screen-reader-text { display: none; }
.pagination-wrapper hr { display: none; }
.navigation.pagination span.prev, .navigation.pagination span.next, .navigation.pagination span.current, .navigation.pagination span.page-numbers.dots, .navigation.pagination a { margin-right: 5px; display: block; float: left; padding: 7px 15px; color: #fff; background: #17215C; }
.navigation.pagination span.current, .navigation.pagination a:hover { background: #17215C; }
.navigation.pagination { }


.contentintrobar { padding: 50px 0px 0px 0px; }
.contentintrobar .wrapper { max-width: 1230px; }
.contentintrobar h1 { padding-bottom: 20px; color: #17215C; font-size: 40px; font-weight: 600; }
.contentintrobar .textbg { padding-bottom: 30px; position: relative; }
.contentintrobar .textbg:before { content: ""; position: absolute; left: 0px; bottom: 0px; width: 250px; height: 2px; background: #31D0FF; }
.contentintrobar.zello { background-color: #F0F0F0; }
.contentintrobar.reverse { }
.contentintrobar.reverse h1 { font-size: 18px; font-style: normal; font-weight: 700; line-height: normal; letter-spacing: 1.44px; padding-bottom: 7px; }
.contentintrobar.reverse h2 { font-size: 40px; }
.contentintrobar.graybg { }
.contentintrobar.graybg { background-color: #F0F0F0; }
.contentintrobar { }
.contentintrobar { }
.contentintrobar { }


/* Alignment */ 
.alignleft {
	display: inline;
	float: left;
	margin-right: 1em !important;
}
.alignright {
	display: inline;
	float: right;
	margin-left: 1em !important;
}
.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
img.alignleft, img.alignright, img.aligncenter {
	margin-bottom: 1.625em;
}
table, th, td {
	border: none
}
table {
	border-collapse: separate;
	border-spacing: 0;
	border-width: 1px 0 0 1px;
	margin: 0 0 1.6em;
	table-layout: fixed; /* Prevents HTML tables from becoming too wide */
	width: 100%;
}
caption, th, td {
	font-weight: normal;
	text-align: left;
}
th {
	border-width: 0 1px 1px 0;
}
td {
	border-width: 0 1px 1px 0;
	vertical-align: top;
}
td img {
	width: 100%;
	max-width: 100%;
	vertical-align: top;
	margin: 0px;
	height: auto;
}
th, td {
	padding: 0.4em;
}
th {
	font-size: 24px;
	letter-spacing: 1px;
	line-height: 28px;
}
td img.alignnone {
	margin: 0px
}
blockquote {
	/*font-style: italic;*/ 
	font-weight: normal;
	margin: 0 1em;
}
blockquote em, blockquote i, blockquote cite {
	font-style: normal;
}
blockquote cite {
	color: #666;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
#blogWrapper {
	padding: 45px 0;
	width: 100%;
	overflow: hidden;
}
#blogWrapper .wrapper { max-width: 1250px; }
/* blog container */ 
.patners_box {
	float: left;
	width: 100%;
	text-align: center;
	padding: 20px
}
#BlogCntr {
	width: 100%;
	position: relative;
	overflow: hidden;
}
/* left blog box */ 
.leftBlogBox {
	width: 72%;
	float: left;
	padding-right: 30px;
	border-right: 1px solid #bebebe;
	min-height: 500px
}
.leftBlogBox ul, .leftBlogBox ol {
	margin-bottom: 20px;
	list-style-position: inside;
}
.single .leftBlogBox h1 {
	padding-bottom: 5px;
}
.single .leftBlogBox p {
	display: block
}
.leftBlogBox ul.dateBar {
	list-style: none;
	margin: 0 0 10px 0;
	padding: 0px
}
.single .leftBlogBox ul.dateBar {
	margin: 0 0 15px 0;
	padding-left: 0px
}
.leftBlogBox ul.dateBar li {
	font-size: 14px;
}
.leftBlogBox ul.dateBar li strong {
	color: #000;
}
.leftBlogBox p {
	padding-bottom: 15px;
	display: inline;
	margin-bottom: 0;
	line-height: 24px;
}
.leftBlogBox .postLoop {
	width: 100%;
	overflow: hidden;
	padding: 15px 0;
	margin: 0px;
	border-bottom: 1px solid #bebebe;
}
.leftBlogBox .postLoop:last-child, .leftBlogBox .postLoop:last-of-type {
	border-bottom: none;
}
.leftBlogBox .postLoop .image {
	float: left;
	margin: 5px 15px 5px 0;
}
.leftBlogBox .postLoop h2 {

	margin: 0px;
	font-size:30px;
}
.leftBlogBox .postLoop h2 a {
	color: #000;
	text-decoration: none
}
.leftBlogBox .postLoop h2 a:hover { color: #a40000; }
.leftBlogBox .postLoop a.read-more {
	display: inline-block; /*margin-left: 5px;*/
	color: #000;
	text-decoration: none;

	font-weight: 600
}
.leftBlogBox .postLoop a.read-more:hover {
	color: #a40000;
}
.leftBlogBox h4.title {
	font-size: 16px;
	font-weight: normal;
	padding-top: 15px;
	color: #000;

}
/* comment form */ 
.leftBlogBox #commentform {
	width: 100%;
}
.leftBlogBox #commentform input[type="text"], .leftBlogBox #commentform input[type="email"], .leftBlogBox #commentform textarea, .leftBlogBox #commentform input[type="url"] {
	border: 1px solid #000;
	padding: 7px 10px;
	box-sizing: border-box;
	color: #000;
	font-size: 15px;
	border-radius: 0px;
	-webkit-appearance: none;
	-webkit-border-radius: 0px;
	resize: none;
	margin: 0;
	width: 535px;
}
.leftBlogBox #commentform input[type="submit"] {
	width: auto;
	padding: 5px;
	border: none;
	background: #ea0000;
	color: #fff;
	cursor: pointer;
	border-radius: 0;
	font-size: 16px;
}
.leftBlogBox #commentform input[type="submit"]:hover, .leftBlogBox #commentform p.form-submit input[type="submit"]:hover {
	background: #0f86ff;
}
.leftBlogBox #commentform p.form-submit input[type="submit"] {
	width: auto;
	padding: 8px 15px;
	border: none;
	background: #5d3b05;
	color: #fff;
	cursor: pointer;
	margin-left: 100px;
}
.leftBlogBox #respond h3 {
	padding-bottom: 20px;
}
.leftBlogBox #commentform input[type="text"].error, .leftBlogBox #commentform input[type="email"].error, .leftBlogBox #commentform textarea.error {
	border: 1px solid #f00!important
}
.leftBlogBox div.error {
	display: none !important
}
.leftBlogBox h3#comments, .leftBlogBox #respond h3, h2.comments-title, h3#reply-title {
	border-bottom: 1px solid #000;
	font-size: 24px;
	font-weight: normal;
	line-height: 29px;
	margin-bottom: 10px;
	padding-bottom: 10px;
	color: #000;
}
.leftBlogBox #comments {
	clear: both;
	margin-bottom: 10px
}
.leftBlogBox #comments footer {
	border: none
}
.leftBlogBox .commentlist, .leftBlogBox .comment-list {
	list-style: outside none none;
	margin-top: 10px !important;
	margin-bottom: 10px;
}
.leftBlogBox .commentlist li {
	color: #34343f;
	font-size: 20px;
	line-height: 30px;
	list-style: outside none none;
	overflow: hidden;
}
.leftBlogBox .comment-list li {
	color: #34343f;
	font-size: 20px;
	line-height: 20px;
	list-style: outside none none;
	overflow: hidden;
}
.leftBlogBox img.avatar {
	float: left;
	margin: 3px 10px 10px 0;
	width: 50px;
	border: 1px solid #cccccc;
	max-width: 100%;
	height: auto;
	display: block
}
.leftBlogBox .commentlist cite.fn, .leftBlogBox cite.fn {
	color: #382db5;
	font-size: 16px;
}
.leftBlogBox span.says {
	font-size: 16px;
}
.leftBlogBox .commentlist a.url, .leftBlogBox .commentlist cite.fn, .leftBlogBox a.url, .leftBlogBox cite.fn {
	font-style: normal;
	text-decoration: none;
	font-size: 20px;
}
.leftBlogBox .comment-awaiting-moderation {
	font-size: 16px;
	line-height: 21px;
	color: #000;
	font-style: normal
}
.leftBlogBox .commentmetadata a {
	color: #000;
	cursor: default !important;
	font-size: 13px;
	line-height: 16px;
}
.leftBlogBox .commentlist p, .leftBlogBox .comment-list p {
	clear: both;
	font-size: 15px;
	line-height: 19px;
}
.comment-content p {
	padding-bottom: 5px;
}
#commentform p {
	padding-bottom: 15px !important;
	font-size: 16px;
	margin-bottom: 0;
}
.leftBlogBox .comment-list .comment-metadata {
	font-size: 16px;
	color: #000;
}
.leftBlogBox .comment-reply-link {
	font-size: 16px;
	text-decoration: none
}
.leftBlogBox .comment-reply-link:hover {
	text-decoration: none;
	color: #039be6;
}
#cancel-comment-reply-link {
	color: #000;
	text-decoration: none;
	font-size: 20px;
	line-height: 25px
}
#cancel-comment-reply-link:hover {
	text-decoration: underline
}
.leftBlogBox .reply {
	padding: 0px 0 15px;
}
.leftBlogBox .reply a {
	color: #000
}
.leftBlogBox #respond {
	margin-top: 10px; /*overflow: hidden;*/
	width: auto;
	padding: 0px
}
.leftBlogBox #cancel-comment-reply-link:hover {
	color: #039be6;
	text-decoration: none
}
.leftBlogBox .commentlist ul.children, .leftBlogBox .comment-list ol.children { /*margin-left: 25px;*/ /*float:left*/
}
.leftBlogBox label.screen-reader-text {
	display: none
}
.leftBlogBox #searchform {
	width: 100%;
	margin: 0 auto;
}
#commentform label {
	float: left;
	width: 100px;
	font-size: 16px;
	line-height: 21px
}
#commentform label.error {
	display: none!important
}
/* pagination */ 
.leftBlogBox .wp-pagenavi {
	margin: 25px 0 50px 0;
}
.leftBlogBox .wp-pagenavi a, .wp-pagenavi span {
	font-size: 15px;
	color: #000;
	border: 1px solid #7b7b7b
}
.wp-pagenavi a, .wp-pagenavi span {
	border-color: #3997db;
	padding: 5px 7px
}
.wp-pagenavi span.current {
	border-color: #3997db;
	font-weight: normal;
	color: #fff;
	background: #3997db;
}
.leftBlogBox .wp-pagenavi a:hover, .wp-pagenavi a:hover {
	background: #3997db;
	color: #fff;
	border-color: #3997db;
}
.wp-pagenavi span.pages:hover {
	border-color: #000;
}
/* right blog box */ 
   	 
.rightBlogBox {
	width: 27%;
	float: right;
	padding-top: 0;
	padding-left: 25px;
}
.rightBlogBox ul {
	width: auto;
	padding-left: 20px;
	list-style: disc
}
.rightBlogBox .widget {
	text-align: left;
	margin-bottom: 25px;
	overflow: hidden
}
.rightBlogBox h3.widgettitle {
	margin-bottom: 10px;
	text-align: center;
	color: #f1c855;
	font-size: 34px;
	text-align: left;

	line-height: 40px;
	padding-bottom: 0px
}
.rightBlogBox label.screen-reader-text {
	display: none;
}
.rightBlogBox #searchform {
	width: 100%;
	margin: 0 auto;
}
.rightBlogBox #searchform input#s {
	width: 65%;
	border: 1px solid #7b7b7b;
	height: 30px;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	padding: 5px;
	float: left;
	margin-right: 5px;
	color: #7b7b7b;
	height: 33px;
}
.rightBlogBox #searchform input#searchsubmit {
	width: 27%;
	background: #dfb643;
	color: #fff;
	border: none;
	height: 30px;

	font-weight: bold;
	cursor: pointer;
	float: left;
}
.rightBlogBox #searchform input#searchsubmit:hover {
	background: #c70505;
}
.rightBlogBox ul {
	list-style: disc;
	margin-top: 0px
}
.rightBlogBox ul li {
	width: 100%;
	text-align: left;
	padding: 2px 0;
	color: #000;
	font-size: 16px;
	line-height: 19px;
	list-style-position: inside;
}
.rightBlogBox ul li a {
	color: #000;
	text-decoration: none;

	outline: none
}
.rightBlogBox ul li.current-cat a {
	color: #382db5;
}
.rightBlogBox ul li a:hover {
	text-decoration: none;
	color: #382db5;
}
.mobilesidebar {
	display: none;
}
.desktopsidebar {
	display: block
}
/* single page */ 
.search-form .screen-reader-text {
	display: none
}
.rightBlogBox .search-form input[type='Search'] {
	border-radius: 0px;
	padding: 5px;
	font-size: 14px;
	line-height: 19px;
	float: left;
	border: solid 1px #000;
	color: #000;
	width: 62%;
	-webkit-appearance: none;
	-webkit-border-radius: 0px;
	height: 33px;
}
input#wpsl-search-input::placeholder {color: #fff;}
.search-form input[type='submit'] {
	float: left;
	background: #000;
	border-radius: 0px;
	font-size: 15px;
	line-height: 20px;
	border: none;
	color: #fff;
	cursor: pointer;
	-webkit-appearance: none;
	-webkit-border-radius: 0px;
	padding: 4px 15px;
	margin-right: 0px;
	height: 33px;
	border: solid 1px #000;
}
.search-form input[type='submit']:hover {
	background: #382db5;
	border: solid 1px #382db5;
}
.search-form input[type='Search']:focus {
	border: solid 1px #000!important
}
.leftBlogBox .singleimage {
	width: 100%;
	margin-bottom: 15px;
}
.leftBlogBox .singleimage img {
	max-width: 100%;
	height: auto;
	width: 100%
}		
		
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration { display: none; }	

img { height: auto; }

#wpsl-search-input::-webkit-input-placeholder, #wpsl-search-input:-ms-input-placeholder, #wpsl-search-input::placeholder, #wpsl-search-input::-moz-placeholder { 
  	color: #535458 !important;
	opacity: 1 !important;
}

sup {
  vertical-align: super;
  font-size: smaller;
}

.secondary_buttons {
	margin-top: 15px;
}

.secondary_buttons a {
	color: #ffffff;
	text-decoration: underline;
	text-transform: uppercase;
	line-height: 40px;
}

.page-template-template-mobile-banking .banking_bar ul {
    list-style: disc;
    padding: 0 0 0 30px;
    margin: -10px 0 20px;
}

.wp-video {
    text-align: center;
    margin: 0 auto 40px;
}


.wp-video, video.wp-video-shortcode, .mejs-container, .mejs-overlay.load {
    width: 100% !important;
    height: 100% !important;
}
.mejs-container {
    padding-top: 56.25%;
}
.wp-video, video.wp-video-shortcode {
    max-width: 100% !important;
}
video.wp-video-shortcode {
    position: relative;
}
.mejs-mediaelement {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
.mejs-controls {
    display: none;
}
.mejs-overlay-play {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: auto !important;
    height: auto !important;
}

.page-id-667 .totally_free_bar div div div:first-child {
    display: none;
}

.wp-video {
    border-top: #222222 solid 15px;
    border-bottom: #222222 solid 15px;
}

@media only screen and (max-width: 768px) {
    .wp-video {
        border-top: #222222 solid 10px;
        border-bottom: #222222 solid 10px;
    }
}

@media only screen and (max-width: 425px) {
    .wp-video {
        border-top: #222222 solid 5px;
        border-bottom: #222222 solid 5px;
    }
}



.newtestimonials {
    background-color: #fff;
    border-top: #17215C solid 16px;
    padding: 90px 95px 75px 170px;
    background-image: url(assets/images/testline.png);
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: 617px 197px;
    color: #7a7a7a;
    position: relative;
    margin: 0 auto 100px auto;
    box-shadow: 0px 3px 6px rgba(0,0,0,0.16);
}

.newtestimonials_test:before {
    content: '';
    background-image: url(assets/images/quote2.png);
    width: 85px;
    height: 76px;
    position: absolute;
    background-repeat: no-repeat;
    background-size: 85px 76px;
    left: -120px;
    top: -46px;
}

.newtestimonials_in {
    overflow: visible;
    height: auto;
}

.newtestimonials p {
    color: #0E153E;
    font-size: 22px;
    line-height: 33px;
}

.newtestimonials p strong {
    color: #0E153E;
}

.textimonials_nav {
    position: relative;
    bottom: -9px;
    float: left;
    width: 100%;
    z-index: 2;
    color: #d9d9d9;
}

.textimonials_nav #next {
    position: absolute;
    right: 0;
    cursor: pointer;
}

.textimonials_nav #prev {
    position: absolute;
    left: 0;
    cursor: pointer;
}

@media only screen and (max-width: 768px) {

    .newtestimonials_test:before {
        background-image: none;
    }
    
    .newtestimonials {
        padding: 25px 25px 25px 25px;
        background-size: 100%;
        margin: 0 auto 85px auto;
    }
    
    .newtestimonials p {
        font-size: 16px;
        line-height: 1.3;
    }
    
    .textimonials_nav {
        bottom: 0;
    }

}


.ir_video h3 {
    margin: 17px auto 21px;
    color: #17215C;
    font-size: 30px;
    font-family: 'Area Extended';
    font-weight: normal;
    text-align: center;
}

.ir_video {
    margin: 0 auto 50px;
}

.ir_video_video {
    margin: 25px auto 0;
    text-align: center;
}

.super.cli-plugin-button, .super.cli-plugin-button:visited {
    font-size: 18px;
    padding: 11px 30px 12px;
}

#cookie-law-info-bar[data-cli-style="cli-style-v2"] {
    padding: 40px 5%;
    box-shadow: none;
}

#cookie-law-info-bar[data-cli-style="cli-style-v2"] .cli_messagebar_head {
    margin-bottom: 20px;
    font-size: 24px;
}

.cli-style-v2 .cli-bar-message {
    font-size: 18px;
    line-height: 22px;
}

.cli-bar-btn_container {
    margin-top: -38px;
}

.wt-cli-ckyes-brand-logo {
    display: none !important;
}

.new_video_embed {
    margin: 0 auto 80px;
    width: 100%;
}

.new_video_embed img {
    text-align: center;
    margin: 0 auto;
}

/*smart money page css*/
.wrapper-inner {
    background-color: #F0F0F0;
    padding: 70px;
    margin-top: 35px;
}

.section-title {
    font-size: 50px;
    font-weight: 700;
    font-family: 'Area Extended';
}

.section-content {
    font-size: 18px;
    font-family: 'Area Extended';
    color: #0E153E;
}

.articles-wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-left: -7.5px;
    margin-right: -7.5px;
}

.single-item {
    flex: 0 1 33.3333%;
    text-align: center;
    padding: 0 7.5px;
}
.article-content {
    background-color: #ffffff;
    border: 1px solid #F0F0F0;
    padding: 25px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}

.article-content h3 {
    color: #17215C;
    font-size: 30px;
    margin-bottom: 15px;
    min-height: 72px;
}

.single-item {
    margin-top: 30px;
}
.article-thumbnail {
    position: relative;
    z-index: 1;
}

.article-thumbnail:after {
    content: "";
    background-color: #61AA91;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    mix-blend-mode: multiply;
    opacity: 0.7;
    transition: 0.3s;
}

.single-item:hover .article-thumbnail:after {
    opacity: 0;
}

#spend .article-thumbnail:after {
    background-color: #94A3D8;
}

#save .article-thumbnail:after {
    background-color: #A77171;
}

#borrow .article-thumbnail::after {
    background-color: #FCC87A;
}

#protect .article-thumbnail::after {
    background-color: #B8F2FC;
}
.padding-fix {
    padding: 100px 0;
}

@media (max-width: 1200px){
	.wrapper-inner {
        padding: 50px;
    }
    .article-content {
        padding: 20px;
    }
}
@media (max-width: 767px){
        flex: 0 1 50%;
    }
}
@media (max-width: 575px){
	.wrapper-inner {
        padding: 30px;
    }

    .single-item {
        flex: 0 1 100%;
    }

    .article-content h3 {
        min-height: auto;
    }
}

.page-id-16905 .mortgage_contant_bar .button {
  margin: 5px auto 50px;
}

.color-accent, .color-accent-hover:hover, .color-accent-hover:focus, :root .has-accent-color, .has-drop-cap:not(:focus):first-letter, .wp-block-button.is-style-outline, a {
    color: #45B97A;
}

/* ============================================================
   Unified tile styling — ribbon removal + CTA hover lift
   ============================================================ */

/* Remove ribbon chevrons from every variant site-wide */
.money_market_bar .itembox .item::before,
.money_market_bar .itembox .item::after,
.money_market_bar.savingac .itembox .item::before,
.money_market_bar.savingac .itembox .item::after,
.money_market_bar.savingchild .itembox .item::before,
.money_market_bar.savingchild .itembox .item::after,
.money_market_bar.treasury .itembox .item::before,
.money_market_bar.treasury .itembox .item::after,
.money_market_bar.businessloan .itembox .item::before,
.money_market_bar.businessloan .itembox .item::after,
.money_market_bar.investparent .itembox .item::before,
.money_market_bar.investparent .itembox .item::after,
.money_market_bar.twobytow .itembox .item::before,
.money_market_bar.twobytow .itembox .item::after,
.get_started_bar .itembox .item::before,
.get_started_bar .itembox .item::after,
.totally_free_bar .itembox .item::before,
.totally_free_bar .itembox .item::after,
.interest_checking .itembox .item::before,
.interest_checking .itembox .item::after,
.plas-box .plas-block .plaslist::before,
.plas-box .plas-block .plaslist::after,
.personal-checking-account-list .personal-checking-account-item::before,
.personal-checking-account-list .personal-checking-account-item::after,
.personal-checking-account-block::before,
.personal-checking-account-block::after,
.opening-account-type-block .account-type-item::before,
.opening-account-type-block .account-type-item::after,
.checking-account-need-help-section .need-help-location-detail::before,
.checking-account-need-help-section .need-help-location-detail::after,
.checking-account-need-help-section .help-location-detail::before,
.checking-account-need-help-section .help-location-detail::after { content: none !important; display: none !important; border: 0 !important; background: transparent !important; clip-path: none !important; }

/* Belt-and-suspenders: strip any clip-path that would carve a chevron into these tiles */
.money_market_bar .itembox .item,
.money_market_bar .itembox .item > *,
.get_started_bar .itembox .item,
.totally_free_bar .itembox .item,
.interest_checking .itembox .item,
.plas-box .plas-block .plaslist,
.personal-checking-account-list .personal-checking-account-item,
.personal-checking-account-block,
.opening-account-type-block .account-type-item,
.checking-account-need-help-section .need-help-location-detail,
.checking-account-need-help-section .help-location-detail { clip-path: none !important; -webkit-clip-path: none !important; mask-image: none !important; -webkit-mask-image: none !important; }

/* Unify shadows on the common tile variants */
.money_market_bar .itembox .item,
.plas-box .plas-block .plaslist { box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); transition: transform 0.3s ease, box-shadow 0.3s ease; }

/* Subtle rise on hover for any tile that contains a CTA */
.money_market_bar .itembox .item:has(a.learnBtn):hover,
.money_market_bar .itembox .item:has(a.button):hover,
.money_market_bar .itembox .item:has(a.account):hover,
.plas-box .plas-block .plaslist:has(a.learnBtn):hover,
.plas-box .plas-block .plaslist:has(a.button):hover,
.news_sec .news_col:has(a.more):hover,
.news_sec .news_col:has(a.learnBtn):hover,
.other_services_bar .itembox .text:has(a.learnBtn):hover,
.other_services_bar .itembox .text:has(a.button):hover { transform: translateY(-6px); box-shadow: 0 10px 18px rgba(0, 0, 0, 0.18); }

/* Smooth transition for tile types we're lifting */
.plas-box .plas-block .plaslist,
.other_services_bar .itembox .text { transition: transform 0.3s ease, box-shadow 0.3s ease; }

/* Trim the extra bottom spacing originally reserved for the now-removed ribbons */
.money_market_bar.savingac .itembox .item,
.money_market_bar.savingchild .itembox .item,
.money_market_bar.treasury .itembox .item,
.money_market_bar.businessloan .itembox .item,
.get_started_bar .itembox .item,
.totally_free_bar .itembox .item,
.plas-box .plas-block .plaslist { margin-bottom: 40px; }

/* ============================================================
   Hero copy — move overlay title below the image, left-aligned
   ============================================================ */

/* Pattern A: .banner-bar with .subtext overlay (banking-security, privacy, etc.) */
section.banner-bar.notice_banner { overflow: visible; margin-bottom: 90px; }
section.banner-bar.notice_banner .subtext {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    display: block;
    height: auto;
    width: 100%;
    max-width: none;
    padding: 50px 0 0;
    text-align: left;
}
section.banner-bar.notice_banner .subtext .wrapper {
    max-width: 1230px;
    width: 100%;
    margin: 0 auto;
    padding: 0 20px;
    text-align: left;
    position: relative;
}
section.banner-bar.notice_banner .subtext h1 {
    color: #17215C;
    font-family: 'Area Extended';
    font-size: 40px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: normal;
    text-transform: none;
    text-align: left;
    padding: 0 0 20px;
    margin: 0;
}
section.banner-bar.notice_banner .subtext .wrapper::after {
    content: "";
    display: block;
    width: 250px;
    height: 2px;
    background: #31D0FF;
    margin-top: 0;
}

/* Pattern B: .inner-banner-bar with .text > .inner overlay (alerts, bank-merger, careers, team, etc.) */
section.inner-banner-bar:has(.inner h1),
section.inner-banner-bar:has(.inner h2) { overflow: visible; margin-bottom: 110px; }
section.inner-banner-bar:has(.inner h1) .text,
section.inner-banner-bar:has(.inner h2) .text {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    min-height: 0;
    padding: 28px 20px 0;
    text-align: left;
    color: #0E153E;
}
section.inner-banner-bar:has(.inner h1) .text::before,
section.inner-banner-bar:has(.inner h2) .text::before { display: none; }
section.inner-banner-bar:has(.inner h1) .inner,
section.inner-banner-bar:has(.inner h2) .inner { text-align: left; }
section.inner-banner-bar:has(.inner h1) .inner h1,
section.inner-banner-bar:has(.inner h2) .inner h1,
section.inner-banner-bar:has(.inner h1) .inner h2,
section.inner-banner-bar:has(.inner h2) .inner h2,
section.inner-banner-bar:has(.inner h1) .inner .subtitle { color: #0E153E; text-align: left; padding-bottom: 10px; }

/* If inner-banner-bar has only an h1 and no h2, promote h1 to the big headline */
section.inner-banner-bar:has(.inner h1):not(:has(.inner h2)) .inner h1 {
    font-size: 48px;
    font-weight: 800;
    line-height: 60px;
    letter-spacing: 1.44px;

    padding-bottom: 10px;
}

/* Cyan underline below the moved headline, matching .contentintrobar .textbg:before */
section.banner-bar.notice_banner .subtext .wrapper::after,
section.inner-banner-bar:has(.inner h1) .inner::after,
section.inner-banner-bar:has(.inner h2) .inner::after {
    content: "";
    display: block;
    width: 250px;
    height: 2px;
    background: #31D0FF;
    margin-top: 20px;
}

/*update 1-5-26*/
.contentintrobar { padding-top: 40px; }
.busines-contant-bar.personalloan .wrapper2,
.contentintrobar .wrapper { max-width: 1130px; }
.contentintrobar .textbg:before { display: none; }
.contentintrobar .textbg { padding: 0; }
.contentintrobar h1 { font-size: 18px; line-height: 1.1; font-weight: 500; letter-spacing: 0.03em; text-transform: uppercase; }
.proud-bar { text-align: left; padding: 0 0 50px ; }
.proud-bar .wrapper { max-width: 1130px; }
.proud-bar h2 { font-size: 32px; font-weight: 800; letter-spacing: 0.03em; padding-bottom: 65px; }
.proud-bar p { letter-spacing: 0.035em; max-width: 100%; margin: 0 auto; font-size: 20px; line-height: 1.2; font-weight: 600; }

.community-bar .right h3::before { bottom: 0; }
.community-bar .right h3 { margin-bottom: 30px; padding-bottom: 30px !important; }
.community-bar .right { padding: 50px 115px 50px 130px !important; display: flex; flex-wrap: wrap; align-content: center; }

.contentintrobar.reverse h2 { font-size: 32px; padding-bottom: 40px; }
.busines-contant-bar.savingac { padding-top: 0; }
.busines-contant-bar.savingac .subtext h3 { padding-top: 0; font-family: Area Normal; padding-bottom: 20px; font-size: 20px; line-height: 1.3; font-weight: 900; letter-spacing: 0.04em; text-align: left; }
.busines-contant-bar.savingac .subtext p { font-size: 20px; line-height: 1.4; font-weight: 600; letter-spacing: 0.04em; }
.busines-contant-bar.savingac .subtext { text-align: left; }
.busines-contant-bar .buttons { padding-bottom: 80px; text-align: left; }  
.busines-contant-bar.savingac .subtext .button { display: inline-block; vertical-align: top; }
.busines-contant-bar.savingac .subtext p + .buttons .button { margin-top: 0; }
.busines-contant-bar.savingac .wrapper2 { max-width: 1130px; }

.mayalso_bar h2 { font-size: 32px; letter-spacing: 0.03em; font-weight: 800; padding: 0; }

.busines-contant-bar.personalloan .intro { text-align: left; }
.busines-contant-bar.personalloan { padding-top: 0; }
.busines-contant-bar.personalloan .intro h2 { font-size: 20px; font-weight: 600; font-family: Area Normal; }
.busines-contant-bar .contentintrobar .subtext h3 { text-align: left; padding-top: 0; }

.page-id-903 .busines-contant-bar .subtext h3:before { width: 200px; height: 3px; content: ''; display: block; margin: 0 0 70px 0; background: #31D0FF; }  
.busines-contant-bar.personalloan .info ul { padding-left: 0; }

.page-id-903 .birthday-banner-bar { display: none; }

.traditional_bar .wrapper2 { max-width: 1130px; }

.extra-small-main-block-title h3 { color:#17215C; }

.online-account-opening-box { display: none; }

.flex-wrap { display: flex; flex-wrap: wrap; }
.opening-account-types-section.side_by_side {  }
.opening-account-types-section.side_by_side .opening-account-type-block .opening-account-type-list { margin: 0; }
.opening-account-types-section.side_by_side .opening-account-type-list { gap: unset !important; justify-content: space-between; }
.opening-account-types-section.side_by_side .opening-account-type-list .account-type-item { flex: auto; max-width: calc(50% - 20px); margin-bottom: 50px !important; }
.opening-account-types-section.side_by_side .opening-account-type-block .opening-account-type-detail ul { padding: 25px 0 0 0; }
.opening-account-types-section.side_by_side .opening-account-type-block { overflow: visible; }

.page-id-20869 .tapping_section .overlay { display: none; }

.articles-wrap .single-item { padding: 0; margin-left: 7.5px !important; margin-right: 7.5px !important; flex: 0 1 calc(33.3333% - 15px); background: #fff; box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); border: 1px solid #F0F0F0; }
.articles-wrap .single-item .article-content { border: 0; box-shadow: none; }  

.page-id-21054 .careers_what_can,
.page-id-21126 .careers_what_can { background-image: none !important; }

.careers_image_section .row { display: flex; }
.careers_image_section .row .col:first-child { display: none; }
.careers_image_section .row .col:last-child { flex: 0 0 100% !important; max-width: 100% !important; width: 100% !important; }
.careers_image_section .careers_image_content { display: flex; flex-direction: row; flex-wrap: wrap; gap: 22px; justify-content: center; align-items: stretch; }
.careers_image_section .careers_image_content .item { flex: 1 1 0; min-width: 0; background: #f5f5f5; padding: 40px 34px 44px; text-align: center; }
.careers_image_section .careers_image_content .item .heading_wrapper, .careers_image_section .careers_image_content .item .heading_wrapper h3 { text-align: center; }
.careers_image_section .careers_image_content .item .heading_wrapper h3 { color: #17215c; font-size: 24px; letter-spacing: 0.72px; margin: 22px 0 14px; }
.careers_image_section .careers_image_content .item .desc_wrapper p { color: #17215c; font-size: 20px; letter-spacing: 0.8px; line-height: 1.35; }
.careers_image_section .careers_image_content .item::before { content: ""; display: block; width: 120px; height: 120px; margin: 0 auto 20px; background-position: center; background-repeat: no-repeat; background-size: contain; }
.careers_image_section .careers_image_content .item:nth-child(1)::before { background-image: url(assets/images/careers-team.svg); }
.careers_image_section .careers_image_content .item:nth-child(2)::before { background-image: url(assets/images/careers-community.svg); }
.careers_image_section .careers_image_content .item:nth-child(3)::before { background-image: url(assets/images/careers-growth.svg); }
.careers_cards_cta { text-align: center; margin-top: 44px; }
.careers_cards_cta a, .careers_view_openings { display: inline-block; border: 2px solid #31d0ff; border-radius: 3px; color: #17215c; font-size: 15px; letter-spacing: 0.6px; padding: 13px 34px; text-decoration: none; background: transparent; font-weight: 800; }
.careers_perks_section .row { background: #0e153e; padding: 64px 56px; margin: 40px 0; display: flex; flex-wrap: wrap; align-items: flex-start; }
.careers_perks_section .row .col { box-sizing: border-box; text-align: center; float: none; }
.careers_perks_section .row .col:first-child { flex: 0 0 100% !important; max-width: 100% !important; padding: 0 0 40px; border-bottom: 1px solid #45B97A; margin-bottom: 40px; }
.careers_perks_section .row .col:not(:first-child) { flex: 1 1 0; padding: 0 36px; }
.careers_perks_section .row .col:nth-child(3), .careers_perks_section .row .col:nth-child(4) { border-left: 1px solid #45B97A; }
.careers_perks_section .row .title_wrapper h3 { color: #5cc5f1; font-size: 24px; letter-spacing: 0.72px; }
.careers_perks_section .row .desc_wrapper p { color: #fff; font-size: 20px; letter-spacing: 0.8px; line-height: 1.35; }
.careers_perks_section .row .icon_wrapper { margin-bottom: 20px; }
.careers_perks_section .row .icon_wrapper svg { height: 76px; width: auto; }
.careers_perks_section .row .icon_wrapper svg path, .careers_perks_section .row .icon_wrapper svg circle, .careers_perks_section .row .icon_wrapper svg rect, .careers_perks_section .row .icon_wrapper svg line, .careers_perks_section .row .icon_wrapper svg polyline, .careers_perks_section .row .icon_wrapper svg polygon { fill: #fff !important; stroke: #fff !important; }
@media (max-width: 767px) { .careers_image_section .careers_image_content { flex-direction: column; } .careers_perks_section .row { padding: 40px 24px; } .careers_perks_section .row .col:not(:first-child) { flex: 0 0 100%; padding: 28px 0; border-left: 0; } .careers_perks_section .row .col:nth-child(3), .careers_perks_section .row .col:nth-child(4) { border-left: 0; border-top: 1px solid #45B97A; } }

.template-careers .inner-banner-bar .text { display: none; }
.template-careers .inner-banner-bar.no-border { min-height: 420px; }
.careers_video_section .heading_wrapper h2 { font-size: 32px; letter-spacing: 0.96px; color: #17215c; }
.careers_video_section .careers-eyebrow { font-size: 18px; font-weight: 500; letter-spacing: 0.54px; margin: 0 0 12px; color: #17215c; text-transform: uppercase; }
.careers_what_can { background: #fff !important; }
.explore_opportunities_section { background: #fff !important; }
.explore_opportunities_section .explore_inner { display: flex; align-items: stretch; }
.explore_opportunities_section .explore_image { flex: 0 0 40%; max-width: 40%; }
.explore_opportunities_section .explore_image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.explore_opportunities_section .explore_opportunities_content { flex: 0 1 705px; max-width: 705px; padding: 64px 0 64px 100px; }
.explore_opportunities_section .heading_wrapper h2 { color: #17215c; font-size: 32px; letter-spacing: 0.96px; margin: 0 0 18px; }
.explore_opportunities_section .desc_wrapper p { color: #17215c; font-size: 20px; letter-spacing: 0.8px; line-height: 1.4; margin: 0 0 28px; }
.explore_opportunities_section .btn_wrapper a { display: inline-block; border: 2px solid #31d0ff; border-radius: 3px; color: #17215c; font-size: 15px; letter-spacing: 0.6px; font-weight: 800; padding: 13px 30px; text-decoration: none; background: transparent; }
@media (max-width: 767px) { .explore_opportunities_section .explore_inner { flex-direction: column; } .explore_opportunities_section .explore_image { flex-basis: auto; max-width: 100%; } .explore_opportunities_section .explore_opportunities_content { flex-basis: auto; max-width: 100%; padding: 32px 24px; } }

.careers_video_section .heading_wrapper h2 { font-size: 32px !important; letter-spacing: 0.96px !important; color: #17215c !important; }
.careers_video_section .desc_wrapper p { font-size: 20px !important; letter-spacing: 0.8px !important; color: #17215c !important; }
.careers_what_can .heading_wrapper h2 { font-size: 24px !important; letter-spacing: 0.72px !important; color: #17215c !important; }
.careers_what_can .desc_wrapper p { font-size: 20px !important; letter-spacing: 0.8px !important; color: #17215c !important; }
.careers_perks_section .heading_wrapper h2 { font-size: 32px !important; color: #17215c !important; }
.careers_perks_section .desc_wrapper p { font-size: 20px !important; letter-spacing: 0.8px !important; }
.explore_opportunities_section .heading_wrapper h2 { font-size: 32px !important; letter-spacing: 0.96px !important; color: #17215c !important; }
.explore_opportunities_section .desc_wrapper p { font-size: 20px !important; letter-spacing: 0.8px !important; color: #17215c !important; }
.careers_video_section .video_wrapper { max-width: 924px !important; margin-left: auto !important; margin-right: auto !important; aspect-ratio: 16 / 9 !important; position: relative !important; }
.careers_video_section .video_wrapper img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
.careers_video_section .video_wrapper iframe { width: 100% !important; height: 100% !important; border: 0; display: block; }
.careers_video_section .video_wrapper .overlay { position: absolute !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; display: block !important; }
.careers_video_section .video_thumb { position: static !important; transform: none !important; background: none !important; padding: 0 !important; margin: 0 !important; }
.careers_video_section .video_thumb svg { position: absolute !important; top: 50% !important; left: 50% !important; transform: translate(-50%, -50%) !important; width: 84px !important; height: 84px !important; }
.careers_video_section .video_thumb .title_text { display: none !important; }
.careers_perks_section { background: #f5f5f5 !important; padding-top: 50px !important; padding-bottom: 0 !important; }
.careers_perks_section > .wrapper2 { max-width: 1110px; }
.careers_perks_section > .wrapper2 > .heading_wrapper h2 { text-align: center; }
.careers_perks_section > .wrapper2 > .desc_wrapper { text-align: center; padding-bottom: 46px; }
.careers_perks_section > .wrapper2 > .desc_wrapper p { max-width: 780px; margin: 0 auto; }
.careers_perks_section .row { width: 100vw !important; max-width: 100vw !important; margin: 0 0 0 calc(50% - 50vw) !important; background: #0e153e !important; box-sizing: border-box !important; padding: 60px max(40px, calc((100vw - 1110px)/2)) 0 !important; display: flex !important; flex-wrap: wrap !important; align-items: flex-start !important; }
.careers_perks_section .careers_customer_support { width: 100vw !important; margin: 0 0 0 calc(50% - 50vw) !important; background: #0e153e !important; box-sizing: border-box !important; padding: 40px max(40px, calc((100vw - 1110px)/2)) 64px !important; }
.careers_perks_section .careers_customer_support p { color: #fff !important; text-align: center !important; max-width: 900px; margin: 0 auto; font-size: 20px; letter-spacing: 0.8px; }
.careers_perks_section .row .col:first-child { flex: 0 0 100% !important; max-width: 100% !important; text-align: center !important; padding: 0 0 40px !important; margin: 0 !important; border-bottom: 1px solid #45B97A !important; border-left: 0 !important; }
.careers_perks_section .row .col:not(:first-child) { flex: 1 1 0 !important; max-width: none !important; padding: 40px 36px 40px !important; margin: 0 !important; text-align: center !important; }
.careers_perks_section .row .col:nth-child(3), .careers_perks_section .row .col:nth-child(4) { border-left: 1px solid #45B97A !important; }
.careers_perks_section .row .title_wrapper h3 { color: #5cc5f1 !important; text-align: center !important; }
.careers_perks_section .row .desc_wrapper p { color: #fff !important; text-align: center !important; }
.careers_perks_section .row .icon_wrapper { text-align: center !important; }
.careers_perks_section .row .icon_wrapper svg { display: none !important; }
.careers_perks_section .row .icon_wrapper { height: 84px; background-repeat: no-repeat; background-position: center; background-size: contain; }
.careers_perks_section .row .col:first-child .icon_wrapper { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHYAAAB2CAYAAAAdp2cRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAOdEVYdFNvZnR3YXJlAEZpZ21hnrGWYwAACB1JREFUeAHtnf912zgMx+F793+zQd0Jkk4Qd4LkJkhuguYmsDpB2wmiTlB3gqgTNJ0gygROJ8AREdVAMGX9pE2y+LzHF5miaMVfgaIIkFrAHhDxxPy5MOnMJNpegnJMnkwqTSpM+r5YLJ7aCi5cmUbQpfmzNukSKkGVMMlNyozAj3LHjrBG1PdUGFTQWCihEvcLz2wIa0QlK83EgYVNj7YS5XiQsZ1C1ZKeiX0fjLjZzhFkqdjkwaQVKEFitLkwqRSaXclCS5O2rMC97TgpAUMamfSD6bZt6GY+3ApLVVEjwYrLLTerdyyFOa9AiQqj2fmO1dq2uuYHKFFitLtjOl78ZfJWbP8GlFi5Z9vvSNhly04lLn6y7VckLO8o/QIlCf4CJUlU2ERRYRNFhU2Uv8ED5jnqNVS97dLlUuo4ljpzr+zxP/f5HJV2ZhOWRj+g8gzVTvk6n4QpTNpI1xIrQ+VpAJu8Fiuxr7THZ0MvkrGY7yQPyplj15M5h2+O8vS/L2Ee6Pf6PvmCFiMWKxiIHav8iv14sNbMj7/ApgNiHxl4BncdIpL3jvJzcwcDMcdcs+NvJ91jsYq0oEGNS7GrtPnyqnsuj9a9hJX/l0a7ThzHF47j13TS4J99TpA3A8oejalNMYnCLTA36bNpRn6PYOFLmM21zaIfIjf5dDHwC6I06ZNJX3gzhFUrkrPvoSvz0elUngFTL3lKrkHcEtg5fhbl7/eUHwP9759gKjiyKSarE83HVUd5arLKlqaHhD7pOH4tjjkH5TeyKZ4i7K4PsPsYl7i9r05xroPvQykzi7DY9P89wADksTjAqY8uv6PyDM7UeVqx7W8wAHNP+g7VY1Fh0s2Qbr09tr5/k6ivQXEyVtgl2x7snDcCUUTdO9czYQ+4a/EMFCcxDilq89uDscLy5vMtHBYu7EFGomJkrLAF2z6FA4HVM/GKZWnERwtjhaVOTG21KxTDbB5Zs+2NLweBeFJA0Ys/HVB+DNtZfk8c/xy7Fid0BR5xfJ+XjhPVi/u5FeXPcX4Gd0hxxrFiGlrj9zgaPfIiLu7OKWoMW86JrbetbmohpIeKgsjmvtePeVpoghO8O+geSZpVXNy11ByUHXCuIUVWoTdxVdT+zC6srXR2cVXUYXgR1lY8m7gq6nC8CWsrnyyuijoOr8LaLxgtroo6Hu/C2i8ZLK6KOo2DCGu/qLe4Kup0pLBe4ooJGzu0gmpcufab5iYPeBgq7g4+UMzTNRwRrMJuVo5dpSuEdk/5MdAgyGZyqK0vi2X1t1puiJaK3eGk2cDyYzhu+GkfyHKhuprl8ONXCMxSLV2OBRSfkww/7UVLs8xDT0MRlc71CavQ2LaZAG3hp0uYjxymgp6bYvFdrmY5B2UyB2+KOY5mORhLTY2DNMUcKy5Z7pkv15tyxGA2FdUvOvE5UVTYRPmjhbW9dFr1NbkZBX+6xRZQTVksIDH+WGGxGtasLZUsN6lpmdEIa37405mbzQ/i8z+QEFEIi9UMAArJpGYzh4kIa625woSmZcZiseTaq4VY4fQoSG6t9aB/vXJNEgQvrLXWa5GdjbUuYa0lND1Ml5AIMVjsR0fe0qQbGAe31gyakf3UGhxskplPghbWWhe3Ir5exfuhViutlaIh7MSughVLoxN1SLfdUISL79bm3cm8kfVdsfxzlr+FCMFDBbNNBZvLDT3Ujzm4O7ut1/OnrM+xfzu0zpCIQljcdcjLZe74OfeKD8IWa2X710PrDIlYhP3YYV0ygOy8o76rffXZMuesTHRLDeExIyj6gNXjDe/xZrKMddbz/LxDCN4Tdq7AapcaKuzH6J9pR0VQ2B+fmkcfVzVfrOS+bSlcqCZe38DLe21pO5OFcPe5dV+HawMv8cGXINZNFPVegJ/n3ue1FI8SVyyaSp+87jgP/qJFZ/OJA5YGxGqJ3s5OFPqJJeYcLa7Yy6IegrzrqrWhoHUZEnXN9+Mwa4UBz7Rr8EsJExnVFNPKauZHo7UXfHYwNj3LkXiF3b4x57Wx90uicW/t2bzRIMglq7sxwmUvlmuW9S/MT9//vR0MeICiL+h4/MGW5+Ce9bU2x+gYNAkBDL1XPBJuNSusOjZjrLWGD11m9QZWz9NtDoSwSMFiCWwOMGzHWqut6wSb0Oe9gybHJlWLJagjxX2rNUOt1dWJovss9wmXcg5PaCQjrBUjE9kldPSE98A7MLLDlEHgJBXMZq2oYFmDrZUfCy8twJLl53sGTYIhxShFajbvoRJ4dK/VtgC5Y1cGEZCcsEYQem3aW7uC+dQ1DuXz5OfFgd7WNRWd4rEH8Q6CEtxhOkFy8GmUEULDitR5ymOxVkKF7cC6CD9AZGhTnCgqbKKosImiwiaK7DzdmQFkUOJHLTZNTlTYNHmSTTENwxWgRAdWy/79HhtXi00UFTZRVNhEUWETRYVNFBU2UVTYRFFhE0UK+wqUJCBhS/b5LSixwucY/ZJTA7aY4BKvqeOYfnKxwGqyMEXi8clGn6D9ddZKOJB2Z/Ays5+g6SdvFrSF1WpkBQT6ciClNxTkTi/ReHzuPFGQNey+zUqJi9KkVR0iu5B78WWZuxist26KCLpa57h9+KjTJyVUS/4WdlpK/Mg5oTAD2FzvKbqFvGp0gCJRVNhEUWETRYVNFBU2UVTYRFFhE0WFTRQVNlFU2ERRYRMlqDUorPtwiPOBv/yI1juc4+0bZxPrLENYhGQBgWB+QFpq5wbihzwsb47taQmpKV5CGnC339EIqSn+z/6NPYpjE8JU1P8BZs6eQ4BhfqgAAAAASUVORK5CYII=); }
.careers_perks_section .row .col:nth-child(2) .icon_wrapper { height: 76px; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHQAAAB0CAYAAABUmhYnAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAOdEVYdFNvZnR3YXJlAEZpZ21hnrGWYwAACJlJREFUeAHtnf112zYQwM99/b/OBGUmiDNB2AmSTmB1giQTSJnAzgRmJrAzgdQJ7E4gdoI4E1xxxdGCIFAEQIKf93sPT9QHSYhH3B0OBxBAEARBEARBEARBWAKI+EaVa1V+B2HasCB/oGYvQp0wSnhrPIWE+w6EaaGEdoPn2YAwfpSgLlXZWsKj91eqlCLUCaEElDmEdmt9/2h9f083AQjjguwiHpyf2hbILdhWx3sUZ2k8KGF8tAREgr1u2GftEOobEIaljWBqboSPIPQPq87CEshTqOpEHXQQZ2lIUDs3T5YQSLhRzg26nakbENKTqkWhu7vziOIspQOPw3gVndo8dNtkEWrXOC40CTaHBNScS8KFXYED9BvV8d+jR79WCADrw3i9RHbQ7SxtQAgHG8J4PddDwoVtQM8wXo/1kXBhLBgRxusLlHBhGFO4YNgiXHgBC4HtEdlHuyUWqpS8XV5cXHyDAeD6Ud0qu3mlygfrZ19U/TYgeGUXVAwSOMdTT7uO9+eO8wsINkN5lhl0wK+wHL6o8gTuC5dzGQtfVfnh+JxMwvdzOy5GoOpCPKsXp31UaoxechgPN6q+/0IEonJnhgh0ZohAZ4YIdGZ4OUXc6aX+TwbTo1RlF+tkTI1GgXJHu/cRiK5R/2MRUZazKlddhAxmIExmjQvICGhqobmxXYKOe06NP1Wpgu8UH/0bZkxIYKFQKusLTAwOGlQCnf2AsXi5M0MEOjNEoDNDBDozkgsUdfLTe4yfE0L7X2PaZKlnmAl9DJ/RGCQJY6fKHxAOTehZqfKshPqah8G6hobVqEtDN10BEyapQDkwUbWsDOK44le62L9BgtbEN8lfMAOmYEMl2TgAcYpmRohAX4Ewes7m5SobuFIvd7BsyL6SY3fblKDVBkr4hoOfkaXKKXpQZRHjiGcgG56r8jCF0ZqzAmXvLwfd5RAAPsGSQT1N7mUOCUwQDopUbCERqOfYVEQHUcTLbWZSUSQR6Hgoje2fEMmSpkKMHYpUrVV5ahPeFIFGwAMNZOcoLJmBO6xZgu7u0HyUfxoOSQ4o/b51+FEEGkbGjlEVyPdC7UMtbqfKw1DzTzuhCy+XvUzyAKOWUeM6bLkEe488dNcle1XuMNFwYNIZ3KhHWypBkup5DYFwi8j5bXAERe1PdmnDbz+p/b967peBjpLlNT8pQbc6erXrRKNC1IKpJb+Fw4iTTUF1m0wSeEctdG8cI6aFrY391xH7mGxRr38QNAKEeuly2q+sabGjWLCjkakJFA/q2eYOO1oijo5Tc47xr8w5JYGiewXOLaZb6+/acb7WK3N25uWie0KTqZou0VPlWZjH+KyO8QPCyJt+gHpZm511Lm97GwN5u+q8lMVP12TFH5PN3dFNNKhdxe49wVSsHXUnLWKuKJZsBc4z129t1XOPQy0Lh8dqdexcO+puqr09DrQUG542iqiBgC5UrrkKVwnjzZp7dnTqd3DoUpSqDKbqWAXTZsEfkfNEi2d8hj5RJ10Zd9VkshvwVM21Wh4Odbdkiw0LQ0XUq99B9SkKFE/NxAZagDoZ/EVtQ0vwuFuzxwB7utThM9M5KjuY2d21A0NB+mrEJYOATInFBedRh/RWxkc5BMIthsJ7GX+UWd871aS6cbwmG9PIC2uNavY8qfPbRLMGjpmaykUd9YmqL+rgwxbjCVLHeOyB97OoZBcCxcOEptSL9tu20/t82F1fO2TYzVw316sbMxaV23ZCky+mKvRe6ga1mi6sj0s4Thvx4SFQbVI3awOcSqrq8a5JbQ8uUOxmQpMvK2O7AH9MzVNCT/1VEr66PpQbveKP6GY/K9Clebm5sb3z2YFVZG4eo+fggynAxj7pYgSKx57nU4BQTJtXDhBJejC2r5p+vKQWamZLlDAR2OaW/PYSUzmO7IHt8fTZJ0ND9blx1Hdt/CZoGA+P/2Or0F4MeNxVOnv+KKcI9ajFWJeMIxX5CXVH3FSPmbFdQhj0Xze8XaDu9O/AL6v+ZwcBgdLYPtvtifVyx76iWNerb9JAN4XjSN1VjwvxRt0AJWhbeJvaBscK1NTjr3oJSQ0Idx9yOB5uCyEDHY/9gImzEVr3Q+cuzArObM/Y3KzAv898CQc1mYFOMXk7qutmeiAwEfA4httr2iSePjV4E7j/va9TtKRuS2lsv4Ue4UwJ0+6GDlqbjtDZmWlLEqhpt4bIGzLTXzIIwwwoPJ374ZIEujO2c+if2KXxzIlRz022dxCBoh5XfGS7FvxH8fCYZe/EZHZqqotB+/f9iEnT9pXgj1nPHaSgrVNkGfkcAsHjdQ+8x2Atx2gDEdANFFHsJyN6O2V4HCVK48x1INBtS4FGDapbN0Jo9oCdwxuLd74tRgzIL234jIaiXpKvMCxFMof2ztQO9EMNfDFjzl7Rr0UliXHEx4zL0qtvhgSF7iivp87mZ8Z2aX1H74uQ2duoB/7NuhU++0VN+LVU7QbCqeKiRAHhwXLzccbkxj/U/K5U5bvpGaJ2wkjdVoLJfbPx6sAOJjY7jkmmZNXlMc+dbIvT4d5R/7Xx/R5bTgzCjhfYwlPbmTayhd05CH2wddSfui1mKK7VZFvreI/QAj6WeW3vQ/aPUrl84gx032qYaW/+FC5nAnVM1FTVreaD8vGu6s4XcBwSYGVOyFRcTWYNhqHBFv3DRPVZj6k+k4PV2+MYLqJDmBsQwkG3P7CBnuCbqrDOX4AQT41Q7zD91Ix3jvMWILSHhWqr330KFcyt0rbfvWqGxYDuRaf+Fyy2769e8vHt1Fd638/ssiVSowpNVXztq45Rj7ZU0/VdbLFD1R7dD10CrG4pZbXugldPjCgd31VLr9a16h0dW/UxdyD0C7fIR+yGLSZcB0laaACo00FoyI0iOb5r5lZr5VL5ljp9UwTaAjzk+2SOr0kVP3PqiyAIgiAIgiAIgqD5D7iVDKG8eat1AAAAAElFTkSuQmCC); }
.careers_perks_section .row .col:nth-child(3) .icon_wrapper { height: 76px; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIcAAABcCAYAAABEHqbmAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAOdEVYdFNvZnR3YXJlAEZpZ21hnrGWYwAACnRJREFUeAHtXf912zYQPufl/6oTWJnA7gRSJ0g6gdUJnE4gegI7E0iZIO4EVCawMwGZCexO8BVnghEIgiRAgiQo8XsPT6QIHPHjcADuDiDRjGABYCnCM9ohEeGSZpwmROOm6IaYOuCCZgQJ0bDX4udJ+WtvmXQhwiflfnlxcfGTWuC9bUSR2Svxwxleyr+eObR9cV80Twi/KdcHUSd/kyWkxFjL2w8i+K9POebdi/CC+rHtxnZ8c6FJZwxR/lXb4YHjK2nX5BuyAV2Q1DWoeLbwTfOUEQJzvDcQ5jHrIMKV9iiV//Mvx7mWYSGfL0XYy8z8I8Tgq0KTaf0rwmVLmh8EvYhmjAuUl05xHfchG1JSQ4+/VJ6/eKAZ0YlASoUYYSCBTd2KSFstYXOi6rT80lvtP2aSj5b0eBj6pqVf0cTB5UeY2NVleqlFjsgRKDODigQtlDIoMkhCEwe66y76xKoq0+pk8YlaAtmQoCNBS20dMgmiDktWkidEyLLkeEEAGkwUO99tVaQnXw2AogRJulYCikNWJ63fmEBROgchBbW63ZoiqBwN8gApQXbIVipdaamV+kITxVSZY6VEaD2k9AkpgXJM0qCE8rxu9Ak2inOgAnO8M8R/pTCRKtcf6DQQ0YhApmCs7GjvaMaYWI8sPe7qHubMoRpmljRjSEQ0ApqkBiNnDnUoWVKYWCjXk52UGjCW9LhrivDGHNIOkuZ/hjBRMuBauT41k35EA8JGajDUOcdBuf6TAoLGrM+qUW/CUMswtPRQpUZaFUlljr1yHZqZXPVseqbTADPHXrmPaABoUiOlzFpuhMocP+jIzcvAhpa/lOtHOh2oPXgo6aG+8yvVzN9++XOwqBaZ24vLz/KviAIYXmSF/eJ0kc9/6UQgysIKqAMdXfoiqqlz2evXVA3u3A9VbpaGuQZbYjdkg0A1eLGSnx1NGCb1uaadZkQVabewQ1KRfoWiAfPBQHfbVICdEnlUIxfKFTfpfRiosK2g7D6ZILNNrZTgYuq/UdKx/0hsoL+Q794q/zcyBxdA5bBbGglahUxaajBQY3iDm3/tZxE2WrBlngRKJ4MLcxgSjOJ3EEIefAMNVllZZptGvjSkjS3Sse/GwvBOI3NU7Vv5IgLvk+BMMLFHkfDPofQLXIlUXNp9OYe9LKKMd6LsvILguR4v39WGvNbu68DL/bytXuX9d0H/QD4gMnmF4vAyiFiXvSut62FTBTr4c6DoshAbgtpWawe62yrJ0ZRQ9wmNqEcgczpSvd8TnNBm4I7MEcMe1nXWmjkMiXtlEEF7r71rsv6iJnRkDpbkNvORyJHutoo5GvfKynFwSUdlCRMjn5uMkE2SeN2tqu3v+lZ4yffm+3VVw15Kx3E6CDuOyMcPZJurr2uisZIwpaGBov6DUZr5tqTLvem5C/e3eOcKzft1c+zgSRmIKfqQOhAyKWtazwlgFpUR9QS026+rMklXL/rTZQ4DsdYNWkGnN4UbyqugHLwlgxmGJ98b+XuP4laNXw2KDt70CHPfys5r/cO8/9Wq4pCJdH0YYVpr6gkVjBE3vVOm2xny2oVBTEwXCtbkA6juiTuYNXgrmJdjMXrsQYZ8cuM6+augbNto3esR7l7ZB/INZMODaWIXI6uIFcxMwWl6t9ug2PNb93qUmay1URJmY9hYSNB1rtFQWJP4rQPH7X28RdkF4cYQZ4WyhvG+gt6VRm90l4bJwIJJYvQ4tzDkR83LzvB8X5PXywqaW7U8NMMNCpPw5CuRFdpZJ+KYh0VdY6N+SRs30FWlTOe9wDMGBooTvyft2Y3GDA8uzAvfy79A8aY+l9zfZ89OqV/8Z1Bzq2rm79qzjXK9F2k/kxueK95zUngvGIMLOnnRiPqTI/STA5bKdUTuUJljg+7zqFfqfwO7yzveHJVZcpzjmMlrepYWX+uciOSQkceLaugt6fSwuUCxyx2oHyypOxZ0HPr0XqA+M2EjGvcrOQLZQTFvdEX6C+V/XsIe6MShm+wjUQffKUAgW4pu5O1j03HPyBQ7kbz9g7INPC7vY6mRM1yqPVbnGY8i/EP14Lyv5TVLrS/a8ybm9gHbdxyX/Chq6oJct6OszFpbpPnYplxyqbrV3nerxdlVPbPIywsGXtbbQlvFJSatX0QBQTaWs9oaZX3EqibuvdJwOvQtBDqj2hgb9TIM4o/rApTNA1H+YIsAGQRln1IngxcspSKqEaOsPNuignEa8vIxxDpmGJg3gSrdUFZ77zCi+IPZEchJ4YTyjrmbinhbA1OY7DCNtpqG/Oha2XsaGTBb16/0SKbjpBPXCvCQ2XzM10V8RC2gNUitVRaZr2zlM3jYMoFyJ0wwktMPMmn2Ys3wMNscmGl6t0DCfCC+s/+FRlMXmT78ORJ0c4801XGEgZgEmVSODXlorpeKRoIkeOOzEEwL9T4hnd8F85nsOzRMJtGDJ5hCe2vIU4Ie3RlQ7VuTOJUJdub3W/lCF6MV92QWZ1V+mnkDeDFoodpjLUfuQ7pFxvg38j6uiO9tmJV5e6qp3xt0d2peybIlFe+pNDo2fgAQ2TjMCqVNQ9RUBpMOn1++lKGOkd50+pTtjfVia0BReZZSptncUHukIvzhcz+LZDg+ceey5p3PSngls5Z4ScWPGtXtrz1QtjfoQF0hufwG/t3bXtCTExDKpvm1UpYd7PatxCJ8goWnmIf88nu+oT9wGVgqrqkv4MgoO7h7U+fM8JZJ9LRchqXiSeZBbXhunC2yhloo8fR5S28GS6V+v8GOgeuQIGsn57r29l1ZZFv1FlStw38Th0Nt10PRtpKKsK45K4uXpUt5u6yJx4q0tbzlz3kOcmaarNslHbdumuo5H2ZSGX7KPKY04wg4Kqtg+UUGBHTq0YyWQHE4+WYR34o5ZNytEjeIXWszLIHy3KCx8VyYQ8Z3NgTOGBkGsR9ZpnNljpXGgL1rj2d0BIpKOxeLqRNzyDSqCpzTB+mjMYOMOg0X034b5tD9RUa3sM4wAGUVuZMzTRvmkOk+zsNL4DCIeKcVRFvmkGljJW2QH088W6CjA46k0YU5Zt1HqIAH38wuzCHTq8vnWfcRAuBJIdWVOSQN1cY06z7GhGE4iaglPDHHSsvPSZ2hOimgaNpu5c+p0OrMHJKO7q866z6GBjroNCro+WIO3U1g1n0MCZR1Gg/UETguRztJIElrpTHurPsYCtBU5D5Et+zxn+BpGEBR99GZ4WZYAJablMYGWhoAZ3QAJvRZL8y6j+EAbY/qFCobEzjBYPJAWacxCRU1yicYzKp135jyBA8T1n148z7vCmRLvg2Vj4jKN+nkyDf1TAV6/lMqnxTE5XlsczRVnwiCOVDcRnDO2DcdZzUkRmcOuRzd04wcdz4/kdYFITAHO8jkYvcHZRJkSsOGD/CQGslrLvuHUL4tNxpwYt+q7wJt0h3RuQMNXzU4J6BoTHyhc4ZBd3HWGkSUvdnP1x9Ekxqz9pBKWuDzrRMU7SSz1xQZpceo59I3fpG6R6jDCJvLP9EMxn90PFrhdxoRoy1lUTzrYkYZKXk+XsoV72g8sCbwJ80wgRkiGlvX8T/D6RGuK4tamQAAAABJRU5ErkJggg==); }
.careers_perks_section .row .col:nth-child(4) .icon_wrapper { height: 76px; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGsAAAB0CAYAAACCP8xCAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAOdEVYdFNvZnR3YXJlAEZpZ21hnrGWYwAAB0NJREFUeAHtnYtxpDgQhnuvLgBnsM5gncGQgZ0BdRFsCJ4MzhkQwuxFwF4E9kWAL4LZDP5DRnPWCPQAJNFi9FVRfgyIpn8htZ5DtDMAtBhoaWd8oZ0hVLr8/qWHdsRvVMiGIlZGFLEyooiVEUWsjChiZURysfrI+rtsCz1ShvR21/1xytX+WeCTc398o8D0ab7L9DsKTJ/mvWo/7R2lh+HDof1xRwGRDhVv71cKjJIRomQGdkhnnpWH/pMyQNiplQrBMwNLZM5XYV3+y3pK5TvdEv0DNznkVFkSqMVfQ7eGqKs0J7DsJe/tetPq2Nso/nT6Bz9oxUvw6HANuI7+cLNCXVDqL65v1qu070iFQqFQKBRuExFR9sfzzUduOaC03V5pZ5TZTRlRBh8zooiVEUWsjChiZcTvNBPZ2SpGd//p6+9fVJgFhpFx0az41fvvX4rFRC90i2EE9ZFLu0Y1jhggh4IepZ9eNf8dKBbypjY2H6LnJBaupwJMEXeEHEPvwKvFgKATYBbYx0Is+UaZEP57plRIYyqZe1ppxAttDBexpC3CN2d8VhdPazJz6cHIiBK6Z0QRKyNmt7NS0Jdk9/0PMTdvVbCCZdPGRNvxJWobaE/AHm2m4EQM4VoMbt0zwrJnhmW0hKEYrGgZatH3By3jB8eutBK6Z0SJBjOiiJURRayMKGJlRBErI4pYGbHF1gpiaKUGs7VYvmBYU8ZmZDw48gGnhrVjrKj/HwoMxtMaXuVzxRuej43y9jS4XpmvU1FgIov1YHkW8Zwn+dy83zr59jzjep8L00OJc2qKQEyxZPq1xzMK+Lx18H97BJ00XEwDiDpHI7ZYyn3E8z/J5393PH+Qt25W35nMJZVy2PjZHz/646++i+6dEqGKlLJvsL/tQ/9D+OeJ/HzzcfQm/k0RjDl55J7Vk0IC2Ln5kp+Zb13YsTMMdZFJoBeZq1iAIWLbNMPoYAhMni2CHSkEGO9VMUWDstJwEgxv2TPc9fq6QATjrXBaDJXkexHNjvTdZd6gzhnjyLlb5TtYtsLxEC3fhuIKMJRErcEvIpyvlXNHLwMtAeMy9pvhvCeLcS0itae44RBJ/L+yXKcyb70Axlu2HT2uEW2oxmBst1fRloqkpbFsSz+MN2+cNfdOXt/sWTQMQYNwsK0aqGamqTaN3Fv6YbytXIeFlZ4i2rtBtCMyC0Zgj+wuQcNSf+m+F/Xbne0CfT3Ramfic8/abCNIT5FWt+swbLji3pIW43Iz+NaiyCzsh1/4HXpDZrsOGI/TRF1nBeZhP2aE35Hur2+e/O3ygR7rd0jUVYMhgmwNTmmROBhBgMgukB13uB6o7T40AYONhTH0nTUGJ3UJcvKBg0iaTXpUfqLUjvEwsEEC0RAh/A6JzEBXthHMofVm9QYihv2IGH6HAOa3vHPl5paBaEHCfiQKv5diEWlsG2fRpH31EtGwQfg9h1kiTVzsEm3TthA8w35sHH57PMdhsUgTidlEaxiIVjnEmEKcX9GGODJRg5VjWtxFs4X9tyHSxM06izPC3myZffcG2yraEIdIH1BoNLFO3ESDeULKJpt/wV33JxPrKxgVj3Dv1pYskvUQqZLnpRPL07gGkUXDuG9zinMiOxo4RFLOTy+Wp7ENIjkL40k9KqqILUUAQ2O7gadIynXbiaWc94BEUQ8mJvVofx+0v4PVX7D3iLRwBDbqyRQaX7GU86uYok0IcZT/v3ICxoN5q+qvtSIp6VzZGZS5YinXBRcNlvl2U05AgMmUoUSy2RkMLBRLub6CORA4Yl4GaE3On3ICVny/ZGiRbHYGAyvFUtKpsWLoA+N6qtI+n3QCDMWm5T5RRHLZGQQEEktJr54rGsYBxHHiHKMTMBb6MHFOVJF87AyReBdSLCXd2iHanTxPr6feDOlZnQDD18WnEsnXzrWJdzHEUtKvLaKJz07a/0zjVy6x7jVBWotIHXJc+4zIYin3qeHukXi0XO90AtxrzjrEn6TjtHNN4l0KsZT71QbRjo7rvJyA6W8z6JBoUNLXzqWJdynFUu5bK6K9eZzv7QR81l9npJ+juD+xlPuLbiznUPdcJ/imG5pdi+VLVCcEZImdZVe0jChiZcRSsX4Ct7FWODSQczIoJjBM6eUmGtc6C7Zp0RFuJlr+Dey9DJsHHtzEgn0XtTaqz6RozxbRXrChaBzEwmc/45SPLntcpfURGC473VIsMF/8cDGy5iLaFmJlIZKOh2jRNzFOKRaYr1DxAu61wgeKRAqxMER2J8vz5deswQZrhWOKBYZrj4ODtGuFg4t1EyLppBAtpFhwt5Eq2jtwt9WOWL7Ae5VY4NhG4oAUrbY4ppnrmKViIcfweysQqK02V6wi0grWiuYrFvbQRuIC7JW7aOMcDNdZxcIe20hcwNDA9nauSSzcYvi9FfAM+3Wxikgb4iGaLsYUpyJSQhTRXN9EcOF220hcgL2BfRFJfF4iO07gOuzfnUj/AQF5ZBjg6/JHAAAAAElFTkSuQmCC); }
@media (max-width: 767px) { .careers_perks_section .row .col:not(:first-child) { flex: 0 0 100% !important; padding: 28px 0 !important; border-left: 0 !important; } .careers_perks_section .row .col:nth-child(3), .careers_perks_section .row .col:nth-child(4) { border-left: 0 !important; border-top: 1px solid #45B97A !important; } }
.template-careers .inner-banner-bar.no-border { margin-bottom: 0 !important; }
.careers_video_section { padding-top: 80px !important; padding-bottom: 36px !important; }
.careers_video_section .video_wrapper { margin-top: 40px !important; }
.careers_what_can { padding-top: 24px !important; padding-bottom: 20px !important; min-height: 0 !important; }
.careers_image_section { padding-top: 0 !important; padding-bottom: 56px !important; min-height: 0 !important; }
.careers_image_section .wrapper2, .careers_image_section .row, .careers_image_section .row .col { padding-top: 0 !important; padding-bottom: 0 !important; min-height: 0 !important; }
.careers_image_section .wrapper2 { border-bottom: 0 !important; }
.careers_perks_section { padding-top: 76px !important; padding-bottom: 0 !important; }
.explore_opportunities_section { padding-top: 30px !important; padding-bottom: 80px !important; }
@media (min-width: 768px) { #mega-menu-primary > li.mega-menu-item-has-children > ul.mega-sub-menu { top: 100% !important; margin-top: 0 !important; } }

.meet-mortgage-team-section .pattern-wrapper img { display: none; }
.shareholders-member-box-inner .buttons-wrapper > div.btn-outer a.button { width: 100%; } 
.busines-contant-bar .info ul { padding-left: 0; }
.busines-contant-bar .wrapper2 { max-width: 1130px; }
.busines-contant-bar.loans .info ul { margin-left: 0; }

.articles-wrap .single-item { position: relative; padding-bottom: 50px; }
.articles-wrap .single-item .learnBtn { position: absolute; left: 50%; min-width: 160px; bottom: 20px; transform: translate(-50%, 0px); }

.mobile_content_bar .sub_using { max-width: 1100px; } 
.other_services_bar.mobile_content_bar { padding-top: 20px; } 

.contentintrobar + .busines-contant-bar { padding-top: 0; }


.page-template-template-personal-credit-card .contentintrobar.reverse h1,
.page-template-template-business-and-commercial-credit-card .contentintrobar.reverse h1 { font-weight: 500; letter-spacing: 0.03em; padding-bottom: 15px; }

.page-template-template-personal-credit-card .contentintrobar.reverse h2,
.page-template-template-business-and-commercial-credit-card .contentintrobar.reverse h2 { font-weight: 800; letter-spacing: 0.03em; padding-bottom: 35px; }

.page-template-template-personal-credit-card .contentintrobar.reverse p,
.page-template-template-business-and-commercial-credit-card .contentintrobar.reverse p { font-size: 20px; line-height: 1.2; font-weight: 600; letter-spacing: 0.04em; }

.page-template-template-personal-credit-card .section-title-wrap,
.page-template-template-business-and-commercial-credit-card .section-title-wrap { margin: 0; background: #0e153e; color: #fff; padding: 30px 0; }

.page-template-template-personal-credit-card .section-title-wrap h3,
.page-template-template-business-and-commercial-credit-card .section-title-wrap h3 { font-size: 32px; line-height: 1.2; padding: 0; font-weight: 800; color: #fff; letter-spacing: 0.03em; }

.page-template-template-personal-credit-card .section-title-wrap .title-desc,
.page-template-template-business-and-commercial-credit-card .section-title-wrap .title-desc { color: #fff; }

.page-template-template-personal-credit-card .section-title-wrap .title-desc p,
.page-template-template-business-and-commercial-credit-card .section-title-wrap .title-desc p { padding: 0; }

.page-template-template-personal-credit-card .section-title-wrap .title-desc p + *,
.page-template-template-business-and-commercial-credit-card .section-title-wrap .title-desc p + * { margin-top: 15px; }

.page-template-template-personal-credit-card .compare-accounts .wrapper2,
.page-template-template-business-and-commercial-credit-card .compare-accounts .wrapper2 { display: flex; flex-wrap: wrap; }

.page-template-template-personal-credit-card .column-item .column-top ,
.page-template-template-business-and-commercial-credit-card .column-item .column-top { position: relative; }

.page-template-template-personal-credit-card .column-item:nth-child(3n+1) .column-top:before ,
.page-template-template-business-and-commercial-credit-card .column-item:nth-child(3n+1) .column-top:before { width: 5000px; height: 100%; content: ''; position: absolute; left: -5000px; top: 0; background: #F0F0F0; }

.page-template-template-personal-credit-card .column-item:nth-child(3n+3) .column-top:before ,
.page-template-template-business-and-commercial-credit-card .column-item:nth-child(3n+2) .column-top:before { width: 5000px; height: 100%; content: ''; position: absolute; right: -5000px; top: 0; background: #F0F0F0; }

.page-template-template-personal-credit-card .column-item,
.page-template-template-business-and-commercial-credit-card .column-item { border-bottom: 0; }

.page-template-template-personal-credit-card .compare-accounts .wrapper2,
.page-template-template-business-and-commercial-credit-card .compare-accounts .wrapper2{ max-width: 1370px; padding: 0; }

.page-template-template-personal-credit-card .compare-accounts .column-item:nth-child(3n+1),
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item:nth-child(3n+1) { width: 20%; }

.page-template-template-personal-credit-card .compare-accounts .column-item:nth-child(3n+1) .column-top,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item:nth-child(3n+1) .column-bottom { padding: 40px 20px; text-align: center; }



.page-template-template-personal-credit-card .column-top h6, .column-bottom h6,
.page-template-template-business-and-commercial-credit-card .column-top h6, .column-bottom h6 { font-size: 15px; }

.page-template-template-personal-credit-card .column-top,
.page-template-template-business-and-commercial-credit-card .column-top { padding: 40px; }


.page-template-template-personal-credit-card ,
.page-template-template-business-and-commercial-credit-card { }

.page-template-template-personal-credit-card ,
.page-template-template-business-and-commercial-credit-card { }

.page-template-template-personal-credit-card ,
.page-template-template-business-and-commercial-credit-card { }

.page-template-template-personal-credit-card ,
.page-template-template-business-and-commercial-credit-card { }

.page-template-template-personal-credit-card ,
.page-template-template-business-and-commercial-credit-card { }





/* ----------------------------responsive---------------------------- */
@media only screen and (max-width: 1440px) {
.community-bar .right { padding: 50px 50px 50px 50px !important; }
.page-id-633 .banner-bar { background-position: 50% top; }

}

@media only screen and (max-width: 1279px) {
.community-bar .right h3 { font-size: 25px; line-height: 1.4 !important; }
.community-bar .right h3:before { bottom: 0 !important; }

}

@media only screen and (max-width: 1023px) {
.page-template-template-personal-credit-card .compare-accounts .column-item:nth-child(3n+1), .page-template-template-business-and-commercial-credit-card .compare-accounts .column-item:nth-child(3n+1) { width: 100%; }

}


@media only screen and (max-width: 1023px) {
.proud-bar h2 { font-size: 25px; padding-bottom: 35px; }
.contentintrobar { padding-top: 70px; }
.proud-bar p { font-size: 16px; line-height: 1.3; }

.community-bar { height: auto; min-height: 400px; }
.community-bar .right h3 { font-size: 20px; }
.community-bar .right h3 { margin-bottom: 20px; padding-bottom: 25px !important; }
.community-bar .right { padding: 50px 30px 50px 30px !important; }

.page-id-903 .busines-contant-bar .subtext h3:before { margin-bottom: 40px; }
.busines-contant-bar.personalloan .intro { padding-bottom: 25px; }
.busines-contant-bar.personalloan .info ul,
.busines-contant-bar .info ul { max-width: 100%; }

.opening-account-types-section.side_by_side .opening-account-type-list .account-type-item { width: 50%; max-width: calc(50% - 20px); }
.opening-account-types-section.side_by_side .opening-account-type-block .opening-account-type-detail { padding: 50px 0; }

#wrapper .personal-checking-account-section .personal-checking-account-list .personal-checking-account-item { flex: 1 1 calc(50% - 18px) !important; max-width: calc(50% - 18px) !important; }
#wrapper .personal-checking-account-section .personal-checking-account-list { margin: 0; }

.opening-account-type-block .opening-account-type-detail .section-main-title h3 { font-size: 30px; line-height: 1.3; }

.articles-wrap .single-item { flex: auto; max-width: calc(33.33% - 15px); }
.article-content h3 { font-size: 20px; }
.articles-wrap .single-item .article-content .learnBtn { padding: 10px 20px; }
.wrapper-inner { padding: 30px 20px; }

}

@media only screen and (max-width: 767px) {
.contentintrobar { padding-top: 50px; }
.proud-bar .wrapper:before { display: none; }
.proud-bar .wrapper { padding: 0 15px; }
.proud-bar p { padding-bottom: 15px; }
.contentintrobar h1 { font-size: 16px; line-height: 1.3; }
.proud-bar h2 { font-size: 20px; padding-bottom: 20px; }

.community-bar .right h3 { padding: 0 0 25px 0 !important; margin-bottom: 25px; }
.community-bar .right p { padding: 0 !important; }
.busines-contant-bar .wrapper2 { padding: 0 15px !important; }
.busines-contant-bar.savingac .subtext p { padding-bottom: 20px !important; }
.contentintrobar.reverse h2 { padding-bottom: 20px; }
.busines-contant-bar.savingac .subtext h3 { padding: 0 0 20px 0; }
.contentintrobar.reverse h2 { font-size: 26px !important; line-height: 1.25 !important; }
.parent-pageid-633.page-id-691 .busines-contant-bar.savingac { padding-top: 0; }
.busines-contant-bar.savingac .subtext p { font-size: 16px; line-height: 1.4; }
.busines-contant-bar.personalloan { padding-top: 15px !important; }
.busines-contant-bar.personalloan .intro { padding-bottom: 10px; }
.busines-contant-bar.personalloan .info ul { padding-left: 0 !important; }

.opening-account-types-section.side_by_side .opening-account-type-list .account-type-item { width: 100%; max-width: 100%; }

#wrapper .personal-checking-account-section .personal-checking-account-list .personal-checking-account-item { flex: 1 1 calc(100% - 0px) !important; max-width: calc(100% - 0px) !important; }
#wrapper .personal-checking-account-section .personal-checking-account-list { margin: 0; }

.section-title { font-size: 35px; }
.articles-wrap .single-item { flex: auto; max-width: calc(100% - 15px); }
.shareholders-member-box-inner .buttons-wrapper > div.btn-outer a.button { min-width: auto; }

.articles-wrap .single-item  .article-content h3 { min-height: auto; }

.page-template-template-personal-credit-card .section-title-wrap h3, .page-template-template-business-and-commercial-credit-card .section-title-wrap h3 { font-size: 20px; }
.page-template-template-personal-credit-card .section-title-wrap .title-desc p, .page-template-template-business-and-commercial-credit-card .section-title-wrap .title-desc p { line-height: 1.2; }
.page-template-template-personal-credit-card .contentintrobar.reverse p, .page-template-template-business-and-commercial-credit-card .contentintrobar.reverse p { font-size: 15px; line-height: 1.4; }
} /* defensive close: ensures any unclosed @media block above does not capture the patches below */


/* =========================================================
   Personal-Notes design feedback batch (May 2026)
   Source: Personal-Notes2.pdf + Personal-Notes (1)-1 DL.pdf
   ========================================================= */

/* --- #2 Global: tighten spacing after H2/intro paragraph (1/2 of current) --- */
.contentintrobar.reverse h2 { padding-bottom: 20px; }
.contentintrobar .textbg { padding-bottom: 15px; }
.busines-contant-bar .work_more p { padding: 0 0 22px; }

/* --- #3 Global: left-align headlines on savings/loans/CD pages --- */
.page-template-template-saving-accounts-parent .contentintrobar .textbg,
.page-template-template-saving-accounts-child .contentintrobar .textbg,
.page-template-template-personal-loans .contentintrobar .textbg,
.page-template-template-personal-loans-child .contentintrobar .textbg,
.page-template-template-business-loans .contentintrobar .textbg,
.page-template-template-business-loans-child .contentintrobar .textbg,
.page-template-template-investment-parent .contentintrobar .textbg,
.page-template-template-investment-child .contentintrobar .textbg { text-align: left; }

.page-template-template-saving-accounts-parent .busines-contant-bar .subtext,
.page-template-template-saving-accounts-child .busines-contant-bar .subtext,
.page-template-template-personal-loans .busines-contant-bar .subtext,
.page-template-template-personal-loans-child .busines-contant-bar .subtext { text-align: left; }

.page-template-template-saving-accounts-parent .busines-contant-bar h2,
.page-template-template-saving-accounts-parent .busines-contant-bar h3,
.page-template-template-saving-accounts-child .busines-contant-bar h2,
.page-template-template-saving-accounts-child .busines-contant-bar h3,
.page-template-template-personal-loans .busines-contant-bar h2,
.page-template-template-personal-loans .busines-contant-bar h3,
.page-template-template-personal-loans-child .busines-contant-bar h2,
.page-template-template-personal-loans-child .busines-contant-bar h3 { text-align: left; }

/* --- #4 Global: consistent subhead weight across content sections --- */
.busines-contant-bar h3,
.busines-contant-bar h4,
.busines-contant-bar .work_more h3,
.busines-contant-bar .work_more h4 { font-weight: 600; }

/* --- #6/#11 Mobile Banking: no indent + tighten spacing after headline --- */
.page-id-804 .contentintrobar .textbg { padding-bottom: 10px; }
.page-id-804 .busines-contant-bar { padding-top: 20px; }
.page-id-804 .busines-contant-bar .work_more p { padding-bottom: 18px; }

/* --- #8 External Transfers: sky-blue line above 'Strong, Speedy & Secure'; smaller 'Cost' headline --- */
.page-template-template-popmoney .busines-contant-bar h2 + h2,
.page-template-template-popmoney .busines-contant-bar .work_more h3.strong-speedy {
    position: relative;
    padding-top: 26px;
    margin-top: 24px;
}
.page-template-template-popmoney .busines-contant-bar .work_more h3.strong-speedy::before,
.page-template-template-popmoney .busines-contant-bar .work_more h3:first-of-type::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: 60px; height: 2px;
    background: #31D0FF;
}
/* Reduce 'Cost' headline to match section sub-heading scale */
.page-template-template-popmoney .busines-contant-bar .work_more h2:not(:first-of-type),
.page-template-template-popmoney .busines-contant-bar .work_more h2.cost-heading { font-size: 22px; font-weight: 600; padding: 18px 0 10px; }

/* --- #9 Zelle: sky-blue accent on app-download buttons; FAQs in Vallant blue --- */
.page-template-template-zelle .appdownloads,
.page-template-template-zelle .app-download-row {
    border-left: 2px solid #31D0FF;
    border-top: 0;
    padding-left: 18px;
}
.page-template-template-zelle .faqs h2,
.page-template-template-zelle .faqs h3,
.page-template-template-zelle .accordion-item .accordion-title { color: #17215C; }

/* --- #12 Retirement Planning: tighten spacing above features --- */
.page-template-template-retirement-plans .busines-contant-bar h3.features-heading,
.page-template-template-retirement-plans .busines-contant-bar .features-section { padding-top: 12px; margin-top: 0; }
.page-template-template-retirement-plans .busines-contant-bar .work_more { text-align: left; }

/* --- #13 Mobile Wallet: tighter spacing above 'Fast. Safe. Card-Free.' + left align --- */
.page-template-template-mobile-wallet .community-bar .textcnt,
.page-template-template-mobile-wallet .busines-contant-bar .work_more { text-align: left; }
.page-template-template-mobile-wallet h2.fast-safe,
.page-template-template-mobile-wallet .work_more h2 + h2 { padding-top: 18px; margin-top: 0; }

/* --- #15 MyFlexFund / FlexFund: side-by-side buttons --- */
.page-template-template-business-loans-child .buttons,
.page-template-template-personal-loans-child .buttons,
.page-template-template-business-loans .buttons,
.page-template-template-personal-loans .buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    justify-content: center;
    align-items: center;
}
.page-template-template-business-loans-child .buttons .learnBtn,
.page-template-template-personal-loans-child .buttons .learnBtn { margin: 0; }

/* --- #16 Money Smart Games: left-align copy + bound subhead size --- */
.page-template-template-smart-money .busines-contant-bar .work_more,
.page-template-template-smart-money .busines-contant-bar .work_more h2,
.page-template-template-smart-money .busines-contant-bar .work_more h3,
.page-template-template-smart-money .busines-contant-bar .work_more p { text-align: left; }
.page-template-template-smart-money h3.earn,
.page-template-template-smart-money .busines-contant-bar .work_more h3 { font-size: 22px; }

/* --- #17 Contact: sentence-case + matched type treatment --- */
.page-template-template-contact .contentintrobar h2,
.page-template-template-contact .contentintrobar .textbg h2 {
    font-size: 40px;
    font-weight: 600;
    text-transform: none;
    text-align: left;
}
.page-template-template-contact .contentintrobar .textbg { text-align: left; }

/* --- #18 Open An Account: left-align copy and button --- */
.page-template-template-open-account .busines-contant-bar,
.page-template-tpl_open_account_page .busines-contant-bar,
.page-template-tpl_open_account_page .busines-contant-bar .work_more,
.page-template-tpl_open_account_page .busines-contant-bar .work_more p,
.page-template-tpl_open_account_page .busines-contant-bar .buttons { text-align: left; }
.page-template-tpl_open_account_page .busines-contant-bar .buttons { justify-content: flex-start; }

/* --- #11 Personal Credit Cards: tone down 'Find the fit for you' weight; tighter leading; align Compare Accounts --- */
.page-template-template-personal-credit-card .contentintrobar.reverse h2 { font-weight: 600; }
.page-template-template-personal-credit-card .busines-contant-bar p { line-height: 1.65; }
.page-template-template-personal-credit-card .compare-accounts-section h2,
.page-template-template-personal-credit-card .compare-accounts h2 { font-size: 40px; font-weight: 600; }

/* --- #14/#10 Logo box containment: FasTrack/All-The-Way-Home/FlexFunds (Personal Loans page) and Mobile Wallet logos --- */
/* Personal Loans cards (.money_market_bar.get_started_bar) have logo <img> nested directly in <h3>; was object-fit:fill which caused distortion + visual crop */
.money_market_bar.get_started_bar h3 img,
.money_market_bar.get_started_bar .item img,
.get_started_bar h3 img,
.get_started_bar .item img {
    object-fit: contain !important;
    max-width: 100% !important;
    max-height: 80px !important;
    width: auto !important;
    height: auto !important;
    display: block;
    margin: 0 auto;
}
.money_market_bar.get_started_bar h3,
.get_started_bar h3 {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 90px;
    overflow: visible;
}
/* Other accounts-abr loan boxes */
.page-template-template-personal-loans .accounts-abr .item-bar .image img,
.page-template-template-personal-loans-child .accounts-abr .item-bar .image img,
.page-template-template-business-loans .accounts-abr .item-bar .image img,
.page-template-template-mobile-wallet .accounts-abr .item-bar .image img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

/* --- #10 ATM Locations / Pinny: fix indent at 'When you visit...' --- */
.page-template-template-pinny-atm .busines-contant-bar .work_more,
.page-template-template-pinny-atm .busines-contant-bar .work_more p,
.page-template-template-pinny-atm .when-you-visit { text-align: left; padding-left: 0; margin-left: 0; }

/* --- #7 Saving Cents: align 'How Saving Cents Works' to match heading above --- */
.page-template-template-saving-accounts-child h3.how-saving-cents-works,
.page-template-template-saving-accounts-child .busines-contant-bar .work_more h3 { text-align: left; padding-top: 18px; }


/* =========================================================
   Personal-Notes design feedback batch — CORRECTIONS
   (Selectors verified against live DOM; targets specific
    page-ids & actual template classnames)
   ========================================================= */

/* --- #8 External Transfers (page-id 2964) — sky-blue line above 'Strong, Speedy & Secure'; smaller 'Cost' --- */
.page-id-2964 .work_more h3:first-of-type {
    position: relative;
    padding-top: 24px;
    margin-top: 22px;
}
.page-id-2964 .work_more h3:first-of-type::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: 60px; height: 2px;
    background: #31D0FF;
}
/* "Cost" headline currently 48px H3; bring down to subhead scale */
.page-id-2964 .wrapper2 > h3,
.page-id-2964 article > .wrapper2 > h3,
.page-id-2964 h3.cost { font-size: 24px; font-weight: 600; padding: 18px 0 10px; }

/* --- #6/#11 Mobile Banking (page-id 804) — uses other_services_bar/banking_bar --- */
.page-id-804 .contentintrobar.reverse { padding-top: 70px; padding-bottom: 0; }
.page-id-804 .contentintrobar .textbg { padding-bottom: 10px; }
.page-id-804 .contentintrobar.reverse h2 { padding-bottom: 18px; }
.page-id-804 .other_services_bar.mobile_content_bar { padding-top: 30px; }
.page-id-804 .other_services_bar .sub_using p { margin-bottom: 14px; }
.page-id-804 .other_services_bar .sub_using { padding-left: 0; }
/* Add space above text-banking section */
.page-id-804 .banking_bar { padding-top: 50px; }
/* Empty .new_video_embed divs left over between sections add 80px each — collapse them */
.page-id-804 .banking_bar .new_video_embed:empty { margin: 0 !important; height: 0 !important; }
.page-id-804 .banking_bar .new_video_embed { margin-bottom: 0 !important; }
/* Tighten H3 → next-section gap; Match spacing across page */
.page-id-804 .banking_bar h3 { padding-bottom: 18px !important; }
.page-id-804 .banking_bar h3:not(:first-child) { padding-top: 36px; }
.page-id-804 .banking_bar p { padding-bottom: 14px !important; }
.page-id-804 .banking_bar ul { margin-bottom: 14px !important; }
/* Mobile banking copy — keep the standard 45px left padding so left-aligned
   content (e.g. the "Security" card) doesn't butt against the card edge.
   (Was previously padding-left: 0 which exposed left-aligned text against the wall.) */
.page-id-804 .other_services_bar .text,
.page-id-804 .banking_bar .text { padding-left: 45px; }
.page-id-804 .other_services_bar .text > *:first-child,
.page-id-804 .banking_bar .text > *:first-child { margin-top: 0; }

/* --- #17 Contact (page-id 773) — H2 lives inside .subtext, was 48px/400/center --- */
.page-id-773 .subtext h2,
.page-template-template-contact .subtext h2 {
    font-size: 36px;
    font-weight: 600;
    text-transform: none;
    text-align: left;
    line-height: 1.15;
}
.page-id-773 .subtext,
.page-template-template-contact .subtext { text-align: left; }

/* --- #16 Money Smart Games (page-id 16803) — left-align all copy --- */
.page-id-16803 .work_more,
.page-id-16803 .work_more h2,
.page-id-16803 .work_more h3,
.page-id-16803 .work_more p,
.page-id-16803 .subtext,
.page-id-16803 article * { text-align: left !important; }
/* Cap subhead at <= 'Money Games' headline size */
.page-id-16803 .work_more h3 { font-size: 22px; }

/* --- #18 Open An Account (page-id 17764) --- */
.page-id-17764 .busines-contant-bar,
.page-id-17764 .busines-contant-bar .work_more,
.page-id-17764 .busines-contant-bar .work_more p,
.page-id-17764 .opening-account-types-section,
.page-id-17764 .opening-account-types-section *,
.page-id-17764 .buttons { text-align: left; }
.page-id-17764 .buttons { justify-content: flex-start; }

/* --- #15 MyFlexFund Loan (page-id 884) — buttons side-by-side --- */
/* The two buttons sit in two separate sibling .multiBtns divs inside .info.
   Make each .multiBtns inline-block so they share the same baseline row. */
.page-id-884 .multiBtns {
    display: inline-block !important;
    vertical-align: middle;
    margin: 8px 7px !important;
}
.page-id-884 .info {
    text-align: center;
}
.page-id-884 .buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    justify-content: center;
    align-items: center;
}
.page-id-884 .buttons .learnBtn { margin: 0; }

/* --- #11 Personal Credit Cards (page-id 19240) — tone down 'Find the fit for you' weight --- */
.page-id-19240 .contentintrobar.reverse h2 { font-weight: 600; }
.page-id-19240 .busines-contant-bar p,
.page-id-19240 .compare-accounts p { line-height: 1.65; }
.page-id-19240 .compare-accounts h2,
.page-id-19240 .compare-accounts-section h2,
.page-id-19240 .section-title-wrap h2,
.page-id-19240 .section-title-wrap h3 { font-size: 40px; font-weight: 600; }

/* --- #12 Retirement Planning (page-id 869) --- */
.page-id-869 .work_more,
.page-id-869 .work_more p,
.page-id-869 .work_more h2,
.page-id-869 .work_more h3 { text-align: left; }
.page-id-869 .features-benefits,
.page-id-869 article > .wrapper > .work_more + * { padding-top: 12px; margin-top: 0; }

/* --- #13 Mobile Wallet (page-id 20869) — left align + tighter spacing above 'Fast. Safe. Card-Free.' --- */
.page-id-20869 .work_more,
.page-id-20869 .community-bar .textcnt,
.page-id-20869 .work_more h2,
.page-id-20869 .work_more p { text-align: left; }
.page-id-20869 .work_more h2 + h2,
.page-id-20869 h2.fast-safe { padding-top: 18px; margin-top: 0; }

/* --- #10 Pinny / ATM (page-id 794) — fix indent at 'When you visit...' --- */
.page-id-794 .work_more,
.page-id-794 .work_more p,
.page-id-794 .when-you-visit { padding-left: 0; margin-left: 0; }

/* --- Saving Cents (page-id 15504) --- */
.page-id-15504 .work_more h3,
.page-id-15504 .busines-contant-bar h3 { text-align: left; padding-top: 18px; }

/* --- #9 Zelle (page-id 21126; template-zelle-business) — actual DOM verified --- */
/* The "Don't Have Zelle?" column with App/Play Store buttons is .col.second_col;
   its left edge currently shows a black divider — replace with sky-blue */
.page-id-21126 .col.second_col,
.page-id-21126 .video_content_wrapper .col.second_col {
    border-left: 2px solid #31D0FF !important;
    border-image: none !important;
    padding-left: 30px;
}
/* Some setups render the divider via pseudo-element on the parent */
.page-id-21126 .video_content_wrapper::before { background: #31D0FF !important; }
/* "Personal FAQs" h3 lives in .subtext.text_faq_small_busienss (note WP typo) */
.page-id-21126 .subtext.text_faq_small_busienss h3,
.page-id-21126 .text_faq_small_busienss h3,
.page-id-21126 .faq_section h2,
.page-id-21126 .faq_section h3 { color: #17215C !important; }

/* --- Mortgage cards & CTA box ("Ready to Take the Next Step?") ---
   Existing cards have border-top:25px solid #31D0FF (light cyan) PLUS a ::before dark-blue strip.
   Per client: remove the cyan strip; keep only the dark-blue strip; unify all buttons. */
.mortgageis_bar .text {
    background: #fff !important;
    color: #17215C !important;
    position: relative;
    padding-top: 50px !important;
    padding-bottom: 40px !important;
    border-top: 0 !important; /* remove the cyan 25px top border */
}
.mortgageis_bar .text::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 24px;
    background: #17215C;
    display: block;
}
.mortgageis_bar .text h2,
.mortgageis_bar .text h3,
.mortgageis_bar .text h4,
.mortgageis_bar .text p { color: #17215C !important; }

/* Unify ALL buttons in the CTA box to identical style/font/weight/padding */
.mortgageis_bar .text a.button,
.mortgageis_bar .text p > a.button,
.mortgageis_bar .text p > a:not(.button):not(.learnBtn) {
    display: inline-block;
    border: 2px solid #31D0FF !important;
    background: transparent !important;
    color: #17215C !important;
    font-family: 'Area Normal', sans-serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: normal !important;
    padding: 10px 22px !important;
    text-decoration: none !important;
    text-transform: none !important;
    margin: 6px 12px 6px 0 !important;
    line-height: 1.2 !important;
    transition: background-color .15s ease, color .15s ease;
}
.mortgageis_bar .text a.button:hover,
.mortgageis_bar .text p > a.button:hover,
.mortgageis_bar .text p > a:not(.button):not(.learnBtn):hover,
.mortgageis_bar .text p > a:not(.button):not(.learnBtn):focus {
    background: #31D0FF !important;
    color: #0E153E !important;
}

/* "Ready to Take the Next Step?" CTA card — fill with Vallant navy,
   white headline, white-background buttons with cyan border + navy text.
   Targets: the .readytake variant OR the last .text in the .itembox. */
.mortgageis_bar .itembox .text.readytake,
.mortgageis_bar .itembox .text:last-child {
    background: #17215C !important;
    color: #ffffff !important;
    text-align: center !important;
}
/* Center button paragraphs inside the navy CTA card */
.mortgageis_bar .itembox .text.readytake p,
.mortgageis_bar .itembox .text:last-child p {
    text-align: center !important;
}
.mortgageis_bar .itembox .text.readytake h2,
.mortgageis_bar .itembox .text.readytake h3,
.mortgageis_bar .itembox .text.readytake h4,
.mortgageis_bar .itembox .text.readytake p,
.mortgageis_bar .itembox .text:last-child h2,
.mortgageis_bar .itembox .text:last-child h3,
.mortgageis_bar .itembox .text:last-child h4,
.mortgageis_bar .itembox .text:last-child p {
    color: #ffffff !important;
}
/* Buttons inside the navy CTA card: white background, cyan border, navy text */
.mortgageis_bar .itembox .text.readytake a.button,
.mortgageis_bar .itembox .text.readytake p > a.button,
.mortgageis_bar .itembox .text.readytake a.learnBtn,
.mortgageis_bar .itembox .text.readytake p > a:not(.button):not(.learnBtn),
.mortgageis_bar .itembox .text:last-child a.button,
.mortgageis_bar .itembox .text:last-child p > a.button,
.mortgageis_bar .itembox .text:last-child a.learnBtn,
.mortgageis_bar .itembox .text:last-child p > a:not(.button):not(.learnBtn) {
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: 2px solid #31D0FF !important;
    color: #0E153E !important;
    text-decoration: none !important;
    /* Uniform width so the three CTAs line up evenly */
    min-width: 260px;
    display: inline-block;
    text-align: center;
    box-sizing: border-box;
}
.mortgageis_bar .itembox .text.readytake a.button:hover,
.mortgageis_bar .itembox .text.readytake a.learnBtn:hover,
.mortgageis_bar .itembox .text:last-child a.button:hover,
.mortgageis_bar .itembox .text:last-child a.learnBtn:hover {
    background: #31D0FF !important;
    background-color: #31D0FF !important;
    color: #0E153E !important;
}


/* --- GLOBAL: hide video sections from all pages EXCEPT home + resource pages (per client request) ---
   Preserved on:
     - body.home (homepage)
     - /resources/                              (page-id 1233)
     - /mortgage/resources/                     (page-id 1026)
     - /financial-planning/resource-center/     (page-id 1230)
     - /business/resource-center/               (page-id 531)
     - /personal/mortgage-first-steps/mortgage-tip-videos/  (page-id 1057)
     - /mortgage/videos/                        (page-id 18414)
     - /resources/money-smart-games/            (page-id 16803)
*/
.community-bar,
.main_video_wrapper,
.new_video_embed,
.video_thumb,
.Zelle_business_video_wrapper,
.mobile_wallet_video_wrapper { display: none !important; }

body.home .community-bar,
body.home .main_video_wrapper,
body.home .new_video_embed,
body.home .video_thumb,
body.home .Zelle_business_video_wrapper,
body.home .mobile_wallet_video_wrapper,
.page-id-1233 .community-bar, .page-id-1233 .main_video_wrapper, .page-id-1233 .new_video_embed, .page-id-1233 .video_thumb,
.page-id-1026 .community-bar, .page-id-1026 .main_video_wrapper, .page-id-1026 .new_video_embed, .page-id-1026 .video_thumb,
.page-id-1230 .community-bar, .page-id-1230 .main_video_wrapper, .page-id-1230 .new_video_embed, .page-id-1230 .video_thumb,
.page-id-531 .community-bar, .page-id-531 .main_video_wrapper, .page-id-531 .new_video_embed, .page-id-531 .video_thumb,
.page-id-1057 .community-bar, .page-id-1057 .main_video_wrapper, .page-id-1057 .new_video_embed, .page-id-1057 .video_thumb,
.page-id-18414 .community-bar, .page-id-18414 .main_video_wrapper, .page-id-18414 .new_video_embed, .page-id-18414 .video_thumb,
.page-id-16803 .community-bar, .page-id-16803 .main_video_wrapper, .page-id-16803 .new_video_embed, .page-id-16803 .video_thumb { display: revert !important; }


/* --- Find A Lender (page-id 1049 / template-new-shareholder): align Apply Now / Learn More buttons across cards --- */
.page-template-template-new-shareholder .shareholders-member-box,
.page-template-template-new-shareholder .item { display: flex; }
.page-template-template-new-shareholder .shareholders-member-box-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}
.page-template-template-new-shareholder .shareholders-member-box-inner .buttons-wrapper {
    margin-top: auto;
}

/* --- Augusta page (page-id 20785): fix headline overlap + temporarily hide video sections --- */
/* Pattern B (style.css:3181-3196) makes .text position:absolute / top:100%, which collapses
   to zero-height when no banner background image is set, causing the H1/H2 to overlay the
   garden_city_locations_section heading below. Restore relative flow for the welcome hero. */
.welcome_hero_section section.inner-banner-bar { overflow: visible; margin-bottom: 0; }
.welcome_hero_section section.inner-banner-bar:has(.inner h1) .text,
.welcome_hero_section section.inner-banner-bar:has(.inner h2) .text,
.page-template-template-augusta-webpage section.inner-banner-bar:has(.inner h1) .text,
.page-template-template-augusta-webpage section.inner-banner-bar:has(.inner h2) .text {
    position: relative !important;
    top: auto !important;
    margin-top: 40px;
    margin-bottom: 40px;
    padding: 0 20px;
    color: #0E153E;
}
.welcome_hero_section section.inner-banner-bar::before,
.welcome_hero_section section.inner-banner-bar::after { display: none !important; }
.welcome_hero_section section.inner-banner-bar .text::before { background: transparent !important; }

/* Temporarily hide both video sections on the Augusta page until new videos are supplied */
.page-id-20785 .community-bar { display: none !important; }


/* ============================================================
   Hero video — full rebuild
   Spec: STRICT 16:9 at every viewport, sits cleanly below the top nav.
   Uses padding-top: 56.25% (9/16) — bulletproof aspect-ratio technique.
   No height caps, no max-height clamps anywhere in the chain.
   body-prefixed selectors + !important defeat legacy rules at
   style.css:201, 206, 207.
   ============================================================ */
body .hero-bar.videobgmain {
    position: relative !important;
    z-index: 1 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
    clear: both !important;
}
body .hero-bar.videobgmain .videobg {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: min(56.25vw, 70vh) !important;
    padding-top: 0 !important;
    max-height: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    /* Use background-color (not shorthand) so any inline poster background-image still renders.
       Brand navy fallback shown while the hero MP4 buffers — avoids the "black empty box" flash. */
    background-color: #17215C !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}
body .hero-bar.videobgmain .videobg video {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    object-fit: cover !important;
    object-position: center center !important;
}
/* Belt-and-suspenders: kill the legacy gradient overlay on the videobgmain variant. */
body .hero-bar.videobgmain::after {
    display: none !important;
    content: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

/* ============================================================
   Locations page — "Find a Branch Near Me" search box
   Widen the Zip/City input so the full "Zip Code or City"
   placeholder is always visible (was 145px → truncated).
   Title text itself is set in the WPSL plugin admin
   (Store Locator → Settings → Labels), not in CSS.
   ============================================================ */
.location-bar #wpsl-search-input {
    width: calc(100% - 100px) !important; /* leave ~80px for the radius select on the right + small gap */
    min-width: 220px !important;
    box-sizing: border-box !important;
}

/* --- #2 Global savings/loans pages: left-align headlines (verified IDs) --- */
.page-id-714 .contentintrobar .textbg,
.page-id-15504 .contentintrobar .textbg,
.page-id-903 .contentintrobar .textbg,
.page-id-884 .contentintrobar .textbg,
.page-id-889 .contentintrobar .textbg { text-align: left; }
.page-id-714 .contentintrobar h1, .page-id-714 .contentintrobar h2,
.page-id-15504 .contentintrobar h1, .page-id-15504 .contentintrobar h2,
.page-id-903 .contentintrobar h1, .page-id-903 .contentintrobar h2,
.page-id-884 .contentintrobar h1, .page-id-884 .contentintrobar h2,
.page-id-889 .contentintrobar h1, .page-id-889 .contentintrobar h2 { text-align: left; }


/* ============================================================
   Business Pages — design feedback batch (2026-05)
   Source: Business-Page-Notes-2.pdf
   Selectors are scoped per page-template / section so changes
   stay isolated to the correct page.
   ============================================================ */

/* ---------- Shared baseline used across these pages ----------
   Standard sentence-case, left-aligned headline treatment so
   secondary headings across business pages are visually consistent. */
.business-headline-baseline,
.page-template-template-business-credit-cards .frequently_bar h2,
.page-template-template-business-credit-cards .mayalso_bar h2,
.page-template-template-business-credit-cards .mayalso_bar .itembox .item .text h3,
.page-template-template-business-loans-child .contentintrobar h1,
.page-template-template-business-loans-child .contentintrobar h2,
.page-template-template-business-loans-child .busines-contant-bar h2,
.page-template-template-business-loans-child .busines-contant-bar h3,
.page-template-template-business-loans-child .get_started_bar h2,
.page-template-template-checking-accounts-child .contentintrobar h1,
.page-template-template-checking-accounts-child .contentintrobar h2,
.page-template-template-checking-accounts-child .busines-contant-bar h2,
.page-template-template-checking-accounts-child .busines-contant-bar h3 { font-family: 'Area Extended'; font-weight: 700; color: #17215C; letter-spacing: 0.6px; }

/* ============================================================
   #1, #2, #3 — Business Credit Cards
   The actual page (URL /business/credit-cards-2/) uses the
   "template-business-and-commercial-credit-card" template.
   Existing rules at lines 3304–3358 set H2 to weight 800 and
   body p to weight 600 — that's why this page reads bolder
   and the body copy looks different from other business pages.
   This block normalizes everything to the standard treatment.
   ============================================================ */
/* #1 — Headline + body weight match */
/* Override the local H1/H2/p weights set at style.css:3304-3311 */
.page-template-template-business-and-commercial-credit-card .contentintrobar.reverse h1 {
    font-weight: 500 !important; /* eyebrow / pretitle stays subtle */
    font-size: 18px !important;
    text-transform: uppercase !important;
    letter-spacing: 1.44px !important;
    color: #0E153E !important;
}
.page-template-template-business-and-commercial-credit-card .contentintrobar.reverse h2 {
    font-weight: 700 !important;        /* was 800; matches other business pages */
    font-family: 'Area Extended' !important;
    color: #0E153E !important;
    letter-spacing: 0.6px !important;
}
.page-template-template-business-and-commercial-credit-card .contentintrobar.reverse p,
.page-template-template-business-and-commercial-credit-card .contentintrobar.reverse,
.page-template-template-business-and-commercial-credit-card .contentintrobar.reverse .textbg {
    font-family: 'Area Normal' !important;
    font-weight: 400 !important;        /* was 600; matches other pages */
    color: #17215C !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
    letter-spacing: normal !important;
}

/* Make the Commercial Cards navy banner span full width.
   In the template, the second .section-title-wrap is wrapped in a
   .wrapper2 (max-width 1370px) which constrains the navy background.
   Strip the wrapper2 width constraint on this template only. */
.page-template-template-business-and-commercial-credit-card .account-section > .wrapper2 {
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
}
.page-template-template-business-and-commercial-credit-card .account-section .section-title-wrap {
    width: 100% !important;
    margin: 0 !important;
    padding: 30px 20px !important;
}
/* And keep the inner heading content centered + readable */
.page-template-template-business-and-commercial-credit-card .account-section .section-title-wrap h3,
.page-template-template-business-and-commercial-credit-card .account-section .section-title-wrap .title-desc {
    max-width: 1370px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
}

/* #2 — Tame the oversized headlines on this page.
       Source: custom.css:1125-1132 sets `.account-section h3,
       .benefit-content h3` to 48px / 700, which is what produced the
       huge "Small Business Cards Benefits" + "Commercial Cards" headings
       in the screenshot. Bring these (and the section-title-wrap h3 at
       style.css:3304) down to the standard 32px business sub-headline. */
.page-template-template-business-and-commercial-credit-card .section-title-wrap h3,
.page-template-template-business-and-commercial-credit-card .account-section h3,
.page-template-template-business-and-commercial-credit-card .benefit-content h3,
.page-template-template-business-and-commercial-credit-card h2,
.page-template-template-business-and-commercial-credit-card h3 {
    font-size: 32px !important;
    font-weight: 700 !important;        /* was 800 / 48px */
    letter-spacing: 0.6px !important;
    line-height: 1.2 !important;
    font-family: 'Area Extended' !important;
}
/* Same treatment for the Personal Credit Card template (sister page,
   same custom.css source) so it stays in sync. */
.page-template-template-personal-credit-card .section-title-wrap h3,
.page-template-template-personal-credit-card .account-section h3,
.page-template-template-personal-credit-card .benefit-content h3 {
    font-size: 32px !important;
    font-weight: 700 !important;
    letter-spacing: 0.6px !important;
    line-height: 1.2 !important;
}
.page-template-template-business-and-commercial-credit-card .section-title-wrap .title-desc,
.page-template-template-business-and-commercial-credit-card .section-title-wrap .title-desc p {
    font-family: 'Area Normal' !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
    letter-spacing: normal !important;
}
/* Inner card title under each card image */
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item h4 {
    font-family: 'Area Extended' !important;
    font-weight: 700 !important;
    font-size: 20px !important;
    color: #17215C !important;
    letter-spacing: 0.4px !important;
}

/* #3 — Full-width grey behind the cards, equal column heights, no clipping
   The legacy :before pseudo grey strips (style.css:3334-3338) extend
   5000px in alternating directions to "fake" full-width grey on
   alternating columns. That creates the broken/striped appearance
   in the screenshot. Disable them and use one solid grey panel. */
.page-template-template-business-and-commercial-credit-card .column-item:nth-child(3n+1) .column-top:before,
.page-template-template-business-and-commercial-credit-card .column-item:nth-child(3n+2) .column-top:before { display: none !important; content: none !important; }

/* Solid full-width grey panel behind the entire card row */
.page-template-template-business-and-commercial-credit-card .compare-accounts {
    width: 100% !important;
    margin: 0 !important;
    padding: 60px 0 !important;
    background: #f0f0f0 !important;
}
.page-template-template-business-and-commercial-credit-card .compare-accounts .wrapper2 {
    max-width: 1370px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: stretch !important; /* force equal column heights */
}
/* All cards inside have a transparent background so the parent grey
   shows through as one continuous panel */
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-top,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-bottom {
    background: transparent !important;
}

/* Center each card image and title in its column */
.page-template-template-business-and-commercial-credit-card .column-item .column-top {
    text-align: center !important;
    padding: 40px 20px !important;
}
.page-template-template-business-and-commercial-credit-card .column-item .card-name {
    text-align: center !important;
}
.page-template-template-business-and-commercial-credit-card .column-item .card-name img {
    margin: 0 auto !important;
    display: block !important;
}
.page-template-template-business-and-commercial-credit-card .column-item .card-name h4 {
    text-align: center !important;
    margin-top: 12px !important;
}

/* Bounding boxes: allow content to flow without clipping. Equal column
   heights via flex on the parent (above) so cards line up cleanly. */
.page-template-template-business-and-commercial-credit-card .column-item {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    min-height: 0 !important;
}
.page-template-template-business-and-commercial-credit-card .column-item .column-top,
.page-template-template-business-and-commercial-credit-card .column-item .column-bottom {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}
.page-template-template-business-and-commercial-credit-card .column-item .column-bottom {
    padding: 30px 25px !important;
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important; /* fill remaining vertical space evenly */
}
/* Push the bottom-buttons to the bottom of each column so Fill Out Form
   buttons line up across cards regardless of feature-list length.
   IMPORTANT: custom.css:1172-1179 sets `.bottom-buttons` to position:
   absolute / bottom: 30px which detaches it from flow and causes the
   "Fill Out Form" / "Apply Now" buttons to overlap the bullet copy and
   Terms & Conditions text on this layout. Force back to static so the
   container participates in the flex column. */
.page-template-template-business-and-commercial-credit-card .column-item .column-bottom .bottom-buttons {
    position: static !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    width: auto !important;
    margin-top: auto !important;
    padding-top: 24px !important;
    text-align: center !important;
}
/* Same fix on the Personal Credit Card sister template */
.page-template-template-personal-credit-card .column-item .column-bottom .bottom-buttons {
    position: static !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    width: auto !important;
    margin-top: auto !important;
    padding-top: 24px !important;
    text-align: center !important;
}
/* Personal Credit Card grey strip + flex equal heights to match */
.page-template-template-personal-credit-card .compare-accounts {
    background: #f0f0f0 !important;
}
.page-template-template-personal-credit-card .compare-accounts .wrapper2 {
    align-items: stretch !important;
    justify-content: center !important;
}
.page-template-template-personal-credit-card .column-item {
    display: flex !important;
    flex-direction: column !important;
    background: transparent !important;
}
.page-template-template-personal-credit-card .column-item .column-bottom {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: visible !important;
}
/* Feature lists read better left-aligned, but stay centered within column */
.page-template-template-business-and-commercial-credit-card .column-item .column-bottom ul {
    text-align: left !important;
    margin: 0 auto !important;
    display: inline-block !important;
}
/* Per-template width for the label column ("Card Features"): default
   was 20% which compresses content on this 4-column variant. Allow
   it to size naturally. */
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 .column-item:nth-child(4n+1) {
    width: 18% !important;
}
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 .column-item:not(:nth-child(4n+1)) {
    flex: 1 !important;
}

/* Also keep coverage on the older template-business-credit-cards
   in case any pages still use it. */
.page-template-template-business-credit-cards .credit-banner-bar h1,
.page-template-template-business-credit-cards .credit-banner-bar h2 {
    font-weight: 700 !important;
    letter-spacing: 0.6px !important;
}
.page-template-template-business-credit-cards .credit-banner-bar .text p,
.page-template-template-business-credit-cards .credit-banner-bar .text {
    font-family: 'Area Normal' !important;
    font-weight: 400 !important;
    color: #17215C !important;
}
.page-template-template-business-credit-cards .frequently_bar h2,
.page-template-template-business-credit-cards .mayalso_bar h2 {
    font-size: 32px !important;
    font-weight: 700 !important;
    color: #17215C !important;
    letter-spacing: 0.6px !important;
}
.page-template-template-business-credit-cards .mayalso_bar .itembox .item .text h3 {
    font-size: 24px !important;
    font-weight: 700 !important;
    letter-spacing: 0.4px !important;
    color: #17215C !important;
}
.page-template-template-business-credit-cards .mayalso_bar {
    margin: 0 !important;
    padding: 80px 0 !important;
    width: 100% !important;
    max-width: none !important;
    background: #f0f0f0 !important;
    border: 0 !important;
}
.page-template-template-business-credit-cards .mayalso_bar .wrapper {
    max-width: 1270px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}
.page-template-template-business-credit-cards .mayalso_bar h2 { text-align: center !important; }
.page-template-template-business-credit-cards .mayalso_bar .itembox {
    justify-content: center !important;
    gap: 30px !important;
}
.page-template-template-business-credit-cards .mayalso_bar .itembox .item .text {
    height: auto !important;
    min-height: 0 !important;
    padding: 35px 25px 35px 35px !important;
    align-items: flex-start !important;
}
.page-template-template-business-credit-cards .mayalso_bar .itembox .item .text .sub {
    width: 100% !important;
    left: 0 !important;
}

/* ============================================================
   #4 — Meet the Team (template-team)
   Layout: NO banner image. Headline ("MEET THE TEAM" eyebrow +
   "We're Here to Help." title) renders at the top of the page on
   white, in the same treatment as the BUSINESS ONLINE BANKING /
   Streamline cash management reference (uppercase eyebrow + 40px
   weight-500 sentence-case title).
   ============================================================ */
/* Strip the banner image; render the section as a clean text block */
.page-template-template-team .inner-banner-bar {
    background-image: none !important;
    background: #fff !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 60px 0 30px !important;
    margin: 0 !important;
    overflow: visible !important;
    position: relative !important;
}
.page-template-template-team .inner-banner-bar .wrapper2 {
    height: auto !important;
    max-height: none !important;
    max-width: 1280px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}
.page-template-template-team .inner-banner-bar .text {
    position: static !important;       /* override Pattern B absolute positioning */
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    max-width: none !important;        /* was 520px which would clip the title */
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #0E153E !important;
    text-align: left !important;
    display: block !important;
}
.page-template-template-team .inner-banner-bar .inner {
    width: 100% !important;
    max-height: none !important;
    text-align: left !important;
}
/* Drop any decorative pseudo-elements (cyan rules, gradients, etc.) */
.page-template-template-team .inner-banner-bar::before,
.page-template-template-team .inner-banner-bar::after,
.page-template-template-team .inner-banner-bar .text::before,
.page-template-template-team .inner-banner-bar .text::after,
.page-template-template-team .inner-banner-bar .inner::before,
.page-template-template-team .inner-banner-bar .inner::after {
    display: none !important;
    content: none !important;
    background: transparent !important;
}
/* H1 eyebrow — uppercase 18px navy */
.page-template-template-team .inner-banner-bar .inner h1,
.page-template-template-team .inner-banner-bar h1 {
    font-family: 'Area Extended' !important;
    font-weight: 700 !important;
    font-size: 18px !important;
    line-height: 1.2 !important;
    letter-spacing: 1.44px !important;
    color: #0E153E !important;
    text-transform: uppercase !important;
    text-align: left !important;
    padding-bottom: 12px !important;
    margin: 0 !important;
}
/* H2 title — 40px Area Extended 500, sentence case, navy */
.page-template-template-team .inner-banner-bar .inner h2,
.page-template-template-team .inner-banner-bar h2 {
    font-family: 'Area Extended' !important;
    font-weight: 500 !important;
    font-size: 40px !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    color: #0E153E !important;
    text-transform: none !important;
    text-align: left !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
}
/* Bring the team grid up close to the headline */
.page-template-template-team #content-part { padding-top: 0 !important; }
.page-template-template-team .michael_shelby_bar { padding-top: 30px !important; padding-bottom: 60px !important; }
.page-template-template-team .michael_shelby_bar .itembox .item { margin-top: 60px !important; }
.page-template-template-team .michael_shelby_bar .itembox .item:first-child,
.page-template-template-team .michael_shelby_bar .itembox .item:nth-child(2) { margin-top: 0 !important; }

/* Team-lead banner: was #235741 (green) → Vallant navy. Bumped
   selector specificity (page-template + class chain) to beat
   assets/css/custom.css:3433-3447. */
.page-template-template-team .michael_shelby_bar .team-lead-img::before,
body .page-template-template-team .michael_shelby_bar .itembox .item .team-lead-img::before,
body .michael_shelby_bar .itembox .item .team-lead-img::before,
.michael_shelby_bar .team-lead-img::before {
    background-color: #17215C !important;
    background: #17215C !important;
}
/* Member contact links — neutralize legacy green */
.page-template-template-team .michael_shelby_bar .itembox .item .text p a,
.page-template-template-team .michael_shelby_bar .itembox .item .text a.email,
.page-template-template-team .michael_shelby_bar .itembox .item .text a.phone {
    color: #17215C !important;
}
.page-template-template-team .michael_shelby_bar .itembox .item .text p a:hover {
    color: #31D0FF !important;
}

/* ============================================================
   Helper: left-align all headlines + intro copy on a page.
   Applied per template/page below.
   ============================================================ */
.left-align-headlines .contentintrobar .textbg,
.left-align-headlines .contentintrobar h1,
.left-align-headlines .contentintrobar h2,
.left-align-headlines .busines-contant-bar h2,
.left-align-headlines .busines-contant-bar h3,
.left-align-headlines .busines-contant-bar .work_more,
.left-align-headlines .busines-contant-bar .work_more p,
.left-align-headlines .busines-contant-bar .info,
.left-align-headlines .busines-contant-bar .subtext { text-align: left !important; }

/* ============================================================
   #5 — Merchant Services (covers both slugs the client uses:
   /business/merchant-services/ and /business/merchant-services-hr-payroll/)
   Left-align all headlines and copy. The "Benefits" and
   "Dual Pricing - IronChoice Program" h2/h3s render center-aligned
   by default — force left across every text element on this page. */
.page-merchant-services .contentintrobar .textbg,
.page-merchant-services .contentintrobar h1,
.page-merchant-services .contentintrobar h2,
.page-merchant-services .busines-contant-bar h2,
.page-merchant-services .busines-contant-bar h3,
.page-merchant-services .busines-contant-bar h4,
.page-merchant-services .busines-contant-bar .work_more,
.page-merchant-services .busines-contant-bar .work_more p,
.page-merchant-services .busines-contant-bar .info,
.page-merchant-services .busines-contant-bar .subtext,
.page-merchant-services-hr-payroll .contentintrobar .textbg,
.page-merchant-services-hr-payroll .contentintrobar h1,
.page-merchant-services-hr-payroll .contentintrobar h2,
.page-merchant-services-hr-payroll .contentintrobar h3,
.page-merchant-services-hr-payroll .contentintrobar h4,
.page-merchant-services-hr-payroll .contentintrobar p,
.page-merchant-services-hr-payroll .busines-contant-bar h1,
.page-merchant-services-hr-payroll .busines-contant-bar h2,
.page-merchant-services-hr-payroll .busines-contant-bar h3,
.page-merchant-services-hr-payroll .busines-contant-bar h4,
.page-merchant-services-hr-payroll .busines-contant-bar .work_more,
.page-merchant-services-hr-payroll .busines-contant-bar .work_more h1,
.page-merchant-services-hr-payroll .busines-contant-bar .work_more h2,
.page-merchant-services-hr-payroll .busines-contant-bar .work_more h3,
.page-merchant-services-hr-payroll .busines-contant-bar .work_more h4,
.page-merchant-services-hr-payroll .busines-contant-bar .work_more p,
.page-merchant-services-hr-payroll .busines-contant-bar .work_more ul,
.page-merchant-services-hr-payroll .busines-contant-bar .work_more ol,
.page-merchant-services-hr-payroll .busines-contant-bar .info,
.page-merchant-services-hr-payroll .busines-contant-bar .info h2,
.page-merchant-services-hr-payroll .busines-contant-bar .info h3,
.page-merchant-services-hr-payroll .busines-contant-bar .info p,
.page-merchant-services-hr-payroll .busines-contant-bar .subtext,
.page-merchant-services-hr-payroll .busines-contant-bar .subtext h1,
.page-merchant-services-hr-payroll .busines-contant-bar .subtext h2,
.page-merchant-services-hr-payroll .busines-contant-bar .subtext h3,
.page-merchant-services-hr-payroll .busines-contant-bar .subtext h4,
.page-merchant-services-hr-payroll .busines-contant-bar .subtext p { text-align: left !important; }

/* ============================================================
   #6 — Business Online Banking — REBUILT (DOM-verified)
   URL: /business/treasury-management/business-online-banking/

   Verified DOM:
     <article class="busines-contant-bar personal-bar treschild">
       <div class="wrapper2">
         <div class="subtextintro"></div>
         <div class="subtext">
           <div class="info">
             <h3>Benefits...</h3>            ← LEFT-align (currently center)
             <ul>...bullets...</ul>           ← left
             <div class="alert-video-section">
               <h3>Business Banking</h3>     ← center, on grey
               <div class="new_video_embed"> ← HIDE
             </div>
             <p>Get started today...</p>     ← center, on grey
           </div>
           <a class="button contact_btn">Contact us</a>  ← sibling of .info, on grey
         </div>
       </div>
     </article>

   NOTE: this page has NO .work_more class — earlier rules using
   .work_more matched nothing.
   ============================================================ */

/* Hide unrelated video section variants */
.page-business-online-banking .community-bar,
.page-business-online-banking .busines-contant-bar .video_bar,
.page-business-online-banking .busines-contant-bar .video_thumb,
.page-business-online-banking .video_bar,
.page-business-online-banking .video_thumb,
.page-business-online-banking .main_video_wrapper,
.page-business-online-banking .Zelle_business_video_wrapper,
.page-business-online-banking .mobile_wallet_video_wrapper,
.page-business-online-banking .birthday-banner-bar { display: none !important; }
/* Hide the embedded video iframe inside .alert-video-section but
   KEEP the "Business Banking" heading visible */
.page-business-online-banking .alert-video-section .new_video_embed,
.page-business-online-banking .alert-video-section .video_thumb,
.page-business-online-banking .alert-video-section iframe,
.page-business-online-banking .alert-video-section img {
    display: none !important;
}

/* --- Section 1: Benefits heading + bullet list — LEFT-aligned on white --- */
.page-business-online-banking .busines-contant-bar .info > h3:first-of-type {
    text-align: left !important;
}
.page-business-online-banking .busines-contant-bar .info > ul,
.page-business-online-banking .busines-contant-bar .info > ul > li {
    text-align: left !important;
}

/* --- Section 2: Bottom CTA — full-width grey band, centered text ---
   Grey is applied via viewport-bleed to THREE elements that sit
   one-after-another at the bottom of the page:
     (a) .alert-video-section (Business Banking heading)
     (b) .info > p:last-of-type ("Get started today..." sentence)
     (c) .subtext > a.contact_btn (the button — uses ::before so the
         button itself keeps its default cyan-border styling) */

/* (a) Business Banking heading band */
.page-business-online-banking .busines-contant-bar .info .alert-video-section {
    background: #f0f0f0 !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding: 60px max(20px, calc(50vw - 600px)) 12px !important;
    margin-top: 60px !important;
    text-align: center !important;
    box-sizing: border-box !important;
}
.page-business-online-banking .busines-contant-bar .info .alert-video-section h3 {
    text-align: center !important;
    margin: 0 !important;
    padding: 0 !important;
    font-family: 'Area Extended' !important;
    font-weight: 700 !important;
    font-size: 32px !important;
    color: #0E153E !important;
}

/* (b) "Get started today..." sentence band — last <p> in .info */
.page-business-online-banking .busines-contant-bar .info > p:last-of-type {
    background: #f0f0f0 !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding: 12px max(20px, calc(50vw - 600px)) 24px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    text-align: center !important;
    box-sizing: border-box !important;
    color: #17215C !important;
}

/* (c) Contact Us button — sits inside the grey CTA band.
   Markup: <a class="button contact_btn" href="...">Contact us</a>

   IMPORTANT: the legacy .button rule at style.css:603 sets
   `background: none !important;` which beats normal `background: #fff`
   declarations. We need our white background on the button to win, so
   we use a body-prefixed selector for higher specificity AND explicit
   `background-color: #fff !important` (which targets the same property
   that `background: none` resets, so specificity decides). */
body.page-business-online-banking .busines-contant-bar .subtext > a.contact_btn,
body.page-business-online-banking .busines-contant-bar .subtext > a.button,
body.page-business-online-banking .busines-contant-bar .subtext > a.button.contact_btn {
    position: relative !important;
    z-index: 2 !important;                  /* above the ::before grey band */
    display: inline-block !important;
    width: auto !important;
    max-width: none !important;
    min-width: 200px !important;
    margin: 0 auto !important;
    padding: 12px 36px !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    background-image: none !important;
    color: #0E153E !important;
    font-family: 'Area Extended' !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 20px !important;
    letter-spacing: 0.6px !important;
    border: 2px solid #31D0FF !important;
    border-radius: 3px !important;
    text-align: center !important;
    text-decoration: none !important;

    cursor: pointer !important;
    transition: all 0.3s !important;
    box-sizing: border-box !important;
}
.page-business-online-banking .busines-contant-bar .subtext > a.contact_btn:hover,
.page-business-online-banking .busines-contant-bar .subtext > a.button:hover,
.page-business-online-banking .busines-contant-bar .subtext > a.button.contact_btn:hover {
    color: #0E153E !important;
    background: #31D0FF !important;
    background-color: #31D0FF !important;
}
/* Center the CTA group inside .subtext. The grey CTA band comes from
   .alert-video-section (which already has background:#f0f0f0); we extend
   its padding-bottom and pull the button up into it so the button reads
   as part of the same panel. Selectors below are intentionally specific
   to beat the existing .info .alert-video-section rule and the
   custom.css `margin: 16px auto 0` button rule. */
.page-business-online-banking .busines-contant-bar .subtext {
    text-align: center !important;
}
.page-business-online-banking .busines-contant-bar .info .alert-video-section {
    padding-bottom: 150px !important;
}
html body.page-business-online-banking .busines-contant-bar .subtext > a.contact_btn,
html body.page-business-online-banking .busines-contant-bar .subtext > a.button.contact_btn {
    margin-top: -130px !important;
}
/* The .info inside .busines-contant-bar.treschild had bottom padding
   that pushed the CTA band away from its content — remove. */
.busines-contant-bar.treschild .info {
    padding-bottom: 0 !important;
}
/* Bottom spacer below the grey CTA section */
.page-business-online-banking .busines-contant-bar { padding-bottom: 60px !important; }

/* --- get_started_bar (defensive — keep if rendered) --- */
.page-business-online-banking .get_started_bar {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 40px 0 !important;
    background: #f0f0f0 !important;
    border: 0 !important;
}
.page-business-online-banking .get_started_bar .wrapper,
.page-business-online-banking .get_started_bar .wrapper2 {
    max-width: 1270px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

/* ============================================================
   #7 — Merchant Capture
   URL: /business/treasury-management/merchant-capture/
   Verified DOM matches Business Online Banking pattern:
     <article class="busines-contant-bar ...">
       <div class="wrapper2">
         <div class="subtext">
           <div class="info">
             <h3>The Benefits...</h3>          ← center → LEFT
             <ul>...benefit bullets...</ul>
             <h3>How does Merchant Capture work?</h3>  ← center → LEFT
             <ul>...how-it-works bullets...</ul>
             <p>Get started today...</p>
             <div class="alert-video-section"> ← contains "Merchant Capture" h3 + green video card
               <h3>Merchant Capture</h3>
               <div class="new_video_embed">
             </div>
           </div>
         </div>
       </div>
     </article>
   - LEFT-align all headings + bullets
   - Hide the green video card inside .alert-video-section
   ============================================================ */

/* Hide the embedded green video card on this page */
.page-merchant-capture .alert-video-section .new_video_embed,
.page-merchant-capture .alert-video-section .video_thumb,
.page-merchant-capture .alert-video-section iframe,
.page-merchant-capture .alert-video-section img,
.page-merchant-capture .community-bar,
.page-merchant-capture .busines-contant-bar .video_bar,
.page-merchant-capture .video_bar,
.page-merchant-capture .video_thumb,
.page-merchant-capture .main_video_wrapper,
.page-merchant-capture .Zelle_business_video_wrapper,
.page-merchant-capture .mobile_wallet_video_wrapper,
.page-merchant-capture .birthday-banner-bar { display: none !important; }
/* Also hide the redundant "Merchant Capture" heading inside the
   alert-video-section since the video is gone (page already has the
   page title at the top) */
.page-merchant-capture .alert-video-section { display: none !important; }

/* Left-align all headings, bullets, and copy in the main content area */
.page-merchant-capture .busines-contant-bar .info > h1,
.page-merchant-capture .busines-contant-bar .info > h2,
.page-merchant-capture .busines-contant-bar .info > h3,
.page-merchant-capture .busines-contant-bar .info > h4,
.page-merchant-capture .busines-contant-bar .info > p,
.page-merchant-capture .busines-contant-bar .info > ul,
.page-merchant-capture .busines-contant-bar .info > ul > li,
.page-merchant-capture .busines-contant-bar .info > ol,
.page-merchant-capture .busines-contant-bar .info > ol > li,
.page-merchant-capture .busines-contant-bar .subtext h1,
.page-merchant-capture .busines-contant-bar .subtext h2,
.page-merchant-capture .busines-contant-bar .subtext h3,
.page-merchant-capture .busines-contant-bar .subtext h4,
.page-merchant-capture .busines-contant-bar .subtext > p { text-align: left !important; }

/* Consistent typography for the section sub-headings */
.page-merchant-capture .busines-contant-bar .info > h2,
.page-merchant-capture .busines-contant-bar .info > h3 {
    font-family: 'Area Extended' !important;
    font-weight: 700 !important;
    font-size: 32px !important;
    color: #0E153E !important;
    letter-spacing: 0.6px !important;
    line-height: 1.2 !important;
    margin-bottom: 20px !important;
}

/* (legacy left-align rules retained for any related selectors below) */
.page-merchant-capture .contentintrobar .textbg,
.page-merchant-capture .contentintrobar h1,
.page-merchant-capture .contentintrobar h2,
.page-merchant-capture .busines-contant-bar h2,
.page-merchant-capture .busines-contant-bar h3,
.page-merchant-capture .busines-contant-bar h4,
.page-merchant-capture .busines-contant-bar .work_more,
.page-merchant-capture .busines-contant-bar .work_more p,
.page-merchant-capture .busines-contant-bar .info,
.page-merchant-capture .busines-contant-bar .subtext { text-align: left !important; }
.page-merchant-capture .busines-contant-bar h2,
.page-merchant-capture .busines-contant-bar h3 {
    font-family: 'Area Extended' !important;
    font-weight: 700 !important;
    color: #17215C !important;
    letter-spacing: 0.6px !important;
}
.page-merchant-capture .community-bar,
.page-merchant-capture .busines-contant-bar .video_bar,
.page-merchant-capture .busines-contant-bar .video_thumb,
.page-merchant-capture .birthday-banner-bar { display: none !important; }

/* ============================================================
   #9 — Fraud Defense (with Positive Pay)
   URL: /business/treasury-management/fraud-defense-with-positivepay/
   Slug: fraud-defense-with-positivepay
   Same DOM pattern as Business Online Banking + Merchant Capture:
     .busines-contant-bar > .wrapper2 > .subtext > .info >
       <h2/h3>Features to Help You Defeat Fraud</h2>
       <h3>Positive Pay® Check</h3>
       <ul>
       <h3>Positive Pay® ACH</h3>
       <ul>
       ...
       <p>Get started today...</p>
       <div class="alert-video-section"> ← HIDE
     .subtext > a.contact_btn (Contact Us button)
   ============================================================ */
/* Tighten gap below banner headline */
.page-fraud-defense-with-positivepay .contentintrobar .textbg,
.page-fraud-defense-with-positivepay .contentintrobar h2 { padding-bottom: 8px !important; }
.page-fraud-defense-with-positivepay .busines-contant-bar { padding-top: 24px !important; }

/* Hide the video card section + any other video variants */
.page-fraud-defense-with-positivepay .alert-video-section,
.page-fraud-defense-with-positivepay .alert-video-section .new_video_embed,
.page-fraud-defense-with-positivepay .community-bar,
.page-fraud-defense-with-positivepay .busines-contant-bar .video_bar,
.page-fraud-defense-with-positivepay .video_bar,
.page-fraud-defense-with-positivepay .video_thumb,
.page-fraud-defense-with-positivepay .main_video_wrapper,
.page-fraud-defense-with-positivepay .birthday-banner-bar { display: none !important; }

/* Vallant-blue full-width bar behind "Features to Help You Defeat Fraud".
   It's the first heading inside .info. */
.page-fraud-defense-with-positivepay .busines-contant-bar .info > h1:first-of-type,
.page-fraud-defense-with-positivepay .busines-contant-bar .info > h2:first-of-type,
.page-fraud-defense-with-positivepay .busines-contant-bar .info > h3:first-of-type {
    background: #17215C !important;
    color: #ffffff !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding: 20px max(30px, calc(50vw - 600px)) !important;
    margin-top: 20px !important;
    margin-bottom: 40px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    font-family: 'Area Extended' !important;
    font-weight: 700 !important;
    font-size: 32px !important;
    letter-spacing: 0.6px !important;
    line-height: 1.2 !important;
}
.page-fraud-defense-with-positivepay .busines-contant-bar .info > h1:first-of-type *,
.page-fraud-defense-with-positivepay .busines-contant-bar .info > h2:first-of-type *,
.page-fraud-defense-with-positivepay .busines-contant-bar .info > h3:first-of-type * {
    color: #ffffff !important;
}

/* Match Positive Pay headlines (and any other inner h3/h4) to the
   standard 32px / 700 / navy treatment used elsewhere in the bank's
   business pages. The "Positive Pay® Check" / "Positive Pay® ACH"
   headlines were rendering at the larger default size — bring them in. */
.page-fraud-defense-with-positivepay .busines-contant-bar .info > h2:not(:first-of-type),
.page-fraud-defense-with-positivepay .busines-contant-bar .info > h3:not(:first-of-type),
.page-fraud-defense-with-positivepay .busines-contant-bar .info > h4 {
    font-family: 'Area Extended' !important;
    font-weight: 700 !important;
    font-size: 32px !important;
    color: #17215C !important;
    letter-spacing: 0.6px !important;
    line-height: 1.2 !important;
    text-align: left !important;
    margin-top: 40px !important;
    margin-bottom: 16px !important;
}

/* Bullet lists + paragraphs left-aligned (default but reinforce) */
.page-fraud-defense-with-positivepay .busines-contant-bar .info > ul,
.page-fraud-defense-with-positivepay .busines-contant-bar .info > ul li,
.page-fraud-defense-with-positivepay .busines-contant-bar .info > p {
    text-align: left !important;
}

/* Bottom "Get started today / Contact Us" CTA — full-width grey band
   matching the Business Online Banking treatment. The "Get started..."
   sentence is the LAST <p> in .info, and the button sits as a sibling
   of .info inside .subtext (same DOM pattern). */
.page-fraud-defense-with-positivepay .busines-contant-bar .info > p:last-of-type {
    background: #f0f0f0 !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding: 60px max(20px, calc(50vw - 600px)) 24px !important;
    margin-top: 60px !important;
    margin-bottom: 0 !important;
    text-align: center !important;
    box-sizing: border-box !important;
    color: #17215C !important;
}
/* Contact Us button — apply the cyan-bordered white-bg pill styling
   that the user confirmed is correct on the Business Online Banking
   page. The legacy `.button { background: none !important }` is beaten
   by body-prefixed specificity. */
body.page-fraud-defense-with-positivepay .busines-contant-bar .subtext > a.contact_btn,
body.page-fraud-defense-with-positivepay .busines-contant-bar .subtext > a.button,
body.page-fraud-defense-with-positivepay .busines-contant-bar .subtext > a.button.contact_btn {
    position: relative !important;
    z-index: 2 !important;
    display: inline-block !important;
    width: auto !important;
    max-width: none !important;
    min-width: 200px !important;
    margin: 0 auto !important;
    padding: 12px 36px !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    background-image: none !important;
    color: #0E153E !important;
    font-family: 'Area Extended' !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 20px !important;
    letter-spacing: 0.6px !important;
    border: 2px solid #31D0FF !important;
    border-radius: 3px !important;
    text-align: center !important;
    text-decoration: none !important;

    cursor: pointer !important;
    transition: all 0.3s !important;
    box-sizing: border-box !important;
}
body.page-fraud-defense-with-positivepay .busines-contant-bar .subtext > a.contact_btn:hover,
body.page-fraud-defense-with-positivepay .busines-contant-bar .subtext > a.button:hover {
    color: #0E153E !important;
    background: #31D0FF !important;
    background-color: #31D0FF !important;
}
.page-fraud-defense-with-positivepay .busines-contant-bar .subtext {
    text-align: center !important;
}
.page-fraud-defense-with-positivepay .busines-contant-bar .info .alert-video-section {
    padding-bottom: 150px !important;
}
html body.page-fraud-defense-with-positivepay .busines-contant-bar .subtext > a.contact_btn,
html body.page-fraud-defense-with-positivepay .busines-contant-bar .subtext > a.button.contact_btn {
    margin-top: -130px !important;
}
/* Remove default bottom padding from the .info on this template so the
   grey CTA band sits flush */
.page-fraud-defense-with-positivepay .busines-contant-bar.treschild .info,
.page-fraud-defense-with-positivepay .busines-contant-bar .info {
    padding-bottom: 0 !important;
}
.page-fraud-defense-with-positivepay .busines-contant-bar { padding-bottom: 60px !important; }

/* Legacy selectors kept (never matched but left for any related pages
   that might use the old slug) */
.page-fraud-defense .contentintrobar .textbg { padding-bottom: 8px !important; }
.page-fraud-defense .contentintrobar h2 { padding-bottom: 8px !important; }
.page-fraud-defense .community-bar,
.page-fraud-defense .busines-contant-bar .video_bar,
.page-fraud-defense .busines-contant-bar .video_thumb,
.page-fraud-defense .alert-video-section,
.page-fraud-defense .birthday-banner-bar { display: none !important; }

/* ============================================================
   #11 — Construction Mortgage Loans
   URL: /business/construction-mortgage-loans/
   Slug: construction-mortgage-loans
   Tighten the large vertical gaps:
     - Below "Loans that are built to help you succeed." headline
     - Above "Benefits of a Business Construction & Mortgage Loan"
     - Around get_started_bar and birthday-banner-bar
   ============================================================ */
.page-construction-mortgage-loans .contentintrobar { padding-top: 20px !important; padding-bottom: 0 !important; }
.page-construction-mortgage-loans .contentintrobar .textbg { padding-bottom: 0 !important; }
.page-construction-mortgage-loans .contentintrobar h1 { padding-bottom: 4px !important; }
.page-construction-mortgage-loans .contentintrobar h2 { padding-bottom: 8px !important; }

/* Tighten the busines-contant-bar — was creating a huge gap before
   the description paragraph */
.page-construction-mortgage-loans .busines-contant-bar { padding-top: 0 !important; padding-bottom: 20px !important; }
.page-construction-mortgage-loans .busines-contant-bar .info { padding-top: 0 !important; padding-bottom: 0 !important; margin-top: 0 !important; }
.page-construction-mortgage-loans .busines-contant-bar .info > p:first-child,
.page-construction-mortgage-loans .busines-contant-bar .info > p { margin-top: 0 !important; padding-top: 0 !important; }
.page-construction-mortgage-loans .busines-contant-bar .info > h2:first-of-type,
.page-construction-mortgage-loans .busines-contant-bar .info > h3:first-of-type {
    margin-top: 24px !important;
    padding-top: 0 !important;
}
.page-construction-mortgage-loans .busines-contant-bar .work_more p { padding-bottom: 12px !important; }
.page-construction-mortgage-loans .busines-contant-bar .work_more h3 { margin-top: 24px !important; }
.page-construction-mortgage-loans .busines-contant-bar .subtext { padding-top: 0 !important; }

/* Tighten the get_started_bar */
.page-construction-mortgage-loans .get_started_bar { padding-top: 40px !important; padding-bottom: 0 !important; }
.page-construction-mortgage-loans .get_started_bar h2 { padding-bottom: 24px !important; }
.page-construction-mortgage-loans .get_started_bar .itembox .item { margin-bottom: 40px !important; padding-top: 30px !important; padding-bottom: 60px !important; }
.page-construction-mortgage-loans .birthday-banner-bar { margin-top: 0 !important; }

/* ============================================================
   #13 — Cashflow Lease
   URL: /business/loans/cashflow-lease/
   Slug: cashflow-lease
   - Left-align all headlines and bullet content
   - Tighten the large vertical gaps (same pattern as construction
     mortgage loans page above)
   ============================================================ */
/* Left-align everything in the main content blocks */
.page-cashflow-lease .contentintrobar .textbg,
.page-cashflow-lease .contentintrobar h1,
.page-cashflow-lease .contentintrobar h2,
.page-cashflow-lease .contentintrobar h3,
.page-cashflow-lease .contentintrobar p,
.page-cashflow-lease .busines-contant-bar h1,
.page-cashflow-lease .busines-contant-bar h2,
.page-cashflow-lease .busines-contant-bar h3,
.page-cashflow-lease .busines-contant-bar h4,
.page-cashflow-lease .busines-contant-bar .info,
.page-cashflow-lease .busines-contant-bar .info > h1,
.page-cashflow-lease .busines-contant-bar .info > h2,
.page-cashflow-lease .busines-contant-bar .info > h3,
.page-cashflow-lease .busines-contant-bar .info > h4,
.page-cashflow-lease .busines-contant-bar .info > p,
.page-cashflow-lease .busines-contant-bar .info > ul,
.page-cashflow-lease .busines-contant-bar .info > ul > li,
.page-cashflow-lease .busines-contant-bar .info > ol,
.page-cashflow-lease .busines-contant-bar .info > ol > li,
.page-cashflow-lease .busines-contant-bar .subtext,
.page-cashflow-lease .busines-contant-bar .subtext h1,
.page-cashflow-lease .busines-contant-bar .subtext h2,
.page-cashflow-lease .busines-contant-bar .subtext h3,
.page-cashflow-lease .busines-contant-bar .subtext h4,
.page-cashflow-lease .busines-contant-bar .subtext p,
.page-cashflow-lease .busines-contant-bar .work_more,
.page-cashflow-lease .busines-contant-bar .work_more h2,
.page-cashflow-lease .busines-contant-bar .work_more h3,
.page-cashflow-lease .busines-contant-bar .work_more p { text-align: left !important; }

/* Tighten gaps */
.page-cashflow-lease .contentintrobar { padding-top: 20px !important; padding-bottom: 0 !important; }
.page-cashflow-lease .contentintrobar .textbg { padding-bottom: 0 !important; }
.page-cashflow-lease .contentintrobar h1 { padding-bottom: 4px !important; }
.page-cashflow-lease .contentintrobar h2 { padding-bottom: 8px !important; }

.page-cashflow-lease .busines-contant-bar { padding-top: 0 !important; padding-bottom: 20px !important; }
.page-cashflow-lease .busines-contant-bar .info { padding-top: 0 !important; padding-bottom: 0 !important; margin-top: 0 !important; }
.page-cashflow-lease .busines-contant-bar .info > p:first-child,
.page-cashflow-lease .busines-contant-bar .info > p { margin-top: 0 !important; padding-top: 0 !important; }
.page-cashflow-lease .busines-contant-bar .info > h2:first-of-type,
.page-cashflow-lease .busines-contant-bar .info > h3:first-of-type {
    margin-top: 24px !important;
    padding-top: 0 !important;
}
.page-cashflow-lease .busines-contant-bar .work_more p { padding-bottom: 12px !important; }
.page-cashflow-lease .busines-contant-bar .work_more h3 { margin-top: 24px !important; }
.page-cashflow-lease .busines-contant-bar .subtext { padding-top: 0 !important; }

.page-cashflow-lease .get_started_bar { padding-top: 40px !important; padding-bottom: 0 !important; }
.page-cashflow-lease .get_started_bar h2 { padding-bottom: 24px !important; }
.page-cashflow-lease .get_started_bar .itembox .item { margin-bottom: 40px !important; padding-top: 30px !important; padding-bottom: 60px !important; }
.page-cashflow-lease .birthday-banner-bar { margin-top: 0 !important; }

/* ============================================================
   #14 — SBA Loans
   URL: /business/loans/sba-loans/
   Slug: sba-loans
   Page actually uses the loans-child template structure with
   .contentintrobar.reverse, .busines-contant-bar.loans, plus the
   navy-card and what_would_bar sections seen on the page.
   - Left-align all headlines and copy
   - Left-align the Get Started button
   - Hide all video sections
   ============================================================ */

/* Hide video sections (multiple class variants used on this page) */
.page-sba-loans .full_video_sec,
.page-sba-loans .community-bar,
.page-sba-loans .alert-video-section,
.page-sba-loans .busines-contant-bar .video_bar,
.page-sba-loans .busines-contant-bar .video_thumb,
.page-sba-loans .video_bar,
.page-sba-loans .video_thumb,
.page-sba-loans .new_video_embed,
.page-sba-loans .main_video_wrapper,
.page-sba-loans .Zelle_business_video_wrapper,
.page-sba-loans .mobile_wallet_video_wrapper,
.page-sba-loans .birthday-banner-bar,
.page-sba-loans .mortvideo_bar,
.page-sba-loans .full_watch_bar { display: none !important; }

/* Left-align EVERY heading and paragraph in the main content blocks.
   Cast a wide net since this page uses several section classes. */
.page-sba-loans .contentintrobar,
.page-sba-loans .contentintrobar .textbg,
.page-sba-loans .contentintrobar h1,
.page-sba-loans .contentintrobar h2,
.page-sba-loans .contentintrobar h3,
.page-sba-loans .contentintrobar p,
.page-sba-loans .busines-contant-bar,
.page-sba-loans .busines-contant-bar h1,
.page-sba-loans .busines-contant-bar h2,
.page-sba-loans .busines-contant-bar h3,
.page-sba-loans .busines-contant-bar h4,
.page-sba-loans .busines-contant-bar p,
.page-sba-loans .busines-contant-bar .info,
.page-sba-loans .busines-contant-bar .info h1,
.page-sba-loans .busines-contant-bar .info h2,
.page-sba-loans .busines-contant-bar .info h3,
.page-sba-loans .busines-contant-bar .info h4,
.page-sba-loans .busines-contant-bar .info p,
.page-sba-loans .busines-contant-bar .info ul,
.page-sba-loans .busines-contant-bar .info ul li,
.page-sba-loans .busines-contant-bar .subtext,
.page-sba-loans .busines-contant-bar .subtext h1,
.page-sba-loans .busines-contant-bar .subtext h2,
.page-sba-loans .busines-contant-bar .subtext h3,
.page-sba-loans .busines-contant-bar .subtext h4,
.page-sba-loans .busines-contant-bar .subtext p,
.page-sba-loans .busines-contant-bar .work_more,
.page-sba-loans .busines-contant-bar .work_more h2,
.page-sba-loans .busines-contant-bar .work_more h3,
.page-sba-loans .busines-contant-bar .work_more p,
.page-sba-loans .banner-bar,
.page-sba-loans .banner-bar h1,
.page-sba-loans .banner-bar h2,
.page-sba-loans .banner-bar h3,
.page-sba-loans .banner-bar p,
.page-sba-loans .banner-bar .subtext,
.page-sba-loans .banner-bar .subtext .wrapper,
.page-sba-loans .mortgage_contant_bar,
.page-sba-loans .mortgage_contant_bar h2,
.page-sba-loans .mortgage_contant_bar h3,
.page-sba-loans .mortgage_contant_bar p,
.page-sba-loans .mortgage_contant_bar .subtext,
.page-sba-loans .mortgage_contant_bar .subtext h2,
.page-sba-loans .mortgage_contant_bar .subtext h3,
.page-sba-loans .mortgage_contant_bar .subtext p,
.page-sba-loans .mortgage_contant_bar .btn_group,
.page-sba-loans .what_would_bar,
.page-sba-loans .what_would_bar h1,
.page-sba-loans .what_would_bar h2,
.page-sba-loans .what_would_bar h2.heading_2,
.page-sba-loans .what_would_bar h3,
.page-sba-loans .what_would_bar p,
.page-sba-loans .what_would_bar .itembox,
.page-sba-loans .what_would_bar .itembox .text,
.page-sba-loans .what_would_bar .itembox .text .sub,
.page-sba-loans .what_would_bar .itembox .text p,
.page-sba-loans .what_would_bar .itembox .text ul,
.page-sba-loans .what_would_bar .itembox .text ul li,
.page-sba-loans .money_market_bar,
.page-sba-loans .money_market_bar h2,
.page-sba-loans .money_market_bar h3,
.page-sba-loans .money_market_bar p,
.page-sba-loans .money_market_bar .itembox,
.page-sba-loans .money_market_bar .itembox .item,
.page-sba-loans .money_market_bar .itembox .item .text,
.page-sba-loans .money_market_bar .itembox .item .contents,
.page-sba-loans .get_started_bar,
.page-sba-loans .get_started_bar h2,
.page-sba-loans .get_started_bar h3,
.page-sba-loans .get_started_bar p,
.page-sba-loans .get_started_bar .itembox .item,
.page-sba-loans .get_started_bar .itembox .item h3,
.page-sba-loans .get_started_bar .itembox .item p { text-align: left !important; }

/* ============================================================
   "You May Also Be Interested In" — hide whenever the section's
   .itembox has no .item children (empty cross-sell row).
   Originally scoped to /personal/other-services/ (page id 894)
   per ticket 868jkqrm7, but the same empty heading was reported
   on additional pages (868jkq0wj, others), so use :has() to hide
   globally whenever the section is empty. Falls back gracefully
   on browsers without :has() — they just keep seeing the heading
   as before (no regression).
   ============================================================ */
/* QA correction 2026-05-15: Personal Debit Card actually has 2
   valid items in its mayalso_bar ("Personal Checking Accounts" +
   "Personal Savings Plans"), so the belt-and-suspenders
   .page-debit-card selector was wrong — it hid valid content.
   Only keep the page-id-894 fallback (Other Services, where the
   section is genuinely empty) plus the :has() rule that hides
   any mayalso_bar whose .itembox has zero .item children. */
.page-id-894 .mayalso_bar,
.mayalso_bar:not(:has(.itembox .item)) {
    display: none !important;
}

/* ============================================================
   /personal/debit-card/ (page id 19675) — the debit-card
   template renders everything centered, but the rest of the
   personal sub-pages use left-aligned copy. Left-align all
   the content (intro h3 + body paragraphs).
   ============================================================ */
.page-debit-card .busines-contant-bar h2,
.page-debit-card .busines-contant-bar h3,
.page-debit-card .busines-contant-bar p,
.page-debit-card .busines-contant-bar .subtext,
.page-debit-card .busines-contant-bar .subtext h2,
.page-debit-card .busines-contant-bar .subtext h3,
.page-debit-card .busines-contant-bar .subtext p,
.page-debit-card .busines-contant-bar .info,
.page-debit-card .busines-contant-bar .info p,
.page-debit-card .busines-contant-bar .info ul,
.page-debit-card .busines-contant-bar .info ul li,
.page-debit-card .busines-contant-bar .work_more,
.page-debit-card .busines-contant-bar .work_more h2,
.page-debit-card .busines-contant-bar .work_more h3,
.page-debit-card .busines-contant-bar .work_more p {
    text-align: left !important;
}

/* Align the .mortgage_contant_bar .subtext block with the intro hero's
   .contentintrobar .wrapper above (max-width:1130px). The default
   .subtext rule applies max-width:945px + margin:0 auto, which on
   SBA Loans pushed every paragraph/heading 78px right of the hero
   copy. The outer .mortgage_contant_bar .wrapper is 1170px (15px
   side padding), so we constrain the subtext block by adding the
   same 20px of horizontal padding to land at exactly 1130px usable
   width — matching the hero's left edge. */
.page-sba-loans .mortgage_contant_bar .subtext {
    max-width: none !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
}

/* ============================================================
   /business/loans/ — long card titles like "BusinessManager®"
   are treated as a single word (no break opportunity), so with
   the default overflow-wrap:normal the text overflows the card
   to the right. Allow overflow-wrap:anywhere on these card h3s
   so the browser can break the word when it can't fit.
   Scoped to the business loans hub specifically rather than
   globally so other money_market_bar pages aren't affected.
   ============================================================ */
.page-loans .money_market_bar .itembox .item h3,
.page-business-loans .money_market_bar .itembox .item h3,
.page-template-template-business-loans .money_market_bar .itembox .item h3 {
    /* Previously set overflow-wrap: anywhere / word-break: break-word /
       hyphens: auto to handle long single-word titles, but that broke
       "BusinessManager®" mid-word ("BusinessManag" / "er®"). The ®
       superscript glyph is the visual culprit because Chrome's break
       algorithm treats it as a permissible break opportunity.
       Use keep-all + normal wrap instead — single-word card titles stay
       intact; multi-word titles (e.g. "Short-Term Inventory Loans")
       still wrap at spaces / hyphens. Slightly smaller font lets the
       longest single-word title ("BusinessManager®") fit comfortably
       within the card. */
    word-break: keep-all;
    overflow-wrap: normal;
    hyphens: none;
    font-size: 26px;
}

/* ============================================================
   /business/treasury-management/business-online-banking/
   (page id 334) — the .busines-contant-bar.treschild h3 rule
   applies padding: 0 30px which indented the "Benefits of a
   Business Online banking account" heading 30px right of the
   intro hero. The .info ul also gets a 150px left padding from
   the global .busines-contant-bar .info ul rule. Both push the
   content visibly right of where the hero copy sits.
   ============================================================ */
.page-business-online-banking .busines-contant-bar.treschild h3,
.page-business-online-banking .busines-contant-bar h3 {
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: left !important;
}
.page-business-online-banking .busines-contant-bar .info ul {
    padding-left: 0 !important;
    margin-left: 0 !important;
}

/* Left-align all CTAs/buttons on the page (Get Started, Learn More,
   Apply Now, Choose A Lender). Override the global .button + .learnBtn
   centering so they sit at the left edge of their container. */
body.page-sba-loans .mortgage_contant_bar .subtext > a.button,
body.page-sba-loans .mortgage_contant_bar .subtext > a.contact_btn,
body.page-sba-loans .mortgage_contant_bar a.button.contact_btn,
body.page-sba-loans .busines-contant-bar .subtext > a.button,
body.page-sba-loans .busines-contant-bar .subtext > a.contact_btn,
body.page-sba-loans .busines-contant-bar a.button.contact_btn,
body.page-sba-loans .busines-contant-bar a.learnBtn,
body.page-sba-loans .what_would_bar .itembox .text a.learnBtn,
body.page-sba-loans .money_market_bar .itembox .item a.learnBtn,
body.page-sba-loans .get_started_bar .itembox .item a.learnBtn {
    display: inline-block !important;
    float: none !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    text-align: center !important; /* keep button label centered inside */
}

/* ============================================================
   #15 — Commercial Checking — left-align headlines + copy
   ============================================================ */
.page-commercial-checking .contentintrobar .textbg,
.page-commercial-checking .contentintrobar h1,
.page-commercial-checking .contentintrobar h2,
.page-commercial-checking .busines-contant-bar h2,
.page-commercial-checking .busines-contant-bar h3,
.page-commercial-checking .busines-contant-bar .work_more,
.page-commercial-checking .busines-contant-bar .work_more p,
.page-commercial-checking .busines-contant-bar .info,
.page-commercial-checking .busines-contant-bar .subtext { text-align: left !important; }

/* ============================================================
   #16 — Business Interest Checking + Totally Free Business Checking
        (left-align headlines)
   ============================================================ */
.page-business-interest-checking .contentintrobar .textbg,
.page-business-interest-checking .contentintrobar h1,
.page-business-interest-checking .contentintrobar h2,
.page-business-interest-checking .busines-contant-bar h2,
.page-business-interest-checking .busines-contant-bar h3,
.page-totally-free-business-checking .contentintrobar .textbg,
.page-totally-free-business-checking .contentintrobar h1,
.page-totally-free-business-checking .contentintrobar h2,
.page-totally-free-business-checking .busines-contant-bar h2,
.page-totally-free-business-checking .busines-contant-bar h3 { text-align: left !important; }


/* ============================================================
   Global — interior page banner images
   Cap ALL inner banner variants at 390px so tall hero images stop
   dominating the viewport on wide desktop screens.
   Source of the problem: assets/css/responsive.css lines 37-38, 40,
   369-370, 459-460 set `.inner-banner-bar .text {min-height:72vh}`
   and `.banner-bar {height:74vh}` inside @media (max-width:1440px),
   which on a 1080px viewport produces ~778px tall banners.
   These rules override at every breakpoint with !important.
   Excludes the homepage hero (.hero-bar) which has its own 16:9 logic.
   ============================================================ */
.inner-banner-bar,
.banner-bar,
.banner-bar.faqs,
.inner-banner-bar.banking_banner,
.inner-banner-bar.business-banner-bar,
.inner-banner-bar.credit-banner-bar,
.inner-banner-bar.meet_pinny_banner,
.inner-banner-bar.inner-bay-home-banner,
.inner-banner-bar.about,
.inner-banner-bar.no-border,
.inner-banner-bar.border-none,
section.inner-banner-bar,
section.banner-bar {
    max-height: 390px !important;
    height: 390px !important;
    min-height: 390px !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    overflow: hidden !important;
}
/* Cap inner-banner2 too (separate template variant used on some pages) */
.inner-banner2,
section.inner-banner2 {
    max-height: 390px !important;
    height: 390px !important;
    min-height: 390px !important;
    background-size: cover !important;
    background-position: center center !important;
    overflow: hidden !important;
}
/* Strip the responsive.css `min-height: 72vh` from the inner .text
   container at all breakpoints — that was forcing the section taller. */
.inner-banner-bar .wrapper2,
.inner-banner-bar .wrapper,
.banner-bar .wrapper2,
.banner-bar .wrapper,
.inner-banner2 .wrapper2,
.inner-banner2 .wrapper {
    height: 100% !important;
    max-height: 390px !important;
    min-height: 0 !important;
}
.inner-banner-bar .text,
.banner-bar .text,
.inner-banner2 .text {
    height: 100% !important;
    max-height: 390px !important;
    min-height: 0 !important;
}
.inner-banner-bar .inner,
.banner-bar .inner,
.inner-banner2 .inner {
    max-height: 390px !important;
    min-height: 0 !important;
}

/* ============================================================
   Restore default bullets/numbers in body-copy lists.
   A global "* { list-style: none }" rule in the WP Customizer
   "Additional CSS" panel strips list markers site-wide. Nav and
   menu lists already get their own explicit "list-style: none"
   styling, so this targeted override only affects ULs/OLs that
   appear inside body-content containers used by the editor.
   ============================================================ */
.banking_bar ul,
.busines-contant-bar ul,
.contentintrobar ul,
.community-bar ul,
.proud-bar ul,
.sub_using ul,
.other_services_bar ul,
.fullcontent ul,
.bottomcontent ul,
.mortgageis_bar .itembox .text ul,
#content-part .itembox .text ul,
#content-part .wrapper2 > ul,
#content-part .wrapper > ul {
    list-style: disc outside !important;
    padding-left: 1.5em !important;
    margin: 0 0 1em !important;
}
/* Numbered lists (<ol>) are handled by existing counter-based ::before rules in
   .other_services_bar.mobile_content_bar (and similar) — re-enabling list-style: decimal
   here would stack a second marker on top of those. Editors using a plain <ol> elsewhere
   can re-add list-style: decimal locally. */
.banking_bar ul li,
.busines-contant-bar ul li,
.contentintrobar ul li,
.community-bar ul li,
.proud-bar ul li,
.sub_using ul li,
.other_services_bar ul li,
.fullcontent ul li,
.bottomcontent ul li,
.mortgageis_bar .itembox .text ul li,
#content-part .itembox .text ul li,
#content-part .wrapper2 > ul > li,
#content-part .wrapper > ul > li {
    list-style: disc outside !important;
    display: list-item !important;
}

/* Suppress the disc bullet on lists that already render their own marker
   (check icons via .info ul li:before / .work_more ul li::before / .busines_list,
   or the .check-list utility class).
   Without this, the disc above stacks on top of the check icon. */
.busines-contant-bar .info ul,
.busines-contant-bar .info ul li,
.busines-contant-bar .work_more ul,
.busines-contant-bar .work_more ul li,
.busines_list,
.busines_list li,
ul.check-list,
ul.check-list li,
.busines-contant-bar ul.check-list,
.busines-contant-bar ul.check-list li {
    list-style: none !important;
    list-style-type: none !important;
}

/* Restore disc bullets on plain content lists that fall outside the
   themed wrappers above (e.g. pages converted from a Google Doc that
   render inside .wrapper2 .page .layoutArea, or the Privacy & Security
   page's .Privacy_bar container). Without these selectors the lists
   render with no marker at all. */
.Privacy_bar ul,
.wrapper2 .page .layoutArea ul,
.wrapper2 .page .layoutArea ol {
    list-style: disc outside !important;
    padding-left: 1.5em !important;
    margin: 0 0 1em !important;
}
.Privacy_bar ul li,
.wrapper2 .page .layoutArea ul li {
    list-style: disc outside !important;
    display: list-item !important;
}
.wrapper2 .page .layoutArea ol {
    list-style: decimal outside !important;
}
.wrapper2 .page .layoutArea ol li {
    list-style: decimal outside !important;
    display: list-item !important;
}

/* ============================================================
   Remove Pinnacle-era mountain watermarks on Vallant pages.
   - About (page-id-60 / .page-about): .intro_sec used to render a faint
     mountain illustration behind the "Local strength" copy. Vallant does
     not use mountain imagery.
   - Careers (page-id-20447 / .page-careers): .careers_what_can has the
     mountains_bg.png set inline via the template; null it out via CSS so
     we don't have to edit the PHP template.
   The existing .page-id-21054 / .page-id-21126 rule above already handles
   zelle template variants — this extends the same approach to About + Careers.
   ============================================================ */
.page-about .intro_sec,
.page-id-60 .intro_sec {
    background-image: none !important;
}
.page-careers .careers_what_can,
.page-id-20447 .careers_what_can {
    background-image: none !important;
}

/* ============================================================
   Topics / Account Type select dropdowns — green arrow → Vallant navy.
   Replaces the legacy /assets/images/select_bg.jpg (sage green square
   with a white arrow) with an inline SVG of the same icon on the
   Vallant navy (#0E153E). Keeps the same 46px button width / height
   on the right edge so layout doesn't shift.
   Affects: Resources / Financial Planning Resource Center "Topics"
   filter, and the .loginbar account-type select.
   ============================================================ */
.top_search_bar .select_bar .selectinput,
.top_search_bar .select_bar .selectinput.active,
.loginbar .selectinput {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='46' height='46' viewBox='0 0 46 46'><rect width='46' height='46' fill='%230E153E'/><path d='M16 19 L23 27 L30 19 Z' fill='%23ffffff'/></svg>") !important;
    background-repeat: no-repeat !important;
    background-position: right center !important;
    background-color: #fff !important;
}

/* ============================================================
   Left-align intro copy, section header, and check-list on the
   financial-planning child pages (.busines-contant-bar.investchild).
   The page template inherits centered text from base .work_more and
   .subtext h3 rules, but per the ClickUp tickets (Wealth Mgmt,
   Retirement, Comprehensive, Insurance, Estate/Legacy, Highland Trust,
   Financial Advice, Business Planning) the intro / heading / list
   should read flush-left. We deliberately do NOT touch the card
   grid below (.itembox .item) — those stay centered.
   Bullet list also has margin:0 auto + max-width:670px applied
   higher up; override to flush-left.
   ============================================================ */
.busines-contant-bar.investchild .work_more,
.busines-contant-bar.investchild .work_more p,
.busines-contant-bar.investchild .work_more h3,
.busines-contant-bar.investchild .subtext > h3,
.busines-contant-bar.investchild .subtext > p,
.busines-contant-bar.investchild .info > p,
.busines-contant-bar.investchild .info > h3 {
    text-align: left !important;
}
.busines-contant-bar.investchild .info ul {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Ticket 868jm98k2 — Investment Services body copy is offset ~180px
   right of the hero on its page. The earlier fix above set text-align:
   left, which left-aligns text within its container but does NOT move
   the container itself. The actual indent comes from Gutenberg block
   wrappers (wp-block-columns / wp-block-group / wp-block-media-text)
   inside the_content(), which add their own internal padding/margin/
   grid columns. Force every block wrapper inside .work_more (and the
   adjacent .subtext) to be full-width and start at the wrapper's left
   edge. Does not affect images — they keep their natural placement
   inside their block, just no longer push the text into a right column. */
.busines-contant-bar.investchild .work_more,
.busines-contant-bar.investchild .work_more > *,
.busines-contant-bar.investchild .work_more .wp-block-group,
.busines-contant-bar.investchild .work_more .wp-block-columns,
.busines-contant-bar.investchild .work_more .wp-block-column,
.busines-contant-bar.investchild .subtext,
.busines-contant-bar.investchild .subtext > *,
.busines-contant-bar.investchild .subtext .info,
.busines-contant-bar.investchild .subtext .info > * {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    max-width: none !important;
    width: auto !important;
    text-align: left !important;
}
/* If the_content() uses a wp-block-columns layout with a leading
   spacer column, collapse it back to a single full-width column so
   the text starts at the wrapper's left edge. */
.busines-contant-bar.investchild .work_more .wp-block-columns {
    display: block !important;
    flex-wrap: nowrap !important;
}
.busines-contant-bar.investchild .work_more .wp-block-columns > .wp-block-column {
    flex-basis: 100% !important;
    width: 100% !important;
}

/* ============================================================
   Left-align section headers on mortgage info pages
   (.mortgage_contant_bar). The base rule .mortgage_contant_bar h2
   centers all H2s; per ClickUp (Mortgage Refinance, How to Get
   a Mortgage, Adjustable Rate Mortgages) the body H2 should be
   flush-left to match the hero treatment.
   ============================================================ */
.mortgage_contant_bar .subtext h2,
.mortgage_contant_bar .subtext h3,
.mortgage_contant_bar .wrapper > .subtext > p {
    text-align: left !important;
}

/* ============================================================
   Left-align Personal Loans child pages (.busines-contant-bar.personalloan)
   Covers /personal/loans/finding-a-loan/{home-improvement, auto-loans,
   boat-loan, etc.}. The "in progress" ticket flagged that intro copy
   was no longer left-aligned after the earlier bullet-restore commit.
   ============================================================ */
.busines-contant-bar.personalloan .work_more,
.busines-contant-bar.personalloan .work_more p,
.busines-contant-bar.personalloan .work_more h3,
.busines-contant-bar.personalloan .subtext > p,
.busines-contant-bar.personalloan .subtext > h3,
.busines-contant-bar.personalloan .info > h3 {
    text-align: left !important;
}

/* ============================================================
   Telephone Banking + Merchant Capture: left-align the section H3
   inside .work_more / .subtext / .info where the base template
   centers them. Scoped to specific pages so we don't disturb
   other layouts that intentionally center their section headings.
   ============================================================ */
.page-telephone-banking .busines-contant-bar .work_more h3,
.page-telephone-banking .busines-contant-bar .subtext h3,
.page-telephone-banking .busines-contant-bar .info h3,
.page-merchant-capture .busines-contant-bar .work_more h3,
.page-merchant-capture .busines-contant-bar .subtext h3,
.page-merchant-capture .busines-contant-bar .info h3 {
    text-align: left !important;
}

/* Merchant Capture: tighten the excess vertical gaps between
   intro paragraph -> section H3 -> bullet list -> follow-up copy.
   The base template's default spacing was tuned for a centered
   single-column layout; in a left-aligned flow it reads as too airy. */
.page-merchant-capture .busines-contant-bar .work_more h3,
.page-merchant-capture .busines-contant-bar .subtext h3,
.page-merchant-capture .busines-contant-bar .info h3 {
    padding: 24px 0 16px !important;
    margin: 0 !important;
}
.page-merchant-capture .busines-contant-bar .info ul {
    padding-bottom: 24px !important;
}

/* ============================================================
   Holiday Schedule (/holiday-schedule/, page-id-81)
   - The template renders the page title <h1>Holiday Schedule</h1>
     overlaid on the hero flag image in navy text — barely legible.
   - Per the client ticket: remove the in-hero copy, and render
     "Holiday Schedule" as a proper section header above the table.
   ============================================================ */
.page-id-81 .inner-banner2 .wrapper2 h1 {
    display: none !important;
}
.page-id-81 .holiday_bar .wrapper2 .information_box1 {
    position: relative;
}
.page-id-81 .holiday_bar .wrapper2 .information_box1::before {
    content: "Holiday Schedule";
    display: block;
    color: #0E153E;
    font-family: "Area Extended", sans-serif;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.96px;
    text-align: left;
    padding: 0 0 32px;
    margin: 0;
}

/* ============================================================
   Careers page (/careers/, .page-careers)
   - Mountains background already removed earlier.
   - Type treatment fix: the "We're in this together" intro section
     was centered while the rest of the site uses left-aligned
     section intros. Left-align the heading + description so the
     Careers hero reads like the standard treatment.
   ============================================================ */
.page-careers .careers_video_section .heading_wrapper,
.page-careers .careers_video_section .heading_wrapper h1,
.page-careers .careers_video_section .heading_wrapper h2,
.page-careers .careers_video_section .heading_wrapper h3,
.page-careers .careers_video_section .desc_wrapper,
.page-careers .careers_video_section .desc_wrapper p {
    text-align: left !important;
}
.page-careers .careers_video_section .heading_wrapper {
    padding-left: 0 !important;
}
/* Mobile: the .desc_wrapper p carries 30px horizontal padding from
   custom.css which leaves the body copy indented further than the
   heading above it. Zero out so the paragraph flushes against the
   same left edge as the heading. */
.page-careers .careers_video_section .desc_wrapper p {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ============================================================
   Apply for Your First Mortgage + sibling mortgage-child pages
   - Mortgage Process step bars (.process_bar.mortgagechild h3):
     base template uses a teal #265468 background carried over from
     Pinnacle. Per Laura, switch to Vallant navy (#0E153E) and color
     the "Step X" prefix sky blue (#31D0FF); the descriptor stays
     white. Keeps the existing chevron shape and shadow.
   - Accordion FAQ headings inside .mortgage_contant_bar were
     rendered in sky blue (#31D0FF) on a white background — fails
     ADA contrast. Switch to navy (#17215C) per Laura's note.
   ============================================================ */
.process_bar.mortgagechild .contact h3 {
    background: #0E153E !important;
}
.process_bar.mortgagechild .contact h3 span {
    color: #31D0FF !important;
}
.mortgage_contant_bar .accordion_bar .accordion-item h3,
.mortgage_contant_bar .accordion_bar .accordion-item h3 span,
.mortgage_contant_bar .accordion_bar .accordion-item h3 a {
    color: #17215C !important;
}

/* Stacked hero button groups (.stacked_buttons) — make every button
   in the column the same width so a short "Loan Status" doesn't look
   narrower than "Resume Application". Stretches each button to match
   the widest, kept left-aligned text-position consistent. */
.stacked_buttons .wp-block-button .wp-block-button__link {
    min-width: 220px;
    text-align: center;
}

/* Hide the bottom "Check out our series of Mortgage Tip videos."
   cross-sell section on pages that don't have rebranded video
   content yet. Easy to remove individual selectors here when the
   client adds new Vallant videos. */
.page-apply-for-your-first-mortgage .checkout_bar,   /* ticket 868jkt90n */
.page-id-983 .checkout_bar {                          /* ticket 868jkt6n8 - Mortgage First Steps */
    display: none !important;
}

/* Checking child pages (Benefits/High-Yield/VIP Free/Totally Free):
   the bottom .money_market_bar.totally_free_bar used to show a row
   of unrelated cross-sell cards (Zelle, Augusta, Careers, Mortgage
   Lender) because the template-checking-accounts-child query was
   wired to $post->post_parent, which for these top-level pages
   returned junk siblings. Per ticket 868jk8npf we previously hid
   the entire section; per ticket 868jkphfk we now hard-wire the
   query in template-checking-accounts-child.php to the four real
   Vallant checking products (Benefits / High-Yield / VIP Free /
   Totally Free) so this section renders the proper cross-sell row
   on every checking page. The CSS hide rule that lived here has
   been removed — keep this comment as a breadcrumb. */

/* ============================================================
   Mortgage Lending Augusta (/mortgage-lending-augusta-ga/)
   Per ticket 868jkkuny:
   - "Copy that's in the hero needs to move below the hero" —
     pull the .inner-banner-bar overlay text out from on top of the
     cityscape and render it as a normal-flow band immediately below.
   - "Copy needs to be treated like other pages with the
     left-alignment, etc." — left-align hero copy + "Find Us Around
     the Augusta Area" heading + intro description.
   Note: the .inner-banner-bar template part sets overflow:hidden,
   which clips absolutely-positioned children — explicitly override.
   ============================================================ */
.page-mortgage-lending-augusta-ga .inner-banner-bar {
    position: relative !important;
    height: 380px !important;
    min-height: 0 !important;
    overflow: visible !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}
.page-mortgage-lending-augusta-ga .welcome_hero_section {
    margin-bottom: 240px;
}
.page-mortgage-lending-augusta-ga .inner-banner-bar > .wrapper2 {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    transform: none !important;
    padding: 50px 0 0 !important;
    height: auto !important;
    min-height: 0 !important;
    background: transparent;
    max-width: 1130px;
    margin: 0 auto !important;
}
.page-mortgage-lending-augusta-ga .inner-banner-bar > .wrapper2 .text,
.page-mortgage-lending-augusta-ga .inner-banner-bar > .wrapper2 .text .inner,
.page-mortgage-lending-augusta-ga .inner-banner-bar > .wrapper2 .text * {
    color: #0E153E !important;
    text-align: left !important;
}
/* "Find Us Around the Augusta Area" heading uses display:flex
   justify-content:center to center the SVG pin + text together —
   override to flex-start so the row hugs the left edge. */
.page-mortgage-lending-augusta-ga .garden_city_locations_section .wrapper2 > h2 {
    justify-content: flex-start !important;
    text-align: left !important;
}
.page-mortgage-lending-augusta-ga .garden_city_locations_section .findus_desc,
.page-mortgage-lending-augusta-ga .garden_city_locations_section .findus_desc p {
    text-align: left !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* ============================================================
   Financial Planning landing (/financial-planning/, page-id-553)
   Per ticket 868jm7h7u. The .proud-bar content does not match the
   rest of the Financial Planning section (e.g. /wealth-management/
   uses .contentintrobar with eyebrow + headline together, body
   copy at 18px Area Normal 300, headline at 32px Area Extended
   600). On this landing the heading rendered AFTER the Highland
   Trust logo at weight 800, body copy was 20px, eyebrow was 500.
   - Reorder via flex so the "Financial Planning Services" H2 sits
     ABOVE the Highland Trust logo H2 (matches eyebrow → headline
     → logo → copy hierarchy used site-wide).
   - Match heading weight (600) and body copy size (18px) to the
     rest of the financial-planning section.
   - Bump the hero eyebrow ("FORGE A LIMITLESS LEGACY") from 500
     to 700 to match the other section eyebrows.
   - Left-align intro paragraph (was margin-left:262.5px).
   - Center the "Visit Highland Trust Partners" button.
   - Hide the duplicate .proud-bar after .accounts-abr that leaks
     raw .embed-container CSS as a text node.
   ============================================================ */
.page-id-553 .textbg h1 {
    font-weight: 700 !important;
}
.page-id-553 .proud-bar {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
}
.page-id-553 .proud-bar .wrapper {
    display: flex;
    flex-direction: column;
}
.page-id-553 .proud-bar .wrapper > h2:nth-of-type(2) {
    /* "Financial Planning Services" — move above the logo, match
       weight used on /wealth-management/ etc. */
    order: -1;
    font-weight: 600 !important;
    padding-bottom: 16px !important;
    margin: 0 !important;
}
.page-id-553 .proud-bar .wrapper > h2:first-of-type {
    /* The Highland Trust logo wrapper H2 — tighten its padding and
       cap the logo size so the gap below it is reasonable. The
       default padding-bottom was 65px which created a large void. */
    padding: 0 !important;
    margin: 0 0 24px !important;
}
.page-id-553 .proud-bar .wrapper > h2:first-of-type img {
    max-width: 320px;
    height: auto;
}
.page-id-553 .proud-bar .wrapper > p {
    margin: 0 0 16px !important;
    max-width: none !important;
    text-align: left !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    line-height: 1.6 !important;
}
.page-id-553 .proud-bar .wrapper > a.learnBtn {
    display: block;
    width: max-content;
    margin: 16px auto 0 !important;
}
.page-id-553 .accounts-abr + .proud-bar {
    display: none !important;
}

/* ============================================================
   Money Smart Games (/resources/money-smart-games/, page-id-16803)
   Per ticket 868jmbg00: center "Play Game" button horizontally
   within each card AND center the "Play Game" text inside each
   button. Leave the title copy left-aligned.
   ============================================================ */
.page-id-16803 .articles-wrap .single-item .article-content .learnBtn {
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
}

/* ============================================================
   Meet Pinny / Pinny ATM (/atm-locations/, page-id-794)
   Per ticket 868jkk3pj: add spacing between the "When you visit
   Pinny..." H4 and the bullet list immediately below it.
   ============================================================ */
.page-id-794 .busines-contant-bar.bank_debit_bar .subtext h4 {
    padding-bottom: 24px;
    margin-bottom: 8px;
}

/* Mortgage Tip Videos / Video Resources page (page-id-18414)
   Per ticket 868jktvu0: the video CPT query pulls in 3 Pinnacle-
   branded "One Bank for Life" placeholders into the "Our Culture"
   row. Hide the broken cards (filter row + listings) but keep the
   wrapper visible and inject a "coming soon" placeholder via
   pseudo-element. Remove the placeholder once Vallant-branded
   videos replace the Pinnacle thumbnails. */
.page-id-18414 .vdeo-resources-wrp {
    display: block !important;
    padding: 80px 0 100px;
}
.page-id-18414 .vdeo-resources-wrp .filter-row,
.page-id-18414 .vdeo-resources-wrp #all-listing,
.page-id-18414 .vdeo-resources-wrp #filter-listing {
    display: none !important;
}
.page-id-18414 .vdeo-resources-wrp .wrapper::after {
    content: "New mortgage tip videos are coming soon. Check back shortly for the full library \2014 or call us at 877.759.7939 in the meantime.";
    display: block;
    max-width: 720px;
    margin: 0 auto;
    padding: 60px 24px;
    text-align: center;
    font-family: "Area Normal", sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.6;
    color: #0E153E;
}

/* Who We Are (/about/who-we-are/, page-id-188)
   Per ticket 868jkjzxu: toggle off the "Power of Community" section
   (the section that comes right after the .inner-banner2 hero). The
   element has no distinguishing class so target by sibling order. */
.page-id-188 .inner-banner2 + section {
    display: none !important;
}

/* ============================================================
   Hide "empty" related-page cards on financial-planning pages —
   cards rendered with no <p> description body (just an <h3>
   title and a Learn More button). Per ClickUp the client wants
   these visually removed rather than padded out with copy.

   The cards live inside .money_market_bar.investparent on every
   /financial-planning/ child page (Business Planning, Wealth
   Management, Retirement, Comprehensive, Insurance, Estate/Legacy,
   Financial Advice, Highland Trust). On each page roughly half the
   cards have a description; the others render just title + button.

   Markup shape of an empty card:
       <div class="item"><h3>...</h3><a class="learnBtn">...</a></div>
   ============================================================ */
.money_market_bar.investparent .item:not(:has(p)) {
    display: none !important;
}

/* Hide the "You May Also Be Interested In" section on financial-planning
   pages where the related-content slot is empty (e.g. Financial Advice).
   The section renders as <div class="news_sec other mayalso investparent">
   with only a <h2> inside .wrapper2 and no card grid. Suppress when the
   wrapper has no actual related cards/posts. */
.news_sec.mayalso.investparent:not(:has(.itembox, article, .item, .post)) {
    display: none !important;
}

/* ============================================================
   Checking-account tiles (Benefits / High-Yield / VIP / Totally Free)
   - The navy bar at the top of every tile comes from `border-top: 22px`
     on .personal-checking-account-block (set in header.php).
   - The active tile additionally renders a <span class="your-match-title">
     which by default flows BELOW the border and makes the active tile taller.
   - Fix: overlay the "Your Match" label ON the 22px navy border so the
     active tile's header is the same height as the inactive ones.
   - Let the flex list's default `align-items: stretch` equalize tile heights.
   ============================================================ */

/* Make the tile a positioning context for the absolutely-placed ribbon */
.personal-checking-account-section .personal-checking-account-list .personal-checking-account-block {
    position: relative !important;
    overflow: visible !important;
}

/* Hide the YOUR MATCH label on every tile except the active one */
.personal-checking-account-section .personal-checking-account-block:not(.active) .your-match-title,
.personal-checking-account-section .personal-checking-account-block:not(.active) .sub-main-title.your-match-title {
    display: none !important;
}

/* Overlay the YOUR MATCH label onto the navy border-top so it doesn't add height */
.personal-checking-account-section .personal-checking-account-block .your-match-title,
.personal-checking-account-section .personal-checking-account-block .sub-main-title.your-match-title {
    position: absolute !important;
    top: -22px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 22px !important;
    min-height: 22px !important;
    line-height: 22px !important;
    padding: 0 12px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    background: transparent !important;
    color: #ffffff !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    transform: none !important;
    z-index: 2 !important;
    pointer-events: none;
}

/* Title row — consistent vertical space across all 4 tiles.
   Worst case is a 2-line title (e.g. "High-Yield Checking"), so reserve
   space for 2 lines on every tile. This keeps the description text and
   the "Open Account" button at the same Y position across all tiles. */
.personal-checking-account-section .personal-checking-account-block .extra-small-main-block-title {
    min-height: 84px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px 12px 8px;
    margin: 0;
}
.personal-checking-account-section .personal-checking-account-block .extra-small-main-block-title h3,
.personal-checking-account-section .personal-checking-account-block .extra-small-main-block-title h4 {
    margin: 0;
    line-height: 1.2;
    word-break: normal;
    overflow-wrap: break-word;
}

/* Description text — equal height so the "Open Account" button lines up. */
.personal-checking-account-section .personal-checking-account-block .personal-checking-detail .detail {
    min-height: 100px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

/* Stop closed tiles from stretching to match an expanded sibling's height.
   Each tile sizes to its own content, so no empty white box appears below
   the "More Details" link of closed cards when one is opened. Closed tiles
   all share the same content, so they remain visually equal in the default
   collapsed state. */
#wrapper .personal-checking-account-section .personal-checking-account-list {
    align-items: flex-start !important;
}
#wrapper .personal-checking-account-section .personal-checking-account-list .personal-checking-account-item {
    align-self: flex-start !important;
}
#wrapper .personal-checking-account-section .personal-checking-account-list .personal-checking-account-block {
    height: auto !important;
}

/* ============================================================
   Savings tile rows (.money_market_bar.savingac)
   The "Account Details" button (.account) was floating up on tiles
   with shorter copy because alignment was handled by min-height
   tricks that break when content varies.
   Fix: anchor .account to the bottom of each .item (which is already
   position:relative) and reserve bottom padding so the button has
   a consistent gap from the card edge. Buttons line up horizontally
   across every row on every savings parent + child page.
   ============================================================ */
.money_market_bar.savingac .itembox .item,
.money_market_bar.savingac.savingchild .itembox .item {
    padding-bottom: 140px !important;
}
/* Bordered primary CTA — pinned above the underlined link */
.money_market_bar.savingac .itembox .item a.learnBtn,
.money_market_bar.savingac.savingchild .itembox .item a.learnBtn {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 75px !important;
    margin: 0 auto !important;
    display: inline-block !important;
    width: max-content;
    max-width: calc(100% - 60px);
}
/* Underlined "Account Details" text link — pinned to the very bottom */
.money_market_bar.savingac .itembox .item a.account,
.money_market_bar.savingac.savingchild .itembox .item a.account {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 30px !important;
    margin: 0 auto !important;
    display: inline-block !important;
    width: max-content;
    max-width: calc(100% - 60px);
}
/* If a tile has ONLY .account (no .learnBtn), .account still anchors at the
   bottom — handled by the rule above. If a tile has ONLY .learnBtn, drop it
   to the same bottom slot the .account would occupy so single-CTA tiles
   still match the row visually. */
.money_market_bar.savingac .itembox .item:not(:has(a.account)) a.learnBtn,
.money_market_bar.savingac.savingchild .itembox .item:not(:has(a.account)) a.learnBtn {
    bottom: 30px !important;
}

/* ============================================================
   Single-lender mobile fixes (single-lender.php)
   - Profile photo was rendering as an oval because the mobile
     override set max-width: 320px while leaving height: 410px.
   - "Get in Touch" rows (phone / email / address) were centered
     via existing tablet/mobile rules. Left-align on mobile.
   ============================================================ */
/* ============================================================
   Mobile Wallet intro + video-section copy alignment
   /personal/digital-mobile-banking/
   - "Fast. Safe. Card-Free." section was centered; left-align it.
   - Body paragraphs in both sections had different sizes (14px vs
     16px); unify to 16px / weight 400 so the page reads as one.
   ============================================================ */
.page-template-template-mobile-wallet .contentintrobar.reverse p {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    text-align: left;
}
.page-template-template-mobile-wallet article.busines-contant-bar.mobile_wrapper_video_section .subtext,
.page-template-template-mobile-wallet article.busines-contant-bar.mobile_wrapper_video_section .subtext h3,
.page-template-template-mobile-wallet article.busines-contant-bar.mobile_wrapper_video_section .subtext p {
    text-align: left !important;
}
.page-template-template-mobile-wallet article.busines-contant-bar.mobile_wrapper_video_section .subtext p {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    margin-left: 0;
    margin-right: 0;
}

/* ============================================================
   Mobile Wallet "Why Use" list — restore single custom bullets.
   The section has its own ::before dot bullet (custom.css 3897+),
   but the global .busines-contant-bar ul li rule in this file
   re-enables list-style: disc on top of it, producing double
   bullets on /personal/digital-mobile-banking/.
   ============================================================ */
.why_use_mobile_wallet_content .inner_content .item ul,
.why_use_mobile_wallet_content .inner_content .item ul li {
    list-style: none !important;
}
.why_use_mobile_wallet_content .inner_content .item ul li {
    display: block !important;
}

@media only screen and (max-width: 767px) {
    /* Force the profile photo to a 1:1 circle on mobile */
    .profile-large-image img {
        width: min(320px, 80vw) !important;
        height: min(320px, 80vw) !important;
        max-width: min(320px, 80vw) !important;
        aspect-ratio: 1 / 1 !important;
        object-fit: cover !important;
        border-radius: 50% !important;
        display: block;
        margin: 0 auto !important;
    }
    /* Left-align all the "Get in Touch" rows on mobile */
    .get_in_touch_wrapper .contact-wrapper,
    .get_in_touch_wrapper .contact-wrapper ul,
    .get_in_touch_wrapper .contact-wrapper ul li {
        text-align: left !important;
    }
    .get_in_touch_wrapper .contact-wrapper ul li a,
    .get_in_touch_wrapper .email_wrapper a,
    .get_in_touch_wrapper .address_wrapper a {
        justify-content: flex-start !important;
        text-align: left !important;
    }
    .get_in_touch_wrapper .flex_gap {
        align-items: flex-start !important;
    }
}

/* ============================================================
   Collapse the empty inner-banner-bar hero when a page has no
   featured image. The template prints `background-image: url()`
   when get_the_post_thumbnail_url() returns nothing, which leaves
   a 390px-tall blank band above the page intro (visible on
   /personal/savings-plans/the-guardian/ and any other savings
   child page without a hero image).
   ============================================================ */
section.inner-banner-bar[style*="background-image: url();"],
section.inner-banner-bar[style*="background-image:url();"],
section.inner-banner-bar[style$="url();"],
section.inner-banner-bar[style$='url("");'],
section.inner-banner-bar[style$="url('');"] {
    display: none !important;
}

/* ============================================================
   /business/fastrack-loan/ (page id 426) — left-align the
   "Benefits of a Business FasTrack Loan" heading, bullet list,
   and Apply Now button. The shared .busines-contant-bar.treschild
   styles apply a 30px left padding to the h3 and the .contact_btn
   centers itself via `display: table; margin: 0 auto;`. Both
   look wrong on this page where the rest of the copy is flush
   to the wrapper2 left edge.
   ============================================================ */
.page-id-426 .busines-contant-bar.treschild h3 {
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: left !important;
}
.page-id-426 .busines-contant-bar .info ul {
    padding-left: 0 !important;
    margin-left: 0 !important;
}
/* (Apply Now button on Business FasTrack stays centered via the default
   .contact_btn { display: table; margin: 0 auto } — no override needed.) */

/* ============================================================
   /business/business-mobile-banking/ (page id 15780): the
   template centers the section H3s ("Mobile Banking",
   "Business Mobile Banking", "Text Banking", "Security") and
   nests one of them inside an inline style="text-align:center".
   The body copy and lists are left-aligned, producing the
   misaligned look reported. Left-align all H2/H3 inside the
   main content sections to match the rest of the page.
   ============================================================ */
.page-id-15780 .wrapper2 h2,
.page-id-15780 .wrapper2 h3,
.page-id-15780 .alert-video-section h2,
.page-id-15780 .alert-video-section h3 {
    text-align: left !important;
}

/* Round 2 (ticket 868jku3u8 follow-up):
   1) The intro paragraph is rendered inside .other_services_bar
      .mobile_content_bar .sub_using which has max-width:950px +
      margin:0 auto (style.css:1773), centering it in a narrower
      column than the hero / "Mobile Banking" h2 / bullets below.
      That's why the intro reads as "less left-aligned" than the
      rest. Force .sub_using to fill its wrapper and start at the
      same left edge as the other sections.
   2) Close the big vertical gap between the intro section and
      the "Mobile Banking" heading: .mobile_content_bar's 80px
      bottom padding + the next section's natural margin reads
      as too airy. Trim it on this page. */
.page-id-15780 .other_services_bar.mobile_content_bar .sub_using,
.page-id-15780 .mobile_content_bar .sub_using {
    max-width: none !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: left !important;
}
.page-id-15780 .mobile_content_bar {
    padding-top: 40px !important;
    padding-bottom: 24px !important;
}
.page-id-15780 .banking_bar {
    padding-top: 0 !important;
}

/* ============================================================
   Credit Card comparison tables — REBUILT as a clean grid
   (tickets 868jku6wn, 868jk8eqg)

   Target: match the live Pinnacle layout
   (https://www.pinnaclebank.com/personal-credit-cards/) which
   renders as a tidy 3-column grid (label + 2 cards per row),
   with thin lines between cells, multiple data-rows stacked,
   and all content top-aligned inside each cell.

   Markup (verified from both templates):
     <div class="compare-accounts">
       <div class="wrapper2">
         <div class="column-item">     ← label  (col 1)
           <div class="column-top"><h6>Credit Cards</h6></div>
           <div class="column-bottom"><h6>Card Features</h6></div>
         </div>
         <div class="column-item">     ← card 1 (col 2)
           <div class="column-top">…image + name…</div>
           <div class="column-bottom">…features ul + button…</div>
         </div>
         <div class="column-item">     ← card 2 (col 3)
           …
         </div>
         <div class="column-item">     ← label  (col 1, row 2)
           …
         </div>
         …
       </div>
     </div>

   Implementation:
     - .wrapper2 = grid container, 3 columns, gap:0.
     - Each .column-item spans 2 grid rows and uses
       grid-template-rows: subgrid so its column-top sits in the
       same row as every other column-item's column-top in the
       same data-row — the row heights auto-sync without JS.
     - Borders on every cell give the visual grid lines.
     - flex-direction:column + justify-content:flex-start inside
       each cell top-aligns its content.

   This entire block intentionally OVERRIDES every legacy flex /
   :before / min-height hack earlier in this file via specificity
   (page-template + compare-accounts ancestor) and !important.
   ============================================================ */
.page-template-template-personal-credit-card .compare-accounts,
.page-template-template-business-and-commercial-credit-card .compare-accounts {
    background: #f0f0f0 !important;
    padding: 60px 0 !important;
    margin: 0 !important;
    width: 100% !important;
}
.page-template-template-personal-credit-card .compare-accounts .wrapper2,
.page-template-template-business-and-commercial-credit-card .compare-accounts:not(.column-3) .wrapper2 {
    display: grid !important;
    grid-template-columns: 18% 1fr 1fr !important;
    grid-auto-rows: auto !important;
    gap: 0 !important;
    align-items: stretch !important;
    max-width: 1370px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    background: transparent !important;
    box-sizing: border-box !important;
    flex-wrap: nowrap !important; /* neutralize legacy flex layout */
    /* close the top edge of the grid with a horizontal line */
    border-top: 1px solid rgba(14, 21, 62, 0.18) !important;
}

/* Commercial Cards (.compare-accounts.column-3) — label + 3 cards
   per row. Markup difference from the basic compare-accounts: the
   column-items are DIRECT children (no .wrapper2 wrapper). Promote
   .compare-accounts.column-3 itself to the grid container.

   To match the full-bleed grey panel of the basic compare-accounts
   while still centering the grid content at 1370px max, we use
   `padding: 60px max(20px, calc(50vw - 685px))` — the side padding
   expands automatically on wider viewports so the grid sits in a
   1370px-wide column, but the grey background extends edge-to-edge. */
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 {
    display: grid !important;
    grid-template-columns: 14% 1fr 1fr 1fr !important;
    grid-auto-rows: auto !important;
    gap: 0 !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 60px max(20px, calc(50vw - 685px)) !important;
    background: #f0f0f0 !important;
    box-sizing: border-box !important;
    border-top: 1px solid rgba(14, 21, 62, 0.18) !important;
}
/* Remove right border on the 4th item of each commercial data-row */
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 .column-item:nth-child(4n) {
    border-right: none !important;
}
/* The 3n border-removal earlier was for the 3-col layout; ensure it
   does NOT also strip the border on the 3rd commercial column (which
   sits in the middle of a 4-column row, not the rightmost). */
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 .column-item:nth-child(3n):not(:nth-child(4n)) {
    border-right: 1px solid rgba(14, 21, 62, 0.18) !important;
}
/* Label cells in the commercial section sit every 4th column-item
   starting at 1 (instead of every 3rd). Re-apply the center-align
   styling for those specific items so the layout matches the basic
   .compare-accounts label treatment. */
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 .column-item:nth-child(4n+1) > .column-top,
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 .column-item:nth-child(4n+1) > .column-bottom {
    align-items: center !important;
    text-align: center !important;
    padding: 40px 20px !important;
}

/* Each column-item is a 2-row grid cell that uses subgrid to sync
   its column-top / column-bottom heights with the siblings in the
   same data-row. */
.page-template-template-personal-credit-card .compare-accounts .column-item,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item {
    display: grid !important;
    grid-template-rows: subgrid !important;
    grid-row: span 2 !important;
    width: auto !important;
    flex: none !important;
    background: transparent !important;
    box-sizing: border-box !important;
    /* vertical grid line — right edge of each cell except the last
       in each data-row (handled below) */
    border-right: 1px solid rgba(14, 21, 62, 0.18) !important;
    /* kill the legacy :before pseudo "fake grey strip" */
}
.page-template-template-personal-credit-card .compare-accounts .column-item .column-top:before,
.page-template-template-personal-credit-card .compare-accounts .column-item .column-top:after,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item .column-top:before,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item .column-top:after {
    display: none !important;
    content: none !important;
}
/* Remove right border on the rightmost column of each data-row (every 3rd) */
.page-template-template-personal-credit-card .compare-accounts .column-item:nth-child(3n),
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item:nth-child(3n) {
    border-right: none !important;
}

/* Top cell — card image + name (or "Credit Cards" h6 in label) */
.page-template-template-personal-credit-card .compare-accounts .column-item > .column-top,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item > .column-top {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: center !important;
    padding: 40px 30px !important;
    margin: 0 !important;
    min-height: 0 !important;
    background: transparent !important;
    box-sizing: border-box !important;
    /* horizontal grid line below the top row */
    border-bottom: 1px solid rgba(14, 21, 62, 0.18) !important;
}

/* Bottom cell — features list + buttons (or "Card Features" h6 in label).
   border-bottom doubles as the separator above the NEXT data-row's
   card images (and closes the bottom of the grid for the last row). */
.page-template-template-personal-credit-card .compare-accounts .column-item > .column-bottom,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item > .column-bottom {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    text-align: left !important;
    padding: 40px 30px !important;
    margin: 0 !important;
    min-height: 0 !important;
    background: transparent !important;
    box-sizing: border-box !important;
    border-top: none !important;
    border-bottom: 1px solid rgba(14, 21, 62, 0.18) !important;
}

/* Label cells (every 3rd column-item starting from 1) — center
   the h6 horizontally inside its cell so it reads as a row title
   rather than a misplaced left-edge label. Still top-aligned. */
.page-template-template-personal-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-top,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-top,
.page-template-template-personal-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-bottom,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-bottom {
    align-items: center !important;
    text-align: center !important;
    padding: 40px 20px !important;
}
.page-template-template-personal-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-top h6,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-top h6,
.page-template-template-personal-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-bottom h6,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-bottom h6 {
    margin: 0 !important;
    padding: 0 !important;
}

/* Card image: respect natural ratio, capped width so the card
   renders at a consistent size across all columns. */
.page-template-template-personal-credit-card .compare-accounts .column-item .card-name img,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item .card-name img {
    display: block !important;
    width: 100% !important;
    max-width: 220px !important;
    height: auto !important;
    margin: 0 auto 16px !important;
}
.page-template-template-personal-credit-card .compare-accounts .column-item .card-name h4,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item .card-name h4 {
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
}

/* Bullet list — left-aligned inside the bottom cell, no extra
   indent/margin so the bullets sit flush with the cell padding. */
.page-template-template-personal-credit-card .compare-accounts .column-item > .column-bottom ul,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item > .column-bottom ul {
    list-style: disc !important;
    margin: 0 0 20px 18px !important;
    padding: 0 !important;
    text-align: left !important;
    display: block !important;
    width: auto !important;
}
.page-template-template-personal-credit-card .compare-accounts .column-item > .column-bottom ul li,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item > .column-bottom ul li {
    margin-bottom: 12px !important;
    padding: 0 !important;
    text-align: left !important;
}

/* Push Apply Now / Fill Out Form button cluster to the bottom of
   each cell so buttons line up horizontally across cards. */
.page-template-template-personal-credit-card .compare-accounts .column-item > .column-bottom .bottom-buttons,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item > .column-bottom .bottom-buttons {
    margin-top: auto !important;
    padding-top: 20px !important;
    text-align: center !important;
    position: static !important;
}

/* ============================================================
   SBA Loans — intro paragraph alignment (ticket 868jkvg0v)

   Prior fix targeted .mortgage_contant_bar .subtext but on the
   actual rendered page the intro lives inside .busines-contant-bar
   .work_more (template-business-loans-child structure). Also handle
   the .banner-bar fallback where the_content() is wrapped in a
   580px right-aligned column. Force the busines-contant-bar wrapper
   to match the .contentintrobar .wrapper width (1170px) so every
   text block — intro paragraph, "The benefits of an SBA loan"
   heading, bullets — starts at the same left edge as the hero copy.
   ============================================================ */
.page-sba-loans .busines-contant-bar .wrapper2 {
    max-width: 1170px !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
}
.page-sba-loans .busines-contant-bar .subtext,
.page-sba-loans .busines-contant-bar .subtext .work_more,
.page-sba-loans .busines-contant-bar .subtext .info {
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.page-sba-loans .busines-contant-bar .subtext .work_more p,
.page-sba-loans .busines-contant-bar .subtext .work_more > *,
.page-sba-loans .busines-contant-bar .subtext .info > *,
.page-sba-loans .busines-contant-bar .subtext .info ul,
.page-sba-loans .busines-contant-bar .subtext .info ul li {
    margin-left: 0 !important;
    padding-left: 0 !important;
}
/* Bullets need their checkmark space restored after the blanket
   padding-left:0 above. */
.page-sba-loans .busines-contant-bar .subtext .info ul li {
    padding-left: 24px !important;
}
/* In case the page actually uses template-sba-loans.php (with
   .banner-bar wrapping the_content), neutralize the 580px right
   column so the intro paragraph sits at the same left edge. */
.page-sba-loans .banner-bar { height: auto !important; }
.page-sba-loans .banner-bar .subtext {
    display: block !important;
    justify-content: flex-start !important;
    max-width: 1170px !important;
    padding: 36px 15px !important;
    margin: 0 auto !important;
}
.page-sba-loans .banner-bar .subtext .wrapper {
    max-width: none !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ============================================================
   Money Smart Games + More Resources (tickets 868jkur4k, 868jmbg00)

   Template-smart-money wraps each section's content + button in
   <div class="has-text-align-center">. The page-wide rule on
   .work_more sets text-align:left, which correctly leaves the
   body paragraph left-aligned but ALSO drags the CTA button to
   the left. The user wants:
     - Header h3 + body copy: left-aligned, sharing the same left
       edge as each other.
     - "All Games" / "More Info" button: centered horizontally
       within the section.

   Fix:
     1. Keep .has-text-align-center text-align:left so the body
        paragraph stays left-aligned (matches the rest of the
        site copy treatment).
     2. Promote a.learnBtn to a block element with margin:0 auto
        so it centers regardless of the parent's text-align.
     3. Zero out any horizontal padding/margin on .work_more and
        its h3 so the heading sits flush with the body paragraph
        (the .padding-fix variant in the second section adds
        extra spacing that nudged the heading right of the body).
   ============================================================ */
.page-template-template-smart-money .busines-contant-bar .work_more,
.page-template-template-smart-money .busines-contant-bar.padding-fix .work_more {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.page-template-template-smart-money .busines-contant-bar .work_more h3,
.page-template-template-smart-money .busines-contant-bar.padding-fix .work_more h3 {
    text-align: left !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
}
.page-template-template-smart-money .busines-contant-bar .work_more .has-text-align-center,
.page-template-template-smart-money .busines-contant-bar.padding-fix .work_more .has-text-align-center {
    text-align: left !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}
/* Body paragraph (and any inline content) stays left. Only the
   button gets centered via block-level auto margins. */
.page-template-template-smart-money .busines-contant-bar .work_more .has-text-align-center > p {
    text-align: left !important;
}
.page-template-template-smart-money .busines-contant-bar .work_more .has-text-align-center > a.learnBtn,
.page-template-template-smart-money .busines-contant-bar.padding-fix .work_more .has-text-align-center > a.learnBtn {
    display: block !important;
    width: fit-content !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
}

/* ============================================================
   Apply for Your First Mortgage — center stacked hero buttons
   (ticket 868jkt90n)

   The earlier fix gave every .wp-block-button__link a min-width
   of 220px so "Loan Status" matches "Resume Application" — now
   that the buttons are evenly sized, the stack itself needs to
   sit centered (not left-aligned) under the heading. Center each
   .wp-block-button within .stacked_buttons so the three buttons
   share the same horizontal axis on the page.
   ============================================================ */
.stacked_buttons {
    text-align: center !important;
}
.stacked_buttons .wp-block-buttons {
    justify-content: center !important;
    align-items: center !important;
}
.stacked_buttons .wp-block-button {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
    width: 220px !important;
    max-width: 100% !important;
}
.stacked_buttons .wp-block-button .wp-block-button__link {
    display: block !important;
    margin: 0 auto !important;
}

/* ============================================================
   Business Online Banking — every section shares a single left
   edge (ticket 868jkvpxw)

   The page composes three wrappers stacked on top of each other:
     1. .inner-banner-bar > .wrapper2   (1230px, the hero image)
     2. .contentintrobar.reverse > .wrapper  (1170px, eyebrow + h1)
     3. .busines-contant-bar.treschild > .wrapper2  (overridden to
        1130px via style.css:3316; holds "Benefits of..." + bullets)

   Three different max-widths = three different left edges, which
   reads as "some sections look indented." Pin all three to the
   same 1170px / 15px-padding wrapper so every left edge lines up
   exactly. Then zero any residual h3/.info/.subtext padding so
   the heading and bullets land flush with that left edge.
   ============================================================ */
body.page-business-online-banking .inner-banner-bar > .wrapper,
body.page-business-online-banking .inner-banner-bar > .wrapper2,
body.page-business-online-banking #content-part .contentintrobar > .wrapper,
body.page-business-online-banking #content-part .contentintrobar > .wrapper2,
body.page-business-online-banking #content-part .contentintrobar.reverse > .wrapper,
body.page-business-online-banking #content-part .busines-contant-bar > .wrapper,
body.page-business-online-banking #content-part .busines-contant-bar > .wrapper2,
body.page-business-online-banking #content-part .busines-contant-bar.treschild > .wrapper2,
body.page-business-online-banking .get_started_bar > .wrapper,
body.page-business-online-banking .get_started_bar > .wrapper2 {
    max-width: 1170px !important;
    width: 100% !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}
.page-business-online-banking .contentintrobar .textbg,
.page-business-online-banking .contentintrobar.reverse .textbg {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.page-business-online-banking .busines-contant-bar.treschild .subtext,
.page-business-online-banking .busines-contant-bar.treschild .subtextintro,
.page-business-online-banking .busines-contant-bar.treschild .info {
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.page-business-online-banking .busines-contant-bar.treschild .info > h3,
.page-business-online-banking .busines-contant-bar.treschild .info > h3:first-of-type,
.page-business-online-banking .busines-contant-bar .subtext h3,
.page-business-online-banking .busines-contant-bar.treschild h3 {
    text-align: left !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
/* Bullets: keep the check-icon space but kill any left margin/padding
   on the <ul> itself so the icon column sits at the wrapper's left
   edge (matching the h3 above). */
.page-business-online-banking .busines-contant-bar .info > ul,
.page-business-online-banking .busines-contant-bar.treschild .info > ul {
    padding-left: 0 !important;
    margin-left: 0 !important;
}
/* ============================================================
   868jn1cd3 — Remove mountain illustration from testimonial
   slides globally. The .newtestimonials block uses
   assets/images/testline.png as a bottom-right background
   (mountains). Vallant doesn't use mountain imagery, so null
   the background-image everywhere it appears.
   ============================================================ */
.newtestimonials {
    background-image: none !important;
}

/* ============================================================
   868jkk5tw — Careers "What You Can Expect" section
   - Mountain bg already removed earlier (.page-careers
     .careers_what_can).
   - Type treatment: section heading + body copy currently
     render centered; the rest of the site uses left-aligned
     section intros. Left-align the heading + body + CTA.
   ============================================================ */
.page-careers .careers_what_can,
.page-careers .careers_what_can_content,
.page-careers .careers_what_can_content h1,
.page-careers .careers_what_can_content h2,
.page-careers .careers_what_can_content h3,
.page-careers .careers_what_can_content p {
    text-align: left !important;
}
.page-careers .careers_what_can_content .learnBtn,
.page-careers .careers_what_can_content .button,
.page-careers .careers_what_can_content a.learnBtn {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* ============================================================
   868jkqk2u — Online Banking ("/personal/online-banking-bill-pay/")
   double bullets. The Gutenberg <ul> rendered BOTH a CSS disc
   bullet AND the global .busines-contant-bar .info ul li:before
   checkmark, so each row showed two markers. Per the user's
   follow-up, the checkmark glyph itself wasn't showing in the
   first attempt — so we explicitly attach the checkmark via
   :before here (matches the standard site treatment used by
   .info ul li at style.css:1118-1121), and disable the disc.
   ============================================================ */
.page-online-banking-bill-pay .busines-contant-bar ul,
.page-online-banking-bill-pay .busines-contant-bar .subtext ul,
.page-online-banking-bill-pay .busines-contant-bar .info ul,
.page-online-banking-bill-pay .busines-contant-bar .work_more ul {
    list-style: none !important;
    list-style-type: none !important;
    padding: 0 0 30px 0 !important;
    margin-left: 0 !important;
}
.page-online-banking-bill-pay .busines-contant-bar ul li,
.page-online-banking-bill-pay .busines-contant-bar .subtext ul li,
.page-online-banking-bill-pay .busines-contant-bar .info ul li,
.page-online-banking-bill-pay .busines-contant-bar .work_more ul li {
    list-style: none !important;
    list-style-type: none !important;
    padding: 0 0 8px 24px !important;
    position: relative !important;
    font-size: 18px !important;
    color: #17215C !important;
    font-family: "Area Normal" !important;
    font-weight: 400 !important;
    line-height: 29px !important;
}
.page-online-banking-bill-pay .busines-contant-bar ul li:before,
.page-online-banking-bill-pay .busines-contant-bar .subtext ul li:before,
.page-online-banking-bill-pay .busines-contant-bar .info ul li:before,
.page-online-banking-bill-pay .busines-contant-bar .work_more ul li:before {
    content: "" !important;
    display: block !important;
    width: 13px !important;
    height: 15px !important;
    position: absolute !important;
    top: 9px !important;
    left: 0 !important;
    background: url(assets/images/check_icon.png) no-repeat !important;
}

/* Retirement Planning template: suppress the disc marker that
   the global #content-part .itembox .text ul rule re-enables.
   Without this, the disc stacks on top of the checkmark ::before
   icon, producing a double bullet. */
.page-retirement-planning #content-part .itembox .text ul,
.page-retirement-planning #content-part .itembox .text ul li,
.page-retirement-planning .busines-contant-bar .info ul,
.page-retirement-planning .busines-contant-bar .info ul li {
    list-style: none !important;
    list-style-type: none !important;
}

/* /branch-locations/ archive: page title sits above the tiles
   (no hero). Match the dark navy heading style used elsewhere and
   align with the visual left edge of the card grid (cards have
   21px margin from the wrapper edge). */
body.post-type-archive-locations .branch-locations-title {
    font-family: 'Area Extended', sans-serif;
    font-size: 32px;
    font-weight: 700;
    color: #17215C;
    text-align: left;
    margin: 40px 0 32px;
    padding-left: 21px;
}
@media (max-width: 767px) {
    body.post-type-archive-locations .branch-locations-title {
        font-size: 24px;
        margin: 24px 0 20px;
        padding-left: 15px;
    }
}

/* /branch-locations/ archive: card image styling. The shared
   .money_market_bar .item card pattern doesn't ship with an image
   slot, so add a contained, fixed-aspect image at the top of each
   branch card. */
body.post-type-archive-locations .branch-locations-archive .item .branch-card-image {
    display: block;
    width: 100%;
    margin-bottom: 16px;
    overflow: hidden;
    border-radius: 4px;
    aspect-ratio: 16 / 10;
    background: #f0f0f0;
}
body.post-type-archive-locations .branch-locations-archive .item .branch-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
body.post-type-archive-locations .branch-locations-archive .item h3 a {
    color: inherit;
    text-decoration: none;
}

/* Retirement Calculator template: left-align all blocks, center the
   "View Locations" CTA, and tighten the very large vertical gaps the
   default template was leaving on desktop and mobile. */
body.page-template-template-retirement-calculator .busines-contant-bar.retirement .image,
body.page-template-template-retirement-calculator .busines-contant-bar.retirement .image h2,
body.page-template-template-retirement-calculator .busines-contant-bar.retirement .image > * {
    text-align: left !important;
}
body.page-template-template-retirement-calculator .busines-contant-bar.retirement .buttons {
    text-align: center !important;
}
/* Flush the .intro to the left edge of the wrapper (it carried a
   85px left margin + 930px max-width that pushed the body paragraph
   way right of the heading + bullets below). */
body.page-template-template-retirement-calculator .busines-contant-bar.retirement .intro {
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
/* Tighten the vertical rhythm: hero had margin-bottom:110px and the
   bar had padding-top:92px (202px total gap before content). Cut to
   ~40px each so the page doesn't feel hollow. */
body.page-template-template-retirement-calculator .inner-banner-bar {
    margin-bottom: 40px !important;
}
body.page-template-template-retirement-calculator .busines-contant-bar.retirement {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}
body.page-template-template-retirement-calculator .busines-contant-bar.retirement .intro,
body.page-template-template-retirement-calculator .busines-contant-bar.retirement .subtext,
body.page-template-template-retirement-calculator .busines-contant-bar.retirement .image {
    margin-bottom: 24px !important;
    padding-bottom: 0 !important;
}

/* Money Smart Games: header copy was sitting 20px right of body copy
   because .contentintrobar .wrapper is 1130px globally while the
   .busines-contant-bar .wrapper is 1170px. Widen the hero wrapper
   on this page so the eyebrow + h1 align flush with the body
   paragraph below. */
body.page-money-smart-games .contentintrobar .wrapper {
    max-width: 1170px !important;
}

body.page-buy-a-home .contentintrobar.reverse.graybg {
    padding-bottom: 30px !important;
}
body.page-buy-a-home .mortgage_contant_bar {
    box-shadow: none !important;
}
@media (max-width: 1023px) {
    html body.page-buy-a-home section.inner-banner-bar[style] {
        background-position: 55% center !important;
    }
    body.page-buy-a-home .estimate_bar .sub h2 {
        line-height: 1.2 !important;
        text-wrap: balance;
    }
    body.page-buy-a-home .estimate_bar .sub p {
        text-wrap: balance;
    }
    body.page-buy-a-home .process_bar.mortgagechild .contact h3 {
        margin-right: 20px !important;
    }
    body.page-buy-a-home .process_bar.mortgagechild .contact h3:after {
        border-top-width: 37px !important;
        border-bottom-width: 37px !important;
    }
}
body.page-template-template-business-loans-child .busines-contant-bar.loans {
    padding-bottom: 30px !important;
}
body.page-template-template-business-loans-child .money_market_bar.get_started_bar {
    padding-top: 40px !important;
}

/* Credit Card comparison tables: previously the entire .compare-accounts
   container was a uniform light gray, making rows indistinguishable.
   Match the Pinnacle pattern: gray top row (card image + name) over
   white feature row. The container itself drops its background so the
   .column-top / .column-bottom backgrounds read as alternating bands. */
.compare-accounts { background-color: transparent !important; }
.compare-accounts .column-top { background-color: #F0F0F0 !important; }
.compare-accounts .column-bottom { background-color: #FFFFFF !important; }

/* Branch location pages (mobile + iPad): on narrow viewports the page
   title should sit BELOW the hero photo on a white panel, not overlaid
   on the image. Render the photo as a fixed 250px banner at the top
   (right-aligned so the right-side subject — e.g. the Gainesville
   Midland train car — stays in view), then let the .wrapper2 with the
   eyebrow + title flow normally on a white background beneath it,
   left-aligned to match the body copy below (15px gutter).
   Desktop keeps its existing in-flow layout. */
@media (max-width: 1023px) {
    html body.single-locations section.inner-banner-bar {
        min-height: 0 !important;
        height: auto !important;
        padding-top: 250px !important;
        background-size: auto 250px !important;
        background-repeat: no-repeat !important;
        background-position: right top !important;
        margin-bottom: 0 !important;
    }
    html body.single-locations section.inner-banner-bar .wrapper2 {
        position: static !important;
        background: #fff !important;
        padding: 16px 15px !important;
        max-width: none !important;
        margin: 0 !important;
    }
    html body.single-locations section.inner-banner-bar .wrapper2 .text {
        position: static !important;
        padding: 0 !important;
        margin: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        max-width: none !important;
        text-align: left !important;
    }
    html body.single-locations section.inner-banner-bar .wrapper2 .text .inner,
    html body.single-locations section.inner-banner-bar .wrapper2 .text .inner h1,
    html body.single-locations section.inner-banner-bar .wrapper2 .text .inner h2,
    html body.single-locations section.inner-banner-bar .wrapper2 .text .inner h3,
    html body.single-locations section.inner-banner-bar .wrapper2 .text .inner h4,
    html body.single-locations section.inner-banner-bar .wrapper2 .text .inner h5,
    html body.single-locations section.inner-banner-bar .wrapper2 .text .inner .subtitle {
        padding: 0 !important;
        margin: 0 !important;
        text-align: left !important;
        color: #17215C !important;
    }
    html body.single-locations section.inner-banner-bar .wrapper2 .text .inner::after {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/* Mobile + iPad hero crop: shift the focal point slightly past center
   (70% from the left) so right-of-center subjects on most banner photos
   stay in view at narrow viewports without overshooting to the right
   edge. Selectors use `body[class] section.inner-banner-bar`
   (specificity 0-2-1) to outrank the global modifier-class rule that
   sets background-position: center !important on the same element.
   Pages whose subject sits left of center get a per-page override. */
@media (max-width: 1023px) {
    body[class] section.inner-banner-bar {
        background-position: 70% center !important;
    }
    /* Mobile Alerts hero: the man with phone sits left of center on
       the source photo — anchor at 30% so he stays in view. */
    body.page-mobile-alerts section.inner-banner-bar {
        background-position: 30% center !important;
    }
}

/* Mobile: the comparison grid is wider than the viewport (label + 2 card
   columns ~= 600px). Without horizontal scroll, the rightmost cards are
   cut off. Allow the container to scroll horizontally on touch devices. */
@media (max-width: 767px) {
    .compare-accounts {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* ============================================================
   868jn1b6y — Sticky footer on short pages (global).
   The site DOM (verified from header.php / footer.php) is:
     <body>
       <section id="wrapper">
         <header id="header-part">…</header>
         …page template content (variable structure)…
         <footer id="footer-part">…</footer>
       </section>
     </body>
   The earlier attempt targeted `body > footer.site-footer` and
   `body > .footer-news` — neither exists in this theme, so the
   rule was a no-op and the footer still floated mid-viewport on
   short pages like /privacy-policies/.

   Correct pattern for this DOM: promote #wrapper to the flex
   column (not body — body is left alone so other plugins'
   scripts that assume body is a normal block continue to work).
   #wrapper gets min-height:100vh so it always fills the
   viewport; the footer gets margin-top:auto so any remaining
   vertical space goes ABOVE the footer.
   ============================================================ */
html, body {
    height: auto !important;
    min-height: 100% !important;
    margin: 0 !important;
}
section#wrapper {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100vh !important;
}
section#wrapper > footer#footer-part {
    margin-top: auto !important;
}

/* ============================================================
   QA correction batch — 2026-05-15
   Browser QA caught 4 pages where earlier fixes either targeted
   the wrong selector or overcorrected. Each ticket below records
   the exact measurement that drove the new rule.
   ============================================================ */

/* 868jkvg0v — SBA Loans intro alignment.
   Measured at 1353px viewport (admin bar logged in):
     .contentintrobar .wrapper (1130px)  → text at 126.5px
     .mortgage_contant_bar .wrapper (1170px) → h2 at 126.5px ✓
     .mortgage_contant_bar .subtext (padding-left: 20px) → text at 106.5px ✗ (20px left)
   The two wrappers are different widths but with different inner
   paddings the h2 lands correctly. The .subtext rule from earlier
   added padding-left:20px which moved the body 20px LEFT of the
   wrapper edge instead of matching the hero. Zero out the subtext
   padding so it sits flush with the wrapper, then widen the hero
   wrapper on this page to 1170px so both share the same outer
   position. Net result: hero h2, mortgage h2, and intro body all
   start at the same X. */
body.page-sba-loans .contentintrobar .wrapper {
    max-width: 1170px !important;
}
body.page-sba-loans .mortgage_contant_bar .subtext {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* 868jku3u8 — Business Mobile Banking intro alignment.
   Measured at 1353px viewport:
     .contentintrobar .wrapper (1130px) → text at 126.5px
     .mobile_content_bar .wrapper (1270px) → its content at 56.5px ✗
     .mobile_content_bar .sub_using → text at 56.5px ✗
   The mobile_content_bar wrapper is wider than the hero, so even
   with .sub_using stretched edge-to-edge the body sits ~70px left
   of the hero. Match the mobile_content_bar wrapper to 1170px so
   it aligns with the hero, AND widen the hero to 1170 (so the page
   has one consistent column width). */
body.page-business-mobile-banking .contentintrobar .wrapper,
body.page-id-15780 .contentintrobar .wrapper {
    max-width: 1170px !important;
}
body.page-business-mobile-banking .mobile_content_bar > .wrapper,
body.page-id-15780 .mobile_content_bar > .wrapper {
    max-width: 1170px !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
}
body.page-business-mobile-banking .mobile_content_bar .sub_using,
body.page-id-15780 .mobile_content_bar .sub_using,
body.page-business-mobile-banking .banking_bar > .wrapper2,
body.page-id-15780 .banking_bar > .wrapper2 {
    max-width: 1170px !important;
    margin: 0 auto !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    text-align: left !important;
}

/* 868jm98k2 — Financial Advice / Highland Trust body left-align.
   Measured at 1353px viewport (admin bar):
     .contentintrobar h2 → 126.5px
     .intro p ("Our customers deserve...") → 211.5px ✗ (85px right)
   The page uses .intro (not the investchild .work_more I targeted
   earlier). Zero out .intro padding and max-width so it sits flush
   with the wrapper. The .intro is the outer container for the
   body paragraph plus the disclaimer p. */
body.page-financial-advice .intro,
body.page-financial-advice .intro > *,
body.page-financial-advice .intro p {
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: left !important;
}

/* 868jk8eqg / 868jku6wn — Credit Cards button row alignment.
   QA showed Apply Now buttons not horizontally aligned across
   columns in the same data-row because subgrid syncs row heights
   but the .bottom-buttons inside each column-bottom is positioned
   statically with margin-top: 0 (some upstream rule wins
   specificity). Use grid layout INSIDE column-bottom: make it a
   2-row mini-grid where the first row gets the features and the
   second row gets the buttons aligned to the row's bottom.
   Simpler: explicitly set margin-top: auto via a higher-specificity
   selector. */
.page-template-template-personal-credit-card .compare-accounts .wrapper2 .column-item > .column-bottom .bottom-buttons,
.page-template-template-business-and-commercial-credit-card .compare-accounts .wrapper2 .column-item > .column-bottom .bottom-buttons,
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 .column-item > .column-bottom .bottom-buttons {
    margin-top: auto !important;
    padding-top: 24px !important;
    width: 100% !important;
    text-align: center !important;
}
/* The column-bottom must be a flex column with a stretchy gap so
   margin-top: auto on .bottom-buttons can push it to the bottom.
   Force the parent to flex column unconditionally, kill the
   subgrid's natural fit-content sizing on children before
   .bottom-buttons. */
.page-template-template-personal-credit-card .compare-accounts .wrapper2 .column-item > .column-bottom,
.page-template-template-business-and-commercial-credit-card .compare-accounts .wrapper2 .column-item > .column-bottom,
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 .column-item > .column-bottom {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    height: 100% !important;
}

/* ============================================================
   868jku6wn — Credit Cards table follow-up.
   User said "the table is different but still not right." After
   the row-height/button-alignment fixes, the remaining visual
   defect was that the card image + card NAME stuck to the TOP
   of column-top while the row-height was forced taller (subgrid
   syncs to the tallest column in the row). That left a big empty
   gap under the card name, so the card NAME appeared visually
   adjacent to the "Card Features" label in the next row instead
   of being grouped with its own card image and "Credit Cards"
   label.

   Fix: vertically center the card-name block (image + h4) inside
   column-top, and vertically center the "Credit Cards" /
   "Card Features" h6 labels inside their cells so each row's
   content sits in the middle of its row band rather than at the
   top edge. Reduce h4 margin-top so the name nests snug under
   the image as a single group.
   ============================================================ */
.page-template-template-personal-credit-card .compare-accounts .column-item > .column-top,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item > .column-top {
    justify-content: center !important;
}
/* Label cells (col 1 of each data-row) — vertically center the
   h6 in both the top and bottom cells so the labels visually
   pair with their respective rows. */
.page-template-template-personal-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-top,
.page-template-template-personal-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-bottom,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-top,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-bottom,
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 .column-item:nth-child(4n+1) > .column-top,
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 .column-item:nth-child(4n+1) > .column-bottom {
    justify-content: center !important;
}
/* Snug the card name directly under the card image so they read
   as one group, regardless of how much empty vertical room the
   subgrid hands the cell. */
.page-template-template-personal-credit-card .compare-accounts .column-item .card-name,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item .card-name {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 8px !important;
}
.page-template-template-personal-credit-card .compare-accounts .column-item .card-name img,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item .card-name img {
    margin: 0 auto !important;
}
.page-template-template-personal-credit-card .compare-accounts .column-item .card-name h4,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item .card-name h4 {
    margin: 0 !important;
}

/* ============================================================
   868jku6wn follow-up #2 — Credit Cards label column.
   User screenshot from /business/credit-cards-2/ shows the
   horizontal divider line (border-bottom on column-top, border
   between top and bottom rows of the subgrid) cutting through
   the empty label column, leaving "Credit Cards" stranded
   in the top half with an awkward mid-cell line and a visually
   empty bottom half. The dividers belong on the CARD columns
   to delineate the comparison cells; on the LABEL column they
   add no information and create a broken-cell appearance.

   Fix: hide the inter-row divider on every label cell (both
   3-col personal/business basic compare and the 4-col commercial
   compare) and the vertical right border between the label and
   the first card column. Keep the outer borders that bound the
   whole grid.
   ============================================================ */
/* Position the label text near the TOP of each cell (instead of
   centered) so "Credit Cards" sits roughly next to the card
   image and "Card Features" sits next to the start of the
   features list — mimicking the row-label pattern. The horizontal
   divider between top/bottom on the label column IS kept (it
   matches the divider on the card columns and reads as a clean
   row separation). */
.page-template-template-personal-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-top,
.page-template-template-personal-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-bottom,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-top,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-bottom,
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 .column-item:nth-child(4n+1) > .column-top,
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 .column-item:nth-child(4n+1) > .column-bottom {
    justify-content: flex-start !important;
    padding-top: 40px !important;
}
/* Remove any vertical line on the LEFT edge of the table.
   The grid was never given an explicit border-left, but the
   user's screenshot from /business/credit-cards-2/ shows a thin
   vertical line just left of the "Credit Cards" label. Belt and
   suspenders: explicitly zero out any border-left on the label
   column-item, its column-top, its column-bottom, and the grid
   container itself. */
.page-template-template-personal-credit-card .compare-accounts,
.page-template-template-personal-credit-card .compare-accounts .wrapper2,
.page-template-template-business-and-commercial-credit-card .compare-accounts,
.page-template-template-business-and-commercial-credit-card .compare-accounts .wrapper2,
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3,
.page-template-template-personal-credit-card .compare-accounts .column-item:nth-child(3n+1),
.page-template-template-personal-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-top,
.page-template-template-personal-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-bottom,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item:nth-child(3n+1),
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-top,
.page-template-template-business-and-commercial-credit-card .compare-accounts .column-item:nth-child(3n+1) > .column-bottom,
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 .column-item:nth-child(4n+1),
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 .column-item:nth-child(4n+1) > .column-top,
.page-template-template-business-and-commercial-credit-card .compare-accounts.column-3 .column-item:nth-child(4n+1) > .column-bottom {
    border-left: none !important;
    box-shadow: none !important;
    outline: none !important;
}

/* ============================================================
   868jkvpxw — Business Online Banking spacing follow-up.
   Earlier fix aligned every section to the same 1170px left edge.
   QA showed two oversized vertical gaps remain:
     1. Between the hero h1 ("Streamline cash management...") and
        the "Benefits of a Business Online banking account" h3
        — sum of .contentintrobar bottom padding + .busines-contant-bar
        top padding.
     2. Between the h3 and the first checkmark bullet
        — .work_more h3 bottom margin + ul top padding.
   Halve both so the heading reads as a label for the bullets
   directly below it rather than as a free-floating subhead.
   ============================================================ */
body.page-business-online-banking #content-part .contentintrobar,
body.page-business-online-banking #content-part .contentintrobar.reverse {
    padding-bottom: 24px !important;
}
body.page-business-online-banking #content-part .busines-contant-bar,
body.page-business-online-banking #content-part .busines-contant-bar.treschild {
    padding-top: 24px !important;
}
body.page-business-online-banking .busines-contant-bar .info > h3,
body.page-business-online-banking .busines-contant-bar.treschild .info > h3,
body.page-business-online-banking .busines-contant-bar .subtext h3,
body.page-business-online-banking .busines-contant-bar.treschild h3 {
    margin-bottom: 12px !important;
    padding-bottom: 0 !important;
}
body.page-business-online-banking .busines-contant-bar .info > ul,
body.page-business-online-banking .busines-contant-bar.treschild .info > ul,
body.page-business-online-banking .busines-contant-bar .work_more ul {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Contact-us button rebuild (868jkvpxw) lives in
   assets/css/custom.css — it loads AFTER style.css and is the only
   place where the cascade actually settles. Keep the earlier
   style.css rules in place above for completeness/history. */

/* ============================================================
   868jkqk2u follow-up — Online Banking & Bill Pay: add a small
   amount of breathing room between the "It's that easy!..."
   heading and the first checkmark bullet. The earlier rule
   zeroed ul padding to align the checkmarks with the wrapper
   left edge; reintroduce ONLY top spacing (the left padding
   stays zero so the checkmark column stays at the edge).
   ============================================================ */
.page-online-banking-bill-pay .busines-contant-bar ul,
.page-online-banking-bill-pay .busines-contant-bar .subtext ul,
.page-online-banking-bill-pay .busines-contant-bar .info ul,
.page-online-banking-bill-pay .busines-contant-bar .work_more ul {
    padding-top: 18px !important;
    margin-top: 0 !important;
}

/* --- External Transfers (page-id 2964) — strip video letterboxing & add 5px blue border --- */
.page-id-2964 video,
.page-id-2964 figure.wp-block-video video,
.page-id-2964 .wp-video video,
.page-id-2964 .new_video_embed video {
    width: auto !important;
    max-width: 100%;
    height: auto !important;
    display: block;
    margin: 0 auto;
    background: transparent;
    border: 5px solid #31D0FF;
    box-sizing: border-box;
}
.page-id-2964 figure.wp-block-video,
.page-id-2964 .wp-video {
    background: transparent;
    text-align: center;
}
.coming-soon-section { padding: 90px 20px 120px; text-align: center; background: #fff; }
.coming-soon-section .coming-soon-inner { max-width: 760px; margin: 0 auto; }
.coming-soon-section .coming-soon-title { font-family: 'Area Extended', sans-serif; font-weight: 800; font-size: 48px; line-height: 1.15; letter-spacing: 1.44px; color: #17215C; text-transform: none; margin: 0 0 24px; padding: 0; }
.coming-soon-section .coming-soon-copy { font-family: 'Area Normal', sans-serif; font-weight: 400; font-size: 18px; line-height: 1.6; color: #17215C; margin: 0; padding: 0; }
@media (max-width: 767px) { .coming-soon-section { padding: 60px 20px 80px; } .coming-soon-section .coming-soon-title { font-size: 32px; letter-spacing: 0.96px; } }