#notifications {

/*    position: fixed;

    display: flex;
    flex-direction: column;

    gap: 10px;

    z-index: 99999;

    pointer-events: none;*/
}

.notification-wrapper {

    pointer-events: auto;
}


.notifications {
 position:fixed;
 top:0;
 left:0;
 width:100%;
 z-index:1100
}

.notifications .notification {
 display:block;
 margin-bottom:1px;
 color:#fff;
 font-size:16px;
 font-weight:600;
 line-height:26px
}
.notifications .notification.notification-success {
 background-color:#10d365
}
.notifications .notification.notification-success .notification-inner .notification-icon:before {
 background:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Cpath fill='%23fff' d='M13 0a13 13 0 1013 13A13 13 0 0013 0zm3.25 7.92a.73.73 0 011.46 0V11a.73.73 0 01-1.46 0zM8 7.92a.73.73 0 011.46 0V11A.73.73 0 018 11zm11.71 7.14A6.87 6.87 0 0113 19.92a6.82 6.82 0 01-6.75-5.06.69.69 0 01.51-.86.73.73 0 01.87.52 5.38 5.38 0 005.33 4 5.42 5.42 0 005.29-3.84.73.73 0 01.89-.49.68.68 0 01.53.87z'/%3E%3C/svg%3E") 50% no-repeat
}
.notifications .notification.notification-warning {
 background-color:#999
}
.notifications .notification.notification-warning .notification-inner .notification-icon:before {
 background:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Cpath fill='%23fff' d='M13 0a13 13 0 1013 13A13 13 0 0013 0zm3.25 7.92a.73.73 0 011.46 0V11a.73.73 0 01-1.46 0zM8 7.92a.73.73 0 011.46 0V11A.73.73 0 018 11zm11.28 10.4H6.76a.7.7 0 110-1.4h12.48a.7.7 0 110 1.4z'/%3E%3C/svg%3E") 50% no-repeat
}
.notifications .notification.notification-error {
 background-color:#ff4246
}
.notifications .notification.notification-error .notification-inner .notification-icon:before {
 background:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Cpath fill='%23fff' d='M13 0a13 13 0 1013 13A13 13 0 0013 0zm3.25 7.92a.73.73 0 011.46 0V11a.73.73 0 01-1.46 0zM8 7.92a.73.73 0 011.46 0V11A.73.73 0 018 11zm11.19 11.8a.73.73 0 01-.89-.49A5.42 5.42 0 0013 15.4a5.38 5.38 0 00-5.33 4 .73.73 0 01-.87.52.69.69 0 01-.55-.82A6.82 6.82 0 0113 14a6.87 6.87 0 016.7 4.86.68.68 0 01-.55.87z'/%3E%3C/svg%3E") 50% no-repeat
}
.notifications .notification.notification-attention {
 background-color:#ff4246
}
.notifications .notification.notification-attention .notification-inner .notification-icon:before {
 background:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 15'%3E%3Cpath fill='%23fff' d='M9.024 12.507a1.13 1.13 0 01-1.122-1.137c0-.629.502-1.137 1.122-1.137a1.13 1.13 0 011.124 1.137 1.13 1.13 0 01-1.124 1.137zm-.76-8.723c0-.422.34-.767.757-.767s.758.345.758.767v4.549a.765.765 0 01-.758.767.764.764 0 01-.757-.767V3.784zm9.628 9.465L9.66.367a.747.747 0 00-1.287.002L.108 13.251c-.3.505.061 1.149.645 1.149h16.496c.583 0 .945-.645.643-1.151z'/%3E%3C/svg%3E") 50% no-repeat
}
.notifications .notification.notification-link:hover {
 cursor:pointer
}
.notifications .notification .notification-inner {
 display:flex;
 justify-content:center;
 align-items:center;
 padding:5px 0 6px
}
.notifications .notification .notification-inner .notification-icon {
 width:64px;
 height:64px;
 flex-basis:64px;
 min-width:64px;
 line-height:64px;
 text-align:center;
 position:relative
}
.notifications .notification .notification-inner .notification-icon:before {
 position:absolute;
 top:50%;
 left:50%;
 transform:translate3d(-50%,-50%,0);
 content:"";
 background-repeat:no-repeat;
 background-position:50%;
 background-size:26px;
 width:26px;
 height:26px
}
.notifications .notification .notification-inner .notification-text {
 padding:0 9px
}
.notifications.notifications-relative {
 position:relative;
 z-index:0
}
.notifications.notifications-relative .notification {
 margin-bottom:0
}
.fade-notifications-enter,
.fade-notifications-leave-to {
 opacity:0
}
.fade-notifications-enter-to,
.fade-notifications-leave {
 opacity:1
}
.fade-notifications-enter-active,
.fade-notifications-leave-active {
 transition:all .3s ease
}
@media (max-width:767px) {
 .notifications .container {
  padding:0
 }
 .notifications .notification .notification-inner {
  justify-content:flex-start
 }
}
.notifications.closable {
  cursor:pointer;
}

#bottom.notifications {
bottom: 0;
top: auto;
}