@media (max-width: 1440px) {
    .row.account-btn-row.contentSec {
        transform: none !important;
        left: -12px !important;
    }
    /* .menu-title {
        font-size: 16px !important;
    }
     */
    /* .bottom-row-menu-anchor img {
        height: 6.313vh !important;
        bottom: -2px !important;
    } */
    .bottom-row-menu-sub li {
        font-size: 2vh !important;
    }
    
    ul.bottom-row-menu-sub {
        top: -134px !important;
    }
    body .card-list .card-area-account {
        height: 39vh;
        background-size: 100% 39vh !important;
    }
    body .pbk-debit-card-new {
        height: 39vh;
        background-size: 100% 39vh !important;
    }


    .login-form-wrap {
      padding-top: 10px !important;
      padding-bottom: 0px !important;
  }
  /* .zakat-calculator-area-page div input {
    padding: 8px 16px;
    font-size: 11px;
    border-radius: 4px;
} */

body .pbk-label {
    font-size: 10px !important;
}

.dashboard-panel .dashboard-area-nav .logo-area  img {
    height: 90px !important;
}

/* .pbk-pass-area-nre .eye {
    top: 25% !important;
} */
.pbk-input-field {
    font-size: 16px !important;
    padding: 1.5vh 1.3vw !important;
}
  .logo-area img {
      height: 71px;
      margin-top: 8px;
  }
  
  .login-half-area img {
      height: 300px !important;
      width: 380px !important;
      object-fit: fill;
  }
  
  .login-half-area {
      top: 20%;
  }
  
  .main-heading {
      font-size: 20px !important;
      margin-bottom: 6px !important;
  }
  
  .login-form .form-label {
      font-size: 12px !important;
  }
  
  .login-form .form-control {
      font-size: 14px !important;
      padding: 14px 15px !important;
  }
  
  .username-area {
      margin-bottom: 10px !important;
  }
  
  .pass-area {
      margin-bottom: 10px !important;
      position: relative !important;
  }
  
  /* .eye {transform: none !important;
    top: 25% !important;} */
  
  /* .login-rownew-pbk-new .eye {
    top: 50% !important;
} */
/* .slideContainer .eye {
    top: 50%;
} */
  
  .form-check-label {
      font-size: 12px !important;
  }
  
  .forgot-pass-cta a {
      font-size: 12px !important;
  }
  
  .form-check {
      margin-bottom: 0px !important;
  }
  
  .divider-area-2 {
      display: none;
  }
  
  .login-form-area-wrap .btn.btn-primary {
      margin-bottom: 10px !important;
      font-size: 14px !important;
      padding: 15px !important;
  }
  
  .join-now-area {
      font-size: 14px !important;
      padding: 15px !important;
      margin-bottom: 10px !important;
  }
  
  .form-btm-menu ul.btm-menu {
      margin-bottom: 0px !important;
      padding-bottom: 0px !important;
      margin-top: 15px !important;
  }
  .login-half-area::after {
      content: none !important;
  
  }


  /* ccorprate login */


.corporate .main-heading {
    font-size: 2vw !important;
}

.corporate .login-form-wrap {
    padding: 9.4241vh 5.57812vw;
    padding-bottom: 7.53927vh;
}

.corporate .logo-area img {
    height: 90px;
}

.corporate  .login-form .form-label {
    font-size: 80% !important;
}

.corporate .login-form {
    padding-bottom: 0px;
}




  }
@media (max-width: 1400px) {
    .cards-row {
        padding-left: 22.40625vw !important;
        padding-right: 22.40625vw !important;
        padding-top: 5.71204vh !important;
    }
        .small-area-para {
        width: 50% !important;
    }
        .back-btn-area.wizard {
              left: 9vw !important;
        top: 50px !important;
    }
    .registerViewConOTP .reg-col-wrap .login-form-wrap .login-form-area-wrap {
    height: 375px !important;
    overflow: hidden;
    overflow-y: auto;
    scrollbar-width: none;
}
}
@media (max-width: 1024px) {

.pbk-manageCards-slide {
    margin-top: 0px !important;
}

.pbk-manageCards-slide .card-list li {
    height: fit-content !important;
    padding-top: 0px !important;
}

    /*
    new css responsive
    */


    .tab-area-item-with-imgs {
        padding-left: 73px !important;
    }


.container .account-card-stack {height: 13.561vh !important;}

.container .account-card-stack .card-list li {
    height: 13vh !important;
}

.dashboard-upper-body .account-btn-row {
    padding-top: 7vh !important;
}

.account-area-row .notif {
    bottom: 22px;
}

ul.bottom-navigation {
    padding-left: 40px;
    padding-bottom: 28px;
}

.row.dashboard-upper-body.mainDashboard.dash-pos .col-md-8 {
    width: 80%;
}

.row.dashboard-bottom-body {
    padding-right: 5%;
}


   /*
    new css responsive end
    */



    .navarea-wrap ul li {
        padding: 15px 8px;
        display: inline-block;
    }

    h2.account-statment-gen-title {
        font-size: 3.5vw;
    }

    .select-month select {
        font-size: 2.125vw;
        padding: 1.4vh 3vw;
    }

    .download-area-wraper-statment {
        padding-top: 4vh;
    }

    .download-area-wraper-statment ul.expport-option li.export-option-item {
        font-size: 2.5vw;
        padding: 1.4vh 2vw;
    }

    .download-area-wraper-statment .download-area a {
        font-size: 2.5vw;
    }

    .download-area .date-area svg {
        width: 4.75vw;
        height: 3.3vw;
    }

    .download-area {
        margin-bottom: 3vh;
    }

    a.download-statment {
        font-size: 2vw;
    }

    .action-area {
        width: 58%;
    }

    /* 
    .divider-area {
        height: 3vh;

        font-size: 2vw;
        line-height: 37px;
    } */

    .col-md-2.hidden-col-as {
        display: none;
    }

    .row.form-row.new-form-row .col-md-2 {
        width: 33%;
        overflow: visible !important;
    }

    .mb-3.submit-area {
        margin-top: 3vh;
        margin-left: 25vw;
    }

    .mb-3.submit-area input {
        font-size: 2vw;
    }



    .searchbox-area input#searchbox {
        font-size: 1.8vw;
    }

    .header-main-heading {
        font-size: 2vw;
    }

    .services-box-header {
        font-size: 2.9375vw;
    }

    .serv-icon-area svg {
        width: 4.5vw;
        height: 3.5vw;
    }

    .service-meta {
        font-size: 1.9375vw;
    }

    .new-bottom-body {
        padding-top: 9vh;
        padding-left: 3vw;
    }

    .datra-defination {
        font-size: 2vw;
    }

    .section-header {
        font-size: 2.69vw;
    }

    .blue-cta {
        font-size: 1.9375vw;
    }


    .off-canvas-area-header {
        font-size: 3.6875vw;
    }

    .off-canvas-area-wraper .container {
        max-width: 960px !important;
    }

    .row.new-trans-cards-row .col-md-6 {
        width: 76%;
    }



    .row.new-trans-cards-row .col-md-6 .row .col-md-6 {
        width: 50%;
    }

    .off-canvas-area-wraper .back-btn-area {
        top: 3.3vh;
    }

    .form-row input {
        font-size: 1.75vw;
    }

    .form-row input::placeholder {
        font-size: 1.4vw;
    }

    .form-row .col-md-8 {
        width: 90%;
    }





















    /* .login-anim-col {
        display: none;
    } */

    .login-half-area {
        display: none !important;
    }


    .logo-area .col-md-7 {
        width: 100% !important;
    }

    .bottom-row-menu {
        margin-left: 0vw;
    }

    .bottom-row-menu-anchor img {
        height: 3.4vh;
    }

    .menu-title {
        font-size: 1.3vh;
        padding-left: 2vw;
    }

    .login-rownew .col-md-7 {
        /* width: 100%; */
    }

    .main-heading {
        padding-top: 7vh;
        text-align: center;
    }

    .registerView .main-heading {
        padding-top: 0;
    }

    .registerView .text-area-wrap {
        padding-top: 1vh;
    }

    .login-form-area-wrap {
        width: 80%;
        margin: auto;
    }

    .login-form .form-label {
        font-size: 16px;
    }

    .copy-right-area p {
        text-align: center;
    }

    .login-form-area-wrap .btn.btn-primary {
        font-size: 21px;
        padding: 20px;
    }

    .join-us-btn {
        opacity: 1;
    }

    .registerViewCon {
        left: initial;
        /* right: 0; */
    }

    /* .divided-se {
        font-size: 24px;
    } */

    .join-now-area {
        padding: 20px;
        font-size: 21px;
    }



    .cards-row {
        padding-left: 15.40625vw !important;
        padding-right: 15.40625vw !important;
        padding-top: 5.71204vh !important;
    }

    .small-area-para {
    width: 50% !important;
}
    .card-area-wrap {
        width: 76%;
    }

    .card-area-wrap img {
        width: 100%;
    }

    .small-area-para {
        width: 50%;
    }

    .text-area-wrap {
        padding-top: 2.71204vh;
    }

    .join-us-btn {
        font-size: 1.586vh;
    }





    .reg-area-row-wrap {
        padding: 4vh 6vw 8vh 13vw;
    }

    .reg-col-wrap .login-form-wrap .login-form-area-wrap {
        width: 100% !important;
    }

    .dark-area .main-heading {
        text-align: left;
    }

    .dark-area .main-heading br {
        display: none;
    }

    .light-para {
        width: 90%;
    }



    img.card-area-col.card-img-new {
        width: 30vw;
    }

    .card-area-wrap-right img {
        width: 30vw;
    }

    .card-area-wrap-right {
        top: 49px;
        left: 25px;
    }

    .dark-area {
        height: 100vh;
    }

    .back-btn-area span svg {
        height: 2.7vh;
    }

    .back-btn-area {
        left: 0;
    }

    /* .back-btn-area span svg {
        height: 3vh;
        width: 2.6vw;
    } */
    .login-form .form-control {
        padding-left: 1.3vw;
    }


    .full-center-layout .centered-heading {
        text-align: center;
        padding-top: 0vh;
    }

    .otp-input-row {
        padding: 0vh 27vw;
    }

    .full-center-layout .reg-area-row-wrap {
        padding: 9vh 6vw 8vh 4vw !important;
    }

    .top-icon-area img {
        width: 12vw;
    }

    .otp-form .btn-primary {
        width: 45% !important;
    }

    .full-center-layout {
        background-position: center;
    }

    .anim-icon-wrap .anim-icon {
        padding: 2.5vh 5.5vw;
    }

    .anim-icon-wrap .anim-icon svg {
        height: 12.425vh;
        width: 11.688vw;
    }

    .icon-anim-row .col-md-6 {
        padding: 0vh 11.8vw;
    }

    .cards-row .divider-area .divided-se {
        height: 3vh;
        width: 4.5vw;
    }

    .recovery-form .back-btn-area {
        left: -25vw;
        top: -1vh;
    }

    .left-logo img {
        padding-left: 5vw;
    }


    .circle {
        width: 17.579vw;
        height: 17.579vw;
        box-shadow: inset 0 0 0 1.3vw #EDF9CD;
        margin: 0 auto;
    }

    .circle:hover {
        box-shadow: inset 0 0 0 2.8vw #EDF9CD;
    }

    .circle svg {
        height: 9.766vw;
        width: 9.766vw;
    }

    .icon-anim-row .col-md-6 {
        padding: 0vh 15vw;
    }

    .cards-row .divider-area {
        top: 8vh;
    }

    .dark-area::after {
        display: none;
    }


    .dashboard-area-nav .logo-area img {
        height: 7vh;
    }

    .dashboard-area-nav {
        padding-left: 2vw;
        padding-right: 0vw;
        padding-top: 2vh;
    }

    .bottom-navigation {
        /* padding: 0 20vw 0 11vw !important; */
        position: relative;
        top: 1vh;
    }

    .bottom-navigation li {
        padding: 2vh 1vw !important;
    }

    .top-navigation {
        padding-bottom: 0vh;
        position: relative;
        top: 1vh;
    }

    .dashboard-area-nav::before {
        width: 19%;
        right: -1.2vw;
    }

    .container .account-card-stack {
        height: 18.561vh;
    }

    .container .account-card-stack .card-list li {
        height: 17.954vh;
    }

    .sidebar-nav li a {
        font-size: 1.2vw;
    }

    .sidebar-nav li {
        margin-bottom: 1vh;
    }

    .datra-defination {
        font-size: 1.5vw;
        padding: initial;
        /* padding-left: 3.5vw; */
    }

    .data-status::after {
        display: none;
    }

    .account-btn-row {
        width: 94%;
    }

    .make-payment .recent-benif-meta {
        margin-bottom: initial;
    }

    /* .col-1.datra-defination.expand-icon{
        width: 1%;
    } */

    .heading-row .table-header {
        font-size: 1.7vw !important;
    }

    .expand-icon svg {
        width: 3vw;
        height: 2.5vw;
        margin-top: 10px;
    }

    .data-row.active.expanded {
        padding-bottom: 10vh;
    }


    .recent-beif-area::before {
        width: 85%;
    }

    .recent-benif-col.benfsource-primer-bank:before {
        width: 3vw !important;
        height: 4vh;
        background-size: 4vw;
    }

    .benif-row .recent-benif-col .recent-benif-col h2 {
        font-size: 2.4vw;
    }

    .recent-benif-meta {
        font-size: 1.3vw;
    }

    .recent-beif-area::before {
        top: 23vh;
    }

    .tabs-row .tab-content-wrap {
        padding-left: 6vw;
    }

    .transger-form-divider-area {
        padding-right: 16%;
    }

    .tab-area-item {
        font-size: 2.5vw;
    }

    .option-details {
        font-size: 2.2vw;
    }

    .icon-area-options svg {
        width: 2.344vw;
        height: 4.344vw;
    }

    .tab-title {
        font-size: 2.5vw;
        margin-bottom: 0px;
    }

    .transfer-form-row .form-label {
        font-size: 2vw;
    }

    .account-details-area .account-title {
        font-size: 1.7vw;
    }

    .account-details-area .account-number {
        font-size: 1.5vw;
    }

    span.select2-selection.select2-selection--single {
        font-size: 2vw;
    }

    #selectedAccountBalance {
        font-size: 1.5vw;
    }

    .transfer-from-btn {
        font-size: 2.3vw;
    }


    .centerd-form {
        width: 80%;
    }

    .back-btn-area.wizard {
        left: 7vw !important;
        top: -50px !important;
    }

    .registerViewCon .back-btn-area.wizard {
        left: 7vw;
        top: 10vh;
    }


    .otp-num {
        font-size: 2vh !important;
    }

    .back-btn-area a {
        font-size: 1.2vh;
    }


    .account-info-col {
        height: 24vh;
    }

    .card-area-account {
        height: 24vh;
        padding: 1vh 2vw;
    }

    ul.account-detils-info-area li.account-info-item strong {
        font-size: 1.7vw;
    }

    ul.account-detils-info-area li.account-info-item span {
        font-size: 1.7vw;
        margin-left: 3vw;
    }

    .account-details-body {
        padding: 2.1vh 2vw;
    }

    p.short-descp {
        font-size: 1.85625vw;
    }

    h4.balance-amount {
        font-size: 2.4vw;
    }

    .copy-icon-area svg {
        height: 2.125vw;
        width: 4.22vw;
    }

    .bank-header {
        font-size: 2.4vw;
    }

    .debit-icon-area svg {
        height: 2.735vw;
        width: 4.453vw;
    }

    .card-title-name {
        font-size: 1.6vw;
    }

    .expiry-date-card {
        font-size: 1vw;
        margin-left: 8px;
    }

    .card-number {
        font-size: 1.7vw;
    }

    .brand-icon svg {
        width: 2.89vw;
        height: 2.172vw;
    }

    .brand-icon {
        right: 16px;
        top: 2vh;
    }

    .amount-wraper p {
        font-size: 1.5vw;
    }


    .mb-3.submit-area input {
        font-size: 2vw;
    }


    .bottm-bar {
        position: relative;
    }

    .slitBg {
        display: none;
    }

    .submit-area {
        width: 100%;
    }


    .footer-icon-area {
        float: unset !important;
        /* margin-left: 65px; */
    }


    .row.fotter-info-area .col-md-4 {
        width: 50%;
        text-align: center;
    }

    .hiddenonmob {
        display: none;
    }





}




@media (max-width: 920px) {

    .account-details-body {
        padding-top: 1vh;
    }

    .dashboard-area-nav .profileDetails {
        min-width: initial;
        display: inline-block;
        margin-top: 7px;
    }

    .dashboard-area-nav .profileDetails h4 {
        display: none;
    }

    .dashboard-area-nav .profileDetails .profileIconDp {
        display: inline-block;
    }


    .bottom-navigation {

        padding: 0 60px 0 80px;

    }

    .dashboard-area-nav {
        padding-top: 1vh;
    }

    .bottom-navigation {
        top: 2vh;
    }

    .top-navigation {
        top: 2vh;
    }

    .sidebar-nav li a {
        font-size: 1.6vw;
        line-height: 1;
    }

    .account-header {
        font-size: 2.75vw;
    }

    h4.account-details {
        font-size: 1.3vw;
    }

    .card-meta-wrap {
        margin-top: 1.7vh;
    }

    .container .account-card-stack svg {
        width: 2.032vw !important;
        height: 2.0743vh;
    }

    .available-balance-title {
        font-size: 2.125vw;
    }

    .balnce {
        font-size: 3.25vw;
    }

    .progress-container .progress-label {
        font-size: 1.4vw;
    }

    .progress-container {
        margin-bottom: 0.6vh;
    }

    .progress-container progress {
        width: 56%;
    }

    .container .account-card-stack {
        margin-top: 9vh;
    }

    #date-range-picker {
        width: 10vw;
        font-size: 1.5vw;
    }

    .account-btn-row .col-md-3 {
        padding-right: 0vw;
    }

    .icons-btn-met {
        font-size: 1.2vw;
    }

    .section-header {
        font-size: 2.69vw;
    }

    .drop-icon-area svg {
        width: 2.5vw;
        height: 2.8vh;
        margin-left: 0.5vw;
        cursor: pointer;
    }

    .section-sub-header {
        font-size: 1.7vw;
    }


    .blue-cta {
        font-size: 1.9375vw;
    }



    .blue-cta .cta-icon svg {
        width: 2.3vw;
        height: 2.1vw;
    }

    .copyright-area p {
        font-size: 1.65625vw;
    }

    /* .row.fotter-info-area {padding-right: 4vw;} */
    .bottm-bar .col-md-9,
    .bottm-bar .col-md-3 {
        width: 100%;

    }



    .login-form-wrap {
        padding-bottom: 13.53927vh;
    }


    .card-area-wrap img {
        height: 16.169vh;
    }

    .cardanimwrap img {
        height: 13.854vh;
    }

    .join-us-btn {
        font-size: 1.286vh;
        padding: 1.24vh 1.92vw;
    }

    .dark-area label.form-label {
        font-size: 1.93vw;
    }

    .reg-col-wrap .login-form-wrap {
        padding-top: 0vh;
        padding-bottom: 12vh;
    }

    .dark-area {
        background-position: center;
    }

    .reg-area-row-wrap {
        padding: 4vh 6vw 8vh 6vw;
    }

    .dark-area .main-heading {
        padding-top: 4vh;
    }

    .back-btn-area {
        top: 0;
    }

    .back-btn-area span {
        bottom: 3px;
    }

    .login-form .form-control {
        padding-left: 1.3vw;
    }

    .anim-icon-wrap .anim-icon {
        padding: 2vh 5.5vw;
    }





}

@media (max-width: 768px) {
    .cards-row .divider-area {
    display: none;
}

.small-area-para {
    font-size: 14px !important;
    padding-top: 10px !important;
}

.cards-row {
    padding-top: 30px !important;
}


.cardanimwrap img {
    height: 120px;
}

.card-area-wrap img {
    height: 120px !important;
}

.card-descp {
    margin-top: 0px !important;
    margin-bottom: 20px !important;
}

.join-us-btn {
    font-size: 11px !important;
    padding: 9px 19px !important;
}
.small-area-para {
    font-size: 12px;
    padding-top: 10px;
}
    .login-anim-col{
        display: none;
    }
    .empty-btm-bar {
        padding: 0px !important;
    }

    .bottom-row-menu-anchor img {
        height: 3.6vh !important;
    }
    
    p.menu-title {
        font-size: 1.5vh !important;
    }
    
    .bottom-row-menu-item {
        padding: 2.5vh 1.169994vw !important;
    }
    
    .fotter-info-area {
        padding: 17px 0px !important;
        padding-bottom: 0px !important;
    }

    .setDpPos {
        justify-content: center !important;
    }
    
    .profileInfoContainer .subACtitle {
        width: 77% !important;
        margin: auto !important;
    }
    
    .profileInfoContainer .titleContainer {
        margin: auto !important;
    }
    
    .trade-finance-area-upper-area .col-md-3 {
        width: 30% !important;
    }
    body .trade-finance-area-upper-area.loan-area-upper-area .col-md-3{
        width: 30% !important;
    }
    
    .loan-area-upper-area {
        padding-left: 6% !important;
    }
    
    .loan-area-upper-area .icon-btns {
        padding-bottom: 30px !important;
        padding-top: 30px !important;
        min-height: auto !important;
    }
    
    .loan-area-upper-area .icon-btns a div {
        font-size: 9px !important;
    }
    
    .banner-finance-body {
        padding-left: 4% !important;
        padding-right: 4% !important;
    }
    
    .tabs-banner-area {
        padding: 30px 40px !important;
        height: 100vh;
    }
    
    .tab-content-wrap {
        padding: 35px 28px !important;
    }
    
    
    .horizontal-tabs-pbk {
        display: block !important;
    }
    
    li.horizontal-tabs-pbk-item {
        margin-bottom: 20px !important;
    }
    
    .wizard-area-steps {
        display: block !important;
    }
    
    li.wizard-area-step {
        margin-bottom: 30px;
    }



    /*
    new responsive css 
    */
    h2.march-cat-title {
        font-size: 14px !important;
    }
    body .deposit-options {
        display: block !important;
    }
    
    .deposit-option {
        margin-bottom: 15px !important;
    }
    body.details-grid {
        display: block !important;
    }
    
    .details-grid{
        display: block !important; 
    }
    
    .detail-item {
        width: 100% !important;
    }

.tab-title {
    font-size: 24px !important;
}
    h2.section-header {
        padding-left: 9vw !important;
    }
    
    p.section-sub-header {
        padding-left: 9vw !important;
    }
    
    .recent-beif-area {
        padding-left: 9vw !important;
    }
    
    .tab-area-item {
 
        margin-bottom: 0px !important;
    }
    
    .tab-title {
        text-align: center !important;
        font-size: 18px !important;
    }
    
    #selectedAccountDetails, #selectedAccountDetailsTo {
        padding: 1.5vh 3.8vw !important;
    }
    
    .account-details-area-row #selectedAccountBalance {
        padding-left: 4.8vw !important;
    }
    
    .fieldLft {
        width: 22% !important;
        display: flex !important;
        justify-content: center !important;
    }


    .off-canvas-area-wraper {
        width: 100% !important;
    }
    
    .off-canvas-area-header {
        font-size: 21px !important;
    }
    .new-trans-cards-row .col-md-4 {
        margin-bottom: 20px !important;
    }

    
    .blue-cta {
        text-align: center;
        font-size: 16px !important;
        padding-bottom: 20px;
    }
    
    
    .blue-cta .cta-icon svg {
        width: 5.1vw !important;
        height: 5.1vw !important; 
    }

    .decp-area-col {
        display: none;
    }
    
    .trans-area-col {
        flex: 0 0 auto;
        width: 33.333333%;
    }
    
    .data-transfertype {
        display: none;
    }
    
    .data-benif {
        width: 33.33%;
    }
    
    .data-area-col {
        width: 25%;
    }
    
    .runing-bal-area-col {
        display: none;
    }
    
    .heading-row .table-header {
        width: 25%;
        font-size: 12px !important;
    }
    
    .row.data-row .datra-defination {
        width: 25%;
        font-size: 12px;
        padding-right: 10px !important;
    }
    
    .data-row {
        padding: 8px 14px;
        align-items: center;
        justify-content: space-evenly;
    }
    .data-balance {
        display: none;
    }


    .row.data-row .col-1.datra-defination.expand-icon {
        width: 30% !important;
    }
    .download-area .date-area svg {
        width: 4vw !important;
        height: 4.3vw !important;
        vertical-align: bottom;
    }
    
    
    .download-area a {
        font-size: 2.35vw !important;
    }
    
    h4.transfer-details {
        font-size: 2.vw !important;
    }
    
    .transfer-id {
        font-size: 1.5vw !important;
    }
    
    .amount-area {
        font-size: 1.5vw !important;
    }
    
    .benif-title {
        font-size: 2.5vw !important;
    }
    
    .transfer-type-bank-account {
        font-size: 2vw !important;
    }
    .row.data-row .col-1.datra-defination.expand-icon svg {
        width: 4vw ;
        height: 4.5vw;
        margin-top: 0px;
    }


    body {
        overflow-x: hidden;
    }
    .dashboard-upper-body {
        padding-top: 5vh !important;
    }
    .container.new-tiles-container {
        padding-left: 15% !important;
    }
    .balance-area-wrap {
        padding-top: 4vh !important;
        margin-bottom: 1vh !important;
    }
    
    .dashboard-upper-body .account-btn-row .col-md-3 {
        width: 46% !important;
        margin-right: 9px !important;
        margin-left : 0px !important;
    }
    .dashboard-area-nav .profileDetails {
        display: inline-block !important; 
        min-width: fit-content !important;
        left: 0px !important;
        top: 35px !important;
    }



    .recent-transaction {
        padding-left: 10% !important;
    }
    
    .data-table-area {
        padding-left: 6% !important;
        padding-right: 5% !important;
    }




    .tab-area-item-with-imgs img {
        width: 18px !important;
        height: 18px !important;
    }
    
    
    .tab-area-item-with-imgs.tab-area-item {
        padding-left: 5.6vw !important;
    }
    

    

    .top-navigation {
        text-align: left;
    }
    
    .top-navigation li.nav-item {
        padding: 15px 12px;
    }
    
    ul.bottom-navigation {
        padding-right: 45px;
        padding-top: 15px;
    }
    
    ul.bottom-navigation li.nav-item {
        padding: 17px 9px !important;
    }
    
    .account-area-row .notif {
        bottom: -29px;
    }
    
    .dashboard-area-nav .profileDetails {
        margin-top: 0px;
        position: relative;
        left: 40px;
    }
    
    

    /*
    new responsive css end 
    */


    .account-details-body {
        padding-top: 1vh;
    }

    .setDpPos {

        display: flex;
        justify-content: center;
    }

    .setInfoPos .profileInfoContainer {

        margin: 20px auto;
        text-align: center;
    }



    .off-canvas-area-wraper .container {
        max-width: 720px;
    }

    .row.new-trans-cards-row .col-md-6 .row .col-md-6 {
        width: 50%;
    }

    .row.new-trans-cards-row .col-md-6 {
        width: 90%;
    }

    .form-row input {
        font-size: 2vw;
    }

    .form-row input::placeholder {
        font-size: 2vw;
    }

    .form-row {
        padding-right: 0;
    }

    .box-icons-off-canv {
        right: 2.4vw;
    }





    .bottom-row-menu-anchor img {
        left: 3vw;
        margin-bottom: 9px;
    }

    .bottom-row-menu {
        padding-left: 6vw;
    }

    /* .row.fotter-info-area {padding-right: 4vw;} */

    .login-form-wrap {
        padding-bottom: 13.53927vh;
    }


    .card-area-wrap img {
        height: 16.169vh;
    }

    .cardanimwrap img {
        height: 240px;

    }

    .join-us-btn {
        /* font-size: 1.286vh; */
        padding: 1.24vh 1.92vw;
    }

    .dark-area label.form-label {
        font-size: 1.93vw;
    }

    .reg-col-wrap .login-form-wrap {
        padding-top: 0vh;
        padding-bottom: 12vh;
    }

    .dark-area {
        background-position: center;
    }



    .reg-area-row-wrap {
        padding: 4vh 6vw 8vh 6vw;
    }

    .dark-area .main-heading {
        padding-top: 4vh;
    }

    .back-btn-area {
        top: 0;
    }

    .back-btn-area span {
        bottom: 3px;
    }

    .dark-area::before {
        left: -13%;
        transform: rotate(7deg);
        width: 12vw;
    }

    .top-navigation {
        margin-left: initial;
    }

    .bottom-navigation {
        padding: 0;
    }

    .bottom-navigation li {
        clip-path: none
    }

    .dashboard-area-nav {
        padding-top: 1vh;
    }

    .bottom-navigation {
        top: 0;

        width: 100%;
        text-align: center;
    }

    .top-navigation {
        top: 0;
        width: 100%;
        text-align: center;
    }

    .sidebar-nav li a {
        font-size: 1.6vw;
        line-height: 1;
    }

    /* .account-header {
        font-size: 2.75vw;
    }

    h4.account-details {
        font-size: 1.3vw;
    } */

    .card-meta-wrap {
        margin-top: 1.7vh;
    }

    .container .account-card-stack svg {
        width: 2.032vw !important;
        height: 2.0743vh;
    }

    .available-balance-title {
        font-size: 2.125vw;
    }

    .balnce {
        font-size: 3.25vw;
    }



    .progress-container .progress-label {
        font-size: 1.4vw;
    }

    .progress-container {
        margin-bottom: 0.6vh;
    }

    .progress-container progress {
        width: 56%;
    }

    .container .account-card-stack {
        margin-top: 9vh;
    }

    #date-range-picker {
        width: 10vw;
        font-size: 1.5vw;
    }

    .account-btn-row .col-md-3 {
        padding-right: 0vw;
    }

    .icons-btn-met {
        font-size: 1.2vw;
    }

    .section-header {
        font-size: 2.69vw;
    }

    .drop-icon-area svg {
        width: 2.5vw;
        height: 2.8vh;
        margin-left: 0.5vw;
        cursor: pointer;
    }

    .section-sub-header {
        font-size: 1.7vw;
    }


    .blue-cta {
        font-size: 1.9375vw;
    }



    .blue-cta .cta-icon svg {
        width: 2.3vw;
        height: 2.1vw;
    }

    .copyright-area p {
        font-size: 1.65625vw;
    }


}

@media (max-width: 767px) {

    /* Mobile Tab Selectors */

    
    .bottom-row-menu li.bottom-row-menu-item {
        width: 33% !important;
    }
    
    .pbk-app-icons-area-wrap {
        width: fit-content;
        margin: auto !important;
        margin-bottom: 21px !important;
        display: flex;
        justify-content: space-around !important;
        gap: 0px !important;
    }
    
    .pbk-app-icons-area-item {
        width: 45% !important;
    }
    
    .pbk-app-icons-area-item img {
        width: 83% !important;
    }
    
    .bottom-row-menu-area ul.bottom-row-menu-sub {
        top: -130px !important;
        height: 130px !important;
    }
    
    .bottom-row-menu-area ul.bottom-row-menu-sub li {
        font-size: 10px;
    }


    .mob_optns {
        width: 300px;
    }

    .mob_optns .sub_opt {
        display: none;
        position: absolute;
        width: 300px;
        z-index: 999;
        background: white;
        padding: 0;
        margin: 0;
        border-radius: 6px;
        box-shadow: 6.97386px 8.71732px 13.94772px 0px rgba(0, 41, 80, 0.05);
        left: 0;
        top: 45px;

    }

    .mob_optns>li {
        background: #fff;
        padding: 10px 20px;
        border-radius: 6px;
        box-shadow: 6.97386px 8.71732px 13.94772px 0px rgba(0, 41, 80, 0.05);
        cursor: pointer;
        position: relative;
    }

    .mob_optns>li:hover {
        background: var(--Primary-blue);
        color: var(--primary-text-color);
    }

    .mob_optns>li::before {
        position: absolute;
        right: 15px;
        content: url(../assets/imgs/drop-down.png);
        top: 10px;
    }

    .mob_optns>li span {
        display: block;
        ;
    }

    .mob_optns li:hover .sub_opt {
        display: block;
    }

    .benif-row .mob_optns .col-md-2 {
        width: 100%;
    }

    .benif-row .mob_optns .col-md-2:hover {
        background: #ecf5ff;
    }

    .benif-row .mob_optns .recent-benif-col .recent-benif-col {
        background-color: transparent;
        box-shadow: none;
        text-align: left;
        padding: 2px;
        border-radius: 0;
        margin-bottom: 0;
        min-height: initial;
    }

    .benif-row .mob_optns .recent-benif-meta {
        text-align: left !important;
    }

    .mob_optns .recent-benif-col.benfsource-primer-bank:before,
    .prmr-icon:before,
    .recent-benif-col.benfsource-fab-bank::before,
    .recent-benif-col.benfsource-emerites-bank::before {
        top: 10px !important;
        right: 5px !important;
        background-size: initial;
        width: 37px;
        height: 21px;

    }

    .benif-row .mob_optns .recent-benif-col a {
        border-bottom: 1px solid #ecf5ff;
        padding: 10px 5px;
        display: block;
    }

    .benif-row .mob_optns .recent-benif-col .recent-benif-col h2 {
        font-size: 16px;
    }

    .mob_optns .recent-benif-meta {
        font-size: 14px;
        margin-bottom: initial;
    }

    .mob_optns .recent-benif-col>img {
        width: 10%;
    }


    .viewAll {
        padding: 10px;
        text-align: center;
        display: block;
    }



    .benif-item-row .actions-row {

        display: none;
    }

    .card-area-wrap-right {
        display: none;
    }

    /* .recent-beif-area {
        width: 39%;
    } */

    .recent-beif-area::before {
        display: none;
    }

    .benif-row .recent-benif-col .recent-benif-col h2 {
        font-size: 6vw;
    }

    .benif-row .recent-benif-col .recent-benif-col {
        padding: 3vh 0.4vw;
    }

    .recent-benif-meta {
        font-size: 4vw;
        margin-bottom: 34px;
    }

    .recent-benif-col.benfsource-primer-bank:before {
        width: 39px !important;
        height: 4vh;
        background-size: 10vw;
    }

    .row.tabs-row {
        width: 90%;
        margin: auto;
        padding-top: 0px;
    }

    .tab-area-item {
        font-size: 4vw;
        padding: 4vh 2vw 4vh 10vw !important;
        margin-bottom: 0px;
    }

    .icon-area-options svg {
        width: 4.344vw;
        height: 7.344vw;
    }

    .tab-area-item .icon-area-options {
        left: 3vw !important;
        top: 4vh;
    }

    .tab-title {
        font-size: 5vw;
    }

    .transfer-form-row .form-label {
        font-size: 2vw !important;
    }

    .col-md-12.from-area .col-md-4 {
        width: 30%;
        position: relative;
        bottom: 1vh;
    }


    .col-md-12.to-area .col-md-4 {
        width: 30%;
        position: relative;
        bottom: 1vh;
    }


    .col-md-12.from-area .col-md-8 {
        width: 70%;
    }

    .col-md-12.to-area .col-md-8 {
        width: 70%;
    }

    .account-details-area-row {
        margin-left: 0.7vw;
    }

    .account-details-area .account-title {
        font-size: 3.7vw;
    }

    .account-details-area .account-number {
        font-size: 2vw;
    }

    .account-details-area-row #selectedAccountBalance p {
        font-size: 2.3vw;
        padding-left: 3vw;
    }

    p.word-area {
        right: -5vw;
    }

    /* .ammount-area {
        padding-left: 5vw;
        width: 90%;
    } */

    .transfer-from-btn {
        font-size: 5vw;
    }



    .account-card-stack {
        position: unset !important;
    }



    .container .account-card-stack {
        position: relative !important;
        width: 74% !important;
        left: 0px !important;
        margin-top: 0vh !important;
        top: -36px !important;
        height: 16vh !important;
    }

    .container .account-card-stack .card-list li {
        width: 100% !important;
        height: 16vh;
    }

    .container .account-card-stack .card-list li:nth-child(1) {
        width: 80% !important;
    }

    .container .account-card-stack .card-list li:nth-child(2) {
        width: 90% !important;
    }

    .card-meta-wrap {
        margin-top: 1vh;
    }

    .account-header {
        font-size: 4.6875vw;
    }

    h4.account-details {
        font-size: 3vw;
    }

    /* .container .account-card-stack svg {
        width: 4.032vw !important;
        height: 4.0743vh;
    } */

    .sidebar-nav {
        text-align: center;
        padding-bottom: 3vh;
        width: 100%;
        padding-left: 1vw;
    }

    .sidebar-nav li a {
        font-size: 3.2vw;
    }

    .dashboard-upper-body {
        padding-top: 7vh;
    }

    .sidebar-nav li a::after {
        left: 32vw;
    }

    .balance-area-wrap {
        width: fit-content;
        margin: auto;
        text-align: center;
    }

    .progress-container {
        margin: 15px auto;
    }

    .progress-container.progress-sucess progress {
        width: 108px;
    }



    .progress-normal progress {
        width: 105px;
    }

    .available-balance-title {
        font-size: 3.125vw;
        padding-top: 5vh;
    }

    .balnce {
        font-size: 4.25vw;
    }

    .progress-container .progress-label {
        font-size: 2.65629vw;
    }

    .account-btn-row .col-md-3 {
        width: 70%;
        margin: auto;
        margin-bottom: 3vh;
    }

    .filter-area-wrap {
        display: block;
        margin-left: 26%;
        margin-top: 3vh;
    }

    p.filter {
        font-size: 3.65625vw;
        text-align: center !important;
    }

    .dashboard-bottom-body {
        padding: 4vh 4vw;
    }

    .section-header {
        font-size: 5.69vw;
    }

    .drop-icon-area svg {
        width: 4.5vw;
        height: 1.8vh;
    }

    .section-sub-header {
        font-size: 2.129vw;
    }

    .datra-defination {
        font-size: 1.8vw;
        line-height: 2;
    }


    /* .data-row.active.expanded {
        padding-bottom: 15vh;
    } */

    .accordion-content {
        top: 70px;
    }

    .benif-title {
        font-size: 2.125vw;
    }

    h4.transfer-type {
        font-size: 1.75vw;
    }

    .transfer-type-bank-account {
        font-size: 1.75vw;
    }

    p.date-time-area {
        font-size: 1.75vw;
        margin-bottom: 0.5vh !important;
    }

    h4.transfer-details {
        font-size: 1.75vw;
    }

    .transfer-id {
        font-size: 1.75vw;
    }

    .amount-area {
        font-size: 1.75vw;
        margin-bottom: 1vh;
    }
    p.download-area {
        font-size: 1.75vw;
    }

    .download-area .date-area svg {
        width: 2.75vw;
        height: 3.3vw;
        vertical-align: bottom;
    }

    .row.accordion-content {
        padding-top: 1.5vh;
    }

    .blue-cta {
        font-size: 2.9375vw;
    }

    .copyright-area p {
        font-size: 2.65625vw;
        text-align: center;
    }

    .dashboard-area-nav .col-md-8 {
        display: none;
    }

    .dashboard-area-nav .col-md-2 {
        width: 50%;
    }

    .dashboard-area-nav .col-md-3 {
        position: absolute;
        width: 160px;
        right: 0;
        top: 20px;
    }

    .dashboard-area-nav {
        padding-top: 0;
    }

    .dashboard-area-nav::before {
        right: -3%;
    }

    .blue-cta .cta-icon svg {
        width: 5.1vw;
        height: 4.1vw;
    }


    .account-btn-row .col-md-3 {
        padding-left: 0px;
    }

    .icons-btn-met {
        font-size: 2.2vw;
    }

    .filter input {
        font-size: 2.65625vw !important;
        width: 117% !important;
    }

    .filter-area-wrap {
        width: 45%;
    }

    .section-sub-header {
        font-size: 3.129vw !important;
    }

    .heading-row .table-header {
        font-size: 2.5vw !important;
    }

    /* .datra-defination {
        font-size: 2.2vw;
    } */



    .icon-area svg {
        /* width: 4.985vw;
        height: 2.98vh; */
        top: 8px;
        right: 0;
    }

    h4.welcome-txt {
        /* font-size: 2.2vw;
        width: 50%; */
        margin-left: auto;
    }

    /* .account-area-row h4 {
        font-size: 2.9vw;
    } */

    .dashboard-area-nav {
        padding-top: 1vh;
        /* padding-bottom: 1vh; */
    }

    .data-table {
        width: 100%;
    }

    .row.selected-area {
        padding-left: 10vw !important;
    }

    h4.selected-label {
        font-size: 5.125vw !important;
    }



    .col-md-12.submit-area .col-md-6 {
        width: 49%;
    }

    .transfer-form-row-4 {
        padding-top: 0vh !important;
    }

    .tab-title {
        line-height: 1.3;
    }

    .transfer-form .para-area.centered-heading {
        padding-bottom: 1vh;
        font-size: 4vw;
    }

    .benif-action-row {
        padding-left: 6vw;
    }

    .add-benif {
        font-size: 4vw;
    }

    .search-area {
        font-size: 4vw;
    }

    .benif-item-row {
        margin-left: 0vw;
        margin-bottom: 5vh;
    }

    /* 
    .intial-letter {
        font-size: 15vw;
    }

    .account-details-area {
        font-size: 4vw;
    }

    .account-number-area {
        font-size: 5vw;
    } */

    .benif-item-row::before {
        width: 39px;
        height: 30px;
        background-size: 100%;
        left: -9px;
    }

    .off-canvas-area-wraper {
        width: 100%;
    }

    .row.new-trans-cards-row .col-md-6 .row .col-md-6 {
        width: 100%;
        margin-bottom: 2vh;
    }

    .off-canvas-area-header {
        font-size: 6vw;
        margin-top: 4vh;
    }

    .form-row input {
        font-size: 4vw;
    }

    .form-row input::placeholder {
        font-size: 4vw;
    }

    .box-icons-off-canv {
        right: 6vw;
    }

    .form-row {
        padding-bottom: 4vh;
    }

    .account-info-col {
        height: auto;
        margin-bottom: 3vh;
    }

    .card-area-account {
        height: 20vh;
        padding: 1vh 3vh;
    }

    ul.account-detils-info-area li.account-info-item span {
        position: relative;
        margin-left: -2vw;
        font-size: 3vw;
    }

    ul.account-detils-info-area li.account-info-item strong {
        font-size: 3vw;
    }

    .account-details-footer {
        position: unset;
        padding: 1vh 3vh;
    }

    .copy-icon-area svg {
        height: 4.125vw;
        width: 5.22vw;
    }

    .account-details-body {
        padding: 3vh;
    }

    p.short-descp {
        font-size: 2.95625vw;
    }

    h4.balance-amount {
        font-size: 3.4vw;
    }

    .bank-header {
        font-size: 4.4vw;
        margin-bottom: 0px;
    }

    .card-header .col-md-8,
    .card-header .col-md-4 {
        width: 48%;
    }

    .debit-icon-area svg {
        height: 5.735vw;
        width: 4.453vw;
    }
    .card-footer .col-md-8,
    .card-footer .col-md-4 {
        width: 47%;
    }

    .card-title-name {
        font-size: 3vw;
    }

    .expiry-date-card {
        font-size: 2vw;
    }

    .card-number {
        font-size: 2.5vw;
        line-height: 1.6;
    }

    .brand-icon svg {
        width: 3.89vw;
        height: 3.172vw;
        position: relative;
        bottom: 2px;
    }

    .brand-icon {
        padding: 0.3vh 2vh;
    }

    .amount-wraper p {
        border-radius: 0px;
        font-size: 3vw;
        padding: 2vh;
    }
    .data-row.active.expanded {
        padding-bottom: 20vh;
    }

    ul.expport-option li.export-option-item a {
        font-size: 2vw;
        padding: 1vh;
    }

    .mb-3.submit-area {
        margin-left: 32vw;
    }

    .mb-3.submit-area input {
        text-align: center;
        font-size: 2.3vw;
        padding: 1vh 1vw;
    }

    .new-form-row input {
        font-size: 2.5vw !important;
    }

    .new-form-row input::placeholder {
        font-size: 2.5vw !important;
    }

    /* .box-icons-off-canv svg {
        height: 3vw;
        width: 2vw;
    } */

    /* .box-icons-off-canv {
        right: 19px;
        top: -1px;
    } */

    .row.account-details-row {
        width: 100%;
    }


    .action-area .col-md-5 {
        width: 100%;
    }

    /* .divider-area {
        margin-bottom: 3vh;
        line-height: 28px;
        top: 2vh;
    } */

    .back-btn-area.back-btn-area-statments {
        margin-top: 3vh !important;
    }

}

@media (max-width: 600px) {


    .container .account-card-stack .chip-area img {
    width: 20px !important;
}

.container .account-card-stack .chip-area .status-area p {
    font-size: 8px !important;
}

body .container .account-card-stack .card-main .card-numbe {
    font-size: 18px !important;
    margin-left: 4px !important;
}

body .container .account-card-stack .card-main span.expiry-date-card {
    font-size: 10px !important;
    margin-left: 4px !important;
}

body .container .account-card-stack .card-footer h4.card-title-name {
    font-size: 10px !important;
}


    .top-navigation {
    margin-left: 0px !important;
}

ul.bottom-navigation {
    padding: 0px;
}

.data-amount {
    padding: 0px !important;
    text-align: center !important;
}

body .heading-row .table-header {
    width: 25% !important;
    padding-left: 0px !important;
    padding-right: 10px !important;
    text-align: center;
}

.row.data-row .datra-defination {
    padding-left: 0px !important;
    text-align: center;
}

.row.data-row .datra-defination{
    width: 25% !important;
}
    h2.section-header {
    padding-left: 0px !important;
}

p.section-sub-header {
    padding-left: 0px !important;
}

.data-row {
    justify-content: space-around !important;
    gap: 10px;
}

.row.heading-row {
    justify-content: space-around !important;
    gap: 10px;
}



.heading-row .table-header {
    /* width: 81px !important; */
}


    .dashboard-upper-body .account-btn-row .col-md-3 {
    flex: none !important;
}
.dashboard-upper-body .account-btn-row .col-md-3 .icon-btns {
    min-height: fit-content !important;
}

.tab-area-item .icon-area-options {
    position: unset;
    width: 30px;
    height: 30px;
}

.tab-area-item {
    display: flex;
    gap: 15px;
    align-items: center;
    justify-content: flex-start;
    padding: 28px 15px !important;
}

.tab-area-item-with-imgs.tab-area-item {
    padding: 28px 15px !important;
}

.tab-area-item .icon-area-options img ,.tab-area-item .icon-area-options svg{
    width: 100% !important;
    height: 100% !important;
}
    /* 
    new responsive css
    */

    .bottom-row-menu li.bottom-row-menu-item {
        width: 33% !important;
    }
    
    .pbk-app-icons-area-wrap {
        width: fit-content;
        margin: auto !important;
        margin-bottom: 21px !important;
        display: flex;
        justify-content: space-around !important;
        gap: 0px !important;
    }
    
    .pbk-app-icons-area-item {
        width: 45% !important;
    }
    
    .pbk-app-icons-area-item img {
        width: 83% !important;
    }
    
    .bottom-row-menu-area ul.bottom-row-menu-sub {
        top: -130px !important;
        height: 130px !important;
    }
    
    .bottom-row-menu-area ul.bottom-row-menu-sub li {
        font-size: 10px;
    }

    .account-details-area .account-title, .consumer_numbr {
        font-size: 3.125vw !important;
    }
    
    .account-details-area .account-number {
        font-size: 3vw !important;
    }
    .ng-value {
        font-size: 3.125vw !important;
    }
    
    .account-details-area-row #selectedAccountBalance {
        font-size: 3.125vw;
    }

    .section-header {
        font-size: 5.69vw !important;
    }
    
    .option-details {
        font-size: 2vw !important;
    }
    
    .tab-area-item {
        font-size: 3.5vw !important;
        /* padding: 28px 40px !important; */
        margin-bottom: 10px !important;
    }
    
    .tab-area-item-with-imgs.tab-area-item {
        /* padding: 28px 40px !important; */
    }
    
    .icon-area-options svg {
        width: 20px !important;
        height: 20px !important;
        position: relative !important;
        bottom: 4px !important;
    }
    
    .tab-area-item-with-imgs img {
        width: 20px !important;
        height: 20px !important;
        position: relative !important;
        bottom: 4px !important;
    }
    
    
    .tab-content-wrap .slideContainer {
        padding: 10px !important;
    }
    
    .tab-title {
        font-size: 3.5vw !important;
    }
    
    .benif-action-row .col-md-6 {
        width: 50% !important;
    }
    
    .benif-action-row .col-md-6 .add-benif {
        font-size: 1.9375vw !important;
    }
    
    .benif-action-row .col-md-6  .search-area {
        font-size: 1.9375vw !important;
    }
    
    .benif-action-row .col-md-6 .search-area .icon-search {
        position: relative !important;
        bottom: 2px !important;
    }
    
    input.search-input.form-control {
        font-size: 4.75vw !important;
    }
    
    .intial-letter {
        font-size: 3.37vw !important;
    }
    
    .account-number-area {
        font-size: 2.65625vw !important;
    }
    
    p.bank-name-area {
        font-size: 2.75625vw !important;
    }
    

    


    .tab-area-item-with-imgs {
        padding-left: 73px !important;
    }

    ul.bottom-navigation {
        padding-right: 29px;
        padding-top: 1px;
        padding-bottom: 1px;
    }
    
    .account-area-row {
        top: -28px;
    }
    
    .dashboard-upper-body {
        padding-top: 4vh;
    }
    
    
    
    .dash-pos .sidebar-nav li.sideba-nav-item a {
        font-size: 12px;
    }
    
    .container .account-card-stack {
        position: relative !important;
        width: 74% !important;
        left: 0px !important;
        margin-top: 0vh !important;
        top: -36px !important;
        height: 16vh !important;
    }
    
    
    
    .row.dashboard-upper-body.mainDashboard.dash-pos .col-md-8 {
        width: 100%;
    }
    
    .account-header {
        font-size: 3.6875vw !important;
    }
    
    h4.account-details {
        font-size: 4vw !important;
    }
    
    .balance-area-wrap {
        width: 10;
    }
    
    .balance-area-wrap h2.balance-dashboard {
        font-size: 7.25vw !important;
    }
    
    .available-balance-title {
        font-size: 4.125vw !important;
    }
    

    
    /*
    end new responsive css
    */


    .pagination-wrap .pagination {
        width: 62% !important;
    }

    .pagination-wrap .pagination li.page-item a {
        font-size: 3vw;
    }

    .pagination-wrap .pagination li.page-item span {
        font-size: 3vw;
    }

    .paginav-link a.page-link svg {
        width: 4.3vw;
        height: 4.3vw;
    }



    .action-area .col-md-5 {
        width: 100%;
    }

    /* .divider-area {
        margin-bottom: 3vh;
        line-height: 28px;
        top: 2vh;
    } */

    .back-btn-area.back-btn-area-statments {
        margin-top: 3vh !important;
    }


    .mb-3.submit-area {
        margin-left: 32vw;
    }

    .mb-3.submit-area input {
        text-align: center;
        font-size: 2.3vw;
        padding: 1vh 1vw;
    }

    .new-form-row input {
        font-size: 2.5vw !important;
    }

    .new-form-row input::placeholder {
        font-size: 2.5vw !important;
    }

    /* .box-icons-off-canv svg {
        height: 3vw;
        width: 2vw;
    } */

    /* .box-icons-off-canv {
        right: 19px;
        top: -1px;
    } */

    .row.account-details-row {
        width: 100%;
    }


    .account-info-col {
        height: auto;
        margin-bottom: 3vh;
    }

    .card-area-account {
        height: 20vh;
        padding: 1vh 3vh;
    }

    ul.account-detils-info-area li.account-info-item span {
        position: relative;
        margin-left: -2vw;
        font-size: 3vw;
    }

    ul.account-detils-info-area li.account-info-item strong {
        font-size: 3vw;
    }

    .account-details-footer {
        position: unset;
        padding: 1vh 3vh;
    }

    .copy-icon-area svg {
        height: 4.125vw;
        width: 5.22vw;
    }

    .account-details-body {
        padding: 3vh;
    }

    p.short-descp {
        font-size: 2.95625vw;
    }

    h4.balance-amount {
        font-size: 3.4vw;
    }

    .bank-header {
        font-size: 4.4vw;
        margin-bottom: 0px;
    }


    .card-header .col-md-8,
    .card-header .col-md-4 {
        width: 48%;
    }

    .debit-icon-area svg {
        height: 5.735vw;
        width: 4.453vw;
    }


    .card-footer .col-md-8,
    .card-footer .col-md-4 {
        width: 47%;
    }

    .card-title-name {
        font-size: 3vw;
    }

    .expiry-date-card {
        font-size: 2vw;
    }

    .card-number {
        font-size: 2.5vw;
        line-height: 1.6;
    }

    .brand-icon svg {
        width: 3.89vw;
        height: 3.172vw;
        position: relative;
        bottom: 2px;
    }

    .brand-icon {
        padding: 0.3vh 2vh;
    }

    .amount-wraper p {
        border-radius: 0px;
        font-size: 3vw;
        padding: 2vh;
    }

    .data-row.active.expanded {
        padding-bottom: 20vh;
    }

    ul.expport-option li.export-option-item a {
        font-size: 2vw;
        padding: 1vh;
    }


    .off-canvas-area-wraper {
        width: 100%;
    }

    .row.new-trans-cards-row .col-md-6 .row .col-md-6 {
        width: 100%;
        margin-bottom: 2vh;
    }

    .off-canvas-area-header {
        font-size: 6vw;
        margin-top: 4vh;
    }

    .form-row input {
        font-size: 4vw;
    }

    .form-row input::placeholder {
        font-size: 4vw;
    }

    .box-icons-off-canv {
        right: 6vw;
    }

    .form-row {
        padding-bottom: 4vh;
    }




    .left-sidebard-wrap::before {
        height: 17vh;
        top: 1vh;
        z-index: -1;
    }

    .header-main-heading {
        font-size: 4vw;
    }

    .searchbox-area input#searchbox {
        font-size: 2.8vw;
        padding-left: 5vw;
    }

    .searchbox-area {
        width: 90%;
        z-index: 9999 !important;
    }

    .dashboard-middle-sec {
        padding-top: 6vh;
        padding-left: 11vw;
        padding-right: 11vw;
    }

    .services-box-header {
        font-size: 4.9375vw;
    }

    .service-box-item {
        margin-bottom: 3vh;
    }

    .serv-icon-area svg {
        width: 8.5vw;
        height: 8.5vw;
    }

    .service-meta {
        font-size: 3.9375vw;
    }

    .dark-card {
        margin-top: 0px !important;
    }

    .new-bottom-body {
        padding-left: 10vw;
        padding-right: 10vw;
    }

    .datra-defination {
        font-size: 2.2vw;
    }













    .benif-action-row {
        padding-left: 6vw;
    }

    .add-benif {
        font-size: 4vw;
    }

    .search-area {
        font-size: 4vw;
    }

    .benif-item-row {
        margin-left: 0vw;
        margin-bottom: 5vh;
    }

    .intial-letter {
        font-size: 15vw;
    }

    .account-details-area {
        font-size: 4vw;
    }

    .account-number-area {
        font-size: 5vw;
    }

    .benif-item-row::before {
        width: 8vw;
        height: 7vh;
        background-size: 8.7vw;
        left: -9px;
    }

    .transfer-form-row-4 {
        padding-top: 0vh !important;
    }

    .tab-title {
        line-height: 1.3;
    }

    .transfer-form .para-area.centered-heading {
        padding-bottom: 1vh;
        font-size: 4vw;
    }


    .row.selected-area {
        padding-left: 10vw !important;
    }

    h4.selected-label {
        font-size: 5.125vw !important;
    }



    .col-md-12.submit-area .col-md-6 {
        width: 49%;
    }


    /* 
    .recent-beif-area {
        width: 39%;
    } */

    .recent-beif-area::before {
        display: none;
    }

    .benif-row .recent-benif-col .recent-benif-col h2 {
        font-size: 6vw;
    }

    .benif-row .recent-benif-col .recent-benif-col {
        padding: 3vh 0.4vw;
    }

    .recent-benif-meta {
        font-size: 4vw;
        margin-bottom: 34px;
    }

    .recent-benif-col.benfsource-primer-bank:before {
        width: 10vw !important;
        height: 4vh;
        background-size: 10vw;
    }

    .row.tabs-row {
        width: 90%;
        margin: auto;
        padding-top: 0px;
    }

    .tab-area-item {
        font-size: 4vw;
        /* padding: 4vh 2vw 4vh 10vw !important; */
        margin-bottom: 0px;
    }

    

    .icon-area-options svg {
        width: 4.344vw;
        height: 7.344vw;
    }

    .tab-area-item .icon-area-options {
        left: 3vw !important;
        top: 4vh;
    }

    .tab-title {
        font-size: 5vw;
    }

    .transfer-form-row .form-label {
        font-size: 4vw;
    }

    .col-md-12.from-area .col-md-4 {
        width: 30%;
        position: relative;
        bottom: 1vh;
    }


    .col-md-12.to-area .col-md-4 {
        width: 30%;
        position: relative;
        bottom: 1vh;
    }


    .col-md-12.from-area .col-md-8 {
        width: 70%;
    }

    .col-md-12.to-area .col-md-8 {
        width: 70%;
    }

    .account-details-area-row {
        margin-left: 0.7vw;
    }

    .account-details-area .account-title {
        font-size: 3.7vw;
    }

    .account-details-area .account-number {
        font-size: 2vw;
    }

    .account-details-area-row #selectedAccountBalance p {
        font-size: 2.3vw;
        padding-left: 3vw;
    }

    p.word-area {
        right: -5vw;
    }

    .ammount-area {
        padding-left: 5vw;
        width: 90%;
    }

    .transfer-from-btn {
        font-size: 5vw;
    }




    .account-btn-row .col-md-3 {
        padding-left: 0px;
    }

    .icons-btn-met {
        font-size: 2.2vw;
    }

    .filter input {
        font-size: 2.65625vw !important;
        width: 117% !important;
    }

    .filter-area-wrap {
        width: 45%;
    }

    .section-sub-header {
        font-size: 3.129vw !important;
    }

    .heading-row .table-header {
        font-size: 2.5vw !important;
    }

    .datra-defination {
        font-size: 2.2vw;
    }

    .data-table {
        width: 100%;
    }



    .bottm-bar {
        position: unset;
    }

    .login-form-wrap {
        padding-bottom: 3.53927vh;
    }



    .copy-right-area {
        padding-bottom: 20px;
        text-align: center;
    }

    .copy-right-area p {
        text-align: center;
    }

    .login-form input#password {
        padding-left: 4vw;
    }

    .login-form input#username {
        padding-left: 4vw;
    }

    .hiddenonmob {
        display: none;
    }

    .row.fotter-info-area {
        padding: 20px 0px;
    }


    .login-form-area-wrap .btn.btn-primary {
        font-size: 3.5vw;
        padding: 2.5vh;
    }

    .join-now-area {
        font-size: 3.5vw;
        padding: 2.5vh;

    }



    .text-area-wrap h1 {
        padding-top: 4vh;
    }

    .small-area-para {
        width: 80%;
        font-size: 1.685vh;
    }

    /* .card-area-wrap img {
        height: 18.854vh !important;
    } */

    .card-area-wrap {
        margin-bottom: 5vh;
    }


    .card-area-wrap-right {
        display: none;
    }

    /* .dark-area {
        height: unset;
    } */

    .reg-area-row-wrap {
        padding: 1vh 6vw 0vh 6vw;
    }

    .reg-col-wrap .login-form-wrap {
        padding-bottom: 0vh;
        padding-right: 0;
    }

    .dark-area .main-heading {
        text-align: center;
    }

    .dark-area .para-area {
        text-align: center;
    }

    .dark-area label.form-label {
        font-size: 3vw;
    }

    .calender-area {
        padding-top: 0vh;
    }

    .login-form .form-control {
        padding-left: 5vw;
    }

    .calender-area::after {
        bottom: 2vh;
    }

    .dark-area .login-form-area-wrap .btn.btn-primary {
        padding: 2vh;
        margin-bottom: 4vh;
    }


    .back-btn-area span svg {
        width: 5vw;
        height: 3vh;
    }

    .back-btn-area span {
        bottom: 1px;
    }

    .back-btn-area {
        left: 4vw;
    }

    .account-area-img {
        display: none;
    }

    .calender-area::after {
        background-size: 5vw;
        width: 5vw;
        bottom: 2.5vh;
    }


    .top-icon-area img {
        width: 20vw;
    }

    .full-center-layout .reg-area-row-wrap {
        padding: 4vh 6vw 4vh 6vw !important;
    }

    .full-center-layout .centered-heading {
        padding-top: 0vh !important;
    }

    .otp-input-row .col-md-3 {
        width: 25%;
    }

    .otp-input-row {
        padding: 0vh 21vw;
    }

    .icon-anim-row .divider-area {
        display: none;
    }

    .anim-icon-wrap .anim-icon {
        padding: 3.5vh 15.5vw;
        margin: auto;
    }

    .anim-icon-wrap {
        margin-bottom: 7vh;
    }

    .recovery-options-meta {
        padding-top: 1.5vh;
    }

    .recovery-form .back-btn-area {
        left: -20vw !important;
    }

    .recovery-form .login-form .form-label {
        font-size: 1.5vh;
        margin-bottom: 0;
    }

    .recovery-form .btn.btn-primary {
        font-size: 1.6vh;
        padding: 1.5vh;
    }


    .circle svg {
        position: relative;
        /* bottom: 5px; */
    }

    /* .circle {
    width: 38.579vw;
    height: 38.579vw;
} */

    .icon-anim-row .col-md-6 {
        padding: 0vh 14vw;
    }

    /* .circle svg {
    height: 21.766vw;
    width: 21.766vw;
} */

    /* .recovery-options {
    margin-bottom: 49PX;
} */

    .dark-area::before {
        display: none;
    }




    .account-card-stack {
        position: unset !important;
    }



    .container .account-card-stack {
        position: relative !important;
        width: 74%;
        left: 0px;
        margin-top: 0vh;
        top: -36px;
        height: 16vh;
    }

    .container .account-card-stack .card-list li {
        width: 100% !important;
        height: 16vh;
    }

    .container .account-card-stack .card-list li:nth-child(1) {
        width: 80% !important;
    }

    .container .account-card-stack .card-list li:nth-child(2) {
        width: 90% !important;
    }

    .card-meta-wrap {
        margin-top: 1vh;
    }

    .account-header {
        font-size: 4.6875vw;
    }

    h4.account-details {
        font-size: 3vw;
    }

    .container .account-card-stack svg {
        width: 3vw !important;
        height: 3vh;
    }

    .sidebar-nav {
        text-align: center;
        padding-bottom: 3vh;
        width: 100%;
        padding-left: 1vw;
    }

    .sidebar-nav li a {
        font-size: 3.2vw;
    }

    .dashboard-upper-body {
        padding-top: 7vh;
    }

    .sidebar-nav li a::after {
        left: 32vw;
    }

    .balance-area-wrap {
        width: fit-content;
        margin: auto;
                position: relative;
        top: 25px;
    }

    .progress-container.progress-sucess progress {
        width: 108px;
    }



    .progress-normal progress {
        width: 105px;
    }


    .balnce {
        font-size: 4.25vw;
    }

    .progress-container .progress-label {
        font-size: 2.65629vw;
    }

    .account-btn-row .col-md-3 {
        width: 70%;
        margin: auto;
        margin-bottom: 3vh;
    }

    .filter-area-wrap {
        display: block;
        margin-left: 26%;
        margin-top: 3vh;
    }

    p.filter {
        font-size: 3.65625vw;
        text-align: center !important;
    }

    .dashboard-bottom-body {
        padding: 4vh 4vw;
    }

    .section-header {
        font-size: 5.69vw;
    }

    .drop-icon-area svg {
        width: 4.5vw;
        height: 1.8vh;
    }

    .section-sub-header {
        font-size: 2.129vw;
    }

    .datra-defination {
        font-size: 1.8vw;
        line-height: 2;
    }

    .benif-title {
        font-size: 2.125vw;
    }

    h4.transfer-type {
        font-size: 1.75vw;
    }

    .transfer-type-bank-account {
        font-size: 1.75vw;
    }

    p.date-time-area {
        font-size: 1.75vw;
        margin-bottom: 0.5vh !important;
    }

    h4.transfer-details {
        font-size: 1.75vw;
    }

    .transfer-id {
        font-size: 1.75vw;
    }

    .amount-area {
        font-size: 1.75vw;
        margin-bottom: 1vh;
    }

    p.download-area {
        font-size: 1.75vw;
    }

    .download-area .date-area svg {
        width: 2.75vw;
        height: 3.3vw;
        vertical-align: bottom;
    }

    .row.accordion-content {
        padding-top: 1.5vh;
    }

    .blue-cta {
        font-size: 2.9375vw;
    }

    .copyright-area p {
        font-size: 2.65625vw;
        text-align: center;
    }

    .dashboard-area-nav .col-md-8 {
        display: none;
    }

    .dashboard-area-nav .col-md-2 {
        width: 50%;
    }

    .dashboard-area-nav::before {
        right: -3%;
    }

    .blue-cta .cta-icon svg {
        width: 5.1vw;
        height: 4.1vw;
    }
}


@media (min-width: 1024px) and (max-width: 1024px) and (min-height: 600px) and (max-height: 600px) {



    .account-info-col {
        height: 50vh;
    }

    .card-area-account {
        height: 50vh;
    }



    .recent-beif-area::before {
        top: 37vh;
    }

    .login-anim-col {
        display: block;
    }

    .login-half-area {
        display: block;
    }


    .bottom-row-menu {
        margin-left: 12vw;
    }

    .bottom-row-menu-anchor img {
        height: 4.713vh;
    }

    .menu-title {
        font-size: 1.692vh;
        padding-left: 1.3vw;
    }

    .login-form-area-wrap {
        width: 30vw;
        margin-left: 0px;
    }

    .main-heading {
        padding-top: 0vh;
        text-align: left;
    }

    .login-form .form-label {
        font-size: 0.8438vw;
    }

    .login-form-area-wrap .btn.btn-primary {
        font-size: 0.929999vw;
        padding: 0.929999vw;
    }

    .divided-se {
        font-size: 1.41361vh;
    }

    .join-now-area {
        font-size: 0.929999vw;
        padding: 0.929999vw;
    }


    .card-area-wrap img {
        height: 18.169vh;
    }

    .text-area-wrap h1 {
        text-align: center;
    }

    .small-area-para {
        width: 22% !important;
    }

    .cards-row {
        padding-left: 20.40625vw;
        padding-right: 20.40625vw;
        padding-top: 5.71204vh;
    }

    .calender-area::after {
        bottom: 1vh;
    }

    .back-btn-area {
        left: -1vw;
        top: -7vh;
    }

    .back-btn-area span svg {
        height: 2.4vh;
        width: 1.4vw;
    }

    .top-icon-area img {
        width: 6vw;
    }



    .full-center-layout .reg-area-row-wrap {
        padding: 4vh 6vw 8vh 6vw !important;
    }


    .anim-icon-wrap .anim-icon {
        padding: 7.77vh 2.8791vw;
    }

    .icon-anim-row .col-md-6 {
        padding: 0vh 6.7vw;
    }

    .cards-row .divider-area .divided-se {
        height: 6vh;
        width: 3.5vw;
        font-size: 2.5vh;
        line-height: 1.3;
    }

    .cards-row .divider-area {
        top: 16vh;
    }


}



@media (min-width: 1280px) and (max-width: 1280px) and (min-height: 800px) and (max-height: 800px) {

    .account-info-col {
        height: 50vh;
    }

    .card-area-account {
        height: 50vh;
    }

    .recent-beif-area::before {
        width: 86%;
        top: 30vh;
    }


    .anim-icon-wrap .anim-icon {
        padding: 3.77vh 2.8791vw;
    }

    .icon-anim-row .col-md-6 {
        padding: 0vh 7.9vw;
    }

    .cards-row .divider-area .divided-se {
        height: 2vh;
        width: 2vw;
    }


}



@media (max-width: 1440px) and (max-height: 665px) {
    .account-details-body {
        padding: 1.2vh 2vw !important;
    }
}