.micro-alert {
  position:fixed;
  top:30px;
  right:30px;
  padding:0;
  font-size:16px;
  z-index:99999
}

.micro-alert:empty {
  display:none
}

.micro-alert-item {
  display:flex;
  align-items:center;
  margin-bottom:10px;
  border-radius:3px;
  padding:5px 10px;
  animation:micro-alert .3s;
  color:#004085;
  background-color:#cce5ff;
  border-color:#b8daff
}

.micro-alert-item.is-warning {
  color:#856404;
  background-color:#fff3cd;
  border-color:#ffeeba
}

.micro-alert-item.is-success {
  color:#155724;
  background-color:#d4edda;
  border-color:#c3e6cb
}

.micro-alert-item.is-danger {
  color:#721c24;
  background-color:#f8d7da;
  border-color:#f5c6cb
}

@keyframes micro-alert {
  from {
    transform:scale(0)
  }
  to {
    transform:scale(1)
  }

}

@media (max-width:480px) {
  .micro-alert {
    top:0;
    right:0;
    left:0
  }
  .micro-alert-item {
    border-radius:0;
    padding:15px 10px;
    justify-content:center;
    text-align:center;
    width:100%
  }

}