:root {
  font-family: "Swiss 721 W03 Light", Arial, Helvetica, sans-serif;
  --animation-duration: 0.25s;
  --txt-size-large: calc(22 / var(--root-font-size) * 1rem);
  --txt-size-medium: 1rem;
  --txt-size-small: calc(12 / var(--root-font-size) * 1rem);
  --color-ub-blue: #00678b;
  --color-ub-grey: #5b7582;
  --color-ub-orange: #a35216;

  --ub-blue: #00678b;
  --ub-blue-50: #7eb5cd;
  --ub-blue-5: rgba(0, 103, 139, 0.05);
  --ub-grey: #859ca8;
  --ub-dark-blue: #005065;
  --ub-dark-blue-rgb: 0, 80, 101; /* use with rgba function */
  --black: #4a4a4a;
  --white: #ffffff;
  --ub-grey-25: #c7d4db;
  --ub-grey-10: #f1f4f6;
  --ub-light-grey: #fafbfc;
  --ub-dark-blue-50: #8badbe;
  --ub-dark-grey: #5b7582;
  --rust: #a35216;
  --gold: #d3a519;
  --green: #093c2a;
  --dark-bg-blue: #003645;
  --ub-light-blue: #e3e9ed;
}
:root {
    font-size: 10px;
}

body {
    font-size: 1.6rem;
}

/* FONT DEFINITIONS */

/* Swiss 721 W03 Thin */
@font-face {
    font-family: "Swiss 721 W03 Thn";
    src: url("/css/fonts/Swiss-721/Swiss_721_W03_Thn/efadb268-9678-4ce1-82ce-79f630c16271.eot?#iefix") format("eot"), url("/css/fonts/Swiss-721/Swiss_721_W03_Thn/d951ab13-81a4-49ef-b592-499f7101a394.woff") format("woff"), url("/css/fonts/Swiss-721/Swiss_721_W03_Thn/f29f69e8-d9e1-49d5-b18c-c55d0963ad0d.ttf") format("truetype"), url("/css/fonts/Swiss-721/Swiss_721_W03_Thn/8221b431-0f46-4dd5-b62d-0670df20ee2a.svg#8221b431-0f46-4dd5-b62d-0670df20ee2a") format("svg");
}

/* Swiss 721 W03 Light */
@font-face {
    font-family: "Swiss 721 W03 Light";
    src: url("/css/fonts/Swiss-721/Swiss_721_W03_Light/8936dd78-6787-48e6-b578-0df6e400b3e1.eot?#iefix") format("eot"), url("/css/fonts/Swiss-721/Swiss_721_W03_Light/d1001ef9-2b8e-4cd1-99e7-9f48a6f7d356.woff") format("woff"), url("/css/fonts/Swiss-721/Swiss_721_W03_Light/0c9b7a6a-39da-4a63-8de4-3a91edeab5de.ttf") format("truetype"), url("/css/fonts/Swiss-721/Swiss_721_W03_Light/a3f40f07-8d2b-4630-a6c6-a6e1ceb4e1e7.svg#a3f40f07-8d2b-4630-a6c6-a6e1ceb4e1e7") format("svg");
}

/* Swiss 721 W03 Light Condensed */
@font-face {
    font-family: "Swiss 721 W03 Light Cnd";
    src: url("/css/fonts/Swiss-721/Swiss_721_W03_Light_Cnd/492c1dc1-a0eb-449d-9c6b-5fc379d3d6ad.eot?#iefix") format("eot"), url("/css/fonts/Swiss-721/Swiss_721_W03_Light_Cnd/572f4033-5b20-497d-9eec-f2642057895c.woff") format("woff"), url("/css/fonts/Swiss-721/Swiss_721_W03_Light_Cnd/4874e700-7150-43e5-a72e-108b74d19e58.ttf") format("truetype"), url("/css/fonts/Swiss-721/Swiss_721_W03_Light_Cnd/ec9ad866-7df7-424f-841f-ca5d9b23bf9e.svg#ec9ad866-7df7-424f-841f-ca5d9b23bf9e") format("svg");
}

/* Swiss 721 W03 Condensed */
@font-face {
    font-family: "Swiss 721 W03 Cnd";
    src: url("/css/fonts/Swiss-721/Swiss_721_W03_Cnd/479af9aa-4f26-46f2-86bd-a7a402857682.eot?#iefix") format("eot"), url("/css/fonts/Swiss-721/Swiss_721_W03_Cnd/6c757807-f8ca-46ea-a7ec-bf318188880a.woff") format("woff"), url("/css/fonts/Swiss-721/Swiss_721_W03_Cnd/ed06709b-3985-4b1e-b045-e173e224060a.ttf") format("truetype"), url("/css/fonts/Swiss-721/Swiss_721_W03_Cnd/6a141d87-8c63-412b-9ac6-1107b02ea625.svg#6a141d87-8c63-412b-9ac6-1107b02ea625") format("svg");
}

/* Swiss 721 W03 Bold Condensed */
@font-face {
    font-family: "Swiss 721 W03 Bd Cnd";
    src: url("/css/fonts/Swiss-721/Swiss_721_W03_Bd_Cnd/9d110454-bdb0-45fa-8bfd-27c1e5a6e0de.eot?#iefix") format("eot"), url("/css/fonts/Swiss-721/Swiss_721_W03_Bd_Cnd/f2bb9e08-e1b0-4de5-b414-c8a0b3ec39fa.woff") format("woff"), url("/css/fonts/Swiss-721/Swiss_721_W03_Bd_Cnd/d51673dd-8f8b-49c0-bc94-97ae567963c3.ttf") format("truetype"), url("/css/fonts/Swiss-721/Swiss_721_W03_Bd_Cnd/4c00b9f9-d6b3-46b6-b7e5-820786ed386e.svg#4c00b9f9-d6b3-46b6-b7e5-820786ed386e") format("svg");
}

/* Swiss 721 W03 Black */
@font-face {
    font-family: "Swiss 721 W03 Blk";
    src: url("/css/fonts/Swiss-721/Swiss_721_W03_Blk/tt0007m_.ttf") format("truetype");
}

/* Swiss 721 W03 Black Condensed */
@font-face {
    font-family: "Swiss 721 W03 Blk Cnd";
    src: url("/css/fonts/Swiss-721/Swiss_721_W03_Blk_Cnd/aa898871-4566-469b-b50a-5d85c39eebb5.eot?#iefix") format("eot"), url("/css/fonts/Swiss-721/Swiss_721_W03_Blk_Cnd/3b500e51-91e9-44af-8c6f-52ee81e157bc.woff") format("woff"), url("/css/fonts/Swiss-721/Swiss_721_W03_Blk_Cnd/efe8f093-554e-4ade-9d73-0a0ccea95bb3.ttf") format("truetype"), url("/css/fonts/Swiss-721/Swiss_721_W03_Blk_Cnd/02ccb762-e8c9-47d9-90fc-517de3554eb3.svg#02ccb762-e8c9-47d9-90fc-517de3554eb3") format("svg");
}

/* Swiss 721 W03 Roman */
@font-face {
    font-family: "Swiss 721 W03 Roman";
    src: url("/css/fonts/Swiss-721/Swiss_721_W03_Roman/tt0003m_.ttf") format("truetype");
}


/* HEADERS */

h1 {
    font-family: "Swiss 721 W03 Thn";
    font-size: 4.6rem;
    font-weight: 100;
    margin: 2rem 0;
    text-align: center;
    line-height: 1.81;
}

.header-image-title {
    color: var(--color-ub-orange);
}

h2 {
    font-size: 4.6rem;
    font-family: "Swiss 721 W03 Thn", Arial, Helvetica, sans-serif;
    margin: 0;
    line-height: 1.22;
    font-weight: 100;
}

    h2.title {
        color: var(--color-ub-orange);
        font-size: 4.6rem;
        font-family: "Swiss 721 W03 Thn", Arial, Helvetica, sans-serif;
        margin: 0 auto 1.4rem auto;
    }

h3 {
    font-size: 2.7rem;
    font-weight: 300;
    font-family: "Swiss 721 W03 Light", Arial, Helvetica, sans-serif;
    color: var(--ub-dark-grey);
    font-stretch: normal;
    font-style: normal;
}

h4 {
    font-family: "Swiss 721 W03 Bd Cnd", Arial, Helvetica, sans-serif;
    font-size: 1.7rem;
    font-style: normal;
    font-weight: 300;
    font-stretch: condensed;
    line-height: 1.53;
    letter-spacing: .4px;
    color: var(--color-ub-grey);
    text-transform: uppercase;
}


/* Custom h-elements */

h2.header {
    font-size: 2.4rem;
    margin: 1.9rem 0;
}

.block h2 {
    color: var(--color-ub-orange);
    text-align: center;
}


h4.header {
    max-width: 750px;
    margin: 2rem auto;
}

/* [h4 fundpage specific] */
.single-fund-page .column h4 {
    margin-bottom: 0;
}

.single-fund-page h4.header {
    border-top: 1px solid rgb(227, 233, 237);
    padding-top: 0.8rem;
}

.h4-no-margin h4 {
    margin-bottom: 0;
}

.h4-no-margin .bc-color h4 {
    margin: 0
}

h5.alt-1 {
    color: var(--color-ub-grey);
    font-size: 1.6rem;
    margin: 0;
    font-weight: 700;
}


/* OTHER TEXT ELEMENTS */

p {
    word-break: break-word;
    color: var(--black);
    line-height: 1.56;
    font-size: 1.6rem;
    font-weight: 300;
}

.ub-p,
.ub-pp {
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.56;
    color: var(--black);
}

.ub-p {
    font-family: 'Swiss 721 W03 Light', Arial, Helvetica, sans-serif;
    font-size: 16px;
}

.ub-pp {
    font-family: 'Swiss 721 W03 Light Cnd', Arial, Helvetica, sans-serif;
    font-size: 11px;
}

strong {
    font-family: "Swiss 721 W03 Bd Cnd", Arial, Helvetica, sans-serif;
}

span.subtitle {
    font-size: 2rem;
}

.pdisclaimer,
small {
    font-family: "Swiss 721 W03 Light Cnd", Arial, Helvetica, sans-serif;
    font-size: 1.3rem;
    color: var(--black);
}

.custom-grid .feed-event div,
.custom-grid p {
    line-height: 1.56;
}

.custom-grid p {
    margin: 0;
}


/* RTE STYLES */
/* These are set when applying formatting in rich text editors in the backoffice */

h1.ub-h1,
h1.ub-h1-no-margin-top {
    color: var(--color-ub-orange);
    font-family: "Swiss 721 W03 Thn";
    font-size: 4.6rem;
    font-weight: 100;
    margin: 2rem 0;
    text-align: center;
}

h2.ub-h2-orange,
h3.ub-h3-orange {
    color: var(--color-ub-orange);
}

h3.toggler-title,
h4.toggler-title {
    cursor: pointer;
    text-align: left;
    --chevron-width: 3px;
    --chevron-size: 1.2rem;
    margin: 12px auto 8px;
}

h4.toggler-title {
    font-size: 2rem;
    font-family: "Swiss 721 W03 Light", Arial, Helvetica, sans-serif;
    text-transform: unset;
    letter-spacing: unset;
}

    h3.toggler-title:after,
    h4.toggler-title:after {
        border-style: solid;
        border-width: var(--chevron-width) var(--chevron-width) 0 0;
        content: '';
        display: inline-block;
        height: var(--chevron-size);
        margin-left: 1rem;
        position: relative;
        top: 5px;
        transform: rotate(135deg);
        vertical-align: top;
        width: var(--chevron-size);
    }

    h3.toggler-title[attr-open="true"]:after,
    h4.toggler-title[attr-open="true"]:after {
        top: 12px;
        transform: rotate(-45deg);
    }

h1.ub-h1-no-margin-top,
h2.ub-h2-no-margin-top,
h3.ub-h3-no-margin-top,
h4.ub-h4-no-margin-top {
    margin-top: 0;
}

p.txt-white {
    color: var(--white);
}

p.strong-style {
    font-family: "Swiss 721 W03 Bd Cnd", Arial, Helvetica, sans-serif;
}

p.txt-normal {
    line-height: 1.56;
}

.text-button-arrow-right {
    display: block;
    background-color: #00678b;
    color: #ffffff;
    text-align: center;
    max-width: 320px;
    padding: 10px 25px;
    margin: 14px auto;
    cursor: pointer;
}

.grid-section .text-button-arrow-right {
    font-family: "Swiss 721 W03 Light", Arial, Helvetica, sans-serif;
}


/* GENERIC HELPER CLASSES
  These all use !important to override other styles.
*/

.font-bold-condensed {
    font-family: "Swiss 721 W03 Bd Cnd", Arial, Helvetica, sans-serif !important;
}

.font-black-condensed {
    font-family: "Swiss 721 W03 Blk Cnd", Arial, Helvetica, sans-serif !important;
}

.font-condensed {
    font-family: "Swiss 721 W03 Cnd", Arial, Helvetica, sans-serif !important;
}

.font-light {
    font-family: "Swiss 721 W03 Light", Arial, Helvetica, sans-serif !important;
}

.font-light-condensed {
    font-family: "Swiss 721 W03 Light Cnd", Arial, Helvetica, sans-serif !important;
}

.font-thin {
    font-family: "Swiss 721 W03 Thn", Arial, Helvetica, sans-serif !important;
}

.text-white {
    color: var(--white) !important;
}

.text-ub-blue {
    color: var(--color-ub-blue) !important;
}

.text-ub-grey {
    color: var(--color-ub-grey) !important;
}

.text-ub-orange {
    color: var(--color-ub-orange) !important;
}

.text-size-13 {
    font-size: 1.3rem !important;
}

.text-size-14 {
    font-size: 1.4rem !important;
}

.text-size-15 {
    font-size: 1.5rem !important;
}

.text-size-16 {
    font-size: 1.6rem !important;
}

.text-size-17 {
    font-size: 1.7rem !important;
}

.text-size-20 {
    font-size: 2rem !important;
}

.text-size-24 {
    font-size: 2.4rem !important;
}

.text-size-27 {
    font-size: 2.7rem !important;
}

.text-size-42 {
    font-size: 4.2rem !important;
}

.text-center {
    text-align: center !important;
}

.text-left {
    text-align: left !important;
}

.text-right {
    text-align: right !important;
}


/* Used by content producers in the backoffice */
/* See https://teams.hiq.fi/confluence/x/KWw0C */
.swiss721 strong {
    font-family: "Swiss 721 W03 Bd Cnd", Arial, Helvetica, sans-serif;
}

.swiss721 p {
    font-family: "Swiss 721 W03 Light Cnd", Arial, Helvetica, sans-serif;
}
html,
body {
    margin: 0;
    padding: 0;
}

header,
footer {
    text-align: center;
}

header {
    padding: 0 2rem;
}

.main-wrap {
    padding: 0 2rem;
}

main {
    margin: 0 auto;
}

.ub-center {
    margin: 0 auto;
    max-width: 1150px;
}

footer {
    padding-top: 15px;
    margin: 0 auto;
}

body .vue-iframe {
    display: block;
    width: 100%;
    border: none;
    overflow: hidden;
    margin: 16px auto;
    width: 100%;
    height: 1330px;
}

button {
    border: 0;
}

.ub-centered-section {
    max-width: 750px;
    width: 100%;
    margin: 0 auto;
}

table {
    color: var(--black);
}

/* FLEX HELPERS */

.flex-custom {
    margin-top: 1rem;
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
}

.flex-row {
    display: flex;
    flex-direction: row;
}

.flex-row-center-x {
    display: flex;
    flex-direction: row;
    justify-content: center;
}

.flex-row-center-y {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.flex-row-center-x-and-y {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.flex-column {
    display: flex;
    flex-direction: column;
}

.flex-column-center-x {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.flex-column-center-y {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.flex-column-center-x-and-y {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.flex-gap-1 {
    gap: 1rem;
}

.flex-gap-2 {
    gap: 2rem;
}

.flex-gap-3 {
    gap: 3rem;
}

.flex-wrap {
    flex-wrap: wrap;
}

.flex-grow-0 {
    flex-grow: 0;
}

.flex-grow-1 {
    flex-grow: 1;
}

.flex-shrink-0 {
    flex-shrink: 0;
}

.flex-shrink-1 {
    flex-shrink: 1;
}

.flex-basis-50-percent {
    flex-basis: 50%;
}



.card-container {
    display: block;
    border: solid 1px #ccc;
    margin: 0 1.5rem 1.5rem 0;
}

.card-container .highstock-container {
    height: 144px;
    margin-top: 0px;
    overflow: hidden;
}


.risk-class .numbers {
    display: flex;
}

.risk-class .digit {
    color: #617782;
}

.risk-class .numbers .bold {
    font-weight: 500;
    font-family: "Swiss 721 W03 Blk Cnd", Arial, Helvetica, sans-serif;
}

.information-item {
    display: flex;
    width: 100%;

    transform: translateX(-15px);
    font-family: "Swiss 721 W03 Light Cnd", Arial, Helvetica, sans-serif;
    padding: 0;
}

.information-item .text {
    flex: 0 0 50%;
    display: inline-block;
    text-align: right;
    font-size: 18px;
    margin-right: 16px;
    color: var(--color-ub-grey);
}

.information-item .digit {
    font-size: 19px;
    margin: 0 1px;
}

.information-item .minimum-invest-value-wrapper {
    margin-top: 2px;
}

.star-rating {
    padding-bottom: 6px;
}

.star-rating span {
    font-size: 20px;
    color: #c7d4db;
}

.star-rating .colored {
    color: var(--color-ub-grey);
}

.layout-2022 {
    max-width: 60vw;
    margin: 0 auto;
}

.custom-grid .accordion-zone .inactive {
    display: none;
}

.block-header {
    text-align: center;
    margin: 0 auto 4rem auto;
    width: 90%;
}

.block {
    margin-bottom: 1.6rem;
}

/* [quote-block] */
.quote-block {
    display: flex;
    gap: 4rem;
    width: 100%;
    max-width: 750px;
    min-height: 140px;
    margin: 3rem auto;
}

.quote-block.author img {
    width: 120px;
}

.quote-block .author-txt {
    font-size: 1.7rem;
    margin-top: 3rem;
    font-style: italic;
}

blockquote {
    line-height: 1.56;
    font-family: "Swiss 721 W03 Blk Cnd";
    font-size: 1.7rem;
    color: #4a4a4a;
    margin: 0;
    letter-spacing: .3px;
    font-weight: 300;
}

/* [header] */
.header-image {
    position: relative;
    height: 40vw;
    max-height: 500px;
    overflow: hidden;
}

.header-image img {
    display: block;
    max-width: 100%;
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.video-embed-wrapper {
    position: relative;
    padding-bottom: 56.25%;
    /* 16:9 */
    padding-top: 25px;
    height: 0;
}

.video-embed-wrapper iframe {
    border: none;
    z-index: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* [content] */
.custom-grid .column img {
    display: block;
    max-width: 100%;
    width: 400px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
}

.custom-grid .contact-card img {
    aspect-ratio: 110 / 140;
    max-height: 140px;
    max-width: 110px;
}

.custom-grid .max-w img {
    max-width: 100%;
    width: auto;
}

.custom-grid .max-w-45 img {
    max-width: 45px;
    width: auto;
}

.custom-grid .max-w-96 img {
    max-width: 96px;
    width: auto;
}

.custom-grid .max-w-150 img {
    max-width: 150px;
    width: auto;
}

.custom-grid .max-w-300 img {
    max-width: 300px;
    width: auto;
}

.custom-grid .quote-block .author-img {
    flex-shrink: 0;
}

.custom-grid .quote-block img {
    width: 120px;
    height: unset;
}



.iframe-wrap iframe {
    border: none;
    width: 100%;
    overflow: hidden;
    margin: 16px auto;
    display: block;
}

.custom-grid a {
    text-underline-offset: 0.4rem;
    text-decoration: none;
    color: var(--ub-blue);
}

.custom-grid a:hover,
.custom-grid a:hover .text-button-arrow-right {
    text-decoration: underline;
    text-decoration-thickness: 1px;
}

.custom-grid .text-button-arrow-right a {
    color: #fff;
}


.hero p,
.highlight p,
.fund-card p {
    color: var(--color-hero-txt);
}

ul {
    color: var(--black);
}

.column ul {
    padding: 0;
    margin-left: 2rem;
    margin-bottom: 1.4rem;
}

.column ul li {
    margin-bottom: 8px;
}

@media screen and (min-width: 900px) {
    .columns p {
        font-family: "Swiss 721 W03 Light Cnd", Arial, Helvetica, sans-serif;
    }
}

/* [video iframe: embed.cshtml] */
.video-wrapper {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 56.25%;
    /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}

.video-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

#disclaimer {
    max-width: 750px;
}

/* [contact card modal override] */
.custom-grid .column .modal-header img {
    width: 240px;
    margin: 0;
}

.txt-disclaimer {
    margin-top: 5rem;
    font-size: 1.2rem;
    font-family: "Swiss 721 W03 Light", Arial, Helvetica, sans-serif;
}

.flex-images {
    display: flex;
    flex-flow: row wrap;
    max-width: 800px;
    margin: 0 auto 12px;
    gap: 2.4rem;
}

.flex-images a {
    margin-bottom: 1rem;
    display: block;
}

@media screen and (max-width: 739px) {
    p.newsletter-subscribe-p {
        display: block;
        margin-top: 2rem;
    }
}

@media screen and (min-width: 740px) {
    .newsletter-subscribe-p {
        text-align: right;
    }
}

.newsletter-subscribe-txt {
    font-family: "Swiss 721 W03 Light", Arial, Helvetica, sans-serif;
    font-size: 24px;
    line-height: 150%;
    color: #fff;
    white-space: pre-line;
}

.contact-block {
    background-image: linear-gradient(329deg, #cbe3ec, #e6f5f9);
}

.contact-block .text-container {
    max-width: 470px;
    margin: 0 auto;
}

.contact-block .container {
    padding: 6.4rem 0;
}

.block .contact-button img {
    height: 30px;
    width: auto;
    margin: 0;
}

.contact-buttons {
    margin-top: 4rem;
}

.contact-buttons a {
    margin: auto 0;
    font-family: "Swiss 721 W03 Bd Cnd";
    color: var(--color-ub-grey);
    font-size: 1.7rem;
}

.contact-button {
    display: flex;
    justify-content: center;
    gap: 1rem;
}

.cta-wrap {
    display: flex;
    justify-content: center;
    margin-top: 8rem;
}

.container .lnk-cta {
    font-family: "Swiss 721 W03 Bd Cnd";
    display: flex;
    border: 1px solid #859ca8;
    padding: 1rem 2rem;
    gap: 2rem;
    color: var(--color-ub-grey);
    cursor: pointer;
}

.container .lnk-cta:hover {
    text-decoration: none;
    background-color: #00678b;
    color: #fff;
    border-color: #fff;
}

.lnk-cta svg {
    display: block;
    stroke: var(--color-ub-grey);
}

.lnk-cta:hover svg {
    stroke: #fff;
}

.lnk-cta .lnk-txt {
    margin: auto;
}

.site-footer {
    font-family: "Swiss 721 W03 Cnd";
    font-size: 1.4rem;
    text-align: left;
}

.contact-block .contact-button a,
.contact-block .lnk-cta {
    text-decoration: none;
}


.ub-arrow-link {
    font-family: "Swiss 721 W03 Bd Cnd", Arial, Helvetica, sans-serif;
    text-decoration: none;
    color: var(--color-ub-blue);
}

.ub-arrow-link:hover {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.4rem;
}

.ub-arrow-link__icon-svg {
    height: 16px;
    width: 16px;
    stroke: var(--color-ub-blue);
}

.ub-arrow_link__icon-svg-grey {
    stroke: var(--color-ub-grey);
}

/* BUTTONS */

html body .ub-btn {
    padding: 1rem 2rem;
    font-family: "Swiss 721 W03 Bd Cnd", Arial, Helvetica, sans-serif;
    color: var(--ub-dark-grey);
    font-size: 17px;
    text-align: center;
    cursor: pointer;
}

html body a.ub-btn:hover {
    text-decoration: none;
}

html body .ub-btn-large {
    padding: 1.6rem 2.4rem;
}

html body .ub-btn-blue {
    background-color: var(--ub-blue);
    color: var(--white);
}

html body .ub-btn-black {
    background-color: var(--black);
    color: var(--white);
}

html body .ub-btn-transparent {
    background-color: transparent;
    border: 1px solid var(--ub-dark-blue-50);
}

html body .ub-btn-svg {
    padding-right: 1rem
}

html body .ub-btn-large .ub-btn-svg {
    padding-right: 1.6rem
}

html body .ub-btn[data-disabled="true"] {
    opacity: 0.6;
    pointer-events: none;
}

html body .ub-link-btn {
    text-decoration: none;
}

.two-column-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
}

/* Spacing helpers */
.ub-margin-0 {
    margin: 0 !important;
}

.ub-margin-half {
    margin: 0.5rem !important;
}

.ub-margin-1 {
    margin: 1rem !important;
}

.ub-margin-2 {
    margin: 2rem !important;
}

.ub-margin-3 {
    margin: 3rem !important;
}

.ub-margin-4 {
    margin: 4rem !important;
}

.ub-margin-top-half {
    margin-top: 0.5rem !important;
}

.ub-margin-top-0 {
    margin-top: 0 !important;
}

.ub-margin-top-1 {
    margin-top: 1rem !important;
}

.ub-margin-top-2 {
    margin-top: 2rem !important;
}

.ub-margin-top-3 {
    margin-top: 3rem !important;
}

.ub-margin-top-4 {
    margin-top: 4rem !important;
}

.ub-margin-bottom-0 {
    margin-bottom: 0 !important;
}

.ub-margin-bottom-half {
    margin-bottom: 0.5rem !important;
}

.ub-margin-bottom-1 {
    margin-bottom: 1rem !important;
}

.ub-margin-bottom-2 {
    margin-bottom: 2rem !important;
}

.ub-margin-bottom-3 {
    margin-bottom: 3rem !important;
}

.ub-margin-bottom-4 {
    margin-bottom: 4rem !important;
}

.ub-padding-0 {
    padding: 0 !important;
}

.ub-padding-half {
    padding: 0.5rem !important;
}

.ub-padding-1 {
    padding: 1rem !important;
}

.ub-padding-2 {
    padding: 2rem !important;
}

.ub-padding-3 {
    padding: 3rem !important;
}

.ub-padding-4 {
    padding: 4rem !important;
}

.ub-padding-top-0 {
    padding-top: 0 !important;
}

.ub-padding-top-half {
    padding-top: 0.5rem !important;
}

.ub-padding-top-1 {
    padding-top: 1rem !important;
}

.ub-padding-top-2 {
    padding-top: 2rem !important;
}

.ub-padding-top-3 {
    padding-top: 3rem !important;
}

.ub-padding-top-4 {
    padding-top: 4rem !important;
}

.ub-padding-bottom-0 {
    padding-bottom: 0 !important;
}

.ub-padding-bottom-half {
    padding-bottom: 0.5rem !important;
}

.ub-padding-bottom-1 {
    padding-bottom: 1rem !important;
}

.ub-padding-bottom-2 {
    padding-bottom: 2rem !important;
}

.ub-padding-bottom-3 {
    padding-bottom: 3rem !important;
}

.ub-padding-bottom-4 {
    padding-bottom: 4rem !important;
}


/* Transitions */
.transition-btn-bg-blue:hover,
.transition-btn-bg-blue:active,
.transition-btn-bg-blue-50:hover,
.transition-btn-bg-blue-50:active,
.transition-btn-bg-transparent:hover,
.transition-btn-bg-transparent:active,
.transition-btn-bg-dark-grey:hover,
.transition-btn-bg-dark-grey:active {
    transition: background-color 0.4s, color 0.4s !important;
}

.transition-btn-bg-blue:hover,
.transition-btn-bg-blue:active {
    background-color: var(--ub-blue) !important;
    color: #fff !important;
}

.transition-btn-bg-blue-50:hover,
.transition-btn-bg-blue-50:active {
    background-color: var(--ub-blue-50) !important;
    border-color: var(--ub-blue-50) !important;
}

.transition-btn-bg-transparent:hover,
.transition-btn-bg-transparent:active {
    background-color: transparent !important;
    border-color: var(--ub-blue) !important;
    color: var(--black) !important;
}

.transition-btn-bg-dark-grey:hover,
.transition-btn-bg-dark-grey:active {
    background-color: var(--ub-dark-grey) !important;
    border-color: var(--ub-dark-grey) !important;
    color: var(--white) !important;
}

/* transition back to normal */
.transition-btn-bg-blue,
.transition-btn-bg-blue-50,
.transition-btn-bg-transparent,
.transition-btn-bg-dark-grey {
    transition: background-color 0.2s, color 0.2s !important;
}


html .hidden {
  display: none !important;
}

@media (max-width: 750px) {
    html .hide-on-small-screens {
        display: none;
    }
}

/* Inderes Widgets */
.InderesWidget table p,
.InderesWidget table th strong {
    font-family: "Swiss 721 W03 Roman"; /* renders the € sign larger and is more readable than the light font */
}
/*** General form styles */

/* .umbraco-forms-* are classes for froms created with Umbraco Forms in the backoffice */
/* .ub-forms-* are classes for custom forms (manual markup) */

.umbraco-forms-container,
.ub-forms-container {
  --color-form-primary: transparent;
  --root-font-size: 16;
  --color-input-error-bg: rgba(180, 10, 10, 0.08);
  --color-input-error-text: rgb(180, 10, 10);
  --color-input-focus-bg: #fafbfc;
}

.umbraco-forms-page,
.ub-forms-page {
  box-shadow: 0px 0px 2px var(--ub-grey);
  border: 1px solid var(--ub-dark-blue-50);
  --color-form-btn: #00678B;
  --color-form-btn-transp: #00668bcd;
  padding: 4rem;
  color: var(--black);
}

fieldset {
  border: none;
}

body .umbraco-forms-page .umbraco-forms-fieldset,
body .ub-forms-page .umbraco-forms-fieldset {
  padding: 0;
}

.umbraco-forms-field,
.ub-forms-field  {
  margin-bottom: 1.2rem;
}

.umbraco-forms-field-wrapper,
.ub-forms-field-wrapper {
  margin-top: 0.5rem;
}

/* Avoid rendering a scrollbar by forcing the recaptcha div to be at least 82px tall */
.umbraco-forms-field-wrapper .g-recaptcha > div {
  min-height: 82px;
}

body .umbraco-forms-form .umbraco-forms-page {
  color: var(--black);
}

/* Remove the top margin from the first header of the form */
.umbraco-forms-page > fieldset > .row-fluid > .umbraco-forms-container > .umbraco-forms-field > .umbraco-forms-field-wrapper .ub-h1,
.umbraco-forms-page > fieldset > .row-fluid > .umbraco-forms-container > .umbraco-forms-field > .umbraco-forms-field-wrapper .ub-h2,
.umbraco-forms-page > fieldset > .row-fluid > .umbraco-forms-container > .umbraco-forms-field > .umbraco-forms-field-wrapper .ub-h3,
.umbraco-forms-page > fieldset > .row-fluid > .umbraco-forms-container > .umbraco-forms-field > .umbraco-forms-field-wrapper .ub-h4,
.ub-forms-page > fieldset > .row-fluid > .umbraco-forms-container > .umbraco-forms-field > .umbraco-forms-field-wrapper .ub-h1,
.ub-forms-page > fieldset > .row-fluid > .umbraco-forms-container > .umbraco-forms-field > .umbraco-forms-field-wrapper .ub-h2,
.ub-forms-page > fieldset > .row-fluid > .umbraco-forms-container > .umbraco-forms-field > .umbraco-forms-field-wrapper .ub-h3,
.ub-forms-page > fieldset > .row-fluid > .umbraco-forms-container > .umbraco-forms-field > .umbraco-forms-field-wrapper .ub-h4 {
  margin-top: 0;
}

/* Fields, wrappers, inputs and labels */

.umbraco-forms-page label.umbraco-forms-label,
.umbraco-forms-page div.umbraco-forms-field-wrapper,
.ub-forms-page label.ub-forms-label,
.ub-forms-page div.ub-forms-field-wrapper {
  margin-bottom: 0.4rem;
  overflow: auto;
}

.umbraco-forms-page label.umbraco-forms-label:not(.umbraco-forms-hidden),
.ub-forms-page label.ub-forms-label {
  display: block;
  margin-top: 1.6rem;
  font-family: "Swiss 721 W03 Light", Arial, Helvetica, sans-serif;
  font-size: 1.8rem;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: .4px;
  color: var(--color-ub-grey);
}

.umbraco-forms-page .umbraco-forms-hidden {
  display: none;
}

.umbraco-forms-page .umbraco-forms-field-wrapper input.text,
.umbraco-forms-page .umbraco-forms-field-wrapper textarea,
.ub-input,
.ub-textarea,
.ub-select {
  border: 1px solid var(--ub-dark-blue-50);
}

.umbraco-forms-page .umbraco-forms-field-wrapper input.text,
.umbraco-forms-page .umbraco-forms-field-wrapper textarea,
.ub-input,
.ub-textarea,
.ub-select__option {
  font-family: "Swiss 721 W03 Light", Arial, Helvetica, sans-serif;
  font-size: 1.6rem;
  width: 100%;
  padding: 1.2rem 1.6rem;
  max-width: 100%;
  color: var(--black);
}

.ub-select__option {
  background: var(--white);
  padding: 1.2rem 1.6rem;
}

.umbraco-forms-page .umbraco-forms-field-wrapper input.text:focus-visible,
.umbraco-forms-page .umbraco-forms-field-wrapper input.text:focus-within,
.umbraco-forms-page .umbraco-forms-field-wrapper textarea:focus-visible,
.umbraco-forms-page .umbraco-forms-field-wrapper textarea:focus-within,
.ub-input:focus-visible,
.ub-input:focus-within,
.ub-textarea:focus-visible,
.ub-textarea:focus-within {
  background-color: var(--color-input-focus-bg);
  outline: none;
}

.umbraco-forms-page .umbraco-forms-field-wrapper input.text[aria-invalid=true],
.umbraco-forms-page .umbraco-forms-field-wrapper textarea[aria-invalid=true],
.ub-input[aria-invalid=true],
.ub-textarea[aria-invalid=true] {
  background-color: var(--color-input-error-bg);
}

.ub-select-wrapper {
  position: relative;
}

.ub-select:hover,
.ub-select__option:hover {
  background: var(--ub-grey-10);
  cursor: pointer;
}

.ub-select[data-active="true"] {
  background: var(--ub-dark-blue-50);
}

.ub-select__options[data-active="false"] {
  display: none;
}

.ub-select__options {
  border: 1px solid var(--ub-dark-blue-50);
  border-top: 0;
  left: 0;
  right: 0;
  z-index: 99999;
  position: absolute;
  max-height: 350px;
  overflow-y: scroll;
}

.ub-select__option[data-key=""] {
  color: var(--ub-dark-grey);
}


.ub-select-wrapper * {
  /* -- Firefox */
  scrollbar-color: var(--ub-grey-25) var(--ub-grey-10);
  scrollbar-width: thin;
}

.ub-select-wrapper *::-webkit-scrollbar {
  width: 8px;
  background: var(--ub-grey-25);
}

.ub-select-wrapper *::-webkit-scrollbar-track {
  background: var(--ub-grey-10);
}

.ub-select-wrapper *::-webkit-scrollbar-thumb {
  background: var(--ub-grey-25);
}

/* Checkboxes */

/* Use a reverse flow flex box for the checbox wrapper to show checkboxes on the left of the
help-block */
body .umbraco-forms-form .umbraco-forms-page .umbraco-forms-field.checkbox {
  display: flex;
  flex-direction: row-reverse;
  justify-content: start;
  flex-wrap: wrap;
  align-items: center;
}

/* Make the checkbox label full width to make it have an entire row for itself */
body .umbraco-forms-form .umbraco-forms-page .umbraco-forms-field.checkbox label {
  flex-basis: 100%;
}

body .umbraco-forms-form .umbraco-forms-page .umbraco-forms-field.checkbox input {
  margin: 0.4rem 0.8rem 0.4rem 0;
}

body .umbraco-forms-form .umbraco-forms-page .umbraco-forms-field.checkbox .field-validation-error {
  position: absolute;
  font-size: 1.4rem;
}

/* Umbraco forms, for some reason, adds a whitespace character before the followings types of input,
adding 4.25px of empty space between the label and the input. So we use 0.375rem for the right
margin to get 0.8rem of spacing in total as with the normal checkbox inputs. */
body .umbraco-forms-form .umbraco-forms-page .umbraco-forms-field-wrapper .radiobuttonlist input,
body .umbraco-forms-form .umbraco-forms-page .umbraco-forms-field-wrapper .checkboxlist input,
body .umbraco-forms-form .umbraco-forms-page .umbraco-forms-field-wrapper .radiobuttonlist label,
body .umbraco-forms-form .umbraco-forms-page .umbraco-forms-field-wrapper .checkboxlist label {
  margin: 0.4rem 0.375rem 0.8rem 0;
}


/* Validation errors */

.umbraco-forms-page .field-validation-error,
.ub-forms-page .field-validation-error {
  font-size: 1.5rem;
  color: var(--color-input-error-text);
  line-height: 1.56;
  letter-spacing: .4px;
}

.umbraco-forms-page .field-validation-error::before,
.ub-forms-page .field-validation-error::before {
  line-height: 1.56;
  content: "* ";
}

/* Submit button */

.umbraco-forms-page input[type="submit"],
.ub-forms-page .submit-btn {
  padding: 1.6rem 4rem;
  margin-top: 3rem;
  font-family: "Swiss 721 W03 Bd Cnd", Arial, Helvetica, sans-serif;
  background-color: var(--ub-blue);
  color: var(--white);
  font-size: 17px;
  text-align: center;
  cursor: pointer;
  border: 0;
}

.umbraco-forms-page input[type="submit"]:hover,
.umbraco-forms-page input[type="submit"]:active,
.ub-forms-page .submit-btn:hover,
.ub-forms-page .submit-btn:active {
  background-color: var(--ub-blue-50) !important;
  border-color: var(--ub-blue-50) !important;
  transition: background-color 0.4s, color 0.4s !important;
}

/* The message shown after form is submitted */
body span.umbraco-forms-submitmessage,
body span.ub-forms-submitmessage {
  display: block;
  text-align: center;
}


/*** Rich Text Form */

/* The class 'richtext-form' must be added to the form. In Umbraco forms, groups are turned into
legend elements, but using this class hides those elements. The labels for checkboxes are also
hidden. */

.richtext-form fieldset.umbraco-forms-fieldset > legend,
.richtext-form fieldset.umbraco-forms-fieldset > legend + div div.checkbox > label,
.richtext-form fieldset.umbraco-forms-fieldset > legend + div div.richtext > label {
  display: none;
}

.richtext-form fieldset.umbraco-forms-fieldset > legend + div div.col-md-12 {
  display: flex;
}

.richtext-form fieldset.umbraco-forms-fieldset > legend + div div.richtext p {
  line-height: 1.22; /* Vertically aligns the text with the checbox */
}

/*** Narrow form inside AsideContent macro */

.column-aside .umbraco-forms-page {
  padding: 2rem;
}

.column-aside .umbraco-forms-page .umbraco-forms-label {
  font-size: 1.6rem;
}

.column-aside .umbraco-forms-page .umbraco-forms-field-wrapper input.text,
.column-aside .umbraco-forms-page .umbraco-forms-field-wrapper textarea {
  font-size: 1.5rem;
  padding: 0.4rem;
  max-width: 100%;
}


/*** Subscribe to newsletter banner form */

@media screen and (max-width: 740px) {
  .form-subscribe-newsletter-banner .umbraco-forms-page {
    padding: 0 max(calc(50% - 200px), 2rem);
  }
}

.form-subscribe-newsletter-banner {
  font-family: "Swiss 721 W03 Light", Arial, Helvetica, sans-serif;
}

.form-subscribe-newsletter-banner label {
  color: #ddd;
}

body .form-subscribe-newsletter-banner input.text {
  font-size: 1.7rem;
  border: none;
  border-bottom: 1px solid #fff;
}

body .form-subscribe-newsletter-banner input.text::placeholder {
  color: hsla(0, 0%, 100%, .5);
  opacity: 1;
  font-family: "Swiss 721 W03 Light", Arial, Helvetica, sans-serif;
}

body .form-subscribe-newsletter-banner input.text.valid {
  color: #fff;
}

body .form-subscribe-newsletter-banner .umbraco-forms-field-wrapper input.text[aria-invalid=true] {
  border-radius: 4px 4px 0 0;
  background-color: rgba(204, 0, 0, 0.438);
  color: #fff;
}

body .form-subscribe-newsletter-banner input {
  background-color: transparent;
}

.form-subscribe-newsletter-banner .umbraco-forms-page .umbraco-forms-field-wrapper input.text:focus-visible,
.form-subscribe-newsletter-banner .umbraco-forms-page .umbraco-forms-field-wrapper input.text:focus-within {
  background-color: var(--ub-blue-5);
}


body .form-subscribe-newsletter-banner .field-validation-error {
  font-size: 1.5rem;
  color: var(--color-input-error-text);
  letter-spacing: .4px;
}

body .form-subscribe-newsletter-banner span.field-validation-error {
  font-size: 1.4rem;
  display: block;
  max-width: 400px;
  padding: 0.5rem;
}

body .form-subscribe-newsletter-banner span.field-validation-error {
  color: #fff !important;
}

body .form-subscribe-newsletter-banner .umbraco-forms-page {
  box-shadow: none;
  background-color: transparent;
}

body .form-subscribe-newsletter-banner .umbraco-forms-field {
  max-width: 400px;
}

body .form-subscribe-newsletter-banner input[type="submit"] {
  font-family: "Swiss 721 W03 Bd Cnd", Arial, Helvetica, sans-serif;
  background-color: transparent;
  border: solid 1px #fff;
  margin: 1rem 0;
  padding: 1.2rem 4rem;
  cursor: pointer;
  transition: background-color .1s linear;
}

body .form-subscribe-newsletter-banner input[type="submit"]:hover {
  background-color: #859ca8;
  transition: background-color .3s linear;
}

body .form-subscribe-newsletter-banner .umbraco-forms-page,
body .form-subscribe-newsletter-banner .umbraco-forms-field-wrapper input.text {
  border: 0;
  color: var(--ub-light-grey);
}

body .form-subscribe-newsletter-banner .umbraco-forms-field-wrapper input.text {
  border-bottom: 1px solid var(--ub-light-grey);
}

body .form-subscribe-newsletter-banner .checkbox,
body .form-subscribe-newsletter-banner .richlink {
  font-size: 1.5rem;
  margin-bottom: 2.4rem;
}

body .form-subscribe-newsletter-banner .checkbox span.field-validation-error {
  position: absolute;
}

/* Form field name has to be Data Consent for the following to work */

body .form-subscribe-newsletter-banner .dataconsent label.umbraco-forms-label {
  display: none;
}

.form-subscribe-newsletter-banner .dataconsent .umbraco-forms-tooltip.help-block,
body .form-subscribe-newsletter-banner p {
  color: var(--ub-light-grey);
  font-size: 1.5rem;
}

body .form-subscribe-newsletter-banner a {
  color: var(--ub-grey-25);
}

body .form-subscribe-newsletter-banner span.umbraco-forms-submitmessage {
  max-width: 400px;
  color: var(--ub-light-grey);
}
.fund-card {
    text-align: center;
    --fund-img-size: 80px;
    color: var(--color-ub-grey);
    --svg-arrow-size: 1.6rem;
}

    .fund-card a {
        font-family: "Swiss 721 W03 Light",Arial,Helvetica,sans-serif;
        display: flex;
        justify-content: center;
        gap: 0.5rem;
    }

        .fund-card a svg {
            width: var(--svg-arrow-size);
            height: var(--svg-arrow-size);
            vertical-align: middle;
        }

    .fund-card .img-wrap {
        overflow: hidden;
        border-radius: 50%;
        margin: 2rem auto;
        height: var(--fund-img-size);
        width: var(--fund-img-size);
        display: flex;
        justify-content: center;
    }

.txt-upper-case {
    text-transform: uppercase;
}

.fund-card h4 {
    font-weight: normal;
    font-size: 2.7rem;
    margin: 0;
    font-family: "Swiss 721 W03 Light";
    text-transform: none;
    line-height: initial;
}

.card-container:hover h4,
.card-container:focus-within h4 {
    color: #fff;
}

.fund-card .description {
    font-family: "Swiss 721 W03 Light Cnd";
}

    .fund-card .description a {
        margin-top: 2rem;
    }

.minimum-invest {
    margin-top: 0.3rem;
    padding-bottom: 3rem;
}

.star-rating {
    margin-bottom: 1rem;
}

.layer-dynamic {
    opacity: 0;
    position: absolute;
    z-index: 1;
}

    .layer-dynamic a {
        text-decoration: none;
        color: #fff;
        font-size: 1.6rem;
    }

        .layer-dynamic a:hover,
        .layer-dynamic a:focus {
            text-decoration: underline;
            text-decoration-thickness: 1px;
            text-underline-offset: 0.4rem;
        }

.card-container:hover,
.card-container:focus-within {
    background: linear-gradient(#007b9c,#00394c);
}

    .card-container:hover .layer-static,
    .card-container:focus-within .layer-static {
        opacity: 0;
    }

    .card-container:hover .layer-dynamic,
    .card-container:focus-within .layer-dynamic,
    .card-container:hover .buttons, .card-container:focus-within .buttons {
        opacity: 1;
    }

    .card-container:hover .fund-card,
    .card-container:focus-within .fund-card {
        color: #fff;
    }

.card-container.external-fund:hover,
.card-container.external-fund:focus-within {
    /* The latter color is from Asilo's styles as per the client's request */
    background: linear-gradient(var(--ub-dark-grey), #33343e);
}

.fund-card {
    position: relative;
}

.buttons {
    opacity: 0;
    position: absolute;
    display: flex;
    justify-content: center;
    width: 100%;
    bottom: 1.5rem;
    gap: 1rem;
}

    .buttons a {
        display: block;
        font-family: "Swiss 721 W03 Bd Cnd",Arial,Helvetica,sans-serif;
        border: solid 1px #fff;
        padding: 10px;
        white-space: nowrap;
        font-size: 1.6rem;
        line-height: 1.53;
        text-decoration: none;
        color: #fff;
    }

        .buttons a:hover, .buttons a:focus {
            background-color: #222;
            text-decoration: none;
        }

.card-container {
    width: 286px;
}

@media screen and (min-width: 900px) {
    .card-container {
        padding: 0;
        margin: 0;
    }

    .fund-card .description {
        padding: 0 1rem;
    }

    .flex-custom {
        gap: 0.8rem;
    }
}

/* [single fund page] */
.content-header {
    text-align: center;
}

.fund-types {
    color: var(--color-ub-grey);
    text-align: center;
}

    .fund-types span {
        padding: 4px 8px;
    }

    .fund-types > span:not(:last-child) {
        border-right: 1px solid var(--color-ub-grey);
    }

.pretext {
    margin: 2rem auto;
    text-align: center;
    max-width: 650px;
}


/* ------------Fund stats */

div.fundstats div#stockchart.multichart .highcharts-container .highcharts-label.highcharts-no-data span {
    font-family: "Swiss 721 W03 Light Cnd" !important;
    color: var(--color-ub-grey) !important;
    text-align: center;
    font-size: 18px !important;
    line-height: 1.36;
}

.pretext {
    display: block;
    font-family: "Swiss 721 W03 Light Cnd";
    text-align: center;
    font-size: 18px;
    line-height: 1.36;
    max-width: 650px;
    padding: 24px;
    margin: 0 auto;
}

@media screen and (min-width: 990px) {

    .fund-content {
        flex: 1 1 50%;
        order: 1;
        min-width: 600px;
        padding: 0;
    }
}



@media screen and (min-width: 990px) {
    .ub-center > div {
        flex: unset;
    }

    .action-buttons-wide-column {
        flex-flow: column;
    }

    .make-note, .start-saving {
        max-width: 227px;
        width: 100%;
        margin-right: 0;
    }

    .action-buttons-wide-column .make-note {
        margin: 0;
        margin-bottom: 16px;
    }

    .action-buttons-wide-column .start-saving {
        margin: 0;
        margin-bottom: 16px;
    }
}


.highcharts-scrollbar-thumb {
    fill: #00678b;
    rx: 8;
    ry: 8;
}


/*  [fundstats] */
.stats-wrap a {
    color: var(--ub-blue);
    font-size: 14px;
    font-weight: 400;
    font-stretch: 75%;
}

@media screen and (max-width: 1023px) {
    .stats-wrap a {
        font-size: 16px;
    }
}

.stats-wrap {
    margin: 0 auto;
    max-width: 950px;
    justify-content: space-between;
    flex-flow: row wrap;
}

    .stats-wrap .fund-group-headers {
        display: none;
    }

@media screen and (min-width: 641px) and (max-width: 1023px) {
    .stats-wrap {
        display: flex;
    }
}

.stats-wrap .stats-list dt {
    font-weight: bold;
}

.stats-wrap .fund-group-headers .stats-list dl dd {
    font-family: "Swiss 721 W03 Light", Arial, Helvetica, sans-serif;
    font-size: 17px;
    font-weight: 400;
    color: var(--color-ub-grey);
    line-height: 1.53;
}

.stats-wrap .fund {
    border-radius: 8px;
    padding: 0x;
    margin: 0 0 1rem;
}

@media screen and (min-width: 641px) {
    .stats-wrap .fund {
        width: 48%;
    }
}

@media screen and (min-width: 1024px) {
    .stats-wrap .fund {
        width: auto;
    }

    .stats-wrap .fund ul {
        border-top: solid 0.8px #ccc;
    }
}

.stats-wrap .fund ul {
    margin: 0;
    padding: 12px 0;
}

    .stats-wrap .fund ul dd {
        margin: 0;
    }

    .stats-wrap .fund ul li {
        list-style: none;
        display: block;
    }

.stats-wrap .fund a {
    text-decoration: none;
}

@media screen and (max-width: 1023px) {
    .stats-wrap .fund div {
        display: flex;
        justify-content: space-between;
        padding: 5px 0;
        border-bottom: 1px solid var(--ub-grey-25)
    }
}

.stats-wrap .negative-change {
    color: #e90000;
}

@media screen and (min-width: 1024px) {
    .fund ul {
        display: flex;
    }

        .fund ul dl {
            display: flex;
            flex-flow: row wrap;
        }

    .fund .mobile-margin {
        margin-bottom: 0;
    }

    .stats-wrap .stats-h.fund-type-container {
        display: flex;
        flex-direction: row;
        padding-left: 32px;
        padding-right: 16px;
        /* justify-content: center; */
        align-items: center;
    }

    .stats-h h3.fund-type {
        margin: 0;
    }


    .stats-h {
        width: 20%;
        min-width: 200px;
    }

    .stats-wrap .fund li.stats-list {
        flex: 1;
    }

        .stats-wrap .fund li.stats-list dl {
            justify-content: space-evenly;
            margin: 0;
            display: flex;
            height: 100%;
        }

        .stats-wrap .fund li.stats-list dt {
            display: none;
        }

        .stats-wrap .fund li.stats-list dl div {
            display: flex;
            align-items: center;
            justify-content: end;
            width: 9%;
            font-size: 16px;
        }

    .stats-wrap .fund {
        margin: 0;
        border-radius: 0;
        border: none;
    }

    .stats-wrap .fund-group-headers {
        font-size: 12px;
        display: block;
        font-weight: bold;
    }

        .stats-wrap .fund-group-headers ul {
            margin: 0;
            padding: 0px;
            display: flex;
        }

            .stats-wrap .fund-group-headers ul li {
                list-style-type: none;
                padding: 0;
                margin: 0;
            }

        .stats-wrap .fund-group-headers .stats-list {
            flex: 1;
        }

        .stats-wrap .fund-group-headers dl {
            justify-content: space-evenly;
            display: flex;
            margin: 0;
            flex-flow: row wrap;
        }

        .stats-wrap .fund-group-headers dd {
            width: 9%;
            margin: 0;
            text-align: right;
        }
}

@media screen and (max-width: 1023px) {
    .stats-wrap .fund ul {
        padding: 0;
        font-size: 16px;
    }

        .stats-wrap .fund ul .stats-h {
            background: #007a9b;
            border-radius: 5px 5px 0 0;
            padding: 5px 10px;
            margin-bottom: 5px;
        }

        .stats-wrap .fund ul .stats-list {
            padding: 0 10px;
        }

            .stats-wrap .fund ul .stats-list small {
                font-size: 12px;
            }

        .stats-wrap .fund ul a {
            display: block;
            color: #fff;
        }

            .stats-wrap .fund ul a:hover {
                text-decoration: underline;
            }
}

.fund-group {
    margin: 0 auto 60px auto;
    max-width: 950px;
    width: 100%;
}

    .fund-group h3 {
        text-align: center;
    }

@media screen and (min-width: 1024px) {
    .fund-group h3 {
        text-align: left;
    }
}
/*  [/fundstats] */

/*  [multichart] */
.stats-wrap .fund ul li.stats-h {
    display: flex;
    align-items: center;
    padding-right: 16px;
}

.multichart {
    max-width: 950px;
    margin: 0 auto;
}

.stats-h button {
    position: relative;
    display: block;
    background-color: var(--color-ub-grey);
    width: 17px;
    height: 17px;
    border: 0;
    border-radius: 10px;
    -webkit-transition-duration: .15s;
    transition-duration: .15s;
    cursor: pointer;
    margin-right: 15px;
}

    .stats-h button:hover {
        background-color: #333;
    }

    .stats-h button.active {
        background-color: #00678b;
    }

        .stats-h button.active:hover {
            background-color: #333;
        }

    .stats-h button:before {
        content: "";
        position: absolute;
        top: 5px;
        left: 8px;
        background-color: #fff;
        width: 1px;
        height: 7px;
    }

    .stats-h button:after {
        content: "";
        position: absolute;
        top: 8px;
        left: 5px;
        background-color: #fff;
        width: 7px;
        height: 1px;
    }

    .stats-h button.active:before {
        visibility: hidden;
    }

    .stats-h button.active:after {
        content: "";
        position: absolute;
        top: 8px;
        left: 5px;
        background-color: #fff;
        width: 7px;
        height: 1px;
    }

/* [single fund] */

@media screen and (max-width: 1023px) {
    .stats-h button {
       background: var(--ub-grey);
    }

    .stats-h button.active {
        background: var(--ub-dark-blue);
     }
}

.link-btns {
    display: flex;
    gap: 2rem;
    margin-top: 4.4rem;
}

.single-fund-page .link-btn {
    font-family: "Swiss 721 W03 Bd Cnd";
    color: #fff;
    background: #00678b;
    padding: 1.5rem 2rem;
    display: block;
    font-size: 1.7rem;
    text-align: center;
    text-decoration: none;
    margin-bottom: 2rem;
}

.link-btn:hover, .link-btn:focus {
    background-color: #333;
}

.fund-title {
    color: var(--color-ub-grey);
    padding-top: 4.4rem;
    margin-bottom: 1.8rem;
    text-align: center;
}

@media screen and (min-width: 720px) {
    .two-column {
        display: flex;
        justify-content: space-between;
    }

        .two-column .column-main {
            flex: 1;
            order: 0;
        }

        .two-column .chart {
            max-width: 95%;
        }

        .two-column .column-aside {
            width: 250px;
            order: 1;
        }

    .single-fund-page .link-btns {
        flex-flow: row wrap;
    }

    .single-fund-page .link-btn {
        flex: 1 0 100%;
    }
}

@media screen and (max-width:720px) {
    .two-column {
        display: flex;
        flex-flow: column;
        align-items: center;
        justify-content: center;
    }

        .two-column .column-main {
            flex: 1;
            order: 1;
        }

        .two-column .column-aside {
            order: 0;
        }
}

/* Avoid rendering a scrollbar by forcing the compact recaptcha div to be at least 148px tall */
.two-column .umbraco-forms-field-wrapper .g-recaptcha > div {
    min-height: 148px;
}

@media screen and (min-width: 500px) {
}

.attachments {
    display: flex;
    flex-flow: row wrap;
    max-width: 750px;
    margin: auto;
    gap: 1rem;
}

.item-attachment {
    display: flex;
    gap: 0.875rem;
    flex: 1 0 100%;
}

@media screen and (min-width: 500px) {
    .item-attachment {
        flex: 1 0 calc(50% - 1rem);
    }
}

a.item-attachment {
    text-decoration: none;
}

.icon-txt {
    background-color: var(--ub-blue);
    color: #fff;
    display: block;
    text-transform: uppercase;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1rem;
    border-radius: 50%;
    height: 3rem;
    width: 3rem;
    text-align: center;
    padding-top: 1rem;
    flex: 0 0 auto;
}

.item-attachment .link-txt {
    margin: auto 0;
    font-family: "Swiss 721 W03 Light Cnd",Arial,Helvetica,sans-serif;
    font-size: 15px;
    color: var(--ub-blue);
}

.definition {
    max-width: 950px;
    margin: 0 auto;
}

.euro {
    font-size: 2.8rem;
    line-height: 1rem;
    margin: 0 0.5rem;
}

.euro-alt {
    margin-right: 0;
}

.month {
    font-size: 1.4rem;
    line-height: 2rem;
}

.fundstats .fund-group h3 {
    font-size: 1.7rem;
    font-family: "Swiss 721 W03 Bd Cnd";
    line-height: auto;
    letter-spacing: .6px;
}

.single-fund-page {
    gap: 2rem;
}

    .single-fund-page .column-aside img {
        width: auto;
        max-width: 100%;
        height: auto;
    }

.fund-card .fund-type {
    text-transform: uppercase;
    margin-top: 0;
    margin-bottom: 3rem;
    font-family: "Swiss 721 W03 Light Cnd";
    letter-spacing: .4px;
    font-size: 1.5rem;
}

.fund-card .information .profit {
    margin-top: 2rem;
    font-family: "Swiss 721 W03 Light Cnd";
}
/* [firefox flex issue fix] */
@media screen and (min-width: 580px) {
    .block .flex-func .js-filters {
        max-width: 240px;
    }
}

.flex-fundlist {
    display: flex;
    flex-flow: row wrap;
    max-width: 750px;
    margin: 0 auto;
}

    .flex-fundlist a {
        /* display: flex; */
        border-top: 1px solid #e3e9ed;
        width: 300px;
        text-decoration: none;
        padding-top: 1.5rem;
        color: #00678b;
        margin: 0 3.2rem 1.4rem 0;
        font-size: 15px;
        font-family: "Swiss 721 W03 Light Cnd",Arial,Helvetica,sans-serif;
    }
.carousel, .carousel * {
  box-sizing: border-box;
}

.blockCarousel {
  padding: 2rem 0 4rem 0;
  background-color: rgba(0,103,139,.05);

  --carousel-height: 200px;
  --slide-width: calc(100% / 1);

  --color-active: #00678B;
  --color-static: #C6C6C6;
}

/** Wrapper **********************/
.carousel-wrap {
  max-width: 750px;
  margin: 0 auto;
}

.carousel {
  position: relative;
  width: calc(100% - 80px);
  /* max-width: 900px; */
  
  min-height: var(--carousel-height);
  margin: 0 auto;
  padding: 0 20px;
}

/** Previous/next buttons ********/
.carousel .previous,
.carousel .next {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 5px 10px;
  position: absolute;
  top: calc(50% - 3.5rem);
  cursor: pointer;
  border: 0;
  background: none;
}

  .previous { left: -30px; }
  .next { right: -30px; }

/** Slides track ***************/
.slides {
  list-style: none;
  padding: 0;
  margin: 0;
  
  display: flex;
  width: 100%;
  overflow: hidden;
}

/** Individual slides ***********/
.slide {
  flex: 0 0 calc(100% / 1 - 10px);
  margin: 0 5px;
  padding: 20px;
  height: var(--carousel-height);
  display: flex;
  align-items: center;
  
  /* background-color: white; */
}

/** Slide dots ******************/
.navigation {
  list-style: none;
  padding: 0;
  margin: 2rem 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.navigation li {
  display: inline-block;
}

.navigation li button {
  display: block;
  width: 1.6rem;
  height: 1.6rem;
  margin: 0 5px;
  border: 0;
  border-radius: 50%;
  background-color: var(--color-static);
  cursor: pointer;
}

.navigation li button:focus {
  outline-offset: 4px;
}

/** Active slide dot */
.navigation li button[aria-current="true"] {
  background-color: var(--color-active);
  width: 1.6rem;
  height: 1.6rem;
}


.sr-only {
  border: 0;
  clip: rect(0,0,0,0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

/* UB defs */
.carousel {
  --carousel-img-size: 120px;
  --slide-color: transparent;
}
.carousel .slide {
  align-items: start;
  gap: 30px;
}
.carousel .navigate svg {
  width: 40px;
  height: 40px;
  fill: #00678B;
  /* stroke: none; */
}
.quote-pic img {
  border-radius: 50%;
  width: var(--carousel-img-size);
}
.carousel blockquote {
  padding: 0;
  margin: 0 0 1.6rem 0;
  line-height: 1.56;
}
.carousel p {
  font-size: 1.7rem;
  margin: 0 0 1.6rem 0;
  font-style: italic;
  color: #56798a;
}
.slide {  
  transition: transform 0.15s;
  background-color: var(--slide-color);
  display: none;
}
.slide.active {
  display: flex;
}
.carousel-links {
  display: flex;
  flex-flow: row wrap;
  gap: 8px;
  padding: 0 5px;
}
.carousel-links a {
  font-family: "Swiss 721 W03 Bd Cnd";
  display: flex;
  text-align: center;
  padding: 10px;
  background-color: #fff;
  padding: 1.6rem;
  flex: 1;  
  justify-content: center;
  align-items: center;
  text-decoration: none;
  color: var(--color-ub-grey);
}

.carousel-links .active {
  background-color: var(--color-active);
  color: #fff;
}

.blockCarousel .subtitle {
  color: var(--color-ub-grey);
}

@media (max-width: 620px) {
  .carousel {
    width: 100%;
    padding: 0;
  }
  .carousel .navigate {
    top: 6rem;
    padding: 0;
  }
  .previous {
    left: 0;
  }
  .next {
    right: 0;
  }
  .slide.active {
    height: auto;
    flex-flow: row wrap;
    justify-content: center;
  }
  .quote-text {
    text-align: center;
  }
  .carousel-links a {
    display: none;
  }
  .carousel-links .active {
    display: block;
  }
}
.header-nav {
    --color-primary: rgb(0, 103, 139);
    --color-nav-lnk: #fff;
    --color-nav: rgba(var(--ub-dark-blue-rgb), 0.92);
    --color-nav-btn: #859ca8;
    --color-nav-top: var(--color-ub-grey);
    padding: 1rem 0;
}

.header-logo {
    align-self: center;
    margin-right: 2rem;
}

    .header-logo img {
        width: 50px;
    }

nav ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    color: var(--white);
}

.megamenu {
    box-sizing: border-box;
    overflow: auto;
    max-height: calc(100vh - 80px);
}

.megamenu {
    background-color: var(--color-nav);
    color: #fff;
    padding: 2rem 5rem;
    box-shadow: 2px 4px 6px rgb(0 0 0 / 30%);
}

    .megamenu p {
        font-weight: bold;
        color: #b8d5e4;
        margin: 0;
        padding: 0;
    }

.topnav a,
.mobile-nav a {
    text-decoration: none;
    display: block;
    color: var(--color-nav-top);
}

.mobile-nav a {
    color: var(--color-ub-blue);
}


.megamenu a {
    color: var(--color-nav-lnk);
    font-family: "Swiss 721 W03 Cnd";
    font-size: 1.7rem;
}

.megamenu ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.nav-section-title {
    font-family: "Swiss 721 W03 Blk";
    color: #9ec6da;
    font-size: 1.7rem;
    margin-bottom: 0.8rem;
    word-wrap: break-word;
}

.nav-wrap {
    display: flex;
    gap: 1.5rem;
    margin-top: 2rem;
}

.header-nav .flex {
    display: flex;
}

/* [megamenu desktop] */
@media (min-width: 1150px) {
    .mobile {
        display: none;
    }

    .navbar-toggler {
        display: none;
    }

    .icon-toggle {
        display: none;
    }

    .header-nav .flex {
        position: relative;
    }

    .level-1 > li > a {
        padding: 2rem;
    }

    .topnav {
        flex: 1;
        display: flex;
        justify-content: space-between;
        font-size: 1.7rem;
    }

    .megamenu {
        position: absolute;
        left: 0;
        width: 100%;
        top: 100%;
        z-index: 10;
    }

        .megamenu a {
            padding: 0.36rem 0;
            font-size: 1.6rem;
        }

    .level-1 > li:hover .megamenu,
    .level-1 > li:focus .megamenu,
    .level-1 > li:focus-within .megamenu {
        display: block;
    }

    .desktop-topnav-buttons {
        gap: 20px;
        display: flex;
    }

    .level-1 > li {
        margin: auto;
    }
}

a.current {
    text-decoration: underline;
}

.level-1 {
    display: flex;
}

    .level-1 a:hover {
        text-decoration: underline;
        text-decoration-color: var(--ub-blue-50);
    }


.megamenu {
    display: none;
}

.header-nav .flex {
    justify-content: space-between;
}

/* [mobile nav] */
@media (max-width: 1149px) {
    body.mobile-nav-open {
        /* body overflow is hidden to hide main scrollbar when modal window is open */
        overflow-y: hidden;
        height: 100%;
        position: relative;
    }

    header {
        border-bottom: 3px var(--ub-grey-10) solid;
    }

    .desktop {
        display: none;
    }

    .header-logo {
        margin-right: 0;
    }

    .mobile-page-title {
        color: #a35216;
        align-self: center;
        font-size: 1.8rem;
        font-weight: 600;
        font-family: "Swiss 721 W03 Roman";
    }

    .mobile-nav-container {
        position: relative;
    }

    .mobile-nav {
        --svg-icon-color: var(--color-ub-blue);
        --svg-arrow-size: 2.4rem;

        display: none;
        position: absolute;
        overflow-y: scroll;
        height: 100vh;
        background-color: #fff;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 4;
        padding: 0 2rem;
    }

    .mobile-nav[attr-state='open'] {
        display: block;
    }

    nav.mobile {
        flex: 1;
        padding: 1rem 0;
        position: relative;
    }

    nav.mobile::before  {
        content: "";
        display: block;
        position: absolute;
        left: -100px;
        height: 76px;
        height: calc(100% - 7px);
        pointer-events: none;
        width: calc(100vw + 100px);
        border-bottom: 3px var(--ub-grey-10) solid;
    }

    .mobile-nav::after  {
        content: "";
        display: block;
        position: relative;
        left: -100px;
        width: calc(100vw + 100px);
        border-bottom: 3px transparent solid;
        box-shadow:  0 3px 3px rgb(0 0 0 / 30%)
    }

    .controls-container .mobile-level-2-back-link {
        display: flex;
    }

    .controls-container .mobile-level-2-back-link button {
        text-align: left;
    }

    .svg-container {
        display: flex;
        justify-content: flex-end;
        align-items: center;
    }

    .navbar-toggler,
    .svg-wrapper {
        border: none;
        background: none;
        cursor: pointer;
        padding: 0;
        width: 50px;
    }

        .navbar-toggler svg {
            fill: var(--color-nav-btn);
        }

    .level-1,
    .level-2 {
        display: flex;
        flex-direction: column;
        gap: 3rem;
        text-align: left;
        list-style: none;
        padding: 0;
        margin: 2rem 0;
    }

        .level-1 > li,
        .level-2 > li {
            display: flex;
            flex-flow: row wrap;
            min-height: 30px;
            cursor: pointer;
        }

            .level-1 > li > a,
            .level-2 > li > a {
                flex: 1;
                padding: 0;
                font-size: 1.8rem;
                font-weight: 600;
                letter-spacing: .4px;
                margin: 0;
            }

    .mobile a:hover {
        text-decoration: underline;
        text-decoration-color: var(--ub-dark-blue-50);
    }

    .mobile a.lang-btn:hover {
        text-decoration: none;
    }

    .mobile-level-2-title {
        font-family: "Swiss 721 W03 Roman";
        font-size: 1.8rem;
        font-weight: 600;
        text-align: center;
        color: var(--color-ub-blue);
    }

    /* Vertically center the text to be on the same line as the icons */
    .mobile-level-2-title:before {
        display: inline-block;
        vertical-align: middle;
        height: 100%;
    }

    .mobile-nav-dropdown-items {
        flex-basis: 100%; /* force the dropdown items container to a separate row */
        padding-left: 2rem;
        display: flex;
        flex-direction: column;
    }

    .mobile-nav-dropdown-items a.mobile-nav-dropdown-item {
        margin: 1.5rem 0;
        font-size: 1.7rem;
    }

    .mobile-svg-chevron-down[data-is-open='open'] {
        transform: rotate(180deg);
    }

    .icon-toggle {
        align-self: center;
        fill: var(--color-nav-top);
        cursor: pointer;
        position: relative;
        top: 0;
        right: 2rem;
    }

    .icon-toggle[attr-state='open'] {
        transform: rotate(180deg);
    }
}

.megamenu .menu-category {
    font-family: "Swiss 721 W03 Blk";
    color: white;
    margin-left: calc(1rem + 2px); /* Add the left border of the child li elements to get the same indent */
    margin-bottom: 2rem;
    font-size: 1.7rem;
}


.megamenu .level-2 {
    row-gap: 1.6rem;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
}

    .megamenu .level-2 li {
        flex: 1 0 100%;
        min-width: 160px;
    }

@media (min-width: 1150px) {
    .level-1 > li > a {
        font-family: "Swiss 721 W03 Light Cnd";
    }

    .megamenu .level-2 li {
        flex: 0 0 auto;
        text-align: left;
        border-left: 2px var(--ub-dark-blue-50) solid;
        padding: 0 1rem;
    }

    .menu-category {
        text-align: left;
    }
}

.lang-btn,
.lang-btn-active {
    text-transform: uppercase;
    font-size: 1.4rem;
}

.lang-btn {
    font-family: "Swiss 721 W03 Cnd";
}

.lang-btn-active {
    font-family: "Swiss 721 W03 Blk Cnd";
    color: var(--color-ub-grey);
}

/* ------------- */
.custom-btn-wrap {
    margin: auto;
}

.lang-selection {
    text-align: center;
}

@media (max-width: 1150px) {
    .menu-category {
        display: none;
    }

    .mobile-nav-buttons {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
        .mobile-nav-buttons .custom-btn-wrap {
            display: flex;
            justify-content: center;
            width: 100%;
        }

        .mobile-nav-buttons .oma-ub {
            position: relative;
            display: flex;
            padding: 1.6rem;
            flex: 1 0 100%;
            max-width: 400px;
            border: 1px solid #859ca8;
            justify-content: center;
            align-items: center;
        }

        .mobile-nav-buttons .oma-ub:hover {
            text-decoration: none;
        }

        .mobile-nav-buttons .oma-ub .icon-oma-ub-svg {
            position: static;
            margin-left: 1.6rem;
        }

        .mobile-nav-buttons .oma-ub .oma-ub-text {
            font-family: "Swiss 721 W03 Roman";
            font-weight: 700;
            font-size: 1.7rem;

        }

            .mobile-nav-buttons .oma-ub .icon-oma-ub-svg svg {
                width: var(--svg-icon-size);
                height: var(--svg-icon-size);
                stroke: var(--svg-icon-color);
                vertical-align: middle;
            }

    .lang-selection {
        display: flex;
        gap: 2rem;
        justify-content: center;
        margin: 3rem 0;
    }

    .lang-btn,
    .lang-btn-active {
        padding: 0.8rem;
        border: 1px solid var(--color-ub-blue);
        min-width: 4rem;
        text-align: center;
    }

    .lang-btn-active {
        color: #fff;
        background-color: var(--color-ub-blue);
    }
}

.mobile-svg-cancel {
    background-color: var(--svg-icon-color);
    height: 50px;
    mask: url("/images/cancel.svg") no-repeat center;
    -webkit-mask: url("/images/cancel.svg") no-repeat center;
    mask-size: 20px;
    -webkit-mask-size: 20px;
}

.mobile-svg-chevron-left {
    background-color: var(--svg-icon-color);
    height: 50px;
    mask: url("/images/chevron-left.svg") no-repeat center;
    -webkit-mask: url("/images/chevron-left.svg") no-repeat center;
    mask-size: 40px;
    -webkit-mask-size: 40px;
}

.mobile-svg-arrow-right {
    background-color: var(--svg-icon-color);
    height: 30px;
    mask: url("/images/menu-arrow-right.svg") no-repeat center;
    -webkit-mask: url("/images/menu-arrow-right.svg") no-repeat center;
    mask-size: 15px;
    -webkit-mask-size: 15px;
}

.mobile-svg-chevron-down {
    background-color: var(--svg-icon-color);
    height: 30px;
    mask: url("/images/chevron-down.svg") no-repeat center;
    -webkit-mask: url("/images/chevron-down.svg") no-repeat center;
    mask-size: 30px;
    -webkit-mask-size: 30px;
}

@media (max-width: 1149px) {
    .custom-btn-wrap {
        margin-top: 2rem;
    }
}

.megamenu a.level-4 {
    padding-left: 1rem;
}

.topnav {
    --svg-icon-color: #859ca8;
    --svg-arrow-size: 2rem;
}

    .topnav .icon-oma-ub-svg {
        display: block;
        position: absolute;
        right: 1rem;
    }

        .topnav .icon-oma-ub-svg svg {
            width: var(--svg-arrow-size);
            height: var(--svg-arrow-size);
            stroke: var(--svg-icon-color);
        }

    .topnav .oma-ub {
        font-family: "Swiss 721 W03 Bd Cnd";
        padding: 1.3rem 2rem;
        border: 1px solid #859ca8;
        margin: auto;
        display: flex;
        position: relative;
        padding-right: 4rem;
    }

.oma-ub:hover .icon-oma-ub-svg svg,
.oma-ub:focus .icon-oma-ub-svg svg {
    stroke: #fff;
    transition: 0.4s;
}


.animate-fade-in {
    animation-duration: 0.2s;
    animation-name: animate-fade-in;
  }

  @keyframes animate-fade-in {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }
.hero {
  display: block;
  --color-hero-main: #00678b;
  --color-hero-txt: #fff;
}
@media (max-width: 1149px) {
  .hero {
    margin-top: 1.6rem;
  }
}
.hero img {
  display: block;
  max-width: 100%;
  display: none;
}
.hero h2 {
  font-family: "Swiss 721 W03 Thn", Arial, Helvetica, sans-serif;
  font-size: 2.8rem;
  margin: 2rem 0 0 0;
}
.hero-content {
  background-color: var(--color-hero-main);
  color: var(--color-hero-txt);
  z-index: 1;
}
.padder {
  padding: 40px 32px 60px;
}

.hero-image {
  background: no-repeat top right;
  background-size: cover;
  width: 100%;
  height: 100%;
}
.hero a {
  display: inline-block;
  border: 1px solid #fff;
  padding: 1.5rem 2rem;
  font-family: "Swiss 721 W03 Bd Cnd";
  margin-top: 4rem;
  letter-spacing: .2px;
  font-size: 1.7rem;
  color: var(--color-hero-txt);
  text-decoration: none;
  transition: all .2s linear;
}
.hero a:hover,
.hero a:focus {
  background-color: var(--color-hero-txt);
  color: var(--color-hero-main);
}
.hero p {
  margin: 2rem 0;
  font-family: "Swiss 721 W03 Light";
}

@media (min-width: 700px) {
  .hero {
    display: flex;
    position: relative;
    min-height: 500px;
  }
  .hero img {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
  }
}
@media (min-width: 700px) {
  .hero-content {
    flex: 0.7;
  }
  .hero-image-wrap {
    flex: 0.3;
  } 
}
@media (min-width: 768px) {
  .hero h2 {
    font-size: 4.2rem;
  }
}
@media (min-width: 920px) {
  .hero-content {
    flex: 0.6;
  }
  .hero-image-wrap {
    flex: 0.4;
  } 
}
@media (min-width: 1120px) {
  .flex-half {
    flex: 0.5;
  }
}
.invest-wrap {
    --color-slider-focus: #00678b;
    --color-slider-circle-focus: #666;
    --color-slider-fill: #ccc;
    --color-slider-bg: #666;
    --color-txt-blue: #005065;
    --color-txt-black: #4a4a4a;
    font-family: "Swiss 721 W03 Light",Arial,Helvetica,sans-serif;
    background: linear-gradient(329deg,#cbe3ec,#e6f5f9);
    padding: 4rem;
    color: var(--color-txt-black);
}

.sliders input {
    display: block;
}


.invest-header {
    text-align: center;
    margin: 0 auto 4rem auto;
    width: 90%;
}


@media (min-width: 780px) {
    .calc-invest {
        display: flex;
        justify-content: space-between;
    }

    .result-graph {
        /* flex: 1; */
        width: 60%;
        max-width: 500px;
    }

    .calc-left {
        width: 38%;
    }
}

.calc-invest .numeric {
    color: var(--color-slider-focus);
    font-weight: 600;
}


.calc-invest .js-sum-predict {
    font-size: 4.6rem;
    font-weight: normal;
    margin: 1rem 1rem 0 0;
    display: inline-block;
}

.predict-txt-1 {
    display: block;
}

input[type=range] {
    width: 92%;
    background-color: transparent;
    padding: 10px 5px;
    /*removes default webkit styles*/
    -webkit-appearance: none;
    /*fix for FF unable to apply focus style bug */
    border: 2px solid transparent;
    /*required for proper track sizing in FF*/
}

    input[type=range]::-webkit-slider-runnable-track {
        height: 5px;
        background: var(--color-slider-fill);
        border: none;
        border-radius: 3px;
    }

    input[type=range]::-webkit-slider-thumb {
        -webkit-appearance: none;
        border: none;
        height: 16px;
        width: 16px;
        border-radius: 50%;
        background: var(--color-slider-bg);
        margin-top: -6px;
    }

    input[type=range]:focus {
        outline: none;
        border: solid 2px #666;
        background-color: #fff;
    }

        input[type=range]:focus::-webkit-slider-runnable-track {
            background: var(--color-slider-focus);
        }

        input[type=range]:focus::-webkit-slider-thumb,
        input[type=range]:focus::-webkit-slider-thumb {
            background: var(--color-slider-circle-focus);
        }

    input[type=range]::-moz-range-track {
        height: 5px;
        background: #000;
        border: none;
        border-radius: 3px;
    }

    input[type=range]:focus::-moz-range-track {
        background: var(--color-slider-focus);
    }

    input[type=range]::-moz-range-thumb {
        border: none;
        height: 16px;
        width: 16px;
        border-radius: 50%;
        background: #5f5f5f;
    }

    /*hide the outline behind the border*/
    input[type=range]:-moz-focusring {
        outline: 1px solid white;
        outline-offset: -1px;
    }

    input[type=range]::-ms-fill-lower {
        background: var(--color-slider-focus);
        border-radius: 10px;
    }

    input[type=range]::-ms-fill-upper {
        background: #000;
        border-radius: 10px;
    }

#js-txt-disclaimer {
    font-size: 1.1rem;
    width: 90%;
    margin: 20px auto;
    font-family: "Swiss 721 W03 Light Cnd",Arial,Helvetica,sans-serif;
    /* color: var(--color-txt-black); */
}

#js-btn-cta {
    margin: 20px auto;
    display: block;
    color: var(--color-ub-grey);
    border: none;
    background-color: #fff;
    font-family: "Swiss 721 W03 Bd Cnd",Arial,Helvetica,sans-serif;
    font-size: 1.6rem;
    padding: 1rem 1.5rem;
    text-decoration: none;
    transition: all .2s linear;
}

    #js-btn-cta:hover,
    #js-btn-cta:focus {
        background-color: var(--color-txt-blue);
        color: #fff;
    }

.flex {
    display: flex;
}
:root {
  --ub-blue: #00678b;
  --ub-txt: #4a4a4a;
  --animation-duration: 0.25s;
  --ub-blue-light: #2d7c98;
}
*, :after, :before {
  box-sizing: border-box;
}
@media (min-width: 480px) {
  .flex-layout {
    display: flex;
    gap: 2rem;
  }
  .contacts {
    flex: 1;
  }
}

.flex-btns {
  display: flex;
  gap: 1rem;
  margin-bottom: 1.2rem;
}

.side-menu {
  width: 200px;
}

.side-menu button {
  border: solid 2px var(--ub-blue);
  padding: 0.5rem 1rem;
  background-color: #fff;
  color: var(--ub-blue);
  cursor: pointer;
}
.side-menu button:hover,
.side-menu button:focus {
  background-color: var(--ub-blue);
  color: #fff;
}

.txt-lines span {
  display: inline-block;
  position: relative;  
}
.txt-lines span:before,
.txt-lines span:after {
  content: "";
  position: absolute;
  height: 0.1rem;
  background-color: var(--ub-blue);
  top: 1rem;
  width: 600px;
}
.txt-lines span:before {
  right: 100%;
  margin-right: 1rem;
}
.txt-lines span:after {
  left: 100%;
  margin-left: 1rem;
}


.personnel-group-title {
  text-align: center;
  color: #005065;
  font-family: "Swiss 721 W03 Bd Cnd";
  font-size: 1.6rem;
  margin: 3rem 0 1rem;
  overflow: hidden
}

.personnel-group {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  gap: 20px 20px;
}

.person-card {
  flex: 0 0 180px;
  display: inline-flex;
  flex-flow: column;
  align-items: center;
  text-align: center;
  padding-top: 30px;
  color: #4a4a4a;
  font-family: "Swiss 721 W03 Light", Arial, Helvetica, sans-serif;
}


a.person-card-tel {
  color: var(--ub-blue);
  text-decoration: none;
}
.person-card a {
  text-underline-offset: 0.4rem;
  text-decoration: none;
}
.person-card-img-circle {
  border-radius: 50%;
  height: 120px;
  overflow: hidden;
  transition: all var(--animation-duration);
  margin: 0 auto 1.6rem auto;
}
.person-card-img-circle:hover {
  filter: drop-shadow(2px 1px 6px black);
}
.person-card img {
  display: block;
  max-width: 120px;
}

a.person-card-link {
  font-family: "Swiss 721 W03 Bd Cnd";
  color: var(--ub-txt);
  max-width: 120px;
}

.person-card a:hover, .person-card a:focus {
  text-decoration: underline;
  text-decoration-thickness: 1px;
}

.person-card-text {
  padding: 2px 0;
  margin: 0;
  line-height: 1.3;
  font-size: 1.4rem;
}

.contacts .js-hidden {
  display: none;
}

.check-field:focus-within label:before {
  border: solid 2px var(--ub-blue);
}

/* checkboxes */
.check-field {
  position: relative;
  margin-top: -2px;
  margin-bottom: 0;
}
.check-field > input {
  position: absolute;
  opacity: 0;
}
.check-field > label {
  position: relative;
  display: block;
  line-height: 1.56;
  letter-spacing: 0.2px;
  width: max-content;
  max-width: 320px;
  padding: 0;
  padding-left: 24px;
  margin-bottom: 5px;
  cursor: pointer;
  font-size: 16px;
  font-family: "Swiss 721 W03 Light Cnd";
}
.check-field > label::before {
  content: '';
  display: inline-block;
  position: absolute;
  top: 5px;
  left: 0px;
  vertical-align: text-top;
  background: white;
  width: 16px;
  height: 16px;
  border: solid 1px #c7d4db;
  margin-right: 10px;
}
.check-field > input:checked + label::after {
  content: '\2714';
  position: absolute;
  top: 0px;
  left: 1px;
  color: var(--ub-grey);
}
.check-field.disabled > label {
  cursor: default;
}
.check-field.disabled > input:checked + label::after {
  color: var(--ub-grey-25);
}
div.check-field:last-child {
  margin-bottom: 3rem;
}

/*  [Modal box] */
.modal-wrap {
  position: fixed;
  display: flex;
  justify-content: center;
  align-items: center;
  right: 0;
  bottom: 0;
  left: 0;
  height: 100vh;
  background-color: rgba(74,74,74,.85);
  z-index: 99;
  padding: 0 30px;
}
.modal-box {
  background-color: #fff;
  width: 100%;
  max-width: 800px;
  max-height: 70vh;
  position: relative;
  overflow: auto;
}
.modal-header {
  background-color: var(--color-ub-grey);
  color: #fff;
}
.modal-header img {
  display: block;
  margin: 0 auto;
}
.modal-personnel {
  padding: 2rem;
  margin: auto 0 0 0;
  text-align: center;
}
.modal-header span {
  display: block;
}

.modal-person-description {
  padding: 2rem;
}

a.modal-person-info {
  color: #fff;
  text-decoration: none;
  text-underline-offset: 0.4rem;
}
a.modal-person-info:hover {
  text-decoration: underline;
}
.person-name,
.modal-person-name {
  font-size: 4.2rem;
  font-family: "Swiss 721 W03 Light Cnd", Arial, Helvetica, sans-serif;
}

.person-title,
.modal-person-title {
  font-family: "Swiss 721 W03 Light Cnd", Arial, Helvetica,sans-serif;
  font-size: 1.6rem;
  margin-bottom: 2rem;
}
.modal-person-info {
  font-size: 1.7rem;
  font-family: "Swiss 721 W03 Light", Arial, Helvetica, sans-serif;
}
.modal-box button {
  position: absolute;
  border: solid 2px #ccc;
  background-color: #666;
  color: #fff;
  top: 5px;
  right: 5px;
  padding: 0.5rem 1rem;
  cursor: pointer;
  transition: background-color var(--animation-duration);
}
.modal-box button:hover,
.modal-box button:focus {
  background-color: #333;
}

.js-hidden-modal {
  display: none;
}

@media (min-width: 480px) {
  .modal-header img {
    margin: 0;
    width: 240px;
  }
  .modal-personnel {
    text-align: left;
    padding: 0 0 2rem 0;
  }
  .personnel-layout {
    gap: 6rem;
    margin-bottom: 4rem;
  }
  .personnel-layout .ub-menu-category-title {
      margin-top: 0;
  }
}

.search-field {
  padding: 1rem;
}

.contact-card {
  display: flex;
  gap: 2.4rem;
  margin-bottom: 3rem;
  background-color: var(--ub-light-grey);
  padding: 12px;
}
.contact-card img {
  width: 110px;
}
.contact-card .info {
  margin-top: auto;
  padding-bottom: 1rem;
}
.contact-card a {
  display: block;
  margin-top: 0.5rem;
}
.person-name {
  font-size: 2.4rem;
  margin: 0;
  line-height: 1.56;
}
.person-card .person-name {
  font-size: 1.6rem;
}
.contact-card p {
  line-height: 1.56;
  margin: 0;
}
.contact-card a:hover, 
.contact-card a:focus {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.4rem;
} 

/* [fix person img center issue] */
.author-img-circle {
  border-radius: 50%;
  height: 120px;
  overflow: hidden;
}
.author-img-circle .img-a {
  border-radius: 0;
}
.t-cards {
  display: flex;
  margin: 0 auto;
  flex-flow: row wrap;
  align-content: flex-start;
  justify-content: center; }

.tombstone {
  width: 183px;
  text-align: center;
  position: relative;
  margin: 4px;
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1), 0 3px 4px 0 rgba(0, 0, 0, 0.1); }
.tombstone.active {
  display: block; }
.tombstone:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.19); }
.tombstone .img-wrap {
  height: 110px;
  overflow: hidden;
  padding: 0 5px;
  margin-bottom: 20px; }
.tombstone img {
  max-width: 100%;
  max-height: 100%;
  margin: 0 auto;
  display: block;
  transition: transform 0.3s;
  transform: scale(0.95); }
.tombstone .content-wrap {
  background: linear-gradient(180deg, #fff 0%, #eee 100%);
  height: 240px;
  position: relative;
  opacity: 0.6;
  padding: 0 10px 30px 10px; }
.tombstone .content-wrap > div:first-child {
  padding-top: 20px; }
.tombstone .overlay {
  font-weight: bold; }
.tombstone .underlay {
  display: none; }
.tombstone .ts-footer {
  position: absolute;
  width: 100%;
  bottom: 0;
  padding: 15px;
  box-sizing: border-box; }
.tombstone a {
  text-decoration: none;
  color: #fff; }
.tombstone a > span:first-child {
  position: relative;
  text-decoration: none; }
.tombstone a > span:first-child:before {
  content: '';
  position: absolute;
  width: 100%;
  height: 1px;
  bottom: -1px;
  left: 0;
  background-color: #fff;
  visibility: hidden;
  transform-origin: 0 0;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s; }
.tombstone a > span:first-child:hover:before, .tombstone a > span:first-child.undefined:before {
  visibility: visible;
  -webkit-transform: scaleX(1);
  transform: scaleX(1); }
.tombstone:hover img {
  transform: scale(1); }
.tombstone:hover .overlay {
  display: none; }
.tombstone:hover .underlay {
  display: block; }
.tombstone:hover .content-wrap {
  opacity: 1; }
.tombstone:hover .content-wrap {
  background: linear-gradient(180deg, #fff 0%, #00678b 100%); }
.tombstone .arrow-container {
  display: inline-block;
  position: relative;
  margin: 0 0 0 20px;
  transform: translateY(-12px); }
.tombstone .ub-arrow-shaft-right {
  right: 0; }
.tombstone .ub-arrow-head-right {
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff; }
.tombstone .ub-arrow-head-right {
  right: 0;
  transform: rotate(-45deg);
  transition: all .3s linear;
  position: absolute;
  top: 2px;
  display: block;
  width: 8px;
  height: 8px; }
.tombstone .ub-arrow-shaft-right {
  transition: all .3s linear;
  position: absolute;
  top: 6px;
  display: block;
  width: 16px;
  height: 2px;
  background-color: #fff;
  cursor: pointer; }

.func {
  justify-content: center;
  display: flex;
  margin-bottom: 10px; }
.func button {
  margin-right: 10px;
  border: none;
  background: none;
  cursor: pointer;
  font-size: 100%;
  color: #3385a2; }
.func button:hover {
  text-decoration: underline; }

.t-filters {
  display: flex;
  flex-flow: row wrap;
  justify-content: center; }
.t-filters > div {
  margin: 0 10px 10px 0; }

.tombstone .img-wrap {
  margin-bottom: -10px; }

.border-elem {
  border-bottom: 30px solid transparent;
  border-left: 183px solid transparent;   
}

.tombstone .content-wrap {
  opacity: 1;
  color: #005570; }
.tombstone .underlay {
  display: block;
  opacity: 0; }

.tombstone:hover .border-elem, .tombstone:focus-within .border-elem {
  border-bottom: 30px solid #007b9c;
  border-left: 183px solid transparent; 
  position: relative;
}
.tombstone:hover .content-wrap, .tombstone:focus-within .content-wrap {
  background: linear-gradient(#007b9c, #00394c);
  opacity: 1; }
.tombstone:hover .content-wrap div, .tombstone:focus-within .content-wrap div {
  display: none; }
.tombstone:hover .underlay, .tombstone:focus-within .underlay {
  bottom: auto;
  top: 134px;
  display: block;
  opacity: 1; }
.tombstone:hover .overlay, .tombstone:focus-within .overlay {
  display: block;
  color: #fff; }

.tombstone .underlay a {
  position: relative;
  padding-right: 25px;
}
.tombstone .underlay .icon-svg {
  position: absolute;
  right: 0;
  top: -1px;
}
.tombstone .underlay .icon-svg svg {
  width: 20px;
}
.custom-grid {
  --grid-gap: 2rem;
}
.custom-grid .row {
  display: flex;
  gap: var(--grid-gap);
  margin-bottom: var(--grid-gap);
}

.custom-grid .feed.row {
  gap: 4rem;
}

.custom-grid .row .col {
  flex: 0 0 auto;
}
.col-md-1 {
  width: 8.33333333%;
}
.col-md-2 {
  width: 16.66666667%;
}
.col-md-3 {
  width: 25%;
}
.col-md-4 {
  width: 33.33333333%;
}
.col-md-5 {
  width: 41.66666667%;
}
.col-md-6 {
  width: 50%;
}
.col-md-7 {
  width: 58.33333333%;
}
.col-md-8 {
  width: 66.66666667%;
}
.col-md-9 {
  width: 75%;
}
.col-md-10 {
  width: 83.33333333%;
}
.col-md-11 {
  width: 91.66666667%;
}
.col-md-12 {
  width: 100%;
}

/* [mobile] */
@media screen and (max-width: 740px) {
  .custom-grid .row {
    flex-flow: row wrap;
  }
  .custom-grid .row .column {
    width: 100%;
  }
}

.grid-section > div {
  max-width: 750px;
  width: 100%;
  margin: 0 auto;
}
.grid-section > div.feed {
  max-width: 840px;
}
.grid-section > div.full {
  max-width: none;
}

/* Make the grid row expand beyond the confines of its parent
to be screen-width without breaking away from the normal flow. */
.grid-section > div.screen-width {
  max-width: none;
  gap: 0;
  width: 100vw;
  margin-left: calc(-100vw / 2 + 1150px / 2);
  margin-right: calc(-100vw / 2 + 1150px / 2);
}

@media screen and (min-width: 740px) {
  .grid-section > div.screen-width {
    gap: var(--grid-gap);
  }
}

@media screen and (max-width: 1189px) {
  .grid-section > div.screen-width {
    margin-left: -2rem;
    margin-right: -2rem;
  }
}

@media screen and (min-width: 1190px) {
  .grid-section > div.screen-width {
    gap: calc(var(--grid-gap) * 2);
  }
}

.grid-section .centered-flex-block {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}

.bc-color {
  padding: 12px;
}
.grid-section > div.margin-0, .margin-0 {
  margin: 0 auto;
}
.grid-section > div.margin-1, .margin-1 {
  margin: 1rem auto;
}
.grid-section > div.margin-2, .margin-2 {
  margin: 2rem auto;
}
.grid-section > div.margin-3, .margin-3 {
  margin: 3rem auto;
}
.grid-section > div.margin-4, .margin-4 {
  margin: 4rem auto;
}
.grid-section > .zone-0 {
  margin-bottom: 0.5rem;
}


footer .grid-section .row {
  border-top: solid 2px rgba(133,156,168,.5);
  padding: 2rem 1rem;
}
footer .grid-section .footer-padding {
  padding: 2rem 1.2rem;
}
.w750 {
  max-width: 750px;
  margin: 0 auto;
}
.btop {
  border-top: 1px solid #e3e9ed;
}
body > header {
  position: sticky;
  background-color: #fff;
  top: 0;
  z-index: 4;
}
footer .footer-links {
  display: flex;
  gap: 2.4rem;
  justify-content: center;
  margin-top: 1rem;
  margin-bottom: 4rem;
  flex-flow: row wrap;
  padding: 0 1rem;
}
footer .footer-links a {
  text-decoration: none;
  color: var(--color-ub-grey);
}
footer .footer-links a:hover,
footer .footer-links a:focus {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.4rem;
}
.highlights {
  display: flex;
  flex-flow: row wrap;
  gap: 1.6rem;
  margin: 1.6rem auto;
}

.highlight {
  background-color: #00678b;
  display: block;
  height: 250px;
  position: relative;
  overflow: hidden;
}

.highlights a.highlight {
  color: #fff;
  text-decoration: none;
  min-width: 329px;
  width: calc(100% * 1);
}

.highlights a:hover .description,
.highlights a:focus-within .description {
  bottom: 15px;
}

.highlights a:hover .gradient,
.highlights a:focus-within .gradient {
  bottom: 0;
}

.highlights a:hover .header,
.highlights a:focus-within .header {
  bottom: 120px;
}

.thumbnail .description {
  position: absolute;
  left: 20px;
  padding-right: 20px;
  color: #fff;
  line-height: 1.3;
  transition: all .4s ease-in-out;
  overflow: hidden;
  height: 100px;
  bottom: -120px;
}

.thumbnail img {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  min-width: 460px;
  min-height: 250px;
}

.thumbnail .type {
  position: absolute;
  text-transform: uppercase;
  top: 20px;
  left: 20px;
  font-size: 1.2rem;
  z-index: 2;
  margin: 0;
  font-family: "Swiss 721 W03 Bd Cnd";
  text-shadow: 1px 1px 2px black;
}

.thumbnail .header {
  position: absolute;
  left: 20px;
  color: #fff;
  line-height: 1.3;
  transition: all .4s ease-in-out;
  bottom: 0;
  width: calc(100% - 40px);
  z-index: 2;
  font-family: "Swiss 721 W03 Light";
  text-shadow: 1px 1px 2px black;

  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.bg-wrap {
  background-color: #d3a519;
  position: absolute;
  width: 100%;
  height: 100%;
}

.gradient {
  background: linear-gradient(0deg, rgba(0, 0, 0, .8), transparent 100%);
  position: absolute;
  bottom: -100%;
  left: 0;
  width: 100%;
  height: 100%;
  transition: all .4s ease-in-out;
}


/* [tabbed news] */
.news-tabs {
  min-width: 329px;
  width: 100%;
  opacity: 1;
  transition: opacity 0.2s ease-in;
}

.news-tabs--loading {
  opacity: 0;
}

.news-tabs {
  background-color: var(--tab-color-active);
  color: var(--tab-txt-color);
}

.news-tabs button {
  background-color: var(--tab-color);
  flex: 1;
  border: none;
  padding: 1rem 1.4rem;
  color: #4c5154;

  font-family: "Swiss 721 W03 Cnd";
  font-size: 1.6rem;
}

.news-tabs button[role="tab"][aria-selected="true"] {
  background-color: var(--tab-color-active);
  color: #4a4a4a;
}

.tabs {
  display: flex;
}

.tabs button {
  cursor: pointer;
  text-align: left;
}

/* Media queries */
@media (min-width: 640px) and (max-width: 720px) {
  .highlights {
    gap: 16px;
  }

  .highlights a.highlight,
  .news-tabs {
    min-width: auto;
    width: calc(100% * (1/2) - 8px);
  }
}

@media (min-width: 720px) and (max-width: 1217px) {
  .highlights a.highlight,
  .news-tabs {
    width: calc(100% * (1/2) - 8px);
    min-width: auto;
  }
}

@media (min-width: 1218px) {
  .highlights a.highlight,
  .news-tabs {
    width: calc(100% * (1/4));
  }

  /* 3rd and last highlight (or the one before the news tabs box) should be the largest */
  .highlights a.highlight:nth-child(3),
  .highlights a.highlight:last-of-type {
    flex-grow: 1;
  }
}
.newspage-container,
.news-archive {
  display: flex;
  align-items: flex-start;
  justify-content: stretch;
  margin: 4rem auto 0;
  gap: 3.2rem;
}

@media screen and (max-width: 900px) {
  .news-archive {
    flex-direction: column;
  }
}

.newspage-container .left {
  flex: 100% 1 1;
}

.news-archive .news {
  flex-grow: 1;
  order: 2;
}

.newspage-container .right,
.news-archive .right {
  order: 3;
  flex: 240px 0 0;
}

@media screen and (max-width: 900px) {
  .newspage-container .right,
  .news-archive .right {
    order: 2;
  }

  .news-archive .news:not(.right) {
    order: 3;
  }
}

.newspage-container .right h4 {
  margin-top: 0;
}
@media screen and (min-width: 900px) {
  .newspage-container {
    max-width: 1000px;
  }
}
@media screen and (max-width: 600px) {
  .newspage-container {
    flex-direction: column;
  }
}


.news-lift {
  color: #57717e;
  margin-bottom: 2rem;
}

.news-lift-metadata-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: center;
}

.news-lift-image-and-text-wrapper {
  margin: 1.5rem 0;
}

.news-lift-texts-container:after {
  /* The combination of properties clears the image float properly */
  content: "";
  display: table;
  clear: both;
}

.news-lift-image-wrapper.news-lift-image-wrapper.news-lift-image-wrapper  {
  float: left;
  position: relative;
  margin: 0 1.5rem 1.5rem 0;
  height: 100px;
}

.news-lift-image.news-lift-image.news-lift-image {
  height: 100px;
  width: unset;
}

.news-lift a:hover {
  text-decoration: underline;
  text-decoration-thickness: 1px;
}

.news-lift a.news-item-title {
  font-size: 2rem;
  margin: 0;
}

.news-lift a {
  display: block;
  text-decoration: none;
  text-underline-offset: 0.4rem;
  color: #57717e;
  margin-top: 0.2rem;
  line-height: 2.3rem;
}

.news-item-description.news-item-description.news-item-description {
  margin-top: 1rem;
  margin-bottom: 0
}

.news-type {
  font-family: "Swiss 721 W03 Bd Cnd";
  font-size: 1.4rem;
}

.news-type,
.news-date {
  margin-right: 4px;
}

.news-item-type {
  font-family: "Swiss 721 W03 Bd Cnd";
  font-size: 1.4rem;
}

.news-item-type
.news-item-date {
  margin-right: 4px;
}

.news-item-date {
  font-size: 1.6rem;
}

.news-lift-in-list {
  margin-bottom: 4rem;
}


.news-date,
.news-tag-pill {
  font-family: "Swiss 721 W03 Light";
}


/* This is copied from the styles that the Inderes releases feed widget uses for its tags*/
.news-tag-pill {
  max-width: 100%;
  display: inline-flex;
  -moz-box-align: center;
  align-items: center;
  -moz-box-pack: center;
  justify-content: center;
  height: 24px;
  border-radius: 16px;
  white-space: nowrap;
  transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
  cursor: unset;
  outline: 0px;
  text-decoration: none;
  padding: 0px;
  vertical-align: middle;
  box-sizing: border-box;
  background-color: transparent;
  border: 1px solid rgba(0, 103, 139, 0.7);
  color: rgb(0, 103, 139);
}

.news-item-tag-text {
  font-family: "Swiss 721 W03 Light", Arial, Helvetica, sans-serif;
  font-size: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-left: 7px;
  padding-right: 7px;
  white-space: nowrap;
}


.news .author {
  gap: 1.6rem;
  display: flex;
}

.news .author .author-img .author-img-circle {
  height: 80px;
}

.author img {
  display: block;
  border-radius: 50%;
  width: 80px;
}
.author-txt {
  font-size: 1.4rem;
  color: var(--ub-dark-grey);
  margin: auto 0;
}
.author-txt .item-type {
  font-weight: bold;
}
.item-author {
  margin-top: 2px;
  font-style: italic;
}

/* [archive] */
.news-filters {
  display: block;
}

.news-filters .side-menu {
  order: 1
}



@media (min-width: 580px) {
  .flex-func {
    display: flex;
    gap: 2rem;
  }
}
.news-filters {
  flex: 240px 0 0;
}
.filter-group {
  margin-bottom: 2rem;
}
.filter-group .check-field > label {
  max-width: 240px;
}

.news .js-hidden {
  display: none;
}
.js-filters .check-field > label {
  cursor: default;
}
.js-filters .check-field > input {
  z-index: 1;
  width: 1.6rem;
  height: 1.6rem;
  margin: 5px 0 0 0;
  cursor: pointer;
}

.news-lift .clamp {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}



.aside-nav a,
a.animated-link {
  text-decoration: none;
  display: inline-block;
  position: relative;
  color: var(--ub-blue);
}
.aside-nav a::before,
a.animated-link::before  {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  bottom: -2px;
  left: 0;
  background-color: var(--ub-blue);
  visibility: hidden;
  transform-origin: 0 0;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}

.aside-nav a:hover::before,
a.animated-link:hover::before {
  visibility: visible;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}

.aside-nav a,
a.animated-link {
  display: inline-block;
  color: var(--ub-dark-grey);
  font-size: 1.6rem;
  font-family: "Swiss 721 W03 Light Cnd";
  line-height: 1.3;
  margin-right: 8px;
  margin-bottom: 8px;
  cursor: pointer;
}

.news-tag-category-menu {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}

.news-tag-category-menu .news-tag-pill:hover {
  opacity: 0.7;
}

a.news-tag-category-link {
  display: inline-block;
  font-size: 1.6rem;
  font-family: "Swiss 721 W03 Light";
  cursor: pointer;
}
a.news-tag-category-link--selected {
  font-weight: 900;
  color: var(--white);
}

.news-tag-category-menu .news-tag-pill--selected {
  background-color: var(--ub-blue);
}

.news .author {
  margin-bottom: 2.4rem;
}

.custom-grid .feed a {
  color: var(--ub-blue);
  display: inline-block;
}



/* News tabs */

.news-tabs {
  --tab-color-active: #f1f4f6;
  --tab-color: #bfc9ce;
  --tab-txt-color: #57717e;
  --tab-type-color: #5d707b;

  --svg-arrow-size: 2rem;
}

.tabbed-news {
  background-color: var(--tab-color-active);
  max-width: 500px;
  color: var(--tab-txt-color);
  margin-top: 0.8rem;
}
.tabbed-news .news-lift {
  padding: 0 1.6rem;
}
.tabbed-news .arrow-link {
  color: var(--tab-txt-color);
  font-family: "Swiss 721 W03 Bd Cnd";
  font-size: 1.7rem;
  display: flex;
  gap: 1.5rem;
  text-decoration: none;
  padding: 0 1.6rem;
  justify-content: end;
}
.tabbed-news .arrow-link:hover {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.4rem;
}
.tabbed-news .icon-arr {
  line-height: 1.7rem;
  font-size: 3rem;
}
.tabbed-news .icon-svg {
  display: block;
}
.tabbed-news .icon-svg svg {
  width: var(--svg-arrow-size);
  height: var(--svg-arrow-size);
  stroke: var(--tab-txt-color);
}

.news-feed-home-block  {
  padding: 4rem;
  background-color: rgba(0,103,139,.05);
}
.grouped-tabs {
  justify-content: center;
  margin-bottom: 4rem;
}

.grouped-tabs button {
  color: var(--color-ub-grey);
  background-color: transparent;
  
  border: 1px solid #c7d4db;
  font-size: 1.7rem;
  text-align: center;
  padding: 1.6rem 1.8rem;
  font-family: "Swiss 721 W03 Cnd";
}
.grouped-tabs button.active {
  background: #55636b;
  color: #fff;
}

.grouped-items {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-evenly;
  gap: 1rem;
  /* max-width: 950px; */
  margin: 0 auto;
}
.grouped-items a {
  text-decoration: none;
}
.grouped-items a:hover .grouped-item-title, .grouped-items a:focus-within .grouped-item-title {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.4rem;
}
.js-hidden {
  display: none;
}
.grouped-item {
  /* width: 33%; */
  /* margin: 0 5%; */
  text-align: center;
  color: #4a4a4a;
}
.grouped-item img {
  width: 70px;
  display: block;
  margin: 0 auto;
  transition: all 0.2s ease-in-out;
}
.grouped-item-title {
  font-family: "Swiss 721 W03 Bd Cnd";
  display: block;
  margin: 2.2rem 0;
  color: var(--color-ub-grey);
}

.grouped-item:hover img {
  transform: scale(1.2);
}


@media screen and (min-width: 768px) and (max-width: 900px) {
  .grouped-item {
    width: 40%;
  }
}
@media screen and (min-width: 900px) {
  .grouped-item {
    width: 30%;
  }
}
.struct-header {
  color: var(--color-ub-grey);
  font-family: "Swiss 721 W03 Light",Arial,Helvetica,sans-serif;  
  display: flex;
  flex-flow: row wrap;
  gap: 30px;
  margin-bottom: 15px;
}
.struct-header .s-field-1 {
  font-weight: 700;
}
.struct-items ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.struct-item {
  display: flex;
  gap: 30px;
  padding-top: 16px;
  margin-bottom: 16px;
  font-family: "Swiss 721 W03 Light",Arial,Helvetica,sans-serif;
  border-top: 1px solid #e3e9ed;
}

.s-field-1 {
  flex: 1 1 auto;
}
.s-field-2 {
  flex: 0 0 auto;
  /* font-size: 14px; */
}
.s-field-3 {
  flex: 0 0 70px;
  text-align: center;
}
@media screen and (max-width: 500px) {
  .struct-item {
    gap: 10px;
  }
  .struct-item .s-field-1 {
    padding-bottom: 10px;
    border-bottom: solid 1px #e3e9ed;
    padding-right: 65px;
  }
  .struct-item,
  .struct-header {
    flex-flow: row wrap;
    justify-content: end;
  }
  .s-field-1 {
    width: 100%;
  }
  .struct-item .s-field-1 {
    box-shadow: 2px 3px 6px rgb(0 0 0 / 25%);
    padding: 10px 65px 10px 10px;
    border-radius: 5px;
  }

  .struct-item .s-field-2 {
    margin: auto 0;
  }

  .struct-header .s-field-1 {
    width: 100%;
  }
  .struct-item {
    justify-content: end;
  }
}

.custom-grid .column .struct-items .icon {
  width: 26px;
  display: block;
  margin: auto;
}
.struct-header {
  margin-top: 8rem;
}
.struct-files {
  display: flex;
  flex-flow: row wrap;
  gap: 1rem;
}
.struct-info {
  margin: 2rem 0;
}
.struct-info p {
  font-family: "Swiss 721 W03 Bd Cnd";
  color: #005065;
  color: var(--ub-dark-blue);
}
/* ----- consent ------ */
.dialog {
  overflow: hidden;
}

.consentPopup {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99998;
  background-color: #000;
  background-color: rgba(155, 155, 155, 0.6);
  display: flex;
  justify-content: center;
  align-items: center;
}

.consentPopup .consentWrap {
  width: 60vw;
  background: #eeeeee;
  z-index: 1;
  position: absolute;
  border-radius: 0;
  margin: auto;
  background-color: #fff;
  max-width: 960px;
}

@media (max-width: 580px) {
  .consentPopup .consentWrap {
    width: calc(100% - 4rem);
  }

  .consentPopup .functions {
    flex-wrap: wrap;
  }
}

@media (min-width: 581px) and (max-width: 920px) {
  .consentPopup .consentWrap {
    width: max(80vw);
  }
}

.consentPopup .padder {
  padding: 3rem;
}

.cookie-consent-title {
  margin: 0;
  font-family: "Swiss 721 W03 Thn", Arial, Helvetica, sans-serif;
  line-height: 1.22;
  font-size: 3.2rem;
  color: var(--color-ub-orange);
}

.consentPopup p {
  font-size: 15px;
}

.consentPopup a {
  text-decoration: none;
  color: var(--ub-blue);
}

.consentPopup a:hover {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.4rem;
}

.consentPopup .cookieSettings {
  margin: 2rem;
}

.consentPopup .functions {
  display: flex;
  margin-top: 4rem;
  position: absolute;
  bottom: 0;
  position: relative;
  justify-content: end;
  gap: 20px;
}

.consentPopup .functions button {
  padding: 16px;
  border: solid 1px #00688c;
  cursor: pointer;
  /* font-weight: 600; */
  font-size: 17px;
  font-family: "Swiss 721 W03 Bd Cnd";
}

.consentPopup .functions .btnPrimary {
  background-color: var(--ub-blue);
  color: #fff;
}

.consentPopup .functions .btnSecondary {
  background-color: #fff;
  color: #00688c;
}
.funds-development-block {
  background-color: var(--ub-grey-10);
  padding: 2rem;
}

.funds-development-block__heading {
  margin: 1rem 0 3rem 0;
  color: var(--color-ub-orange);
  text-align: center;
}

.funds-development-block__content {
  width: 100%;
  margin-top: 2rem;
  display: grid;
  grid-template-columns: 50% 50%;
  gap: 2rem;
}

@media screen and (max-width: 1023px) {
  .funds-development-block__content {
    grid-template-columns: 1fr;
  }
}

.funds-development-block__chart-section,
.funds-development-block__controls-section {
  padding: 2rem 3rem;
}

.funds-development-block__chart-section {
  background-color: var(--white);
  border: solid 1px #ccc;
}

.funds-development-block__chart-section-header {
  display: flex;
  flex-direction: row;
  gap: 2rem;
  align-items: center;
}

.funds-development-block__fund-image-wrapper {
  border-radius: 50%;
  overflow: hidden;
  width: 80px;
  height: 80px;
  display: flex;
  justify-content: center;
}

.funds-development-block .funds-development-block__chart-section .funds-development-block__fund-image {
  max-height: 100%;
  max-width: unset;
  width: unset;
}

.funds-development-block .funds-development-block__fund-name {
  font-size: 2.7rem;
  color: var(--ub-dark-grey);
  max-width: calc(100% - 100px); /* Don't let the fund name grow so big that it takes space from the image */
}

.funds-development-block__highstock-container {
  min-height: 300px;
  text-align: center;
  margin: 1rem 0;
  max-width: calc(100vw - 14rem);
}

@media screen and (max-width: 400px) {
  .funds-development-block__highstock-container {
    max-width: calc(100vw - 10rem);
  }
}


.funds-development-block__chart-section-footer {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.funds-development-block p.funds-development-block__loading-indicator {
  height: 300px;
  line-height: 300px;
  text-align: center;
}

.funds-development-block__controls-section {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
}

.funds-development-block__controls-section-tabs {
  display: grid;
  grid-template-columns: 50% 50%;
  margin-bottom: 2rem;
}

.funds-development-block__tab-content-grid {
  margin: 2rem 0;
  display: grid;
  grid-template-columns: 50% 1fr 1fr;
  gap: 1rem;
}

.funds-development-block__fund-row-item {
  font-size: 1.7rem;
  color: var(--color-ub-grey);
}

.funds-development-block__fund_name {
  cursor: pointer;
}

.funds-development-block__fund_name:hover {
  opacity: 0.7;
}

.funds-development-block__controls-section-tabs .ub-btn {
  flex-grow: 1;
}