.notification-container{
	position: fixed;
	bottom: 0;
	right: 0;
    z-index: 2000;
}

.notif-pane{
	position: relative;
    bottom: 0;
    right: 0;
    width: 400px;
    background-color: rgba(0,0,0,0.85);
    padding: 0;
    color: #fff;
    box-shadow: -1px 0px 2px rgba(0,0,0,0.3);
	transition: 250ms height,transition ease-out;
	margin-top: 5px;
}
.notif-pane:active {
    transform: rotate3d(0.7,0.6,0,15deg);
    transform-origin: 100%;
    transition: 100ms transform cubic-bezier(0, 0, 0, 1.17);
}
.notif-pane:hover {
    background: linear-gradient(rgba(0, 0, 0,0.85), rgba(13, 75, 111, 0.94));
}

.notif-pane a.close {
    position: absolute;
    font-size: 38px;
    color: #fff;
    text-shadow: 0px 0px 2px #000;
    right: 7px;
    top: 8px;
    cursor: pointer;
    width: 26px;
    height: 22px;
    text-align: center;
    padding: 0;
    z-index: 3000;
}
.notif-pane .notif-wrapper{ cursor: pointer; }

.notif-pane.hide{ height: 0px !important; }
.notif-pane .notif-heading{ position: relative; }

.notif-pane .notif-heading .notif-image {
    height: 150px;
    overflow: hidden;
    display: flex;
    align-items: center;
}
.notif-pane .notif-heading img{width: 100%;}
.notif-pane .notif-heading h3 {
    padding: 15px 40px 0px 15px;
    font-size: 1.5em;
    font-weight: 500;
}
.notif-body {
    padding: 0 15px 15px 15px;
}