/*** APPLICATION ***/
body {
    padding-right: 0 !important;
    -webkit-text-size-adjust: auto;
    text-size-adjust: auto;
}

.header,
.page-content-wrapper,
.footer {
    min-width: 100%;
}
.page-content-wrapper {
    min-height: 450px;
}

.cloak-it {
    display:none;
}


/*** ELEMENTS ***/
a:not(.show-hyperlink) {
    text-decoration: none !important;
}
a.underline-spaced {
    /*text-decoration: underline !important;*/
    border-bottom: 1px solid;
}
a,
a:not(.no-hover):hover,
a:active,
a:visited {
    color: inherit;
}
button:focus,
a:focus {
    outline: none;
}


/* Hide search input browser built 'X' to clear the input field */
input[type=search]::-ms-clear  { display: none; width : 0; height: 0; }
input[type=search]::-ms-reveal { display: none; width : 0; height: 0; }
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration { display: none; }



/*** TRANSITIONS ***/
#component-toolbox .side-tool-action,
.action-button,
.publication-tile,
.publication-tile .view-details,
#about #service-tiles .detail-card,
#about #service-tiles .card-close {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}


/*** USER SELECT ***/
.noselect,
.header,
.footer,
.fancy-title,
.loader,
label,
img,
i,
.button-group,
[class*='action-button'],
#about #service-tiles,
.navigation-page-header a:not(.text-select),
.navigation-page-header p:not(.text-select),
.view-controls,
.catalogue .listing-item-tile {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                          supported by Chrome, Opera and Firefox */
}


/*** FLEX WRAP EMULATORS ***/
.emulated-flex-gap-10 > * {
  margin: 1rem 0 0 1rem;
}
.emulated-flex-gap-10 {
  display: inline-flex;
  flex-wrap: wrap;
  margin: -1rem 0 0 -1rem;
  width: calc(100% + 1rem);
}
.emulated-flex-gap-15 > * {
  margin: 1.5rem 0 0 1.5rem;
}
.emulated-flex-gap-15 {
  display: inline-flex;
  flex-wrap: wrap;
  margin: -1.5rem 0 0 -1.5rem;
  width: calc(100% + 1.5rem);
}
.emulated-flex-gap-2 > * {
  margin: 2rem 0 0 2rem;
}
.emulated-flex-gap-2 {
  display: inline-flex;
  flex-wrap: wrap;
  margin: -2rem 0 0 -2rem;
  width: calc(100% + 2rem);
}


/*** NAVIGATION BREADCRUMB HEADER ***/
.navigation-page-header {
    display: flex;
    position: relative;
}
.navigation-page-header .breadcrumbs {
    position: relative;
    display: flex;
    flex-wrap: wrap;
}
.navigation-page-header .breadcrumbs-separator {
    padding: 0 5px;
}
@media (max-width: 1199px) {
    .navigation-page-header {
        flex-direction: column;
    }
    .navigation-page-header .breadcrumbs {
        text-align: left;
    }
}
@media (min-width: 1200px) {
    .navigation-page-header {
        justify-content: space-between;
    }
}

/*** FORMS ***/
.form-input-group .input {
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    outline: 0;
    text-align: left;
    vertical-align: middle;
    -webkit-appearance: none;
    background: none;
    border-style: none;
    box-shadow: none;
}


/*** BOOTSTRAP SELECT OVERRIDE ***/
.bs-searchbox input:focus {
    box-shadow: none
}
.bootstrap-select .filter-option:active {
    outline: none;
}
.bootstrap-select .btn,
.bootstrap-select .btn:hover,
.bootstrap-select .btn:focus,
.bootstrap-select .btn:active {
    box-shadow: none !important;
    outline: none !important;
}
.bootstrap-select .btn.dropdown-toggle {
    border: none !important;
}



/*** UTILITIES ***/

/* Fine bar */
.fine-bar-row {
    width: 100%;
    height: 75px;
    padding: 0 50% 20px;
}
.fine-bar {
    width: 100%;
    height: 2px;
}
.fine-bar.vertical {
    width: 2px;
    height: 100%
}
.fine-bar.thin-bar:not(.vertical){
    height: 1px;
}
.fine-bar.thin-bar.vertical{
    width: 1px;
}

/* Used by shortener calculateTextWidth() */
.font-loader {
    position:absolute;
    top:0;
    visibility:hidden;
    width:0;
    z-index:-1;
}
.font-loader span {
    position:absolute !important;
    white-space:nowrap !important;
}


/* Fancy title */
.fancy-title {
    position: relative;
}
.fancy-title .watermark,
.fancy-title .tagline {
    width: 100%;
}


/* Slider */
.slider-expander {
    font-size: 2rem;
    cursor: pointer;
}
.slider {
    height: 0;
    overflow: hidden;
}
.slider #slider-content {
    padding: 30px;
}
.slider-text-title {
    font-size: 2rem;
    letter-spacing: 1px;
    text-transform: capitalize;
}
.slider-text {
    letter-spacing: 1px;
}


/*** APPLICATION ***/
body {
    min-width: 360px;
    overflow-y: scroll;
    opacity: 0;
    transition: opacity 0.5s;
}

* {
    filter: none;
}

body:not(.cloak-mode)>*:not(.transfer-screen-spacing-control):not(.cancel-screen-edge-spacing),
body:not(.cloak-mode) .transfer-screen-spacing-control>*:not(.transfer-screen-spacing-control):not(.cancel-screen-edge-spacing) {
    margin-left: auto;
    margin-right: auto;
    padding-left: 3rem;
    padding-right: 3rem;
}

body .cancel-screen-edge-spacing {
    margin: 0;
    padding: 0;
}

@media (min-width: 992px) {

    body>*:not(.transfer-screen-spacing-control):not(.cancel-screen-edge-spacing),
    .transfer-screen-spacing-control>*:not(.transfer-screen-spacing-control):not(.cancel-screen-edge-spacing) {
        padding-left: 8rem;
        padding-right: 8rem;
    }
}

@media (min-width: 1200px) {

    body>*:not(.transfer-screen-spacing-control):not(.cancel-screen-edge-spacing),
    .transfer-screen-spacing-control>*:not(.transfer-screen-spacing-control):not(.cancel-screen-edge-spacing) {
        padding-left: 12rem;
        padding-right: 12rem;
        max-width: 2130px;
    }
}

.transfer-screen-spacing-control *:not(.transfer-screen-spacing-control) .transfer-screen-spacing-control>*:not(.transfer-screen-spacing-control):not(.cancel-screen-edge-spacing) {
    padding-left: 0;
    padding-right: 0;
}

textarea,
textarea:disabled,
input,
input:disabled {
    border-radius: 0;
    opacity: 1;
}

a {
    cursor: pointer;
}

input::-webkit-input-placeholder,
input::-moz-placeholder,
input:-ms-input-placeholder,
input:-moz-placeholder {
    opacity: 1;
}

input:focus::-webkit-input-placeholder,
input:focus::-moz-placeholder,
input:focus:-ms-input-placeholder,
input:focus:-moz-placeholder {
    opacity: 0.5;
}

[class*="after-border"]:after {
    position: relative;
    bottom: 0;
    display: flex;
    content: '';
    flex-basis: 100%;
    border-bottom: 1px solid;
}

/* Responsive padding management */
.responsive-padding-120-90,
.responsive-padding-150-120-90 {
    height: 9rem;
}

@media (min-width: 576px) {

    .responsive-padding-120-90,
    .responsive-padding-150-120-90 {
        height: 12rem;
    }
}

@media (min-width: 992px) {
    .responsive-padding-150-120-90 {
        height: 15rem;
    }
}

/* Double border handling */
/* For all screen breakpoints */
.prevent-double-border {
    position: relative;
    margin-right: 1px;
}

.prevent-double-border .border {
    margin-right: -1px;
    margin-bottom: -1px;
}

.prevent-double-border .border.active {
    position: relative;
    z-index: 1;
}

@media (max-width: 575.98px) {

    /* Covers "xs" only */
    .prevent-double-border-xs-xs {
        position: relative;
        margin-right: 1px;
    }

    .prevent-double-border-xs-xs .border {
        margin-right: -1px;
        margin-bottom: -1px;
    }

    .prevent-double-border-xs-xs .border.active {
        position: relative;
        z-index: 1;
    }
}

@media (min-width: 576px) {

    /* Covers sm and above */
    .prevent-double-border-sm {
        position: relative;
        margin-right: 1px;
    }

    .prevent-double-border-sm .border {
        margin-right: -1px;
        margin-bottom: -1px;
    }

    .prevent-double-border-sm .border.active {
        position: relative;
        z-index: 1;
    }

    @media (max-width: 767.98px) {

        /* Covers sm only */
        .prevent-double-border-sm-sm {
            position: relative;
            margin-right: 1px;
        }

        .prevent-double-border-sm-sm .border {
            margin-right: -1px;
            margin-bottom: -1px;
        }

        .prevent-double-border-sm-sm .border.active {
            position: relative;
            z-index: 1;
        }
    }

    @media (max-width: 991.98px) {

        /* Covers sm-md */
        .prevent-double-border-sm-md {
            position: relative;
            margin-right: 1px;
        }

        .prevent-double-border-sm-md .border {
            margin-right: -1px;
            margin-bottom: -1px;
        }

        .prevent-double-border-sm-md .border.active {
            position: relative;
            z-index: 1;
        }
    }

    @media (max-width: 1199.98px) {

        /* Covers sm-md-lg */
        .prevent-double-border-sm-lg {
            position: relative;
            margin-right: 1px;
        }

        .prevent-double-border-sm-lg .border {
            margin-right: -1px;
            margin-bottom: -1px;
        }

        .prevent-double-border-sm-lg .border.active {
            position: relative;
            z-index: 1;
        }
    }
}

@media (min-width: 768px) {

    /* Covers md and above */
    .prevent-double-border-md {
        position: relative;
        margin-right: 1px;
    }

    .prevent-double-border-md .border {
        margin-right: -1px;
        margin-bottom: -1px;
    }

    .prevent-double-border-md .border.active {
        position: relative;
        z-index: 1;
    }

    @media (max-width: 991.98px) {

        /* Covers md only */
        .prevent-double-border-md-md {
            position: relative;
            margin-right: 1px;
        }

        .prevent-double-border-md-md .border {
            margin-right: -1px;
            margin-bottom: -1px;
        }

        .prevent-double-border-md-md .border.active {
            position: relative;
            z-index: 1;
        }
    }

    @media (max-width: 1199.98px) {

        /* Covers md-lg */
        .prevent-double-border-md-lg {
            position: relative;
            margin-right: 1px;
        }

        .prevent-double-border-md-lg .border {
            margin-right: -1px;
            margin-bottom: -1px;
        }

        .prevent-double-border-md-lg .border.active {
            position: relative;
            z-index: 1;
        }
    }
}

@media (min-width: 992px) {

    /* Covers lg and above */
    .prevent-double-border-lg {
        position: relative;
        margin-right: 1px;
    }

    .prevent-double-border-lg .border {
        margin-right: -1px;
        margin-bottom: -1px;
    }

    .prevent-double-border-lg .border.active {
        position: relative;
        z-index: 1;
    }

    @media (max-width: 1199.98px) {

        /* Covers lg only */
        .prevent-double-border-lg-lg {
            position: relative;
            margin-right: 1px;
        }

        .prevent-double-border-lg-lg .border {
            margin-right: -1px;
            margin-bottom: -1px;
        }

        .prevent-double-border-lg-lg .border.active {
            position: relative;
            z-index: 1;
        }
    }
}

@media (min-width: 1200px) {
    .prevent-double-border-xl {
        position: relative;
        margin-right: 1px;
    }

    .prevent-double-border-xl .border {
        margin-right: -1px;
        margin-bottom: -1px;
    }

    .prevent-double-border-xl .border.active {
        position: relative;
        z-index: 1;
    }
}

/**** GDPR dialog ****/
#cookie-consent-modal {
    display: grid;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    box-sizing: border-box;
    grid-template-areas:
        "top-start top top-end"
        "center-start center center-end"
        "bottom-start bottom-center bottom-end";
    grid-template-rows: minmax(-webkit-min-content, auto) minmax(-webkit-min-content, auto) minmax(-webkit-min-content, auto);
    grid-template-rows: minmax(min-content, auto) minmax(min-content, auto) minmax(min-content, auto);
    height: 100%;
    padding: 0.625em;
    overflow-x: hidden;
    transition: background-color .1s;
    -webkit-overflow-scrolling: touch;
}

.custom-checkbox .custom-control-input:disabled:checked~.custom-control-label::before {
    background-color: rgb(175 175 175 / 50%);
}


/*** BOOTSTRAP SELECT OVERRIDE ***/
.dropdown.bootstrap-select {
    display: inline-flex;
}

.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
    width: 100%;
}

.bootstrap-select .bs-title-option {
    display: none !important;
    visibility: hidden !important;
}

.bootstrap-select div.dropdown-menu,
.bootstrap-select .dropdown-header,
.bootstrap-select ul.dropdown-menu li,
.bootstrap-select .dropdown-item,
.bootstrap-select .dropdown-item span {
    /* clearing any bootstrap spacing so we can apply our own */
    padding: 0 !important;
    margin: 0 !important;
}

.bootstrap-select div.dropdown-menu[x-placement] {
    border-radius: 0;
}
.bootstrap-select ul.dropdown-menu li.disabled{
    opacity: 0.5;
}
.bootstrap-select ul.dropdown-menu li .text {
    white-space: pre-wrap;
}

.bootstrap-select ul.dropdown-menu.inner>.dropdown-divider:first-child {
    display: none;
}


/* Bootstrap dropdown spacing - TODO: Review and move appropriately */
.bootstrap-select div.dropdown-menu>.inner {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.bootstrap-select ul.dropdown-menu li.no-results {
    margin: 0;
    padding: 0 3rem !important;
    white-space: pre-wrap;
}

.bootstrap-select ul.dropdown-menu.inner>.dropdown-divider {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
}

.bootstrap-select ul.dropdown-menu.inner>.dropdown-header {
    padding-bottom: 0.5rem !important;
}

.bootstrap-select ul.dropdown-menu li .text {
    /* optgroup header + option */
    padding-left: 1rem !important;
    padding-right: 1rem !important;
}

.bootstrap-select.show-tick ul.dropdown-menu li .text {
    /* optgroup header + option */
    padding-left: 3rem !important;
    padding-right: 3rem !important;
}

.bootstrap-select.show-tick ul.dropdown-menu li a .text {
    /* option only */
    padding-left: 5.2rem !important;
}

/* Bootstrap dropdown item's spacing - RESPONSIVE */
.bootstrap-select:not(.show-tick) div.dropdown-menu>.inner {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.bootstrap-select:not(.show-tick) ul.dropdown-menu li .text {
    /* optgroup header + option */
    padding-left: 2rem !important;
    padding-right: 2rem !important;
}

@media (min-width: 576px) {
    .bootstrap-select:not(.show-tick) div.dropdown-menu>.inner {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .bootstrap-select:not(.show-tick) ul.dropdown-menu li .text {
        /* optgroup header + option */
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}

@media (min-width: 992px) {
    .bootstrap-select:not(.show-tick) div.dropdown-menu>.inner {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .bootstrap-select:not(.show-tick) ul.dropdown-menu li .text {
        /* optgroup header + option */
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}

.bootstrap-select ul.dropdown-menu li:not(:last-of-type)>* {
    padding-bottom: 1.5rem !important;
}

@media (min-width: 576px) {
    .bootstrap-select ul.dropdown-menu li:not(:last-of-type)>* {
        padding-bottom: 1rem !important;
    }
}

@media (min-width: 992px) {
    .bootstrap-select ul.dropdown-menu li:not(:last-of-type)>* {
        padding-bottom: 0.5rem !important;
    }
}

/* other instances */
/* Not responsive so they stay aligned with other input fields */
*[class*="action-button"] .bootstrap-select .dropdown-toggle {
    padding: 0 1.5rem;
}

*[class*="action-button"] .bootstrap-select div.dropdown-menu>.inner {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

*[class*="action-button"] .bootstrap-select ul.dropdown-menu li .text {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
}

#page-splash .bootstrap-select ul.dropdown-menu li>* {
    padding: 1.5rem 0 !important;
}

@media (min-width: 576px) {
    #page-splash .bootstrap-select ul.dropdown-menu li>* {
        padding: 1rem 0 !important;
    }
}

@media (min-width: 992px) {
    #page-splash .bootstrap-select ul.dropdown-menu li>* {
        padding: 0.5rem 0 !important;
    }
}

#component-header .bootstrap-select ul.dropdown-menu li .text {
    /* Excluding the market selector from wrapping */
    white-space: nowrap;
}

.bootstrap-select .filter-option {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Custom clear 'X' button */
.bootstrap-select .bs-searchbox .clear-icon {
    cursor: pointer;

    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);

    width: 12px;
    height: 12px;

    background-size: 12px 12px;
    background-repeat: no-repeat;
    background-position: center center;

    display: block;
}

.bootstrap-select .bs-searchbox input:-ms-input-placeholder+.clear-icon {
    /* ie10 */
    display: none;
}

.bootstrap-select .bs-searchbox input:placeholder-shown+.clear-icon {
    display: none;
}

/* Custom carrets implementation */
.bootstrap-select .dropdown-toggle::before {
    display: none;
}

.bootstrap-select .dropdown-toggle::after {
    border: none;
    margin-top: 0;

    transition-duration: 250ms;
    transition-property: transform, -webkit-transform, -moz-transform;

    height: 0;
    /* so it doesnt cause the toggle to be taller due to the carret */
    width: 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.bootstrap-select:not(.dropup).show .dropdown-toggle::after,
.bootstrap-select.dropup:not(.show) .dropdown-toggle::after {
    -webkit-transform: rotateZ(-180deg);
    /* rotate-me-180 */
    -moz-transform: rotateZ(-180deg);
    transform: rotateZ(-180deg);
}

.bootstrap-select .mobile-device+.dropdown-toggle::after {
    /* Mobile will always point down */
    -webkit-transform: none !important;
    -moz-transform: none !important;
    transform: none !important;
}

/* Open dropdown positioning */
.bootstrap-select div.dropdown-menu[x-placement*="start"] {
    margin-bottom: 0 !important;
}

.bootstrap-select div.dropdown-menu[x-placement="bottom-start"] {
    margin-top: 0 !important;
}

/* Open dropdown search field */
.bootstrap-select .bs-searchbox {
    position: relative;
    margin: 1rem 3rem 0 !important;
    padding: 0;
}

.bootstrap-select .bs-searchbox::before {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    /* so it goes on top of the input */

    content: '';
    width: 16px;
    height: 16px;

    background-size: 15px 15px;
    background-repeat: no-repeat;
    background-position: left center;
}

.bootstrap-select .bs-searchbox input {
    position: relative;
    border-radius: 0;
    border: none;

    padding: 0 2.3rem;
    /* so we can fit the icons */
}

.bootstrap-select .bs-searchbox input::placeholder {
    color: inherit !important;
}

/* Custom checkboxes implementation */
.bootstrap-select.show-tick ul.dropdown-menu li a span.check-mark,
.bootstrap-select.show-tick ul.dropdown-menu .selected span.check-mark {
    /* Preventing the default bootstrap styling */
    display: initial;
}

.bootstrap-select .dropdown-item .check-mark {
    position: absolute !important;
    left: 3rem;
    right: initial !important;
    top: 4px !important;

    width: 12px;
    height: 12px;
}

.bootstrap-select .dropdown-item .check-mark::after {
    /* Preventing the default bootstrap styling */
    border: none;
    -webkit-transform: none;
    -moz-transform: none;
    transform: none;

    /* "checkbox" content positionning */
    width: 100%;
    height: 100%;
    background-size: 8px 8px;
    background-repeat: no-repeat;
    background-position: center center;
}

/*** BOOTSTRAP CHECKBOX/RADIO OVERRIDE ***/

/* radio/checkbox */
.custom-control-label::before,
.custom-control-label::after {
    /* Preventing the default bootstrap styling */
    border: none;

    position: absolute !important;
    left: 0;
    /* For the same distance as bootstrap dropdown checkbox */
    right: initial !important;
    cursor: pointer;

    /* TODO: Need to review to properly align with center of first line's line-height */
    top: 7px !important;
    width: 12px;
    height: 12px;

    /* "checkbox/radio" content positionning */
    background-size: 8px 8px;
    background-repeat: no-repeat;
    background-position: center center;
}

.custom-control-label.one-liner-label::before,
.custom-control-label.one-liner-label::after {
    top: 50% !important;
    transform: translateY(-50%);
}

.custom-control-input:checked~.custom-control-label::before,
.custom-control-input:not(:disabled):active~.custom-control-label::before,
.custom-control-label::before {
    /* Preventing the default bootstrap styling */
    box-shadow: none !important;
    background-color: initial;
}

/* For checkboxes only, radio buttons are unchanged */
.custom-checkbox .custom-control-label::before,
.custom-checkbox .custom-control-label::after {
    border-radius: 0;
}




/*** FORM ITEM STANDARDIZED ***/
.form-item-wrapper .input-field-container {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.form-item-wrapper .input-field-container.display-horizontal {
    flex-direction: row;
}

.form-item-wrapper:not(.form-item-auto-height):not(.checkbox-field):not(.file-field) .input-field-container {
    min-height: 6rem;
    height: 1px;
}

.form-item-wrapper .input-field-container .input-field {
    display: flex;
    height: 100%;
}

.form-item-wrapper .input-field-container.display-horizontal .input-field {
    margin-right: 1.5rem;
}

.form-item-wrapper.file-field .input-field-container .input-field {
    flex-wrap: wrap;
}

.form-item-wrapper:not(.form-item-auto-height):not(.checkbox-field):not(.file-field) .input-field-container .input-field .input {
    height: 100%;
}

.form-item-wrapper .input-field-container .input-field .input-field-icon {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.form-item-wrapper .input-field-container .input-field .input-field-icon-actionable>* {
    display: flex;
}

.form-item-wrapper .input-field-container .input-field>.input-field-icon.input-field-starting-icon {
    order: 1;
}

.form-item-wrapper .input-field-container .input-field>.input-field-icon.input-field-trailing-icon {
    order: 21;

    padding-right: 1.5rem;
}

.form-item-wrapper .input-field-container .input-field>.input-file-selection {
    flex-basis: 100%;
    /* new line */
    order: 31;
}

.form-item-wrapper .input-field-container .input-field>*:not(.input-field-icon):not(.input-file-selection) {
    order: 11;
}


.form-item-wrapper .input-field-container .input-field .input-label:not(.custom-control-label) {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: right;
    margin: 0;
}

.form-item-wrapper:not(.form-item-auto-height) .input-field-container .input-field .input.input-file~.input-label {
    /* Meant to only apply to .input[type="file"] */
    min-height: 5.9rem;
    /* compensate for the border-bottom being 1px */
    height: 1px;
}

.form-item-wrapper .input-field-container .input-field .input.input-file~.input-label,
.form-item-wrapper .input-field-container .input-field .input:not(.custom-control-input) {
    display: flex;
    flex-grow: 1;
    margin: 0;
    outline: 0;
    text-align: left;
    vertical-align: middle;
    -webkit-appearance: none;
    background: rgba(255, 255, 255, 0);
    /*
        Transparency somehow NEEDS to be given like this;
        Else disabled inputs value doesn't show for some reason
    */
    border-style: none;
    box-shadow: none;

    padding: 0 1.5rem;
}

.form-item-wrapper .input-field-container .input-field .input.input-select {
    padding: 0;
}

.form-item-wrapper .input-field-container .input-field .input.input-text {}

.form-item-wrapper .input-field-container .input-field .input.input-textarea {
    height: auto;
}

.form-item-wrapper .input-field-container .input-field .input.input-radio {}

.form-item-wrapper .input-field-container .input-field .input.input-checkbox {}

.form-item-wrapper .input-field-container .input-field .input.input-file {
    display: none;
}

.form-item-wrapper .input-notice {
    flex-basis: 100%;

    display: flex;
    flex-direction: column;
    min-height: 3.2rem;
    margin: 0.5rem 0;
}

.form-item-wrapper .input-notice .input-alert {
    position: relative;
    padding-left: 2rem;

    display: flex;
    flex-direction: column;
    text-align: start;
}

.form-item-wrapper .input-notice .input-alert:before {
    position: absolute;
    left: 0;

    content: "";

    background-repeat: no-repeat;
    background-position: center;
    width: 1.5rem;
    height: 1.5rem;
    background-size: 1.5rem;
}

.form-item-wrapper:not(.show-alert-red) .input-notice .input-alert.red-alert,
.form-item-wrapper:not(.show-alert-green) .input-notice .input-alert.green-alert {
    display: none;
}

/* FORM ITEM STANDARDIZED - BOOTSTRAP - SELECTPICKER */
.form-item-wrapper .bootstrap-select .dropdown-toggle {
    padding: 0 1.5rem;
}

.form-item-wrapper .bootstrap-select div.dropdown-menu>.inner {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

.form-item-wrapper .bootstrap-select ul.dropdown-menu li .text {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
}

/* FORM ITEM STANDARDIZED - BOOTSTRAP - CUSTOM-RADIO & CUSTOM-CHECKBOX */
.form-item-wrapper.checkbox-field .input-field-container .input-field .input-label.custom-control-label {
    flex-grow: 1;
    padding-left: 2.5rem;
}

.form-item-wrapper.checkbox-field .input-notice .input-alert {
    padding-left: 2.5rem;
}



/*** CTA ITEM STANDARDIZED ***/
.cta-item-wrapper {}

.cta-item-wrapper .cta-actionable {
    /* .pointer */
    cursor: pointer;
}

.cta-item-wrapper .cta-actionable.cta-button {
    position: relative;

    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 1rem;
    height: 1px;
    min-height: 6rem;
}

.cta-item-wrapper .cta-actionable.cta-button__simple {
    /* a button without loader */
}

.cta-item-wrapper .cta-actionable.cta-button__full {
    /* a button with a loader */
}

.cta-item-wrapper .cta-actionable.cta-minimal {
    /* an inline minimal button */
    display: inline-block;
    width: 100%;
    padding: 0.5rem;
    min-height: initial;
    height: auto;
}

.cta-item-wrapper .cta-actionable .cta-text {
    display: inline-flex;
    align-items: center;
    order: 2;

    /* In the odd case a line wrap would occur between cta-text and cta-text:after; makes those look nicer */
    flex-wrap: wrap;
    justify-content: center;
}

/* Buttons with loader specifics */
.cta-item-wrapper .cta-actionable .cta-bg-overlay {
    display: none;

    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.cta-item-wrapper .cta-actionable .cta-loader {
    display: none;
    z-index: 1;
    /* loader on top of overlay */
    order: 1;
    /* loader before text */

    /* Offset .cta-loader (and its following .cta-text) to keep .cta-text centered at all time */
    /* margin-right is the "same" as what an icon added in .cta-text:after would be */
    margin-left: -3rem;
    margin-right: 1rem;
}

/* Animation */
.cta-item-wrapper .cta-actionable:not(.no-animation),
.cta-item-wrapper .cta-actionable:not(.no-animation) .cta-text,
.cta-item-wrapper .cta-actionable:not(.no-animation) .cta-bg-overlay,
.cta-item-wrapper .cta-actionable:not(.no-animation) .cta-loader {
    /* .transition-all-05-ease */
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

/** other instances **/
/* When the .cta-item-wrapper is part of a .form-item-wrapper element */
.form-item-wrapper .cta-item-wrapper .cta-actionable {
    padding: 0;
}

/* When the content is a picto in the background */
.cta-item-wrapper .cta-actionable.cta-background {
    padding: 0;
}

.cta-item-wrapper .cta-actionable.cta-background .cta-text {
    width: 100%;
    height: 100%;
}





.agency-text-container {
    position: relative;
}

.agency-text-container .agency-text {
    height: 6rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}



/* ACTION BUTTON */
.button-container {
    position: relative;
}

.button-container .action-button {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 1rem;
    min-height: 6rem;
    height: 1px;
    text-align: center;
    cursor: pointer;
}

.button-container .action-button.action-button-line {}

.button-container .action-button.action-button-line-small {
    display: inline-block;
    padding: 0.5rem;
    width: 100%;
    height: auto;
    min-height: initial;
}

.filter .button-container .action-button {
    height: 6rem;
    padding: 0;
}

*:not(#page-overlay-loader)>.loader {
    width: 100%;
    padding: 40px 0;
}

.button-container .loader {
    position: absolute;
    top: 0;
    padding: 18px 0;
}

/* Bootstrap dropdown button */
.button-container .action-button-dropdown {
    cursor: default;
}

/* Aligning the visible closed dropdown selected option's text */
.button-container .action-button-dropdown .bootstrap-select,
.button-container .action-button-dropdown .dropdown-toggle {
    height: 100%;
}



/* data-form-container */
.data-form-container .animate__animated {
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
}

.data-form-navigation-container .cta-actionable .cta-text {
    text-align: left;
    padding-left: 30px;
}

.data-form-container .data-form-sub-container {
    position: relative;
    min-height: 250px;
}

.data-form-container .data-form-sub-container .data-form-sub-forms>.d-block {
    padding-top: 6rem;
}

.data-form-container .data-form-sub-loader {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}


/* TOASTS */
/* screen edge spacing */
.alerts-top-right,
.alerts-bottom-right {
    max-width: none !important;

    width: auto;
    right: 0;
}

.alert.alert-dismissible,
.alert.alert-dismissible>* {
    /* Reseting all the spacings */
    margin: 0;
    padding: 0;

    /* and other stuff */
    border-radius: 0;
}

.alert.alert-dismissible button {
    position: initial;
}

/* positioning */
.alert.alert-dismissible {
    display: flex;
    padding: 0 2rem;
}

.alert.alert-dismissible>* {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.alert.alert-dismissible strong {
    flex-grow: 1;
    min-height: 6rem;
    padding: 0 3rem;

    text-align: center;
}

.alert.alert-dismissible button span {
    width: 1.5rem;
    height: 1.5rem;
}


/*** FANCYBOX ***/
[data-fancybox] {
    cursor: zoom-in;
}

/* Default styling unset */
.fancybox-container .fancybox-toolbar {
    opacity: 1;
    visibility: visible;
}

.fancybox-container .fancybox-infobar {
    mix-blend-mode: initial;
}

.fancybox-container .fancybox-toolbar .fancybox-button--zoom,
.fancybox-container .fancybox-toolbar .fancybox-button--play,
.fancybox-container .fancybox-toolbar .fancybox-button--thumbs {
    display: none !important;
}

.fancybox-container .fancybox-navigation .fancybox-button--arrow_left>*,
.fancybox-container .fancybox-navigation .fancybox-button--arrow_right>*,
.fancybox-container .fancybox-toolbar .fancybox-button--close>* {
    /* Hide default icon */
    opacity: 0;
}

/* Redesign styling */
.fancybox-container.fancybox-is-open .fancybox-inner {
    background-color: white;
}

.fancybox-container .fancybox-inner {
    transition: background-color 366ms ease;
    top: 10vh;
    bottom: 10vh;

    left: 3rem;
    right: 3rem;
}

@media (min-width: 992px) {
    .fancybox-container .fancybox-inner {
        left: 8rem;
        right: 8rem;
    }
}

@media (min-width: 1200px) {
    .fancybox-container .fancybox-inner {
        left: 12rem;
        right: 12rem;
    }
}

.fancybox-container .fancybox-button {
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
}

.fancybox-container .fancybox-navigation .fancybox-button--arrow_left {
    -webkit-transform: rotateZ(-90deg);
    -moz-transform: rotateZ(-90deg);
    transform: rotateZ(-90deg);
}

.fancybox-container .fancybox-navigation .fancybox-button--arrow_right {
    -webkit-transform: rotateZ(90deg);
    -moz-transform: rotateZ(90deg);
    transform: rotateZ(90deg);
}

/* the actual icons to put in place of the default ones */
.fancybox-container .fancybox-toolbar .fancybox-button--close {
    width: 6rem;
    height: 6rem;
    background-size: 3rem;
}

.fancybox-container .fancybox-toolbar .fancybox-button--close[disabled] {
    display: none;
}

.fancybox-container .fancybox-navigation .fancybox-button--arrow_left,
.fancybox-container .fancybox-navigation .fancybox-button--arrow_right {
    width: 6rem;
    height: 6rem;
    background-size: 3rem 4rem;
    padding: 0;
}


.page-content-height {
    /* Removing /component-Header's and /component-Footer's height */
    min-height: calc(100vh - 8rem - 30rem);
}

.page-content-height.no-footer,
.page-content-height.footer-under-viewport {
    /* Removing /component-Header's height */
    min-height: calc(100vh - 8rem);
}

#page-content {
    position: relative;
}

#page-content #page-overlay-loader .loader {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;

    /* Under mobile navbar */
    z-index: 4;
}


/*** Creating alternate animations in line with animate.css to use for slight movement ***/
@-webkit-keyframes fadeInDownSmall {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -30px, 0);
        -moz-transform: translate3d(0, -30px, 0);
        -ms-transform: translate3d(0, -30px, 0);
        -o-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
    }
}

@-moz-keyframes fadeInDownSmall {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -30px, 0);
        -moz-transform: translate3d(0, -30px, 0);
        -ms-transform: translate3d(0, -30px, 0);
        -o-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
    }
}

@-ms-keyframes fadeInDownSmall {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -30px, 0);
        -moz-transform: translate3d(0, -30px, 0);
        -ms-transform: translate3d(0, -30px, 0);
        -o-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
    }
}

@-o-keyframes fadeInDownSmall {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -30px, 0);
        -moz-transform: translate3d(0, -30px, 0);
        -ms-transform: translate3d(0, -30px, 0);
        -o-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes fadeInDownSmall {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -30px, 0);
        -moz-transform: translate3d(0, -30px, 0);
        -ms-transform: translate3d(0, -30px, 0);
        -o-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
    }
}

.animate__fadeInDown.small {
    -webkit-animation-name: fadeInDownSmall;
    animation-name: fadeInDownSmall
}

@-webkit-keyframes fadeInLeftSmall {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-30px, 0, 0);
        -moz-transform: translate3d(-30px, 0, 0);
        -ms-transform: translate3d(-30px, 0, 0);
        -o-transform: translate3d(-30px, 0, 0);
        transform: translate3d(-30px, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@-moz-keyframes fadeInLeftSmall {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-30px, 0, 0);
        -moz-transform: translate3d(-30px, 0, 0);
        -ms-transform: translate3d(-30px, 0, 0);
        -o-transform: translate3d(-30px, 0, 0);
        transform: translate3d(-30px, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
    }
}

@-ms-keyframes fadeInLeftSmall {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-30px, 0, 0);
        -moz-transform: translate3d(-30px, 0, 0);
        -ms-transform: translate3d(-30px, 0, 0);
        -o-transform: translate3d(-30px, 0, 0);
        transform: translate3d(-30px, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
    }
}

@-o-keyframes fadeInLeftSmall {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-30px, 0, 0);
        -moz-transform: translate3d(-30px, 0, 0);
        -ms-transform: translate3d(-30px, 0, 0);
        -o-transform: translate3d(-30px, 0, 0);
        transform: translate3d(-30px, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
    }
}

@keyframes fadeInLeftSmall {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-30px, 0, 0);
        -moz-transform: translate3d(-30px, 0, 0);
        -ms-transform: translate3d(-30px, 0, 0);
        -o-transform: translate3d(-30px, 0, 0);
        transform: translate3d(-30px, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
    }
}

.animate__fadeInLeft.small {
    -webkit-animation-name: fadeInLeftSmall;
    animation-name: fadeInLeftSmall
}

@-webkit-keyframes fadeInRightSmall {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(30px, 0, 0);
        -moz-transform: translate3d(30px, 0, 0);
        -ms-transform: translate3d(30px, 0, 0);
        -o-transform: translate3d(30px, 0, 0);
        transform: translate3d(30px, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@-moz-keyframes fadeInRightSmall {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(30px, 0, 0);
        -moz-transform: translate3d(30px, 0, 0);
        -ms-transform: translate3d(30px, 0, 0);
        -o-transform: translate3d(30px, 0, 0);
        transform: translate3d(30px, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
    }
}

@-ms-keyframes fadeInRightSmall {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(30px, 0, 0);
        -moz-transform: translate3d(30px, 0, 0);
        -ms-transform: translate3d(30px, 0, 0);
        -o-transform: translate3d(30px, 0, 0);
        transform: translate3d(30px, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
    }
}

@-o-keyframes fadeInRightSmall {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(30px, 0, 0);
        -moz-transform: translate3d(30px, 0, 0);
        -ms-transform: translate3d(30px, 0, 0);
        -o-transform: translate3d(30px, 0, 0);
        transform: translate3d(30px, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
    }
}

@keyframes fadeInRightSmall {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(30px, 0, 0);
        -moz-transform: translate3d(30px, 0, 0);
        -ms-transform: translate3d(30px, 0, 0);
        -o-transform: translate3d(30px, 0, 0);
        transform: translate3d(30px, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
    }
}

.animate__fadeInRight.small {
    -webkit-animation-name: fadeInRightSmall;
    animation-name: fadeInRightSmall
}

/* SUBSCRIBE CTA */

#component-subscribe {
    /* Full screen width at all time */
    max-width: initial;
    margin: 0;
    padding: 0;

    opacity: 1;
    z-index: 3;

    position: fixed;
    bottom: 50%;
    left: -20rem;

    transition: all 1s;
}

/* /common's app.css common-add.css file */

#page-overlay-loader .loader {
    background-color: rgba(249, 249, 249, 0.6); /* bgcolor-C12 */
}

.bootstrap-select .dropdown-toggle::after {
    content: url('/250756/assets/icons/picto-carret-down-c7.svg');
}

.bootstrap-select .bs-searchbox .clear-icon {
    background-image: url('/250756/assets/icons/picto-close-c2.svg');
}

.bootstrap-select .bs-searchbox::before {
    background-image: url('/250756/assets/icons/picto-search-c2.svg');
}

.bootstrap-select .dropdown-item:hover .check-mark::after {
    background-image: url('/250756/assets/icons/picto-check-c4.svg');
}
.bootstrap-select .dropdown-item.selected .check-mark::after {
    background-image: url('/250756/assets/icons/picto-check-c2.svg');
}

.custom-radio input:hover:not(:checked)~.custom-control-label::after {
    background-image: url('/250756/assets/icons/picto-radio-c4.svg');
}
.custom-radio .custom-control-input:checked~.custom-control-label::after {
    background-image: url('/250756/assets/icons/picto-radio-c2.svg');
}

.custom-checkbox input:hover:not(:checked)~.custom-control-label::after {
    background-image: url('/250756/assets/icons/picto-check-c4.svg');
}
.custom-checkbox .custom-control-input:checked~.custom-control-label::after {
    background-image: url('/250756/assets/icons/picto-check-c2.svg');
}

.fancybox-container .fancybox-toolbar .fancybox-button--close {
    background-image: url('/250756/assets/icons/picto-close-c2.svg');
}
.fancybox-container .fancybox-toolbar .fancybox-button--close:hover {
    background-image: url(/250756/assets/icons/picto-close-c1.svg);
}

.fancybox-container .fancybox-navigation .fancybox-button--arrow_left,
.fancybox-container .fancybox-navigation .fancybox-button--arrow_right {
    background-image: url('/250756/assets/icons/picto-arrow-up-c2.svg');
}
.fancybox-container .fancybox-navigation .fancybox-button--arrow_left:hover,
.fancybox-container .fancybox-navigation .fancybox-button--arrow_right:hover {
    background-image: url('/250756/assets/icons/picto-arrow-up-c1.svg');
}
.fancybox-container .fancybox-navigation .fancybox-button--arrow_left[disabled],
.fancybox-container .fancybox-navigation .fancybox-button--arrow_right[disabled] {
    background-image: url('/250756/assets/icons/picto-arrow-up-c4.svg') !important;
}