/*# sourceMappingURL=bootstrap.min.css.map */

.mainContent .slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: #fff0
}
.video-container {
    position: relative;
    overflow: hidden;
}

    /* ✅ BLACK TRANSPARENT OVERLAY */
    .video-container::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.35); /* adjust 0.35 → darker/lighter */
        pointer-events: none;
    }

.play-btn {
    width: 70px !important;
    height: 50px !important;
    background-color: rgba(255, 0, 0, 0.9);
    border-radius: 12px !important;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
    z-index: 2;
}

    /* Triangle inside button */
    .play-btn::before {
        content: '';
        display: block;
        width: 0;
        height: 0;
        border-left: 18px solid white;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        margin-left: 4px;
    }

/* Hover effect */
.video-container:hover .play-btn {
    background-color: #ff0000;
    transform: translate(-50%, -50%) scale(1.1);
}

.mainContent .slick-list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0 -.5rem;
    padding: 0
}

    .mainContent .slick-list:focus {
        outline: none
    }

    .mainContent .slick-list.dragging {
        cursor: pointer;
        cursor: hand
    }

.mainContent .slick-slider .slick-track,
.mainContent .slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.mainContent .slick-track {
    position: relative;
    top: 0;
    left: 0;
    display: block;
    margin-left: auto;
    margin-right: auto
}

    .mainContent .slick-track:before,
    .mainContent .slick-track:after {
        display: table;
        content: ''
    }

    .mainContent .slick-track:after {
        clear: both
    }

.mainContent .slick-loading .slick-track {
    visibility: hidden
}

.mainContent .slick-slide {
    display: none;
    float: left;
    height: 100%;
    min-height: 1px
}

[dir='rtl'] .mainContent .slick-slide {
    float: right
}

.mainContent .slick-slide img {
    display: block;
    object-fit: cover;
    width: 100%;
}

.csrPhotoGallery .slick-prev::after {
    content: '\f060';
    content: "" !important;
}
.csrPhotoGallery .slick-next::after {
    content: "" !important;
}

.mainContent .homePageBanner .slick-slide img {
    display: block;
    object-fit: cover;
    width: 100%;
    aspect-ratio: 1920 / 600;
}

.mainContent .slick-slide .listIcon img {
    width: auto
}

.mainContent .slick-slide.slick-loading img {
    display: none
}

.mainContent .slick-slide.dragging img {
    pointer-events: none
}

.mainContent .slick-initialized .slick-slide {
    display: block;
    /* slick sets an inline width on every slide; transitioning "all" animated that width
       and forced a layout pass per slide. Movement is the track's transform, not the slide. */
    transition: opacity 0.5s ease-in-out 0s
}

.mainContent .slick-loading .slick-slide {
    visibility: hidden
}

.mainContent .slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid #fff0
}

.mainContent .slick-arrow.slick-hidden {
    display: none
}

.mainContent .slick-arrow {
    width: 40px;
    padding:0;
    height: 40px;
    bottom: -50px;
    transition: background-color 0.5s ease-in-out 0s, color 0.5s ease-in-out 0s, border-color 0.5s ease-in-out 0s, box-shadow 0.5s ease-in-out 0s;
    z-index: 1;
    line-height: 36px
}

/* Point 29 - the hero banner next/prev arrows are gold (#fec833) with no backing, so
   they drop to ~1.2:1 over the light areas of the photo. A dark translucent disc behind
   the gold glyph keeps them at >=3:1 on any part of the image (WCAG 1.4.11). */
.mainSlider .slick-arrow {
    width: 44px !important;
    height: 44px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, .4) !important;
    border-radius: 50% !important;
    box-shadow: 0 0 4px rgba(0, 0, 0, .55);
    transform: translateY(-50%);
}
/* keep the 40% dark disc on hover (was going navy/transparent) */
.mainSlider .slick-arrow:hover {
    background: rgba(0, 0, 0, .4) !important;
}

    .mainContent .slick-arrow:hover {
        background: var(--colorBlue) !important;
        color: var(--bs-white);
        border-color: var(--colorBlue) !important;
        box-shadow: 0 0 10px 0 rgba(var(--colorBlackRGB), .25)
    }

    .mainContent .slick-arrow.slick-prev {
        left: -55px;
        right: 0
    }

    .mainContent .slick-arrow.slick-next {
        left: 0;
        right: -55px
    }

.mainContent .leftRightArrow .slick-arrow {
    top: 0;
    bottom: 0
}

    .mainContent .leftRightArrow .slick-arrow.slick-prev {
        right: auto
    }

    .mainContent .leftRightArrow .slick-arrow.slick-next {
        left: auto
    }

.mainContent .topRightArrow .slick-arrow {
    top: -60px;
    bottom: auto
}

    .mainContent .topRightArrow .slick-arrow.slick-prev {
        right: 55px;
        left: auto
    }

    .mainContent .topRightArrow .slick-arrow.slick-next {
        right: 0;
        left: auto
    }

.mainContent .slick-dots {
    z-index: 1;
    bottom: -30px;
    line-height: normal
}

.mainContent .mainSlider .slick-dots {
    bottom: 30px
}

.mainContent .slick-dots li {
    display: inline-block;
    padding: 0 6px;
    vertical-align: top
}

    .mainContent .slick-dots li button {
        /* Point 26/119 - inactive dots were rgba(blue,.25) (~1.5:1 on white). Use an
           opaque-enough blue for >=3:1 on light sections, plus a light 1px ring
           (box-shadow, no size change) so they also read on any darker background. */
        background: rgba(var(--colorBlueRGB), .7);
        box-shadow: 0 0 0 1px rgba(var(--bs-white-rgb), .7);
        border: none;
        height: 14px;
        width: 14px;
        font-size: 0;
        border-radius: 50%;
        display: block
    }

/* Point 26 - Hero slider bullets must stay visible over a photo that is light in some
   areas and dark in others. A light fill shows on dark areas; a dark 1px ring (via
   box-shadow, so it adds no size) shows on light areas - giving >=3:1 on any background. */
.mainContent .mainSlider .slick-dots li button {
    background: rgba(var(--bs-white-rgb), .85);
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .75), 0 1px 2px rgba(0, 0, 0, .55);
}

.mainContent .slick-dots li.slick-active button {
    width: 42px;
    background: var(--colorBlue);
    border-radius: 10px;
    box-shadow: 0 0 0 1px rgba(var(--bs-white-rgb), .7)
}

.mainContent .mainSlider .slick-dots li.slick-active button {
    background: var(--bs-white);
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .75), 0 1px 2px rgba(0, 0, 0, .55);
}

.headerCart i {
    color: #000 !important
}

@font-face {
    font-display: swap;
    font-family: "bootstrap-icons";
    src: url(../fonts/bootstrap-icons.woff2?dd67030699838ea613ee6dbda90effa6) format("woff2"), url(../fonts/bootstrap-icons.woff?dd67030699838ea613ee6dbda90effa6) format("woff")
}

.bi::before,
[class^="bi-"]::before,
[class*=" bi-"]::before {
    display: inline-block;
    font-family: bootstrap-icons !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    vertical-align: -.125em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.bi-arrow-left::before {
    content: '\F12F'
}

.bi-arrow-right::before {
    content: '\F138'
}

.bi-twitter-x::before {
    content: '\F8DB'
}

.bi-youtube::before {
    content: '\F62B'
}

.bi-spotify::before {
    content: '\F666'
}

.bi-calendar4::before {
    content: '\F218'
}

.bi-clock::before {
    content: '\F293'
}

.bi-cart::before {
    content: '\F242'
}

.bi-lock::before {
    content: '\F47B'
}

.bi-download::before {
    content: '\F30A'
}

.bi-chevron-down::before {
    content: '\F282'
}

.bi-search::before {
    content: '\F52A'
}

.bi-person-fill::before {
    content: '\F4DA'
}

.bi-x::before {
    content: '\F62A'
}

.bi-x-lg::before {
    content: '\F659'
}

.bi-pause-circle::before {
    content: '\F4C2'
}

.bi-play-circle::before {
    content: '\F4F3'
}

.bi-chevron-up::before {
    content: '\F286'
}

.bi-chevron-left::before {
    content: '\F284'
}

.bi-chevron-right::before {
    content: '\F285'
}

.bi-currency-rupee::before {
    content: '\F7EC'
}

.bi-calendar-week::before {
    content: '\F1F3'
}

.bi-plus::before {
    content: '\F4FE'
}

.bi-plus-lg::before {
    content: '\F64D'
}

.bi-dash::before {
    content: '\F2EA'
}

.bi-play-fill::before {
    content: '\F4F4'
}

.bi-pause-fill::before {
    content: '\F4C3'
}

.bi-image::before {
    content: '\F42A'
}

.bi-cart3::before {
    content: '\F244'
}

.bi-calendar4-week::before {
    content: '\F217'
}

@font-face {
    font-display: swap;
    font-family: 'FontAwesome';
    src: url(../fonts/fontawesome-webfont.eot?v=4.7.0);
    src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url(../fonts/fontawesome-webfont.woff2?v=4.7.0) format('woff2'), url(../fonts/fontawesome-webfont.woff?v=4.7.0) format('woff'), url(../fonts/fontawesome-webfont.ttf?v=4.7.0) format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
    font-weight: 400;
    font-style: normal
}

.fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.fa-envelope::before {
    content: "\f0e0"
}

.fa-phone-square::before {
    content: "\f095"
}

.fa-linkedin::before {
    content: "\f0e1"
}

.fa-facebook::before {
    content: "\f09a"
}

.fa-instagram::before {
    content: "\f16d"
}

/* Slick's prev/next arrows are built in JS (see home.js), so these two never appear in the
   served HTML - which is why they were missed when the icons used on the home page were
   inventoried. Home no longer pulls FontAwesome from cdnjs, so without these the carousel
   arrows render as empty boxes. */
.fa-chevron-left::before {
    content: "\f053"
}

.fa-chevron-right::before {
    content: "\f054"
}

.fa-play::before {
    content: "\f04b"
}

.fa-pause::before {
    content: "\f04c"
}

.fa-spinner::before {
    content: "\f110"
}

.fa-map-marker::before {
    content: "\f041"
}

.fa-spin {
    -webkit-animation: spin 2s infinite linear;
    -moz-animation: spin 2s infinite linear;
    -o-animation: spin 2s infinite linear;
    animation: spin 2s infinite linear
}

:root {
    --colorBlue: #0028A0;
    --colorBlueRGB: 0, 40, 160;
    --colorNero: #191919;
    --colorNeroRGB: 25, 25, 25;
    --colorAliceBlue: #F4F7FF;
    --colorMango: #FFC933;
    --colorRed: #ff0000;
    --colorLightgrayishblue: #D9DFF1;
    --colorBlackRGB: 0, 0, 0;
    --colorWhiteRGB: 255, 255, 255;
    --colorTwitter: #191919;
    --colorLinkedin: #007bb5;
    --colorFacebook: #4267b2;
    --colorInstagram: #a93797;
    --colorYoutube: #bb0000;
    --colorSpotify: #1dd05d;
    --colorSuccess: #2E7D32; /* was #98C93C (~2:1 on white); darkened for >=3:1 download/action icons (WCAG 1.4.11) */
    --colorWhiteSmoke: #f7f7f7;
    --colorDimGrey: #717171;
    --colorDimGreyRGB: 113, 113, 113
}

.mainContent a {
    /* "all" here put every link on the page into the animated set, including inherited
       scrollbar-color and visibility - 74 non-composited animations in the Lighthouse audit. */
    transition: color 0.5s ease-in-out 0s, background-color 0.5s ease-in-out 0s
}

.btn.bg-white:hover {
    background: var(--colorBlue) !important;
    color: var(--bs-white)
}

.borderOnHover:hover {
    border-color: var(--colorBlue) !important;
    box-shadow: 0 0 8px 0 rgba(var(--bs-black-rgb), .15);
    background: var(--bs-white) !important
}

.btn-outline-primary {
    border-color: var(--colorBlue);
    color: var(--colorBlue)
}

    .btn-outline-primary:hover {
        background: var(--colorBlue);
        border-color: var(--colorBlue)
    }

.btn-outline-secondary {
    border-color: var(--colorNero);
    color: var(--colorNero)
}

    .btn-outline-secondary:hover {
        background: var(--colorBlue);
        border-color: var(--colorBlue)
    }

.btnHoverWhite:hover {
    background: var(--bs-white);
    color: var(--colorBlue) !important
}

.textNero {
    color: var(--colorNero)
}

.linkNero {
    color: var(--colorNero)
}

    .linkNero:hover {
        color: var(--colorBlue)
    }

.linkHoverNero:hover {
    color: var(--colorNero)
}

.linkBlue {
    color: var(--colorBlue)
}

    .linkBlue:hover {
        color: var(--colorNero)
    }

.linkHoverBlue:hover {
    color: var(--colorBlue) !important
}

.mainHeader,
.mainContent,
.mainFooter {
    font-family: "Arial", Helvetica, sans-serif;
    color: var(--colorNero);
    font-size: 16px;
    line-height: 1.75
}

.btn {
    transition: color 0.5s ease-in-out 0s, background-color 0.5s ease-in-out 0s, border-color 0.5s ease-in-out 0s, box-shadow 0.5s ease-in-out 0s
}

.bg-primary {
    background: var(--colorBlue) !important
}

.bg-AliceBlue {
    background: var(--colorAliceBlue) !important
}

.btn-primary {
    background: var(--colorBlue) !important
}

    .btn-primary:hover {
        color: var(--colorBlue) !important;
        border-color: var(--colorBlue) !important;
        background: var(--bs-white) !important
    }

.text-primary {
    color: var(--colorBlue) !important;
    transition: color 0.5s ease-in-out 0s
}

.bg-warning {
    background: var(--colorMango) !important
}

.btn-warning {
    background: var(--colorMango) !important
}

    .btn-warning:hover {
        border-color: var(--colorMango) !important;
        background: var(--bs-white) !important
    }

.text-warning {
    color: var(--colorMango) !important;
    transition: color 0.5s ease-in-out 0s
}

.text-danger {
    color: var(--colorRed) !important
}

.text-body-secondary {
    background: var(--colorLightgrayishblue) !important;
    color: var(--colorNero) !important
}

.cursor-pointer {
    cursor: pointer
}

.rounded-top-end-4 {
    border-top-right-radius: 20px !important
}

.rounded-bottom-start-4 {
    border-bottom-left-radius: 20px !important
}

iframe {
    width: 100%
}

ul.customList {
    max-height: 400px
}

ul.listMinHeightH50 h3 {
    min-height: 50px
}

ul.customList.listMaxHeight200 {
    max-height: 200px
}

ul.customList li:last-child {
    padding-bottom: 0px !important
}

.customList a {
    color: #000
}

.listIcon {
    color: #000
}

.dateMeta {
    padding-left: 1px
}

.border,
.list-group-item,
.card,
.page-link {
    border-color: rgba(var(--colorNeroRGB), .15) !important
}

    .border.border-black {
        border-color: var(--colorNeroRGB) !important
    }

        .border.border-black:hover {
            border-color: var(--colorBlue) !important
        }

/* Was "all", which put 237 elements on the transition watch list including layout-affecting
   properties. Narrowed to what the hover states actually animate: colour, shadow and compositor
   -friendly transform/opacity. Anything outside this list now snaps rather than eases. */
.transition {
    transition: color 0.5s ease-in-out 0s, background-color 0.5s ease-in-out 0s, border-color 0.5s ease-in-out 0s, box-shadow 0.5s ease-in-out 0s, transform 0.5s ease-in-out 0s, opacity 0.5s ease-in-out 0s
}

.text-success {
    color: var(--colorSuccess) !important
}

.bg-BlueRGB {
    background: rgba(var(--colorBlueRGB), .15)
}

/* Point 216/146 - the mailto links inside the subscribe / bootbox dialogs used the
   default ~#007bff (~4:1 on white, worse on tinted backgrounds). Use ICRA navy (>=4.5:1)
   and underline them so they are not distinguished by colour alone (WCAG 1.4.3 / 1.4.1). */
.bootbox a,
#subscribeModal a,
.subscribeModal a {
    color: #0028A0 !important;
    text-decoration: underline !important;
}

.btn-close.modalClose {
    right: 10px;
    top: 10px;
    font-size: 12px
}

.table-light {
    background: var(--colorWhiteSmoke) !important
}

.btn-secondary {
    background: rgba(var(--colorDimGreyRGB), .25) !important;
    color: var(--colorNero) !important
}

.cardShadow {
    box-shadow: 0 0 10px 0 rgba(var(--bs-black-rgb), .15)
}

* {
    scrollbar-width: thin;
    scrollbar-color: var(--colorBlue) rgba(var(--colorDimGreyRGB), .25);
    scroll-behavior: smooth
}

::-webkit-scrollbar {
    width: 5px;
    scroll-behavior: smooth
}

::-webkit-scrollbar-thumb {
    background: var(--colorBlue);
    border-radius: 20px
}

    ::-webkit-scrollbar-thumb:hover {
        background: rgba(var(--colorBlue), .75)
    }

::-webkit-scrollbar-track {
    background: rgba(var(--colorDimGreyRGB), .25)
}

.contactHeader li:not(:last-child) {
    margin-right: 1rem
}

.headerBottom {
    box-shadow: 0 6px 10px 0 rgba(var(--colorBlackRGB), .15)
}

.mainNavigation > ul > li > a {
    color: var(--colorNero);
    text-decoration: none;
    padding: 12px 10px;
    display: block;
    font-size: 15px;
    line-height: 1.75
}

.mainNavigation > ul > li:hover > a {
    color: var(--colorBlue)
}

.cartCount {
    height: 15px;
    width: 15px;
    font-size: 9px;
    left: 3px;
    right: 0;
    margin: auto;
    top: 3px
}

.headerSearchForm {
    width: 540px;
    right: -20px
}

    .headerSearchForm input {
        padding-right: 40px
    }

    .headerSearchForm button {
        right: 10px;
        height: 30px
    }

.searchOverlay {
    background: rgba(var(--bs-black-rgb), .5)
}

.headerSearchForm form::before {
    position: absolute;
    right: 16px;
    top: -12px;
    content: "";
    border-bottom: 12px solid var(--bs-white);
    border-left: 12px solid #fff0;
    border-right: 12px solid #fff0
}

.menuIconList li a {
    padding-left: 2rem !important
}

.menuIconList li:hover h3 a {
    color: var(--colorBlue)
}

.menuIconList li .menuIcon2 {
    display: none
}

.menuIconList li:hover .menuIcon2 {
    display: block
}

.menuIconList li:hover .menuIcon1 {
    display: none
}

.menuIconList.menuIconListAbout li {
    padding-left: 2rem !important
}

    .menuIconList.menuIconListAbout li a {
        padding-left: 0rem !important
    }

.megaMenuWrap {
    display: none
}

.mainNavigation > ul > li:hover .megaMenuWrap {
    display: block
}

/* Accessibility (WCAG 2.1.1 / 1.4.13): the desktop mega-menu opens on hover via the
   rule above and on keyboard focus via .menu-open (added by app.js). .js-force-closed
   is added by the Esc handler and overrides both so the panel can be dismissed. */
.mainNavigation > ul > li.hasSubMenu.menu-open .megaMenuWrap {
    display: block
}

.mainNavigation > ul > li.hasSubMenu.js-force-closed .megaMenuWrap {
    display: none !important
}

.megaMenu {
    box-shadow: 0 10px 18px 0 rgba(var(--colorBlackRGB), .25);
    border-color: rgba(var(--colorBlueRGB), .25) !important
}

    .megaMenu .fs-5 {
        font-size: 1.15rem !important
    }

    .megaMenu .listIcon {
        top: auto !important;
        bottom: 2px
    }

    .megaMenu ul.customList li:last-child .listIcon {
        bottom: -7px
    }

.menuFooter {
    margin: 0 -1rem -1.5rem
}

    .menuFooter a.btn {
        height: 38px;
        right: 15px
    }

.megaMenuMedia::before {
    background: var(--colorAliceBlue);
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 49.5%;
    content: "";
    z-index: -1
}

body.overflow-hidden {
    padding-right: 8px
}

.announcementList mark {
    color: var(--colorBlue);
    background: none;
    padding: 0
}

.announcementList a {
    color: var(--colorBlue)
}

.closeAnnouncement {
    right: 20px;
    height: 19px
}

    .closeAnnouncement::before {
        font-weight: 700 !important
    }

.announcementList {
    width: calc(100% - 235px)
}

    .announcementList::after {
        height: 100%;
        background: var(--bs-white);
        content: "";
        position: absolute;
        right: 0;
        top: 0;
        bottom: 0;
        width: 30px;
        z-index: 0
    }

    /* Gated on html.motion-ready, which home.js sets on the first interaction or 10s after load.

       Speed Index scores each frame against the LAST frame of the trace, so anything that never
       stops moving keeps every earlier frame from ever matching. This ticker and the hero
       autoplay were the reason Speed Index came back at 3.9s on a page that is fully loaded at
       2.4s. Un-animated the <ul> sits at its natural position, so the announcements are readable
       from the first paint rather than parked off-screen at translateX(100%). */
    .motion-ready .announcementList ul {
        animation: scrollLeft 25s linear infinite
    }

        .announcementList ul.marqueePaused {
            animation-play-state: paused
        }

.announcementControls {
    right: 1px;
    height: 28px
}

.announcementTitle.bg-warning:hover {
    background: var(--colorMango) !important
}

@keyframes scrollLeft {
    from {
        transform: translateX(100%)
    }

    to {
        transform: translateX(-100%)
    }
}

.mainSlider {
    padding: 0 .5rem;
    aspect-ratio: 1920 / 600;
}

    .mainSlider .slick-slide::after {
        background: rgba(var(--bs-black-rgb), .25);
        content: "";
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        z-index: 0;
        position: absolute
    }

.sliderTitle {
    /* Point 31 - white hero titles sit over a photo that is light in places (~2:1). A
       strong dark halo plus the scrim below keep the text legible (WCAG 1.4.3). */
    text-shadow: 0 1px 3px rgba(0, 0, 0, .9), 0 0 8px rgba(0, 0, 0, .6);
    font-display: swap;
}

/* Point 31 - dark left-weighted scrim behind the hero caption so the white title/CTA
   always have a dark backing, while the right of the image stays visible. Only on text
   slides: the branding banners are flagged .NoOverLay and must show the full image. */
.mainSlider .position-relative:not(.NoOverLay) .sliderCaption {
    background: linear-gradient(90deg, rgba(0, 0, 0, .75) 0%, rgba(0, 0, 0, .55) 55%, rgba(0, 0, 0, .2) 100%);
}

.icraRatingSection {
    background: url(../images/icra-rating-bg.jpg) no-repeat center center / cover
}

.threeColumnsIcons .contentBox figcaption {
    background: none;
    min-height: 60px
}

.threeColumnsIcons a:hover {
    background: var(--colorBlue) !important;
    color: var(--bs-white) !important
}

    .threeColumnsIcons a:hover .linkNero {
        color: var(--bs-white)
    }

    .threeColumnsIcons a:hover img {
        -webkit-filter: brightness(0) invert(1);
        filter: brightness(0) invert(1)
    }

.viewAllLinkBox a:hover {
    background: var(--colorBlue) !important;
    color: var(--bs-white) !important
}

.viewAllLinkBox a img {
    vertical-align: sub
}

.btnwithIconImg img {
    vertical-align: sub
}

.card-footer .linkNero:hover {
    color: var(--bs-white)
}

.customList .list-group-item:first-child {
    padding-top: 0px !important
}

.rightSide .customList .fs-6 {
    font-size: 0.9rem !important
}

.rightSide ul.customList {
    max-height: none
}

.contentBox a:hover {
    box-shadow: 0 3px 18px 0 rgba(var(--colorBlackRGB), .25)
}

.contentBox figcaption {
    background: linear-gradient(180deg, rgba(var(--colorNeroRGB), .1) 60%, var(--colorNero) 100%)
}

.contentBox a:hover span {
    opacity: .8
}

.cprSection {
    background: url(../images/cpr-bg.jpg) no-repeat center center / cover
}

.listIcon {
    top: 15px;
    width: 30px;
    height: 30px
}

.customList .list-group-item:first-child .listIcon {
    top: 5px
}

.cartIcon:hover {
    background: var(--colorBlue);
    color: var(--bs-white);
    border-color: var(--colorBlue) !important
}

.videoBorder iframe {
    border: 5px solid var(--colorBlue);
    border-radius: 10px
}

.webinarsTabs .nav-pills .nav-link.active,
.webinarsTabs .nav-pills .nav-link:hover {
    color: var(--colorBlue)
}

.webinarsTabs .nav-pills .nav-link {
    color: var(--colorNero)
}

.webinarTabsBtn .nav-link:not(:last-child) {
    margin-bottom: 15px
}

.webinarTabsBtn .nav-link::after {
    content: '\F138';
    font-family: 'bootstrap-icons';
    display: none;
    position: absolute;
    right: 0
}

.webinarTabsBtn .nav-link.active::after,
.webinarTabsBtn .nav-link:hover::after {
    display: inline-block !important
}

.webinarsTabs .nav {
    width: 100%
}

.webinarsTabs .card:hover {
    box-shadow: 0 2px 16px 1px rgba(var(--colorBlueRGB), .4)
}

.newsMediaSection {
    background: url(../images/newsmedia-bg.jpg) no-repeat center center / cover
}

    .newsMediaSection .card {
        border-color: rgba(var(--colorBlueRGB), .25);
        background: rgba(var(--bs-white-rgb), .95);
        box-shadow: 0 0 8px 0 rgba(var(--bs-black-rgb), .15)
    }

        .newsMediaSection .card .card-body:after,
        .reportCommentSection .card .card-body:after {
            background: linear-gradient(180deg, rgba(var(--colorWhiteRGB), 0) 0%, var(--bs-white) 100%);
            bottom: 0;
            left: 0;
            right: 0;
            content: "";
            height: 60px;
            position: absolute
        }

.podSection iframe {
    max-width: 100%
}

.esgRatingSection {
    position: relative;
    background: url(../images/icra-esg-ratings-bg.jpg) no-repeat center center / cover;
}
/* Point 31 - white text over the light-green ESG background was ~2.6:1. A dark scrim
   darkens the band so the white copy reaches >=4.5:1 (WCAG 1.4.3). */
.esgRatingSection::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 22, 11, .55);
    z-index: 0;
    pointer-events: none;
}
.esgRatingSection > * {
    position: relative;
    z-index: 1;
}

.esgRatingText {
    max-width: 65%
}

.borderOnHover:hover .linkHoverBlue {
    color: var(--colorBlue)
}

.nonRatingSection {
    background: url(../images/nonRating-bg.jpg) no-repeat center center / cover;
}

.nonRatingThumbSlider .borderOnHover:hover h3 a {
    color: var(--colorBlue)
}

.mainFooter a {
    color: var(--colorNero);
    transition: color 0.5s ease-in-out 0s;
    line-height: 1.75
}

    .mainFooter a:hover {
        color: var(--colorBlue)
    }

.footerMiddle h2 {
    padding-bottom: 0;
    line-height: 1.2
}

.footerTop h2 {
    padding-bottom: 0;
    line-height: 1.2
}

.footerTop li {
    line-height: 1.75
}

.footerTop p {
    line-height: 1.75
}

.footerBottom {
    font-size: 14px
}

    .footerBottom ul li {
        margin-right: 0 !important
    }

        .footerBottom ul li:not(:first-child) {
            margin-left: 1rem
        }

.socialLinks {
    gap: 10px
}

    .socialLinks li.list-inline-item {
        margin: 0
    }

    .socialLinks li a {
        width: 30px;
        height: 30px;
        color: var(--colorNero)
    }

        .socialLinks li a:hover {
            background: var(--colorBlue);
            color: var(--bs-white)
        }

.footerGetinTouch .form-control::placeholder {
    color: rgba(var(--bs-white-rgb), .75)
}

.footerGetinTouch .form-select {
    color: rgba(var(--bs-white-rgb), .75);
    --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e")
}

    .footerGetinTouch .form-select option {
        color: var(--colorNero)
    }

.footerGetinTouch textarea {
    min-height: 120px;
    resize: none
}

.footerGetinTouch .border {
    border-color: rgba(var(--bs-white-rgb), .75) !important
}

.whiteButonHover.border:hover {
    border-color: var(--bs-white) !important
}

.toggleLabel {
    opacity: .75; /* was .5 -> ~3.9:1 white-on-navy; .75 keeps >=4.5:1 (WCAG 1.4.3) */
    transition: 0.3s
}

    .toggleLabel.active {
        opacity: 1
    }

.switchWrap {
    width: 45px;
    height: 24px
}

.toggleSwitcher {
    border-color: var(--bs-white) !important
}

    .toggleSwitcher:before {
        position: absolute;
        content: "";
        height: 18px;
        width: 18px;
        left: 3px;
        bottom: 2px;
        background-color: #fff;
        transition: .4s;
        border-radius: 50%
    }

input:checked + .toggleSwitcher:before {
    transform: translateX(19px)
}

.stickySocials .socialLinks {
    box-shadow: 0 6px 10px 0 rgba(var(--colorBlackRGB), .15)
}

    .stickySocials .socialLinks li a {
        color: var(--bs-white);
        width: 35px;
        height: 35px
    }

.linkedin {
    background: var(--colorLinkedin)
}

.facecbook {
    background: var(--colorFacebook)
}

.twitterX {
    background: var(--colorTwitter)
}

.instagram {
    background: var(--colorInstagram)
}

.youtube {
    background: var(--colorYoutube)
}

.spotify {
    background: var(--colorSpotify)
}

#backToTop {
    bottom: 20px;
    right: 20px;
    box-shadow: 0 4px 16px 0 rgba(var(--colorBlackRGB), .25)
}

    #backToTop.btn-warning:hover {
        background: var(--colorNero) !important
    }

        #backToTop.btn-warning:hover .bi {
            box-shadow: 0 0 0 6px var(--colorNero)
        }

    #backToTop .bi {
        height: 40px;
        width: 40px;
        border: 3px solid var(--bs-white) !important;
        box-shadow: 0 0 0 6px var(--colorMango)
    }

        #backToTop .bi::before {
            font-weight: bold !important
        }

.pageBanner {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 320px
}

.pageBannerContent {
    max-width: 60%
}

.mainContent .breadcrumb-item {
    position: relative
}

.breadcrumb-item + .breadcrumb-item {
    padding-left: 1.5rem
}

.mainContent .breadcrumb-item + .breadcrumb-item::before {
    content: '\F285';
    font-family: "bootstrap-icons";
    color: var(--bs-white);
    font-size: 12px;
    text-shadow: 0 0 0 var(--bs-white);
    position: absolute;
    height: 12px;
    line-height: 13px;
    top: 0;
    bottom: 0;
    margin: auto;
    padding: 0;
    float: none;
    left: 5px
}

.mainContent .pageBannerBlueText .breadcrumb-item + .breadcrumb-item::before {
    color: var(--colorNero)
}

/* Disclaimer / Privacy / Sitemap use the modern .breadcrumb list but also load the
   legacy main.css, whose ".breadcrumbs a::after" already draws the ICRA chevron
   between items. Bootstrap's own "/" divider then doubled it (chevron + slash).
   Keep the single chevron; drop the redundant slash and its extra padding. */
.breadcrumbs .breadcrumb-item + .breadcrumb-item::before {
    content: none;
}

.breadcrumbs .breadcrumb-item + .breadcrumb-item {
    padding-left: 0;
}

/* "Home" is an <a> (legacy line-height + absolute chevron) while the active
   "Disclaimer" is plain <li> text; center every item so they sit on one line. */
.breadcrumbs .breadcrumb {
    align-items: center;
}

.breadcrumbs .breadcrumb-item {
    align-items: center;
    line-height: 22px;
}

.breadcrumbs .breadcrumb-item a {
    line-height: 22px;
}

.pageBannerMinHeight {
    min-height: auto !important
}

.mainContent .pagination li a {
    width: 35px;
    height: 35px;
    line-height: 35px
}

.mainContent .pagination li.active > .page-link,
.mainContent .pagination li > .page-link.active,
.mainContent .pagination li > .page-link:hover {
    background: #fff0;
    color: var(--colorBlue)
}

.pagination .disabled > .page-link,
.pagination .page-link.disabled {
    opacity: .8
}

.pagination .nextPrevArrow .btn {
    box-shadow: 0 0 10px 0 rgba(var(--colorBlackRGB), .25)
}

    .pagination .nextPrevArrow .btn i.bi {
        height: 16px;
        line-height: 16px
    }

.roundedThumbnail h3.fs-6 {
    font-size: 0.95rem !important
}

.fourColumnSlider .slick-list {
    padding: 20px 0
}

.subscribeModal ul li:not(:last-child) {
    margin-bottom: 1rem
}

.customTable .table tbody tr:last-child > *,
.customTable .table tfoot tr:last-child > * {
    border-bottom: 0
}

.customTable .table tfoot tr > * {
    border-top-width: 1px
}

.reportSearchForm {
    box-shadow: 0 2px 20px 0 rgba(var(--colorBlackRGB), .15)
}

    .reportSearchForm .bi-search {
        left: 15px;
        height: 23px
    }

    .reportSearchForm input[type="search"] {
        padding-left: 45px;
        padding-right: 150px
    }

.dividerText::before,
.dividerText::after {
    content: "";
    width: 70px;
    background: rgba(var(--colorNeroRGB), .15);
    height: 2px;
    display: inline-block;
    vertical-align: middle
}

.dividerText::before {
    margin-right: 15px
}

.dividerText::after {
    margin-left: 15px
}

.reportSearchType .form-check:last-child {
    margin-left: -1px
}

.reportSearchType input:checked + label,
.reportSearchType input + label:hover {
    border-color: var(--colorBlue) !important;
    background: var(--colorAliceBlue) !important;
    color: var(--colorBlue) !important
}

.reportSearchDropdown {
    width: 18.7%
}

.reportSearchType {
    width: 33%
}

.reportSearchDate {
    width: 25%
}

    .reportSearchDate #selectStartDate {
        padding-left: 32px
    }

    .reportSearchDate #selectEndDate {
        margin-left: -1px;
        padding-left: 32px
    }

    .reportSearchDate .form-control:focus {
        z-index: 0
    }

    .reportSearchDate .bi.bi-calendar-week {
        height: 21px;
        left: 10px;
        pointer-events: none;
        z-index: 1
    }

    .reportSearchDate span {
        left: 117px;
        height: 15px;
        line-height: 14px;
        color: var(--colorNero)
    }

.reportSearchForm {
    margin-bottom: -100px
}

.findReportBottom {
    padding-top: 125px
}

.tableFirstCol {
    width: 110px
}

.tableFourthCol {
    width: 110px
}

.tableFifthCol {
    width: 110px
}

.tablelastCol {
    width: 80px
}

.reportSearchDate .bi.bi-calendar-week.EndDateIcon {
    left: 144px
}

aside.rightSide .card .customList {
    max-height: 450px
}

aside.rightSide .card ol {
    font-size: 14px
}

.singlePageContent strong {
    font-weight: 400;
    display: block;
    margin-bottom: 10px
}

    .singlePageContent strong:not(.text-primary) {
        font-weight: 700
    }

.singlePageContent table th[scope="col"] {
    color: var(--colorBlue);
    font-weight: 400
}

.newsletterSection {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover
}

.videoCoverageSection .nav-pills {
    width: 35.33%
}

.videoCoverageTabsBtn button img {
    width: 130px;
    height: auto
}

.videoCoverageContent {
    width: calc(100% - 145px)
}

.nav-pills .videoCoverageTabsBtn .nav-link.active,
.nav-pills .videoCoverageTabsBtn .show > .nav-link,
.nav-pills .videoCoverageTabsBtn .nav-link:hover {
    color: var(--colorBlue)
}

.videoCoverageTabsBtn h3.fs-6 {
    font-size: 0.95rem !important
}

.nav-pills .videoCoverageTabsBtn .nav-link:first-child {
    padding-top: 0px !important
}

.eventsTabs .card-body h3 {
    min-height: 150px
}

.mainContent .photoGallery .slick-slide img {
    height: 500px
}

.mainContent .photoGallery .slick-dots {
    bottom: 15px
}

.customListIcon li::before,
.customListIcon li::after {
    position: absolute;
    left: 0;
    content: "";
    top: 6px;
    bottom: 0;
    height: 15px
}

.customListIcon li::before {
    border-left: 8px solid var(--colorMango);
    border-top: 8px solid #fff0;
    border-bottom: 8px solid #fff0
}

.customListIcon li::after {
    content: "\f105";
    color: var(--colorBlue);
    font-family: 'FontAwesome';
    font-size: 25px;
    left: 6px;
    line-height: 15px
}

.customListIcon li:not(:last-child) {
    margin-bottom: 8px
}

.lifeCsrSection p {
    min-height: 85px
}

.icraGroupSection .card p {
    min-height: 252px;
    font-size:16px;
}

.commonTabsWrap h3 {
    min-height: 60px
}

.commonTabsWrap .nav-pills .nav-link.active,
.commonTabsWrap .nav-pills .show > .nav-link,
.commonTabsWrap .nav-pills .nav-link:hover {
    color: var(--colorMango)
}

.commonTabsWrap .nav-pills .nav-link {
    color: var(--bs-white)
}

.leaderShipSection .tab-content .tab-pane {
    scrollbar-color: var(--bs-white) rgba(var(--colorDimGreyRGB), .25)
}

.leaderShipSection ::-webkit-scrollbar-thumb {
    background: var(--bs-white)
}

.leaderShipSection .tab-content p {
    font-size: 13px;
    min-height: 50px
}

.icraGroupSection .card img {
    height: 60px;
    width: 130px;
    object-fit: contain;
}

.mainContent .accordion-button::after {
    content: '\F64D';
    font-family: "bootstrap-icons";
    background: none !important;
    font-size: 18px;
    padding-left: 3px
}

.mainContent .accordion-button:not(.collapsed)::after {
    content: '\F659';
    font-size: 16px;
    padding-right: 3px;
    padding-left: 0
}

.mainContent .accordion-button:not(.collapsed) {
    color: var(--colorBlue)
}

.mainContent .accordion-body p:last-child {
    margin-bottom: 0
}

.mainContent .announcementsSection .accordion-button:not(.collapsed) {
    border-bottom: 0 !important
}

.contactAddress ul li i.fa {
    top: 5px
}

.contactAddress ul li:not(:last-child) {
    margin-bottom: 5px;
    min-height: 85px
}

.contactSectionFirst .accordion strong + p {
    min-height: 56px
}

.mainContent .accordion-button:not(.collapsed) {
    border-bottom: 1px solid rgba(var(--colorNeroRGB), .15) !important
}

.form-select.is-valid:not([multiple]):not([size]),
.form-select.is-valid:not([multiple])[size="1"],
.was-validated .form-select:valid:not([multiple]):not([size]),
.was-validated .form-select:valid:not([multiple])[size="1"] {
    --bs-form-select-bg-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23ffffff' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e")
}

.form-control.is-invalid,
.was-validated .form-control:invalid {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23ffffff'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ffffff' stroke='none'/%3e%3c/svg%3e")
}

.form-select.is-invalid:not([multiple]):not([size]),
.form-select.is-invalid:not([multiple])[size="1"],
.was-validated .form-select:invalid:not([multiple]):not([size]),
.was-validated .form-select:invalid:not([multiple])[size="1"] {
    --bs-form-select-bg-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23ffffff'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ffffff' stroke='none'/%3e%3c/svg%3e")
}

.form-control.is-valid,
.was-validated .form-control:valid {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23ffffff' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e")
}

.invalid-feedback {
    color: var(--bs-white);
    font-size: 12px
}

textarea.form-control.is-valid,
.was-validated textarea.form-control:valid {
    background: #fff0
}

.hamburgerIcon {
    width: 24px;
    height: 20px
}

    .hamburgerIcon span {
        width: 100%;
        height: 3px;
        background: var(--bs-black);
        border-radius: 10px
    }

        .hamburgerIcon span::before,
        .hamburgerIcon span::after {
            width: 100%;
            height: 3px;
            background: var(--bs-black);
            content: "";
            position: absolute;
            border-radius: 4px;
            border-radius: 10px
        }

        .hamburgerIcon span::before {
            top: -8px;
            bottom: auto
        }

        .hamburgerIcon span::after {
            bottom: -8px;
            top: auto
        }

.btn-warning:hover {
    color: #212529 !important;
    background-color: #e0a800;
    border-color: #d39e00
}

.readmorebtn {
    position: absolute;
    bottom: 20px
}

.equal-height {
    height: 100%
}

.close {
    position: absolute;
    right: 10px;
    top: 5px;
    border-radius: 15px;
    background: #fff;
    color: #393939;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    width: 30px;
    height: 30px;
    font-size: 25px;
    padding-bottom: 5px;
    border: none;
}

.close {
    float: right;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: .5;
}

.bootbox-close-button.close {
    margin-top: 0px !important
}

.slick-track {
    display: flex !important
}

.mainContent .slick-slide {
    height: inherit !important
}

.nonRatingThumbSlider .mainContent .linkBlue {
    position: absolute !important;
    bottom: 15px !important
}

.nonRatingThumbSlider .linkBlue i {
    color: var(--colorBlue) !important
}

.customList .bi-cart3 {
    color: #000 !important
}

.webinarwrap h3 a {
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal
}

#FormSubmitBtn.btn-outline-primary:hover i {
    color: var(--colorBlue) !important
}

#FormSubmitBtn.btn-outline-primary i {
    color: #fff !important
}

.wrapper_globe {
    position: relative;
    max-width: 1200px
}

    .wrapper_globe .icon_arrow {
        position: absolute;
        top: 0;
        height: 100%;
        width: 65px;
        display: flex;
        align-items: center
    }

.icon_arrow i {
    cursor: pointer;
    font-size: 24px;
    text-align: center;
    line-height: 47px;
    color: #0028a0;
    background-color: #0000
}

    .icon_arrow i:hover {
        color: #0028a0
    }

.icon_arrow:first-child i {
    margin-left: 0
}

.icon_arrow:last-child i {
    margin-right: 0
}

.wrapper_globe .tabs-box {
    display: flex;
    gap: 12px;
    list-style: none;
    overflow-x: hidden;
    scroll-behavior: smooth
}

.icon_arrow:first-child {
    left: 0;
    display: none;
    background: linear-gradient(90deg,#fff 50%,transparent);
    display: none
}

.icon_arrow:last-child {
    right: 0;
    justify-content: flex-end;
    background: linear-gradient(-90deg,#fff 50%,transparent);
    display: none
}

.tabs-box.dragging {
    scroll-behavior: auto;
    cursor: grab
}

.tabs-box .tab {
    color: #0028a0;
    border-bottom: 3px solid #ffc832;
    cursor: pointer;
    padding: 14px 16px;
    transition: 0.3s;
    font-size: 17px;
    white-space: nowrap;
    width: 216px;
    background-color: #fff
}

.tabs-box.dragging .tab {
    user-select: none;
    pointer-events: none
}

.tabs-box .tab.active {
    background-color: #0028a0;
    color: #fff;
    border-bottom: 3px solid #ffc832;
    border-radius: 5px
}

.tabs-box .tab:hover {
    background-color: #0028a0;
    color: #fff;
    border-bottom: 3px solid #ffc832;
    border-radius: 5px
}

.wrapper_globeIndex {
    position: relative;
    max-width: 1200px
}

    .wrapper_globeIndex .icon_arrowIndex {
        position: absolute;
        top: 0;
        height: 100%;
        width: 65px;
        display: none;
        align-items: center
    }

.icon_arrowIndex i {
    cursor: pointer;
    font-size: 24px;
    text-align: center;
    line-height: 47px;
    color: #0028a0;
    background-color: #0000
}

    .icon_arrowIndex i:hover {
        color: #0028a0
    }

.icon_arrowIndex:first-child i {
    margin-left: 0
}

.icon_arrowIndex:last-child i {
    margin-right: 0
}

.wrapper_globeIndex .tabs-boxIndex {
    display: flex;
    gap: 12px;
    list-style: none;
    overflow-x: hidden;
    scroll-behavior: smooth
}

.icon_arrowIndex:first-child {
    left: 0;
    display: none;
    background: linear-gradient(90deg,#fff 50%,transparent);
    display: none;
}

.icon_arrowIndex:last-child {
    right: 0;
    justify-content: flex-end;
    background: linear-gradient(-90deg,#fff 50%,transparent);
    display: none;
}

.tabs-boxIndex.dragging {
    scroll-behavior: auto;
    cursor: grab;
}

button.tabIndex {
    border: none;
}

.tabs-boxIndex .tabIndex {
    color: #0028a0;
    border-bottom: 3px solid #ffc832;
    cursor: pointer;
    padding: 14px 16px;
    transition: 0.3s;
    font-size: 17px;
    white-space: nowrap;
    width: 100%;
    height: 100%;
    line-height: 1;
    background-color: #fff;
}

.webinarwrap p {
    color: #fff !important;
}

.tabs-boxIndex.dragging .tabIndex {
    user-select: none;
    pointer-events: none;
}

.tabs-boxIndex .tabIndex.active {
    background-color: #0028a0;
    color: #fff;
    border-bottom: 3px solid #ffc832;
    border-radius: 5px;
}

.tabs-boxIndex .tabIndex:hover {
    background-color: #0028a0;
    color: #fff;
    border-bottom: 3px solid #ffc832;
    border-radius: 5px;
}

.globalsearch_webinar_p {
    text-decoration: none;
}

.rv_more {
    text-decoration: none;
}

.headerCart a {
    color: #000 !important;
}

.close {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: .5;
}

.bootbox .modal-footer {
    justify-content: center;
}

.ui-autocomplete .ui-menu-item:hover {
    background: #0028A0;
}

.textNero {
    color: var(--colorNero);
}

@media screen and (max-width:1360px) {
    .button {
        font-size: 14px !important
    }
}

@media screen and (max-width:1199px) {
    .mainNavigation ul li.list-inline-item {
        margin-right: 0
    }

    .closeAnnouncement {
        right: 8px
    }

    .socialLinks {
        gap: 7px
    }

    .sliderTitle.fs-1 {
        font-size: 1.9rem !important
    }

    .newsMediaSection .w-50 {
        width: 75% !important
    }

    .videoCoverageSection .nav-pills {
        width: 54%
    }

    .mainContent .photoGallery .slick-slide img {
        height: 450px
    }
}

@media screen and (min-width:992px) and (max-width:1199px) {
    .mainContent .slick-arrow.slick-prev {
        left: -22px
    }

    .mainContent .slick-arrow.slick-next {
        right: -22px
    }

    .contactSectionThird.contactAddress ul li:not(:last-child) {
        min-height: 112px
    }

    .icraGroupSection .card p {
        min-height: 310px
    }

    .reseachReportThumbSlider h3 {
        min-height: 70px
    }

    .reportSearchDropdown {
        width: 15.7%
    }

    .reportSearchType {
        width: 38%
    }

    .reportSearchForm .form-select,
    .reportSearchForm .form-check-label,
    .reportSearchForm .form-control {
        font-size: .95rem
    }

    .reportSearchDate .bi.bi-calendar-week.EndDateIcon {
        left: 122px
    }
}

@media screen and (max-width:991px) {
    .mainHeader,
    .mainContent,
    .mainFooter {
        font-size: 14px
    }
    .icon_arrowIndex:first-child {
        left: 0;
        display: none;
        background: linear-gradient(90deg, #fff 15%, transparent);
        display: block;
    }
    .wrapper_globeIndex .icon_arrowIndex {
        position: absolute;
        top: 0;
        height: 100%;
        width: 65px;
        display: block;
        align-items: center
    }
    #backToTop {
        box-shadow: 0 2px 8px 0 rgba(var(--colorBlackRGB), .25)
    }

        #backToTop .bi {
            box-shadow: 0 0 0 3px var(--colorMango);
            font-size: 0.9rem !important;
            height: 30px;
            width: 30px
        }

    .esgRatingText {
        max-width: 100%
    }

    .mainContent .leftRightArrow .slick-arrow {
        top: auto;
        bottom: -50px
    }

        .mainContent .leftRightArrow .slick-arrow.slick-prev {
            left: -55px;
            right: 0
        }

        .mainContent .leftRightArrow .slick-arrow.slick-next {
            left: 0;
            right: -55px
        }

    .webinarsTabs .nav,
    .commonTabsWrap .nav {
        width: 100%
    }

    .webinarTabsBtn .nav-link::after,
    .webinarTabsBtn .nav-link.active::after,
    .webinarTabsBtn .nav-link:hover::after {
        display: none !important
    }

    .webinarTabsBtn .nav-link:not(:last-child) {
        margin-bottom: 0;
        margin-right: 20px
    }

    .webinarsTabs .nav-pills .nav-link,
    .commonTabsWrap .nav-pills .nav-link {
        border-bottom: 2px solid #fff0
    }

        .webinarsTabs .nav-pills .nav-link.active,
        .webinarsTabs .nav-pills .nav-link:hover {
            border-bottom-color: var(--colorBlue)
        }

        .commonTabsWrap .nav-pills .nav-link.active,
        .commonTabsWrap .nav-pills .nav-link:hover {
            border-bottom-color: var(--bs-white)
        }

    .fs-5 {
        font-size: 1.15rem !important
    }

    .sliderTitle.fs-1 {
        font-size: 1.5rem !important
    }

    .megaMenu h2.fs-4 {
        font-size: 1.25rem !important
    }

    .megaMenu h3.fs-5 {
        font-size: 1rem !important;
        min-height: 38px
    }

    .pageBanner {
        min-height: 250px
    }

    .pageBannerContent {
        max-width: 80%;
        width: 80% !important
    }

    .contactSectionThird.contactAddress ul li:not(:last-child) {
        min-height: 112px
    }

    .newsMediaSection .w-50 {
        width: 100% !important
    }

    .videoCoverageTabs {
        flex-wrap: wrap
    }

    .videoCoverageSection .nav-pills {
        width: 100%
    }

    .nav-pills .videoCoverageTabsBtn {
        gap: 0 15px;
        border-top: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important
    }

        .nav-pills .videoCoverageTabsBtn .nav-link {
            padding: 0px !important
        }

            .nav-pills .videoCoverageTabsBtn .nav-link img {
                width: 100%
            }

    .mainContent .topRightArrow .slick-arrow {
        top: auto;
        bottom: -50px
    }

        .mainContent .topRightArrow .slick-arrow.slick-prev {
            left: -55px;
            right: 0
        }

        .mainContent .topRightArrow .slick-arrow.slick-next {
            left: 0;
            right: -55px
        }

    .reportSearchDropdown,
    .reportSearchType,
    .reportSearchDate {
        width: 48.7%
    }

        .reportSearchType label {
            padding-left: 0.2rem !important;
            padding-right: 0.2rem !important
        }

    .mainContent .photoGallery .slick-slide img {
        height: 400px
    }
}

@media screen and (min-width:768px) and (max-width:991px) {
    .customTable {
        overflow-x: scroll !important
    }

    .mainNavigation > ul > li > a {
        padding: 7px 5px;
        font-size: 13px
    }

        .mainNavigation > ul > li > a.lightBtn {
            padding: 7px 8px !important
        }

    .headerlogin .btn.btn-primary {
        padding-top: 2px !important;
        padding-bottom: 2px !important
    }

    .contactSectionFirst .accordion strong + p {
        min-height: 73px
    }

    .icraGroupSection .card p {
        min-height: 150px
    }

    .reportSearchDate .bi.bi-calendar-week.EndDateIcon {
        left: 170px
    }
}

@media screen and (max-width:767px) {
    .footerBottom ul li:not(:last-child) {
        margin-left: .5rem
    }

    .esgRatingSection img {
        max-width: 200px
    }

    .sliderTitle.fs-1 {
        font-size: 1.1rem !important
    }

    .mainContent .mainSlider .slick-dots {
        bottom: 10px
    }

    .announcementSection .container {
        padding-left: 0;
        padding-right: 0;
        width: 100%;
        max-width: 100%
    }

    .motion-ready .announcementList ul {
        animation: scrollLeft 15s linear infinite
    }

    .pageBannerContent {
        max-width: 100%;
        width: 100% !important
    }

    .contactSectionSecond .border-start {
        border-left: 0px !important
    }

        .contactSectionSecond .border-start:first-child ul {
            border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
            padding-bottom: 1.5rem !important
        }

    .contactSectionSecond.contactAddress ul li:not(:last-child) {
        min-height: 40px
    }

    .profileJoin iframe {
        height: 270px
    }

    .lifeCsrSection p {
        min-height: 25px
    }

    .icraGroupSection .card p {
        min-height: 200px
    }

    .videoCoverageTabs iframe {
        height: 270px
    }

    .reportSearchDropdown,
    .reportSearchType,
    .reportSearchDate {
        width: 100%
    }

    .tableSecondCol {
        width: 200px
    }

    .customTable table {
        width: 700px
    }

    .mainNavigation {
        position: absolute;
        left: 0;
        right: 0;
        top: 100%;
        background: var(--bs-white);
        height: 100vh;
        z-index: 1;
        box-shadow: 0 1px 10px 0 rgba(var(--colorBlackRGB), .15);
        overflow-y: auto;
        max-height: calc(100vh - 90px);
        overflow-x: hidden
    }

        .mainNavigation ul > li {
            display: block;
            position: relative;
            padding: 0 12px
        }

            .mainNavigation ul > li > a i.bi {
                transform: rotate(-90deg);
                float: right
            }

                .mainNavigation ul > li > a i.bi::before {
                    font-weight: 600 !important
                }

        .mainNavigation > ul > li:hover .megaMenuWrap {
            display: none
        }

        .mainNavigation .megaMenu {
            border: none !important;
            box-shadow: none;
            background: transparent !important;
            padding-left: 0 !important;
            padding-right: 0px !important
        }

    .showSubMobileMenu .megaMenuWrap {
        display: block !important;
        position: relative !important;
        max-width: 100% !important
    }

    .hamburgerIcon.closeHamburgerIcon span {
        background: var(--bs-white)
    }

        .hamburgerIcon.closeHamburgerIcon span::before,
        .hamburgerIcon.closeHamburgerIcon span::after {
            top: 0
        }

        .hamburgerIcon.closeHamburgerIcon span::before {
            transform: rotate(-45deg)
        }

        .hamburgerIcon.closeHamburgerIcon span::after {
            transform: rotate(45deg)
        }

    .mainNavigation ul li.showSubMobileMenu i.bi {
        transform: rotate(0deg)
    }

    .megaMenuMedia::before {
        width: 100%;
        height: 42%
    }

    .mainNavigation > ul > li > a {
        padding-left: 0;
        padding-right: 0
    }

    .mainNavigation > ul > li.showSubMobileMenu > a {
        border-bottom: 1px solid rgba(var(--colorNeroRGB), .15)
    }

    .mainHeader .container {
        max-width: 100%
    }

    .researchMenu {
        border-top: 1px solid rgba(var(--colorNeroRGB), .15)
    }

    .showSubMobileMenu {
        background: #f6f6f6
    }

    .mainNavigation ul li.list-inline-item .container {
        padding: 0
    }

    .megaMenu .menuIconList {
        margin-left: 0;
        margin-right: 0
    }

        .megaMenu .menuIconList img {
            width: 16px
        }

    .menuIconList.menuIconListAbout li,
    .menuIconList li a {
        padding-left: 1.6rem !important
    }

        .menuIconList.menuIconListAbout li a,
        .menuIconList li a {
            font-size: 0.875rem !important;
            font-weight: 700 !important
        }

    .megaMenu h3.fs-5 {
        min-height: 20px
    }

    .menuFooter {
        padding-left: 12px;
        padding-right: 12px;
        margin-left: -12px;
        border-radius: 0px !important;
        margin-right: -12px
    }

    .megaMenu .menuFooter h4.fs-5 {
        font-size: 1rem !important;
        line-height: 38px
    }

    .headerSearchForm {
        width: 290px
    }

    .megaMenu .customList li a,
    .megaMenu .dateMeta,
    .megaMenu .fs-6 {
        font-size: 0.875rem !important
    }

    .mainContent .photoGallery .slick-slide img {
        height: 300px
    }

    .popup_con figure {
        display: flex;
        flex-direction: column;
        width: 97%;
    }
}

@media screen and (min-width:576px) and (max-width:767px) {
    .customTable {
        overflow-x: scroll !important
    }

    .reseachReportThumbSlider h3 {
        min-height: 70px
    }

        .reseachReportThumbSlider h3 + p {
            min-height: 50px
        }

    .reportSearchDate .bi.bi-calendar-week.EndDateIcon {
        left: 251px
    }
}

@media screen and (max-width:575px) {
    .customTable {
        overflow-x: scroll !important
    }

    .footerGetinTouch .form-switch span {
        width: 100%
    }

    .footerGetinTouch .form-switch label {
        width: 79%
    }

    .fs-5 {
        font-size: 1.05rem !important
    }

    .fs-4 {
        font-size: 1.275rem !important
    }

    .mainContent .mainSlider .slick-slide img {
        min-height: 210px
    }

    .announcementTitle {
        font-size: 13px
    }

    .announcementControls {
        top: 0
    }

    .announcementList::after {
        width: 23px
    }

    .closeAnnouncement {
        height: 17px
    }

    .contactSectionThird.contactAddress ul li:not(:last-child) {
        min-height: auto;
        margin-bottom: 10px
    }

    .profileJoin iframe {
        height: 220px
    }

    .icraGroupSection .card p {
        min-height: 40px
    }

    .mediaInnerControls + h3 {
        min-height: 40px
    }

    .videoCoverageTabs iframe {
        height: 220px
    }

    .toggleLabel {
        font-size: 12px;
        border-bottom: 1px solid #fff0;
        padding: 0 0 10px
    }

        .toggleLabel.active {
            font-size: 12px;
            border-bottom-color: var(--bs-white);
            padding: 0 0 10px
        }

    .mainContent .photoGallery .slick-slide img {
        height: 250px
    }

    .reportSearchDate .bi.bi-calendar-week {
        height: 18px;
        top: 10px !important;
        margin: 0 !important
    }

    .reportSearchDate.d-flex {
        display: block !important
    }

    .reportSearchDate input.w-50 {
        width: 100% !important;
        border-radius: var(--bs-border-radius) !important
    }

    .reportSearchDate #selectStartDate {
        margin-bottom: 1rem !important
    }

    .reportSearchDate .bi.bi-calendar-week.EndDateIcon {
        top: 64px !important;
        left: 10px
    }

    .footerTop img {
        width: 50% !important;
    }
}

@media screen and (max-width:479px) {
    .contactHeader {
        font-size: 13px
    }

        .contactHeader i.fa {
            display: none
        }

    .contactSectionFirst .accordion strong + p {
        min-height: 70px;
        margin-bottom: 5px;
        font-size: 13px
    }

    .mainContent a.mail {
        font-size: 12.5px
    }

    .reportSearchForm .bi-search {
        top: 17px !important;
        bottom: auto !important
    }

    .reportSearchForm input[type="search"] {
        padding-right: 30px
    }

        .reportSearchForm input[type="search"] + button {
            position: relative !important;
            width: 100%;
            margin-top: 15px !important;
            border-radius: var(--bs-border-radius) !important;
            height: 38px
        }

    .headerSearchForm {
        width: 270px
    }

    #CPRSearchButtonNew {
        width: 100%;
        border-radius: 6px !important;
        padding-left: 0px !important;
        position: relative !important;
        margin-top: 20px !important;
        padding-right: 0px !important
    }

    #Entityautocombox1 {
        background-color: #fff;
        border: none !important
    }

    #searchInputCPR {
        width: 100%;
        font-size: 12px
    }

    .reportSearchForm .bi-search {
        top: 11px !important;
        bottom: auto !important
    }

    #CPRSearchButtonNew:focus-visible {
        background: #0028a0 !important
    }

    .desk_hld .links_con img {
        width: 16px !important
    }

    .desk_hld .links_con a {
        font-size: 11px !important;
        line-height: 24px;
        padding: 5px
    }

    .brandLogo img {
        width: 100px;
        height: auto
    }

    .button span {
        font-size: 13px
    }

    .linkNero1 {
        color: black;
        height: 105px;
        line-height: 1.5;
        font-size:13px;
    }
}

@media screen and (max-width:420px) {
    .leaderShipSection .tab-content p {
        min-height: 70px
    }

    .contactHeader li {
        width: 56%;
        word-wrap: break-word;
        font-size: 11px;
        text-align: end
    }

        .contactHeader li:first-child {
            width: 44%;
            margin-right: 5px;
            text-align: start
        }

    .headerUser.gap-3 {
        gap: 10px !important
    }

    .headerSearchForm {
        right: -100px
    }

        .headerSearchForm form::before {
            right: 98px
        }

    .desk_hld .links_con img {
        width: 16px !important
    }

    .desk_hld .links_con a {
        font-size: 11px !important;
        line-height: 24px;
        padding: 5px
    }

    .brandLogo img {
        width: 100px;
        height: auto
    }

    .button span {
        font-size: 13px
    }
}
.close {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: .5;
    border:none;
    margin:0 !important;
}
.footerTop img{
    width:fit-content;
}


@media screen and (max-width:400px) {
    .mainContent a.mail {
        font-size: 12px
    }
}
@media screen and (max-width:390px) {
    .mainContent a.mail {
        font-size: 12px
    }
    .linkNero1{
        font-size:12px;
    }
}

    @media screen and (min-width:1199px) {
        .modal-dialog {
            max-width: 500px
        }

        .contactSectionSecond ul {
            max-width: 260px
        }

        .mainSlider .slick-slide img {
            height: calc(100vh - 150px)
        }
    }

    @media screen and (min-width:1400px) {
        .reportSearchDate .bi.bi-calendar-week.EndDateIcon {
            left: 166px
        }
    }

    @media screen and (min-width:1900px) {
        .container {
            max-width: 100%;
            width: 1360px
        }

        .mainSlider .slick-slide img {
            height: calc(100vh - 360px)
        }

        .mainHeader, .mainContent, .mainFooter {
            font-size: 18px !important
        }

            .mainContent p {
                line-height: 30px
            }

        .fs-1 {
            font-size: 40px !important
        }

        .fs-3 {
            font-size: 30px !important
        }

        .btn {
            font-size: 18px !important
        }

        .mainNavigation > ul > li > a, .megaMenu .fs-6, .megaMenu .menuLinkAb, .fs-6 {
            font-size: 18px !important
        }

        .contactHeader, .menuIconList {
            font-size: 18px !important
        }

        .announcementTitle {
            padding-right: 1rem !important;
            padding-left: 1rem !important
        }

        .announcementList {
            width: calc(100% - 285px)
        }

        .closeAnnouncement {
            height: 28px
        }

        .announcementList ul {
            font-size: 18px !important
        }

        .megaMenu .fs-4 {
            font-size: 30px !important
        }

        .menuIconList li .menuIcon1, .menuIconList li .menuIcon2 {
            top: 4px !important
        }

        .megaMenu .fs-5, .fs-5 {
            font-size: 20px !important
        }

        .dateMeta {
            font-size: 18px !important
        }

        .mb-2 {
            margin-bottom: 1rem !important
        }

        .mt-2 {
            margin-top: 1rem !important
        }

        .mb-3 {
            margin-bottom: 1.5rem !important
        }

        .mb-4 {
            margin-bottom: 2.5rem !important
        }

        .ps-4 {
            padding-left: 2.5rem !important
        }

        .py-3 {
            padding-top: 1.5rem !important;
            padding-bottom: 1.5rem !important
        }

        .p-3 {
            padding: 1.5rem !important
        }

        .gap-3 {
            gap: 1.5rem !important
        }

        .headerSearchForm {
            width: 735px
        }

            .headerSearchForm button {
                height: 30px
            }

        .headerlogin i.bi {
            vertical-align: baseline !important
        }

        .menuFooter a.btn {
            height: 50px;
            line-height: 32px !important
        }

        .menuFooter {
            padding-top: 25px !important;
            padding-bottom: 25px !important
        }

        .customList .list-group-item.py-2:first-child {
            padding-top: 0px !important
        }

        .customList .list-group-item.py-2 {
            padding-top: 1rem !important;
            padding-bottom: 1rem !important
        }

        .sliderTitle.mb-4 {
            margin-bottom: 2.5rem !important
        }

        .sliderSubTitle.mb-4 {
            margin-bottom: 2.5rem !important;
            font-size: 22px !important;
            line-height: 34px
        }

        p {
            margin-bottom: 2rem
        }

        .threeColumnsIcons .contentBox figcaption {
            min-height: 80px
        }

        .btnwithIconImg img {
            vertical-align: baseline
        }

        .rightSide .customList .fs-6 {
            font-size: 18px !important
        }

        .viewAllLinkBox .fs-4 {
            font-size: 26px !important
        }

        .listIcon {
            width: 35px;
            height: 35px;
            font-size: 18px
        }

        .sectionTitle h2.fs-5, .cprSection h3.fs-5 {
            font-size: 30px !important
        }

        .videoBorder iframe {
            height: 330px
        }

        .webinarTabsBtn .nav-link:not(:last-child) {
            margin-bottom: 30px
        }

        .pe-lg-4 {
            padding-right: 2.5rem !important
        }

        .card-body h3.fs-5, .card-header.fs-5, .threeColumnSlider h3.fs-5 {
            font-size: 24px !important
        }

        .card-header.fs-5 {
            padding-top: 1rem !important;
            padding-bottom: 1rem !important
        }

        .card-body {
            padding: 1.5rem !important
        }

        .customList h3.fs-6 {
            font-size: 18px !important
        }

        .customList p {
            font-size: 18px !important
        }

        .threeColumnSlider .linkBlue {
            font-size: 18px !important
        }

        .podSection iframe {
            height: 275px
        }

        .toggleTextSwitcher {
            padding-bottom: 1rem
        }

        .form-control, .form-select {
            font-size: 20px
        }

        .footerTop, .footerMiddle {
            font-size: 16px
        }

            .footerTop h2.fs-6, .footerMiddle h2.fs-6, .sectionSubTitle.fs-6 {
                font-size: 18px !important
            }

            .footerTop h2.fs-6 {
                margin-bottom: 0.8rem !important
            }

            .footerTop img {
                width: 170px
            }

        .footerBottom {
            font-size: 14px
        }

        .pageBanner {
            min-height: 500px
        }

            .pageBanner h1.fs-2 {
                font-size: 50px !important
            }

        .researchMenu.py-3 {
            padding-top: 0 !important;
            padding-bottom: 0 !important
        }

        .mainNavigation > ul > li > a {
            padding: 15px 25px
        }

        .roundedThumbnail h3.fs-6 {
            font-size: 18px !important;
            min-height: 100px
        }

        .roundedThumbnail p {
            font-size: 18px !important
        }

        ul.customList {
            max-height: 550px;
            min-height: 550px
        }

        .megaMenu ul.customList {
            max-height: 360px;
            min-height: 360px
        }

        .megaMenu .listIcon {
            width: 25px;
            height: 25px;
            bottom: 15px
        }

        .megaMenu ul.customList li:last-child .listIcon {
            bottom: 15px
        }

        .modal-dialog {
            max-width: 800px
        }

        .subscribeModal .p-4 {
            padding: 2.5rem !important
        }

        .subscribeModal ul li {
            font-size: 18px
        }

            .subscribeModal ul li strong {
                margin-bottom: 5px
            }

            .subscribeModal ul li:last-child {
                padding-top: 20px
            }

        .reportSearchForm .bi-search {
            height: 29px
        }

        .reportSearchForm {
            padding-left: 55px
        }

        .reportSearchFields .btn {
            font-size: 18px !important
        }

        .reportSearchDropdown {
            width: 18.15%
        }

        .reportSearchDate .bi {
            height: 23px;
            font-size: 18px;
            left: 13px
        }

        .reportSearchDate #selectStartDate, .reportSearchDate #selectEndDate {
            padding-left: 40px
        }

        .reportSearchDate .bi.bi-calendar-week.EndDateIcon {
            left: 170px
        }

        .daterangepicker .drp-buttons .btn {
            padding: 5px 20px !important;
            font-size: 16px !important
        }

        .daterangepicker .calendar-table th, .daterangepicker .calendar-table td, .daterangepicker .drp-selected {
            font-size: 16px !important
        }

        .daterangepicker .drp-calendar {
            max-width: 300px !important
        }

        .tableFirstCol {
            width: 200px
        }

        .tableFourthCol {
            width: 180px
        }

        .tableFifthCol {
            width: 150px
        }

        .mainContent .pagination li a {
            width: 40px;
            height: 40px;
            line-height: 40px
        }

        .pagination .nextPrevArrow .btn i.bi {
            height: 24px;
            line-height: 24px
        }

        .mainContent .breadcrumb-item + .breadcrumb-item::before {
            font-size: 16px
        }

        .singlePageMeta, .singlePageMeta .btn {
            font-size: 18px !important
        }

        .table-responsive + p {
            line-height: 24px;
            font-size: 16px
        }

            .table-responsive + p small {
                font-size: 16px
            }

        aside.rightSide .card ol {
            font-size: 18px
        }

        aside.rightSide .card .customList {
            max-height: 670px;
            min-height: 670px
        }

        .accordion-button {
            font-size: 24px;
            padding-top: 1.5rem !important;
            padding-bottom: 1.5rem !important
        }

        .mainContent .accordion-button:not(.collapsed)::after {
            font-size: 18px
        }

        .mainContent .accordion-button::after {
            font-size: 18px;
            padding-left: 0
        }

        .contactTopInfo h3.fs-6 {
            font-size: 18px !important
        }

        .pageBannerBlueText .pageBannerContent {
            max-width: 50%
        }

        .aboutRatingFactorSection .card-header.fs-5 {
            font-size: 40px !important
        }

            .aboutRatingFactorSection .card-header.fs-5 + p.px-3 {
                padding-left: 1.5rem !important;
                padding-right: 1.5rem !important
            }

        .leaderShipSection .tab-content p {
            font-size: 18px;
            min-height: 85px;
            line-height: 28px
        }

        .icraGroupSection .card p {
            min-height: 390px
        }

        .lifeCsrSection p {
            min-height: 120px
        }

        .gap-2 {
            gap: 1rem !important
        }

        ul.customList.listMaxHeight200 {
            max-height: 300px;
            min-height: 300px
        }

        .videoCoverageTabsBtn h3.fs-6 {
            font-size: 18px !important
        }

        .videoCoverageTabsBtn button img {
            width: 200px
        }

        .videoCoverageContent {
            width: calc(100% - 220px)
        }

        .videoCoverageSection .nav-pills {
            width: 38.33%
        }

        .videoCoverageTabs iframe {
            height: auto;
        }

        .eventsTabs .card-body h3 {
            min-height: 250px
        }

        .mainContent .photoGallery .slick-dots {
            bottom: 0
        }

        .contactAddress ul li a.ps-4 {
            padding-left: 1.8rem !important
        }

        .contactAddress ul li i.fa {
            top: 8px
        }

        .contactSectionFirst .accordion strong + p {
            margin-bottom: .5rem;
            width: 85%
        }

        .contactAddress ul li:not(:last-child) {
            min-height: 95px
        }
    }

    .testcl {
    }
}

/* ===================================================================
   IAAP accessibility fixes (audit points 8 & 10)
   =================================================================== */

/* Point 100 / 31 - White banner text sits over background videos/images whose light
   frames drop contrast below 4.5:1. A dark scrim between the media and the text
   guarantees legible white text without changing the design (WCAG 1.4.3). */
.pageBanner.text-white {
    position: relative;
    /* Inset box-shadow — rather than an absolutely-positioned ::before with inset:0 —
       keeps the dark scrim clipped to the banner's own box even when the banner is not
       a positioning context. An escaped inset:0 pseudo-element otherwise stretches to
       the nearest positioned ancestor (#wrapper) and washes the entire page content. */
    box-shadow: inset 0 0 0 9999px rgba(0, 12, 40, 0.45);
}

/* Point 13 - "Skip to main content" link. Hidden until it receives keyboard
   focus, then shown as a prominent control at the top-left (WCAG 2.4.1). */
.skip-to-main {
    position: absolute;
    left: 8px;
    top: 8px;
    z-index: 1080;
    display: inline-block;
    padding: 8px 16px;
    background: #0028A0;
    color: #fff !important;
    border-radius: 4px;
    text-decoration: none;
}
.skip-to-main:not(:focus):not(:focus-within) {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Point 8 - Visible, high-contrast focus indicator for keyboard users
   (WCAG 1.4.11 Non-text Contrast). Bootstrap sets outline:0 on .btn, leaving
   only a low-contrast (~1.8:1) box-shadow. A solid #0028A0 (ICRA navy) outline
   on the white header ~= 12:1, well above the 3:1 requirement. :focus-visible
   keeps this to keyboard focus only, so mouse clicks are unaffected. */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
[tabindex]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 3px solid #0028A0 !important;
    outline-offset: 2px !important;
}

/* Point 65 - On dark / navy surfaces the navy focus outline above is invisible. Use a
   gold outline there (gold on navy ~= 6:1) so keyboard focus stays visible. Covers the
   leadership tabs, the contact form and other white-on-dark controls. */
.text-white a:focus-visible,
.text-white button:focus-visible,
.bg-primary a:focus-visible,
.bg-primary button:focus-visible,
.bg-primary input:focus-visible,
.bg-primary select:focus-visible,
.bg-primary textarea:focus-visible,
#v-pills-tab .nav-link:focus-visible,
.footerGetinTouch a:focus-visible,
.footerGetinTouch button:focus-visible {
    outline: 3px solid #FFC832 !important;
    outline-offset: 2px !important;
}

/* Point 68 - the leadership tabs signalled the selected tab by colour alone. Add an
   underline on the active tab as a non-colour cue (WCAG 1.4.1). */
#v-pills-tab .nav-link.active {
    text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-thickness: 2px;
}

/* Point 215 - links inside the research-report body were distinguished by colour alone.
   Underline them so they are identifiable without relying on colour (WCAG 1.4.1). */
.singlePageContent a {
    text-decoration: underline;
}

/* Point 204 - the Disclaimer 'Terms and Conditions' clauses are now an <ol>; keep the
   original spacing between clauses and their nested paragraphs (WCAG 1.3.1). */
.disclaimer-terms {
    padding-left: 1.5rem;
}
.disclaimer-terms > li {
    margin-bottom: 1rem;
}
.disclaimer-terms > li > p,
.disclaimer-terms > li > ul {
    margin-top: .75rem;
}

/* Point 75/76 - the .tootip_con tooltip (full rationale/report title) only showed on
   mouse hover. Also show it when the link inside receives keyboard focus, and let Esc
   dismiss it (JS adds .tt-dismissed) so it works for keyboard users (WCAG 2.1.1 / 1.4.13).
   (The full title is also the link's accessible name, so screen readers already get it.) */
.rep_det_con:focus-within .tootip_con {
    display: block !important;
}
.rep_det_con.tt-dismissed .tootip_con {
    display: none !important;
}

/* Point 199/203/207 - legacy main.css turns the links on the static content pages gold
   (#ffc832, ~1.5:1) on hover. Keep them navy + underlined on hover/focus for >=4.5:1 and
   so they are not distinguished by colour alone (WCAG 1.4.3 / 1.4.1). */
.other_pages_con a:hover,
.other_pages_con a:focus,
.other_page_data a:hover,
.other_page_data a:focus {
    color: #0028A0 !important;
    text-decoration: underline !important;
}

/* Point 35 - Some download/cart/lock icon links wrap ONLY an absolutely-positioned
   .listIcon, so the <a> itself collapses to 0x0 and its focus ring is invisible. Draw
   the ring on the visible icon instead, and suppress the empty anchor's ring. */
a:focus-visible > .listIcon,
a:focus-visible .listIcon {
    outline: 3px solid #0028A0 !important;
    outline-offset: 2px !important;
    border-radius: 50%;
}
a:has(> .listIcon):focus-visible {
    outline: none !important;
}

/* Point 10 - Search placeholder text contrast (WCAG 1.4.3 Contrast Minimum).
   The placeholder inherited Bootstrap's --bs-secondary-color (~#C2C2C2, ~1.8:1).
   #595959 on white ~= 7:1, above the 4.5:1 requirement for standard text. */
.headerSearchForm input::placeholder,
#searchControlInput::placeholder,
#searchInputCPR::placeholder,
#searchInputResearch::placeholder {
    color: #595959 !important;
    opacity: 1;
}