/* Media query for mobile devices */
@media screen and (max-width: 768px) {
  .hero {
    background-image: url(/./assets/images/banner/Power_Web_Banner\ _3-1425x855-mobile.png); 
    height: 400px; /* Adjust height if necessary */
  }
}


/* Targeting iPhone 6, 7, 8 in portrait mode */
@media only screen
  and (device-width: 375px)
  and (device-height: 667px)
  and (-webkit-device-pixel-ratio: 2)
  and (orientation: portrait)  {
      
    .remove{
      width: 0px;
      height: 0px;
      visibility: hidden;
      padding: 0px;
   }
.m-x-h{
    max-height: 80px;
}
.m-x-c{
    background-color: #fff;
    max-width:334px;
    margin-bottom: 26px;
}

.m-x-co{
  border:none;
}
.m-x-h{
    max-height: 80px;
}
.m-x-c{
    background-color: #fff;
    max-width:334px;
    margin-bottom: 26px;
}

.m-x-co{
  border:none;
}
   
    .hero{
      height: 750px;
    }
    #hero-section .p-1{
      padding-top: 9rem !important;
  }
    #hero-section .m-padding .col-lg-5{
      padding: 1.3rem !important;
  }
    .header-padding{
    padding: 0 0.5rem;
  }

  section{
    padding-left: calc(var(--bs-gutter-x) * .5) !important;
    padding-right: calc(var(--bs-gutter-x) * .5) !important;
}
#mobile-app {
    padding-left: calc(var(--bs-gutter-x) * .5) !important;
    padding-right: calc(var(--bs-gutter-x) * .5) !important;
}
#search-section .px-4 {
    padding-right: 1rem !important;
    padding-left: 1rem !important;
}

/*----------icon section--------------*/

.image-container {
  width: 45px; /* Adjust width for smaller screens */
  height: 45px !important; /* Adjust height for smaller screens */
 
  margin-left: 5px;
  margin-right: 5px;
}
.image-container img {
  width: 35px;
  height: 35px; 
}
.side-content {
  padding-right: 0.5rem!important;
  padding-left: 0.1rem!important;
  align-items: center; /* Adjust alignment for mobile screens */
 
}
.btn-block img {
  width: 35px;
  height: 35px; 
}
.w20-x img {
  width: 35px;
  height: 35px; 
}


/*------------End------------*/

  .hero-circle{
    background-image: url('/./assets/images/banner/12122023.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top center;
  }

  #hero-i{
    visibility: hidden;
  }
  .px-4 {
    padding-right: 0rem !important; 
    padding-left: 0rem !important;
}
  /*.custom-text{
      font-size: 0.7rem;
      font-weight: 500;
      line-height: 19px;
  }*/
  
  
  
  
    h3{
  
      text-align: center;
    }
    p{
      text-align: center;
    }
    .hero p{
      text-align: left !important;
    }
    .hero h1{
      text-align: left !important;
      font-size: 45px !important;
    }
    .contents  p{
      text-align: left;
    }
  
    .column {
      flex: 0 0 100%; /* Set to full width on smaller screens */
    }
    .col-x {
      margin-top: 13%;
      margin-bottom: 13%;
      width: 49%;
   }
   .col-x .options-container{
    margin-top: 13%;
   }
   .options-container span {
    font-size: 13px;
   }
   .sm-justify-content{
    justify-content:center !important;
    margin-top: 1%;
    margin-bottom: 9%;
   }
   #update-your-information .inner-section{
    max-width: 90%;
  }
  #phone-display {
    min-width: 100%;
  }
  
  
    .laptop-inner {
    padding-left: 11px;
    padding-right: 11px;
}
     #online-bank .align-items-center > * {
       flex: 0 0 50%;
       max-width: 50%;
     }
   
     /*#online-bank .col-sm-3 img {
       width: 90%;
       height: auto;
       margin-top: 14%;
       
     }*/
       
     #online-bank .col-sm-3 {
       padding-right: 5px!important;
       padding-left: 5px!important;
     
  
     }
  
     #online-bank .col-sm-3:last-child {
       padding-left: 5px !important;
       
     }
     #online-bank .col  span{
       padding-left: 0% !important;
     }
     #online-bank .col div{
       height: 63px;
     }
   
    .tab-buttons {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      padding:0 10%;
      max-width: 340px;
    margin: auto;
    }
  
   
    .tab-btn-left{
      border-radius: 5px 5px 0px 0px !important;
  
    }
    .tab-btn-right{
      border-radius: 0px 0px 5px 5px !important;
  
    }
    .loginButton{
      padding: 20%;
    }
  
  
    
    #switch-btn-container{
      padding:0 2%;
    }
  
    .tab-buttons {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      padding:5% 10%;
      
    }
  
    .tab-buttons button {
      width: 100%; 
      margin: 0 5px;
      border: 1px solid #fff;
      border-radius: 5px; 
      padding:4%;
    }
   
  
      .main-btn {
          width: 100%; /* Make the container full-width on mobile */
      }
      .search-container{
        position: relative;
        width: 100%;
        margin: auto;
    }  .search-container input[type="search"]{
     
      width: 100%;
  }
  
    .online-column {
      flex: 0 0 calc(50% - 20px); /* Two columns on smaller screens */
    }
  
    #ncb-assist{
      background-color:var(--navi_blue);
      margin: 12% 0;
      padding: 12% 0;
      
    }
    #phone-display-39{
      height: 480px;
      margin: auto;
  }
    .v-tab_tab-head {
        /* Reset to default stacking for small displays */
        display: inline-flex;
        text-align: center; /* Center the items vertically */
    }
  
    .v-tab_tab-head .tab-icons {
        /* Additional styles for list items on small displays */
        display: inline-flex;
        margin: 5px; /* Adjust spacing between items */
    }
    .divider {
      height: 66px;
      transform: rotate(90deg);
      margin: 0;
  }
  .v-tab .v-tab_tab-head {
    height: 32px;
    width: 100%;
  }
  .v-tab .v-tab_tab-head li {
  
  height: 53px;
  width: 53px;
  }
  /*#half-shape {
  width: 100%;
  
  height: 919px;
  margin: auto;
  }*/
  .v-tab_content{
  margin-top: 13% !important;
  
  width: 100% !important;
  }
  .v-tab .v-tab_content {
   display: none;
    margin-left: auto;
  }
  .v-tab {
  margin-top: 0%;
  }
  .v-tab .v-tab_tab-head .tab-icons{
    transform: rotate(270deg);
  }
  .v-tab .v-tab_tab-head li.active{
    transform: rotate(270deg);
    z-index: 10;
  }

.v-tab .v-tab_tab-head li:hover {
  background-image: url(/./assets/images/Icons/Group\ 162594@2x.png);
  background-color: var(--tin-blue);
  color: #fff;
}

.v-tab .v-tab_tab-head li.active {
  /*border-right: 3px solid var(--border-color-active);*/
  background-color:  var(--tin-blue);
  color: #fff;
  display: block;
}
.tab-icons.active{
  background-image: url(/./assets/images/Icons/Group\ 162594@2x.png);
  box-shadow:none;
  background-repeat: no-repeat;
  background-size: cover;
}
  
    .reduce-size {
      max-width: 96% !important;
    }
    #phone-display-39 {
      object-fit: contain;
    }
    #appointmet-cotainer .heading{
      width: 209px;
    }
    #appointmet-cotainer .active .heading{
      width: 209px;
    }
  
     footer{ width: 100vw;}
      
    
    .x-section-sm{
      width: 100%;
      padding: 0 10%;
     
     }
  
   
  
 
  #copy-right p{
    max-width: 100%;
    box-sizing: border-box;
    padding:0px;
  }
  
  
    footer{
      width: 100vw;
      
    }
  
    .x-row-2{
      display: flex;
      flex-wrap: wrap;
      
  }
  
  .x-border1{
    border:none;
    padding: 4.9rem 
   
  }
  
  .x-border2{
    border-top:solid 1px #fff;
    border-left:none; 
    padding: 1rem
    
  
  }
.top-m-x{
    margin-top:4rem;
}
  #copy-right p{
    max-width: 100%;
    box-sizing: border-box;
    padding:0px;
  }
  
  
  
    .side-padding{
     
        padding: 1% 0 5% 0;
    
    }
  
  
    .side-padding{
     
        padding: 0 5% !important;
    
    }
    .blue{
      background-color: var(--navi_blue) !important;
    }
  
    .w20-x{
      width: 20%;
  
    }
  
    .nowrap{
      flex-wrap: nowrap;
    }
  
    .nowrap .col-sm-3{
      max-width: 37%;
    }
    
  
    .button-row {
      display: flex;
      flex-wrap: wrap;
    }
  
    .button {
      flex: 0 0 calc(50% - 20px); 
      font-size: 70%;
    }
    .smaller-btn{
      max-width: 116px;
  }
  #card-online .p-3 {
    padding: 1rem 0.1rem!important;}
  }



/* Targeting Samsung Galaxy S8 and S9 in portrait mode */
@media only screen
  and (device-width: 360px)
  and (device-height: 740px)
  and (-webkit-device-pixel-ratio: 4)
  and (orientation: portrait) {
    .remove{
      width: 0px;
      height: 0px;
      visibility: hidden;
      padding: 0px;
   }
.m-x-h{
    max-height: 80px;
}
.m-x-c{
    background-color: #fff;
    max-width:334px;
    margin-bottom: 26px;
}

.m-x-co{
  border:none;
}
.m-x-h{
    max-height: 80px;
}
.m-x-c{
    background-color: #fff;
    max-width:334px;
    margin-bottom: 26px;
}

.m-x-co{
  border:none;
}
    .hero{
      height: 750px;
    }
    #hero-section .p-1{
      padding-top: 9rem !important;
  }
    #hero-section .m-padding .col-lg-5{
      padding: 1.3rem !important;
  }
    .header-padding{
    padding: 0 0.5rem;
  }

  section div{
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
  }
#mobile-app {
    padding-left: calc(var(--bs-gutter-x) * .5) !important;
    padding-right: calc(var(--bs-gutter-x) * .5) !important;
}
#search-section .px-4 {
    padding-right: 1rem !important;
    padding-left: 1rem !important;
}

  .hero-circle{
    background-image: url('/./assets/images/banner/12122023.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top center;
  }

  #hero-i{
    visibility: hidden;
  }
  .px-4 {
    padding-right: 0rem !important; 
    padding-left: 0rem !important;
}
  /*.custom-text{
      font-size: 0.7rem;
      font-weight: 500;
      line-height: 19px;
  }*/
  
  
  
  
    h3{
  
      text-align: center;
    }
    p{
      text-align: center;
    }
    .hero p{
      text-align: left !important;
    }
    .hero h1{
      text-align: left !important;
      font-size: 45px !important;
    }
    .contents  p{
      text-align: left;
    }
  
    .column {
      flex: 0 0 100%; /* Set to full width on smaller screens */
    }
    .col-x {
      margin-top: 13%;
      margin-bottom: 13%;
      width: 49%;
   }
   .col-x .options-container{
    margin-top: 13%;
   }
   .options-container span {
    font-size: 13px;
   }
   .sm-justify-content{
    justify-content:center !important;
    margin-top: 1%;
    margin-bottom: 9%;
   }
   #update-your-information .inner-section{
    max-width: 90%;
  }
  #phone-display {
    min-width: 100%;
  }
  
  
    .laptop-inner {
    padding-left: 11px;
    padding-right: 11px;
}
     #online-bank .align-items-center > * {
       flex: 0 0 50%;
       max-width: 50%;
     }
   
     /*#online-bank .col-sm-3 img {
       width: 90%;
       height: auto;
       margin-top: 14%;
       
     }*/
       
     #online-bank .col-sm-3 {
       padding-right: 5px!important;
       padding-left: 5px!important;
     
  
     }
  
     #online-bank .col-sm-3:last-child {
       padding-left: 5px !important;
       
     }
     #online-bank .col  span{
       padding-left: 0% !important;
     }
     #online-bank .col div{
       height: 63px;
     }
   
    .tab-buttons {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      padding:0 10%;
      max-width: 340px;
    margin: auto;
    }
  
   
    .tab-btn-left{
      border-radius: 5px 5px 0px 0px !important;
  
    }
    .tab-btn-right{
      border-radius: 0px 0px 5px 5px !important;
  
    }
    .loginButton{
      padding: 20%;
    }
  
  
    
    #switch-btn-container{
      padding:0 2%;
    }
  
    .tab-buttons {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      padding:5% 10%;
      
    }
  
    .tab-buttons button {
      width: 100%; 
      margin: 0 5px;
      border: 1px solid #fff;
      border-radius: 5px; 
      padding:4%;
    }
   
  
      .main-btn {
          width: 100%; /* Make the container full-width on mobile */
      }
      .search-container{
        position: relative;
        width: 100%;
        margin: auto;
    }  .search-container input[type="search"]{
     
      width: 100%;
  }
  
    .online-column {
      flex: 0 0 calc(50% - 20px); /* Two columns on smaller screens */
    }
  
    #ncb-assist{
      background-color:var(--navi_blue);
      margin: 12% 0;
      padding: 12% 0;
      
    }
    #phone-display-39{
      height: 480px;
      margin: auto;
  }
    .v-tab_tab-head {
        /* Reset to default stacking for small displays */
        display: inline-flex;
        text-align: center; /* Center the items vertically */
    }
  
    .v-tab_tab-head .tab-icons {
        /* Additional styles for list items on small displays */
        display: inline-flex;
        margin: 5px; /* Adjust spacing between items */
    }
    .divider {
      height: 66px;
      transform: rotate(90deg);
      margin: 0;
  }
  .v-tab .v-tab_tab-head {
    height: 32px;
    width: 100%;
  }
  .v-tab .v-tab_tab-head li {
  
  height: 53px;
  width: 53px;
  }
  /*#half-shape {
  width: 100%;
  
  height: 919px;
  margin: auto;
  }*/
  .v-tab_content{
  margin-top: 13% !important;
  
  width: 100% !important;
  }
  .v-tab .v-tab_content {
   display: none;
    margin-left: auto;
  }
  .v-tab {
  margin-top: 0%;
  }
  .v-tab .v-tab_tab-head .tab-icons{
    transform: rotate(270deg);
  }
  .v-tab .v-tab_tab-head li.active{
    transform: rotate(270deg);
    z-index: 10;
  }

.v-tab .v-tab_tab-head li:hover {
  background-image: url(/./assets/images/Icons/Group\ 162594@2x.png);
  background-color: var(--tin-blue);
  color: #fff;
}

.v-tab .v-tab_tab-head li.active {
  /*border-right: 3px solid var(--border-color-active);*/
  background-color:  var(--tin-blue);
  color: #fff;
  display: block;
}
.tab-icons.active{
  background-image: url(/./assets/images/Icons/Group\ 162594@2x.png);
  box-shadow:none;
  background-repeat: no-repeat;
  background-size: cover;
}
  
    .reduce-size {
      max-width: 96% !important;
    }
    #phone-display-39 {
      object-fit: contain;
    }
    #appointmet-cotainer .heading{
      width: 209px;
    }
    #appointmet-cotainer .active .heading{
      width: 209px;
    }
  
     footer{ width: 100vw;}
      
    
    .x-section-sm{
      width: 100%;
      padding: 0 10%;
     
     }
  
   
  
 
  #copy-right p{
    max-width: 100%;
    box-sizing: border-box;
    padding:0px;
  }
  
  
    footer{
      width: 100vw;
      
    }
  
    .x-row-2{
      display: flex;
      flex-wrap: wrap;
      
  }
  
  .x-border1{
    border:none;
    padding: 4.9rem 
   
  }
  
  .x-border2{
    border-top:solid 1px #fff;
    border-left:none; 
    padding: 1rem
    
  
  }
.top-m-x{
    margin-top:4rem;
}
  #copy-right p{
    max-width: 100%;
    box-sizing: border-box;
    padding:0px;
  }
  
  
  
    .side-padding{
     
        padding: 1% 0 5% 0;
    
    }
  
  
    .side-padding{
     
        padding: 0 5% !important;
    
    }
    .blue{
      background-color: var(--navi_blue) !important;
    }
  
    .w20-x{
      width: 20%;
  
    }
  
    .nowrap{
      flex-wrap: nowrap;
    }
  
    .nowrap .col-sm-3{
      max-width: 37%;
    }
    
  
    .button-row {
      display: flex;
      flex-wrap: wrap;
    }
  
    .button {
      flex: 0 0 calc(50% - 20px); 
      font-size: 70%;
    }
    .smaller-btn{
      max-width: 116px;
  }
  #card-online .p-3 {
    padding: 1rem 0.1rem!important;}
  }
  
  





@media (max-width: 575.98px)  {
  .hero{
    height: 750px;
  }
  #hero-section .p-1{
    padding-top: 9rem !important;
}
  #hero-section .m-padding .col-lg-5{
    padding: 1.3rem !important;
}
.header-padding{
  padding: 0 0.5rem;
}

.hero-circle{
  background-image: url('/./assets/images/banner/m-Group-162500@2x.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: top center;
}

#hero-i{
  visibility: hidden;
}
.px-4 {
  padding-right: 0rem !important; 
  padding-left: 0rem !important;
}
/*.custom-text{
    font-size: 0.7rem;
    font-weight: 500;
    line-height: 19px;
}*/




  h3{

    text-align: center;
  }
  p{
    text-align: center;
  }
  .hero p{
    text-align: left !important;
  }
  .hero h1{
    text-align: left !important;
    font-size: 45px !important;
  }
  .contents  p{
    text-align: left;
  }

  .column {
    flex: 0 0 100%; /* Set to full width on smaller screens */
  }
  .col-x {
    margin-top: 13%;
    margin-bottom: 13%;
    width: 49%;
 }
 .col-x .options-container{
  margin-top: 13%;
 }
 .options-container span {
  font-size: 13px;
 }
 .sm-justify-content{
  justify-content:center !important;
  margin-top: 1%;
  margin-bottom: 9%;
 }
 #update-your-information .inner-section{
  max-width: 90%;
}
#phone-display {
  min-width: 100%;
}


  .laptop-inner{
   padding-left: 0px;
   padding-right: 0px;
  }
   #online-bank .align-items-center > * {
     flex: 0 0 50%;
     max-width: 50%;
   }
 
   /*#online-bank .col-sm-3 img {
     width: 90%;
     height: auto;
     margin-top: 14%;
     
   }*/
     
   #online-bank .col-sm-3 {
     padding-right: 5px!important;
     padding-left: 5px!important;
   

   }

   #online-bank .col-sm-3:last-child {
     padding-left: 5px !important;
     
   }
   #online-bank .col  span{
     padding-left: 0%;
   }
   #online-bank .col div{
     height: 63px;
   }
 
  .tab-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding:0 10%;
    max-width: 340px;
  margin: auto;
  }

 
  .tab-btn-left{
    border-radius: 5px 5px 0px 0px !important;

  }
  .tab-btn-right{
    border-radius: 0px 0px 5px 5px !important;

  }
  .loginButton{
    padding: 20%;
  }


  
  #switch-btn-container{
    padding:0 2%;
  }

  .tab-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding:5% 10%;
    
  }

  .tab-buttons button {
    width: 100%; 
    margin: 0 5px;
    border: 1px solid #fff;
    border-radius: 5px; 
    padding:4%;
  }
 

    .main-btn {
        width: 100%; /* Make the container full-width on mobile */
    }
    .search-container{
      position: relative;
      width: 100%;
      margin: auto;
  }  .search-container input[type="search"]{
   
    width: 100%;
}

  .online-column {
    flex: 0 0 calc(50% - 20px); /* Two columns on smaller screens */
  }

  #ncb-assist{
    background-color:var(--navi_blue);
    margin: 12% 0;
    padding: 12% 0;
    
  }
  #phone-display-39{
    height: 480px;
    margin: auto;
}
  .v-tab_tab-head {
      /* Reset to default stacking for small displays */
      display: inline-flex;
      text-align: center; /* Center the items vertically */
  }

  .v-tab_tab-head .tab-icons {
      /* Additional styles for list items on small displays */
      display: inline-flex;
      margin: 5px; /* Adjust spacing between items */
  }
  .divider {
    height: 66px;
    transform: rotate(90deg);
    margin: 0;
}
.v-tab .v-tab_tab-head {
  height: 32px;
  width: 100%;
}
.v-tab .v-tab_tab-head li {

height: 53px;
width: 53px;
}
#half-shape {
width: 100%  !important;
background: url(/./assets/images/banner/circular-assets.png);
height: 919px;
margin: auto;
}
.phone-display-39-bk-m{
    padding: 4px;
    background: url(/./assets/images/banner/circular-assets.png);
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: -4rem;
}
.v-tab_content{
margin-top: 13% !important;

width: 100% !important;
}
.v-tab .v-tab_content {
  margin-left: auto;
}
.v-tab {
margin-top: 0%;
}
.v-tab .v-tab_tab-head .tab-icons{
  transform: rotate(270deg);
}
.v-tab .v-tab_tab-head li.active{
  transform: rotate(270deg);
  z-index: 10;
}

  .reduce-size {
    max-width: 96% !important;
  }
  #phone-display-39 {
    object-fit: contain;
  }
  #appointmet-cotainer .heading{
    width: 209px;
  }
  #appointmet-cotainer .active .heading{
    width: 209px;
  }

   footer{ width: 100vw;}
    
  
  .x-section-sm{
    width: 100%;
    padding: 0 10%;
   
   }

 


#copy-right p{
  max-width: 100%;
  box-sizing: border-box;
  padding:0px;
}


  footer{
    width: 100vw;
    
  }

  .x-row-2{
    display: flex;
    flex-wrap: wrap;
    
}

.x-border1{
  border:none;
  padding: 4.9rem 
 
}

.x-border2{
  border-top:solid 1px #fff;
  border-left:none; 
  padding: 1rem
  

}
#copy-right p{
  max-width: 100%;
  box-sizing: border-box;
  padding:0px;
}



  .side-padding{
   
      padding: 1% 0 5% 0;
  
  }


  .side-padding{
   
      padding: 0 5% !important;
  
  }
  .blue{
    background-color: var(--navi_blue) !important;
  }

  .w20-x{
    width: 20%;

  }

  .nowrap{
    flex-wrap: nowrap;
  }

  .nowrap .col-sm-3{
    max-width: 37%;
  }
  

  .button-row {
    display: flex;
    flex-wrap: wrap;
  }

  .button {
    flex: 0 0 calc(50% - 20px); 
    font-size: 70%;
  }
  .smaller-btn{
    max-width: 116px;
}
#card-online .p-3 {
  padding: 1rem 0.1rem!important;}
}


@media screen and (max-width: 768px)  {
    .remove{
      width: 0px;
      height: 0px;
      visibility: hidden;
      padding: 0px;
   }
.m-x-h{
    max-height: 80px;
}
.m-x-c{
    background-color: #fff;
    max-width:334px;
    margin-bottom: 26px;
}

.m-x-co{
  border:none;
}
.m-x-h{
    max-height: 80px;
}
.m-x-c{
    background-color: #fff;
    max-width:334px;
    margin-bottom: 26px;
}

.m-x-co{
  border:none;
}
  .hero{
    height: 750px;
  }
  #hero-section .p-1{
    padding-top: 9rem !important;
}
  #hero-section .m-padding .col-lg-5{
    padding: 1.3rem !important;
}
.header-padding{
  padding: 0 0.5rem;
}

.hero-circle{
  background-image: url('/./assets/images/banner/m-Group-162500@2x.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: top center;
}

#hero-i{
  visibility: hidden;
}
/*.custom-text{
    font-size: 0.7rem;
    font-weight: 500;
    line-height: 19px;
}*/




  h3{

    text-align: center;
  }
  p{
    text-align: center;
  }
  .hero p{
    text-align: left !important;
  }
  .hero h1{
    text-align: left !important;
    font-size: 45px !important;
  }
  .contents  p{
    text-align: left;
  }

  .column {
    flex: 0 0 100%; /* Set to full width on smaller screens */
  }
  .col-x {
    margin-top: 13%;
    margin-bottom: 13%;
    width: 49%;
 }
 .col-x .options-container{
  margin-top: 13%;
 }
 .options-container span {
  font-size: 13px;
 }
 .sm-justify-content{
  justify-content:center !important;
  margin-top: 1%;
  margin-bottom: 9%;
 }
 #update-your-information .inner-section{
  max-width: 90%;
}
#phone-display {
  min-width: 100%;
}


  .laptop-inner{
   padding-left: 0px;
   padding-right: 0px;
  }
   #online-bank .align-items-center > * {
     flex: 0 0 50%;
     max-width: 50%;
   }
 
   /*#online-bank .col-sm-3 img {
     width: 90%;
     height: auto;
     margin-top: 14%;
     
   }*/
     
   #online-bank .col-sm-3 {
     padding-right: 5px!important;
     padding-left: 5px!important;
   

   }

   #online-bank .col-sm-3:last-child {
     padding-left: 5px !important;
     
   }
   #online-bank .col  span{
     padding-left: 0%;
   }
   #online-bank .col div{
     height: 63px;
   }
 
  .tab-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding:0 10%;
    max-width: 340px;
  margin: auto;
  }

 
  .tab-btn-left{
    border-radius: 5px 5px 0px 0px !important;

  }
  .tab-btn-right{
    border-radius: 0px 0px 5px 5px !important;

  }
  .loginButton{
    padding: 20%;
  }


  
  #switch-btn-container{
    padding:0 2%;
  }

  .tab-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding:5% 10%;
    
  }

  .tab-buttons button {
    width: 100%; 
    margin: 0 5px;
    border: 1px solid #fff;
    border-radius: 5px; 
    padding:4%;
  }
 

    .main-btn {
        width: 100%; /* Make the container full-width on mobile */
    }
    .search-container{
      position: relative;
      width: 100%;
      margin: auto;
  }  .search-container input[type="search"]{
   
    width: 100%;
}

  .online-column {
    flex: 0 0 calc(50% - 20px); /* Two columns on smaller screens */
  }

  #ncb-assist{
    background-color:var(--navi_blue);
    margin: 12% 0;
    padding: 12% 0;
    
  }
  #phone-display-39{
    height: 480px;
    margin: auto;
}
  .v-tab_tab-head {
      /* Reset to default stacking for small displays */
      display: inline-flex;
      text-align: center; /* Center the items vertically */
  }

  .v-tab_tab-head .tab-icons {
      /* Additional styles for list items on small displays */
      display: inline-flex;
      margin: 5px; /* Adjust spacing between items */
  }
  .divider {
    height: 66px;
    transform: rotate(90deg);
    margin: 0;
}
.v-tab .v-tab_tab-head {
  height: 32px;
  width: 100%;
}
.v-tab .v-tab_tab-head li {

height: 53px;
width: 53px;
}
#half-shape {
width: 100%  !important;
background: url(/./assets/images/banner/circular-assets.png);
height: 919px;
margin: auto;
}
.phone-display-39-bk-m{
    padding: 4px;
    background: url(/./assets/images/banner/circular-assets.png);
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: -4rem;
}
.v-tab_content{
margin-top: 13% !important;

width: 100% !important;
}
.v-tab .v-tab_content {
  margin-left: auto;
}
.v-tab {
margin-top: 0%;
}
.v-tab .v-tab_tab-head .tab-icons{
  transform: rotate(270deg);
}
.v-tab .v-tab_tab-head li.active{
  transform: rotate(270deg);
  z-index: 10;
}

  .reduce-size {
    max-width: 96% !important;
  }
  #phone-display-39 {
    object-fit: contain;
  }
  #appointmet-cotainer .heading{
    width: 209px;
  }
  #appointmet-cotainer .active .heading{
    width: 209px;
  }

   footer{ width: 100vw;}
    
  
  .x-section-sm{
    width: 100%;
    padding: 0 10%;
   
   }

 


#copy-right p{
  max-width: 100%;
  box-sizing: border-box;
  padding:0px;
}


  footer{
    width: 100vw;
    
  }

  .x-row-2{
    display: flex;
    flex-wrap: wrap;
    
}

.x-border1{
  border:none;
  padding: 4.9rem 
 
}

.x-border2{
  border-top:solid 1px #fff;
  border-left:none; 
  padding: 1rem
  

}
#copy-right p{
  max-width: 100%;
  box-sizing: border-box;
  padding:0px;
}



  .side-padding{
   
      padding: 1% 0 5% 0;
  
  }


  .side-padding{
   
      padding: 0 5% !important;
  
  }
  .blue{
    background-color: var(--navi_blue) !important;
  }

  .w20-x{
    width: 20%;

  }

  .nowrap{
    flex-wrap: nowrap;
  }

  .nowrap .col-sm-3{
    max-width: 37%;
  }
  

  .button-row {
    display: flex;
    flex-wrap: wrap;
  }

  .button {
    flex: 0 0 calc(50% - 20px); 
    font-size: 70%;
  }
  .smaller-btn{
    max-width: 116px;
}
#card-online .p-3 {
  padding: 1rem 0.1rem!important;}
}



  
 @media (max-width: 767.98px)  {
  .hero{
    height: 750px;
  }
  #hero-section .p-1{
    padding-top: 9rem !important;
}
  #hero-section .m-padding .col-lg-5{
    padding: 1.3rem !important;
}
.header-padding{
  padding: 0 0.5rem;
}

.hero-circle{
  background-image: url('/./assets/images/banner/m-Group-162500@2x.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: top center;
}

#hero-i{
  visibility: hidden;
}
/*.custom-text{
    font-size: 0.7rem;
    font-weight: 500;
    line-height: 19px;
}*/




  h3{

    text-align: center;
  }
  p{
    text-align: center;
  }
  .hero p{
    text-align: left !important;
  }
  .hero h1{
    text-align: left !important;
    font-size: 45px !important;
  }
  .contents  p{
    text-align: left;
  }

  .column {
    flex: 0 0 100%; /* Set to full width on smaller screens */
  }
  .col-x {
    margin-top: 13%;
    margin-bottom: 13%;
    width: 49%;
 }
 .col-x .options-container{
  margin-top: 13%;
 }
 .options-container span {
  font-size: 13px;
 }
 .sm-justify-content{
  justify-content:center !important;
  margin-top: 1%;
  margin-bottom: 9%;
 }
 #update-your-information .inner-section{
  max-width: 90%;
}
#phone-display {
  min-width: 100%;
}


  .laptop-inner{
   padding-left: 0px;
   padding-right: 0px;
  }
   #online-bank .align-items-center > * {
     flex: 0 0 50%;
     max-width: 50%;
   }
 
   /*#online-bank .col-sm-3 img {
     width: 90%;
     height: auto;
     margin-top: 14%;
     
   }*/
     
   #online-bank .col-sm-3 {
     padding-right: 5px!important;
     padding-left: 5px!important;
   

   }

   #online-bank .col-sm-3:last-child {
     padding-left: 5px !important;
     
   }
   #online-bank .col  span{
     padding-left: 0%;
   }
   #online-bank .col div{
     height: 63px;
   }
 
  .tab-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding:0 10%;
    max-width: 340px;
  margin: auto;
  }

 
  .tab-btn-left{
    border-radius: 5px 5px 0px 0px !important;

  }
  .tab-btn-right{
    border-radius: 0px 0px 5px 5px !important;

  }
  .loginButton{
    padding: 20%;
  }


  
  #switch-btn-container{
    padding:0 2%;
  }

  .tab-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding:5% 10%;
    
  }

  .tab-buttons button {
    width: 100%; 
    margin: 0 5px;
    border: 1px solid #fff;
    border-radius: 5px; 
    padding:4%;
  }
 

    .main-btn {
        width: 100%; /* Make the container full-width on mobile */
    }
    .search-container{
      position: relative;
      width: 100%;
      margin: auto;
  }  .search-container input[type="search"]{
   
    width: 100%;
}

  .online-column {
    flex: 0 0 calc(50% - 20px); /* Two columns on smaller screens */
  }

  #ncb-assist{
    background-color:var(--navi_blue);
    margin: 12% 0;
    padding: 12% 0;
    
  }
  #phone-display-39{
    height: 480px;
    margin: auto;
}
  .v-tab_tab-head {
      /* Reset to default stacking for small displays */
      display: inline-flex;
      text-align: center; /* Center the items vertically */
  }

  .v-tab_tab-head .tab-icons {
      /* Additional styles for list items on small displays */
      display: inline-flex;
      margin: 5px; /* Adjust spacing between items */
  }
  .divider {
    height: 66px;
    transform: rotate(90deg);
    margin: 0;
}
.v-tab .v-tab_tab-head {
  height: 32px;
  width: 100%;
}
.v-tab .v-tab_tab-head li {

height: 53px;
width: 53px;
}
#half-shape {
width: 100%  !important;
background: url(/./assets/images/banner/circular-assets.png);
height: 919px;
margin: auto;
}
.phone-display-39-bk-m{
    padding: 4px;
    background: url(/./assets/images/banner/circular-assets.png);
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: -4rem;
}
.v-tab_content{
margin-top: 13% !important;

width: 100% !important;
}
.v-tab .v-tab_content {
  margin-left: auto;
}
.v-tab {
margin-top: 0%;
}
.v-tab .v-tab_tab-head .tab-icons{
  transform: rotate(270deg);
}
.v-tab .v-tab_tab-head li.active{
  transform: rotate(270deg);
  z-index: 10;
}

  .reduce-size {
    max-width: 96% !important;
  }
  #phone-display-39 {
    object-fit: contain;
  }
  #appointmet-cotainer .heading{
    width: 209px;
  }
  #appointmet-cotainer .active .heading{
    width: 209px;
  }

   footer{ width: 100vw;}
    
  
  .x-section-sm{
    width: 100%;
    padding: 0 10%;
   
   }

 


#copy-right p{
  max-width: 100%;
  box-sizing: border-box;
  padding:0px;
}


  footer{
    width: 100vw;
    
  }

  .x-row-2{
    display: flex;
    flex-wrap: wrap;
    
}

.x-border1{
  border:none;
  padding: 4.9rem 
 
}

.x-border2{
  border-top:solid 1px #fff;
  border-left:none; 
  padding: 1rem
  

}
#copy-right p{
  max-width: 100%;
  box-sizing: border-box;
  padding:0px;
}



  .side-padding{
   
      padding: 1% 0 5% 0;
  
  }


  .side-padding{
   
      padding: 0 5% !important;
  
  }
  .blue{
    background-color: var(--navi_blue) !important;
  }

  .w20-x{
    width: 20%;

  }

  .nowrap{
    flex-wrap: nowrap;
  }

  .nowrap .col-sm-3{
    max-width: 37%;
  }
  

  .button-row {
    display: flex;
    flex-wrap: wrap;
  }

  .button {
    flex: 0 0 calc(50% - 20px); 
    font-size: 70%;
  }
  .smaller-btn{
    max-width: 116px;
}
#card-online .p-3 {
  padding: 1rem 0.1rem!important;}
}




  /* Media query for mobile phones */
  @media (max-width: 767px) {
    .remove{
      width: 0px;
      height: 0px;
      visibility: hidden;
      padding: 0px;
   }
.m-x-h{
    max-height: 80px;
}
.m-x-c{
    background-color: #fff;
    max-width:334px;
    margin-bottom: 26px;
}

.m-x-co{
  border:none;
}
.m-x-h{
    max-height: 80px;
}
.m-x-c{
    background-color: #fff;
    max-width:334px;
    margin-bottom: 26px;
}

.m-x-co{
  border:none;
}
    .hero{
      height: 750px;
    }
    #hero-section .p-1{
      padding-top: 9rem !important;
  }
    #hero-section .m-padding .col-lg-5{
      padding: 1.3rem !important;
  }
    .header-padding{
    padding: 0 0.5rem;
  }

  section{
    padding-left: calc(var(--bs-gutter-x) * .5) !important;
    padding-right: calc(var(--bs-gutter-x) * .5) !important;
}
#mobile-app {
    padding-left: calc(var(--bs-gutter-x) * .5) !important;
    padding-right: calc(var(--bs-gutter-x) * .5) !important;
}
#search-section .px-4 {
    padding-right: 1rem !important;
    padding-left: 1rem !important;
}

  
  .hero-circle{
    background-image: url('/./assets/images/banner/m-Group-162500@2x.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top center;
  }
  
  #hero-i{
    visibility: hidden;
  }
  /*.custom-text{
      font-size: 0.7rem;
      font-weight: 500;
      line-height: 19px;
  }*/
  
  
  
  
    h3{
  
      text-align: center;
    }
    p{
      text-align: center;
    }
    .hero p{
      text-align: left !important;
    }
    .hero h1{
      text-align: left !important;
      font-size: 45px !important;
    }
    .contents  p{
      text-align: left;
    }
  
    .column {
      flex: 0 0 100%; /* Set to full width on smaller screens */
    }
    .col-x {
      margin-top: 13%;
      margin-bottom: 13%;
      width: 49%;
   }
   .col-x .options-container{
    margin-top: 13%;
   }
   .options-container span {
    font-size: 13px;
   }
   .sm-justify-content{
    justify-content:center !important;
    margin-top: 1%;
    margin-bottom: 9%;
   }
   #update-your-information .inner-section{
    max-width: 90%;
  }
  #phone-display {
    min-width: 100%;
  }
  
  
    .laptop-inner {
    padding-left: 11px;
    padding-right: 11px;
}
     #online-bank .align-items-center > * {
       flex: 0 0 50%;
       max-width: 50%;
     }
   
     /*#online-bank .col-sm-3 img {
       width: 90%;
       height: auto;
       margin-top: 14%;
       
     }*/
       
     #online-bank .col-sm-3 {
       padding-right: 5px!important;
       padding-left: 5px!important;
     
  
     }
  
     #online-bank .col-sm-3:last-child {
       padding-left: 5px !important;
       
     }
     #online-bank .col  span{
       padding-left: 0% !important;
     }
     #online-bank .col div{
       height: 63px;
     }
   
    .tab-buttons {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      padding:0 10%;
      max-width: 340px;
    margin: auto;
    }
  
   
    .tab-btn-left{
      border-radius: 5px 5px 0px 0px !important;
  
    }
    .tab-btn-right{
      border-radius: 0px 0px 5px 5px !important;
  
    }
    .loginButton{
      padding: 20%;
    }
  
  
    
    #switch-btn-container{
      padding:0 2%;
    }
  
    .tab-buttons {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      padding:5% 10%;
      
    }
  
    .tab-buttons button {
      width: 100%; 
      margin: 0 5px;
      border: 1px solid #fff;
      border-radius: 5px; 
      padding:4%;
    }
   
  
      .main-btn {
          width: 100%; /* Make the container full-width on mobile */
      }
      .search-container{
        position: relative;
        width: 100%;
        margin: auto;
    }  .search-container input[type="search"]{
     
      width: 100%;
  }
  
    .online-column {
      flex: 0 0 calc(50% - 20px); /* Two columns on smaller screens */
    }
  
    #ncb-assist{
      background-color:var(--navi_blue);
      margin: 12% 0;
      padding: 12% 0;
      
    }
    #phone-display-39{
      height: 480px;
      margin: auto;
  }
    .v-tab_tab-head {
        /* Reset to default stacking for small displays */
        display: inline-flex;
        text-align: center; /* Center the items vertically */
    }
  
    .v-tab_tab-head .tab-icons {
        /* Additional styles for list items on small displays */
        display: inline-flex;
        margin: 5px; /* Adjust spacing between items */
    }
    .divider {
      height: 66px;
      transform: rotate(90deg);
      margin: 0;
  }
  .v-tab .v-tab_tab-head {
    height: 32px;
    width: 100%;
  }
  .v-tab .v-tab_tab-head li {
  
  height: 53px;
  width: 53px;
  }
  /*#half-shape {
  width: 100%;
  
  height: 919px;
  margin: auto;
  }*/
  .v-tab_content{
  margin-top: 13% !important;
  
  width: 100% !important;
  }
  .v-tab .v-tab_content {
   display: none;
    margin-left: auto;
  }
  .v-tab {
  margin-top: 0%;
  }
  .v-tab .v-tab_tab-head .tab-icons{
    transform: rotate(270deg);
  }
  .v-tab .v-tab_tab-head li.active{
    transform: rotate(270deg);
    z-index: 10;
  }

.v-tab .v-tab_tab-head li:hover {
  background-image: url(/./assets/images/Icons/Group\ 162594@2x.png);
  background-color: var(--tin-blue);
  color: #fff;
}

.v-tab .v-tab_tab-head li.active {
  /*border-right: 3px solid var(--border-color-active);*/
  background-color:  var(--tin-blue);
  color: #fff;
  display: block;
}
.tab-icons.active{
  background-image: url(/./assets/images/Icons/Group\ 162594@2x.png);
  box-shadow:none;
  background-repeat: no-repeat;
  background-size: cover;
}
  
    .reduce-size {
      max-width: 96% !important;
    }
    #phone-display-39 {
      object-fit: contain;
    }
    #appointmet-cotainer .heading{
      width: 209px;
    }
    #appointmet-cotainer .active .heading{
      width: 209px;
    }
  
     footer{ width: 100vw;}
      
    
    .x-section-sm{
      width: 100%;
      padding: 0 10%;
     
     }
  
   
  
  
  #copy-right p{
    max-width: 100%;
    box-sizing: border-box;
    padding:0px;
  }
  
  
    footer{
      width: 100vw;
      
    }
  
    .x-row-2{
      display: flex;
      flex-wrap: wrap;
      
  }
  
  .x-border1{
    border:none;
    padding: 4.9rem 
   
  }
  
  .x-border2{
    border-top:solid 1px #fff;
    border-left:none; 
    padding: 1rem
    
  
  }
.top-m-x{
    margin-top:4rem;
}.top-m-x{}
  #copy-right p{
    max-width: 100%;
    box-sizing: border-box;
    padding:0px;
  }
  
  
  
    .side-padding{
     
        padding: 1% 0 5% 0;
    
    }
  
  
    .side-padding{
     
        padding: 0 5% !important;
    
    }
    .blue{
      background-color: var(--navi_blue) !important;
    }
  
    .w20-x{
      width: 20%;
  
    }
  
    .nowrap{
      flex-wrap: nowrap;
    }
  
    .nowrap .col-sm-3{
      max-width: 37%;
    }
    
  
    .button-row {
      display: flex;
      flex-wrap: wrap;
    }
  
    .button {
      flex: 0 0 calc(50% - 20px); 
      font-size: 70%;
    }
    .smaller-btn{
      max-width: 116px;
  }
  #card-online .p-3 {
    padding: 1rem 0.1rem!important;}
  }
  


@media (max-width: 768px) {
  .x-border1 {
    border-right: solid 1px #fff0;
    border-bottom: solid 1px #fff;
  }
  .x-border2 {
    border-left: solid 1px #fff0;
   
  }
}
@media (max-width: 991.98px) { 
    
    .x-border1 {
    border-right: solid 1px #fff0;
    border-bottom: solid 1px #fff;
  }
  .x-border2 {
    border-left: solid 1px #fff0;
   
  }
    
}



@media (max-width: 800px) {
    
  /* Hide horizontal scrollbar on smaller screens */
  html, body {
    overflow-x: hidden;
  }
  
}