.cookie-alert {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    position: fixed;
    bottom: 0;
    transform: translate(-50%, 0);
    left: 50%;
    background: #fff;
    padding: 5px 10px;
    width: 70%;
    border-radius: 10px;
    border: 1px solid #5dc7c8;
    z-index: 1025;

    display: flex;
    flex-direction: row;
}

@keyframes cookie-alert-fade-in {
    from { opacity: 0; visibility: visible; }
    to   { opacity: 1; visibility: visible; }
}

@keyframes cookie-alert-fade-out {
    from { opacity: 1; visibility: visible; }
    to   { opacity: 0; visibility: hidden; }
}

.cookie-alert.active {
    animation: cookie-alert-fade-in 0.5s forwards;
    bottom: calc(40px + 10px);
    visibility: visible;
    pointer-events: auto;
    transition: bottom ease-in 0.3s;
}

.cookie-alert.hide {
    animation: cookie-alert-fade-out 0.5s forwards;
    pointer-events: none;
    bottom: calc(40px + 10px);
    transition: bottom ease-in 0.3s;
}

@media screen and (max-width: 574px) {
    .cookie-alert {
        width: 90%;
        flex-direction: column;
    }

}