@media (min-width: 1920px) and (max-width: 2560px) {



}

@media (min-width: 1600px) and (max-width: 1919px) {

.container-1360-wrp{max-width: 1360px;}
.common-ttle{ font-size: 46px;}
.common-desc{ font-size: 20px;}
.common-cta{ font-size: 15px;}



}


@media only screen and (min-width: 1400px) and (max-width: 1599px) {
.container {max-width: 1130px;}
.container-1360-wrp{max-width: 1300px;}
.common-ttle{ font-size: 36px;}
.common-desc{ font-size: 20px;}
.common-cta{ font-size: 15px;}

#celebration .linewave1,#celebration .linewave2 {transform: scale(0.7);}
#celebration .fifty-yr {transform: scale(0.7);}

#celebration .linewave1 {left: -664px;}
#celebration .linewave2 {left: -200px;}

#What-lies p {
    font-size: 18px;
    line-height: 1.3;
}

#hero-anim-track .container .stat-card h2 {font-size: 46px;}
#hero-anim-track .container .stat-card p,p {font-size: 16px;}
#DiversePortfolio .card {height: 742px;}
#DiversePortfolio .highlight-sub {font-size: 11px;}
#highlights .kpi-number {font-size: 40px;letter-spacing: -1px;}
#chairman-message .chairmanMessageRight p {font-size: 22px;}
#businessOverview .nav .nav-link {font-size: 26px;}
#Buildinglovedbrand .container {width: 55%;}
.lines svg {width: 100%;}
#esg-perfronce-review .perfromanceBox .infoNos .nos {font-size: 30px;}
#esg-perfronce-review .esg_holder .esgContent {
    padding: 20px 40px;
}
#esg-perfronce-review .perfromanceBox .infoNos p {
    font-size: 13px;
    line-height: 17px;
}

#chairman-message .bottomCricle {left: -280px;}

}


@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.container {max-width: 1130px;}
.container-1360-wrp{max-width: 1300px;}
.common-ttle{ font-size: 36px;}
.common-desc{ font-size: 20px;}
.common-cta{ font-size: 15px;}

#celebration .linewave1,#celebration .linewave2 {transform: scale(0.7);}
#celebration .fifty-yr {transform: scale(0.7);}

#celebration .linewave1 {left: -664px;}
#celebration .linewave2 {left: -200px;}

#What-lies p {
    font-size: 18px;
    line-height: 1.3;
}

#hero-anim-track .container .stat-card h2 {font-size: 46px;}
#hero-anim-track .container .stat-card p,p {font-size: 16px;}
#DiversePortfolio .card {height: 742px;}
#DiversePortfolio .highlight-sub {font-size: 11px;}
#highlights .kpi-number {font-size: 40px;letter-spacing: -1px;}
#chairman-message .chairmanMessageRight p {font-size: 22px;}
#businessOverview .nav .nav-link {font-size: 32px;}
#Buildinglovedbrand .container {width: 55%;}
.lines svg {width: 100%;}
#esg-perfronce-review .perfromanceBox .infoNos .nos {font-size: 30px;}
#esg-perfronce-review .esg_holder .esgContent {
    padding: 20px 40px;
}
#esg-perfronce-review .perfromanceBox .infoNos p {
    font-size: 13px;
    line-height: 17px;
}
}


/* (1366x768) WXGA Display */
/* @media  screen and (max-width: 1366px) {

}
*/

/* 1. scale and layout setting at 150% */
@media (resolution: 1.25dppx) {
.common-ttle {
font-size: 28px;
}
.hero-section .hero-content h2 {padding-top: 270px;}

}

/* 3. scale and layout setting at 150% */
@media (resolution: 1.5dppx) {

.container-1360-wrp{max-width: 1300px;}
.common-ttle{ font-size: 36px;}
.common-desc{ font-size: 20px;}
.common-cta{ font-size: 15px;}

}

/* Medium */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape)
{

.row { margin: 0px; }
.logo img {width: 100px;}
.hero-section { height: auto; }
.hero-section .hero-content h2 {font-size: 41px;padding-top: 0px;}
.hero-section .hero-content h1 {font-size: 36px;}
.hero-section .bannerBg,.hero-section .hero-download { position: relative; bottom: 0px; }
.hero-section .hero-download a h5 {font-size: 17px;}

#celebration .celebrationContent {padding-left: 10px;}
.common-ttle {
    font-size: 38px;
    line-height: 1.2;
}

}

/* Small */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) 
{

.row { margin: 0px; }
.logo img {width: 100px;}
.common-ttle {font-size: 32px;}

.hero-section { height: 50vh; }
#celebration {height: auto; padding: 30px 0px; padding-bottom: 160px; }
.hero-section .bannerBg { position: relative; height: 100%; }
.annualreportBt a img { width: 100px; }
.hero-section .bannerBg video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
#celebration .celebrationContent {padding-left: 0px; display: block; }
#celebration .linewave1,#celebration .linewave2,#What-lies .container::before, #What-lies .container::after,#chairman-message .chairmanMessageRight .chairmanMessageContent::before { display: none; }
#celebration .fifty-yr { position: relative; top: 0px; width: 300px;
    height: 300px; }
.svg-cricle svg { width: 100%; }
#celebration .fifty-yr .fifty-yr-img {top: 100px;}
#celebration .fifty-yr .fifty-yr-img img { width: 100%; }
/* #celebration .fifty-yr .fifty-yr-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin-top: 80px;
} */
#What-lies {padding: 20px 20px;}
#What-lies .container {padding: 10px 0px;}
#What-lies p {font-size: 18px;}
#hero-anim-track .container {padding-top: 40px;}
#hero-anim-track { height: auto; }
#hero-anim-track .decarbonisation-bg { position: relative; height: auto; }
#DiversePortfolio::before {height: 300px;}
#DiversePortfolio .swiper-button-next, #DiversePortfolio .swiper-button-prev {
    top: 100px;
    bottom: inherit;
}
#highlights {
    background-color: #112c58;
    padding: 30px 0px;
}

.kpiTabs_wap { overflow: scroll; }
/* .kpiTabs_wap .nav-item { width: 100px; } */
#highlights .nav-tabs {width: 1320px; justify-content: start;}
#highlights .nav-tabs .nav-link {font-size: 16px;margin: 0 5px;}
#highlights .kpi-number {font-size: 34px;}
.mt-5 {
    margin-top: 1rem!important;
}
#highlights { padding-bottom: 0px; }
#highlights .fivety-yr { width: 100%; position: relative; margin-top: 20px; font-size: 16px; }
#chairman-message .chairmanMessageImg { display: block; position: relative; z-index: 1; }

#chairman-message .chairmanMessageRight {
    padding-top: 30px;
}
#chairman-message .chairmanMessageRight .chairmanMessageContent {padding: 20px;}
#chairman-message .chairmanMessageRight p {font-size: 20px;}
#chairman-message .chairmanMessageRight .name {font-size: 22px;}
.common-cta {font-size: 14px;padding: 10px 10px;}


#businessOverview .businessLhs { width: 100%; padding: 20px; }
#businessOverview .bo { width: 100%; overflow: scroll; }
#businessOverview .nav { width: 950px; display: flex
;
    flex-wrap: wrap;
    border: none; }
#businessOverview .nav .nav-link {font-size: 16px;padding: 10px 0px;}
/* #businessOverview .businessCards .businessCardsContent {position: relative;
    left: 0px;
    bottom: 0px;
    padding: 20px 20px;} */
#Buildinglovedbrand .container { position: relative; width: 100%;  background-color: #112c58; padding-top: 30px;margin: 20px auto;}
#businessOverview .nav .nav-item { margin-right: 20px; }
#Buildinglovedbrand .img-container {clip-path: inset(0% 0% round 0px);height: 50vh;}

#esg-perfronce-review .esg-perfronce-title { display: block; text-align: center; }
#esg-perfronce-review .esg-perfronce-title .esg-icon { margin-bottom: 20px; }
#esg-perfronce-review .esg-perfronce-title .esg-icon img { width: 130px; }  
#esg-perfronce-review .swiper-button-next, #esg-perfronce-review .swiper-button-prev {
    top: 70px;
}

#esg-perfronce-review .swiper-button-prev {
    left: 20px;
    right: inherit;
}

#esg-perfronce-review .esg_holder .esgContent {
    padding: 14px;
}
#awards {
    padding: 0px 0px;
    background-color: #e6f2f8;
    padding-bottom: 30px;
} 
#downloadCenter .downloadCenterContent {
    padding: 50px 0px;
    padding-bottom: 10px;
}
#downloadCenter {
    background-color: #112c58;
    padding: 30px 0px;
}
#footer { text-align: center; }
#footer .w-auto {
    width: auto !important;
    margin: auto;
    margin-top: 10px;
}

#DiversePortfolio {padding-bottom: 10px;}
#chairman-message .bottomCricle { display: none; }
#chairman-message {padding-bottom: 40px;}
}


/* mobile desktop */
@media (max-width: 980px) {


.row { margin: 0px; }
.logo img {width: 100px;}
.common-ttle {font-size: 32px;}

.hero-section { height: 50vh; }
#celebration {height: auto; padding: 30px 0px; padding-bottom: 160px; }
.hero-section .bannerBg { position: relative; height: 100%; }
.annualreportBt a img { width: 100px; }
.hero-section .bannerBg video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
#celebration .celebrationContent {padding-left: 0px; display: block; }
#celebration .linewave1,#celebration .linewave2,#What-lies .container::before, #What-lies .container::after,#chairman-message .chairmanMessageRight .chairmanMessageContent::before { display: none; }
#celebration .fifty-yr { position: relative; top: 0px; width: 300px;
    height: 300px; }
.svg-cricle svg { width: 100%; }
#celebration .fifty-yr .fifty-yr-img {top: 100px;}
#celebration .fifty-yr .fifty-yr-img img  { width: 100%; }
/* #celebration .fifty-yr .fifty-yr-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin-top: 80px;
} */
#What-lies {padding: 20px 20px;}
#What-lies .container {padding: 10px 0px;}
#What-lies p {font-size: 18px;}
#hero-anim-track .container {padding-top: 40px;max-width: 100%;}
#DiversePortfolio .swiper {margin-top: 30px;}
#hero-anim-track { height: auto; }
#hero-anim-track .decarbonisation-bg { position: relative; height: auto; }
#DiversePortfolio::before {height: 300px;}
#DiversePortfolio .swiper-button-next, #DiversePortfolio .swiper-button-prev {
    top: 100px;
    bottom: inherit;
}
#highlights {
    background-color: #112c58;
    padding: 30px 0px;
}

.kpiTabs_wap { overflow: scroll; }
/* .kpiTabs_wap .nav-item { width: 100px; } */
#highlights .nav-tabs {width: 1320px; justify-content: start;}
#highlights .nav-tabs .nav-link {font-size: 16px;margin: 0 5px;}
#highlights .kpi-number {font-size: 34px;}
.mt-5 {
    margin-top: 1rem!important;
}
#highlights { padding-bottom: 0px; }
#highlights .fivety-yr { width: 100%; position: relative; margin-top: 20px; font-size: 16px; }
#chairman-message .chairmanMessageImg { display: block; position: relative; z-index: 1; }

#chairman-message .chairmanMessageRight {
    padding-top: 30px;
}
#chairman-message .chairmanMessageRight .chairmanMessageContent {padding: 20px;}
#chairman-message .chairmanMessageRight p {font-size: 20px;}
#chairman-message .chairmanMessageRight .name {font-size: 22px;}
.common-cta {font-size: 14px;padding: 10px 10px;}


#businessOverview .businessLhs { width: 100%; padding: 20px; }
#businessOverview .bo { width: 100%; overflow: scroll; }
#businessOverview .nav { width: 950px; display: flex
;
    flex-wrap: wrap;
    border: none; }
#businessOverview .nav .nav-link {font-size: 16px;padding: 10px 0px;}
#businessOverview .businessCards .businessCardsContent {position: relative;
    left: 0px;
    bottom: 0px;
    padding: 20px 20px;}
#Buildinglovedbrand .container { position: relative; width: 100%;  background-color: #112c58; padding-top: 30px;}
#businessOverview .nav .nav-item { margin-right: 20px; }
#Buildinglovedbrand .img-container {clip-path: inset(0% 0% round 0px);height: 50vh;}

#esg-perfronce-review .esg-perfronce-title { display: block; text-align: center; }
#esg-perfronce-review .esg-perfronce-title .esg-icon { margin-bottom: 20px; }
#esg-perfronce-review .esg-perfronce-title .esg-icon img { width: 130px; }  
#esg-perfronce-review .swiper-button-next, #esg-perfronce-review .swiper-button-prev {
    top: 70px;
}

#esg-perfronce-review .swiper-button-prev {
    left: 20px;
    right: inherit;
}

#esg-perfronce-review .esg_holder .esgContent {
    padding: 14px;
}
#awards {
    padding: 0px 0px;
    background-color: #e6f2f8;
    padding-bottom: 30px;
} 
#downloadCenter .downloadCenterContent {
    padding: 50px 0px;
    padding-bottom: 10px;
}
#downloadCenter {
    background-color: #112c58;
    padding: 30px 0px;
}
#footer { text-align: center; }
#footer .w-auto {
    width: auto !important;
    margin: auto;
    margin-top: 10px;
}

#Buildinglovedbrand .container { display: block; padding-bottom: 30px; max-width: 100%; }
.mb-5 {
    margin-bottom: 0rem !important;
}

.annualreportBt {padding-top: 10px;}
#chairman-message .bottomCricle { display: none; }
#chairman-message {padding-bottom: 40px;}
}


/* Extra small */
@media (min-width: 320px) and (max-width: 767px) {


.row { margin: 0px; }
.logo img {width: 100px;}
.common-ttle {font-size: 32px;}

.hero-section { height: 50vh; }
#celebration {height: auto; padding: 30px 0px; padding-bottom: 160px; }
.hero-section .bannerBg { position: relative; height: 100%; }
.annualreportBt a img { width: 100px; }
.hero-section .bannerBg video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
#celebration .celebrationContent {padding-left: 0px; display: block; }
#celebration .linewave1,#celebration .linewave2,#What-lies .container::before, #What-lies .container::after,#chairman-message .chairmanMessageRight .chairmanMessageContent::before { display: none; }
#celebration .fifty-yr { position: relative; top: 0px; width: 300px;
    height: 300px; }
.svg-cricle svg { width: 100%; }
#celebration .fifty-yr .fifty-yr-img {top: 100px;}
#celebration .fifty-yr .fifty-yr-img img  { width: 100%; }
/* #celebration .fifty-yr .fifty-yr-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin-top: 80px;
} */
#What-lies {padding: 20px 20px;}
#What-lies .container {padding: 10px 0px;}
#What-lies p {font-size: 18px;}
#hero-anim-track .container {padding-top: 40px;}
#hero-anim-track { height: auto; }
#hero-anim-track .decarbonisation-bg { position: relative; height: auto; }
#DiversePortfolio::before {height: 300px;}
#DiversePortfolio .swiper-button-next, #DiversePortfolio .swiper-button-prev {
    top: 100px;
    bottom: inherit;
}
#highlights {
    background-color: #112c58;
    padding: 30px 0px;
}

.kpiTabs_wap { overflow: scroll; }
/* .kpiTabs_wap .nav-item { width: 100px; } */
#highlights .nav-tabs {width: 1320px; justify-content: start;}
#highlights .nav-tabs .nav-link {font-size: 16px;margin: 0 5px;}
#highlights .kpi-number {font-size: 34px;}
.mt-5 {
    margin-top: 1rem!important;
}
#highlights { padding-bottom: 0px; }
#highlights .fivety-yr { width: 100%; position: relative; margin-top: 20px; font-size: 16px; }
#chairman-message .chairmanMessageImg { display: block; position: relative; z-index: 1; }

#chairman-message .chairmanMessageRight {
    padding-top: 30px;
}
#chairman-message .chairmanMessageRight .chairmanMessageContent {padding: 20px;}
#chairman-message .chairmanMessageRight p {font-size: 20px;}
#chairman-message .chairmanMessageRight .name {font-size: 22px;}
.common-cta {font-size: 14px;padding: 10px 10px;}


#businessOverview .businessLhs { width: 100%; padding: 20px; }
#businessOverview .bo { width: 100%; overflow: scroll; }
#businessOverview .nav { width: 950px; display: flex
;
    flex-wrap: wrap;
    border: none; }
#businessOverview .nav .nav-link {font-size: 16px;padding: 10px 0px;}
#businessOverview .businessCards .businessCardsContent {position: relative;
    left: 0px;
    bottom: 0px;
    padding: 20px 20px;}
#Buildinglovedbrand .container { position: relative; width: 100%;  background-color: #112c58; padding-top: 30px;}
#businessOverview .nav .nav-item { margin-right: 20px; }
#Buildinglovedbrand .img-container {clip-path: inset(0% 0% round 0px);height: 50vh;}

#esg-perfronce-review .esg-perfronce-title { display: block; text-align: center; }
#esg-perfronce-review .esg-perfronce-title .esg-icon { margin-bottom: 20px; }
#esg-perfronce-review .esg-perfronce-title .esg-icon img { width: 130px; }  
#esg-perfronce-review .swiper-button-next, #esg-perfronce-review .swiper-button-prev {
    top: 70px;
}

#esg-perfronce-review .swiper-button-prev {
    left: 20px;
    right: inherit;
}

#esg-perfronce-review .esg_holder .esgContent {
    padding: 14px;
}
#awards {
    padding: 0px 0px;
    background-color: #e6f2f8;
    padding-bottom: 30px;
} 
#downloadCenter .downloadCenterContent {
    padding: 50px 0px;
    padding-bottom: 10px;
}
#downloadCenter {
    background-color: #112c58;
    padding: 30px 0px;
}
#footer { text-align: center; }
#footer .w-auto {
    width: auto !important;
    margin: auto;
    margin-top: 10px;
}

#Buildinglovedbrand .container { display: block; padding-bottom: 30px; }
.mb-5 {
    margin-bottom: 0rem !important;
}

.annualreportBt {padding-top: 10px;}
#chairman-message {padding-bottom: 40px;}
#chairman-message .bottomCricle { display: none; }
}