/*Nav*/
.mod-navigation-icon::before, .mod-navigation-icon:before, .mod-navigation-icon::after, .mod-navigation-icon:after {
filter: invert(1);
}

.mod-navigation-section {
    height: 6em;
}
@media screen and (min-width:1200px){
.home .mod-navigation, .home .mod-collapsed-navigation {
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
    background:white;
}
}

.mod-navigation-center {
    min-height: 6em;
}
@media screen and (min-width:1200px){
.mod-navigation-link-wrap {
    position: static;
    display: inline-table;
    vertical-align: middle;
    max-width: 100%;
    width: auto;
    height: 6em;
    table-layout: fixed;
}
}

@media screen and (max-width: 1200px) {
    .mod-navigation-link-wrap {
        background: #595959;
    }

    .mod-navigation-link mod-navigation-link-parent mod-navigation-haschildren{
        color:black;
    }

    a#nav-item0-child0{
        color:black;
    }

    a#nav-item0-child2 {
        color:black;
}
    a#nav-item0-child3 {
        color:black;
}

    a#nav-item0-child4 {
        color:black;
}

    a#nav-item0-child6 {
        color:black;
}

    a.mod-navigation-link.mod-navigation-mobile-only.mod-navigation-root-link{
        color:black;
    }
}

@media screen and (max-width: 1200px) {
    .mod-navigation-section.mod-navigation-section-short .mod-navigation-link-parent, .mod-navigation-section.mod-navigation-section-short:hover .mod-navigation-link-parent, .mod-navigation-section.mod-navigation-section-short:focus .mod-navigation-link-parent {
        background: #595959;
        color: #fff;
    }
}

@media screen and (max-width: 1200px) {
    .mod-navigation-open .mod-navigation-link-wrap {
        display: block;
        height: 100%;
    }

    .mod-navigation-group {
    background: white;
}

.mod-navigation-link mod-navigation-mobile-only mod-navigation-root-link{
    color:black;
}
}

@media screen and (max-width: 400px) {
.mod-navigation-logo-v9 img {
    width: 65%;
    object-fit: contain;
}
}

@media screen and (max-width: 350px) {
.mod-navigation-logo-v9 img {
    width: 50%;
    object-fit: contain;
}
}

@media screen and (max-width: 310px) {
.mod-navigation-logo-v9 img {
    width: 40%;
    object-fit: contain;
}
}

@media screen and (max-width: 1200px) {
    .mod-navigation-logo-wrap {
        left: calc(50% - 13em / 2);
        overflow: visible;
    }
}

.mod-fdic-logo.mod-fdic-logo--mobile {
    width: 158%;
    overflow: visible;
}

@media screen and (max-width: 500px) {
.mod-fdic-logo.mod-fdic-logo--mobile {
    width: 130%;
}

.mod-navigation-logo-wrap{

    width: 11em;
}

}

@media screen and (max-width: 1200px) {
    .mod-navigation-logo-wrap {
        left: calc(50% - 12em / 2);
        overflow: visible;
    }
}

@media screen and (max-width: 350px) {
.mod-fdic-logo.mod-fdic-logo--mobile {
    width: 110%;
}
}

@media screen and (max-width: 300px) {
.mod-fdic-logo.mod-fdic-logo--mobile {
    width: 100%;
}
}
/*Login Button*/
@media screen and (min-width: 1201px) {
    .home .mod-hero-rotator .mod-navigation-login-title {
        font-size: 1.5em;
        line-height: 1.13em;
        font-weight: 700;
        text-align: center;
        color: #4f4f4f;
    }
}

@media screen and (min-width: 1201px) {
    .home .mod-hero-rotator .mod-navigation-login-title::before, .home .mod-hero-rotator .mod-navigation-login-title:before {
        color: #4f4f4f;
    }
}

.mod-navigation-login-submit {
    padding: 1.2em 2em;
    font-size: .9em;
    line-height: 1.5em;
    color: white;
    text-align: center;
    background: #800000;
    border-radius: 3px;
}

.mod-navigation-login-submit:hover, .mod-navigation-login-submit:focus {
    background: #b60000;
    color: white;
}

@media screen and (max-width: 1200px) {
    .home .mod-navigation-login-link {
        background: #800000;
    }
}

@media screen and (max-width: 1200px) {
    .home .mod-navigation-login .mod-navigation-login-link:hover, .home .mod-navigation-login .mod-navigation-login-link:focus, .home .mod-navigation-login-link:hover, .home .mod-navigation-login-link:focus {
    background: #b60000;
    }
}

/*Login Button*/
.mod-navigation-login-link {
    background: #800000;
    color: white;
}

.mod-navigation-login-link:hover, .mod-navigation-login-link:focus {
    background: #b60000;
}

.mod-navigation-login-link:before, .mod-navigation-login-link::before {
    color: #ffffff;
}

/*Footer*/
.mod-footer-column-title, p.mod-footer-column-title, a.mod-footer-column-title, .mod-footer-column-title a {
    color: #000000;
}

.column-footer .mod-footer-column p, .column-footer .mod-footer-column a, .column-footer .mod-footer-column .mod-footer-column-title {
    font-size: .75em;
}

@media screen and (max-width: 600px) {
.column-footer .mod-footer-column p, .column-footer .mod-footer-column a, .column-footer .mod-footer-column .mod-footer-column-title {
    font-size: 0.65em;
}
}

@media screen and (max-width: 1000px) {
    .mod-footer-column-wrap {
        padding: 1.5em 0;
        display: flex;
        flex-direction: column;
    }

    .column-footer .mod-footer-column {
    width: 100%;
}
}

/*Main Promo*/
.mod-hero-vertical-center {
    filter: drop-shadow(1px 3px 6px black);
}

.mod-hero-button {
    color: white;
    background: rgb(128, 0, 0);
}

.mod-hero-button:hover, .mod-hero-button:focus {
    background: rgb(182, 0, 0);
}

@media screen and (min-width: 1200px) {
.mod-hero-vertical-center{
    left: 60%;
}
}

.mod-hero-rotator-slide-overlay {
    background: #161616;
}

img.mod-hero-image.fit-in-frame {
    object-fit: cover;
    width: 100%;
    height: 400px;
}

.mod-hero-headline {
    font-size: 2em;
    line-height: 1.2em;
    color: #fff;
    font-family: 'Montserrat';
    font-weight: bold;
}

.mod-hero-subline {
    font-size: 1em;
    font-weight: 300;
    line-height: 1.2em;
    color: #fff;
    font-family: "Livvic", sans-serif;
}

.home .adminCollapsed .mod-navigation, .home .adminOpen .mod-navigation, .home .adminCollapsed .mod-collapsed-navigation, .home .adminOpen .mod-collapsed-navigation {
    padding-left: 45px;
    background: white;
}

@media screen and (min-width: 1201px) {
    .mod-navigation-link {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100%;
        font-family: 'Montserrat';
        color: black;
        font-size: .75em;
        font-weight: 300;
    }
}

/*Small Promo*/
.mod-tile-wrap-outer {
    background: #f8f9fa;
}

.mod-tile-body {
    font-family: "Livvic", sans-serif;
}

.mod-tile {
    background: #f8f9fa;
}

.mod-tile-wrap-horiz .mod-tile-image-wrap .mod-tile-image {
    position: absolute;
    display: block;
    max-width: none;
    min-width: auto;
    width: 10%;
    max-height: none;
    min-height: 25%;
    object-fit: cover;
}

.mod-tile-headline {
    padding: 0 0 .25em 0;
    font-size: 1em;
    line-height: 1em;
    color: #414141;
    font-family: 'Montserrat';
}

.mod-tile-wrap-horiz .mod-tile-image-wrap {
    position: relative;
    display: block;
    width: 100%;
    height: 5em;
    overflow: hidden;
}

.mod-tile-wrap {
    margin: 0em 12%;
    width: auto;
}

.mod-tile {
    padding: 3.5em 4.2em;
}

@media screen and (max-width: 1000px) {
    .mod-tile-wrap-horiz .mod-tile, .mod-tile-wrap-horiz .mod-tile:nth-child(n+3) {
        display: block;
        width: 100%;
    }
}

/*Custom Mobile Area*/
.promo-section-wrapper {
    margin: 1em;
}

/* === GENERAL CONTAINERS AND BASE STYLES === */
.promo-section-wrapper {
    padding: 20px;
    max-width: 100%;
    margin: 0em 16%;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.large-header-box {
    text-align: center;
    font-size: 2em;
    font-weight: bold;
}
.large-text-box {
    width: 100%;
    background-color: white;
    padding: 15px;
    font-size: 1.1rem;
    line-height: 1.4;
    flex-grow: 1; 
}
.large-text-box p {
    margin: 0;
}

.promo-logo-box {
    width: 100px; 
    height: 100px; 
    flex-shrink: 0; 
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-weight: bold;
}

.app-icon {
    width: 10em;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 0.9rem;
    cursor: pointer;
}
.app-store-container {
    display: flex;
    gap: 10px;
}


.promo-header-row {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    
}

.promo-features-row {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 1em 1em;
}

.promo-bottom-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
    flex-direction: column;
}


.feature-item {
    display: flex;
    align-items: flex-start; 
    gap: 10px;
    flex: 1 1 30%; 
}
.feature-icon {
    width: 30px;
    height: 30px;
    flex-shrink: 0;
}
.feature-text {
    font-size: 0.95rem;
    line-height: 1.2;
}

@media (max-width: 800px) {
    .promo-section-wrapper {
        align-items: center;
        text-align: center;
        padding: 15px;
    }
    
    .promo-header-row {
        flex-direction: column;
        align-items: center;
        width: 100%;
    }
    
    .large-text-box {
        width: 100%; 
        order: 1; 
    }

    .promo-logo-box {
        order: 0; 
        margin-bottom: 15px;
    }
    
    .promo-features-row {
        flex-direction: column;
        align-items: flex-start; 
        width: 100%;
        gap: 15px;
    }
    .feature-item {
        width: 100%;
    }
    
    .promo-bottom-row {
        flex-direction: column;
        align-items: center;
        width: 100%;
    }
    .app-store-container {
        margin-top: 15px; 
        flex-direction: column;

    }

    .app-icon{
        width: 100%;
    }
}

/*Custom Area - Why Bank Locally*/
.bank-local-div {
    width: 60%;
    padding: 1em 0em;
}

.image-local-div {
    width: 33%;
    display: flex;
    flex-direction: column;
    align-content: center;
    align-items: center;
    justify-content: center;
    padding: 2em 0em;
}

.why-bank-locally {
    display: flex;
    flex-direction: row;
    margin: 0em 16%;
    justify-content: space-between;
}

.header-local {
    text-align: center;
    font-size: 1.5em;
    font-weight: 600;
    padding: .5em 0em;
}

button.CTA-Button {
    background: #a49876;
    border: none;
    color: white;
    padding: .5em .5em;
    border-radius: .5em;
    font-size: .75em;
    font-weight: bold;
}

/*Phone Section*/
.promo-section-container {
            font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
            background-color: #f8f9fa;
            padding: 60px 20px;
            display: flex;
            justify-content: center;
            overflow: hidden;
        }
        .promo-content-wrapper {
            max-width: 1200px;
            width: 100%;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            gap: 60px;
        }
        .promo-left-phone {
            flex: 1;
            display: flex;
            justify-content: flex-end;
            align-items: center;
        }
        .phone-visual {
            max-width: 100%;
            height: auto;
            max-height: 550px;
            filter: drop-shadow(0 15px 30px rgba(0,0,0,0.1));
        }
        .promo-right-content {
            flex: 1;
            display: flex;
            flex-direction: column;
            gap: 20px;
            text-align: left;
            justify-content: center;
        }

.promo-header {
font-size: 1.5em;
font-weight: 800;
color: #1a1a1a;
margin: 0;
line-height: 1.1;
font-family: 'Montserrat';  
}

.promo-text {
    font-size: 1em;
    color: #4a4a4a;
    line-height: 1.6;
    margin: 0;
    max-width: 100%;
    font-family: "Livvic", sans-serif;
}

        .app-store-row {
            display: flex;
            flex-direction: row;
            gap: 15px;
            margin-top: 10px;
        }
        .store-button {
            height: 48px;
            display: inline-block;
            transition: transform 0.2s ease, opacity 0.2s;
        }
        .store-button:hover {
            transform: scale(1.03);
            opacity: 0.9;
        }
        .store-button img {
            height: 100%;
            width: auto;
            display: block;
        }
        @media (max-width: 850px) {
            .promo-content-wrapper {
                flex-direction: column;
                text-align: center;
                gap: 40px;
            }
            .promo-left-phone {
                justify-content: center;
                width: 100%;
            }
            .promo-right-content {
                align-items: center;
                text-align: center;
                width: 100%;
            }
            .app-store-row {
                justify-content: center;
            }
            .promo-header {
                font-size: 2.2rem;
            }
        }

img.phone-visual {
    width: 33em;
}

.promo-content-wrapper {
    display: flex;
    justify-content: center;
}

/*Locations Section, Home*/
.banner-hero {
  background-image: linear-gradient(rgba(0,0,0,.7), rgba(0,0,0,.7)), url('/assets/images/NoCrop_900x1200/f399cc96c4cd493fa6d46e3372710299.jpg');
  background-size: cover;
  background-position: center;
  height: 250px; 
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: white;
  text-align: center;
}

a.btn-dark-red {
    background: #800000;
    padding: .5em 2em;
    margin: 1em;
    color: white;
    text-decoration: none;
    transition: transform 0.4s ease, opacity 0.2s;
    border-radius: .5em;
    display: flex;
    justify-content: center;
}

a.btn-dark-red:hover {
    transform: scale(1.03);
    opacity: 0.9;
    background: #b90000;
}

h2.Location-Header {
    font-family: 'Montserrat';
    font-weight: bold;
}

.card-container {
  display: flex;
  justify-content: center;
  gap: 30px;
  flex-wrap: wrap;
  padding: 20px;
}

.card {
  width: 300px;
  text-align: left;
}

/* The Main Square Image */
.card-img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  margin-bottom: 15px;
}

/* Custom Icon Styling */
.custom-icon {
  width: 24px;   /* Adjust this to make your icons larger or smaller */
  height: 24px;
  object-fit: contain;
  flex-shrink: 0; /* Prevents icon from squishing */
}

.info-block {
  display: flex;
  align-items: flex-start;
  gap: 15px;
  margin-bottom: 12px;
  color: #333;
}

.info-link {
  text-decoration: none;
}

/*Footer*/

.mod-footer-column, .column-footer .mod-footer-column {
    width: 33%;
}

@media screen and (max-width:800px){
.mod-footer-column, .column-footer .mod-footer-column {
    width: 100%;
}
}

.mod-footer-wrap {
    padding: 0;
    font-size: 20px;
    background: #d7d7d7;
}

/*Non Home Page*/
.subheading {
    display: block;
    padding: 0 0 .5em 0;
    font-size: 1em;
    font-weight: 300;
    line-height: 1.2em;
    color: #353535;
    font-family: 'Montserrat';
}

.mod-navigation, .mod-collapsed-navigation {
    background: #ffffff;
    text-align: right;
}
.mod-content-image-banner {
    background: #1a1a1a;
}

.mod-content-image-headline {
    font-size: 2em;
    font-weight: 500;
    line-height: 1.2em;
    color: #fff;
    font-family: 'Montserrat';
    text-align: start;
}

ul li::before, ul li:before {
    content: '';
    position: absolute;
    display: block;
    width: .5em;
    height: .5em;
    top: .8em;
    left: .8em;
    background: #800000;
    border-radius: 50%;
}

p.p {
    font-family: "Livvic", sans-serif;
}

p {
    font-family: "Livvic", sans-serif;
}

.mod-safe-area {
    padding: 0em;
}

.h1style, h1 {
    font-size: 2.5em;
    font-weight: bold;
    color: #202020;
    font-family: 'Montserrat';
}
.h2style, h2 {
    font-size: 1.25em;
    font-weight: bold;
    color: #202020;
    font-family: 'Montserrat';
}
.h3style, h3 {
    font-size: 1em;
    font-weight: bold;
    color: #202020;
    font-family: 'Montserrat';
}

h2.mod-content-image-subheadline {
    font-weight: 200;
    font-size: 1em;
    text-align: start;
}

/*Collpaing Section*/
.expanded .mod-expanding-trigger, .no-js .mod-expanding-trigger {
    padding: .43em .9em;
    font-size: 1em;
    line-height: 1.2em;
    color: #fff;
    background: #800000;
    font-family: 'Montserrat';
}

.mod-expanding-trigger {
    padding: .43em .9em;
    font-size: 1em;
    line-height: 1.2em;
    color: #fff;
    background: #6b6b6b;
    font-family: 'Montserrat';
}

.expanded .mod-expanding-trigger::before, .expanded .mod-expanding-trigger:before {
    color: #ffffff;
}

/*Nav*/
.mod-navigation-children .mod-navigation-link {
    padding: .75em 0;
    font-size: .75em;
    font-weight: 300;
    line-height: 1.15em;
    color: black;
    text-align: left;
    white-space: nowrap;
    font-family: 'Montserrat';
    text-decoration: none;
}

h2.Location-Header {
    font-family: 'Montserrat';
    font-weight: bold;
    color: white;
}

ul li {
    font-family: "Livvic", sans-serif;
}

/*Locations*/
.expanded .mod-location-trigger, .no-js .mod-location-trigger {
    padding: .73em .9em;
    color: #fff;
    background: #800000;
}
.expanded .mod-location-trigger::before, .expanded .mod-location-trigger:before {
color:white;
}


.mod-location-information-button {
    padding: .8em 1.4em;
    font-size: 1em;
    color: white;
    background: #800000;
}

.mod-location-information-button:hover{
    background: #b60000;
}



.location-card span {
    display: block; 
    margin: 10px 0;
    font-size: 1rem;
    color: #333;
}

.mod-location-information p span {
    font-weight: initial;
    font-size: large;
}

/*Fonts*/
strong {
    font-size: 1em;
    font-weight: bold;
    color: #202020;
    font-family: 'Montserrat';
}

span.mod-event-info {
    font-size: 1em;
    font-weight: bold;
    color: rgb(32, 32, 32);
    font-family: Montserrat;
}

span.mod-news-story-cta {
    background: #800000;
    color: white;
    transition: .3s ease;
}

.mod-news-story-cta:hover, .mod-news-story-cta:focus, .mod-news-story:hover .mod-news-story-cta, .mod-news-story:focus .mod-news-story-cta {
    background: #e3af1f;
    background: #b60000;
    color: white;
}

strong.mod-news-story-title {
    font-size: 1.5em;
    font-weight: bold;
    color: rgb(32, 32, 32);
    font-family: Montserrat;
}

/*Back To Top*/
.mod-back-to-top-footer:before, .back-to-top-footer::before {
    background: #800000;
}

.mod-back-to-top-footer:hover:before, .back-to-top-footer:hover::before, .mod-back-to-top-footer:focus:before, .back-to-top-footer:focus::before {
    color: #800000;
    background: #fff;
}