@keyframes pulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.1);
    }

    100% {
        transform: scale(1);
    }
}

.infobanner {
    bottom: 0;
    right: 0;
    pointer-events: none;
    z-index: 999;
    display: none;

    .container {
        padding-right: calc(var(--bs-gutter-x) * 0.5);
        padding-left: calc(var(--bs-gutter-x) * 0.5);

        .infobanner-content {
            animation: pulse 1s ease 0s 1;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='290' height='175'%3E%3Cpath fill='%238EADE0' transform='matrix(-1 0 0 1 290 50)' d='M124 124L0 124L0 0L124 124Z' fill-rule='evenodd'/%3E%3Cpath fill='%23108129' transform='matrix(1 0 0 -1 249 132)' d='M41 0L41 82L0 41L41 0Z' fill-rule='evenodd'/%3E%3C/svg%3E");
            background-repeat: no-repeat;
            background-position-x: 100%;
            background-position-y: 100%;
            background-color: rgba(0, 20, 61, 1);
            max-width: 404px;
            width: 100%;
            min-height: 242px;
            pointer-events: all;
            color: white;
            margin-bottom: 20px;

            .close-infobanner {
                width: 44px;
                height: 44px;
                background: none;
                padding: 0;
                border: 0;
                right: 0;
                top: 0;
                color: inherit;
                font-size:30px;
            }

            .items {
                padding: 26px;

                h1,
                h2,
                h3,
                h4,
                .h1,
                .h2,
                .h3,
                .h4 {
                    color: white;
                }

                .lead {
                    font-family: 'Source Sans 3';
                    font-weight: 300;
                    font-style: normal;
                    font-size: 42px;
                    letter-spacing: -0, 2px;
                    line-height: 1.2;
                }

                a[target="_blank"] {
                    white-space: nowrap;

                    &:before {
                        content: "\0079";
                        font-family: "Oepnv_picto";
                        display: inline-block;
                        position: relative;
                        top: 2px;
                        font-weight: 700;
                    }
                }
            }
        }
    }
}

@media (max-width: 410px) {
    .infobanner {
        .container {
            .infobanner-content {
                font-size: 18px !important;

                .items {
                    .lead {
                        font-size: 26px;
                    }
                    .btn-primary {
                        font-size: 18px !important;
                    }
                }
            }
        }
    }
}

[data-bs-contrast="richcontrast"] {
    .infobanner {
        .container {
            .infobanner-content {
                border: 1px solid #181C25;
                background-image: none;
                background-color: white;
                color: #181C25;

                .btn-primary {
                    background-color: #00143d !important;
                    border-color: #00143d !important;
                }
            }
        }
    }
}