:root {
    --notification-margin: 15px;
}

@media screen and (min-width: 1000px) {
    :root {
        --notification-margin: 35px;
    }
}


.notifications_container {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 128;
    margin-top: calc(var(--notification-margin) - 10px);
}

.notifications_success {
    background: #2ECC40;
    color: white;
}

.notifications_warning {
    background: #FCA624;
    color: white;
}


.notifications_error {
    background: #FF4136;
    color: white;
}

.notifications_info {
    background: #0074D9;
    color: white;
}


.notifications_notification {
    h4 {
        color: inherit;
        font-weight: bold;
        margin: 0;
    }

    span {
        margin-left: 3px;
        word-break: break-word;
        word-wrap: break-word;
    }

    position: static;
    margin-top:10px;
    margin-right:var(--notification-margin);
    padding: 0.5em;
    width: 300px;
    // transition: all .3s;
}