﻿
.secure .header-top {
    z-index: 1050; 
    /*height:auto !important;*/
}
/*.nav-top .header-top .navbar-header{
    width:auto;
}*/
/*.secure .navbar-header {
    width:179px !important;
    height:auto;
    padding: 1% !important;
}*/
.error-red-border, .error-red-border:focus{border-color:red !important;}
.secure .navbar-header .navbar-brand {
    display: none;
}

.secure.navbar-header{
    height: 90px;
    line-height: 90px;
}

.secure .navbar-header img {
    width: auto;
    max-height: 87px;
    vertical-align: middle;
    padding: 0 5px 0 0 !important;
    position: relative;
    top: -2px;
}

.secure .navbar-right .logo {
    display: none;
}
/*.secure .left-nav{width:auto; margin:2%;}*/
.secure .left-nav li.dropdown {
    width: 33% !important;
}
/*.secure .navbar-right{margin: 0 2% 0 0 !important;}*/
/*.secure li.user-profile{width:100%; padding:27% 0 0 0 !important;}*/
.customer-service {
    background: inherit;
    border: none;
    box-shadow: none;
    cursor: pointer;
}
/*.secure .top-navigation{top:77px;}*/
@media(max-width: 767px) {
   .apply-discount {
       padding:10px;
    }
    #datatable .optional {
        display:none;
    }
    .nav-top .header-top .navbar-header{
        /*width:auto !important;*/
        /*white-space: nowrap;*/
    }
    /*.secure .top-navigation{top:0px !important;}*/
    .secure .navbar-header img {
        display: inline-block;
        vertical-align: inherit;
    }
    /*.secure .m-t-45 {margin-top:20px !important;}*/
    .secure .navbar-header .navbar-brand {
        display: block !important;
    }
    .customer-service-modal .modal-dialog  {
        width: 60%;
        margin: 2% auto;
    }
    .secure .plt{font-size:10px !important; width:auto !important; padding: 0 12px;}
    #account-summary .payment-options .payment-box{float:none; width:100% !important; margin: 0 auto;}
    #account-summary .payment-method{font-size:14px;}
    #account-summary .payment-method{font-size:10px; clear:both;margin:0 auto;width:90%;padding:2px;}
   #payment-page #cc-payment-form  .col-md-6, #payment-page  #ec-payment-form  .col-md-6, #payment-page  #arp-payment-form  .col-md-6 {padding-left: 0px !important;}
 .payment-confirmation-page a.print-preview {
    width:145px !important;
    }
 #auto-insurance-form label{text-align:left;}
 #insurance .radio-inline {margin-left:10px;}
 .payment-table-page .paymentAmount{min-width:73px !important;}
 
}

/*-- customer service dialog --*/
.customer-service-modal .modal-body div {
    width: 100%;
    text-align: center;
    color: darkblue;
    font-size: 17px;
    font-weight: bold;
}

.font24 {
    font-size: 24px;
}
#payment-page .show-on-error, .show-on-error #invalidCardNumber, .show-on-error #invalidCardType, .show-on-error #invalidCVV, .show-on-error #invalidBankRouting, .show-on-error #invalidBankAccNumber, .creditcard-validation .log{display:none;}

.customer-service-modal .blue-border {
    border: solid 6px darkblue;
    border-radius: 23px;
}
/*-- customer service dialog end --*/
/*.secure .m-t-45 {margin-top:45px;}*/

/*-- payment dialog --*/
.ccpayment-confirmation-wrapper .info {
    font-size: 14px;
    text-align: left;
    padding: 2px 0 2px 10px;
}

.ccpayment-confirmation-wrapper .heading {
    font-size: 14px;
    text-align: left;
    padding: 2px 0 2px 0px !important;
    font-weight: bold;
    line-height: 30px !important;
}
/*-- payment dialog end --*/
.secure .fa-cog {
    float: right;
    color: white;
    margin-left: 4px;
    font-size: 19px;
}

input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
    background-color: #f9fafb;
    color: #555;
}

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 50px #f9fafb inset; /* Change the color to your own background color */
    -webkit-text-fill-color: #555;
}

    input:-webkit-autofill:focus {
        -webkit-box-shadow: 0 0 0 50px #f9fafb inset;
        -webkit-text-fill-color: #555;
    }

.credit-cards .card {
    color: #7a0918;
    font-size: 24px;
}
.secure .payment-table-page .curr_bal{float:right;font-weight:bold;}
.secure .payment-table-page .apply-discount{width:90%; margin-left:5px !important;}
.secure #payment-page .col-lg-6, .secure .payment-confirmation-page .col-lg-6{margin: 0 auto; float:none;}
.secure .payment-confirmation-page .email-success{text-align:center; width:100%;}
.secure .plt{margin: 10px; font-size:14px; font-weight:bold;}
.secure #payment-page .total-amount{float:right;}
.payment-confirmation-page .center, #payment-page .center{text-align:center;}
.payment-confirmation-page a.print-preview {
    /*background: url(/Assets/hbcs/global/lib/print/css/images/icon-print-preview.png) no-repeat 0 0;*/
    background: url(/images/icon-print.png) no-repeat 0% 46%;
    cursor: pointer;
    display: block;
    margin: 10px auto;
    padding: 0 0 0 35px;
    line-height: 26px;
    width:190px;
    text-decoration:underline;
    color:#32465b;
}
.secure #payment-page .go-back{width:49%; margin:0 auto;}
.secure #payment-page .errors-panel{float:left;}

#account-summary .payment-option-btn{width:100%;}
#account-summary .payment-options .payment-box{margin:0 auto; float:right; min-width:250px;}
#account-summary .payment-options .center{text-align:center;}
.secure #payment-page .payment-summary{width:100%; margin:0 auto;}
.help{font-size:16px;color:#64d4e4;position:absolute;top:0;width:34px;height:34px;line-height:34px;cursor:pointer;right:-22px !important;text-decoration:none !important;}

.hbcs-panel-heading{
    background-color: #32465b !important;
    border-color: #e4eef0 !important;
    color: #fff !important;
}

.assistance-video{
    max-width: 80%;
    height: auto;
}

.header-top.navbar {
    min-height: 90px;
}

.header-top .navbar-toggle .icon-bar {
  background: #ADB5BD;
}
.header-top .navbar-toggle:hover {
  background-color: #eef4f5;
}
.header-top .navbar-toggle:hover .icon-bar {
  background: #000;
}
.header-top .navbar-nav > li {
    margin: 20px 0 20px 0;
}
.header-top .navbar-nav > li > a {
  padding-top: 14px;
  padding-bottom: 14px;
  color: #ADB5BD;
}

.header-top .navbar-nav-xs > li > a {
  padding-top: 14px;
  padding-bottom: 14px;
  line-height: 20px;
  color: #ADB5BD;
}

.header-top .navbar-nav-xs > li > a:hover,
.header-top .navbar-nav-xs > li > a:focus {
  color: #000;
  background-color: #eef4f5;
}

.top-navigation .navbar-nav > li > a:hover,
.top-navigation .navbar-nav > li > a:focus {
  text-decoration: underline;
}

.top-navigation .navbar-nav.magic-nav {
  font-size: 0;
  white-space: nowrap;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  text-decoration: underline;
}

.alert-danger {
  margin-bottom: 0;
}

#accounts-form .table > thead > tr > th:first-of-type {
    width:14%;
}

input[type=number]#AccountNumber {
    -moz-appearance: textfield;
}

input[type=number]#AccountNumber::-webkit-inner-spin-button, 
input[type=number]#AccountNumber::-webkit-outer-spin-button { 
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0; 
}

.header-links a {
    color: #7f888f;
}

#pswd_info > ul {
    text-align: left;
    list-style-position: inside;
}

.modal-content {
    text-align: center;
}

.spinner-container {
    position: relative;
    width: 0;
    float: right;
}

.btn-main {
    padding-right: 30px;
    padding-left: 30px;
}

.btn-main .fa {
    display: none;
    position: absolute;
    right: -20px;
}
#OTPFullServiceSubmitButton .fa{
    right:14px !important;
}
.align-right{
    text-align: right;
}
.align-left{
    text-align: left;
}
#account-summary .email-section, #account-summary #estatements-submit-btn{visibility:visible;}

.wrapper.nav-top {
    padding-top: 90px;
}

/* changes to default styling to force mobile view at 1199px, desktop at 1200px*/
@media (min-width: 1200px) {
    .navbar-nav > li {
        float: none;
        display: inline-block;
        font-size: 14px;
    }
    li.user-profile.dropdown{
        position: static;
    }
    .nav > li > a.mobile-only {
        display: none;
    }
    .container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header {
        text-align: right;
        /*white-space: nowrap;
        overflow: hidden !important;*/
    }
    #LogoutForm{
        display: inline-block;
    }
    .navbar-right .dropdown-menu {
        top: auto;
        right: 10px;
    }
    .header-top .navbar-nav-xs {
        display: none;
    }
}

@media (max-width: 1199.999px) {
    #headerNavbarCollapse{
        display: none !important;
    }
    .top-navigation{
        height: auto;
    }
    #topNavbarCollapse{
        display: none !important;
    }
    #topNavbarCollapse.in, #topNavbarCollapse.collapsing{
        display: block !important;
    }.secure .navbar-header img{
        vertical-align: middle;
    }
    .header-top .navbar-toggle {
        display: inline-block;
        float: none;
        vertical-align: middle;
    }
    .header-top .navbar-nav-xs {
        float: none;
        position:absolute;
        right: 0;
        top: 20px;
        display: inline-block;
    }
    .navbar-header {
        float: none;
    }
    .navbar-nav>li{
        float: none;
    }
    #account-summary .payment-options .col-lg-1{width:32%;}
}

/* reducing some padding & margins on very small devices*/
@media (max-width: 480px) {
    .navbar-header .nav.navbar-nav-xs{
        padding-right: 0;
    }
    .navbar-toggle{
        margin-right: 2px;
    }
    .secure .navbar-header img{
        padding-right: 0px !important;
        margin-right: 2px;
    }
    .navbar-header>.nav>li>a{
        padding-left: 10px;
        padding-right: 10px;
    }
}

/* prevent header from wrapping under 320px*/

@media (max-width: 320px) {
    .nav-top .header-top .navbar-header{
        width: 320px;
        overflow: hidden;
    }
}

#datatable th, 
#datatable td,
#payment-summary-datatable th, 
#payment-summary-datatable td,
#itemizedBillDatatable th,
#itemizedBillDatatable td {
    padding-right: 12px;
    text-align: center;
}

.row-no-margins, .row.row-no-margins {
    margin-left: 0;
    margin-right: 0;
}
.component-wrapper{
    background: #fff;
}
.component-wrapper > .panel-body {
    padding-bottom: 0;
}

.component-wrapper:last-of-type > .panel-body {
    padding-bottom: 15px;
}
#itemizedBill .selection-checkbox{height:14px;}
#estatements .table-responsive{width:100%;}
.alertxx{position:absolute;top:2px; right:0;z-index:2;width:34px;height:34px;text-align:center;cursor:pointer;font-size:14px;}
#alert-wrapper .link{border:none !important;}
#alerts-dialog{display:none;}
#mobile-alert-modal .alertxx{right:-35px;}
#mobile-alert-modal .user-list-wrap{display:table;width:100%; text-align:left;}
#mobile-alert-modal .detail{position: relative;width:90%;}
#mobile-alert-modal .text-normal{font-size: 14px;}
#mobile-alert-modal .modal-body{padding:16px 0px 7px 0px;}
#mobile-alert-modal #alert-wrapper{padding:0px 0px 0px 24px;margin-bottom:0px;}
.navbar-nav-xs .mobile-alerts{display:none;}
.click-to-call .col-lg-6{float:none;margin: 0 auto;}
.click-to-call .submit{margin:0 auto; float:none;}
.click-to-call .remove-sign{position:absolute;top:0px;left:74%;border:solid 1px lightgray;padding:6px;}
.click-to-call .click-to-use{position:absolute;top:0px;left:74%;border:solid 1px lightgray;padding:6px;width:90px;}
.click-to-call .text-box{width: 74%;}
.top-navigation{position:relative;top:auto;right:auto;bottom:auto;left:auto;}
.navbar-toggle{margin-right:5px;}
#cc-payment-form #CreditCardPayment_SelectedExpMonth,
#cc-payment-form #CreditCardPayment_SelectedExpYear, 
#cc-payment-form #CreditCardPayment.State,
#cc-payment-form #CreditCardPayment_CardType{padding-right:5px;padding-left: 5px;}
#itemizedBillDatatable > thead > tr > th:first-of-type, #itemizedBillDatatable > tbody > tr > td:first-of-type {width:14%;}
#itemizedBill-form .errors-panel{float:none;}
#payment-page .progess-status{clear:both; display:none; overflow-x:auto;}
#payment-page .progess-status .loading{display:none;}
.text-red{color:red;}
#view-confirmation-btn{display:none;}
#insurance .for3-control{width:100%;}
#insurance .fa-asterisk{
    color: darkgray;
    font-size: 7px;
    vertical-align:top !important;
}
.estatements-optin{display:none;clear:both;}
#profile-status{display:none;}
#paperlessbilling-status{display:none;}
.payment-options .tr-payment-option{display:none;}
.es-laoder .fa-cog{color:gray}
.es-laoder{float:left;}
.label-warning{color:#8a6d3b;background-color:#fff4bd;font-weight:700; font-size:12px;}