:root {
    --blue: #0033A0;
    --green: #007672;
    --orange: #ED8B00;
    --grey: #3D3935;
    --lightgrey: #F9F9F8;
    --body: 16px;
    --small: 12px;
    --container-padding-s: 50px;
    --container-padding: 150px;
    --h1:;
    --h2: calc(50px * 0.8);
    --h3: calc(40px * 0.8);
    --h4: calc(25px * 0.8);
    --h5: calc(20px * 0.8);
    --h6: 16px;
    --bs-border-width: 4px;
}

@media (max-width: 1680px) {
    :root {
        --body: 16px;
        --small: 12px;
        --container-padding-s: 50px;
        --container-padding: 150px;
        --h1:;
        --h2: calc(50px * 0.8);
        --h3: calc(40px * 0.8);
        --h4: calc(25px * 0.8);
        --h5: calc(20px * 0.8);
        --h6: 16px;
        --bs-border-width: 4px;
    }
}

.dm-sans {
    font-family: "DM Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: <weight>;
    font-style: normal;
}

.container,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
    max-width: calc(100% - (var(--container-padding) * 2) + var(--bs-gutter-x));
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
}

html {
    overflow-x: hidden;
}

/* Typography */
body,
html {
    font-family: "DM Sans", sans-serif;
    font-size: var(--body);
    line-height: 1.3em;
    color: var(--grey);
    xoverflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}

/* Scroll to 2rem above the target */
:target {
    scroll-margin-top: 120px;
}

p {
    margin-bottom: 20px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0;
    margin-bottom: 20px;
    font-weight: bold;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 400;
}

.bold {
    font-weight: bold;
}

.medium {
    font-weight: 500;
}

h1,
.h1 {
    font-size: var(--h1);
    line-height:;
}

h2,
.h2 {
    font-size: var(--h2);
    line-height: 1.1em;
}

h3,
.h3 {
    font-size: var(--h3);
    line-height: 1.15em;
}

h4,
.h4 {
    font-size: var(--h4);
    line-height: 1.12em;
}

h5,
.h5 {
    font-size: var(--h5);
    line-height:;
}

h6,
.h6 {
    font-size: var(--h6);
    line-height:;
}

.font-25 {
    font-size: var(--h4);
    line-height: 1.12em;
}

small,
.small {
    font-size: var(--small) !important;
    line-height: 1em !important;
}

.btn-default,
.btn,
#submit-btn {
    font-weight: bold;
    color: white;
    background: var(--blue);
    border-radius: 0;
    padding: 7px 30px 7px 15px;
    position: relative;
    border: none !important;
    clip-path: polygon(0 0, 100% 0%, calc(100% - 20px) 100%, 0% 100%);
    line-height: 1;
}

.btn-large {
    padding: 10px 30px 10px 20px;
}

.btn-grey {
    background: var(--grey);
}

.btn-default:hover {
    background: var(--orange) !important;
    color: #fff !important;
}

p:last-child {
    margin-bottom: 0;
}

.ribbon-header {
    font-weight: bold;
    clip-path: polygon(0 0, 100% 0%, calc(100% - 38px) 100%, 0% 100%);
    background: var(--blue);
    padding: 9px 60px 9px 0;
    display: inline-block;
    color: #fff;
    position: relative;
    padding-left: var(--container-padding);
    max-width: 90%;
    text-wrap: pretty;
}

.ribbon-header-large {
    padding: 12px 300px 12px 0;
    padding-left: var(--container-padding);
}

.ribbon-header-green {
    background: var(--green);
}

.ribbon-header-orange {
    background: var(--orange);
}

.ribbon-header-grey {
    background: var(--grey);
}

.translateY-50 {
    transform: translateY(50%);
    margin-top: -50%;
    z-index: 9;
}

a,
a:hover {
    color: inherit;
}

    a:hover {
        color: var(--orange);
    }

.white {
    color: #fff;
}

footer a {
    text-decoration: none;
}

/* END Typography */

/* Start General */
.blue {
    color: var(--blue);
}

.border-blue {
    border-color: var(--blue) !important;
}

.border-green {
    border-color: var(--green) !important;
}

.orange {
    color: var(--orange);
}

.green {
    color: var(--green);
}

.pb-3 {
    padding-bottom: 1.5rem !important;
}

.pt-3 {
    padding-top: 1.5rem !important;
}

.pb-4 {
    padding-bottom: 3rem !important;
}

.pt-4 {
    padding-top: 3rem !important;
}

.mb-3 {
    margin-bottom: 1.5rem !important;
}

.mt-3 {
    margin-top: 1.5rem !important;
}

.mb-4 {
    margin-bottom: 3rem !important;
}

.mt-4 {
    margin-top: 3rem !important;
}

.mb-5 {
    margin-bottom: 5rem !important;
}

.mt-5 {
    margin-top: 5rem !important;
}

.mb-10 {
    margin-bottom: 10px;
}

.mt-10 {
    margin-top: 10px;
}

.ml-20 {
    margin-left: 20px;
}

.pl-20 {
    padding-left: 20px;
}

.pr-20 {
    padding-right: 20px;
}

.pb-20 {
    padding-bottom: 20px;
}

.pt-20 {
    padding-top: 20px;
}

.pb-20i {
    padding-bottom: 20px !important;
}

.pt-20i {
    padding-top: 20px !important;
}

.mb-20 {
    margin-bottom: 20px;
}

.mt-20 {
    margin-top: 20px;
}

.pb-30 {
    padding-bottom: 30px !important;
}

.pt-30 {
    padding-top: 30px !important;
}

.mb-30 {
    margin-bottom: 30px;
}

.mt-30 {
    margin-top: 30px;
}

.pb-40 {
    padding-bottom: 40px !important;
}

.mb-40 {
    margin-bottom: 40px;
}

.mt-40 {
    margin-top: 40px;
}

.pb-50 {
    padding-bottom: 50px;
}

.pt-50 {
    padding-top: 50px;
}

.pl-50 {
    padding-left: 50px;
}

.pr-50 {
    padding-right: 50px;
}

.mb-50 {
    margin-bottom: 50px;
}

.mt-50 {
    margin-top: 50px;
}

.mb-100 {
    margin-bottom: 100px;
}

.mt-100 {
    margin-top: 100px;
}

.pl-100 {
    padding-left: 100px;
}

.pr-100 {
    padding-right: 100px;
}

.mb-150 {
    margin-bottom: 150px;
}

.mt-150 {
    margin-top: 150px;
}

.mb-200 {
    margin-bottom: 200px;
}

.mt-200 {
    margin-top: 200px;
}

.outer-border-blue {
    position: relative;
}

    .outer-border-blue::before {
        content: '';
        width: var(--bs-border-width);
        height: 100%;
        background: var(--blue);
        position: absolute;
        left: -20px;
        top: 0;
    }

.outer-border-green {
    position: relative;
}

    .outer-border-green::before {
        content: '';
        width: var(--bs-border-width);
        height: 100%;
        background: var(--green);
        position: absolute;
        left: -20px;
        top: 0;
    }

.outer-border-orange {
    position: relative;
}

    .outer-border-orange::before {
        content: '';
        width: var(--bs-border-width);
        height: 100%;
        background: var(--orange);
        position: absolute;
        left: -20px;
        top: 0;
    }

.bg-lightgrey {
    background: var(--lightgrey);
}

/* END General */

/* START Header */
header {
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 999;
}

.navbar {
    background: var(--blue);
    padding-left: var(--container-padding-s);
    padding-right: var(--container-padding-s);
    padding-top: 20px;
    padding-bottom: 20px;
}

.navbar-brand {
    padding: 0;
}

    .navbar-brand img {
        height: 58px;
        padding: 7px 0;
    }

.nav-item {
    margin-left: calc(60px - 1rem);
}

.nav-link,
.nav-item,
.nav-link:focus {
    color: #fff;
    font-weight: 500;
}

    .navbar-nav .nav-link.active,
    .navbar-nav .nav-link.show,
    .nav-link:hover {
        color: var(--orange);
    }

    .nav-link:focus,
    .nav-link:active {
        xcolor: inherit;
    }

.dropdown-item.active,
.dropdown-item:active {
    color: var(--bs-dropdown-link-active-color);
    text-decoration: none;
    background-color: var(--orange);
}

.dropdown-toggle::after {
    display: inline-block;
    margin-left: .255em;
    vertical-align: 1px;
    width: 16px;
    height: 10px;
    content: "";
    border: none;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15.311" height="9.47" viewBox="0 0 15.311 9.47"><g id="Arrow" transform="translate(12.807 7.7) rotate(180)"><path id="Path_8" data-name="Path 8" d="M0,0H8.16" transform="translate(-0.736 5.849) rotate(-45)" fill="none" stroke="%23fff" stroke-linecap="round" stroke-width="2.5"/><path id="Path_9" data-name="Path 9" d="M0,.015C.662.015,8.37,0,8.37,0" transform="translate(11.026 5.929) rotate(-135)" fill="none" stroke="%23fff" stroke-linecap="round" stroke-width="2.5"/></g></svg>') no-repeat center center;
    background-size: contain;
    transition: all .15s ease;
    display: none !important;
}

.nav-item.dropdown:hover .dropdown-toggle::after,
.nav-item.dropdown .show.dropdown-toggle::after {
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15.311" height="9.47" viewBox="0 0 15.311 9.47"><g id="Arrow" transform="translate(12.807 7.7) rotate(180)"><path id="Path_8" data-name="Path 8" d="M0,0H8.16" transform="translate(-0.736 5.849) rotate(-45)" fill="none" stroke="%23ED8B00" stroke-linecap="round" stroke-width="2.5"/><path id="Path_9" data-name="Path 9" d="M0,.015C.662.015,8.37,0,8.37,0" transform="translate(11.026 5.929) rotate(-135)" fill="none" stroke="%23ED8B00" stroke-linecap="round" stroke-width="2.5"/></g></svg>') no-repeat center center;
    background-size: contain;
    transition: all .15s ease;
}

header {
    overflow-x: clip;
}

.navbar-nav .dropdown-menu {
    margin-top: 0;
    border: none;
    border-radius: 0;
    padding: 50px 0 0px;
    background: var(--blue);
}

    .navbar-nav .dropdown-menu::before {
        content: '';
        background: var(--blue);
        width: 200vw;
        height: 100%;
        position: absolute;
        top: 25px;
        left: -100vw;
        z-index: -1;
        border-top: 1px solid white;
    }

.dropdown-item {
    color: white;
    padding-left: 10px;
}

    .dropdown-item:focus,
    .dropdown-item:hover {
        color: var(--orange);
        background-color: transparent;
    }

/* END Header */

/* START Content */
section {
    padding: auto var(--container-padding);
}

.banner-slide {
    position: relative;
}

.banner-img {
    xbackground: #000;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.65+100 */
}

.banner-slide:nth-child(3) .banner-img, .banner-slide:nth-child(4) .banner-img {
    xbackground: var(--blue) !important;
}

#home-banners .banner-img::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 60%;
    z-index: 1;
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.75) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.banner-img img {
    pointer-events: none;
    xmax-height: 500px;
    height: 100%;
    max-height: 70vh;
    aspect-ratio: 16/9;
    object-fit: cover;
    opacity: 1;
}

.banner-content {
    color: #fff;
    position: absolute;
    bottom: 50px;
    left: var(--container-padding-s);
    z-index: 2;
}

    .banner-content h2 {
        font-weight: normal;
        margin-bottom: 5px;
    }

.featured-research-big,
.featured-content-big {
    position: relative;
}

.featured-research-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.featured-research-big, .overlay-link {
    position: relative;
}

.card-overlay-link {
    position: absolute;
    inset: 0; /* top:0; right:0; bottom:0; left:0 */
    z-index: 1;
}

.featured-research-big .featured-research-content,
.featured-content-big .featured-content-content {
    position: absolute;
    bottom: 0;
    width: 100%;
    background: rgba(255, 255, 255, 0.8);
    padding: 20px 20px;
}

.featured-research .featured-research-content,
.featured-content .featured-content-content {
    position: relative;
    bottom: 0;
    width: 100%;
    background: var(--lightgrey);
    padding: 20px 20px;
    border-left: 4px solid var(--green);
}

.featured-research-content p,
.featured-content-content p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    /* Optional: adds ellipsis at the end */
}

.featured-research-big .featured-research-wrapper,
.featured-content-big .featured-content-wrapper {
    padding-right: 5vw;
    margin-bottom: 30px;
}

.featured-research-wrapper,
.featured-content-wrapper {
    padding-right: 5vw;
    margin-bottom: 30px;
}

.featured-research-big .featured-research-content {
    border-left: 4px solid var(--green);
}

.featured-research-img img,
.featured-content-img img {
    pointer-events: none;
    object-fit: cover;
}

.post-category {
    font-weight: bold;
    color: white;
    background: var(--blue);
    padding: 7px 15px;
    line-height: 1;
    position: absolute;
    top: 0;
    right: 0;
    text-decoration: none;
}

.category-orange {
    background: var(--orange)
}

.programme-border-green {
    border-left: 4px solid var(--green) !important;
}

.programme-content {
    position: relative;
    bottom: 0;
    width: 100%;
    background: var(--lightgrey);
    padding: 20px 20px 20px 20px;
    border-left: 4px solid var(--orange);
}

.programme-wrapper {
    margin-bottom: 30px;
}

.programme-content p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    /* Optional: adds ellipsis at the end */
}

.post-content {
    position: relative;
    bottom: 0;
    width: 100%;
    background: var(--lightgrey);
    padding: 60px 50px 60px 20px;
    border-left: 4px solid var(--blue);
}

.post-content-padding-s {
    position: relative;
    bottom: 0;
    width: 100%;
    background: var(--lightgrey);
    padding: 30px 20px 30px 20px;
    border-left: 4px solid var(--blue);
}

.post-wrapper {
    margin-bottom: 30px;
}

.post-content.post-lines-limit p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    /* Optional: adds ellipsis at the end */
}

.post-border-orange {
    border-left: 4px solid var(--orange) !important;
}

.post-border-blue {
    border-left: 4px solid var(--blue) !important;
}

.post-border-green {
    border-left: 4px solid var(--green) !important;
}

.post-border-grey {
    border-left: 4px solid var(--grey) !important;
}

.pl-16 {
    padding-left: 16px;
}

.gap-10 {
    gap: 10px;
}

.gap-20 {
    gap: 20px;
}

.gap-30 {
    gap: 30px;
}

.gap-40 {
    gap: 40px;
}

.gap-50 {
    gap: 50px;
}

.w-80 {
    width: 80%;
    max-width: 80%;
}

.w-90 {
    width: 90%;
    max-width: 90%;
}

.featured-research,
.featured-content {
    height: calc(50% - 0px);
}

#home-testimonials {
    background: var(--lightgrey);
    padding-top: 50px;
    padding-bottom: 50px;
}

.testimonial-name {
    margin-top: 30px;
    padding-left: 24px;
}

.divider {
    height: 10px;
    background: var(--blue);
    width: 70%;
    clip-path: polygon(0 0, 100% 0%, calc(100% - 10px) 100%, 0% 100%);
}

.contact-left {
    xmargin-left: calc(0px - var(--container-padding-s));
}

.research-item a:hover {
    color: var(--green);
}

.programme-item a:hover {
    color: var(--orange);
}

.media-item a:hover {
    color: var(--blue);
}

.hover-green:hover {
    background: var(--green) !important;
    color: white !important;
}

.hover-orange:hover {
    background: var(--orange) !important;
    color: white !important;
}

.hover-blue:hover {
    background: var(--blue) !important;
    color: white !important;
}

.border-left {
    border-left: 4px solid var(--blue);
    padding-left: 20px;
}

.border-left-orange {
    border-left: 4px solid var(--orange);
    padding-left: 20px;
}

/* page banner */
#page-banner {
    position: relative;
}

.banner-title {
    position: absolute;
    right: 0;
    bottom: 40px;
    color: white;
    padding: 9px 35px 10px 50px;
    background: var(--blue);
}

@media (max-width: 1680px) {
    .banner-title {
        padding: 4px 35px 4px 50px;
    }
}

.banner-title h2 {
    font-weight: 400 !important;
    line-height: 55px !important;
    margin-bottom: 0;
}

.partner-logos img {
    object-fit: contain;
    xmax-width: 200px;
    max-height: 60px;
}

.partner-logos a {
    display: flex;
    align-items: center;
}

.more-logos {
    display: none;
}

.arrow-down svg {
    transition: all .3s ease;
}

.arrow-down.showing svg {
    transform: rotate(180deg);
    transition: all .5s ease;
}

img.multiply {
    mix-blend-mode: multiply;
}

.ecosystem-item {
    position: relative;
    margin-bottom: 20px;
}

.img-cover {
    object-fit: cover;
}

.ecosystem-item::before {
    content: '';
    background: #F8F8F8;
    width: 100vw;
    height: 100%;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
}

.programme-item {
    margin-bottom: 50px;
}

.programmes-row {
    margin-bottom: -50px;
}

.address {
    border-left: 4px solid var(--blue);
    padding-left: 10px;
    margin-bottom: 15px;
}

.featured-course {
    position: relative;
}

.featured-course-btn {
    position: absolute;
    bottom: 20px;
    left: 20px;
}

#upcoming-events-slider .slick-dots {
    bottom: 20px;
    right: 35px;
}

    #upcoming-events-slider .slick-dots li {
        background: #DDDCDB;
    }

        #upcoming-events-slider .slick-dots li.slick-active {
            background: var(--blue);
        }

.accordion-item {
    border-bottom: 0 !important;
    margin-bottom: 30px;
    color: #3D3935;
}

.accordion-body {
    position: relative;
    padding: 30px 20px 60px;
    background: #F9F9F8;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

.accordion-body a {
    word-break: break-all;
}

.accordion-view-all {
    position: absolute;
    bottom: 0;
    right: 0;
}

.accordion-header {
    position: relative;
    border-bottom: 0 !important;
    z-index: 1;
}

.accordion-button::before {
    content: '';
    background: #fff;
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 50px;
    clip-path: polygon(100% 100%, 0% 100%, 100% 0);
    z-index: 99;
    transition: all .3s ease .2s;
}

.accordion-button:not(.collapsed)::before {
    content: '';
    background: #F9F9F8;
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 50px;
    clip-path: polygon(100% 100%, 0% 100%, 100% 0);
    z-index: 99;
    transition: all .3s ease;
}

.accordion-collapse {
    position: relative;
    z-index: 0;
}

.accordion-button:focus {
    box-shadow: none;
}

.accordion-button {
    border-bottom: 0 !important;
    background: #F3F3F1;
    padding: 20px;
    font-size: var(--h3);
    font-weight: bold;
    outline: none;
    box-shadow: none !important;
}

    .accordion-button::after {
        margin-left: auto;
        margin-right: 30px;
    }

    .accordion-button:not(.collapsed) {
        background: #F3F3F1;
        color: inherit;
    }

.accordion-title {
    width: 100%;
    max-width: 450px;
}

#sdg-investor-maps .accordion-button {
    color: #3D3935;
}

.accordion-desc {
    font-size: var(--body);
    font-weight: 400;
    line-height: 1.3em;
    max-width: 600px;
    width: 100%;
    padding-right: 30px;
}

.accordion-button:not(.collapsed)::after {
    background: url('data:image/svg+xml,<svg id="Case_Study_Accordion_button" data-name="Case Study Accordion button" xmlns="http://www.w3.org/2000/svg" width="54" height="54" viewBox="0 0 54 54"><g id="Group_1591" data-name="Group 1591" transform="translate(-1720.435 -5701.466)"><g id="Group_1590" data-name="Group 1590"><path id="Path_9063" data-name="Path 9063" d="M0,0V26.764" transform="translate(1761.198 5728.848) rotate(90)" fill="none" stroke="%230033a0" stroke-linecap="round" stroke-width="3"/></g></g><g id="Ellipse_1" data-name="Ellipse 1" fill="none" stroke="%230033a0" stroke-width="3"><circle cx="27" cy="27" r="27" stroke="none"/><circle cx="27" cy="27" r="25.5" fill="none"/></g></svg>') no-repeat center center;
    background-size: contain;
    width: 40px;
    height: 40px;
}

.accordion-button::after {
    background: url('data:image/svg+xml,<svg id="Case_Study_Accordion_button" data-name="Case Study Accordion button" xmlns="http://www.w3.org/2000/svg" width="54" height="54" viewBox="0 0 54 54"><g id="Group_1591" data-name="Group 1591" transform="translate(-1720.435 -5701.466)"><g id="Group_1590" data-name="Group 1590"><path id="Path_9062" data-name="Path 9062" d="M-12332.046-2485.534v26.764" transform="translate(14079.862 8201)" fill="none" stroke="%230033a0" stroke-linecap="round" stroke-width="3"/><path id="Path_9063" data-name="Path 9063" d="M0,0V26.764" transform="translate(1761.198 5728.848) rotate(90)" fill="none" stroke="%230033a0" stroke-linecap="round" stroke-width="3"/></g></g><g id="Ellipse_1" data-name="Ellipse 1" fill="none" stroke="%230033a0" stroke-width="3"><circle cx="27" cy="27" r="27" stroke="none"/><circle cx="27" cy="27" r="25.5" fill="none"/></g></svg>') no-repeat center center;
    background-size: contain;
    width: 40px;
    height: 40px;
}

#industry-case-studies .accordion-button:not(.collapsed)::after {
    background: url('data:image/svg+xml,<svg id="Case_Study_Accordion_button" data-name="Case Study Accordion button" xmlns="http://www.w3.org/2000/svg" width="54" height="54" viewBox="0 0 54 54"><g id="Group_1591" data-name="Group 1591" transform="translate(-1720.435 -5701.466)"><g id="Group_1590" data-name="Group 1590"><path id="Path_9063" data-name="Path 9063" d="M0,0V26.764" transform="translate(1761.198 5728.848) rotate(90)" fill="none" stroke="%23ED8B00" stroke-linecap="round" stroke-width="3"/></g></g><g id="Ellipse_1" data-name="Ellipse 1" fill="none" stroke="%23ED8B00" stroke-width="3"><circle cx="27" cy="27" r="27" stroke="none"/><circle cx="27" cy="27" r="25.5" fill="none"/></g></svg>') no-repeat center center;
    background-size: contain;
    width: 40px;
    height: 40px;
}

#industry-case-studies .accordion-button::after {
    background: url('data:image/svg+xml,<svg id="Case_Study_Accordion_button" data-name="Case Study Accordion button" xmlns="http://www.w3.org/2000/svg" width="54" height="54" viewBox="0 0 54 54"><g id="Group_1591" data-name="Group 1591" transform="translate(-1720.435 -5701.466)"><g id="Group_1590" data-name="Group 1590"><path id="Path_9062" data-name="Path 9062" d="M-12332.046-2485.534v26.764" transform="translate(14079.862 8201)" fill="none" stroke="%23ED8B00" stroke-linecap="round" stroke-width="3"/><path id="Path_9063" data-name="Path 9063" d="M0,0V26.764" transform="translate(1761.198 5728.848) rotate(90)" fill="none" stroke="%23ED8B00" stroke-linecap="round" stroke-width="3"/></g></g><g id="Ellipse_1" data-name="Ellipse 1" fill="none" stroke="%23ED8B00" stroke-width="3"><circle cx="27" cy="27" r="27" stroke="none"/><circle cx="27" cy="27" r="25.5" fill="none"/></g></svg>') no-repeat center center;
    background-size: contain;
    width: 40px;
    height: 40px;
}

#teaching-case-studies .accordion-button:not(.collapsed)::after {
    background: url('data:image/svg+xml,<svg id="Case_Study_Accordion_button" data-name="Case Study Accordion button" xmlns="http://www.w3.org/2000/svg" width="54" height="54" viewBox="0 0 54 54"><g id="Group_1591" data-name="Group 1591" transform="translate(-1720.435 -5701.466)"><g id="Group_1590" data-name="Group 1590"><path id="Path_9063" data-name="Path 9063" d="M0,0V26.764" transform="translate(1761.198 5728.848) rotate(90)" fill="none" stroke="%23007672" stroke-linecap="round" stroke-width="3"/></g></g><g id="Ellipse_1" data-name="Ellipse 1" fill="none" stroke="%23007672" stroke-width="3"><circle cx="27" cy="27" r="27" stroke="none"/><circle cx="27" cy="27" r="25.5" fill="none"/></g></svg>') no-repeat center center;
    background-size: contain;
    width: 40px;
    height: 40px;
}

#teaching-case-studies .accordion-button::after {
    background: url('data:image/svg+xml,<svg id="Case_Study_Accordion_button" data-name="Case Study Accordion button" xmlns="http://www.w3.org/2000/svg" width="54" height="54" viewBox="0 0 54 54"><g id="Group_1591" data-name="Group 1591" transform="translate(-1720.435 -5701.466)"><g id="Group_1590" data-name="Group 1590"><path id="Path_9062" data-name="Path 9062" d="M-12332.046-2485.534v26.764" transform="translate(14079.862 8201)" fill="none" stroke="%23007672" stroke-linecap="round" stroke-width="3"/><path id="Path_9063" data-name="Path 9063" d="M0,0V26.764" transform="translate(1761.198 5728.848) rotate(90)" fill="none" stroke="%23007672" stroke-linecap="round" stroke-width="3"/></g></g><g id="Ellipse_1" data-name="Ellipse 1" fill="none" stroke="%23007672" stroke-width="3"><circle cx="27" cy="27" r="27" stroke="none"/><circle cx="27" cy="27" r="25.5" fill="none"/></g></svg>') no-repeat center center;
    background-size: contain;
    width: 40px;
    height: 40px;
}

#sdg-investor-maps .accordion-button:not(.collapsed)::after {
    background: url('data:image/svg+xml,<svg id="Case_Study_Accordion_button" data-name="Case Study Accordion button" xmlns="http://www.w3.org/2000/svg" width="54" height="54" viewBox="0 0 54 54"><g id="Group_1591" data-name="Group 1591" transform="translate(-1720.435 -5701.466)"><g id="Group_1590" data-name="Group 1590"><path id="Path_9063" data-name="Path 9063" d="M0,0V26.764" transform="translate(1761.198 5728.848) rotate(90)" fill="none" stroke="%233D3935" stroke-linecap="round" stroke-width="3"/></g></g><g id="Ellipse_1" data-name="Ellipse 1" fill="none" stroke="%233D3935" stroke-width="3"><circle cx="27" cy="27" r="27" stroke="none"/><circle cx="27" cy="27" r="25.5" fill="none"/></g></svg>') no-repeat center center;
    background-size: contain;
    width: 40px;
    height: 40px;
}

#sdg-investor-maps .accordion-button::after {
    background: url('data:image/svg+xml,<svg id="Case_Study_Accordion_button" data-name="Case Study Accordion button" xmlns="http://www.w3.org/2000/svg" width="54" height="54" viewBox="0 0 54 54"><g id="Group_1591" data-name="Group 1591" transform="translate(-1720.435 -5701.466)"><g id="Group_1590" data-name="Group 1590"><path id="Path_9062" data-name="Path 9062" d="M-12332.046-2485.534v26.764" transform="translate(14079.862 8201)" fill="none" stroke="%233D3935" stroke-linecap="round" stroke-width="3"/><path id="Path_9063" data-name="Path 9063" d="M0,0V26.764" transform="translate(1761.198 5728.848) rotate(90)" fill="none" stroke="%233D3935" stroke-linecap="round" stroke-width="3"/></g></g><g id="Ellipse_1" data-name="Ellipse 1" fill="none" stroke="%233D3935" stroke-width="3"><circle cx="27" cy="27" r="27" stroke="none"/><circle cx="27" cy="27" r="25.5" fill="none"/></g></svg>') no-repeat center center;
    background-size: contain;
    width: 40px;
    height: 40px;
}

#data-dashboard .accordion-button:not(.collapsed)::after {
    background: url('data:image/svg+xml,<svg id="Case_Study_Accordion_button" data-name="Case Study Accordion button" xmlns="http://www.w3.org/2000/svg" width="54" height="54" viewBox="0 0 54 54"><g id="Group_1591" data-name="Group 1591" transform="translate(-1720.435 -5701.466)"><g id="Group_1590" data-name="Group 1590"><path id="Path_9063" data-name="Path 9063" d="M0,0V26.764" transform="translate(1761.198 5728.848) rotate(90)" fill="none" stroke="%233D3935" stroke-linecap="round" stroke-width="3"/></g></g><g id="Ellipse_1" data-name="Ellipse 1" fill="none" stroke="%233D3935" stroke-width="3"><circle cx="27" cy="27" r="27" stroke="none"/><circle cx="27" cy="27" r="25.5" fill="none"/></g></svg>') no-repeat center center;
    background-size: contain;
    width: 40px;
    height: 40px;
}

#data-dashboard .accordion-button::after {
    background: url('data:image/svg+xml,<svg id="Case_Study_Accordion_button" data-name="Case Study Accordion button" xmlns="http://www.w3.org/2000/svg" width="54" height="54" viewBox="0 0 54 54"><g id="Group_1591" data-name="Group 1591" transform="translate(-1720.435 -5701.466)"><g id="Group_1590" data-name="Group 1590"><path id="Path_9062" data-name="Path 9062" d="M-12332.046-2485.534v26.764" transform="translate(14079.862 8201)" fill="none" stroke="%233D3935" stroke-linecap="round" stroke-width="3"/><path id="Path_9063" data-name="Path 9063" d="M0,0V26.764" transform="translate(1761.198 5728.848) rotate(90)" fill="none" stroke="%233D3935" stroke-linecap="round" stroke-width="3"/></g></g><g id="Ellipse_1" data-name="Ellipse 1" fill="none" stroke="%233D3935" stroke-width="3"><circle cx="27" cy="27" r="27" stroke="none"/><circle cx="27" cy="27" r="25.5" fill="none"/></g></svg>') no-repeat center center;
    background-size: contain;
    width: 40px;
    height: 40px;
}

.accordion-title {
    padding-left: 70px;
    padding-right: 20px;
}

#knowledge-and-insights .accordion-title::before {
    content: '';
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    height: 50px;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="62.641" height="58.083" viewBox="0 0 62.641 58.083"><defs><clipPath id="clip-path"><rect id="Rectangle_940" data-name="Rectangle 940" width="62.641" height="58.083" fill="%230033a0"/></clipPath></defs><g id="Group_2291" data-name="Group 2291" clip-path="url(%23clip-path)"><path id="Path_9309" data-name="Path 9309" d="M46.138,31.876a8.529,8.529,0,1,0,6.032,2.5,8.472,8.472,0,0,0-6.032-2.5m5.031,13.553a7.106,7.106,0,1,1,0-10.055,7.061,7.061,0,0,1,0,10.055" transform="translate(-7.719 -6.542)" fill="%230033a0"/><path id="Path_9310" data-name="Path 9310" d="M61.752,50.052h0l-7.5-7.51a3.249,3.249,0,0,0-2.31-.959,3.213,3.213,0,0,0-2.02.719l-2.041-2.041a11.414,11.414,0,0,0-1.374-14.481,11.218,11.218,0,0,0-2.236-1.725V3.159A3.163,3.163,0,0,0,41.111,0H3.158A3.162,3.162,0,0,0,0,3.159v41.02a7.421,7.421,0,0,0,7.349,7.437l36.162,2.457h.044a.878.878,0,0,0,.233-.041.548.548,0,0,0,.055-.025l.027-.012a.161.161,0,0,0,.061-.028.722.722,0,0,0,.086-.07l.029-.025a.676.676,0,0,0,.135-.184.437.437,0,0,0,.019-.046.645.645,0,0,0,.052-.194.16.16,0,0,0,0-.042l.008-9.741c.178-.1.372-.222.559-.35l2.035,2.035a3.233,3.233,0,0,0,.234,4.33l7.451,7.451a3.275,3.275,0,0,0,4.619,0L61.69,54.6a3.274,3.274,0,0,0,.062-4.549m-46.87-6.076V40.652a.512.512,0,0,1,.242-.438.49.49,0,0,1,.5-.019L40.068,52.416l-28.7-1.947a7.732,7.732,0,0,0,3.513-6.493m-.5-4.969a1.919,1.919,0,0,0-.916,1.644v3.325a6.149,6.149,0,0,1-5.6,6.214,6.023,6.023,0,0,1-6.453-6.012V3.158a1.741,1.741,0,0,1,1.739-1.74H41.105a1.741,1.741,0,0,1,1.739,1.74V23.324a11.347,11.347,0,0,0-3.564-.851.708.708,0,0,0-.625-1.046H11.118a.71.71,0,0,0,0,1.42H35.351a11.341,11.341,0,0,0-6.817,5.315H12.342a.71.71,0,0,0,0,1.42h15.5A11.424,11.424,0,0,0,42.857,44.393v7.831l-26.589-13.3a1.927,1.927,0,0,0-1.884.084M45.5,40.939a10,10,0,1,1,0-14.151,9.961,9.961,0,0,1,0,14.151m.519,1.446c.161-.141.328-.287.482-.446.171-.17.327-.348.478-.52L47,41.4l1.889,1.889-1.043,1.043-1.889-1.889ZM53.6,43.9l-5.14,5.14-.358-.354a1.849,1.849,0,0,1,0-2.61l2.529-2.529a1.853,1.853,0,0,1,2.617,0Zm6.135,6.141L54.6,55.177l-5.14-5.139L54.6,44.9Zm1.485,2.25a1.834,1.834,0,0,1-.541,1.311l-2.528,2.529a1.852,1.852,0,0,1-2.551.055l5.136-5.137a1.821,1.821,0,0,1,.485,1.241" transform="translate(0 0)" fill="%230033a0"/><path id="Path_9311" data-name="Path 9311" d="M40.638,6.873a.711.711,0,0,0-.711-.711H6.873a.71.71,0,1,0,0,1.42H39.927a.711.711,0,0,0,.711-.71" transform="translate(-1.265 -1.265)" fill="%230033a0"/><path id="Path_9312" data-name="Path 9312" d="M41.428,13.035a.711.711,0,0,0-.711-.711H10.725a.711.711,0,0,0,0,1.421H40.718a.711.711,0,0,0,.711-.711" transform="translate(-2.056 -2.529)" fill="%230033a0"/><path id="Path_9313" data-name="Path 9313" d="M41.745,19.968a.711.711,0,0,0-.711-.711H12.265a.71.71,0,0,0,0,1.42H41.034a.711.711,0,0,0,.711-.71" transform="translate(-2.372 -3.952)" fill="%230033a0"/></g></svg>') no-repeat left center;
    background-size: contain;
}

#industry-case-studies .accordion-title::before {
    content: '';
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    height: 50px;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="58.126" height="63.528" viewBox="0 0 58.126 63.528"><defs><clipPath id="clip-path"><rect id="Rectangle_830" data-name="Rectangle 830" width="58.126" height="63.528" fill="%23ed8b00"/></clipPath></defs><g id="Group_2864" data-name="Group 2864" transform="translate(0 0)"><g id="Group_1963" data-name="Group 1963" transform="translate(0 0)" clip-path="url(%23clip-path)"><path id="Path_9197" data-name="Path 9197" d="M57.435,32.658c-1.426-1.8-4.454-2.865-8.691-.419L37.9,38.5c-.048-.1-.1-.207-.159-.309V32.741a8.229,8.229,0,0,1,8.215-8.215h1.3v2.044a.761.761,0,0,0,.476.716.787.787,0,0,0,.847-.164l6.06-6.06a1.171,1.171,0,0,0,0-1.652l-6.06-6.06a.777.777,0,0,0-1.323.551v2.044h-1.3A16.658,16.658,0,0,0,37.74,18.1l0-10.377h2.045a.761.761,0,0,0,.715-.476.789.789,0,0,0-.163-.847L34.278.341a1.171,1.171,0,0,0-1.652,0L26.567,6.4a.777.777,0,0,0,.551,1.323h2.044V18.1a16.656,16.656,0,0,0-8.215-2.154h-1.3V13.9a.763.763,0,0,0-.475-.716.791.791,0,0,0-.848.164l-6.06,6.06a1.152,1.152,0,0,0-.344.826,1.164,1.164,0,0,0,.344.826l6.06,6.06a.776.776,0,0,0,1.323-.551V24.527h1.3a8.229,8.229,0,0,1,8.215,8.215v2.375H22.193c-9.758-2.569-12.525,3.7-13.855,6.727a12.13,12.13,0,0,1-.524,1.108l-2.136,3.7a2.511,2.511,0,0,0-3.058,1.081L.334,51.691a2.514,2.514,0,0,0,.918,3.424l13.984,8.076a2.5,2.5,0,0,0,3.421-.917l2.286-3.96a2.484,2.484,0,0,0,.248-1.9,2.513,2.513,0,0,0-.558-1.011l2.185-3.78c.914-1.59,1.425-1.667,2.891-1.667h5.942a11.212,11.212,0,0,0,5.839-1.563L56.521,37.408a3.189,3.189,0,0,0,.914-4.75ZM29.939,6.175H28.99l4.467-4.467,4.468,4.467h-.95a.77.77,0,0,0-.772.772l0,12.147a16.5,16.5,0,0,0-2.1,1.784c-.22.22-.433.447-.634.675-.207-.225-.42-.454-.641-.675a17.106,17.106,0,0,0-2.1-1.784l0-12.147A.8.8,0,0,0,29.939,6.175ZM27.847,25.84a9.7,9.7,0,0,0-6.9-2.865H18.874a.77.77,0,0,0-.773.772v.95l-4.467-4.468L18.1,15.762v.949a.771.771,0,0,0,.773.773h2.074a15.162,15.162,0,0,1,10.77,4.467c.255.255.495.524.737.8a16.571,16.571,0,0,0-2.741,5.7A9.975,9.975,0,0,0,27.847,25.84Zm2.865,6.9A15.252,15.252,0,0,1,45.949,17.5h2.074a.771.771,0,0,0,.773-.773v-.949l4.467,4.467L48.8,24.718v-.95A.77.77,0,0,0,48.023,23H45.949a9.78,9.78,0,0,0-9.764,9.764v3.766a8.868,8.868,0,0,0-5.2-1.385h-.274l0-2.4Zm-11.1,24.794-2.286,3.96a.962.962,0,0,1-1.307.352L2.032,53.77a.939.939,0,0,1-.447-.578.91.91,0,0,1,.1-.724l2.286-3.96a.949.949,0,0,1,.834-.476.909.909,0,0,1,.476.132l13.984,8.077a.939.939,0,0,1,.447.578.9.9,0,0,1-.1.716ZM56.547,34.95a1.6,1.6,0,0,1-.8,1.116L36.729,47.042A9.635,9.635,0,0,1,31.662,48.4H25.72c-1.757,0-2.919.164-4.234,2.437L19.372,54.5,7.048,47.378l2.115-3.663c.193-.336.379-.764.6-1.258,1.337-3.037,3.58-8.118,12.133-5.826a.607.607,0,0,0,.2.027h8.889c3.9,0,5.544,1.749,5.783,3.381a1.646,1.646,0,0,1-.379,1.323,1.627,1.627,0,0,1-1.254.565H25.548a.772.772,0,1,0,0,1.543h9.586a3.185,3.185,0,0,0,3.188-3.442l11.2-6.466c3.381-1.948,5.672-1.259,6.7.04A1.687,1.687,0,0,1,56.547,34.95Z" transform="translate(0 0)" fill="%23ed8b00"/></g></g></svg>') no-repeat left center;
    background-size: contain;
}

#teaching-case-studies .accordion-title::before {
    content: '';
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    height: 50px;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="53" height="53" viewBox="0 0 53 53"><defs><clipPath id="clip-path"><rect id="Rectangle_1039" data-name="Rectangle 1039" width="53" height="53" fill="%23007672"/></clipPath></defs><g id="Group_2589" data-name="Group 2589" clip-path="url(%23clip-path)"><path id="Path_9429" data-name="Path 9429" d="M52.412,48.351V1.744A1.746,1.746,0,0,0,50.669,0H41.054A1.746,1.746,0,0,0,39.31,1.744V15.3a1.6,1.6,0,0,0-.38-.048H29.316A1.746,1.746,0,0,0,27.571,17V48.123H25.412V9.961a1.746,1.746,0,0,0-1.744-1.744h-9.6a1.746,1.746,0,0,0-1.744,1.744V21.175a1.6,1.6,0,0,0-.38-.048l-9.61,0A1.746,1.746,0,0,0,.589,22.869V48.348A1.323,1.323,0,0,0,0,49.442v2.232A1.326,1.326,0,0,0,1.325,53l50.351,0A1.325,1.325,0,0,0,53,51.677V49.444a1.325,1.325,0,0,0-.587-1.094M1.945,30.522V22.875a.376.376,0,0,1,.38-.38H11.94a.376.376,0,0,1,.38.38v7.647Zm0,17.6V31.882l10.377,0V48.125ZM24.058,9.961v4.126l-10.375,0V9.961a.377.377,0,0,1,.38-.38h9.614a.376.376,0,0,1,.38.38M13.683,15.448H24.06V48.126H13.683Zm15.254,5.091,0-3.537a.376.376,0,0,1,.38-.381h9.615a.376.376,0,0,1,.38.381v3.537Zm0,1.363H39.318v26.22H28.94ZM51.056,48.12H40.679V31.875H51.056Zm0-46.376,0,28.768H40.679V1.744a.376.376,0,0,1,.38-.38h9.614a.376.376,0,0,1,.38.38m.589,47.739-.007,2.167-50.28,0V49.481Z" transform="translate(0 0)" fill="%23007672"/></g></svg>') no-repeat left center;
    background-size: contain;
}

#sdg-investor-maps .accordion-title::before {
    content: '';
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 70px;
    height: 50px;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="78.195" height="52.721" viewBox="0 0 78.195 52.721"><defs><clipPath id="clip-path"><rect id="Rectangle_1233" data-name="Rectangle 1233" width="78.195" height="52.721" fill="%233d3935"/></clipPath></defs><g id="Group_2863" data-name="Group 2863" clip-path="url(%23clip-path)"><path id="Path_9600" data-name="Path 9600" d="M18.066,19.514l0-.124A14.668,14.668,0,0,1,22.334,8.441a14.627,14.627,0,0,1,24.746,7.809l.021.122,1.812-.317-.021-.122a16.464,16.464,0,0,0-32.665,3.532l0,.124Z" transform="translate(-0.161 -0.023)" fill="%233d3935"/><path id="Path_9601" data-name="Path 9601" d="M50.624,30.482a2.133,2.133,0,0,0-1.5-.6h0a2.142,2.142,0,0,0-1.507.6L46.55,31.546l-1.588-1.587a16.317,16.317,0,0,0,3.023-4.822l.046-.115-1.707-.684-.046.114A14.638,14.638,0,0,1,20.714,27.38l-.071-.1-1.5,1.053.071.1a16.443,16.443,0,0,0,24.452,2.823l1.589,1.589-1.064,1.063a2.133,2.133,0,0,0,0,3.013L59.6,52.339a2.131,2.131,0,0,0,3.013,0l3.426-3.426a2.132,2.132,0,0,0,0-3.013ZM64.741,47.614,61.314,51.04a.3.3,0,0,1-.411,0L45.486,35.622a.28.28,0,0,1-.085-.2.283.283,0,0,1,.086-.206l3.426-3.426a.281.281,0,0,1,.206-.086.29.29,0,0,1,.207.085L64.742,47.2a.293.293,0,0,1,0,.414" transform="translate(-0.19 -0.242)" fill="%233d3935"/><path id="Path_9602" data-name="Path 9602" d="M76.61,1.586a5.406,5.406,0,1,0-7.63,7.66l-5.714,8.008a5.338,5.338,0,0,0-2.2-.475A5.4,5.4,0,0,0,55.77,21.1L39.533,17.991a7.061,7.061,0,0,0-14.081.767,6.694,6.694,0,0,0,.081,1.016l-15.7,6.92a5.409,5.409,0,1,0,.989,3.117,5.336,5.336,0,0,0-.2-1.456l15.415-6.792a7.055,7.055,0,0,0,13.448-1.711L55.711,22.96a5.408,5.408,0,1,0,9.079-4.68L70.483,10.3a5.333,5.333,0,0,0,2.3.52A5.41,5.41,0,0,0,76.61,1.586m-.251,3.825a3.573,3.573,0,1,1-3.573-3.572,3.577,3.577,0,0,1,3.573,3.572M64.636,22.189a3.572,3.572,0,1,1-3.571-3.572,3.545,3.545,0,0,1,3.571,3.572m-26.9-3.432a5.224,5.224,0,1,1-5.224-5.223,5.23,5.23,0,0,1,5.224,5.223M8.983,29.81a3.572,3.572,0,1,1-3.572-3.572A3.577,3.577,0,0,1,8.983,29.81" fill="%233d3935"/></g></svg>') no-repeat left center;
    background-size: contain;
}

#data-dashboard .accordion-title::before {
    content: '';
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 70px;
    height: 50px;
    background: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="utf-8"%3F><!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 79.7 73.9" style="enable-background:new 0 0 79.7 73.9;" xml:space="preserve"><style type="text/css">.st0{clip-path:url(%23SVGID_2_);fill:none;stroke:%23000000;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><g><defs><rect id="SVGID_1_" y="0" width="79.7" height="73.9"/></defs><clipPath id="SVGID_2_"><use xlink:href="%23SVGID_1_" style="overflow:visible;"/></clipPath><circle class="st0" cx="20" cy="51.3" r="14"/><circle class="st0" cx="22.7" cy="20.9" r="3.3"/><circle class="st0" cx="32.9" cy="29.7" r="3.3"/><circle class="st0" cx="11.7" cy="30.8" r="3.3"/><circle class="st0" cx="45.3" cy="19.5" r="3.3"/><line class="st0" x1="11.7" y1="39.9" x2="11.7" y2="34.1"/><polyline class="st0" points="11.7,27.6 11.7,8.6 73.7,8.6 73.7,56.6 33.3,56.6 "/><line class="st0" x1="13.9" y1="28.4" x2="20" y2="22.8"/><line class="st0" x1="25.3" y1="22.8" x2="30.7" y2="27.3"/><line class="st0" x1="35.4" y1="27.6" x2="42.9" y2="21.7"/><line class="st0" x1="54.7" y1="14.8" x2="68.1" y2="14.8"/><line class="st0" x1="54.7" y1="19.5" x2="68.1" y2="19.5"/><line class="st0" x1="54.7" y1="24.3" x2="68.1" y2="24.3"/><polyline class="st0" points="68.1,49.6 56.9,49.6 43.7,49.6 43.7,34.1 "/><polyline class="st0" points="20,37.3 20,50.6 29.2,61.8 "/><line class="st0" x1="20" y1="50.6" x2="6.4" y2="54.6"/><polyline class="st0" points="48.5,45 54.6,38.2 61,42.8 68.1,34.1 "/></g></svg>') no-repeat left center;
    background-size: contain;
}

#search-input {
    border-left: 0;
    background: #F5F5F4 url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="30.001" height="29.66" viewBox="0 0 30.001 29.66"><defs><clipPath id="clip-path"><rect id="Rectangle_925" data-name="Rectangle 925" width="30.001" height="29.66" transform="translate(0 0)" fill="%230033a0"/></clipPath></defs><g id="Group_2255" data-name="Group 2255" transform="translate(0 0)"><rect id="Rectangle_924" data-name="Rectangle 924" width="3.485" height="12.11" transform="matrix(0.707, -0.707, 0.707, 0.707, 18.973, 21.099)" fill="%230033a0"/><g id="Group_2254" data-name="Group 2254"><g id="Group_2253" data-name="Group 2253" clip-path="url(%23clip-path)"><path id="Path_9292" data-name="Path 9292" d="M22.392,11.2a11.2,11.2,0,1,0-11.2,11.2,11.2,11.2,0,0,0,11.2-11.2M11.2,19.634A8.438,8.438,0,1,1,19.633,11.2,8.438,8.438,0,0,1,11.2,19.634" fill="%230033a0"/></g></g></g></svg>') no-repeat center left 10px;
    height: 50px;
    width: 300px;
    color: var(--blue);
    padding-left: 50px;
}

    #search-input::placeholder {
        color: var(--blue);
        opacity: 1;
        /* Firefox */
        font-style: italic;
    }

    #search-input::-ms-input-placeholder {
        /* Edge 12 -18 */
        color: var(--blue);
        font-style: italic;
    }

#submit-search {
    background: var(--blue);
    color: #fff;
    border: none;
    outline: none;
    height: 50px;
    font-weight: bold;
    padding: 0 20px;
}

.filter-button {
    padding: 10px 15px;
    height: 50px;
    display: flex;
    align-items: center;
    color: #fff !important;
    text-decoration: none;
    font-weight: bold;
    background: var(--blue) url('data:image/svg+xml,<svg id="Group_2252" data-name="Group 2252" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="29.471" height="25" viewBox="0 0 29.471 25"><defs><clipPath id="clip-path"><rect id="Rectangle_923" data-name="Rectangle 923" width="29.471" height="25" fill="none"/></clipPath></defs><rect id="Rectangle_919" data-name="Rectangle 919" width="15.861" height="1.549" transform="translate(13.61 4.905)" fill="%23fff"/><rect id="Rectangle_920" data-name="Rectangle 920" width="3.79" height="1.549" transform="translate(0 4.905)" fill="%23fff"/><g id="Group_2251" data-name="Group 2251"><g id="Group_2250" data-name="Group 2250" clip-path="url(%23clip-path)"><path id="Path_9290" data-name="Path 9290" d="M11.525,11.369a5.685,5.685,0,1,1,5.685-5.685,5.692,5.692,0,0,1-5.685,5.685m0-9.82A4.136,4.136,0,1,0,15.66,5.685a4.138,4.138,0,0,0-4.136-4.136" transform="translate(-2.825)" fill="%23fff"/><path id="Path_9291" data-name="Path 9291" d="M34.9,37.774a5.682,5.682,0,1,1,5.685-5.679A5.692,5.692,0,0,1,34.9,37.774m0-9.815a4.136,4.136,0,1,0,4.136,4.136A4.138,4.138,0,0,0,34.9,27.959" transform="translate(-14.133 -12.774)" fill="%23fff"/><rect id="Rectangle_921" data-name="Rectangle 921" width="15.861" height="1.549" transform="translate(0 18.546)" fill="%23fff"/><rect id="Rectangle_922" data-name="Rectangle 922" width="3.79" height="1.549" transform="translate(25.682 18.546)" fill="%23fff"/></g></g></svg>') no-repeat center left 15px;
    background-size: 30px;
    padding-left: 55px;
}

.filter-dropdown .dropdown-menu {
    background: #D9E0F1;
    color: var(--blue);
    box-shadow: none !important;
    outline: none !important;
    border: none !important;
    border-radius: 0;
    width: 100%;
    padding: 20px;
}

    .filter-dropdown .dropdown-menu li {
        margin-bottom: 0px;
    }

    .filter-dropdown .dropdown-menu a {
        color: var(--blue);
        padding-left: 35px;
        background: transparent !important;
    }

        .filter-dropdown .dropdown-menu a::before {
            content: '';
            width: 20px;
            height: 20px;
            background: var(--blue);
            position: absolute;
            left: 20px;
        }

    .filter-dropdown .dropdown-menu li.selected a::before {
        background: var(--blue) url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="13.811" height="10.822" viewBox="0 0 13.811 10.822"><g id="Group_3231" data-name="Group 3231" transform="translate(-21.1 -88.589)"><line id="Line_1" data-name="Line 1" x2="4" y2="3" transform="translate(22.5 95)" fill="none" stroke="%23fff" stroke-linecap="round" stroke-width="2"/><line id="Line_2" data-name="Line 2" x1="7" y2="8" transform="translate(26.5 90)" fill="none" stroke="%23fff" stroke-linecap="round" stroke-width="2"/></g></svg>') no-repeat center center;
        background-size: 13px;
    }

.filter-dropdown .dropdown-item {
    overflow-wrap: break-word;
    white-space: normal;
}

.sdg-filters {
    padding-right: 100px;
}

    .sdg-filters .filter-button {
        background: var(--grey) url('data:image/svg+xml,<svg id="Group_2252" data-name="Group 2252" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="29.471" height="25" viewBox="0 0 29.471 25"><defs><clipPath id="clip-path"><rect id="Rectangle_923" data-name="Rectangle 923" width="29.471" height="25" fill="none"/></clipPath></defs><rect id="Rectangle_919" data-name="Rectangle 919" width="15.861" height="1.549" transform="translate(13.61 4.905)" fill="%23fff"/><rect id="Rectangle_920" data-name="Rectangle 920" width="3.79" height="1.549" transform="translate(0 4.905)" fill="%23fff"/><g id="Group_2251" data-name="Group 2251"><g id="Group_2250" data-name="Group 2250" clip-path="url(%23clip-path)"><path id="Path_9290" data-name="Path 9290" d="M11.525,11.369a5.685,5.685,0,1,1,5.685-5.685,5.692,5.692,0,0,1-5.685,5.685m0-9.82A4.136,4.136,0,1,0,15.66,5.685a4.138,4.138,0,0,0-4.136-4.136" transform="translate(-2.825)" fill="%23fff"/><path id="Path_9291" data-name="Path 9291" d="M34.9,37.774a5.682,5.682,0,1,1,5.685-5.679A5.692,5.692,0,0,1,34.9,37.774m0-9.815a4.136,4.136,0,1,0,4.136,4.136A4.138,4.138,0,0,0,34.9,27.959" transform="translate(-14.133 -12.774)" fill="%23fff"/><rect id="Rectangle_921" data-name="Rectangle 921" width="15.861" height="1.549" transform="translate(0 18.546)" fill="%23fff"/><rect id="Rectangle_922" data-name="Rectangle 922" width="3.79" height="1.549" transform="translate(25.682 18.546)" fill="%23fff"/></g></g></svg>') no-repeat center left 15px;
    }

    .sdg-filters .dropdown-menu {
        background-color: #F9F9F8;
        z-index: 1;
        width: 100%;
        padding: 20px;
    }

    .sdg-filters .filter-dropdown .dropdown-menu a {
        color: var(--grey);
        padding-left: 35px;
        background: transparent !important;
        word-break: keep-all;
        overflow-wrap: break-word;
        hyphens: none;
        white-space: normal;
        line-height: 1.4em;
    }

        .sdg-filters .filter-dropdown .dropdown-menu a::before {
            content: '';
            width: 20px;
            height: 20px;
            background: var(--grey);
            position: absolute;
            left: 20px;
        }

    .sdg-filters .filter-dropdown .dropdown-menu li.selected a::before {
        background: var(--grey) url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="13.811" height="10.822" viewBox="0 0 13.811 10.822"><g id="Group_3231" data-name="Group 3231" transform="translate(-21.1 -88.589)"><line id="Line_1" data-name="Line 1" x2="4" y2="3" transform="translate(22.5 95)" fill="none" stroke="%23fff" stroke-linecap="round" stroke-width="2"/><line id="Line_2" data-name="Line 2" x1="7" y2="8" transform="translate(26.5 90)" fill="none" stroke="%23fff" stroke-linecap="round" stroke-width="2"/></g></svg>') no-repeat center center;
        background-size: 13px;
    }

.post-tags {
    background: var(--green);
    font-size: 1em;
    font-weight: bold;
    padding: 3px 10px 3px;
    top: 3px;
    color: white;
    display: inline-block;
    position: relative;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    display: inline;
}

.post-sdg {
    padding-left: 0;
    padding-top: 0;
    padding-bottom: 0;
}

    .post-sdg.post-content {
        border-left: 0;
    }

        .post-sdg.post-content .post-wrapper {
            position: relative;
            padding-top: 0;
            padding-left: 20px;
            padding-bottom: 20px;
            margin-top: 15px;
        }

        .post-sdg.post-content .read-more-bottom-left {
            padding-left: 8px;
        }

        .post-sdg.post-content .post-wrapper::before {
            content: '';
            width: 4px;
            height: 100%;
            background: var(--grey);
            position: absolute;
            left: 0px;
            top: 0;
        }

#sdg-investor-maps .filter-dropdown .dropdown-menu {
    position: relative;
}

.img-caption {
    font-size: var(--small);
    font-weight: bold;
    margin-top: -20px;
    margin-bottom: 30px;
}

.single-content img {
    margin-top: 10px;
    margin-bottom: 30px;
}

.single-content h5 {
    margin-bottom: 10px;
}

.single-content ul {
    margin-bottom: 30px;
    padding-left: 19px;
}

.single-content li {
    margin-bottom: 10px;
}

.agenda p {
    margin-bottom: 30px;
}

    .agenda p:last-child {
        margin-bottom: 0;
    }

.header-half-up {
    margin-top: -30px;
}

#search-results {
    background: var(--lightgrey);
}

.sources-sidebar p a {
    margin-bottom: 5px;
    display: block;
}

.row.sdg-row {
    margin-left: -5px;
    margin-right: -5px;
}

    .row.sdg-row > * {
        padding-right: 5px;
        padding-left: 5px;
    }

.circle-nos {
    gap: 20px;
}

.circle-nos-small {
    gap: 10px;
}

.circle-no .num {
    width: 30px;
    min-width: 30px;
    height: 30px;
    font-size: 25px;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--blue);
    color: #fff;
    border-radius: 50%;
    line-height: 1;
}

.circle-no {
    gap: 10px;
}

.no-content h4 {
    margin-bottom: 5px;
}

.i-icon {
    width: 15px;
    height: 15px;
    font-size: 12px;
    line-height: 15px;
    background-size: contain;
    border: 1px solid var(--grey);
    border-radius: 50%;
    text-align: center;
    display: inline-block;
    transform: translateY(-2px);
}

.maps-sector-content h4 {
    margin-bottom: 10px;
}

hr {
    opacity: 1;
}

.single-content hr {
    margin: 25px 0;
    outline: none;
    box-shadow: none;
    height: 1px;
    padding: 0;
    max-height: 1px;
    border-top: 1px solid var(--grey);
}

.team-name {
    height: 3em;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    align-content: flex-start;
    flex-wrap: wrap;
    justify-content: center;
}

.read-more-bottom {
    position: absolute;
    bottom: 20px;
    right: 20px;
}

.read-more-bottom-left {
    position: absolute;
    bottom: 20px;
    left: calc(var(--bs-gutter-x) * .5);
}

.form-submitted {
    margin-top: 30px;
    border: 2px solid var(--blue);
    padding: 10px;
}

.programme-item {
    display: flex;
    flex-direction: column;
}

.programme-content {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.upcoming-event-slide img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.img-5-3 {
    aspect-ratio: 5 / 3;
    object-fit: cover;
}

#partner-programmes .programme-img img {
    aspect-ratio: 650 / 276;
    object-fit: cover;
}

.sdg-2-lines .post-wrapper {
    height: calc(100% - 20px) !important;
}

.download-research-form {
    padding: 20px;
    background: #3d393530;
}

.download-research-form input[type="text"],
.download-research-form input[type="email"] {
    font-size: 14px;
    padding: 10px 12px;
}

    
.download-research-form input::placeholder {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.team-img img {
    aspect-ratio: 1/1;
    object-fit: cover;
    object-position: top center;
}

.description-clamp {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (min-width: 992px) {
    .xbanner-img {
        max-width: calc(100% - var(--container-padding) - var(--container-padding));
        margin: 0 auto;
    }

    .xbanner-title {
        right: var(--container-padding);
    }

    f
    .xbanner-content {
        left: calc(var(--container-padding) + 50px);
    }

    .xslick-dots {
        right: calc(var(--container-padding) + 50px) !important;
    }

    .banner-img img {
        height: 100%;
        max-height: 500px;
        aspect-ratio: 16 / 9;
        object-fit: cover;
    }
}

@media (min-width: 1681px) {
    .xbanner-img {
        max-width: 1200px !important;
    }

    .xbanner-title {
        right: calc((100% - 1200px)/2);
    }

    .xbanner-content {
        left: calc(((100% - 1200px)/2) + 50px);
    }

    .xslick-dots {
        right: calc(((100% - 1200px)/2) + 50px) !important;
    }
}

.sdg-img {
    height: 200px;
    display: flex;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .sdg-img img {
        max-height: 180px;
    }

.sdg-registration {
    position: relative;
    margin-top: 100px;
    height: 400px;
    width: 100%;
    background: url('img/sample/DSC01056-1-480x284.png') no-repeat center center;
    background-size: cover;
}

    .sdg-registration::before {
        content: '';
        width: 100%;
        height: 100%;
        background: rgba(0,0,0,0.75);
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
    }

.sdg-button {
    z-index: 9;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
    color: white;
    border: 2px solid white;
    border-radius: 10px;
    padding: 10px 20px;
}

.ratio-4-3 {
    aspect-ratio: 4/3;
    object-fit: cover;
}

.featured-content-big:hover a.bold, .card-hover-orange:hover a.bold {
    color: var(--orange);
}

.featured-research-big.research-item:hover a.bold, .card-hover-green:hover a.bold {
    color: var(--green);
}

.read-more-sdg {
    position: absolute;
    bottom: 20px;
    left: 20px;
}

/* ============================================== */
/* FIX UAT:  */


#sdg-investor-maps .row.programmes-row {
    display: flex;
    flex-wrap: wrap;
}

#sdg-investor-maps .row.programmes-row > .sector-item {
    display: flex;
    flex-direction: column;
}

#sdg-investor-maps .sector-item > .post-sdg.post-content {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: auto;
    flex: 1 1 auto;
}

#sdg-investor-maps .post-sdg.post-content > .post-tags {
    align-self: flex-start;
    flex-shrink: 0;
}

#sdg-investor-maps .post-sdg.post-content > .post-wrapper {
    flex: 1 1 auto;
    min-height: 0;
}

#sdg-investor-maps .post-wrapper > .read-more-sdg {
    position: static;
    padding-top: 30px;
    padding-left: 0;
}

/* === END FIX === */

.post-content.post-sdg .post-wrapper p:last-child {
    margin-bottom: 40px;
}

/* END Content */

/* popups */
.popup-bg,
.popup {
    display: none;
}

.popup-bg {
    background: var(--blue);
    opacity: 0.6;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 9998;
    top: 0;
}

.popup {
    width: 80%;
    padding: 50px;
    padding-bottom: 100px;
    max-width: 1200px;
    background: white;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999;
}

.close-popup {
    position: absolute;
    right: 50px;
    bottom: 50px;
}

/* end popups */

/* Contact forms */
form label {
    width: 100%;
    margin-bottom: 30px;
}

form textarea {
    height: 115px;
    resize: none;
}

input[type="text"],
input[type="email"],
textarea,
select,
.form-select {
    border: none;
    background: #F9F9F8;
    border-left: 4px solid #C4C3C2;
    padding: 10px 15px;
    font-size: 18px;
    line-height: 23px;
    color: #636c72;
    width: 100%;
    outline: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transition: all .3s ease;
}

.form-select {
    background: #F9F9F8 url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15.311" height="9.47" viewBox="0 0 15.311 9.47"><g id="Arrow" transform="translate(12.807 7.7) rotate(180)"><path id="Path_8" data-name="Path 8" d="M0,0H8.16" transform="translate(-0.736 5.849) rotate(-45)" fill="none" stroke="%233d3935" stroke-linecap="round" stroke-width="2.5"/><path id="Path_9" data-name="Path 9" d="M0,.015C.662.015,8.37,0,8.37,0" transform="translate(11.026 5.929) rotate(-135)" fill="none" stroke="%233d3935" stroke-linecap="round" stroke-width="2.5"/></g></svg>') no-repeat right 20px center;
    background-size: 15px;
}

    input[type="text"]:focus,
    input[type="email"]:focus,
    textarea:focus,
    select:focus,
    .form-select:focus {
        border-color: var(--blue);
        transition: all .3s ease;
    }

/* Customize the label (the container) */
.checkbox-container {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 14px;
    line-height: 20px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    /* Hide the browser's default checkbox */
    .checkbox-container input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

/* Create a custom checkbox */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #C4C3C2;
}

/* On mouse-over, add a grey background color */
.checkbox-container:hover input ~ .checkmark {
    background-color: #C4C3C2;
}

/* When the checkbox is checked, add a blue background */
.checkbox-container input:checked ~ .checkmark {
    background-color: var(--blue);
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.checkbox-container input:checked ~ .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.checkbox-container .checkmark:after {
    left: 9px;
    top: 5px;
    width: 7px;
    height: 13px;
    border: solid white;
    border-width: 0px 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* End contact forms */

/* START slick */
.slick-dots li button:before {
    display: none;
}

.slick-dots li {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 5px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer;
    background: white;
}

    .slick-dots li.slick-active {
        background: var(--orange);
    }

.slick-dots {
    position: absolute;
    bottom: 50px;
    display: inline;
    width: auto;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
    right: var(--container-padding-s);
    line-height: 0;
    height: 5px;
}

#home-testimonials .slick-dots {
    bottom: 50px;
    right: var(--container-padding);
    left: auto;
}

    #home-testimonials .slick-dots li {
        background: #DDDCDB;
    }

        #home-testimonials .slick-dots li.slick-active {
            background: var(--grey);
        }

/* END Slick */

/* Start Footer */
footer {
    background: #3D3935;
    border-bottom: 10px solid var(--orange);
    padding: 40px var(--container-padding-s);
    color: white;
    font-size: 16px;
    line-height: 26px;
}

    footer .menu-wrapper {
        display: flex;
        gap: 50px;
    }

    footer .menu-title {
        font-size: 18px;
        font-weight: bold;
        margin-bottom: 15px;
    }

/* End Footer */

.revealer {
    opacity: 0;
}

.revealed {
    opacity: 1;
    transition: all 1s ease .3s;
}

.revealer.ribbon-header {
    transform: translateX(-100%);
}

.revealed.ribbon-header {
    transform: translateX(0px);
    transition: all 1s ease 0s;
}

.revealer.ribbon-header.translateY-50 {
    transform: translateX(-100%) translateY(50%);
}

.revealed.ribbon-header.translateY-50 {
    transform: translateX(0px) translateY(50%);
    transition: all 1s ease 0s;
}

.revealer.divider {
    opacity: 1;
    transform: translateX(-100%) translateY(50%);
}

.revealed.divider {
    opacity: 1;
    transform: translateX(0px) translateY(50%);
    transition: all 1.5s ease 0s;
}

.revealer.fade-in-left {
    transform: translateX(-30px);
}

.revealer.revealed.fade-in-left {
    transform: translateX(0px);
}

.revealer.fade-in-right {
    transform: translateX(30px);
}

.revealer.revealed.fade-in-right {
    transform: translateX(0px);
}

.delay-1 {
    transition-delay: .4s;
}

.delay-2 {
    transition-delay: .5s;
}

.delay-3 {
    transition-delay: .6s;
}

@media (max-width: 1680px) {
    .nav-item {
        margin-left: calc(40px - 1rem);
    }

    .navbar-nav .dropdown-menu::before {
        top: 30px;
    }
}

@media (min-width: 1680px) {
    .accordion-title {
        max-width: 550px;
    }

    .filter-dropdown .dropdown-menu a::before {
        margin-top: 3px;
    }

    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1200px !important;
    }

    :root {
        x--container-padding: 200px;
    }
}

/* ANIMATED X */
.navbar-toggler.x {
    border: none;
    padding-right: 0;
}

    .navbar-toggler.x:focus {
        outline: none;
    }

    .navbar-toggler.x[aria-expanded=true] .icon-bar:nth-of-type(1) {
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transform-origin: 10% 10%;
        -ms-transform-origin: 10% 10%;
        transform-origin: 10% 10%;
    }

    .navbar-toggler.x[aria-expanded=true] .icon-bar:nth-of-type(2) {
        opacity: 0;
        filter: alpha(opacity=0);
    }

    .navbar-toggler.x[aria-expanded=true] .icon-bar:nth-of-type(3) {
        -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
        -webkit-transform-origin: 10% 90%;
        -ms-transform-origin: 10% 90%;
        transform-origin: 10% 90%;
    }

    .navbar-toggler.x .icon-bar {
        width: 22px;
        display: block;
        height: 2px;
        background-color: #fff;
        -webkit-transition: all 0.2s;
        transition: all 0.2s;
    }

        .navbar-toggler.x .icon-bar + .icon-bar {
            margin-top: 4px;
        }

        .navbar-toggler.x .icon-bar:nth-of-type(1) {
            -webkit-transform: rotate(0);
            -ms-transform: rotate(0);
            transform: rotate(0);
        }

        .navbar-toggler.x .icon-bar:nth-of-type(2) {
            opacity: 1;
            filter: alpha(opacity=100);
        }

        .navbar-toggler.x .icon-bar:nth-of-type(3) {
            -webkit-transform: rotate(0);
            -ms-transform: rotate(0);
            transform: rotate(0);
        }

/* large desktop > 1680px */
@media (min-width: 1680px) {
    .header-half-up {
        margin-top: -35px;
    }

    .post-sdg.post-content .post-wrapper {
        padding-bottom: 20px;
    }

    .sdg-2-lines .post-wrapper {
        height: calc(100% - 26px) !important
    }
}
/* end large desktop */


/* start mobile/tablets */
.mobile {
    display: none;
}

@media (max-width: 991.98px) {
    :root {
        --body: 16px;
        --small: 12px;
        --container-padding-s: 20px;
        --container-padding: 20px;
        --h1:;
        --h2: calc(50px * 0.75);
        --h3: calc(40px * 0.75);
        --h4: calc(25px * 0.75);
        --h5: calc(20px * 0.75);
        --h6:;
        --bs-border-width: 4px;
    }

    body,
    html {
        overflow-x: hidden;
    }

    .mmt-0 {
        margin-top: 0 !important;
    }

    .mobile {
        display: block;
    }

        .mobile.flex,
        .mobile-flex {
            display: flex;
        }

        .mobile.btn {
            display: inline-block !important;
        }

    .desktop {
        display: none;
    }

    body {
        margin-top: 54px;
    }

    .mmb-20 {
        margin-bottom: 20px;
    }

    .mmb-30 {
        margin-bottom: 30px;
    }

    .mmt-30 {
        margin-top: 30px;
    }

    .mmt-50 {
        margin-top: 50px;
    }

    .pt-50 {
        padding-top: 30px;
    }

    .pb-50 {
        padding-bottom: 30px;
    }

    .mt-5 {
        margin-top: 40px !important;
    }

    .mb-5 {
        margin-bottom: 40px !important;
    }

    .mb-100 {
        margin-bottom: 50px;
    }

    .mt-100 {
        margin-top: 50px;
    }

    .pl-100 {
        padding-left: 50px;
    }

    .pr-100 {
        padding-right: 50px;
    }

    .mb-150 {
        margin-bottom: 50px;
    }

    .mt-150 {
        margin-top: 50px;
    }

    .mb-200 {
        margin-bottom: 50px;
    }

    .mt-200 {
        margin-top: 50px;
    }

    footer .menu-wrapper {
        display: flex;
        gap: 30px;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .navbar-brand img {
        height: 30px;
    }

    .navbar {
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .nav-item {
        margin-left: 0;
    }

    header {
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 999;
    }

    .banner-title {
        position: absolute;
        right: 0;
        bottom: 40px;
        color: white;
        padding: 2px 20px 2px 20px;
        background: var(--blue);
    }

    .banner-slide {
        background: var(--blue);
    }

    .banner-img {
        opacity: 1;
    }

        .banner-img img {
            pointer-events: none;
            max-height: 70vh;
            height: 100%;
            object-fit: cover;
            aspect-ratio: 1/1;
            object-fit: cover;
        }

    #home-banners .slick-dots {
        position: absolute;
        bottom: 30px;
    }

    .banner-content {
        padding-right: 20px;
    }

    .outer-border-blue::before,
    .outer-border-green::before,
    .outer-border-orange::before {
        left: 0;
    }

    .outer-border-blue,
    .outer-border-green,
    .outer-border-orange {
        position: relative;
        padding-left: 20px;
    }

    .programme-item,
    .media-item {
        margin-bottom: 30px;
    }

    #home-programme-spotlight > .container > .row > .col-sm-6:first-child {
        margin-bottom: 30px;
    }

        #home-programme-spotlight > .container > .row > .col-sm-6:first-child .featured-content-img img,
        .featured-research-img img,
        .featured-content-img img {
            height: 450px !important;
        }

    #home-programme-spotlight .featured-content-big.programme-item {
        margin-bottom: 0;
    }

    #research-highlights .col-sm-6 {
        margin-bottom: 20px;
    }

    #home-testimonials {
        background: var(--lightgrey);
        padding-top: 50px;
        padding-bottom: 70px;
    }

        #home-testimonials .slick-dots {
            bottom: 30px;
            right: 0;
            left: 0;
        }

    .contact-left {
        margin-bottom: 30px;
    }

    #contact-form textarea {
        margin-top: 30px !important;
    }

    #copyright .text-end img {
        height: 40px;
        margin-top: 30px;
    }

    .navbar-toggler.x {
        box-shadow: none !important;
    }

    #navbarNav {
        padding-top: 30px;
    }

    .navbar-nav .dropdown-menu {
        padding-top: 0;
    }

    .navbar-nav .dropdown-menu {
        padding-bottom: 5px;
    }

    .menu-c {
        width: calc(50% - 15px);
    }

    .popup {
        width: 100%;
        height: 100dvh;
        padding: 30px;
        max-width: 1200px;
        background: white;
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 9999;
        overflow-y: auto;
    }

    .outer-border-blue.ml-20,
    .outer-border-green.ml-20,
    .outer-border-orange.ml-20 {
        margin-left: 0 !important;
        margin-top: 20px;
    }

    .partner-logos img {
        object-fit: contain;
        max-height: 50px;
    }

    .partner-logos .gap-50 {
        gap: 30px 50px;
        padding: 30px;
    }

    .smu-logo {
        padding-left: 20px;
        padding-right: 20px;
    }

    .translateY-50 {
        margin-top: 0%;
        z-index: 9;
    }

    .revealer.ribbon-header.translateY-50 {
        transform: translateX(-100%) translateY(0%);
        margin-bottom: 30px;
    }

    .revealed.ribbon-header.translateY-50 {
        transform: translateX(0px) translateY(0%);
    }

    .ecosystem-item {
        position: relative;
        margin-bottom: 40px;
    }

        .ecosystem-item .col-md-4 {
            width: 60%;
        }

        .ecosystem-item .col-md-2 {
            width: 40%;
        }

            .ecosystem-item .col-md-2 img {
                padding: 0 !important;
            }

    .filters-row {
        flex-direction: column;
        align-content: flex-start !important;
    }

        .filters-row .h4 {
            margin-bottom: 20px;
        }

        .filters-row form {
            margin-bottom: 30px;
            width: 100%;
            max-width: 100%;
        }

    #search-input {
        width: 100%;
    }

    .dropdown.filter-dropdown {
        margin-bottom: 20px;
    }

    .filter-dropdown .dropdown-menu {
        position: relative !important;
        transform: none !important;
    }

    .accordion-button {
        flex-direction: column;
    }

    .accordion-title::before {
        top: 30px !important;
        width: 40px !important;
        height: 40px !important;
        transform: none !important;
    }

    .accordion-title {
        padding-left: 50px;
        line-height: 1.1em;
        margin-bottom: 10px;
        padding-right: 30px;
    }

    .accordion-button::after {
        background-size: contain;
        width: 30px !important;
        height: 30px !important;
        position: absolute;
        top: 20px !important;
        right: 10px;
    }

    .accordion-desc {
        font-size: var(--body);
        font-weight: 400;
        line-height: 1.3em;
        max-width: 600px;
        padding-right: 30px;
    }

    .accordion-body {
        position: relative;
        padding: 30px 10px 60px;
        background: #F9F9F8;
    }

    #browse-all .accordion-item .accordion-body > .container-fluid > .row > .col-lg-3 {
        margin-bottom: 30px;
    }

    .ribbon-header-large {
        padding: 12px 50px 12px 0;
        padding-left: var(--container-padding);
    }

    #related-articles .ribbon-header {
        max-width: 90%;
        padding: 9px 30px 9px 0;
        padding-left: var(--container-padding);
    }

    .sdg-filters {
        margin-bottom: 40px;
    }

    .sector-item {
        margin-bottom: 30px !important;
    }

    .mobile-reversed {
        display: flex;
        flex-direction: column-reverse;
    }

    .accordion-button {
        padding-right: 80px;
        align-items: flex-start;
    }

    .article-sidebar-header {
        margin-bottom: 50px;
    }

    .pe-0 {
        padding-right: calc(var(--bs-gutter-x) * .5) !important;
    }

    .ps-0 {
        padding-left: calc(var(--bs-gutter-x) * .5) !important;
    }

    .programme-box .post-content {
        padding-top: 60px !important;
    }

    .sdg-icon {
        width: 100px;
    }

    .post-content {
        padding: 30px 20px 30px 20px;
    }

    .slick-slide .post-content {
        padding-bottom: 60px;
    }

    #upcoming-events-slider .slick-dots {
        bottom: 30px;
        right: 35px;
    }

    .text-content .sdg-icons {
        justify-content: center;
    }

    .accordion-button {
        font-size: 25px;
        line-height: 1.2em;
    }

    .sdg-filters {
        padding-right: 10px;
    }

    #unique-impact img {
        width: 80px;
    }

    #sdg-investor-maps .sector-item .post-content {
        padding-bottom: 0;
        padding-right: 20px;
    }

    #sdg-investor-maps .sector-item .post-content {
        padding-bottom: 0;
        padding-top: 0;
        padding-left: 0;
    }

    .close-popup {
        position: relative;
        right: 0;
        bottom: 0;
        top: 0;
        margin-top: 30px !important;
        margin-bottom: 30px;
    }

    .featured-course-btn {
        position: relative;
        bottom: 0;
        left: 0;
        margin-top: 20px;
    }

    #methodology .article-sidebar-header {
        margin-bottom: 0;
    }

    .ribbon-header.mmb-0 {
        margin-bottom: 0 !important;
    }

    .navbar-brand img {
        padding: 3px 0;
    }
}

@media (max-width: 767.98px) {
    .sector-item .equal {
        height: auto !important;
    }

    #browse-all .accordion-button::before {
        display: none;
    }

    #browse-all .accordion-button::after {
        margin-right: 10px;
    }

    #browse-all .accordion-desc, #browse-all .accordion-title {
        padding-right: 0;
    }
}

/* end mobile/tablets */

.tablet {
    display: none;
}

/* tablets portrait */
@media (min-width: 768px) and (max-width: 991.98px) {
    .tablet {
        display: block;
    }

    .mmb-20 {
        margin-bottom: 20px;
    }

    .mmb-30 {
        margin-bottom: 30px;
    }

    .mmt-30 {
        margin-top: 30px;
    }

    .mmt-50 {
        margin-top: 50px;
    }

    .pt-50 {
        padding-top: 50px;
    }

    .pb-50 {
        padding-bottom: 50px;
    }

    .mt-5 {
        margin-top: 50px !important;
    }

    .mb-5 {
        margin-bottom: 50px !important;
    }

    .mb-100 {
        margin-bottom: 50px;
    }

    .mt-100 {
        margin-top: 50px;
    }

    .pl-100 {
        padding-left: 50px;
    }

    .pr-100 {
        padding-right: 50px;
    }

    .mb-150 {
        margin-bottom: 50px;
    }

    .mt-150 {
        margin-top: 50px;
    }

    .mb-200 {
        margin-bottom: 50px;
    }

    .mt-200 {
        margin-top: 50px;
    }

    .partner-logos img {
        object-fit: contain;
        xmax-width: calc(20% - 50px);
    }

    .banner-img img {
        pointer-events: none;
        max-height: 100%;
        object-fit: cover;
        aspect-ratio: 16 / 9;
        object-fit: cover;
    }

    .sdg-filters {
        display: flex;
        justify-content: space-between;
    }

        .sdg-filters .filter-dropdown {
            width: calc(50% - 15px);
        }

    .post-content {
        padding: 30px 20px 30px 20px;
    }

    #contact-form textarea {
        margin-top: 0px !important;
    }

    .menu-c {
        width: calc(33.333% - 20px);
    }

    .accordion-title::before {
        top: 15px !important;
    }

    .accordion-desc {
        max-width: 700px;
        padding-right: 30px;
    }

    #home-programme-spotlight > .container > .row > .col-sm-6:first-child {
        margin-bottom: 0px;
    }

    .tmb-0 {
        margin-bottom: 0 !important;
    }

    #home-programme-spotlight > .container > .row > .col-sm-6:first-child .featured-content-img img,
    .featured-research-img img,
    .featured-content-img img {
        height: 100% !important;
        min-height: 450px;
    }

    #related-articles .ribbon-header {
        max-width: 100%;
        padding: 9px 60px 9px 0;
        padding-left: var(--container-padding);
    }

    #unique-impact img {
        width: 50px;
    }

    #sdg-investor-maps .sector-item .post-content {
        padding-bottom: 0;
        padding-top: 0;
        padding: 0;
        padding-right: 20px;
    }

    .ribbon-header {
        max-width: 90%;
    }

    .popup .team-img img {
        max-width: 40%;
    }

    .popup {
        width: calc(100% - 40px);
        height: auto;
    }
}
    /* end tablets portrait */
/* === Fix layout for iPad Pro Portrait (992px - 1199px) === */
@media (min-width: 992px) and (max-width: 1199.98px) {
    #sdg-investor-maps > .container > .row > .col-lg-4.sdg-filters {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        width: 100% !important;
        margin-bottom: 40px !important;
    }

    #sdg-investor-maps > .container > .row > .col-lg-8 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    #sdg-investor-maps .sdg-filters {
        display: flex !important;
        justify-content: space-between !important;
        flex-wrap: wrap !important;
        padding-right: 0 !important;
    }

    #sdg-investor-maps .sdg-filters .filter-dropdown {
        width: calc(50% - 15px) !important;
        margin-bottom: 0 !important;
    }

    #sdg-investor-maps .sector-item.col-lg-4 {
        flex: 0 0 50% !important;
        max-width: 50% !important;
        width: 50% !important;
    }
}

@media (min-width: 1200px) and (max-width: 1399.98px) {
    #sdg-investor-maps .sdg-filters {
        padding-right: 20px;
    }
}
