﻿/*#region VARIABLES*/

:root {
    --teal: 1, 167, 150;
    --teal-light: 210, 235, 233;
    --green: 71, 172, 64;
    --green-light: 236, 244, 225;
    --dark: 77, 77, 77;
    --dark-light: 243, 243, 243;
    --orange: 249, 137, 74;
    --orange-light: 254, 237, 228;
    --purple: 177, 129, 255;
    --purple-light: 242, 234, 255;
    --dark-blue: 79, 66, 223;
    --dark-blue-light: 225, 223, 250;
    --blue: 66, 168, 223;
    --blue-light: 223, 240, 250;
    --magenta: 242, 82, 111;
    --magenta-light: 253, 226, 230;
    --grey: 149, 149, 149;
    --grey-light: 222, 222, 222;
    --grey-lighter: 244, 244, 244;
    --white: 255, 255, 255;
    --black: 0, 0, 0;
    --shadow-dark-small: 0 1px 2px rgba(var(--dark), .2);
    --shadow-dark: 0 0.1rem 0.3rem 0.05rem rgba(var(--dark), .2);
    --shadow-dark-large: 0 0.2rem 0.6rem 0.1rem rgba(var(--dark), .2);
    --drop-shadow-dark: 0 0 0.3rem rgba(var(--dark), .2);
    --header-height: 65px;
    --tile-padding-y: 1rem;
    --tile-padding-x: 1rem;
    --container-padding-x: .75rem;
    /*#region BOOTSTRAP*/
    --bs-border-color: rgb(var(--grey-light));
    /*#endregion VARIABLES*/
    /*#region DATEPICKER */
    --dp-font-size: .9rem;
    --dp-cell-border-radius: 10rem;
    /*#endregion */
    /*#region Z-INDEX LIST*/
    --z-index-search-sidebar: 1;
    --z-index-search-popup: 2;
    --z-index-header: 3;
    --z-index-cookie-popup: 9999;
    /*#endregion Z-INDEX LIST*/
    /*#region TOOLBAR */
    --tb-z-index: 3;
    /*#endregion TOOLBAR */

    --success-color: #47AC40;
    --error-color: #bd5852;
    --container-small-width: 850px;
    --container-medium-width: 1050px;
    --container-large-width: 1240px;
}

.dp__theme_light {
    --dp-text-color: rgb(var(--dark));
    --dp-primary-color: rgb(var(--primary-color));
}

body {
    --primary-color: var(--green);
    --primary-color-light: var(--green-light);
    --category-icon: '\e010';
}

.SOL.SOL, [data-category="SOL"][data-category="SOL"] {
    --primary-color: var(--teal);
    --primary-color-light: var(--teal-light);
}

.ADV.ADV, [data-category="ADV"][data-category="ADV"] {
    --primary-color: var(--orange);
    --primary-color-light: var(--orange-light);
    --category-color: var(--orange);
    --category-color-light: var(--orange-light);
    --category-icon: '\e000';
    --category-icon-bg: '\e00d';
}

.PHIL.PHIL, [data-category="PHIL"][data-category="PHIL"] {
    --primary-color: var(--purple);
    --primary-color-light: var(--purple-light);
    --category-color: var(--purple);
    --category-color-light: var(--purple-light);
    --category-icon: '\e002';
    --category-icon-bg: '\e00e';
}

.CON.CON, [data-category="CON"][data-category="CON"] {
    --primary-color: var(--purple);
    --primary-color-light: var(--purple-light);
    --category-color: var(--purple);
    --category-color-light: var(--purple-light);
    --category-icon: '\e00c';
    --category-icon-bg: '\e009';
}

.INS.INS, [data-category="INS"][data-category="INS"] {
    --primary-color: var(--dark-blue);
    --primary-color-light: var(--dark-blue-light);
    --category-color: var(--dark-blue);
    --category-color-light: var(--dark-blue-light);
    --category-icon: '\e001';
    --category-icon-bg: '\e00b';
}

.DATA.DATA, [data-category="DATA"][data-category="DATA"] {
    --primary-color: var(--blue);
    --primary-color-light: var(--blue-light);
    --category-color: var(--blue);
    --category-color-light: var(--blue-light);
    --category-icon: '\e00f';
    --category-icon-bg: '\e00a';
}

.SUB.SUB, [data-category="SUB"][data-category="SUB"] {
    --primary-color: var(--magenta);
    --primary-color-light: var(--magenta-light);
    --category-color: var(--magenta);
    --category-color-light: var(--magenta-light);
    --category-icon: '\e004';
    --category-icon-bg: '\e008';
}

.PHAS.PHAS, [data-category="PHAS"][data-category="PHAS"] {
    --primary-color: var(--green);
    --primary-color-light: var(--green-light);
    --category-color: var(--green);
    --category-color-light: var(--green-light);
    --category-icon: '\e011';
    --category-icon-bg: '\e012';
}

/*#endregion */

/*#region GENERAL (tags + fonts) */

@font-face {
    font-family: "Roboto Slab";
    src: url("/fonts/RobotoSlab-VariableFont_wght.ttf") format('truetype');
}

@font-face {
    font-family: "Source Sans 3";
    src: url("/fonts/SourceSans3-VariableFont_wght.ttf") format('truetype'),url("/fonts/SourceSans3-Italic-VariableFont_wght.ttf") format('truetype');
}

html {
    font-size: 14px;
}

@media (min-width: 330px) {
    html {
        font-size: 16px;
    }
}

@media (min-width: 768px) {
    html {
        font-size: 18px;
    }
}

body * {
    scroll-margin-top: var(--header-height);
}

body:has(#toolbarMessage:not(.d-none)) * {
    scroll-margin-top: calc(var(--header-height) + 50px);
}

body {
    font-family: 'Source Sans 3';
    font-weight: 500;
    font-style: normal;
    color: #232323;
    display: flex;
    flex-direction: column;
    scroll-behavior: smooth;
}

html, body {
    overflow-x: hidden;
    margin: 0;
    height: 100%;
}

h1, .h1 {
    font-family: 'Roboto Slab';
    font-weight: 600;
    font-size: 1.75rem;
    margin-bottom: 1.8rem;
    color: rgb(var(--category-color, var(--primary-color)));
    line-height: 1.1;
}

    h1.large, .h1.large {
        font-size: 2.7rem;
        margin-bottom: 1.25rem;
    }

h2, .h2 {
    font-family: 'Source Sans 3';
    font-size: 1.45rem;
    font-weight: 600;
    margin-bottom: 1rem;
    color: rgb(var(--dark));
    line-height: 1.1;
}

h3, .h3 {
    font-family: 'Source Sans 3';
    font-size: 1.2rem;
    margin-bottom: .65rem;
    color: rgb(var(--dark));
    line-height: 1.1;
}

h4, .h4 {
    font-family: 'Source Sans 3';
    font-size: 1.1rem;
    color: rgb(var(--dark));
    line-height: 1.1;
}

@media (min-width: 768px) { /* md */
    h1 {
        font-size: 2.25rem;
    }

    h2 {
        font-size: 1.8rem;
    }

    h3 {
        font-size: 1.3rem;
    }

    h4 {
        font-size: 1.15rem;
    }
}

p, pre {
    color: rgb(var(--dark));
    font-weight: 400;
    font-size: 1.25rem;
    font-family: inherit;
    white-space: initial;
}

@media (min-width: 576px) {
    p, pre {
        font-size: 1.15rem;
    }
}

.svg-black {
    filter: invert(15%) sepia(3%) saturate(13%) hue-rotate(347deg) brightness(103%) contrast(88%);
}

.svg-green {
    filter: invert(49%) sepia(8%) saturate(2965%) hue-rotate(69deg) brightness(112%) contrast(100%);
}

a, .link {
    color: rgb(var(--category-color, var(--primary-color)));
    text-decoration: none;
    border: none;
    background: none;
    padding: 0;
}

    a:hover, .link:hover {
        color: rgba(var(--category-color, var(--primary-color)), .8);
    }

    a:hover img a:hover img .hover-green {
        filter: invert(49%) sepia(8%) saturate(2965%) hue-rotate(69deg) brightness(112%) contrast(100%);
    }

    a[disabled], i[disabled="true"] {
        pointer-events: none;
    }

label {
    margin-bottom: 0.5rem;
    color: #666;
}

small {
    font-size: .875em;
}

b {
    font-weight: 600;
}

hr {
    color: rgb(var(--grey-light));
    opacity: 1;
}

input,
select,
textarea {
    --line-height: 1.5;
    --padding-y: .85rem;
    --border-width: 1px;
    --font-size: 1rem;
    line-height: var(--line-height);
    padding: var(--padding-y) 1.25rem;
    color: rgb(var(--dark));
    border: var(--border-width) solid rgb(var(--grey-light));
    border-radius: calc(((var(--line-height) * var(--font-size)) / 2) + var(--padding-y) + var(--border-width));
    font-weight: 500;
    outline: 0;
    width: 100%;
    font-size: var(--font-size);
    resize: none;
}

    input.input-validation-error,
    select.input-validation-error,
    textarea.input-validation-error {
        border-color: red;
    }

    input[type="radio"] {
        appearance: none;
        background-color: rgb(var(--dark-light));
        margin: 0;
        font: inherit;
        width: 1.35em;
        min-width: 1.35em;
        height: 1.35em;
        border: 1px solid rgb(var(--grey-light));
        border-radius: 50%;
        transform: translateY(0.2rem);
        margin-right: 0.5rem;
        display: grid;
        place-content: center;
        padding: 0;
    }

        input[type="radio"]:checked {
            background: rgb(var(--primary-color-light));
        }

        input[type="radio"]::before {
            content: "";
            width: 0.4rem;
            height: 0.4rem;
            border-radius: 50%;
            transform: scale(0);
            transition: 120ms transform ease-in-out;
            box-shadow: inset 1em 1em rgb(var(--primary-color));
        }

        input[type="radio"]:checked::before {
            transform: scale(1);
        }

        input[type="radio"] + label {
            margin: .2rem 1rem 0 0;
        }

    input[type="checkbox"] {
        appearance: none;
        margin: 0;
        color: white;
        width: 1.35em;
        height: 1.35em;
        padding: 0;
        display: grid;
        place-content: center;
        transition: .2s background ease-in-out;
        border-radius: unset;
        background: rgb(var(--dark-light));
    }

        input[type="checkbox"]::before {
            content: "\f00c";
            font-weight: 900;
            font-family: 'Font Awesome 6 Pro';
            transform: scale(0);
            transition: .2s transform ease-in-out;
            color: rgb(var(--primary-color));
        }

        input[type="checkbox"]:checked::before {
            transform: scale(1);
        }

        input[type="checkbox"] + label {
            margin-left: 1rem;
        }

    input.date-picker {
        border-radius: 0;
        background: rgb(var(--dark-light));
        padding: 0.25rem .5rem;
        font-size: .9rem;
        font-weight: 400;
        max-width: 6rem;
    }

.dp__main {
    width: auto;
}

select {
    font-family: 'Roboto Slab';
}

input:placeholder-shown {
    text-overflow: ellipsis;
}

label.required::after {
    content: ' *';
}

/*#endregion */

/*#region FOOTER, HEADER, MAIN */

header#main-header {
    height: 0;
    background: white;
    position: sticky;
    top: var(--header-height);
    z-index: var(--z-index-header);
}

header nav {
    height: 100%;
    display: flex;
    align-items: center;
}

#main-header #header-link {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    height: 100%;
}

#main-header .header-image-text {
    margin-top: 0.2rem;
    color: #9C9C9C;
    display: none;
}

header nav #nav-logo {
    margin-right: auto;
    height: 4rem;
}

header nav .nav-dropdown-toggle::after {
    margin-left: .25rem;
}

@media (min-width: 768px) {
    :root {
        --header-height: 70px;
    }
}

#header-menu {
    box-shadow: 0 0.3rem 0.2rem -0.15rem rgba(var(--dark), .2);
}

header .dropdown, header .button {
    --button-background-color: var(--white);
    --button-foreground-color: var(--green);
}

header .dropdown-toggle, header .dropdown-item, header .dropdown-menu {
    border-radius: .25rem;
}

header .dropdown-menu {
    padding: 0;
    border: none;
    box-shadow: var(--shadow-dark);
    background: #fafafa;
}

header .dropdown-item {
    font-weight: 600;
    color: rgb(var(--grey));
    padding: 0.3rem 1.75rem 0.3rem 0.5rem;
}

.navigation-items {
    display: flex;
    margin-bottom: 1.5rem;
    gap: 1rem;
}

.navigation-item {
    display: block;
    border: 1px solid rgb(var(--grey-light));
    border-radius: 10rem;
    padding: .25rem .75rem;
    white-space: nowrap;
}

.navigation-item.active 
{
    border-color: rgb(var(--grey-light));
    color: rgb(var(--green));
    background: rgb(var(--white));
}

.navigation-item.active img {
    filter: invert(49%) sepia(8%) saturate(2965%) hue-rotate(69deg) brightness(112%) contrast(100%);
}

@media print, screen and (max-width: 576px) {
    .navigation-items {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: .5rem;
    }
}

.lock-icon {
    color: gray;
    font-size: large;
}

main {
    display: grid;
    grid-template-columns: 100%;
}

footer {
    margin-top: 65px;
    border-top: 1px solid rgb(var(--grey-light));
}

    footer a, header a {
        color: rgb(var(--dark));
    }

.footer-wrapper {
    margin-top: auto;
    display: grid;
    transform-style: preserve-3d;
    --primary-color: var(--green);
    --primary-color-light: var(--green-light);
    --category-color: initial;
    --category-color-light: initial;
}

.footer__navigation {
    display: flex;
    justify-content: space-between;
    padding: 1.5rem 0;
}

.footer__legal {
    display: flex;
    padding-bottom: 1rem;
}

.footer__logo {
    width: 7rem;
    aspect-ratio: 209 / 138;
}

.socials {
    display: flex;
    justify-content: space-between;
}
    .socials a{
        margin: 0 !important;
    }

    .socials > * {
        font-size: .9rem;
        height: 1.8rem;
        width: 1.8rem;
        background: rgb(var(--dark-light));
        border-radius: 10rem;
        text-align: center;
        vertical-align: middle;
        line-height: 1.8rem;
    }

header .socials {
    margin: 0 0 .5rem 0;
    justify-content: start;
    gap: .5rem;
}

footer .socials {
}

.myapb-link {
    display: flex;
    align-items: center;
    font-weight: 600;
    gap: .5rem;
}

footer .myapb-link {
    flex-direction: column;
}

    footer .myapb-link img {
        aspect-ratio: 16/9;
        width: 80px;
    }

/*#endregion */

/*#region BRANDED BALLS*/

.header-ball, .main-ball, .footer-ball, .header-ball--landingpage {
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    pointer-events: none;
    z-index: -1;
    height: 100%;
    width: 100%;
}

.header-ball {
    --mask-image: url(/img/nier_3.svg);
    --mask-size: 100% 100%;
    -webkit-mask-image: var(--mask-image);
    -webkit-mask-size: var(--mask-size);
    mask-image: var(--mask-image);
    mask-size: var(--mask-size);
    width: 939px;
    height: 689px;
    left: calc(50vw + 400px);
    top: -315px;
    position: absolute;
    transform-origin: 40% 50%;
    background: rgb(var(--category-color-light, var(--primary-color-light)));
}

.header-ball--article {
    --mask-image: url(/img/nier_3.svg);
    --mask-size: 100% 100%;
    -webkit-mask-image: var(--mask-image);
    -webkit-mask-size: var(--mask-size);
    mask-image: var(--mask-image);
    mask-size: var(--mask-size);
    width: 939px;
    position: absolute;
    height: 689px;
    left: calc(50% - 470px);
    bottom: 0;

    background: rgb(var(--category-color-light, var(--primary-color-light)));
    z-index: -1;
}

.header-ball--landingpage {
    --mask-image: url(/img/nier_3.svg);
    --mask-size: 100% 100%;
    -webkit-mask-image: var(--mask-image);
    -webkit-mask-size: var(--mask-size);
    mask-image: var(--mask-image);
    mask-size: var(--mask-size);
    width: 939px;
    height: 689px;
    left: calc(50vw + 400px);
    top: 80px;
    position: absolute;
    background: rgb(var(--green-light));
    transform-origin: 40% 50%;
}

.header-ball--homepage {
    background: rgb(var(--dark-light));
    background-size: cover;
    background-position: center calc(50% + 220px);
    left: calc(50vw + 180px);
    top: -340px;
    --mask-image: url(/img/nier_2.svg);
}

.header-ball--small {
    --mask-image: url(/img/nier_3.svg);
    --mask-size: 100% 100%;
    -webkit-mask-image: var(--mask-image);
    -webkit-mask-size: var(--mask-size);
    mask-image: var(--mask-image);
    mask-size: var(--mask-size);
    width: 370px;
    height: 389px;
    left: calc(50vw + 20px);
    top: -280px;
    width: 340px;
    height: 340px;
    bottom: 0px;
    position: absolute;
    transform-origin: 40% 50%;
    background: rgb(var(--category-color-light, var(--primary-color-light)));
}

.homepage-intro-container *{
    line-height: 1.5;

}

.main-ball {
    --mask-image: url(/img/bol_main.svg);
    --mask-size: 100% 100%;
    -webkit-mask-image: var(--mask-image);
    -webkit-mask-size: var(--mask-size);
    mask-image: var(--mask-image);
    mask-size: var(--mask-size);
    width: 340px;
    height: 340px;
    left: calc(min(0px, 50vw - 800px) - 100px);
    /*bottom: 0px;*/
    top: calc(100vh - 340px);
    position: absolute;
    background: rgb(var(--primary-color-light));
}

.footer-ball {
    --mask-image: url(/img/nier_4.svg);
    --mask-size: 100% 100%;
    -webkit-mask-image: var(--mask-image);
    -webkit-mask-size: var(--mask-size);
    mask-image: var(--mask-image);
    mask-size: var(--mask-size);
    position: absolute;
    width: 799px;
    height: 845px;
    left: max(50% - 1165px, -550px);
    top: 0px;
    background: rgb(var(--dark-light));
}

/*#endregion */

/*#region CONTAINERS */
.container-small, .container-medium, .container-large {
    width: 100%;
    padding: 0 var(--container-padding-x);
    margin: 0 auto;
}

.container-small {
    max-width: var(--container-small-width);
}

.container-medium {
    max-width: var(--container-medium-width);
}

.container-large {
    max-width: var(--container-large-width);
}

/*#endregion */

/*#region UTILITIES */
.text-primary {
    color: rgb(var(--primary-color)) !important;
}

.bg-primary {
    background-color: rgb(var(--primary-color)) !important;
}

.bg-white {
    --button-background-color: var(--white) !important;
    background-color: white !important;
}

.f-roboto {
    font-family: 'Roboto Slab' !important;
}

.f-source {
    font-family: 'Source Sans 3' !important;
}

.fw-600 {
    font-weight: 600 !important;
}

.fw-700 {
    font-weight: 700 !important;
}

.dark {
    color: rgb(var(--dark)) !important;
}

.border-grey {
    border-color: rgb(var(--grey)) !important;
}

.comma-separated > *:not(:last-child)::after {
    content: ",";
}

.angle-separated > *:not(:last-child)::after {
    font-family: 'Font Awesome 6 Pro';
    font-weight: 900;
    font-size: .75rem;
    content: '\f105';
    padding: 0 .3rem;
}

.shadow {
    box-shadow: var(--shadow-dark-large) !important;
}

.text-large {
    font-size: 1.2em;
}

.d-contents {
    display: contents;
}

.line-clamp {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp--2 {
    -webkit-line-clamp: 2;
}

.line-clamp--3 {
    -webkit-line-clamp: 3;
}

.line-clamp--4 {
    -webkit-line-clamp: 4;
}

.line-clamp--5 {
    -webkit-line-clamp: 5;
}

/*#endregion */

/*#region VARIOUS */

.image-nier {
    --mask-size: contain;
    --mask-repeat: no-repeat;
    -webkit-mask-image: var(--mask-image);
    -webkit-mask-size: var(--mask-size);
    -webkit-mask-repeat: var(--mask-repeat);
    mask-image: var(--mask-image);
    mask-size: var(--mask-size);
    mask-repeat: var(--mask-repeat);
    object-fit: cover;
}

.image-nier--1 {
    --mask-image: url(/img/nier_1.svg);
    aspect-ratio: 378 / 308;
}

.image-nier--2 {
    --mask-image: url(/img/nier_2.svg);
    aspect-ratio: 392 / 269;
}

.image-nier--3 {
    --mask-image: url(/img/nier_3.svg);
    aspect-ratio: 939 / 689;
}

.image-nier--4 {
    --mask-image: url(/img/nier_4.svg);
    aspect-ratio: 799 / 845;
}

.image-nier--5 {
    --mask-image: url(/img/nier_5.svg);
    aspect-ratio: 774 / 531;
}

.page-caption {
    font-family: 'Roboto Slab';
    line-height: 23px;
    margin: 0;
    padding-bottom: 1.5rem;
    font-size: 1rem;
}

.mailto, .phoneto {
    display: flex;
    font-weight: 600;
}

.phoneto {
    color: rgb(var(--dark));
}

    .mailto::before, .phoneto::before {
        font-family: 'Font Awesome 6 Pro';
        font-weight: 500;
        margin-right: 0.5rem;
    }

.mailto::before {
    content: '\f0e0';
}

.phoneto::before {
    content: '\f095';
}

.iframe-video-container {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
}

    .iframe-video-container iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

body.modal-open {
    overflow-y: scroll !important;
}

#overview-title-parent-category {
    font-size: 2rem;
}

    #overview-title-parent-category::after {
        font-family: 'Font Awesome 6 Pro';
        font-size: 1rem;
        font-weight: 600;
        content: '\f105';
        vertical-align: middle;
        margin: 0 .5rem;
        color: rgb(var(--grey));
    }

.overview-title-sub-category {
    font-size: 2rem;
    color: rgb(var(--grey));
}

.component-title-text {
    color: rgb(var(--category-color, var(--primary-color)));
    font-family: "Roboto Slab";
    font-size: 2.2rem;
    font-weight: 600;
    line-height: 1.5;
}

.info {
    display: flex;
    flex-direction: column;
    align-items: start;
}

    .info h3 {
        font-size: calc(1.3rem + .6vw);
        font-weight: 600;
    }

    .info p {
        font-size: 1rem;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 6;
        overflow: hidden;
    }

@media (min-width: 1200px) {
    .info h3 {
        font-size: 1.7rem;
    }
}

.grid-one-area {
    grid-area: 1 / 1 / -1 / -1;
}

/*#endregion */

/*#region TILE */
.tile {
    background: rgb(var(--primary-color));
    border-radius: .5rem;
    padding: var(--tile-padding-y) var(--tile-padding-x);
    color: white;
    --bs-border-color: white;
}
.tile-menu {
    background: rgb(var(--green));
}
.tile-menu-color {
    color: rgb(var(--green));
}
    .tile-menu-color-after::after {
        color: rgb(var(--green)) !important;
    }


    .tile h1, .tile h2, .tile h3, .tile p, .tile pre, .tile label {
        color: inherit;
    }

    .tile > .search-popup-cta {
        display: flex !important;
    }

    .tile .button, .tile .dropdown-menu {
        --button-background-color: var(--white);
        --button-foreground-color: var(--dark);
        box-shadow: var(--shadow-dark-large);
        border: none;
    }

    .tile input:not([type="radio"]) {
        box-shadow: var(--shadow-dark);
        border-color: transparent;
    }

    .tile .search-bar .button {
        --button-background-color: var(--dark);
        --button-foreground-color: var(--white);
    }

/*#endregion */

/*#region BUTTONS */
.button {
    --button-background-color: var(--primary-color);
    --button-foreground-color: var(--white);
    padding: 0.85rem 1.25rem;
    color: rgb(var(--button-foreground-color));
    background-color: rgb(var(--button-background-color));
    border: none;
    border-radius: 10rem;
    font-family: 'Roboto Slab';
    transition: filter .2s;
    overflow: hidden;
}

    .button:hover {
        color: rgb(var(--button-foreground-color));
        background-color: rgb(var(--button-background-color));
        filter: brightness(95%);
    }

    .button:focus, .button:active, .button:active:focus {
        box-shadow: 0 0 0 0.25rem rgba(var(--button-background-color), .5);
    }

    .button:disabled {
        pointer-events: none;
        color: rgba(var(--button-background-color), .25);
        background: rgba(var(--button-background-color), .15);
    }

    .button.button--small {
        padding: 0.3rem 0.5rem;
        font-family: 'Source Sans 3';
    }

    .button.button--rectangular {
        border-radius: .25rem;
    }

    .button.button--collapse {
        width: 100%;
        display: flex;
        --button-background-color: var(--white);
        --button-foreground-color: var(--dark);
        border: 1px solid rgb(var(--grey-light));
        align-items: center;
        justify-content: space-between;
        font-weight: 700;
        font-size: .9rem;
        text-align: left;
    }

.button-icon {
    height: 30px;
    width: 30px;
    vertical-align: middle;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    font-size: .8rem;
    color: rgb(var(--white));
    background: rgb(var(--primary-color));
    border-radius: 10rem;


}

.previous-button, .next-button {
    background-color: rgb(var(--primary-color-light));
    color: rgb(var(--primary-color));
    border: none;
    border-radius: 50%;
    height: 1.9rem;
    width: 1.9rem;
    min-width: 1.9rem;
    font-size: 1rem;
}

    .previous-button::after {
        display: block;
        font-family: 'Font Awesome Kit';
        font-weight: 900;
        font-size: .75rem;
        content: '\e005';
        transform: scale(-1);
    }

    .next-button::after {
        display: block;
        font-family: 'Font Awesome Kit';
        font-weight: 900;
        font-size: .75rem;
        content: '\e005';
    }

.button.button--contact {
    display: none;
    background: white;
    color: rgb(var(--dark));
    font-weight: 700;
    text-align: start;
    width: 100%;
    border: 1px solid rgb(var(--grey-light));
}

[type=button] {
    -webkit-appearance: unset;
}

/*#endregion */

/*#region DROPDOWN */

.dropdown, .dropdown-center, .dropend, .dropstart, .dropup, .dropup-center {
    position: static;
}

    .dropdown .button, .dropdown-center .button {
        font-weight: 500;
    }

.dropdown-menu, .dropdown-item {
    border-radius: 1rem;
    min-width: unset;
    color: rgb(var(--dark));
}

.dropdown-item {
    border-radius: .75rem;
}

.dropdown-menu {
    padding: .25rem;
}

.dropdown-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .button.button--collapse::after, .dropdown-toggle::after {
        border: none;
        content: '\f107';
        font-family: 'Font Awesome 6 Pro';
        font-weight: 600;
        color: rgb(var(--grey));
        margin-left: 1rem;
        font-size: .85em;
        vertical-align: middle;
        transition: transform .2s ease-in-out;
    }

.button.button--collapse:not(.collapsed)::after {
    transform: rotate(-180deg);
}

.dropdown-toggle:not(.collapsed)::after {
    transform: none !important;
}

.dropdown-item:active {
    color: rgb(var(--dark));
    background: rgb(var(--button-background-color, var(--primary-color)));
}

/*#endregion */

/*#region LISTS */

ul.custom-list, ul.custom-list {
    color: #666;
    padding-left: 1.2rem;
    width: 100%;
}

    ul.custom-list ul, ul.custom-list ul {
        padding-left: 0.8rem;
        width: 100%;
    }

    ul.custom-list li, ul.custom-list li {
        display: flex;
        flex-wrap: wrap;
        position: relative;
    }

        ul.custom-list li::before, ul.custom-list li::before {
            content: '\2022';
            color: #52A4E0;
            font-size: 150%;
            line-height: .5;
            padding: .3rem .8rem 0 0;
            position: absolute;
            left: -1.2rem;
        }

    ul.custom-list ul li::before, ul.custom-list ul li::before {
        content: '\25E6';
    }

/*#endregion */

/*#region BREADCRUMB */

.breadcrumb {
    --gap: .3rem;
    display: flex;
    padding: .25rem 0 .25rem 0;
    border-bottom-right-radius: 1rem;
    column-gap: var(--gap);
    margin-bottom: 0.5rem;
}

    .breadcrumb.breadcrumb--big {
        text-transform: uppercase;
        margin-bottom: 0;
    }

    .breadcrumb * {
        white-space: nowrap;
        color: rgb(var(--dark));
        font-size: .9rem;
        font-weight: 500;
        margin-bottom: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 15em;
        align-items: center;
    }

    .breadcrumb.breadcrumb--big * {
        color: rgb(var(--grey));
        font-size: 1.15rem;
    }

    .breadcrumb > * + *::before {
        content: '\e005';
        font-family: 'Font Awesome Kit';
        font-size: .6em;
        font-weight: 100;
        margin-right: var(--gap);
    }

    .breadcrumb a {
        text-decoration: underline;
    }

/*#endregion */

/*#region SEARCH BAR */

.search-bar {
    --button-size: 2.5rem;
    --gutter: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .search-bar input {
        padding-right: calc(var(--button-size) + (var(--gutter) * 2));
    }

    .search-bar .button {
        padding: 0.5rem 0.7rem;
        height: var(--button-size);
        width: var(--button-size);
        font-size: .85rem;
        margin-left: calc((var(--button-size) + var(--gutter)) * -1);
        margin-right: var(--gutter);
    }

::placeholder {
    color: rgb(var(--dark));
}

/*#endregion */

/*#region PAGINATION */

.pagination {
    height: 35px;
    margin: 1rem 0;
}

.pagination-button {
    border: 1px solid rgb(var(--primary-color-light));
    border-radius: 50%;
    background: rgb(var(--white));
    color: rgb(var(--primary-color));
    font-weight: 600;
    text-decoration: none;
    height: 100%;
    aspect-ratio: 1 / 1;
    margin: 0 .2rem;
}

    .pagination-button.disabled {
        color: rgb(var(--primary-color-light));
        border: none;
    }

    .pagination-button.active, .pagination-button:not(.disabled):hover {
        color: rgb(var(--white));
        background: rgb(var(--primary-color));
        border: 1px solid rgb(var(--primary-color));
    }

    .pagination-button.disabled, .pagination-button.active {
        pointer-events: none;
    }

    .pagination-button:first-child, .pagination-button:last-child {
        border: none;
    }

/*#endregion */

/*#region PAGE-SIZER */
.page-sizer {
    display: flex;
    margin: 1rem 0;
    align-items: center;
}

    .page-sizer span {
        white-space: nowrap;
    }

    .page-sizer .dropdown-toggle {
        --button-foreground-color: var(--dark);
        --button-background-color: var(--white);
        padding: .5rem 1rem;
        font-weight: 400;
    }

/*#endregion */

/*#region CATEGORY */

.categories {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.category {
    --category-color: initial;
    display: inline-block;
    color: rgb(var(--dark));
    border: 1px solid rgb(var(--grey));
    border-radius: 10rem;
    text-decoration: none;
    text-transform: uppercase;
    padding: 0 .55rem;
    font-size: .90rem;
    font-weight: 600;
    white-space: nowrap;
    background-color: rgb(var(--white));
}

    .category::before {
        content: '\f111';
        margin-right: .4em;
        font-family: 'Font Awesome 6 Pro';
        font-weight: 900;
        font-size: .75em;
        color: rgb(var(--category-color, transparent));
        display: var(--category-color, none);
        margin-top: auto;
        margin-bottom: auto;
    }

    .category[data-category]:hover {
        border-color: rgba(var(--category-color, var(--primary-color)), .8);
    }

/*#endregion */

/*#region FEED */

.feed-item {
    display: flex;
    justify-content: space-between;
    padding: .75rem 0;
    flex: 1;
}

    .feed-item:not(:last-child) {
        border-bottom: 1px solid rgb(var(--grey-light));
    }

.feed-item--pinned {
    border-bottom: none;
    background-color: rgb(var(--dark-light));
    border-radius: 0.375rem;
    margin: .75rem -0.75rem;
    padding: .75rem;
}

.feed-item--small {
    flex-direction: column-reverse;
    gap: 0.6rem;
}

.homepage-feed {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.spotlight-items-box {
    flex-wrap: wrap;
    gap: 1.5rem;
}

    .spotlight-items-box .feed-item-container div .cta {
        margin: auto;
        position: relative;
        width: fit-content;
        margin-top: -2.1rem;
        margin-bottom: 0.6rem;
    }

    .spotlight-items-box .feed-item-container div {
        padding-left: 0.5rem;
        background-color: white;
        width: fit-content;
        margin-left: auto;
        margin-right: auto;
    }

    .spotlight-items-box .feed-item-container p{
        font-size: 1rem;
    }
    .spotlight-items-box .feed-item-container {
        flex-basis: calc((100% / 1) - 1rem);
        border-top: 1px solid rgb(var(--grey-light));
        border-radius: 0;
    }

        .spotlight-items-box .feed-item-container p {
            display: -webkit-box;
            max-width: 95%;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }

.spotlight-container h2 {
    position: relative;
    top: 2rem;
    margin-left: 1.4rem;
    background-color: white;
    padding: 0 0.7rem;
    width: fit-content;
}

.spotlight-items-box .cta {
    margin: auto;
    position: relative;
    width: fit-content;
    margin-top: -2.1rem;
    margin-bottom: 0.6rem;
}

.feed-item--small .feed-item__categories {
    justify-content: start;
}

.feed-item .breadcrumb {
    margin-bottom: 0;
    text-transform: initial;
}

.feed-horizontal .feed-item {
    border-bottom: none;
    display: block;
}

.feed-horizontal .feed-item__content__caption {
    margin-bottom: .35rem;
}

.feed-horizontal-body {
    flex-basis: 100%;
    gap: 2rem;
}

.feed-item__content {
    flex-basis: 65%;
    flex-grow: 1;
}
.alternative-feed-item {
    flex-basis: 100%;
}

.feed-horizontal .feed-item__content {
    flex-basis: 100%;
}

.feed-item__content__date {
    display: block;
    color: rgb(var(--grey));
    margin-bottom: .33rem;
    font-weight: 600;
}

.feed-item__content__link {
    color: rgb(var(--dark));
    display: block;
    font-size: 1.2rem;
    font-weight: 600;
    text-decoration: none;
    line-height: 1.25;
    margin-bottom: .5rem;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
}

.feed-item__content__caption {
    font-weight: 500;
    font-size: .9rem;
    margin-bottom: .5rem;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
}

.feed-item__categories {
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    justify-content: start;
    gap: .5rem;
    flex-basis: 35%;
    margin-bottom: .55rem;
}

.feed-horizontal .feed-item__categories {
    margin-bottom: .5rem;
    justify-content: start;
}

.feed-horizontal {
    border: 1px solid rgb(var(--grey-light));
    border-radius: .6rem;
    padding: 1rem 1.5rem;
    background: white;
}

    .feed-horizontal .feed-item__content__link:hover,
    .feed-horizontal .cta.cta--after:hover {
        color: rgb(var(--primary-color));
    }
/*#endregion */

/*#region Attachments */
.title__attachments {
    color: rgb(var(--grey));
    font-size: 1.35rem;
}
/*#endregion */

/*#region CTA */
.cta {
    font-family: 'Roboto Slab';
    font-weight: 600;
    color: rgb(var(--dark));
    background: none;
    border: none;
    display: grid;
    grid-template-columns: 1.5em auto;
    gap: .5em;
    padding: .25em 0;
    text-align: left;
}

.cta--after {
    grid-template-columns: auto 1.5em;
}

.cta::before, .cta::after {
    grid-area: 1 / 1 / 1 / 1;
}

.cta--after::before, .cta--after::after {
    grid-area: 1 / 2 / 1 / 2;
}

.cta::before {
    content: '';
    background: rgb(var(--primary-color-light));
    border-radius: 10rem;
    width: 100%;
    aspect-ratio: 1;
}

.cta::after {
    font-family: 'Font Awesome kit';
    content: '\e005';
    color: rgb(var(--primary-color));
    text-align: center;
    font-size: 0.65em;
    line-height: 230%;
    font-weight: 100;
    overflow: hidden;
}

.cta:hover {
    color: rgba(var(--primary-color), .8);
}

/*#endregion */

/*#region CONTACT FORM */

.modal-content {
    overflow-y: auto !important;
}

#contactModal {
    overflow-y: auto !important;
}

@media (min-width: 992px)  {
    .modal-auth {
        --bs-modal-width: 600px;
    }
}

.contact-body, .contact-header {
    border: none;
}

.contact-header {
    padding: 3rem 1.5rem .5rem 1.5rem;
}

.contact-body {
    padding: .5rem 1.5rem 1.5rem 1.5rem
}

/*#endregion */

/*#region ARTICLE */

.pseudo-article-item-container {
    height: min-content;
    overflow: hidden;
    display: block;
}

.pseudo-article-item-svg {
    width: 350px;
    background-color: rgba(var(--category-color-light, var(--primary-color-light)));
}

.article-header-wrapper {
    display: grid;
}

.article__header {
    display: flex;
    gap: 1.5rem;
}

.article__header-icon-wrapper {
    height: 100px;
    background: rgb(var(--category-color, var(--primary-color)));
    margin: auto;
    margin-top: 3vw;
    display: flex;
    justify-content: center;
    padding: 0 0 10px 20px;
}

.pc-caption {
    display: none;
}

.phone-caption {
    display: block;
}

.pseudo-article-header__icon-wrapper {
    margin: 0 auto !important;
    display: grid;
    grid-template-columns: 100%;
    margin-right: calc((var(--container-small-width) - var(--container-medium-width)) / 2);
}

.pseudo-article-header__icon-background {
    grid-area: 1 / 1 / -1 / -1;
    background: rgb(var(--category-color-light, var(--primary-color-light)));
    width: 775px;
    max-width: 175vw;
    margin-left: 30px;
    margin-top: -160px;
    margin-right: -9999px;
}

.pseudo .pseudo-article-header__icon {
    grid-area: 1 / 1 / -1 / -1;
    background: rgb(var(--category-color, var(--primary-color)));
    width: 480px;
    max-width: 90vw;
    padding: 22.5% 40% 15% 25%;
    display: grid;
    grid-template-columns: 100%;
}

.press .pseudo-article-header__icon {
    grid-area: 1 / 1 / -1 / -1;
    background-size: cover;
    background-position: center;
    width: 480px;
    max-width: 90vw;
    padding: 22.5% 40% 15% 25%;
    display: grid;
    grid-template-columns: 100%;
}

.pseudo-article-header__icon::after {
    font-family: 'Font Awesome Kit';
    font-size: 9rem;
    font-style: normal;
    text-align: center;
    line-height: 0.85;
    vertical-align: middle;
    grid-area: 1 / 1 / -1 / -1;
}

.pseudo .pseudo-article-header__icon::after {
    content: var(--category-icon);
    color: rgb(var(--white));
}
.pseudo-header-title {
    font-size: 2.7rem;
}
.press .pseudo-article-header__icon::after {
    visibility: hidden;
}

.phone-icon {
    display: flex;
}

.pc-icon {
    display: none;
}

.article__header-icon {
    display: grid;
}

    .article__header-icon::after {
        font-family: 'Font Awesome Kit';
        font-style: normal;
        font-size: 3.5rem;
        font-weight: 500;
        grid-area: 1 / 1 / -1 / -1;
    }

    .article__header-icon::after {
        color: rgb(var(--white));
        content: var(--category-icon, '\f090');
    }

.article__image-wrapper {
    display: flex;
    flex-direction: column;
    margin: 1rem 0 2rem 0;
}

    .article__image-wrapper > .article__header-icon-wrapper {
        margin: 0 20px -100px auto;
    }

.article__image {
    width: 100%;
    height: 100%;
    max-height: 450px;
    object-fit: cover;
    border-radius: 0.8rem;
}

.article__caption {
    margin: 1.2rem 0;
    font-family: "Roboto Slab";
    font-weight: 400;
}

.article__categories {
    display: flex;
    gap: 1.5rem;
    align-items: center;
}

.article__header-icon-wrapper-with-image {
    margin: 0 20px -50px auto !important;
}

.article__share-bar {
    background-color: rgb(var(--dark-light));
    border-radius: 2rem;
    box-shadow: var(--shadow-dark-small);
    padding: 0 1rem;
    display: flex;
    justify-content: space-between;
    margin: 2.3rem 0;
    font-weight: 600;
    font-size: 1.1rem;
    height: 60px;
}

    .article__share-bar i:hover,
    .article__share-bar button:hover,
    .article__share-bar a:hover {
        color: rgb(var(--teal));
    }

.button--share {
    --button-background-color: var(--white);
    --button-foreground-color: var(--dark);
    width: 30px;
    aspect-ratio: 1 / 1;
    line-height: 30px;
    border: none;
    font-size: 0.9rem;
    padding: 0;
    text-align: center;
}

    .button--share:hover {
        --button-foreground-color: var(--category-color, var(--primary-color));
        filter: none;
    }

.attachment {
    display: block;
    color: rgb(var(--dark));
    margin: .5em 0;
}

.attachment__title {
    font-weight: 700;
}

.attachment__caption::before {
    content: '(';
}

.attachment__caption::after {
    content: ')';
}

.component {
    opacity: 0;
    transform: translate(0, 100px);
    transition: opacity,transform .6s;
}

    .component.visible {
        opacity: 1;
        transform: translate(0, 0);
    }

    .component:empty {
        display: none;
    }

/*#endregion */

/*#region DECISION TREE */

.decision-tree {
    --image-offset: 65px;
    margin-top: calc(var(--image-offset) - var(--tile-padding-y));
}

    .decision-tree h2 {
        font-size: 1.5rem;
        margin-bottom: 1.5rem;
    }

.decision-tree__console p, .decision-tree__console pre, .decision-tree__console label {
    font-size: 1.3rem;
    line-height: 1.5rem;
    font-weight: 400;
}

.decision-tree__console .button {
    white-space: nowrap;
}

.decision-tree__console .button-group, .decision-tree__console .button-group .button {
    margin: auto;
}

.decision-tree .button {
    font-family: 'Roboto Slab';
    font-weight: 700;
    font-size: .9rem;
}

.decision-tree__console {
    text-align: center;
    column-gap: 4rem;
    margin-bottom: 1.75rem;
    min-height: 340px;
    display: block !important;
}

    .decision-tree__console > :only-child {
        padding: 1.5rem 3.5rem;
    }

.decision-tree__console--small-image {
    column-gap: 3.5rem;
}

.decision-tree__main-image-wrapper {
    filter: drop-shadow(var(--drop-shadow-dark));
}

.decision-tree__main-image {
    width: 180px;
    margin: calc(var(--image-offset) * -1) 0 0 calc(var(--image-offset) * 0);
}

.decision-tree__console--small-image .decision-tree__main-image {
    margin: 0;
    width: 185px;
    height: 150px;
}

.accordion-button::after {
    display: none;
}


.menu-chevron {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 10rem;
    background: white;
    text-align: center;
    line-height: 1.5rem;
    margin-left: auto;
    font-size: 0.7rem;
    font-weight: 900;
    color: rgb(var(--green)) !important;
}

    .menu-chevron::after {
        content: '\e005';
        font-family: 'Font Awesome Kit';
        transition: transform 0.5s;
        transform: rotate(90deg);
        font-size: 0.6rem;
        color: rgb(var(--category-color, var(--primary-color)));
        line-height: 1.5rem;
    }

.accordion-nav .accordion-button, .accordion-nav .accordion-body {
    background-color: rgb(var(--green-light)) !important;
}

.accordion-nav .accordion-header {
    border: none !important;
}

.accordion-nav .accordion-item {
    border: none !important;
}

.accordion-nav .accordion-button {
    padding: 0.8rem;
    border-bottom: none !important;
}

.accordion-nav .accordion-button {
    border-bottom: none !important;
}

.accordion-nav .accordion-body {
    padding-top: 0;
    border-top: none !important;
}

.accordion-nav h2 {
    margin-bottom: 0 !important;
}

.accordion-nav .accordion-button:focus, .accordion-nav .accordion-button:checked, .accordion-nav .accordion-button:active, .accordion-nav .accordion-button:not(:focus) {
    box-shadow: none !important;
    outline: none !important;
    border-color: transparent !important;
    border: none !important;
}



.accordion-nav .nav-header-text-border {
    width: 100%;
    display: flex;
}

.accordion-nav .accordion-body .cta::before {
    background-color: white;
}

.footer-image {
    display: flex;
    margin: auto;
}

.footer-options {
    display: none;
}

footer {
    border: none;
}

.footer__legal {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

    .footer__legal span.ms-auto {
        margin-left: auto;
    }

    .footer__legal .fa-glue-icon {
        margin-right: -3.5rem;
        margin-left: 8px;
        color: rgb(223, 83, 70);
        margin-top: 5px;
    }

    .footer__legal .design-by {
        color: #969696;
        font-weight: 600;
    }

.footer-options .cta::before {
    background-color: rgb(var(--green-light));
}

.footer-options .cta::after {
    color: rgb(var(--green));
}

.small-nav-screen .accordion-item:not(:last-child) .nav-header-text-border {
    border-bottom: lightgrey solid 1px;
    padding-bottom: 0.7rem;
}

.large-nav-screen {
    display: none;
}

.decision-tree__results-container {
    padding-top: 1.5rem;
}

.decision-tree__article-results {
    display: flex;
    --bs-gutter-x: 1.5rem;
    row-gap: var(--bs-gutter-x);
    margin-top: 1.5rem;
}

.decision-tree__contact-results {
    display: grid;
    background: rgb(var(--dark-light));
    padding: 1rem;
    border-radius: .5rem;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(100px, 1fr));
}

.decision-tree__article-result {
    border-radius: .5rem;
    text-align: center;
    padding: 0 1rem;
    overflow: hidden;
    display: block;
    height: 100%;
}

.decision-tree__contact-result {
    background: rgb(var(--white));
    padding: 1rem;
    border-radius: .5rem;
}

.decision-tree__article-results > *:nth-child(1) {
    margin-left: auto;
}

.decision-tree__article-results > *:nth-child(2), .decision-tree-article__results > *:only-child {
    margin-right: auto;
}

.decision-tree__article-result-caption {
    color: inherit;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 1rem;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}


.decision-tree__article-result-title {
    color: inherit;
    font-size: calc(10px + 2vw);
    overflow: hidden;
    white-space: normal;
    font-size: 5vw;
    font-weight: 500;
}

.decision-tree__article-result-icon {
    display: grid;
}

    .decision-tree__article-result-icon::before, .decision-tree__article-result-icon::after {
        font-family: 'Font Awesome Kit';
        font-style: normal;
        font-size: 5rem;
        font-weight: 500;
        display: block;
        grid-area: 1 / 1 / -1 / -1;
    }

    .decision-tree__article-result-icon::before {
        content: var(--category-icon-bg, '');
        color: white;
    }

    .decision-tree__article-result-icon::after {
        content: var(--category-icon, '');
        color: inherit;
    }

.decision-tree__article-result:hover .decision-tree__article-result-icon::before {
    display: none;
}

.first-item-class {
    margin-left: -1rem !important;
}

/*#endregion */

/*#region LOADING */

[v-cloak] > * {
    display: none !important;
    width: 100%;
}

[v-cloak]::before {
    -webkit-animation: fa-spin 2s infinite linear;
    animation: fa-spin 2s infinite linear;
    display: block;
    content: '\f110';
    font-family: 'Font Awesome 6 Pro';
    width: 100%;
    text-align: center;
}

.header-text-container {
    margin-top: -1.5rem;
}

.media-container {
    width: 100%;
    height: 60vw;
}

    .media-container iframe {
        width: 100%;
        height: 100%;
        border: 0;
    }

.option-choice-label {
    text-align: start;
    margin-left: 0.5rem;
}

.decision-tree__console pre {
    overflow: hidden;
}

/*#endregion */

/*#region PILL */

.pill {
    border: 1px solid rgb(var(--grey));
    border-radius: 1rem;
    color: rgb(var(--dark));
    text-transform: uppercase;
    font-size: .8rem;
    font-weight: 600;
    padding: 0.3rem 0.75rem;
    vertical-align: middle;
    align-items: center;
    display: flex;
    margin-bottom: 0.5rem;
    gap: 1rem;
}

.pill--disposable__close-button {
    margin-left: auto;
}

    .pill--disposable__close-button::after {
        content: '\e59b';
        font-family: 'Font Awesome 6 Pro';
        cursor: pointer;
        font-style: normal;
        display: block;
    }

.pill--disposable .btn-close {
    color: rgb(var(--dark));
}

.active-filter:not(:last-of-type)::after {
    content: ', ';
}

.nav-link-item {
    font-size: 1.1rem !important;
}

.nav-title-item {
    font-weight: 600 !important;
    line-height: 1.35;
}

.nav-logo-print {
    display: none;
}

.footer-options .h3 {
    font-weight: 600 !important;
}

.footer-options .h3 {
    margin-top: 0.5rem;
    margin-bottom: 0.8rem;
}

/*#endregion */

/*#region SHORT MESSAGES */
.text-and-image-container {
    display: flex;
    gap: 1.5rem;
}
    .text-and-image-container div p {
        overflow: unset;
        text-overflow: unset;
        display: unset;
        -webkit-line-clamp: 5;
        -webkit-box-orient: vertical;
    }


.text-and-image-left .cta {
    margin-left: 0;
}


#search-pop-up-menu-button:hover *{
    color: rgb(var(--primary-color));
}
#search-pop-up-menu-button{
    cursor: pointer;
}
.text-and-image-container .cta {
    width: fit-content;
    margin-top: 1rem;
}

    .text-and-image-container img {
        height: 280px;
        max-width: 450px;
        width: 100%;
        border-radius: 0.5rem;
        margin: auto;
        object-fit: cover;
    }

    .text-and-image-container div {
        flex: 1;
    }

.text-and-image-right div:last-of-type {
    text-align: center;
}

.text-and-image-left div:last-of-type {
    text-align: center;
}

.text-and-image-left {
    flex-direction: column;
}

.text-and-image-right {
    flex-direction: column;
}

.text-and-image-title-container {
    display: block;
    gap: 0.5rem;
}

    .text-and-image-title-container.title-text-right h2 {
        grid-column: 2;
    }

    .text-and-image-title-container.title-text-left h2 {
        grid-column: 1;
    }
/*#endregion */

.spacer-container {
    height: calc(3rem + var(--height));
    margin: -3rem 0;
}

    .spacer-container.small-spacer {
        --height: 20px;
    }

    .spacer-container.medium-spacer {
        --height: 40px;
    }

    .spacer-container.large-spacer {
        --height: 60px;
    }

.feed-horizontal .cta-group-pagination {
    display: flex;
}

    .feed-horizontal .cta-group-pagination p {
        margin-bottom: 0;
        margin: auto;
        padding-left: 1rem;
    }

.feed-horizontal .feed-horizontal-body {
    display: block;
}

.feed-horizontal .cta-group-pagination span {
    margin-top: auto;
    margin-bottom: auto;
}

.feed-horizontal .previous-button {
    margin-right: 0.3rem;
}

    .feed-horizontal .previous-button::after {
        margin-right: 0.15rem;
    }

.slide-enter-active, .slide-leave-active {
    transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out;
}

.slide-enter-from, .slide-leave-to {
    transform: translateX(100%);
    opacity: 0;
}

.slide-enter-to, .slide-leave-from {
    transform: translateX(0);
    opacity: 1;
}

.feed-horizontal-body {
    position: relative;
}

    .feed-horizontal-body .carousel-item .feed-item {
        flex: 1;
        width: 25% !important;
    }

    .feed-horizontal-body .feed-item {
        border: none !important;
    }

.no-grid {
    grid-template-columns: auto !important;
}

.press-title {
    font-size: 2.7rem;
}

.date-container {
    padding: 0.8rem;
    border-top: solid rgb(var(--grey-light)) 1px;
    display: flex;
    gap: 0.5rem;
}

    .date-container p {
        font-size: 1rem;
        font-style: italic;
    }

.tool-container {
    display: flex;
    flex-direction: column;
}

    .tool-container a {
        flex: 0 0 32%;
        text-align: center;
    }
.tool-container-public {
    display: flex;
    flex-direction: column;
}

    .tool-container-public a {
        text-align: center;
    }


/*#endregion */



.homepage-intro-container{
    display: flex;

}
    .homepage-intro-container * {
        width: 100%;
        font-size: 1.3rem;
        font-weight: 400;
        font-family: 'Roboto Slab';
    }

.small-horizontal-cta{
    display: flex;
    flex-direction: column;
}

.small-horizontal-contact h3{
    color: rgb(var(--primary-color));
}

.small-horizontal-contact{
    display: grid;
    grid-template-columns: auto;
    background-color: rgb(var(--primary-color-light));
}

    .small-horizontal-contact p {
        margin: 0;
        color: black;
        font-weight: 600;
    }

.small-horizontal-contact img{
    width: 100%;
    height: 100%;
    max-height: 16rem;
    object-fit: cover;
    border-radius: 0.5rem;
    max-height: 260px;
}

    .small-horizontal-cta img {
        flex: 0 0 auto;
        width: 100%;
    }

.text-with-image-short-messages h2{
    margin-top: 6px;
    font-size: 1.33rem;
}

.text-with-image-short-messages p{
    font-size: 1rem;
}

.text-and-image-container{
    text-align: start;
}

.text-with-image-short-messages-container {
    display: flex;
    flex-direction: column;
    gap: 3.3rem;
}

.top-nav-item {
    flex-grow: 1;
    flex-basis: 0;
}

.top-nav-items {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
    margin-bottom: 1rem;
}

.top-nav-last-item{
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
}

.nav-title-item {
    margin-top: .2rem;
}

.document-type-block i {
    margin-right: 0.5rem;
    color: gray;
    font-weight: 300;
    font-size: 1.15rem;
    margin-top: 0.1rem;
}

.video-type-block i {
    margin-right: 0.5rem;
    margin-bottom: 0.8rem;
    color: gray;
    font-size: 1rem;
    font-weight: 300;
}

#toolbarMessage {
    display: flex;
    flex-direction: row;
    background-color: rgb(var(--grey-lighter));
    padding: .5rem .75rem;
    justify-content: center;
    position: sticky;
    top: var(--header-height);
    z-index: 1;
}

.toolbarMessageContent {
    display: flex;
    flex-direction: row;
    align-items: center;
    position: relative;
}

.toolbarMessageContent i {
    display: flex;
    padding-right: 10px;
    padding-left: 15px;
    align-items: center;
    font-size: .9rem;
}

.toolbarMessageContent .notification {
    display: flex;
    font-weight: 600;
    font-size: 1.2rem;
    padding-left: 10px;
}

.toolbarMessageContent p {
    padding-left: 30px;
    margin-bottom: 0;
    font-size: 1rem;
    align-items: center;
}

.toolbarMessageContent p a  {
    color: rgb(var(--primary-color));
}

.is-restricted {
    display: inline-grid;
}

.is-restricted.is-document, .is-restricted.contains-video {
    margin-right: .33em;
    height: 1.33em;
}

.is-restricted:before, .is-restricted:after {
    grid-area: 1 / 1 / -1 / -1;
}

.is-restricted:after {
    content: '\f30d';
    font-family: 'Font Awesome 6 Pro';
    font-weight: 300;
    color: rgb(var(--grey));
    margin-right: .5em;
}

.is-restricted.is-document:after, .is-restricted.contains-video:after {
    font-size: .7em;
    font-weight: 400;
    background: white;
    width: 1.1em;
    height: 1.1em;
    border-radius: 10rem 10rem 0 0;
    margin: auto .1em .1em auto;
    text-align: center;
}

.is-document:before {
    content: '\f15c';
    font-family: 'Font Awesome 6 Pro';
    font-weight: 300;
    color: rgb(var(--grey));
    margin-right: .5em;
}

.contains-video:before {
    content: '\f144'; 
    font-family: 'Font Awesome 6 Pro';
    font-weight: 300;
    color: rgb(var(--grey));
    margin-right: .5em;
}

/*#endregion */