.k-i-notification::before {
    content: "\e400";
}

.k-notification-group {
    position: fixed;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    max-height: 100%;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
}

.k-notification-container {
    margin: 0.375rem 0;
    display: -ms-inline-flexbox;
    display: inline-flex;
    vertical-align: top;
}

.k-notification-container-animating {
    overflow: hidden;
}

.k-notification {
    width: 400px !important;
    border-radius: 0.25rem;
    padding: 0.75rem 1.25rem;
    border-width: 1px;
    border-style: solid;
    box-sizing: border-box;
    outline: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-size: 0.875rem;
    line-height: 1.5;
    cursor: default;
    position: relative;
    display: block;
    -webkit-touch-callout: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-notification-wrap {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

    .k-notification-wrap > .k-icon {
        margin-top: 3px;
        margin-right: 0.5rem;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    }

    .k-notification-wrap > .k-i-close {
        margin-right: 0;
        margin-left: 0.5rem;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        cursor: pointer;
    }

    .k-notification-wrap > .k-notification-content {
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }

.k-rtl .k-notification .k-notification-wrap > .k-icon,
[dir="rtl"] .k-notification .k-notification-wrap > .k-icon {
    margin-right: 0;
    margin-left: 0.5rem;
}

.k-rtl .k-notification .k-notification-wrap > .k-i-close,
[dir="rtl"] .k-notification .k-notification-wrap > .k-i-close {
    margin-left: 0;
    margin-right: 0.5rem;
}

.k-ie9 .k-notification-wrap {
    white-space: nowrap;
}

    .k-ie9 .k-notification-wrap > .k-icon {
        vertical-align: top;
    }

    .k-ie9 .k-notification-wrap > .k-notification-content {
        display: inline-block;
        vertical-align: middle;
        white-space: normal;
    }

.k-notification {
    border-color: #dee2e6;
    color: #212529;
    background-color: #ffffff;
}

.k-notification-wrap > .k-i-close {
    color: inherit;
}

.k-notification-group .k-notification {
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.03), 0 4px 5px 0 rgba(0, 0, 0, 0.04);
}

.k-notification-primary {
    border-color: #cce5ff;
    color: #004085;
    background-color: #b8daff;
}

.k-notification-secondary {
    border-color: #fafafb;
    color: #77787a;
    background-color: #f7f8f9;
}

.k-notification-tertiary {
    border-color: #e2d9f3;
    color: #3a2264;
    background-color: #d7caee;
}

.k-notification-info {
    border-color: #d1ecf1;
    color: #0c5460;
    background-color: #bee5eb;
}

.k-notification-success {
    border-color: #d4edda;
    color: #155724;
    background-color: #c3e6cb;
}

.k-notification-warning {
    border-color: #fff3cd;
    color: #856404;
    background-color: #ffeeba;
}

.k-notification-error {
    border-color: #f8d7da;
    color: #721c24;
    background-color: #f5c6cb;
}

.k-notification-dark {
    border-color: #d6d8d9;
    color: #1b1e21;
    background-color: #c6c8ca;
}

.k-notification-light {
    border-color: #fefefe;
    color: #818182;
    background-color: #fdfdfe;
}

.k-notification-inverse {
    border-color: #d6d8d9;
    color: #1b1e21;
    background-color: #c6c8ca;
}

.k-notification-danger {
    border-color: #f8d7da;
    color: #721c24;
    background-color: #f5c6cb;
}