.notify-container {
    position: fixed;
    top: 0;
    right: 0;
    width: auto;
    z-index: 1061;
}
.notify-container:before,
.notify-container:after {
    display: table;
    content: "";
}
.notify-container:after {
    clear: both;
}
.notify-container.position-left {
    left: 0;
    right: auto;
}
.notify-container.position-top {
    left: 0;
    right: 0;
    top: 0;
    height: auto;
}
.notify-container.position-top .notify {
    float: left;
}
.notify-container.position-bottom {
    left: 0;
    right: 0;
    bottom: 0;
    top: auto;
    height: auto;
}
.notify-container.position-bottom .notify {
    float: left;
}
.notify {
    display: block;
    margin: .3125rem;
    padding: .625rem;
    min-width: 200px;
    cursor: default;
    max-width: 300px;
    position: relative;
}
.notify .notify-icon {
    width: 32px;
    height: 32px;
    font-size: 32px;
    text-align: center;
    position: absolute;
    margin: -16px 10px;
    top: 50%;
    left: 0;
}
.notify .notify-icon ~ .notify-title,
.notify .notify-icon ~ .notify-text {
    position: relative;
    margin-left: 42px;
}
.notify .notify-title,
.notify .notify-text {
    display: block;
    margin-right: 20px;
}
.notify .notify-title {
    font-weight: 500;
    font-size: 1.3em;
}
.notify .notify-text {
    font-size: 1em;
}
.notify .notify-closer {
    position: absolute;
    height: 1rem;
    width: 1rem;
    text-align: center;
    vertical-align: middle;
    font-size: 1rem;
    font-weight: normal;
    padding: 0 0 .625rem 0;
    z-index: 3;
    outline: none;
    cursor: pointer;
    background-color: #ffffff;
    color: #777777;
    top: .25rem;
    right: .25rem;
}
.notify .notify-closer:after {
    border-color: #777777;
    content: '\D7';
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -0.65rem;
    margin-left: -0.35rem;
}
.notify .notify-closer:hover {
    background-color: #cde6f7;
    color: #ffffff;
}
.notify .notify-closer:active {
    background-color: #92c0e0;
    color: #ffffff;
}
.notify {
    background-color: #e5f3fb;
    color: #1d1d1d;
}
.notify.success {
    background-color: #60a917;
    color: #ffffff;
}
.notify.success .notify-closer {
    background-color: #60a917;
    color: #ffffff;
}
.notify.success .notify-closer:hover {
    background-color: #7ad61d;
}
.notify.success .notify-closer:active {
    background-color: #128023;
}
.notify.alert {
    background-color: #ce352c;
    color: #ffffff;
}
.notify.alert .notify-closer {
    background-color: #ce352c;
    color: #ffffff;
}
.notify.alert .notify-closer:hover {
    background-color: #da5a53;
}
.notify.alert .notify-closer:active {
    background-color: #9a1616;
}
.notify.warning {
    background-color: #fa6800;
    color: #ffffff;
}
.notify.warning .notify-closer {
    background-color: #fa6800;
    color: #ffffff;
}
.notify.warning .notify-closer:hover {
    background-color: #ffc194;
}
.notify.warning .notify-closer:active {
    background-color: #bf5a15;
}
.notify.info {
    background-color: #1ba1e2;
    color: #ffffff;
}
.notify.info .notify-closer {
    background-color: #1ba1e2;
    color: #ffffff;
}
.notify.info .notify-closer:hover {
    background-color: #59cde2;
}
.notify.info .notify-closer:active {
    background-color: #1b6eae;
}
