.notify {
    display: none;
    border-radius: 7px;
    position: fixed;
    width: 370px;
    right: 40px;
    top: 40px;
    box-shadow: 0 2px 2px 1px rgba(0, 0, 0, 0.1);
    text-align: left;
    z-index: 9999999;
}

    .notify .notify-message {
        color: #ffffff;
        margin-left: 40px;
        filter: dropshadow(color=#FFFFFF, offx=1, offy=1);
        word-wrap: break-word
    }

    .notify.notify-success {
        background: #00c851;
    }

.notify-success .notify-icon-success {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><mask id="a" width="24" height="24" x="0" y="0" maskUnits="userSpaceOnUse" style="mask-type:alpha"><path fill="%23D9D9D9" d="M0 0h24v24H0z"/></mask><g mask="url(%23a)"><path fill="%23fff" d="m10.6 16.6 7.05-7.05-1.4-1.4-5.65 5.65-2.85-2.85-1.4 1.4zM12 22a9.7 9.7 0 0 1-3.9-.788 10.1 10.1 0 0 1-3.175-2.137q-1.35-1.35-2.137-3.175A9.7 9.7 0 0 1 2 12q0-2.075.788-3.9a10.1 10.1 0 0 1 2.137-3.175q1.35-1.35 3.175-2.137A9.7 9.7 0 0 1 12 2q2.075 0 3.9.788a10.1 10.1 0 0 1 3.175 2.137q1.35 1.35 2.137 3.175A9.7 9.7 0 0 1 22 12a9.7 9.7 0 0 1-.788 3.9 10.1 10.1 0 0 1-2.137 3.175q-1.35 1.35-3.175 2.137A9.7 9.7 0 0 1 12 22"/></g></svg>') !important;
    background-repeat: no-repeat;
    min-height: 24px;
    margin: 20px;
    padding: 2px 0 0 0;
}

.notify.notify-warning {
    background: #ff3547;
}

.notify.notify-warning-orange {
    background: #ff9800;
}

.notify-warning .notify-icon-warning, .notify-warning-orange .notify-icon-warning {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><mask id="a" width="24" height="24" x="0" y="0" maskUnits="userSpaceOnUse" style="mask-type:alpha"><path fill="%23D9D9D9" d="M0 0h24v24H0z"/></mask><g mask="url(%23a)"><path fill="%23fff" d="M12 17q.424 0 .713-.288A.97.97 0 0 0 13 16a.97.97 0 0 0-.287-.713A.97.97 0 0 0 12 15a.97.97 0 0 0-.713.287A.97.97 0 0 0 11 16q0 .424.287.712.288.288.713.288m-1-4h2V7h-2zm1 9a9.7 9.7 0 0 1-3.9-.788 10.1 10.1 0 0 1-3.175-2.137q-1.35-1.35-2.137-3.175A9.7 9.7 0 0 1 2 12q0-2.075.788-3.9a10.1 10.1 0 0 1 2.137-3.175q1.35-1.35 3.175-2.137A9.7 9.7 0 0 1 12 2q2.075 0 3.9.788a10.1 10.1 0 0 1 3.175 2.137q1.35 1.35 2.137 3.175A9.7 9.7 0 0 1 22 12a9.7 9.7 0 0 1-.788 3.9 10.1 10.1 0 0 1-2.137 3.175q-1.35 1.35-3.175 2.137A9.7 9.7 0 0 1 12 22"/></g></svg>') !important;
    background-repeat: no-repeat;
    min-height: 24px;
    margin: 20px;
    padding: 2px 0 0 0;
}

.notify.notify-info {
    background: #33b5e5;
}

.notify-info .notify-icon-info {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><mask id="a" width="24" height="24" x="0" y="0" maskUnits="userSpaceOnUse" style="mask-type:alpha"><path fill="%23D9D9D9" d="M0 0h24v24H0z"/></mask><g mask="url(%23a)"><path fill="%23fff" d="M11 17h2v-6h-2zm1-8q.424 0 .713-.287A.97.97 0 0 0 13 8a.97.97 0 0 0-.287-.713A.97.97 0 0 0 12 7a.97.97 0 0 0-.713.287A.97.97 0 0 0 11 8q0 .424.287.713Q11.576 9 12 9m0 13a9.7 9.7 0 0 1-3.9-.788 10.1 10.1 0 0 1-3.175-2.137q-1.35-1.35-2.137-3.175A9.7 9.7 0 0 1 2 12q0-2.075.788-3.9a10.1 10.1 0 0 1 2.137-3.175q1.35-1.35 3.175-2.137A9.7 9.7 0 0 1 12 2q2.075 0 3.9.788a10.1 10.1 0 0 1 3.175 2.137q1.35 1.35 2.137 3.175A9.7 9.7 0 0 1 22 12a9.7 9.7 0 0 1-.788 3.9 10.1 10.1 0 0 1-2.137 3.175q-1.35 1.35-3.175 2.137A9.7 9.7 0 0 1 12 22"/></g></svg>') !important;
    background-repeat: no-repeat;
    min-height: 24px;
    margin: 20px;
    padding: 2px 0 0 0;
}