
@media(max-width: 1366px) {
        .achievementsdiv h2 {font-size: 20px; line-height: 25px;}   
    .pb50 {padding-bottom: 30px!important;}
    .aligned-future {background-position: top left -100px;}
    .gender-female {left: 14%; top: 4%;}
    .gender-male {right: 7%; bottom: -5%;}
.gender-female.inde {left: 12%;}
.gender-male.inde {right: 2%;}
}
@media(max-width: 1200px)
{
.valuesl .owl-stage-outer, .key-slider .owl-stage-outer
{
    overflow: hidden;
}
.achievementsdiv h1 {font-size: 50px;}
    .achievementsdiv h2 {font-size: 18px;}
}

@media(max-width:1024px)
{
.hm-esg ul
{
    width: 100%;
    display: inline-flex;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding-bottom: 10px;
}
.hm-esg ul.nav-pills li
{
    max-width: 100%;
}
.hm-esg ul.nav-pills li > a {
    width:375px;
}
.hm-esg ul::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgb(0 0 0 / 30%);
    border-radius: 10px;
    background-color: #ebebeb;
}

.hm-esg ul::-webkit-scrollbar {
    width: 6px;
    height: 6px;
    background-color: #ebebeb;
}

.hm-esg ul::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgb(0 0 0 / 30%);
    background-color: #004e95;
}
.cpdta img:nth-child(3) {
    margin-left: 17px;
}
.ratingstat, .presencediv {font-size: 27px;}
    .ratingstat h3, .presencediv h3 {font-size: 20px;}


.n-mdl-inner p.m-blue-text img {
    right: 0px;
    margin-top: 10px;
    position: relative;
    display:block;
}
.modal-man
{
    right: 10px;
}
}

@media (max-width: 991px){
    .menu, .nav-icon3 {
        display: none;
    }	
    .my-sidenav {
        width: 0px;
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        overflow-x: hidden;
        z-index: 999999999;
        height: 100vh;
        max-width: 0px;
        width: 100%;
        background-color:#004e95;
        transition: 0.5s;
        -webkit-transition: 0.5s;
    }
    .my-sidenav>ul {
        padding: 0px 20px 0px;
    }
    .my-sidenav>ul>li>ul {
        margin-top: 0px;
        display: none;
    }
    .my-sidenav ul.submenu li ul.submenu {
        display: none;
        position: static;
        width: 100%;
    }
    .my-sidenav ul {
        list-style-type: none;
        padding-left: 15px;
    }
    .my-sidenav ul li
    {
        border-bottom: 1px solid #ffffff;
        padding: 15px 0px;
    }
    .my-sidenav > ul > li > ul >li
    {
        border-bottom: 1px solid #ffffff;
        padding: 10px 0px;
    }
    .my-sidenav > ul > li > ul >li:last-child, .my-sidenav ul.submenu li ul.submenu li:last-child
    {
        border-bottom: 0px;
    }
    .my-sidenav ul.submenu li ul.submenu li {
        border-bottom: 1px solid #ffffff;
        padding: 10px 10px;
    }
    .my-sidenav ul.submenu li ul.submenu li a {
        color: #ffffff;
        font-size: 16px;
    }

    .cross-btn1 {
        text-align: right;
        padding: 16px 14px 0px 0px;
        color: #fff;
        font-size: 35px;
        cursor: pointer;
    }
    .my-sidenav .submenu-indicator-minus .submenu-indicator {
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }
    .my-sidenav .submenu-indicator {
        font-size: 30px;
        position: absolute;
        line-height: 25px;
        right: 15px;
    }
    .my-sidenav>ul>li>a {
        color: #ffffff;
        font-size:18px;
        display:block;
        font-family:TitilliumWeb-Bold;
    }
    .my-sidenav>ul>li>ul>li>a {
        color: #ffffff;
        font-size: 16px;
    }
    .my-sidenav>ul>li>ul>li>a img
    {
        padding-right: 10px;
        float: right;
        filter: brightness(0) invert(100%) !important;
    }

.rbd {
    background-image: none;
    height: auto;
    display: block;
    align-items: center;
    background-attachment: initial;
}
.fame-mbl-img
{
    margin-top: 30px;
    background-color:#004e95;
    padding-top: 50px;
}
.rbd .col-md-4
{
    min-height: auto;
}
.mt-40
{
    margin-top: 40px;
}

.w-90, .w-75, .w-50, .w-25 {width: 100%!important;} 
    .retailbankingbox {text-align: center; padding: 20px;}
    .chart-legends {position: relative; margin: 20px 0 0 0; top: 0; transform: none;}
    .num h2 {font-size: 25px; margin-bottom: 15px;}
    .num h2 span {font-size: 30px;}
    .num {padding-top: 30px;}
    .ratingdiv {width: 100%;}
    .achievementsdiv br {display: none;}
    .pb50 {padding-bottom: 10px!important;}
    .aligned-future {background-position: top left -150px;}
    .aligned-future .w-40 {width: 70%!important;}
    .teamchar {position: relative; right: auto;}
    .gender-female {left: 18%; top: 8%;}
    .gender-male {right: 14%; bottom: 0%;}
.gender-female.inde {left: 16%;}
.gender-male.inde {right: 10%;}
    .goal .borderleftorange {padding-left: 20px;}
.ham-icon1
{
    float: left;
    margin-top: 15px;
    display: block;
}
.rbd:after
{
    display: none;
}
.item-nw
{
display: block;
height: auto;
}
.goal h1 {
    font-size: 36px;
    line-height: 40px;
}
.progressbox .col-md-6
{
    margin-bottom: 20px;
}

}


@media (max-width: 767px){
h1 {font-size: 40px; line-height: 45px; margin-bottom: 15px;}
h2 {font-size: 30px; line-height: 35px; margin-bottom: 15px;}
    section h1 {margin-bottom: 30px;}   
    .owl-theme .owl-nav {right: auto; left: 50%; transform: translateX(-50%); bottom: -50px;}
    .foolterlinks, .socialicon  {display: block; text-align: center; padding: 0;}
    .annualrpt, .c-name, .socialicon {padding: 0;}
    .values .col-lg-2 {border: none;}
    .chart-container {margin: 0 auto!important; display: block;}
    .presencediv {position: relative; width: 100%;}
    .presencediv br {display: none;}
    .achievementsdiv {padding: 30px;}
    .chairman h2:before {left: 0px; top: 0px; position: relative; width: 50px; display: block;}
    .aligned-future .w-40 {width: 100%!important;}
    .out-wrap #tabs li a {min-width: 250px; }   
    .out-wrap #tabs li a .col-4 img {width: 50px;}
    .out-wrap #tabs li a .col-8 {min-height: 130px;}
    .digi-orangebox img {position: relative; bottom: 0; top: auto; transform: none;}
    .digi-orangebox {margin: 20px 0;}
    .esg-card {width: 100%;}
    .esg-cardinner {min-height: 90px;}
    .empowerchar, .smallchar {position: relative;}
    .envaction {font-size: 25px; line-height: 30px;}
    .bar {margin: 10px 0;}
    .bm .col-md-8:before {content: ''; width: 10px; height: 1px; background-color: #666; position: absolute; display: inline-block;}
    .diversitydiv1 {padding-bottom: 20px;}
    #myChartgender, #myChartindependent {width: 200px!important; height: 200px!important; margin: 0 auto;}
    .gender-female {left: 4%; top: 5%;}
    .gender-male {right: 4%; bottom: 5%;}
.gender-female.inde {left: 4%;}
.gender-male.inde {right: 4%;}
    .goal .borderleftorange {border-left: none; border-top: solid 1px #f9a61a; padding-top: 20px; }
.k-achievment-bg p {
    padding-bottom: 15px;
    min-height: auto;
    margin-bottom: 20px;
}

.ch-msg h5:before, .ceo-msg h5:after
{
    display: none;
}
.ch-msg h3 {
    padding-top:30px;
}
.ch-msg h5
{
    padding-top: 0px;
}
.qr-images {
    position: relative;
    bottom: auto;
    left: auto;
    margin-top:30px;
}
.ps-box-text h5 {
    margin-top: 10px;
    min-height: auto;
}
.foolterlinks {
    max-width: 100%;
    width: 100%;
    display: block;
}
.socialicon
{
    padding-left: 0px;
}
.socialicon p a {
    margin-left: 0px;
    margin-right: 10px;
}
.c-name p
{
    padding: 10px 0px;
}
.annualrpt {
    padding-right: 0px;
    max-width: 235px;
    margin: auto;
}
.hm-banner-text h3
{
    font-size: 30px;
    line-height: 36px;
}
.hm-banner-text h1
{
    font-size: 40px;
    line-height: 44px;
}
.eheight {
    height: auto;
    display: block;
    margin-bottom: 20px;
}
.managementname p
{
    line-height: 18px;
    padding-top: 5px;
}
.management h3
{
    padding-top: 10px;
}
.managementname:before
{
    top:15px;
}
.retailbankingbox
{
    margin-bottom: 20px;
}
.op-img
{
    padding-bottom: 20px;
}
.modal-man
{
    display: none;
}
.n-mdl-inner .modal-body {
    padding-top: 30px;
    padding-left: 15px;
    padding-right: 15px;
}
.close2 {
    margin-top: 15px;
    margin-right: 15px;
}
.abt-modal .modal-dialog
{
    margin:10px 0px;
}
.mousey
{
    display:none;
}
.hmbanner
{
    display:block;
}
.hm-banner-text
{
    padding-top:20%;
}
.n-mdl-inner .hm-banner-text
{
    padding-top:0px;
}
.ref-slider-mbl-main
{
    margin-top: 40px;
}
.ref-icon
{
    text-align: left;
}
.ref-slider-mbl-main .hm-heading
{
    text-align:left;
    margin-top: 10px;
}
.ref-slider-mbl-main .hm-heading span
{
    display: block;
}
.ref-slider-bg-mbl{
    background-color: #fff1df;
    border: 2px solid #f9a61a;
    padding: 40px 0px 0px 0px;
    margin-top:10px;
    display: inline-block;
    width: 100%;
    margin-bottom: 30px;
}
.ref-slider-bg-mbl h4
{
  font-size:18px;
  color: #004e95;  
}
.ref-slider-bg-mbl h4 span {
    color: #004e95;
    font-family: TitilliumWeb-Bold;
    font-size:21px;
}
.ref-slider-bg-mbl h4 span.crr {
    color: #004e95;
    font-family:TitilliumWeb-Regular;
    font-size:18px;
}
.ref-slider-mbl p {
    font-size: 16px;
    line-height: 22px;
}
.ref-slider-mbl p
{
    display: block;
}
.ref-slider-mbl.owl-carousel .owl-item img
{
width:auto;
}
.ref-cntnt1 p {
    min-height: 67px;
}
.ref-slider-mbl.owl-theme .owl-dots .owl-dot span
{
  background:#99b8d5;
}
.ref-slider-mbl.owl-theme .owl-dots .owl-dot.active span, .ref-slider-mbl.owl-theme .owl-dots .owl-dot:hover span
{
 background:#004e95;
}
.reflecting {
    padding-top: 20px;
}
.audionbtn
{
    margin-top:15px;
}
}
@media (max-width: 480px)
{
.hm-banner-text h3
{
    font-size: 30px;
    lighting-color: 36px;
}
.hm-banner-text h1
{
    font-size: 40px;
    line-height: 44px;
}
.rbd h3, .hm-heading
{
    font-size: 28px;
    line-height: 36px;
}
.ref-slider-bg .hm-heading {
    font-size: 20px;
    padding-bottom: 40px;
}

.k-achievment-bg .hm-heading {
    font-size: 20px;
    padding-bottom: 40px;
    line-height: 26px;
}
.ch-msg h5
{
    font-size: 24px;
    line-height: 30px;
}
.ch-msg h6
{
    font-size: 22px;
}
.hall-of-fame {
    padding-top: 50px;
}

.k-achievment {
    padding-top: 50px;
}
.p-5 {
    padding: 1rem!important;
}
.hm-banner-text
{
    padding-top:25%;
}
}
@media (max-width: 420px)
{
    h1 {
    font-size: 32px;
    line-height: 38px;
}
h3 {
    font-size: 22px;
    line-height: 30px;
}
h2 {
    font-size: 24px;
    line-height: 30px;
    }
.chartowl h4
{
    font-size: 17px;
}
.goal h1 {
    font-size: 30px;
    line-height: 36px;
}
.director p {
    font-size: 18px;
}
.hm-banner-text h3 {
    font-size: 26px;
    line-height: 30px;
}
.hm-banner-text h1 {
    font-size: 30px;
    line-height: 36px;
}
.rbd h3, .hm-heading {
    font-size: 24px;
    line-height: 30px;
}
.ch-msg h5 {
    font-size: 18px;
    line-height: 22px;
}
.ch-msg h6 {
    font-size: 20px;
}

.volume-box h4 {
    font-size: 30px;
}
.ps-box-text h5
{
    font-size: 22px;
    line-height: 28px;
}
.k-achievment-bg h4 span {
    font-size: 52px;
}
.logo p
{
    display: none;
}
.e-tab-text
{
    width: 220px;
}
.e-tab-text:after
{
    right: 15px;
}
.hm-esg {
    padding-top: 50px;
}
.hm-esg h3 {
    padding-bottom: 30px;
}
.care-main p
{
    padding-bottom: 20px;
}
.fame-mbl-img
{
    padding-bottom:20px;
}

.n-mdl-inner .hm-banner-text h3 {
    font-size: 26px;
    line-height: 30px;
}
.n-mdl-inner .hm-banner-text h3 span
{
    display: inline;
}
.n-mdl-inner .modal-body {
    padding-left: 0px;
    padding-right: 0px;
}
.hm-banner-text
{
    padding-top:28%;
}
}
@media (max-width: 380px)
{
.e-tab-img img
{
    width: 80px;
}

.footer-btm p {
    font-size: 14px;
}
.ref4 p, .ref2 p
{
    min-height:66px;
}
.ref-cntnt1 p {
    min-height: 89px;
}
.ref-slider-mbl-main .hm-heading
{
    font-size: 22px;
    line-height: 26px;
}
}
@media (max-width: 360px)
{
.hm-banner-text h3 {
    font-size: 24px;
}
.hm-banner-text
{
    padding-top:30%;
}
.ref3 p
{
min-height: 66px;
}
}
@media (max-width: 320px)
{

}
