/* http://meyerweb.com/eric/tools/css/reset/ 2. v2.0 | 20110126
  License: none (public domain)
*/
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;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/*Ignore the gross stuff above */
body {
  font-size: 0.92705em;
  font-family: "ff-basic-gothic-web-pro", sans-serif;
  color: white;
  background-color: #16923B; }

.upper_wrapper {
  background-color: #DBDBDF;
  height: 52px; }
  .upper_wrapper .menu, .upper_wrapper img, .upper_wrapper .logout {
    float: left;
    transition: background-color 200ms;
    margin: 6px 4.2%; }
  .upper_wrapper .menu {
    text-decoration: none;
    -moz-box-sizing: border-box;
    /* Firefox 1, probably can drop this */
    -webkit-box-sizing: border-box;
    /* Safari 3-4, also probably droppable */
    box-sizing: border-box;
    /* Everything else */
    border: 2px solid #308241;
    border-radius: 3.5px;
    background-color: #8BCE94;
    color: white;
    font-size: 1.15em;
    cursor: pointer;
    padding: 2% 9%; }
  .upper_wrapper img {
    background-color: white; }
  .upper_wrapper .logo {
    display: none; }
  .upper_wrapper .logout {
    text-decoration: none;
    -moz-box-sizing: border-box;
    /* Firefox 1, probably can drop this */
    -webkit-box-sizing: border-box;
    /* Safari 3-4, also probably droppable */
    box-sizing: border-box;
    /* Everything else */
    border: 2px solid #308241;
    border-radius: 3.5px;
    background-color: #8BCE94;
    color: white;
    font-size: 1.15em;
    cursor: pointer;
    padding: 2.5% 9%; }
  .upper_wrapper .menu:hover, .upper_wrapper .logout:hover {
    background-color: #308241; }

nav {
  -moz-box-sizing: border-box;
  /* Firefox 1, probably can drop this */
  -webkit-box-sizing: border-box;
  /* Safari 3-4, also probably droppable */
  box-sizing: border-box;
  /* Everything else */
  width: 100%;
  display: none; }
  nav ul {
    background-color: #6DBE4E;
    padding: 5px; }
    nav ul li {
      margin: 20px auto;
      border-bottom: 2px solid #308241;
      position: relative; }
      nav ul li a {
        color: white;
        text-decoration: none;
        cursor: pointer;
        font-size: 1.25em;
        padding: 5px;
        margin-bottom: 10px; }

.main {
  width: 90%;
  height: 100%;
  margin: 0 auto; }

h1 {
  font-size: 2.42705em;
  font-family: "jaf-bernina-sans", sans-serif;
  margin: 20px auto;
  text-align: center; }

h2 {
  font-size: 1.5em;
  font-family: "jaf-bernina-sans", sans-serif;
  text-align: center; }

.message_center, .help, .products {
  width: 75%;
  max-width: 250px;
  margin: 15px auto;
  border: 5px solid #308241;
  border-radius: 5px;
  min-height: 110px; }
  .message_center h2, .help h2, .products h2 {
    background-color: #6DBE4E;
    padding: 5px;
    padding: 5px 9%;
    text-align: center;
    margin: 0 auto; }
  .message_center a, .help a, .products a {
    color: white;
    text-decoration: none;
    cursor: pointer;
    font-size: 1.25em;
    text-decoration: none;
    -moz-box-sizing: border-box;
    /* Firefox 1, probably can drop this */
    -webkit-box-sizing: border-box;
    /* Safari 3-4, also probably droppable */
    box-sizing: border-box;
    /* Everything else */
    border: 2px solid #308241;
    border-radius: 3.5px;
    background-color: #8BCE94;
    color: white;
    font-size: 1.15em;
    cursor: pointer;
    display: block;
    transition: background-color 200ms; }
  .message_center a:hover, .help a:hover, .products a:hover {
    background-color: #308241; }

.message_center a:nth-of-type(1) {
  margin: 15px 2%;
  padding: 2px 36.035%;
  display: block;
  text-align: center; }
.message_center a:nth-of-type(2) {
  margin: 0 2% 15px 2%;
  padding: 2px 3%;
  display: block;
  text-align: center; }

.help {
  min-height: 350px; }
  .help a {
    padding: 5px 2%;
    margin: 15px 2%;
    text-align: center; }

.products {
  max-height: 520px; }
  .products button {
    display: block;
    width: 100%;
    height: 30px;
    font-size: 0.89em;
    background-color: green;
    color: white;
    border: none;
    border-bottom: 1px solid white;
    cursor: pointer; }
  .products .hidden {
    display: none;
    width: 100%; }
    .products .hidden a {
      padding: 5px 2%;
      margin: 15px 2%;
      text-align: center; }

.container {
  margin: 0 auto; }
  .container .home_top {
    margin: 5px auto;
    text-align: center; }
    .container .home_top .header {
      background-color: #6DBE4E;
      padding: 5px; }
      .container .home_top .header h1 {
        width: 100%; }
  .container .login {
    -moz-box-sizing: border-box;
    /* Firefox 1, probably can drop this */
    -webkit-box-sizing: border-box;
    /* Safari 3-4, also probably droppable */
    box-sizing: border-box;
    /* Everything else */
    margin: 20px auto;
    text-align: center; }
    .container .login input {
      margin: 10px auto; }
    .container .login label {
      font-size: 1.25em; }
    .container .login .log {
      text-decoration: none;
      -moz-box-sizing: border-box;
      /* Firefox 1, probably can drop this */
      -webkit-box-sizing: border-box;
      /* Safari 3-4, also probably droppable */
      box-sizing: border-box;
      /* Everything else */
      border: 2px solid #308241;
      border-radius: 3.5px;
      background-color: #8BCE94;
      color: white;
      font-size: 1.15em;
      cursor: pointer;
      padding: 4px 30px; }
    .container .login .check_app {
      text-decoration: none;
      -moz-box-sizing: border-box;
      /* Firefox 1, probably can drop this */
      -webkit-box-sizing: border-box;
      /* Safari 3-4, also probably droppable */
      box-sizing: border-box;
      /* Everything else */
      border: 2px solid #308241;
      border-radius: 3.5px;
      background-color: #8BCE94;
      color: white;
      font-size: 1.15em;
      cursor: pointer;
      background-color: #68B180;
      font-weight: bold;
      border: 3px solid #308241;
      padding: 6px; }
  .container iframe.video_small {
    position: absolute;
    bottom: -80px;
    left: 10px; }
  .container iframe.video_medium {
    display: none;
    position: absolute;
    bottom: -80px;
    left: 200px; }
  .container iframe.video_large {
    display: none;
    position: absolute;
    bottom: -80px;
    left: 350px; }

.accounts {
  width: 100%; }
  .accounts h1 {
    margin: 10px auto;
    width: 42%; }
  .accounts table {
    -moz-box-sizing: border-box;
    /* Firefox 1, probably can drop this */
    -webkit-box-sizing: border-box;
    /* Safari 3-4, also probably droppable */
    box-sizing: border-box;
    /* Everything else */ }
    .accounts table tr:nth-of-type(3) {
      display: none; }
    .accounts table th, .accounts table td {
      border: 2.5px solid #68B180;
      padding: 2px; }
    .accounts table td {
      font-size: 1.25em;
      font-family: "jaf-bernina-sans-comp", sans-serif;
      text-align: center; }
  .accounts table:nth-of-type(2) {
    margin: 10px auto; }
    .accounts table:nth-of-type(2) th, .accounts table:nth-of-type(2) td {
      padding: 10px; }

.transfers h1 {
  width: 92%;
  margin: 20px auto 0 auto; }
.transfers h2 {
  width: 90%;
  margin: 20px auto;
  text-align: center;
  line-height: 1.3em; }
.transfers .transfer_form {
  -moz-box-sizing: border-box;
  /* Firefox 1, probably can drop this */
  -webkit-box-sizing: border-box;
  /* Safari 3-4, also probably droppable */
  box-sizing: border-box;
  /* Everything else */
  width: 100%;
  min-height: 190px;
  border: 3.5px solid #68B180;
  border-radius: 5px;
  padding: 10px;
  margin: 20px auto;
  font-size: 1.125em; }
  .transfers .transfer_form .transfer:not(:nth-of-type(1)) {
    margin: 22px 0; }
  .transfers .transfer_form select {
    background-color: #9797A8;
    font-size: 80%;
    color: white;
    border: 2px solid #308241;
    width: 130px;
    height: 30px;
    font-size: 0.89em; }
  .transfers .transfer_form label:nth-of-type(5) {
    padding-right: 30px; }
  .transfers .transfer_form label:nth-of-type(6) {
    padding-left: 116px; }
  .transfers .transfer_form label:nth-of-type(5), .transfers .transfer_form label:nth-of-type(6) {
    font-size: 0.89em; }
    .transfers .transfer_form label:nth-of-type(5) input, .transfers .transfer_form label:nth-of-type(6) input {
      width: 15px;
      height: 15px; }
  .transfers .transfer_form button {
    text-decoration: none;
    -moz-box-sizing: border-box;
    /* Firefox 1, probably can drop this */
    -webkit-box-sizing: border-box;
    /* Safari 3-4, also probably droppable */
    box-sizing: border-box;
    /* Everything else */
    border: 2px solid #308241;
    border-radius: 3.5px;
    background-color: #8BCE94;
    color: white;
    font-size: 1.15em;
    cursor: pointer;
    font-size: 0.89em;
    border: 3px solid #308241;
    background-color: #88C873;
    margin-top: 10px;
    float: right;
    transition: background-color 300ms;
    padding: 10px 5%; }
  .transfers .transfer_form button:hover {
    background-color: #308241; }
  .transfers .transfer_form .confirm_transfer {
    display: none; }
  .transfers .transfer_form .show {
    display: block; }

.bill_pay h1 {
  margin: 15px 0; }
.bill_pay h2 {
  margin: 15px 0; }
.bill_pay .bills {
  width: 90%;
  max-width: 280px;
  margin: 30px auto;
  margin-bottom: 20px; }
  .bill_pay .bills .bills_regular {
    float: left; }
  .bill_pay .bills .bills_expanded {
    float: right; }
  .bill_pay .bills select {
    background-color: #9797A8;
    font-size: 80%;
    color: white;
    border: 2px solid #308241;
    width: 130px;
    height: 44px;
    font-size: 0.89em; }
.bill_pay .payment {
  margin: 30px auto;
  max-width: 345px; }
  .bill_pay .payment input {
    padding: 8px 1%;
    margin-top: 20px; }
  .bill_pay .payment input[placeholder] {
    font-size: 1em;
    text-align: center; }
  .bill_pay .payment button {
    text-decoration: none;
    -moz-box-sizing: border-box;
    /* Firefox 1, probably can drop this */
    -webkit-box-sizing: border-box;
    /* Safari 3-4, also probably droppable */
    box-sizing: border-box;
    /* Everything else */
    border: 2px solid #308241;
    border-radius: 3.5px;
    background-color: #8BCE94;
    color: white;
    font-size: 1.15em;
    cursor: pointer;
    padding: 8px 2%;
    transition: background-color 300s;
    margin-top: 20px; }
  .bill_pay .payment button:hover {
    background-color: #308241; }
  .bill_pay .payment .confirm_payment {
    display: none; }
    .bill_pay .payment .confirm_payment .yes {
      float: left; }
    .bill_pay .payment .confirm_payment .no {
      float: right; }
  .bill_pay .payment .show {
    display: block; }

.account_alerts h1 {
  line-height: 1.3em; }
.account_alerts .alert_info {
  width: 85%;
  margin: 10px auto;
  font-size: 1.68539;
  line-height: 1.8em; }
  .account_alerts .alert_info p {
    margin: 6px 0; }
  .account_alerts .alert_info span {
    font-weight: bold;
    font-size: 1em; }
.account_alerts .alerts {
  margin: 30px auto; }
  .account_alerts .alerts table {
    -moz-box-sizing: border-box;
    /* Firefox 1, probably can drop this */
    -webkit-box-sizing: border-box;
    /* Safari 3-4, also probably droppable */
    box-sizing: border-box;
    /* Everything else */
    border: 2.5px solid #68B180;
    margin: 10px auto;
    width: 75%; }
    .account_alerts .alerts table th, .account_alerts .alerts table td {
      border-bottom: 2.5px solid #68B180;
      border-right: 2.5px solid #68B180;
      padding: 5px; }
    .account_alerts .alerts table td {
      font-size: 1.25em; }
    .account_alerts .alerts table .alert_new {
      visibility: collapse; }
    .account_alerts .alerts table .show {
      visibility: visible; }
    .account_alerts .alerts table .hide {
      visibility: collapse; }
  .account_alerts .alerts .newAlert {
    float: left;
    padding: 2%; }
  .account_alerts .alerts .deactivate {
    float: right;
    padding: 2%; }
.account_alerts button {
  text-decoration: none;
  -moz-box-sizing: border-box;
  /* Firefox 1, probably can drop this */
  -webkit-box-sizing: border-box;
  /* Safari 3-4, also probably droppable */
  box-sizing: border-box;
  /* Everything else */
  border: 2px solid #308241;
  border-radius: 3.5px;
  background-color: #8BCE94;
  color: white;
  font-size: 1.15em;
  cursor: pointer;
  border-radius: 5px; }
.account_alerts button:hover {
  background-color: #308241; }
.account_alerts .contacts {
  margin: 0 auto;
  clear: right; }
  .account_alerts .contacts table {
    -moz-box-sizing: border-box;
    /* Firefox 1, probably can drop this */
    -webkit-box-sizing: border-box;
    /* Safari 3-4, also probably droppable */
    box-sizing: border-box;
    /* Everything else */
    border: 2.5px solid #68B180;
    margin: 10px auto;
    width: 75%; }
    .account_alerts .contacts table th, .account_alerts .contacts table td {
      border-bottom: 2.5px solid #68B180;
      border-right: 2.5px solid #68B180;
      padding: 5px; }
    .account_alerts .contacts table td {
      font-size: 1.25em; }
    .account_alerts .contacts table td:nth-of-type(3) {
      word-wrap: break-word;
      word-break: break-all; }
    .account_alerts .contacts table button {
      background-color: #9797A8;
      font-size: 80%;
      padding: 10px 10%; }
    .account_alerts .contacts table select {
      background-color: #9797A8;
      font-size: 80%;
      color: white;
      border: 2px solid #308241;
      width: 130px;
      height: 44px; }
    .account_alerts .contacts table .contact_new {
      visibility: collapse; }
    .account_alerts .contacts table .show {
      visibility: visible; }
    .account_alerts .contacts table .hide {
      visibility: collapse; }
  .account_alerts .contacts .newContact {
    float: right;
    padding: 2%; }

.p2p_payments {
  width: 90%;
  margin: 0 auto; }
  .p2p_payments h1 {
    margin: 15px 0; }
  .p2p_payments h2 {
    line-height: 1.3em;
    margin: 55px auto 0 auto;
    width: 70%; }
  .p2p_payments li {
    font-size: 1.68539;
    line-height: 1.8em;
    margin: 8px 0; }
  .p2p_payments p {
    font-size: 1.1em;
    font-weight: 600;
    line-height: 1.6em;
    margin: 8px auto;
    max-width: 850px; }
  .p2p_payments ul {
    margin-left: 5%;
    max-width: 620px;
    margin: 15px auto; }
  .p2p_payments ul:nth-of-type(2) li {
    margin-left: 10%;
    color: white; }
  .p2p_payments .choice {
    text-align: center;
    margin: 20px auto; }
    .p2p_payments .choice button {
      text-decoration: none;
      -moz-box-sizing: border-box;
      /* Firefox 1, probably can drop this */
      -webkit-box-sizing: border-box;
      /* Safari 3-4, also probably droppable */
      box-sizing: border-box;
      /* Everything else */
      border: 2px solid #308241;
      border-radius: 3.5px;
      background-color: #8BCE94;
      color: white;
      font-size: 1.15em;
      cursor: pointer;
      padding: 1% 3%; }
    .p2p_payments .choice a {
      margin: 30px 0;
      font-size: 1.25em;
      color: #00B2EE; }

.custumer_service {
  width: 85%;
  margin: 0 auto; }
  .custumer_service h1, .custumer_service h2 {
    margin: 15px 0; }
  .custumer_service ul {
    border: 2px solid #8BCE94;
    border-radius: 5px;
    padding: 10px;
    margin: 0 auto;
    max-width: 400px; }
    .custumer_service ul li {
      font-size: 1.68539;
      line-height: 1.8em; }
      .custumer_service ul li a {
        color: #00B2EE; }
  .custumer_service .self_service, .custumer_service .messages, .custumer_service .lost {
    margin: 25px auto; }
  .custumer_service .messages ul {
    width: 55%;
    max-width: 250px; }
  .custumer_service .lost h2 {
    color: #e50000; }
  .custumer_service .lost p {
    margin: 10px auto;
    font-size: 1.1875em;
    line-height: 1.5em;
    max-width: 300px;
    text-align: center; }

@media screen and (min-width: 321px) {
  .accounts {
    width: 90%;
    margin: 0 auto; }
    .accounts table {
      width: 90%;
      margin: 0 auto;
      padding: 2%; } }
@media screen and (min-width: 390px) {
  .transfers .transfer_form {
    max-width: 350px; }
    .transfers .transfer_form label:nth-of-type(5) {
      padding-right: 0; }
    .transfers .transfer_form label:nth-of-type(6) {
      padding-left: 0; } }
@media screen and (min-width: 450px) {
  .upper_wrapper .logo {
    margin-left: 15%; }

  .alerts button:nth-of-type(1) {
    margin-left: 4%;
    margin-bottom: 30px; }
  .alerts button:nth-of-type(2) {
    margin-right: 4%;
    margin-bottom: 30px; }

  .contacts button {
    margin-right: 6%;
    margin-bottom: 30px; }

  .container iframe.video_small {
    display: none; } }
@media screen and (min-width: 520px) {
  body {
    font-size: 92%; }

  .upper_wrapper {
    height: 47px; }
    .upper_wrapper .menu {
      display: none; }
    .upper_wrapper .logo_small {
      display: none; }
    .upper_wrapper .logo {
      display: inline-block;
      width: 295px;
      margin-left: 10%; }
      .upper_wrapper .logo h1 {
        font-weight: bold;
        margin: 0;
        padding-top: 4px;
        text-align: left;
        font-size: 1.6em; }
    .upper_wrapper .logout {
      padding: 7px 45px;
      float: right;
      margin: 6px 2%; }

  .main {
    width: 80%;
    margin: 15px auto; }

  nav {
    -moz-box-sizing: border-box;
    /* Firefox 1, probably can drop this */
    -webkit-box-sizing: border-box;
    /* Safari 3-4, also probably droppable */
    box-sizing: border-box;
    /* Everything else */
    display: inline-block;
    margin: 10px 0 0 0; }
    nav ul {
      padding: 0;
      padding-bottom: 20px; }
      nav ul li {
        background-color: #6DBE4E;
        border-bottom-right-radius: 6px;
        border-bottom-left-radius: 6px;
        height: 40px;
        margin: 20px 0.5% 0 0.5%;
        float: left;
        width: 15.6%;
        transition: height 200ms;
        display: block; }
        nav ul li a {
          font-size: 1.0625em;
          display: block;
          text-align: center;
          transition: padding-top 200ms; }
        nav ul li a:hover {
          padding-top: 20px; }
      nav ul li:hover:not(.page_displayed) {
        height: 40px; }
      nav ul .page_displayed {
        font-size: 140%;
        height: 120%;
        border-bottom-right-radius: 6px;
        border-bottom: 5px solid #308241;
        border-bottom-left-radius: 6px; }
        nav ul .page_displayed a {
          padding-top: 10px; }

  .message_center {
    max-width: 220px; }

  .help, .products {
    max-width: 190px;
    margin: 15px 0; }

  .help {
    float: left;
    margin-left: 7%; }

  .products {
    float: right;
    margin-right: 7%; }

  .accounts {
    width: 90%; }
    .accounts table tr th {
      font-size: 120%;
      padding: 10px;
      border: 3.5px solid #68B180; }
    .accounts table tr td {
      font-size: 150%;
      padding: 10px;
      border: 3.5px solid #68B180; }

  .transfers .transfer_form {
    max-width: 500px;
    width: 85%; }
    .transfers .transfer_form label:nth-of-type(5) {
      padding-right: 0; }
    .transfers .transfer_form label:nth-of-type(6) {
      padding-left: 0; }

  .bill_pay .payment {
    max-width: 323px; }

  .p2p_payments h2:nth-of-type(1) {
    line-height: 1.3em;
    width: 90%;
    margin: 0 auto; }
  .p2p_payments h2:nth-of-type(2) {
    margin: 10px auto 20px auto;
    text-align: center; }

  .custumer_service ul li {
    font-size: 120%; } }
@media screen and (min-width: 600px) {
  .message_center, .help, .products {
    max-width: 250px; }

  .container iframe.video_medium {
    display: block; } }
@media screen and (min-width: 700px) {
  .upper_wrapper .logo {
    margin-left: 25%; }

  .alerts button:nth-of-type(1) {
    margin-left: 12%;
    margin-bottom: 30px; }
  .alerts button:nth-of-type(2) {
    margin-right: 12%;
    margin-bottom: 30px; }

  .contacts button {
    margin-right: 12%;
    margin-bottom: 30px; }

  .help {
    margin-left: 10%; }

  .products {
    margin-right: 10%; } }
@media screen and (min-width: 888px) {
  .upper_wrapper .logo {
    margin-left: 40%; }

  nav ul li {
    height: 25px; }

  .message_center, .help, .products {
    max-width: 240px;
    margin: 25px 0; }

  .message_center {
    margin: 25px 5% 25px 2%;
    float: left; }

  .help {
    margin-left: 0; }

  .products {
    float: right;
    margin: 25px 2% 25px 5%; }

  .custumer_service ul {
    max-width: 500px; }
    .custumer_service ul li {
      font-size: 132%;
      text-align: center; } }
@media screen and (min-width: 950px) {
  .message_center {
    margin: 25px 10% 25px 10%;
    float: left; }

  .help {
    margin: 25px 0; }

  .products {
    float: right;
    margin: 25px 10% 25px 6%; }

  .container iframe.video_medium {
    display: none; }
  .container iframe.video_large {
    display: block; } }

/*# sourceMappingURL=style.css.map */
