/*
 * --------------------
 * Cascading Style Sheets File
 * Copyright Strategic Information Technology 2012
 * Last updated: 8/20/2012
 * ====================
 *
 * Contents:
 *
 * 1. Header Styles
 * ----------------
 * 1.1 Header Image
 * 1.2 Menu Button
 * 1.2.1 DropDown Button
 * 1.2.2 Sublinks
 * 1.3 Header Jump Glitch
 * 1.4 Menu Fading
 *
 * 2. Content Styles
 * -----------------
 * 2.1 Header Bar
 * 2.2 Bottom Text
 * 2.3 Hidden
 * 2.4 For Text Box Proper Sizing
 * 2.5 Horizontal Rule
 *
 * 3. Main Menu Page
 * -----------------
 * 3.1 Icons
 *
 * 4. Accounts Page
 * ----------------
 * 4.1 Table Styling
 * 4.2 Positive or Negative (Debit/Credit)
 * 4.3 Anchor Tag Collapsibles
 * 4.4 FIX for Collapsible Set Accordian extension past right edge of screen
 * 4.5 Ellipsis
 * 4.6 Balance Number
 *
 * 5. Lost Card Page
 * -----------------
 * 5.1 Datepicker
 *
 * 6. Pop Up Modal
 * ---------------
 * 6.1 Confirm
 * 6.2 Modal Fade
 *
 * 7. Android Performance
 * ---------------------
 */


/* 1. Header Styles */

/* 1.1 Header Image */

.header #header-img {
  display:inline-block;
  float:left;
  height:38px;
}

.header #header-label {
  display:inline-block;
  float:left;
}

.header #header-label span {
  position: absolute;
  height: 100%;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  height: 1em;
  width: 50%;
  text-align: center;
}

/* 1.2 Menu Button */

.header ul
{
    list-style:none;
   padding:0px;
    margin:0px;
}

/* 1.2.1 DropDown Menu Button */

.header ul li a.ui-btn {
  display:block;
  line-height:38px;
  height:38px;
  border-radius:0px;
  overflow:hidden;
  border:none;
}

.header ul li a.ui-btn img {
  margin-top:-8px; /*move icon up to be vertically centered */
}

/* 1.2.2 Sublinks */

.header ul li.sublinks
{
  display:none; /*to prevent menu from showing on pageLoad */
  position:absolute;
  top: 39px;
  left: 0px;
  width: 100%;
  z-index:1000;
}

.header ul li.sublinks .ui-grid-a a:last-child {
  box-shadow: 0 3px 4px #999;
}

.header ul li.sublinks a
{
    margin-top:-8px;

    z-index:1000;
    padding-left:20px;

    background-repeat: no-repeat;
  line-height:23px !important;
}

.header ul li.sublinks .ui-grid-a .ui-block-a a
{
  border:1px solid #ccc;
  border-right:none;
}

.header ul li.sublinks .ui-grid-a .ui-block-b a
{
  border:1px solid #ccc;
}

/* 1.3 Header Jump Glitch */

.ui-header{
  height:38px;
}

/* 1.4 Menu Fading */

/* Menu Fading */

.menufade {
  display:block;
  z-index:-10;
  opacity: 0.6;
  position:fixed !important;
  top:38px;
  left:0px;
  width:100%;
  height:100%;
  background:lightgray;
}

/* 2. Content Styles */

/* 2.1 Header Bar (aka Greeting Bar) */

.home-button {
  margin:-9px;
  padding-left:5px;
}

.heading-text {
  text-align:center;
  padding-right:20px;
  padding-left: 10%;
  width: 80%;
   margin-left: -50%;
  position: absolute;
}

/* 2.2 Bottom Text */

.bottom-text > a {
  color:#000 !important;
  font-weight:100 !important;
}

/* 2.3 Hidden */

.hidden {
  display:none;
}

/* 2.4 For Text-Box Proper Sizing */

.ui-input-text {
    width:100% !important;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}

/* 2.5 Horizontal Rule */

hr {
  border:1px dashed #CCC;
}

/* 3. Main Menu Page */

/* 3.1 Icons */

#main .ui-btn, #contact .ui-btn {
  background-repeat: no-repeat;
  background-position: 20px;
}

/* 4. Accounts Page */

/* 4.1 Table Styling */

table {
  width:100%;
  border:2px solid black;
  text-align:left;
  margin:-12px 4px;
}

/* 4.2 Positive or Negative (Credit/Debit) */

th {
  background-color:white;
}
tr:nth-child(2n) {
  background-color:#ddd;
}

/* 4.3 Anchor Tag Collapsibles */

.ui-collapsible a {
  color:#222 !important;
  text-decoration:none;
}

/* 4.5 Ellipsis */

.ellipsis {
    white-space: nowrap;
    overflow: hidden;
    display: block;
    text-overflow:ellipsis;
    font-size: small;
    font-weight: normal;
}

/* 4.6 Balance Number */

.balance {
  float:right;
  padding-top:5px;
  margin-right:-8px;
  font-size: small;
}

/* 5. Lost Card Page */





fieldset a.ui-btn {
  background-image:url('assets/icons/calendar.png');
  background-repeat:no-repeat;
  background-position:center;
}

/* 6. Popup Confirmation Window */

/* 6.1 Confirm Box */

.confirm {
  display:none;
  z-index:1200;
  position:fixed !important;
  height:auto;
  width:240px !important;
  border:0px solid green;
  left:50% !important;
  margin-left:-135px !important;
  top:50%;
  margin-top:-130px;
}


.confirm div{
  display:inline !important;
  margin-left: 40px;
}

/* 6.2 Modal Fade */

.modalfade {
  display:block;
  z-index:1000;
  opacity: 0.6;
  position:fixed !important;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  background:black;
}






.dropdown.ui-btn.ui-shadow.ui-btn-corner-all{
    margin: 0;
}


.ui-btn.ui-shadow.ui-btn-corner-all.ui-btn-up-d {
    margin-left: 0;
    margin-right: 0;
}


.ui-grid-a, .ui-grid-b, .ui-grid-c, .ui-grid-d {
    overflow: hidden;
    padding-top: 5px;
}







/*

fieldset a.datepicker {
    border-bottom-left-radius: 0 !important;
    border-top-left-radius: 0 !important;
    display: inline;
    height: 40px !important;
    margin-top: 8px !important;
    position: absolute;
    width: 70%;
}


.ui-input-text.ui-shadow-inset.ui-corner-all.ui-btn-shadow.ui-body-c {
    display: inline-block;
    width: 25% !important;
}

*/
/* 5.1 Datepicker */

fieldset a.datepicker {
  display:block !important;
  margin-left:70% !important;
  height:40px !important;
  -moz-border-bottom-left-radius: 0px !important;
  border-bottom-left-radius: 0px !important;
  -moz-border-top-left-radius: 0px !important;
  border-top-left-radius: 0px !important;
}


.confirm p {
  width: 100% !important;
}

.confirm div {
display: inline;
}


.ui-datebox-gridheader div{
    margin-left:  0 !important;
    margin-right: 0 !important;
}

.ui-datebox-container { border: 5px solid #111 !important; width: 280px; -webkit-transform:translate3d(0,0,0); }



 .ui-grid-a div{
     display: inline-block;
 }

.ui-page {
    min-width: 320px;
}

#header-img .ui-link > img {
    height: 38px;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 10px;
}

#menu-btn {
    float: right;
}

#menu-btn img {
    padding-bottom: 2px;
    width: 27px;
}

div.header {
  border: 0 !important;
}

#menu-btn ul:first-child li:first-child span {
    border: 0 !important;
}

div.ui-collapsible-set div.ui-collapsible.ui-last-child {
    margin-bottom:10px;
    padding:0 !important;
}

div.ui-collapsible-set div.non-collapsible {
    margin: -1px -5px 10px 0;
    padding-right: 0px;
    overflow:hidden;
}

div.ui-collapsible-set div.non-collapsible h3 {
    margin-right: 5px;
    margin-left: 0;
}

div.ui-collapsible-set div.non-collapsible a {
    border-left-width: 1px;
    border-right-width: 1px;
}

.bg-icon {
    background-size: 30px auto;
}

.bg-icon-topmenu {
    background-position: left 5px center !important;
    text-align: right !important;
}

.bg-icon-topmenu.logout {
    background-image: url("/v2016/mb/assets/icons/logout_top.png") !important;
}


.bg-icon-topmenu.card {
    background-image: url("/v2016/mb/assets/icons/card_top.png") !important;
}

.bg-icon-topmenu.locations {
    background-image: url("/v2016/mb/assets/icons/locations_top.png") !important;
}

.bg-icon-topmenu.message {
    background-image: url("/v2016/mb/assets/icons/message_top.png") !important;
}

.bg-icon-topmenu.accounts {
    background-image: url("/v2016/mb/assets/icons/accounts_top.png") !important;
}

.bg-icon-topmenu.transfer {
    background-image: url("/v2016/mb/assets/icons/transfer_top.png") !important;
}

.bg-icon-topmenu.bills {
    background-image: url("/v2016/mb/assets/icons/bills_top.png") !important;
}

.contact-addr {
  text-align: center;
}

table.internal-table {
  font-size: small;
}

table.fixed {
  table-layout: fixed;
}

.ui-footer.ui-bar-a{
  background: rgba(0,0,0,0) !important;
  border: none;
}

.dropdown  {
  box-shadow: none !important;
}

.dropdown.ui-btn-hover-e,.dropdown.ui-focus {
  background-image: none !important;
  border: none;
}

.sublinks a {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

div#modal-bills a,div#modal-transfer a {
  display: block;
}

div#secimagedisplay {
  padding: 10px;
  border: 3px inset #ccc;
  background-position: center center;
}