/* Entire toast container */
.toast-container {
  position: fixed;
  z-index: 999999999;
  max-width: 300px;
  /*min-width: 300px;*/
}

/* Each toast gets this style */
.toast {
  /*width: 300px;*/
  font-family: "helvetica neue";
  font-weight: 200;
  letter-spacing: 2px;
  opacity: 1;
  position: relative;
  right: 0;
  color: white;
  background: rgba(50,50,50,.9);
  padding: 20px;
  margin-bottom: 8px;
  border-radius: 3px;
  transition: .3s all ease;
}

.toast.toast-exit {
  transition: .4s all ease;
  transform: translate3d(0,0,0);
  right: -300px;
  opacity: 0;
}    
/* Successful toast class */
.toast-success {
  background: rgba(126,211,33,.9);
  box-shadow: 0 5px 15px rgba(126,211,33,.5);
}

.toast-info {
  background: #17a2b8;
  box-shadow: 0px 5px 15px rgba(0,50,250,.5);
}

/* Error toast class */
.toast-error {
  background: rgba(191,36,58,.9);
  box-shadow: 0 5px 15px rgba(191,36,58,.5);
}

/* Warn toast class */
.toast-warn {
  background: rgba(245,166,35,.9);
  box-shadow: 0 5px 15px rgba(245,166,35,.5);
}