$.notify.addStyle("metro", {
    html:
        "<div>" +
        "<div class='image' data-notify-html='image'/>" +
        "<div class='text-wrapper'>" +
        "<div class='title' data-notify-html='title'/>" +
        "<div class='text' data-notify-html='text'/>" +
        "</div>" +
        "</div>",
    classes: {
        default: {
            "color": "#ffffff !important",
            "background-color": "#3f51b5",
            "border": "1px solid #3f51b5"
        },
        error: {
            "color": "#ffffff !important",
            "background-color": "#ee6e73",
            "border": "1px solid #ee6e73"
        },
        custom: {
            "color": "#ffffff !important",
            "background-color": "#3f51b5",
            "border": "1px solid #3f51b5"
        },
        success: {
            "color": "#ffffff !important",
            "background-color": "#0a8010",
            "border": "1px solid #0a8010"
        },
        info: {
            "color": "#ffffff !important",
            "background-color": "#29b6f6",
            "border": "1px solid #29b6f6"
        },
        warning: {
            "color": "#ffffff !important",
            "background-color": "#ffc107",
            "border": "1px solid #ffc107"
        },
        black: {
            "color": "#ffffff !important",
            "background-color": "#4c5667",
            "border": "1px solid #4c5667"
        },
        white: {
            "background-color": "#ffffff",
            "border": "1px solid #ddd"
        }
    }
});