:root {
    --advert-background: #fbf8ee;
    --advert-font: #414042;
    --advert-height: 40px;
    --advert-padding: 10px 30px 10px 15px;
}

.advert_bar {
    display: flex;
    justify-content: center; /* center the content horizontally */
    align-items: center;
    background-color: var( --advert-background);
    color: var( --advert-font);
    padding: var( --advert-padding);
    position: relative; /* Needed for positioning the close button */
    width: 100%;
    transition: opacity 0.5s ease-out;
    max-height: var(--advert-height);
    
    svg *
    {
        fill: var( --advert-font);
    }

}

/* Wrap the message in a flex container that grows */
.advert_mesg {
    margin: 0;
    font-size: 14px;
    flex: 1; /* take all space except the button */

    p{
            display: inline-block;
            margin: 0;
        a{
            color: #6C6B6E;
            &:hover{
                text-decoration: none;
                color: grey;
            }

        }
    }
}

.important_advert {
    color: red;
}

@media only screen and (max-width: 1023px) {
    .advert_mesg {
        text-align: center;
    }
}

.language-switcher {
    top: var(--advert-height);
}