﻿h1 {
  font-family: "Aspira-demi", sans-serif;
  font-size: 4rem;
  color: #000;
  margin: 10rem 0 5.25rem;
}

h2 {
  font-family: "Aspira-demi", sans-serif;
  font-size: 3.5rem;
  color: #0083ca;
  margin: 5rem 0 3rem;
  line-height: 3.5rem;
}

h3 {
  font-family: "Aspira-med", sans-serif;
  font-size: 2.5rem;
  color: #000;
  text-transform: uppercase;
  margin: 3rem 0 2rem;
  line-height: 2.8rem;
}

h4 {
  font-family: "Aspira-med", sans-serif;
  font-size: 2.2rem;
  color: #000;
  margin: 3rem 0 2rem;
  line-height: 2rem;
}

@media (max-width: 1140px) {
   .header-nav-links a.nav-link{
font-size: 1.2rem;
}
.sub-nav-arrow-loans::before{
display:none;
}

 #digi-app 
.expanded {
    padding: 0 !important;
  }

  #digi-app 
.row {
    padding: 0 2rem;
  }

}


@media (max-width: 1024px) {
	/*1024*/
/* new-header-css-start */
      .new-form-small-wrapper {
        float: right !important;
        text-align: right !important;
        max-width: 100% !important;
        margin-right: 0;
      }
      /* new-header-css-end */

  .mm-menu-label {
    float: left;
  }
  .mm-menu-arrow {
    float: right;
  }
  .mm-menu-arrow:before {
    font-family: 'FontAwesome';
    content: '\f105';
    font-size: 2.3rem;
    color: #fff;
    line-height: 1rem;
  }
  .mm-sub-nav {
    box-sizing: border-box;
    padding: 0.55rem 0;
    background-color: transparent;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 100%;
    right: inherit;
    z-index: auto;
    padding: 0 0 1rem;
    overflow: auto;
  }
  .sub-nav-content {
    max-width: 120rem;
    box-sizing: border-box;
    margin: 0 auto;
    position: relative;
    height: 100%;
  }
  .sub-nav-lvl1 {
    width: 100%;
    box-sizing: border-box;
    padding: 4.5rem 2.5rem 0;
  }
  .sub-nav-lvl1 .sub-nav-lvl1-header {
    overflow: hidden;
  }
  .sub-nav-lvl1 .title-label {
    font-family: "Aspira-light", sans-serif;
    font-size: 3rem;
    color: #002336;
    margin: 0;
    float: left;
    line-height: 3rem;
  }
  .mm-back-arrow-lvl1,
  .mm-back-arrow-lvl2 {
    float: right;
    position: relative;
    top: .2rem;
  }
  .mm-back-arrow-lvl1:before,
  .mm-back-arrow-lvl2:before {
    font-family: "FontAwesome";
    content: '\f104';
    font-size: 3rem;
    color: #002336;
    line-height: 1.8rem;
    display: block;
  }
  .sub-nav-lvl1-links-wrapper {
    height: 100%;
    clear: both;
	padding-bottom: 2rem;
  }
  .sub-nav-lvl1-links-wrapper .sub-nav-lvl1-links {
    margin: 0;
    position: relative;
    left: 0;
    background-color: transparent;
    padding: 1.8rem 0 0;
  }
  .sub-nav-lvl1-links-wrapper li {
    display: block;
    line-height: 2.4rem;
    box-sizing: border-box;
    padding: 0 0 1.5rem;
  }
  .sub-nav-lvl1-links-wrapper .sub-nav-link {
    font-family: "Aspira-regular", sans-serif;
    font-size: 1.8rem;
    color: #fff;
    width: 100%;
    height: 100%;
    display: block;
  }
  .sub-nav-lvl2 {
    background-color: transparent;
    width: 100%;
    height: 100% ;
    position: fixed;
    left: 200%;
    top: 0;
    overflow: auto;
    padding: 0 2.5rem 0;
  }
  .sub-nav-lvl2 .sub-nav-lvl2-header {
    overflow: hidden;
  }
  .sub-nav-lvl2 .title-label {
    font-family: "Aspira-light", sans-serif;
    font-size: 3rem;
    color: #002336;
    margin: 0;
    float: left;
    line-height: 3rem;
    width: 90%;
  }
  .sub-nav-lvl2-links-wrapper {
    height: inherit;
    break-inside: inherit;
    position: absolute;
    left: 0;
    padding: 4.5rem 2.5rem 1rem;
    width: 100%;
  }
  .sub-nav-lvl2-links {
    margin: 0;
    position: relative;
    left: 0;
    background-color: transparent;
    padding: 1.8rem 0 0;
  }
  .sub-nav-lvl2-links li {
    margin: 0 0 1.5rem;
  }
  .sub-nav-lvl2-link {
    font-family: "Aspira-regular", sans-serif;
    font-size: 1.8rem;
    color: #fff;
    width: 100%;
    height: 100%;
    display: block;
  }
  .sub-nav-lvl2-link:hover {
    color: #fff;
  }
  #mm_Deposits {
    opacity: 0;
    visibility: hidden;
  }
  #mm_Banking {
    opacity: 0;
    visibility: hidden;
  }
  #mm_Loans {
    opacity: 0;
    visibility: hidden;
  }
  #mm_investor_relations {
    opacity: 0;
    visibility: hidden;
  }
  #mm_Insurance {
    opacity: 0;
    visibility: hidden;
  }
  #mm_E-Services {
    opacity: 0;
    visibility: hidden;
  }
  #mm_NRPServices {
    opacity: 0;
    visibility: hidden;
  }
  #mm_Careers {
    opacity: 0;
    visibility: hidden;
  }
  #mm_consumer_loans {
    opacity: 1;
    visibility: visible;
  }
  #mm_cards_products {
    opacity: 0;
    visibility: hidden;
  }
  #mm_efu_life {
    opacity: 1;
    visibility: visible;
  }
  #mm_slico {
    opacity: 0;
    visibility: hidden;
  }
  #mm_other_insurance {
    opacity: 0;
    visibility: hidden;
  }
  #mm_jli {
    opacity: 0;
    visibility: hidden;
  }
  #mm_sme_products {
    opacity: 1;
    visibility: visible;
  }
  #mm_corporate_banking {
    opacity: 0;
    visibility: hidden;
  }
  #mm_investment_banking {
    opacity: 0;
    visibility: hidden;
  }
  #mm_ameen {
    opacity: 0;
    visibility: hidden;
  }
  #mm_omni {
    opacity: 0;
    visibility: hidden;
  }
  #mm_treasury_market {
    opacity: 0;
    visibility: hidden;
  }
  #mm_signature_banking {
    opacity: 0;
    visibility: hidden;
  }
  #mm_retail_asset {
    opacity: 0;
    visibility: hidden;
  }
  #mm_netbanking {
    opacity: 1;
    visibility: visible;
  }
  #mm_e_statement {
    opacity: 0;
    visibility: hidden;
  }
  #mm_go_green {
    opacity: 0;
    visibility: hidden;
  }
  #mm_iban {
    opacity: 0;
    visibility: hidden;
  }
  
  /* logic for menu test - Remittance service*/
   #mm_nrp_remittances{
    opacity: 0 ;
    visibility: hidden ;
  }
  #mm_roshan_digital_acc{
    opacity: 0 ;
    visibility: hidden ;
  }

  #mm_transaction_banking{
    opacity: 0 ;
    visibility: hidden ;
  }

  #mm_digital_open_acct{
    opacity: 0 ;
    visibility: hidden ;
  }

  
  /* End logic for menu test - Remittance service */
  
  
  
  .chat-btn {
   margin: 0 6.35rem 0 0;
}

.location-btn {
   display: inline-block;
   
}
  
  .fixed-medium-img-wrapper {
    height: 30rem;
  }
  .center-align-content-wrapper {
    box-sizing: border-box;
    padding: 0 1rem;
    border: 0;
    border-top: 0.55rem solid #0083ca;
    background-color: #fff;
    margin: -3.5rem auto 1.5rem;
    width: 90%;
  }
  .article-body {
    font-family: "Aspira-light", sans-serif;
    font-size: 1.5rem;
    color: #58595b;
    line-height: 2.9rem;
    text-align: center;
  }
  .article-body p {
    margin-bottom: 2.5rem;
  }
  .article-body p:last-child {
    margin: 0;
  }
  .article-body-left {
    font-family: "Aspira-light", sans-serif;
    font-size: 1.5rem;
    color: #58595b;
    line-height: 2.9rem;
    padding: 0 1.5rem;
  }
  .subpages-medium-main-img-wrapper {
    background: url("../imgs/subpages/top-medium-img.jpg") no-repeat center;
    background-size: cover;
    width: 100%;
    height: 30rem;
    position: fixed;
  }
  h1 {
    font-family: "Aspira-demi", sans-serif;
    font-size: 4rem;
    color: #000;
    margin: 5rem 0 3rem;
    line-height: 4rem;
    padding: 0 1.5rem;
  }
  h2 {
    font-family: "Aspira-demi", sans-serif;
    font-size: 3rem;
    color: #0083ca;
    margin: 5rem 0 3rem;
    line-height: 3rem;
    padding: 0 1.5rem;
  }
  table thead {
    font-size: 1.4rem;
  }
  table thead th:first-child {
    padding: 1.25rem 0 1.25rem 1.5rem;
  }
  table thead th:last-child {
    padding: 1.25rem 1.5rem 1.25rem 3rem;
  }
  table tbody td {
    font-size: 1.4rem;
  }
  table tbody td:first-child {
    padding: 1.25rem 0 1.25rem 1.5rem;
  }
  table tbody td:last-child {
    padding: 1.25rem 1.5rem 1.25rem 3rem;
  }
  .list-item {
    line-height: 2.4rem;
    padding: 1.8rem 2.5rem;
  }
  .related-links-wrapper {
    display: block;
    position: relative;
    z-index: 98;
    top: 2rem;
    right: 1.5rem;
    float: right;
  }
  .related-links-btn {
    font-family: "Aspira-regular", sans-serif;
    font-size: 1.2rem;
    color: #fff;
    border-radius: .4rem;
    display: block;
    background-color: #0083ca;
    color: #fff;
    min-width: 10.2rem;
    min-height: 3.3rem;
    float: left;
    margin: 0;
    transition: background-color .3s;
	line-height: 3.3rem;
	text-align: center;
  }
  .related-links-btn:hover {
    color: #fff;
  }
  .page-container {
    padding: 10rem 0 0;
  }
  .header-main {
    display: none;
  }
  .header-main-subpages {
    display: none;
  }
  .mobile-header-main {
    background-color: #0083ca;
    width: 100%;
    height: 4.95rem;
    position: fixed;
    z-index: 100;
    display: block;
  }
  .mobile-ubl-logo {
    background: url("../imgs/ubl-base-sprite.png") no-repeat -6.75rem -17.7rem;
    background-size: 18.25rem 35.1rem;
    height: 2.85rem;
    width: 5.55rem;
  }
  .mobile-white-ubl-logo {
    background: url("../imgs/ubl-base-sprite.png") no-repeat -6.55rem -17.35rem;
    background-size: 18.25rem 35.1rem;
    height: 3.35rem;
    width: 5.55rem;
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 100;
  }
  .top-bar {
    background-color: transparent;
    box-sizing: border-box;
    padding: 0 !important;
  }
  .top-bar-left {
    box-sizing: border-box;
    padding: 1rem 0 0 1rem;
  }
  .top-bar-right {
    margin: 0;
    padding: 0;
  }
  .mobile-main-menu {
    background-color: #0083ca;
    width: 4.95rem;
    height: 4.95rem;
    position: relative;
    z-index: 100;
    float: right;
  }
  .header-nav-btns {
    float: right;
    position: relative;
    top: 1.5rem;
    right: 1.4rem;
  }
  
  
  .wrapper-dropdown-3 {
    right: -1rem !important;
  }

  .search-btn {
    right: 4.4rem !important;
  }

  .wrapper-dropdown-3 .dropdown li a {
    padding: 7px 0 0 0 !important;
  }
  
  .slide-detail-01-wrapper,.slide-detail-02-wrapper,.slide-detail-03-wrapper,.slide-detail-04-wrapper {
    padding: 1rem;
    background-color: rgba(0, 0, 0, 0.7);
    width: 100%;
    text-align: center;
    float: none;
    margin: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }
  .slider-heading-wrapper .large-text {
    font-size: 4.5rem;
    padding: 0 2rem;
    line-height: 4.5rem;
  }
  .slider-details-wrapper {
    display: none;
  }
  .slider-btn-wrapper {
    display: none;
  }
  .header-main {
    display: none;
  }
  .login-field-small-wrapper {
    display: none;
  }
  .login-field-small-wrapper-subpages {
    display: none;
  }
  .mobile-login-field-small-wrapper {
    display: block;
    height: 4.95rem;
    top: 5rem;
    padding: 0 1rem;
    float: right;
    width: 100%;
    background-color: #f6f6f6;
    position: fixed;
    z-index: 99;
  }
  .login-txtfield-header {
    width: 100%;
    float: none;
    background: transparent;
    font-size: 1.2rem;
    color: #c7c8ca;
    height: 2.75rem;
    margin: 0;
    border-radius: .4rem;
    border: 0.1rem solid #c7c8ca;
    box-shadow: none;
  }
  .top-bar .top-bar-left,
  .top-bar .top-bar-right {
    width: auto;
  }
  .ubl-logo {
    background: url("../imgs/ubl-base-sprite.png") no-repeat 0 0;
    background-size: 18.25rem 35.1rem;
    height: 3.35rem;
    width: 5.8rem;
    margin: 0 0 0 10px;
  }
  .header-nav-links {
    display: none;
  }
  .mm-header-nav-links {
    padding: 4rem 2.5rem 0;
    height: 100%;
    position: relative;
    left: 0;
  }
  .mm-header-nav-links ul.mm-header-nav-links-ul {
    background-color: transparent;
    margin: 0;
  }
  .mm-header-nav-links li.mm-header-nav-links-li {
    list-style: none;
    margin: 0;
    line-height: 2.3rem;
    clear: both;
  }
  .mm-header-nav-links a.nav-link {
    font-size: 1.8rem;
    line-height: 3.9rem;
    color: #fff;
    transition: color .2s;
    overflow: hidden;
    display: block;
  }
  .mobile-menu-wrapper {
    visibility: hidden;
    opacity: 0;
    position: fixed;
    background-color: #0083ca;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    max-width: 32rem;
    margin: 5rem 0 0 0;
    padding: 0 0 5rem;
    overflow: hidden;
  }
  .form-small-wrapper {
    height: 5rem;
    width: 100%;
    overflow: hidden;
    max-width: 40rem;
  }
  .form-small-wrapper .login-field-header {
    top: 1rem;
    position: relative;
    overflow: hidden;
    display: block;
    margin: 0;
  }
  .form-small-wrapper .go-btn-header {
    top: 1rem;
    float: right;
    margin: 0 10px 0 5px;
    position: relative;
  }
  .form-small-wrapper .forgot-pass-header-wrapper {
    float: right;
    position: relative;
    top: 1.6rem;
  }
  .form-small-wrapper .login-header-sep {
    font-size: 1.2rem;
    margin: 0 .5rem 0 .3rem;
  }
  /* .location-btn { */
    /* display: none; */
  /* } */
  /* .chat-btn { */
    /* display: none; */
  /* } */
  .netbanking-login-container {
    display: none;
  }
  .top-content .details {
    padding: 0 1.5rem;
  }
  .index-ubl-digital-wrapper {
    display: none;
  }
  .app-intro-wrapper {
    margin: 6.2rem 0 0;
  }
  .app-pic-bill-management-details-heading {
    line-height: 3.6rem;
  }
  .mobile-index-ubl-digital-wrapper {
    display: block;
    float: left;
    width: 100%;
    background-color: #e6e7e8;
  }
  .mobile-index-ubl-digital-wrapper .app-details-wrapper {
    margin: 7.5rem 0 0;
  }
  .mobile-index-ubl-digital-wrapper .app-details-wrapper .app-icon {
    background: url("../imgs/ubl-base-sprite.png") no-repeat 0 -30.1rem;
    background-size: 36.65rem 70.2rem;
    width: 12.5rem;
    height: 12.5rem;
    margin: 0 auto 3rem;
  }
  .mobile-index-ubl-digital-wrapper .app-details-wrapper .heading {
    font-family: "Aspira-thin", sans-serif;
    font-size: 4.3rem;
    color: #000;
    line-height: 5.2rem;
    margin: 0 0 3rem;
    text-align: center;
    padding: 0 1.5rem;
  }
  .mobile-index-ubl-digital-wrapper .app-details-wrapper .details {
    font-family: "Aspira-light", sans-serif;
    font-size: 2rem;
    color: #000;
    line-height: 2.9rem;
    max-width: 50.9rem;
    margin: 0 auto 3rem;
    text-align: center;
    padding: 0 1.5rem;
  }
  .mobile-index-ubl-digital-wrapper .learn-more-btn-wrapper {
    width: 100%;
    margin: 0 0 6.5rem;
  }
  .mobile-index-ubl-digital-wrapper .learn-more-btn-wrapper .learn-more-btn {
    border-color: #0083ca;
    color: #0083ca;
    display: block;
    float: none;
    margin: 0 auto;
  }
  .mobile-index-ubl-digital-wrapper .learn-more-btn-wrapper .learn-more-btn:hover {
    background-color: #0083ca;
    color: #fff;
    border-color: transparent;
  }
  .mobile-index-ubl-digital-wrapper .learn-more-btn-wrapper .store-icons-wrapper {
    clear: both;
  }
  .mobile-index-ubl-digital-wrapper .learn-more-btn-wrapper .store-icons-wrapper .apple-store-icon {
    background: url("../imgs/ubl-base-sprite.png") no-repeat 0 -23.3rem;
    background-size: 36.65rem 70.2rem;
    width: 18rem;
    height: 5.3rem;
    float: left;
    margin: 0 4.5rem 0 0;
  }
  .mobile-index-ubl-digital-wrapper .learn-more-btn-wrapper .store-icons-wrapper .android-store-icon {
    background: url("../imgs/ubl-base-sprite.png") no-repeat -19rem -23.3rem;
    background-size: 36.65rem 70.2rem;
    width: 17.7rem;
    height: 5.3rem;
    float: left;
  }
  .store-icons-wrapper {
    clear: both;
    margin: 5rem 0;
  }
  .store-icons-wrapper .apple-store-icon {
    /* background: url("../imgs/ubl-base-sprite.png") no-repeat 0 -23.3rem; */
    /* background-size: 36.65rem 70.2rem; */
    /* width: 18rem; */
    /* height: 5.3rem; */
    /* float: none; */
    /* margin: 0 auto 1rem; */
	
	 background: url(../imgs/ubl-base-sprite.png) no-repeat 0 -23.3rem;
    background-size: 36.65rem 70.2rem;
    width: 18rem;
    height: 5.3rem;
    float: none;
    margin: 1.5rem auto 1rem;
  }
  .store-icons-wrapper .android-store-icon {
	  
	  
	   background: url(../imgs/ubl-base-sprite.png) no-repeat -19rem -23.3rem;
    background-size: 36.65rem 70.2rem;
    width: 17.7rem;
    height: 5.3rem;
    float: none;
    margin: 1.5rem auto 5.5rem;
    /* background: url("../imgs/ubl-base-sprite.png") no-repeat -19rem -23.3rem; */
    /* background-size: 36.65rem 70.2rem; */
    /* width: 17.7rem; */
    /* height: 5.3rem; */
    /* float: none; */
    /* margin: 0 auto 5.5rem; */
  }
  .ubl-digi-app-phones {
    background: url("../imgs/index-ubl-digital-phones.png") no-repeat center top;
    background-size: 100%;
    width: 53.8rem;
    height: 73.4rem;
    float: none;
    margin: 0 auto;
  }
  .index-offers-wrapper {
    padding: 4.5rem 0 5rem;
    min-height: initial;
  }
  .index-offers-wrapper .details {
    margin: 1.75rem auto 3.5rem;
    padding: 0 1.5rem;
  }
  .index-offers-wrapper .offers-carousel-wrapper .offer {
    max-width: none;
    margin: 0 1.5rem;
    min-height: 29rem;
  }
  .index-offers-wrapper .offers-carousel-wrapper .offer .details-wrapper .heading {
    text-align: center;
  }
  .index-offers-wrapper .offers-carousel-wrapper .offer .details-wrapper .details {
    text-align: center;
  }
  .feature-cards-wrapper .columns {
    padding: 0 1.5rem !important;
    margin: 0 0 1.5rem;
  }
  .feature-cards-wrapper .feature-card {
    height: 100%;
  }
  .feature-cards-wrapper .feature-card .details {
    width: 100%;
    padding: 0 1.5rem;
    font-size: 1.35rem;
	 min-height: auto;
  }
  .mobile-swipe-msg {
    display: block;
    text-align: center;
    margin: 2rem 0 0;
    font-family: "Aspira-regular", sans-serif;
    font-size: 1.5rem;
    color: #fff;
  }
  .footer-links-wrapper {
    padding: 5.5rem 1rem;
  }
  .footer-links-wrapper .get-info-wrapper {
    float: none;
    max-width: 37rem;
    margin: 0 auto;
  }
  .footer-links-wrapper .get-info-wrapper .country-select-wrapper {
    float: left;
    width: 100%;
  }
  .footer-links-wrapper .get-info-wrapper .country-selector {
    width: 100%;
  }
  .footer-links-wrapper .get-info-wrapper .label-wrapper {
    width: 100%;
    text-align: center;
    margin: 0 2rem 1rem 0;
  }
  .footer-links-wrapper .get-info-wrapper .home-remittance-wrapper {
    margin: 4rem 0 0;
  }
  .footer-links-wrapper .get-info-wrapper .home-remittance-wrapper .input-field-wrapper {
    float: left;
    width: 100%;
  }
  .wrapper-dropdown-5 {
    width: 100% !important;
  }
  .footer-links {
    display: none;
  }
  .footer-mobile-links {
    display: block;
  }
  .accordion {
    background: #e6e7e8;
  }
  .accordion-item {
    border-bottom: .1rem solid #bcbec0;
  }
  .accordion-content {
    padding-top: 0;
    border: 0;
    background-color: transparent;
  }
  .accordion-content ul {
    list-style: none;
  }
  .accordion-content ul li {
    line-height: 2.5rem;
  }
  .accordion-content ul li a {
    font-size: 1.1rem;
    color: #000;
  }
  .accordion-title {
    font-family: 'Aspira-demi', sans-serif;
    font-size: 1.2rem;
    color: #000;
  }
  .medium-textfield {
    width: 100%;
    margin: 0 0 1rem;
  }
  .blue-btn {
    margin: 0 auto;
    display: block;
    float: none;
  }
  .copyrights-wrapper {
    display: none !important;
  }
  .social-media-links-wrapper {
    display: none !important;
  }
  .mobile-copyrights-wrapper {
    display: block;
    margin: 2.25rem 0 0;
  }
  .mobile-copyrights-wrapper .copyrights {
    float: left;
  }
  .mobile-copyrights-wrapper .copyrights .footer-copyrights-label-wrapper {
    padding: 0 1.5rem;
    float: left;
    margin: 0 0 2rem;
    width: 100%;
  }
  .mobile-copyrights-wrapper .copyrights .footer-copyrights-label-wrapper .footer-ubl-logo {
    background: url("../imgs/ubl-base-sprite.png") no-repeat 0 -15.6rem;
    background-size: 36.65rem 70.2rem;
    width: 5.3rem;
    height: 2.5rem;
    margin: 0 0 1rem;
  }
  .mobile-copyrights-wrapper .copyrights .footer-copyrights-label-wrapper .copyrights-label {
    font-family: 'Aspira-regular', sans-serif;
    font-size: 1.2rem;
    color: #808285;
    text-align: left;
  }
  .mobile-copyrights-wrapper .copyrights .privacy-links-wrapper {
    padding: 0 1.5rem;
    margin: 0 0 1.8rem;
  }
  .mobile-copyrights-wrapper .copyrights .privacy-link {
    font-family: 'Aspira-regular', sans-serif;
    font-size: 1.2rem;
    color: #58595b;
    transition: color .3s;
  }
  .mobile-copyrights-wrapper .copyrights .privacy-link:hover {
    color: #0083ca;
  }
  .mobile-copyrights-wrapper .copyrights .footer-link-sep {
    font-family: 'Aspira-regular', sans-serif;
    font-size: 1.2rem;
    color: #808285;
    margin: 0 .8rem;
    display: inline-block;
  }
  .mobile-social-media-links-wrapper {
    display: block;
    margin: 2rem 0 0 1.5rem;
  }
  .mobile-social-media-links-wrapper .social-media-heading {
    font-family: 'Aspira-demi', sans-serif;
    font-size: 1.5rem;
    color: #000;
    margin: 0 0 1rem;
  }
 

 .mobile-social-media-links-wrapper .sc-link-jp {
   background: url(../imgs/ubl-base-sprite.png) no-repeat -97px -19.6rem;
    background-size: 36.65rem 70.2rem;
    width: 2.4rem;
    height: 2.4rem;
    margin: 0 1.9rem 0.75rem 0;
    padding: 0 0 0 3rem;
    box-sizing: border-box;
    color: #808285;
    line-height: 2rem;
    font-size: 1.2rem;
    display: block;  }


  .mobile-social-media-links-wrapper .sc-link-fb {
    background: url("../imgs/FaceBook.svg") no-repeat;
    background-size: 2rem 2rem;
    width: 2rem;
    height: 2rem;
    margin: 0 1.9rem 0.75rem 0;
    padding: 0 0 0 3rem;
    box-sizing: border-box;
    color: #808285;
    line-height: 2rem;
    font-size: 1.2rem;
    display: block;
  }
  .mobile-social-media-links-wrapper .sc-link-tw {
    background: url("../imgs/Twitter.svg") no-repeat;
    background-size: 2rem 2rem;
    width: 2rem;
    height: 2rem;
    margin: 0 1.9rem 0.75rem 0;
    padding: 0 0 0 3rem;
    box-sizing: border-box;
    color: #808285;
    line-height: 2rem;
    font-size: 1.2rem;
    display: block;
  }
  .mobile-social-media-links-wrapper .sc-link-li {
    background: url("../imgs/LinkedIn.svg") no-repeat;
    background-size: 2rem 2rem;
    width: 2rem;
    height: 2rem;
    margin: 0 1.9rem 0.75rem 0;
    padding: 0 0 0 3rem;
    box-sizing: border-box;
    color: #808285;
    line-height: 2rem;
    font-size: 1.2rem;
    display: block;
  }
  .mobile-social-media-links-wrapper .sc-link-gp {
    background: url("../imgs/Googleplus.svg") no-repeat;
    background-size: 2rem 2rem;
    width: 2rem;
    height: 2rem;
    margin: 0 1.9rem 0.75rem 0;
    padding: 0 0 0 3rem;
    box-sizing: border-box;
    color: #808285;
    line-height: 2rem;
    font-size: 1.2rem;
    display: block;
  }
  .mobile-social-media-links-wrapper .sc-link-yt {
    background: url("../imgs/YouTube.svg") no-repeat;
    background-size: 2rem 2rem;
    width: 2rem;
    height: 2rem;
    margin: 0 1.9rem 0.75rem 0;
    padding: 0 0 0 3rem;
    box-sizing: border-box;
    color: #808285;
    line-height: 2rem;
    font-size: 1.2rem;
    display: block;
  }
  .white-bg-container {
    padding: 0;
  }
  .side-nav-inner-page {
    width: 90%;
    height: 100%;
    background-color: #0083ca;
    position: fixed;
    right: -90%;
    top: 10rem;
    max-width: 35rem;
    overflow: auto;
    z-index: 1000 !important;
  }
  .side-nav-img-heading {
    padding: 0 1.5rem 0 1rem;
  }
  .side-nav-img-link-details {
    padding: 0 1.5rem 0 1rem;
  }
  .related-links-back-btn {
    display: block;
    position: absolute;
    top: 2.3rem;
    right: 2rem;
    line-height: 2.3rem;
  }
  .related-links-back-btn-arrow:before {
    font-family: 'FontAwesome';
    content: '\f105';
    font-size: 3rem;
    color: #fff;
  }
  .side-nav-links-wrapper {
    margin: 0 0 12rem;
  }
  .side-nav-img-links-wrapper {
    margin: 0 0 12rem;
  }
  .subpages-small-main-img-wrapper {
    background: url(../imgs/subpages/top-medium-img.jpg) no-repeat center center;
    background-size: cover;
    width: 100%;
    height: 30rem;
    position: fixed;
  }
  .subpages-small-main-img-wrapper .content-wrapper {
    display: none;
  }
  
  .subpages-small-main-img-wrapper_withoutBackgroung {
   
    background-size: cover !important;
    width: 100%;
    height: 30rem;
    position: fixed;
  }
  
  .subpages-small-main-img-wrapper_withoutBackgroung .content-wrapper {
    display: block;
margin: 2rem;

  }
  
  .bread-crums-wrapper {
    display: none;
  }
  .inner-page-content-wrapper {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }
  .fixed-small-img-wrapper {
    height: 30rem;
  }
  .inner-page-content {
    width: 100%;
    margin: 0;
  }
  .inner-page-body-content {
    padding: 0;
  }
  .inner-page-features-list-wrapper {
    padding: 4rem 2.25rem;
    margin-bottom: 0;
  }
  .inner-page-features-list-wrapper .heading {
    margin: 0 0 3.75rem;
  }
  .features-list {
    font-size: 1.4rem;
  }
  .features-lists li {
    background-position: 0 0.3rem;
    background-size: 1.7rem 1.7rem;
    padding: 0 0 0 3.1rem;
  }
  .in-content-products-lists {
    margin-bottom: 0;
  }
  .in-content-products-list-lg-wrapper {
    padding: 3rem 1.5rem;
    width: 100%;
  }
  .in-content-products-list-dg-wrapper {
    padding: 3rem 1.5rem;
    width: 100%;
  }
  .in-content-products-list-img {
    width: 100%;
    height: 20rem;
    margin: 0 0 3rem;
  }
  .in-content-products-list-contents {
    clear: both;
  }
  .in-content-products-list-contents .heading {
    line-height: 3rem;
  }
  /* ===========UBL-DIGITAL-PAYMENT-START=============== */
   .ecommerce-payment-heading{
    padding: 0 1.5rem ;
   }
   
   .row{
		padding:0 1rem;
   }
   
   /*1024*/
.fixed-small-img-wrapper.masthead {
    height: 33rem !important;
}
}

@media (min-width: 768px) {

  .large-4 {
    width: 33.33333%;
  }
  .become-client-content-wrapper .heading {
    font-size: 3rem;
  }
  .become-client-content-wrapper .details {
    width: 40%;
    margin: 0 auto 6rem;
  }
}
@media (width: 768px) {
.subpages-small-main-img-wrapper_withoutBackgroung .details {
	display: none;
}
  /* To change the order of columns*/
  .row-order {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    -moz-flex-flow: row wrap;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
  }

  .small-order-2 {
    order: 2;
    -webkit-order: 2;
    -moz-order: 2;
    -ms-order: 2;
  }

  .small-order-1 {
    order: 1;
    -webkit-order: 1;
    -moz-order: 1;
    -ms-order: 1;
  }

  /* End change the order of columns*/
  .large-4 {
    width: 33.33333% !important;
  }

  .become-client-content-wrapper .heading {
    font-size: 3rem;
  }
  .become-client-content-wrapper .details {
    width: 40%;
    margin: 0 auto 6rem;
  }

  .dob-info-second-wrapper .large-4 {
    width: 100% !important;
  }

  .index-offers-wrapper .offers-carousel-wrapper .offer .details-wrapper {
    min-height: 27rem;
  }

  .device-pic-01,
.device-pic-02,
.device-pic-03 {
    background-size: 25rem 40.6rem;
    width: 25rem;
    height: 40.6rem;
  }
}
@media (max-width: 768px) {
	.subpages-small-main-img-wrapper_withoutBackgroung .details {
	display: none;
}
  .index-banking-wrapper {
    display: none;
  }
  .banking-info-wrapper {
    padding: 0;
  }
  .ubl-blue-panel {
    height: 22.65rem;
    padding: 2rem 11%;
  }
  .ubl-dark-blue-panel {
    background-color: #0f5885;
    width: 100%;
    height: 22.65rem;
    border-left: 0;
    border-right: 0;
    box-sizing: border-box;
    padding: 2rem 11%;
    position: relative;
  }
  .banking-type-details-wrapper {
    width: 13.7rem;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(0, -50%);
    padding: 0 11% 0 0;
  }
  .banking-type-details-wrapper .heading {
    font-size: 1.2rem;
  }
  .banking-type-details-wrapper .details {
    margin: 0.6rem 0 1.1rem;
  }
  .middle-content .details {
    width: 100%;
    padding: 0 3rem;
  }
  .mobile-index-banking-wrapper {
    display: block;
  }
  .mobile-banking-card {
    width: 100%;
    min-height: 0;
    position: relative;
    overflow: hidden;
    display: block;
  }
  .mobile-banking-card .heading {
    bottom: 2.6rem !important;
    position: absolute;
  }
  .mobile-banking-card .heading .small-text {
    font-family: "Aspira-regular", sans-serif;
    font-size: 2.3rem;
    color: #fff;
  }
  .mobile-banking-card .heading .medium-text {
    font-family: "Aspira-regular", sans-serif;
    font-size: 3.8rem;
    color: #fff;
    line-height: 3.3rem;
  }
  .mobile-banking-card .banking-card-01 {
    background: url("../imgs/banking/banking-01.jpg") no-repeat center;
    background-size: cover;
    min-height: 17.5rem;
    box-sizing: border-box;
    padding: 2.3rem;
  }
  .mobile-banking-card .banking-card-02 {
    background: url("../imgs/banking/banking-02.jpg") no-repeat center;
    background-size: cover;
    min-height: 17.5rem;
    box-sizing: border-box;
    padding: 2.3rem;
  }
  .mobile-banking-card .banking-card-03 {
    background: url("../imgs/banking/banking-03.jpg") no-repeat center;
    background-size: cover;
    min-height: 17.5rem;
    box-sizing: border-box;
    padding: 2.3rem;
  }
  .in-content-alliance-list .in-content-alliance-list-item-wrapper .promo-thumbnail {
    display: block;
    width: 100%;
    text-align: center;
    margin-top: 15px;
  }
  .in-content-alliance-list .in-content-alliance-list-item-wrapper .promo-thumbnail img {
    border-radius: 200px;
    margin: auto;
  }
  .in-content-alliance-list .in-content-alliance-list-item-wrapper .discount-offer {
    float: none;
    width: 100%;
  }
  .in-content-alliance-list .in-content-alliance-list-item-wrapper .time-validity {
    float: none;
    width: 100%;
  }
  .in-content-alliance-list .in-content-alliance-list-item-wrapper .area-validity {
    float: none;
  }
  .in-content-alliance-list .in-content-alliance-list-item-wrapper .area-validity i {
    background: url("../imgs/ubl-base-sprite.png") no-repeat -313px -438px !important;
    background-size: 36.65rem 70.2rem !important;
    width: 23px !important;
  }
  .hr-line {
    border: none;
  }
  ul.mapTabsNavigator {
    width: 100%;
    float: none;
    border-left: 1px solid #E1E1E1;
    border-bottom: 1px solid #E1E1E1;
    height: 45px;
  }
  ul.mapTabsNavigator li.tabNav {
    border-top: 1px solid #E1E1E1;
  }
  ul.mapTabsNavigator li.tabNav a {
    width: auto;
    padding: 0 10px;
  }

  /* QR alignment */
  .qr-card-info {
    padding: 0.5rem 0 !important;
    text-align: center;
  }

  .qr-signup-wrapper .qr-img {
    width: 10rem;
    margin: 2.5rem auto;
  }
  .qr-signup-wrapper .heading {
    text-align: center;
    font-size: 3.2rem;
  }
  .qr-signup-wrapper .details {
    text-align: center;
    font-family: "Aspira-light", sans-serif;
    font-size: 1.8rem;
  }
  .searchBranch {
    margin: 20px 0;
  }
  .form-container .field-row label {
    margin-bottom: 5px;
  }
  .form-container .field-row .input-row {
    width: 100%;
  }
  .form-container .field-row .input-row input.form-control {
    width: 100%;
  }
  .Accountno{
	width: 100%;
  }
  .app-intro-wrapper .app-intro-heading-wrapper .app-intro-heading {
    width: 100%;
    font-size: 3.2rem;
    line-height: 1;
  }
  .app-intro-wrapper .app-intro-details-wrapper .app-intro-details {
    width: 90%;
    font-size: 1.8rem;
  }
  .app-intro-wrapper .app-store-download-wrapper {
    height: auto;
    width: 100%;
  }
  .app-intro-wrapper .app-phone-video-wrapper {
    padding: 0 4rem;
  }
  .app-intro-wrapper .app-phone-video-wrapper .app-iphone-gold {
    width: 100%;
    background-size: contain;
    background-position: center;
    height: 29rem;
    bottom: -2rem;
    z-index: -1;
  }
  .app-intro-wrapper .app-phone-video-wrapper .app-video {
    width: 100%;
    z-index: -1;
    height: 31.7rem;
    top: 6rem;
  }
  .app-intro-wrapper .app-phone-video-wrapper .app-video div {
    margin: 0 15px;
  }
  .app-intro-wrapper .app-phone-video-wrapper .app-video video {
    height: 25.5rem !important;
    transform: none !important;
    top: 0 !important;
    left: 0 !important;
  }
  .app-intro-wrapper .app-phone-video-wrapper .app-overlay {
    width: 100%;
    background-size: contain;
    height: 100%;
  }
  .app-graph-feature-wrapper .app-graph-heading {
    width: 100%;
    font-size: 3.2rem;
    line-height: 1;
  }
  .app-graph-feature-wrapper .app-graph-desc {
    width: 100%;
    font-size: 1.8rem;
  }
  .devices-app-features-wrapper .device-app-feature {
    padding: 4rem 0;
  }
  #feature-dtl-bill1 {
    height: 100%;
  }
  #feature-dtl-bill1 .app-pic-bill-management-details-panel {
    text-align: center;
    padding: 4rem 0;
  }
  #feature-dtl-bill1 .app-pic-bill-management-details-panel .app-pic-bill-management-details-wrapper {
    top: 0;
    left: 0;
    position: relative;
    transform: none;
  }
  #feature-dtl-bill1 .app-pic-bill-management-details-panel .app-pic-bill-management-details-wrapper .app-pic-bill-management-details-heading {
    width: 100%;
    font-size: 3.2rem;
  }
  #feature-dtl-bill1 .app-pic-bill-management-details-panel .app-pic-bill-management-details-wrapper .app-pic-bill-management-details-desc {
    width: 100%;
    font-size: 1.8rem;
    margin: 1.5rem 0 0;
  }
  #feature-dtl-bill2 {
    clear: both;
    padding-top: 5rem;
    margin-bottom: 5rem;
  }
  #feature-dtl-bill2 .app-pic-bill-management-details-panel {
    text-align: center;
    padding: 4rem 0;
  }
  #feature-dtl-bill2 .app-pic-bill-management-details-panel .app-pic-bill-management-details-wrapper {
    top: 0;
    left: 0;
    position: relative;
    transform: none;
  }
  #feature-dtl-bill2 .app-pic-bill-management-details-panel .app-pic-bill-management-details-wrapper .app-pic-bill-management-details-heading {
    width: 100%;
    font-size: 3.2rem;
  }
  #feature-dtl-bill2 .app-pic-bill-management-details-panel .app-pic-bill-management-details-wrapper .app-pic-bill-management-details-desc {
    width: 100%;
    font-size: 1.8rem;
    margin: 1.5rem 0 0;
  }
  /* Print Media and Video Media pages */
  ul.print-media-gallerylist li {
    float: none;
    clear: both;
    width: 90%;
    max-width: 90%;
    margin: 0 auto 4rem;
  }
  ul.print-media-gallerylist li:nth-child(3n) {
    margin: 0 auto 4rem;
  }
  ul.video-media-gallerylist li {
    float: none;
    clear: both;
    width: 90%;
    max-width: 90%;
    margin: 0 auto 4rem;
  }
  ul.video-media-gallerylist li .media-thumbnail {
    height: 100%;
    max-height: 22.5rem;
  }
  ul.video-media-gallerylist li .media-thumbnail .controls {
    top: 25rem;
  }
  ul.video-media-gallerylist li:hover .controls {
    top: 10rem;
  }
  ul.video-media-gallerylist li:nth-child(3n) {
    margin: 0 auto 4rem;
  }
  
  .feature-cards-wrapper .feature-card .details {
    min-height: auto;
}

/* ===========UBL-DIGITAL-PAYMENT-START=============== */
      .new-print-media-gallerylist li {
        width: 30% !important;
    }
    .new-media-thumbnail{
      padding:1.5rem;
    }

    .evoicing-thumbnail {
      height: 160px !important;
  }
  
      /* ========================== */
	  .good-citizen-city-field{
		  width:100%
	  }
	  
	  
	  /* 768 */
/* ====================Roshan-apna-ghar-UBL-ADDRESS updates CSS Start==================== */
.ublAddress-skygarden-content {
    flex-direction: column;
    gap: 30px;
}
/* ====================Roshan-apna-ghar-UBL-ADDRESS updates CSS End==================== */

/* 768 */
/* ====================Roshan-apna-ghar-UBL-ADDRESS updates CSS Start==================== */
.ublAddress-skygarden-content {
    flex-direction: column;
    gap: 30px;
}

.mpos-readyToTransform.skyGarden-ApprovedProject {
    /* margin: 75px 0; */
    margin: 125px 0 75px;
}
/* ====================Roshan-apna-ghar-UBL-ADDRESS updates CSS End==================== */

}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
select:focus, textarea:focus, input:focus {
        font-size: 12px;
    }
}
/* For Landscape mobile View , and a Portrait of small tablet */
@media (min-width: 560px) and (max-width: 768px) {
  .banking-type-details-wrapper {
    width: 50%;
  }
  /* Mobile Banking Page */
  .store-icons-wrapper {
    width: 70%;
    margin: 0 auto 0;
    height: 5.3rem;
  }
  .store-icons-wrapper .apple-store-icon {
    float: left;
  }
  .store-icons-wrapper .android-store-icon {
    float: right;
  }
  .app-intro-wrapper .app-phone-video-wrapper .app-iphone-gold {
    background-position: center;
    width: 30rem;
  }
  .app-intro-wrapper .app-phone-video-wrapper .app-video div {
    left: 0;
  }
  .app-bill-management-panel .app-pic-bill-management img {
    width: 60%;
    margin: auto;
    display: block;
  }
  #feature-dtl-bill1 {
    margin-top: 0;
    height: auto;
  }
  /* video media page */
  ul.video-media-gallerylist li,
  ul.video-media-gallerylist li:nth-child(3n) {
    float: left;
    clear: none;
    width: 40%;
    max-width: 40%;
    margin: 0 6.5% 4rem;
  }
  ul.video-media-gallerylist li .media-thumbnail,
  ul.video-media-gallerylist li:nth-child(3n) .media-thumbnail {
    height: 100%;
    max-height: 18.5rem;
  }
  ul.video-media-gallerylist li:hover .controls,
  ul.video-media-gallerylist li:nth-child(3n):hover .controls {
    top: 7rem;
  }
  ul.video-media-gallerylist li:nth-child(2n) {
    margin: 0 auto 4rem;
  }
  /* video media page */
  ul.print-media-gallerylist li,
  ul.print-media-gallerylist li:nth-child(3n) {
    float: left;
    clear: none;
    width: 40%;
    max-width: 40%;
    margin: 0 6.5% 4rem;
  }
  ul.print-media-gallerylist li .media-thumbnail,
  ul.print-media-gallerylist li:nth-child(3n) .media-thumbnail {
    height: 100%;
    max-height: auto;
  }
  ul.print-media-gallerylist li:hover .controls,
  ul.print-media-gallerylist li:nth-child(3n):hover .controls {
    top: -11rem;
  }
  ul.print-media-gallerylist li:nth-child(2n) {
    margin: 0 auto 4rem;
  }
}

/* For Portrait of Tablets */
@media (min-width: 769px) and (max-width: 1024px) {
  .app-store-download-wrapper {
    width: 100%;
  }
  .app-store-download-wrapper .store-icons-wrapper {
    width: 50%;
    margin: 0 auto 0;
    height: 5.3rem;
  }
  .app-store-download-wrapper .store-icons-wrapper .apple-store-icon {
    float: left;
  }
  .app-store-download-wrapper .store-icons-wrapper .android-store-icon {
    float: right;
  }
  .devices-app-features-wrapper .device-details .device-details-desc {
    padding: 1.5rem 2rem 0;
  }
  .devices-app-features-wrapper .device-pic-01 {
    background-size: contain;
    width: 100%;
    height: 45rem;
  }
  .devices-app-features-wrapper .device-pic-02 {
    background-size: contain;
    width: 100%;
    height: 45rem;
  }
  .devices-app-features-wrapper .device-pic-03 {
    background-size: contain;
    width: 100%;
    height: 45rem;
  }
  .app-pic-bill-management-details-panel {
    text-align: center;
    margin-top: 4rem;
  }
  .app-pic-bill-management-details-panel .app-pic-bill-management-details-wrapper {
    top: 0;
    left: 0;
    position: relative;
    transform: none;
    margin-bottom: 5rem;
  }
  .app-pic-bill-management-details-panel .app-pic-bill-management-details-wrapper .app-pic-bill-management-details-heading {
    width: 100%;
    font-size: 3.2rem;
  }
  .app-pic-bill-management-details-panel .app-pic-bill-management-details-wrapper .app-pic-bill-management-details-desc {
    width: 100%;
    font-size: 1.8rem;
    margin: 1.5rem 0 0;
  }
  ul.video-media-gallerylist li:hover .controls {
    top: 7rem;
  }
}



@media (max-width: 580px) {
   /* ===========UBL-DIGITAL-PAYMENT-START=============== */
   .new-print-media-gallerylist li {
    width: 100% !important;
}

.evoicing-thumbnail {
  width: 100% !important;
}

.einvoicing-label{
  width: 100% !important;
}

.digital-payment-heading {
  margin: 1rem 0 1rem;
  padding: 0px;
}

.new-gallery-list li{
  width: 100% !important;
  max-width: 100% !important;
}
  /* ========================== */
  
  
  
  
/*580*/
 /* new-header-css-start */
    .mobile-menu-label-top {
      float: left !important;
      padding: 1rem 0 0 0 !important;
    }
    .new-form-small-wrapper .remi-trac-btn {
      padding: 2.15rem 1.8rem 1.5rem 0.5rem !important;
    }
    .new-form-small-wrapper .ib-login-btn {
      padding: 2.15rem 1.8rem 1.5rem 0.5rem !important;
	  font-size:1.4rem;
    }
    .new-form-small-wrapper .remi-trac-btn:hover {
      padding: 2.15rem 1.8rem 1.5rem 0.5rem !important;
    }
    .new-form-small-wrapper .ib-login-btn:hover {
      padding: 2.15rem 1.8rem 1.5rem 0.5rem !important;
    }
    .new-form-small-wrapper .remi-trac-btn-open {
      padding: 2.15rem 1.8rem 2.15rem 0.5rem !important;
    }
    .new-form-small-wrapper .ib-login-btn-open {
      padding: 2.15rem 1.8rem 2.15rem 0.5rem !important;
    }
    .new-form-small-wrapper .remi-trac-btn-open:hover {
      padding: 2.15rem 1.8rem 2.15rem 0.5rem !important;
    }
    .new-form-small-wrapper .ib-login-btn-open:hover {
      padding: 2.15rem 1.8rem 2.15rem 0.5rem !important;
    }
	
	.remi-trac-btn:after {
    top: 55%;
}
.ib-login-btn:after {
    top: 55%;
}
    /* new-header-css-end */


/*580*/
.fixed-small-img-wrapper.masthead {
    height: 13rem !important;
}
	
	
/*580*/
/* ====================Roshan-apna-ghar-UBL-ADDRESS updates CSS Start==================== */
.ublAddress-skygarden-links {
    display: flex;
    gap: 30px;
    flex-direction: column;
}

.ublAddress-skygarden-links>a{
  justify-content: space-between;
}
/* ====================Roshan-apna-ghar-UBL-ADDRESS updates CSS End==================== */


/* 580 */
/* ====================Roshan-apna-ghar-UBL-ADDRESS updates CSS Start==================== */
.ublAddress-skygarden-links {
    display: flex;
    gap: 30px;
    flex-direction: column;
}

.ublAddress-skygarden-links>a{
  justify-content: space-between;
}

.skyGradenImageBanner a{
    bottom: 18px;
    left: 18px;
    font-size: 20px;
}

.skygarden-h1{
    margin: 5rem 0 3rem;
}
/* ====================Roshan-apna-ghar-UBL-ADDRESS updates CSS End==================== */
	
	
}



@media (max-width: 414px) {
	
  .become-client-wrapper {
    padding: 7.5rem 3rem;
  }
  .become-client-wrapper .heading {
    font-size: 2.1rem;
  }
  .banking-info-wrapper {
    padding: 0;
  }
  .ubl-blue-panel {
    height: 22.65rem;
    padding: 2rem 11%;
  }
  .ubl-dark-blue-panel {
    background-color: #0f5885;
    width: 100%;
    height: 22.65rem;
    border-left: 0;
    border-right: 0;
    box-sizing: border-box;
    padding: 2rem 11%;
    position: relative;
  }
  .ubl-digi-app-phones {
    background: url("../imgs/index-ubl-digital-phones.png") no-repeat center top;
    background-size: 100%;
    height: 67.8rem;
    width: 100%;
    float: none;
    margin: 0;
  }
  .banking-type-details-wrapper {
    width: 26.2rem;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(0, -50%);
    padding: 0 11% 0 0;
  }
  .banking-type-details-wrapper .heading {
    font-size: 2.2rem;
  }
  .banking-type-details-wrapper .details {
    margin: 0.6rem 0 1.1rem;
  }
}
/* 1792x828px at 326ppi iPhone XR */
@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) {
  .app-video {
    width: 100% !important;
  }
  .app-video video {
    margin-left: 2rem !important;
  }

  .app-overlay {
    margin-left: 0;
  }

  .app-promo-screens {
    background-size: 195% !important;
    background-position: -100px bottom !important;
  }

  .app-intro-wrapper .app-phone-video-wrapper {
    padding: 0 2rem !important;
  }

  .banner-content {
    margin-top: 10rem !important;
    width: 65% !important;
  }

  #awesomeFeatures .taglines {
    font-size: 1.6rem !important;
    width: 100% !important;
    margin: 0 auto 6rem !important;
  }
  #awesomeFeatures .col3 {
    width: 100% !important;
    float: none !important;
    margin-bottom: 7rem !important;
  }
  #awesomeFeatures #scene2 {
    margin: 7rem 0 0 -7rem !important;
    float: left !important;
    width: 40% !important;
  }
  #awesomeFeatures #how-app-works {
    top: -55px;
    width: 70%;
    float: right;
    overflow: visible;
    margin: 0;
  }
  #awesomeFeatures #how-app-works .content-block {
    width: auto;
    margin: 0;
  }
  #awesomeFeatures #how-app-works .content-block ul li {
    padding: 0 0 0 1rem;
  }
  #awesomeFeatures #how-app-works .content-block ul li p {
    font-size: 1.3rem;
  }

  .tools-wrapper ul.tools-list li {
    display: block;
    float: none !important;
    width: 100% !important;
    margin-bottom: 8rem;
  }

  .banking-type-details-wrapper {
    width: 23.7rem !important;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(0, -50%);
    padding: 0 11% 0 0;
  }
  .banking-type-details-wrapper .heading {
    font-size: 1.2rem;
  }
  .banking-type-details-wrapper .details {
    margin: 0.6rem 0 1.1rem;
  }

  .pagination-block {
    float: left !important;
    margin-top: 50px;
  }
  .pagination-block ul li {
    margin: 0 5px !important;
  }
  .pagination-block ul li:first-child {
    margin-right: 1rem !important;
  }
  .pagination-block ul li:last-child {
    margin-left: 1rem !important;
  }
  .pagination-block ul li:first-child a {
    padding: 1.2rem !important;
  }
  .pagination-block ul li:last-child a {
    padding: 1.2rem !important;
  }
}

/*For iphone XR , Xs Max */
@media only screen and (device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) {
  .app-video {
    width: 88% !important;
  }
  .app-video video {
    margin-left: 0 !important;
  }

  .app-overlay {
    margin-left: 0;
  }

  .app-promo-screens {
    background-size: 195% !important;
    background-position: -100px bottom !important;
  }

  .banner-content {
    margin-top: 2rem !important;
    width: 65% !important;
  }

  .banking-type-details-wrapper {
    width: 23.7rem !important;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(0, -50%);
    padding: 0 11% 0 0;
  }
  .banking-type-details-wrapper .heading {
    font-size: 1.2rem;
  }
  .banking-type-details-wrapper .details {
    margin: 0.6rem 0 1.1rem;
  }
  .banking-type-details-wrapper .pagination-block {
    float: left !important;
    margin-top: 50px !important;
  }
  .banking-type-details-wrapper .pagination-block ul li {
    margin: 0 5px !important;
  }
  .banking-type-details-wrapper .pagination-block ul li:first-child {
    margin-right: 1rem !important;
  }
  .banking-type-details-wrapper .pagination-block ul li:last-child {
    margin-left: 1rem !important;
  }
  .banking-type-details-wrapper .pagination-block ul li:first-child a {
    padding: 1.2rem !important;
  }
  .banking-type-details-wrapper .pagination-block ul li:last-child a {
    padding: 1.2rem !important;
  }

}
@media only screen and (min-width: 412px) and (max-width: 767px) {
  .app-video {
    width: 100% !important;
  }
  .app-video video {
    margin-left: -0.5rem !important;
    left: 0rem !important;
  }

  /* To change the order of columns*/
  .row-order {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    -moz-flex-flow: row wrap;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
  }

  .small-order-2 {
    order: 2;
    -webkit-order: 2;
    -moz-order: 2;
    -ms-order: 2;
  }

  .small-order-1 {
    order: 1;
    -webkit-order: 1;
    -moz-order: 1;
    -ms-order: 1;
  }
}
@media only screen and (min-width: 412px) and (max-width: 869px) {
  .app-video {
    width: 100% !important;
  }
  .app-video video {
    margin-left: -1rem !important;
    left: 0rem !important;
  }

  /* End change the order of columns*/
}

/* Pexel 2, 2xl */
@media screen and (device-width: 411px) and (device-height: 731px) {
  .app-video {
    width: 88% !important;
  }

  .app-overlay {
    margin-left: 2rem;
  }
}
@media screen and (device-width: 411px) and (device-height: 823px) {
  .app-video {
    width: 88% !important;
  }

  .app-overlay {
    margin-left: 20px;
  }
}




@media (max-width: 375px) {
     /* To change the order of columns*/
    .row-order {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    -moz-flex-flow: row wrap;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
  }

  .small-order-2 {
    order: 2;
    -webkit-order: 2;
    -moz-order: 2;
    -ms-order: 2;
  }

  .small-order-1 {
    order: 1;
    -webkit-order: 1;
    -moz-order: 1;
    -ms-order: 1;
  }
  .ubl-digi-app-phones {
    background: url("../imgs/index-ubl-digital-phones.png") no-repeat center top;
    background-size: 100%;
    height: 61.4rem;
    width: 100%;
    float: none;
    margin: 0;
  }
  .banking-type-details-wrapper {
    width: 23.1rem;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(0, -50%);
    padding: 0 11% 0 0;
  }
  .banking-type-details-wrapper .heading {
    font-size: 2.2rem;
  }
  .banking-type-details-wrapper .details {
    margin: 0.6rem 0 1.1rem;
  }

   .device-pic-01,
.device-pic-02,
.device-pic-03 {
    background-size: 25rem 40.6rem;
    width: 25rem;
    height: 40.6rem;
  }
}

@media (max-width: 320px) {
	
	.app-iphone-gold {
    bottom: -3rem !important;
  }

  .app-video {
    top: 8rem !important;
  }

  .app-overlay {
    top: 3.5rem !important;
  }
	
	
	
  .ubl-digi-app-phones {
    background: url("../imgs/index-ubl-digital-phones.png") no-repeat center top;
    background-size: 120%;
    height: 52.4rem;
    width: 100%;
    float: none;
    margin: 0;
  }
  .banking-type-details-wrapper {
    width: 17.7rem;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(0, -50%);
    padding: 0 11% 0 0;
  }
  .banking-type-details-wrapper .heading {
    font-size: 1.6rem;
  }
  .banking-type-details-wrapper .details {
    margin: 0.6rem 0 1.1rem;
  }

    .device-pic-01,
.device-pic-02,
.device-pic-03 {
    background-size: 28rem 45.4rem;
    width: 28rem;
    height: 45.4rem;
  }
}

/*iphone 6,7,8 */
@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) {
  .app-video {
    width: 88% !important;
  }

  .app-overlay {
    margin-left: 2rem;
  }

}

/* For ipad */
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) {
    .devices-app-features-wrapper .device-details .device-details-desc {
    padding: 1.5rem 2rem 0;
  }
  .devices-app-features-wrapper .device-pic-01 {
    background-size: contain;
    width: 100%;
    height: 45rem;
  }
  .devices-app-features-wrapper .device-pic-02 {
    background-size: contain;
    width: 100%;
    height: 45rem;
  }
  .devices-app-features-wrapper .device-pic-03 {
    background-size: contain;
    width: 100%;
    height: 45rem;
  }
}
@media all and (device-width: 1024px) and (device-height: 768px) and (orientation:landscape) {
    .devices-app-features-wrapper .device-details .device-details-desc {
    padding: 1.5rem 2rem 0;
  }
  .devices-app-features-wrapper .device-pic-01 {
    background-size: contain;
    width: 100%;
    height: 45rem;
  }
  .devices-app-features-wrapper .device-pic-02 {
    background-size: contain;
    width: 100%;
    height: 45rem;
  }
  .devices-app-features-wrapper .device-pic-03 {
    background-size: contain;
    width: 100%;
    height: 45rem;
  }
}

@media only screen and (min-width: 1024px) and (orientation: portrait){

.banking-card .details-wrapper .details {
    font-size: 1.2rem;
}
}
/** Speak to UBL **/
@media screen and (max-width: 39.9375em) {
  .contact-panel {
    width: 100%;
    right: 0;
  }
}
/** End Speak to UBL **/