.mx-message-wrapper {
  position: fixed;
  display: flex;
  width: 100%;
  padding: 0 20px;
  flex-direction: column;
  box-sizing: border-box;
  pointer-events: none;
  z-index: var(--z-index-message);
}
.mx-message-wrapper-top {
  top: 20px;
}
.mx-message-wrapper-top-left {
  top: 20px;
}
.mx-message-wrapper-top-right {
  top: 20px;
}
.mx-message-wrapper-bottom {
  bottom: 20px;
}
.mx-message-wrapper-bottom-left {
  bottom: 20px;
}
.mx-message-wrapper-bottom-right {
  bottom: 20px;
}