﻿

/*general*/
 @font-face {
    font-family:'blackjackregular';
    src: url('design/black_jack-webfont.eot');
    src: url('design/black_jack-webfont.eot?#iefix') format('embedded-opentype'), url('design/black_jack-webfont.woff') format('woff'), url('design/black_jack-webfont.ttf') format('truetype'), url('design/black_jack-webfont.svg#blackjackregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
.homeAlert {
    position: absolute;
    background: #A30635;
    color: white;
    width: 35% ;
    border-bottom-left-radius: 1rem;
    border-bottom-right-radius: 1rem;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 9999;
    padding: 1rem;
    border:2px solid #333;
}
.homeAlert p{margin:0;}
.clear {
    clear: both
}
.cf:before, .cf:after {
    content:" ";
    /* 1 */
    display: table;
    /* 2 */
}
.cf:after {
    clear: both;
}
::-webkit-input-placeholder {
    text-align:center;
}
:-moz-placeholder {
    /* Firefox 18- */
    text-align:center;
}
::-moz-placeholder {
    /* Firefox 19+ */
    text-align:center;
}
:-ms-input-placeholder {
    text-align:center;
}
.searchRow ::-webkit-input-placeholder {
    text-align:right;
}
.searchRow :-moz-placeholder {
    /* Firefox 18- */
    text-align:right;
}
.searchRow ::-moz-placeholder {
    /* Firefox 19+ */
    text-align:right;
}
.searchRow :-ms-input-placeholder {
    text-align:right;
}
.interiorMainContent h1, .interiorMainContent h2, .interiorMainContent h3, .interiorMainContent h4, .interiorMainContent h5 {
    color: #A30635
}
.interiorMainContent h1 {
    font-size: 1.8rem;
    font-weight: bold
}
.interiorMainContent h2 {
    font-size: 1.4rem;
    font-weight: bold
}
.interiorMainContent h3 {
    font-size: 1.2rem
}
.interiorMainContent h4 {
    font-size: 1rem
}
.interiorMainContent h5 {
    font-size: 1rem
}
.breadcrumbs > *:before {
    content:">";
    color: #A30635
}
.breadcrumbs {
    padding-left: 0
}
.breadcrumbs > * {
    text-transform: inherit;
    font-size: 1.2rem;
    font-weight: bold;
}
.breadcrumbs {
    background: none;
    border: none;
}
.interiorMainContent .breadcrumbs > * a {
    color: #A30635
}
.interiorMainContent .current a {
    color: #333;
}
.breadcrumbs li {
    border-bottom: 1px solid #A30635;
    padding-bottom: .3rem;
}
.breadcrumbs > *:before {
    margin: 0 0.3rem;
}
.breadcrumbs > *:hover a, .breadcrumbs > *:focus a {
    text-decoration: none
}
.button {
    background: #A30635;
    box-shadow: 1px 1px 2px #444;
    border-radius: 3px;
    padding:.5rem 1rem;
    font-size: 1.2rem;
    font-weight: 400;
}
.button:hover, .button:focus {
    background-color: #222;
}
body {
    background-color:#fff;color:#222;
}
/*layout*/
 .fullWidth {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    max-width: initial;
}
.row {
    max-width: 75rem;
}
/*fonts*/
 header, .button, .homeBox a, .homeBox p, header .inline-list, footer {
    font-family:'Roboto', sans-serif;
}
.mainNav, .homeWelcome p, .homeBox .header, .calList, .interiorMainContent, .interiorMainContent p {
    font-family:'Roboto Condensed', sans-serif;
    font-weight: 700;
}
.interiorMainContent, .interiorMainContent p {
    font-family:'Roboto Condensed', sans-serif;
    font-weight: 400;
}
.quoteSig {
    font-family: blackjackregular, serif;
    font-size: 1.5rem;
}
/*header*/
 header {
    padding: 1rem 0;
    border-bottom: 3px solid #A30635;
    background: #fff;
}
header .inline-list {
    margin-top: .5rem
}
header .inline-list li:before {
    content:"|";
    display: inline-block;
    margin: 0 .5rem;
    color: #222;
}
header .inline-list li {
    margin: 0;
}
header .inline-list li:first-child:before {
    content: none;
}
header .inline-list > li > * {
    display: inline-block;
}
header .inline-list a:visited, header .inline-list a:link {
    color: #222;
}
header .inline-list a:hover {
    text-decoration: underline;
}
.bg {
    background: url(design/61297-fall-background-img.jpg) no-repeat top center;
    background-color: #333;
}
/*left column*/
 .leftColumn {
   /* background: #7FA23D;
    background: rgba(127, 162, 61, .9);*/
    background: rgba(114, 122, 48, .9);
    border-right: 3px solid #A30635;
    padding-top: 1rem;
    padding-bottom: 1rem
}
.mobile {
    background: url(design/mobile.png) no-repeat right center;
    min-height: 3rem;
    padding-right: 1.5rem;
}
.mainNav {
    margin: 0
}
.mainNav li {
    list-style: none;
    font-size: 1.25rem;
}
.mainNav > li > a:link, .mainNav > li > a:visited {
    color: #fff;
    text-transform: uppercase;
}
.mainNav > li > a:after {
    content:">";
    color: #fff;
    vertical-align: 2px;
    padding-left: .2rem
}
.mainNav > .active > a:after {
    content:"v";
    font-size: .9rem;
    vertical-align: 0
}
.mainNav > li > ul {
    display: none;
    margin-left: .5rem;
}
.mainNav > li ul a:link, .mainNav > li ul a:visited {
    color:#222;
    font-size: 1rem;
    display: inline-block;
    width: 100%;
    padding: .2rem 0 .2rem .5rem;
    line-height:1.3rem;
}
.mainNav > li ul a:hover {
    color:#fff;
    background-color: #A30635;
}
.mainNav > li ul li {
    line-height: 1.4rem;
}
.appStore {
    margin: 0 0 1.5rem 0;
    text-align: center
}

.socialWrap {
    margin: 0 auto;
    text-align: center
}
h4.socialHeader {color:#fff;}
.social {
    background:url("design/social-sprite.png") top left no-repeat;
    width:40px;
    height:40px;
    display: inline-block;
    margin: 1rem .5rem 0 .5rem;
}

.pinterest {
    width:41px;
    height:41px;
    background-position:-10px -10px;
}
.youtube {
    width:41px;
    height:41px;
    background-position:-10px -61px;
}
.chat {
    width:41px;
    height:40px;
    background-position:-10px -112px;
}
.twitter {
    background-position:-10px -162px;
}
.facebook {
    background-position:-10px -212px;
}
.in {
    background-position:-10px -262px;
}
.email {
    width:41px;
    height:40px;
    background-position:-10px -312px;
}
.car {
    background-position:-10px -362px;
}
.instagram {
    background-position:-10px -412px;
}
/*interior*/
 .interiorMainContent {
    background:#fff;
    background: rgba(255, 255, 255, 0.85);
    margin-top: 1rem;
    padding: 1rem;
}
.interiorMainContent img.left {
    padding-right: 1rem
}
.interiorMainContent img.right {
    padding-left: 1rem
}
.interiorMainContent .row {
    clear: both;
    padding-top: 1rem
}
.interiorMainContent a {
    /*color: #7FA335*/
     color: #596c2b;
}
.interiorMainContent a:hover {
    text-decoration: underline;
}
.interiorBox {
    background: #fff;
    padding: 1rem;
    margin-bottom: 1rem
}
.interiorMainContent .darkHeader {
    color: #222;
}
.small {
    font-size: .8rem;
}
/*home*/
 .quote {
    background: #fff;
    background: rgba(255, 255, 255, .9);
    border-bottom-right-radius: 1rem;
    border-bottom-left-radius: 1rem;
    padding:1rem;
    width: 50%;
}
.quote p {
    font-size: .8rem
}
.homeBox {
    background: #333;
    background: rgba(0, 0, 0, .65);
    color: #fff;
    padding: .5rem 1rem 2rem 1rem;
    margin-bottom: 1rem
}
.homeBox p {
    font-size: .9rem;
}
.homeBox .header {
    color: #fff;
    text-align: center
}
.homeBoxLearnMoreWrap {
    position: absolute;
    bottom:2rem;
    right: 3rem;
    font-size: 1.2rem;
    border-bottom: 1px solid #fff
}
.homeBoxLearnMoreWrap a:visited, .homeBoxLearnMoreWrap a:link {
    color: #fff;
}
.homeBoxLearnMoreWrap a:after {
    content:">>";
    color: #fff;
    padding-left: .5rem;
}
.homeBoxWrap > div {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.homeWelcome {
    margin-top: 20rem;
    text-align: center;
    padding-bottom: .5rem;
}
.homeWelcome p {
    margin: 0;
    font-size: 1.2rem
}
.searchRow > div {
    margin-top: 1rem
}
.onlineBanking .button {
    width: 100%;
    margin-bottom: 0;
    background: url(design/login.png) no-repeat center center;
    background-color: #A30635;
}
.onlineBanking .header {
    text-align: center;
    color:#fff;
}
.onlineBanking iframe {
    border:none;
}
.onlineBanking p {
    text-align: center;
    font-size: .75rem;
    color: #111;
}
.onlineBanking a:link, .onlineBanking a:visited {
    color: #111;
    text-decoration: underline;
    font-weight: bold;
}
.menuToggle {
    width: 100%
}
.menuIcon {
    padding-left: .5rem
}
.calTab, .calList {
    background: #111;
}
.calList {
    background: rgb(0, 0, 0);
    background: rgba(0, 0, 0, .9);
    display: none;
    color: #fff;
}
.calList a:link, .calList a:visited {
    color: #fff;
}
.calList a{display:block}
.calList p {
    margin: 0
}
.calList ul {
    list-style: none;
    padding: 1rem .5rem .5rem 0;
    margin-left: .5rem
}
.calList li {
    background: url(design/cal-tall.png) no-repeat 0.5rem .9rem;
    padding: .5rem .5rem .5rem 4rem;
    position: relative;
}
.calList li:hover {
    background-color: #333;
}
.date {
    position: absolute;
    top: 1.3rem;
    left: .8rem;
    font-size: 1.9rem;
    color: #222
}
.month{
position: absolute;
top: .7rem;
left: 1rem;
font-size: .8rem;
color: #fff;
}
.calTab {
    border-top-right-radius: 1rem;
    border-top-left-radius: 1rem;
    text-align: center;
    color: #fff;
    font-weight: bold;
    padding: .4rem 1rem;
    cursor: pointer;
    width:12rem;
}
.calTabIcon {
    height: .9rem;
    width: auto;
    margin:-.3rem .3rem 0 0;
}
.calendarWrap {
    width: auto;
    position: absolute;
    top: -1.8rem;
    right: 0;
    z-index: 99
}

/* atm locator */
#ATMNetworkLocator_DirectionPopup{
background: #ccc;
padding: 1rem;
border-radius: 1rem;
clear:both;
}
#ATMNetworkLocator_GetDirectionsButton close{
float:right;
}
.ATMNetworkLocator_SearchResultItem_DistanceDirection{margin-left:2rem;}

#ATMNetworkLocator_GetDirectionsButton .close{float:right;}
.ATMNetworkLocator_SearchResultItem_Address > div, #ATMNetworkLocator_pnlSearchSummary > div, #ATMNetworkLocator_SearchCriteriaSummary > div{padding-bottom:.5rem;}
#ATMNetworkLocator_lbModifySearch{font-size:1.2rem;}
/*footer*/
 footer.row {
    margin-top: 1.5rem;
}
footer a:link, footer a:visited {
    color: #111;
    font-weight: bold;
}
footer a:hover {
    text-decoration: underline;
}
footer h5 {
    border-bottom: 1px solid #333
}
.footerLeftLinksWrap > div div.row {
    padding-bottom: 1rem;
}
.footerWidgetWrap {position: relative;height: 2rem;}
.footerWidgetWrapInner {position: absolute;top: -160px;margin-top: 150px;height: 40px;overflow: hidden;left:-0.5rem;padding:.5rem;background:#fff;border-radius:1rem;}
.footerWidgetWrap iframe{border:none}
.copyRightWrap p {
    margin-top: 1rem;
}
/*small to med*/
 @media only screen and (max-width: 64.063em) {
    .quote {
        width: 100%
    }
    .breadcrumbs > * {
        font-size: .8rem
    }
.homeAlert{
    width:60%;
    }
.homeBoxWrap:nth-child(3) > .column:nth-child(3){clear:left;}
}
/*small only*/
 @media only screen and (max-width: 40em) {
.homeAlert{position:relative;width:100%;}
    .homeBox {
        background: #111
    }
    .bg {
        background: none
    }
    .homeWelcome {
        margin-top: 1rem;
    }
    header .inline-list {
        margin: 1rem 0 2rem 0;
    }
    .mainNav {
        display: none
    }
}
/*med up*/
 @media only screen and (min-width: 40em) {
    .mainNav {
        display: block !important;
        margin-top: 2rem;
    }
}

/* responsive tables*/
@media only screen and (max-width: 767px) {
    
    table.responsive { margin-bottom: 0; }
    
    .pinned { position: absolute; left: 0; top: 0; background: #fff; width: 35%; overflow: hidden; overflow-x: scroll; border-right: 1px solid #ccc; border-left: 1px solid #ccc; }
    .pinned table { border-right: none; border-left: none; width: 100%; }
    .pinned table th, .pinned table td { white-space: nowrap; }
    .pinned td:last-child { border-bottom: 0; }
    
    div.table-wrapper { position: relative; margin-bottom: 20px; overflow: hidden; border-right: 1px solid #ccc; }
    div.table-wrapper div.scrollable { margin-left: 35%; }
    div.table-wrapper div.scrollable { overflow: scroll; overflow-y: hidden; }    
    
    table.responsive td, table.responsive th { position: relative; white-space: nowrap; overflow: hidden; }
    table.responsive th:first-child, table.responsive td:first-child, table.responsive td:first-child, table.responsive.pinned td { display: none; }
    
    
}


/* ===============ADA Styles============*/

.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  color:#000000;
  background-color:#ffffff;
}
#skip a, #skip a:hover, #skip a:visited 
{ 
position:absolute; 
left:0px; 
top:-500px; 
width:1px; 
height:1px; 
overflow:hidden;
color:#000000;
background-color:#ffffff;
} 

#skip a:active, #skip a:focus 
{ 
position:static; 
width:auto; 
height:auto; 
}

fieldset legend {font-weight:400; background-color:transparent;}