.fl-main-container {
  position: fixed;
  transition: all 1s ease-in-out;
  width: 24em;
  z-index: 99999
}
@media only screen and (max-width:480px) {
  .fl-main-container {
    left: .5em;
    right: .5em;
    width: auto
  }
}
.fl-main-container[data-position^=top-] {
  top: .5em
}
.fl-main-container[data-position^=bottom-] {
  bottom: .5em
}
.fl-main-container[data-position$=-right] {
  right: .5em
}
.fl-main-container[data-position$=-right] .fl-container {
  transform: translateX(110%)
}
.fl-main-container[data-position$=-left] {
  left: .5em
}
.fl-main-container[data-position$=-left] .fl-container {
  transform: translateX(-110%)
}
.fl-main-container[data-position$=-center] {
  left: 50%;
  transform: translateX(-50%)
}
.fl-main-container[data-position=top-center] .fl-container {
  transform: translateY(-100vh)
}
.fl-main-container[data-position=bottom-center] .fl-container {
  transform: translateY(100vh)
}
.fl-main-container .fl-container {
  transition: transform .3s ease-in-out
}
.fl-main-container .fl-container.fl-show {
  transform: translate(0)
}
.fl-main-container .fl-container .fl-progress-bar {
  display: flex;
  height: 3px;
  margin-left: -1px
}
.fl-main-container .fl-container.fl-rtl {
  direction: rtl
}
.fl-main-container .fl-container.fl-rtl .fl-progress-bar {
  margin-left: auto;
  margin-right: -1px
}
.fl-main-container .fl-container.fl-success .fl-icon {
  background-color: #059669
}
.fl-main-container .fl-container.fl-success .fl-progress-bar {
  background-color: #6dface
}
.fl-main-container .fl-container.fl-success .fl-progress-bar .fl-progress {
  background-color: #059669
}
.fl-main-container .fl-container.fl-flasher.fl-success {
  border: 1px solid #059669;
  border-left: 8px solid #059669
}
.fl-main-container .fl-container.fl-flasher.fl-success.fl-rtl {
  border: 1px solid #059669;
  border-right: 8px solid #059669
}
.fl-main-container .fl-container.fl-flasher.fl-success:not(.fl-rtl) {
  border: 1px solid #059669;
  border-left: 8px solid #059669;
}
.fl-main-container .fl-container.fl-flasher.fl-success .fl-title {
  color: #059669
}
.fl-main-container .fl-container.fl-info .fl-icon {
  background-color: #2563eb
}
.fl-main-container .fl-container.fl-info .fl-progress-bar {
  background-color: #e0e9fc
}
.fl-main-container .fl-container.fl-info .fl-progress-bar .fl-progress {
  background-color: #2563eb
}
.fl-main-container .fl-container.fl-flasher.fl-info {
  border: 1px solid #2563eb;
  border-left: 8px solid #2563eb
}
.fl-main-container .fl-container.fl-flasher.fl-info.fl-rtl {
  border: 1px solid #2563eb;
  border-right: 8px solid #2563eb
}
.fl-main-container .fl-container.fl-flasher.fl-info:not(.fl-rtl) {
  border: 1px solid #2563eb;
  border-left: 8px solid #2563eb;
}
.fl-main-container .fl-container.fl-flasher.fl-info .fl-title {
  color: #2563eb
}
.fl-main-container .fl-container.fl-warning .fl-icon {
  background-color: #d97706
}
.fl-main-container .fl-container.fl-warning .fl-progress-bar {
  background-color: #fdd8ae
}
.fl-main-container .fl-container.fl-warning .fl-progress-bar .fl-progress {
  background-color: #d97706
}
.fl-main-container .fl-container.fl-flasher.fl-warning {
  border: 1px solid #d97706;
  border-left: 8px solid #d97706
}
.fl-main-container .fl-container.fl-flasher.fl-warning.fl-rtl {
  border: 1px solid #d97706;
  border-right: 8px solid #d97706
}
.fl-main-container .fl-container.fl-flasher.fl-warning:not(.fl-rtl) {
  border: 1px solid #d97706;
  border-left: 8px solid #d97706;
}
.fl-main-container .fl-container.fl-flasher.fl-warning .fl-title {
  color: #d97706
}
.fl-main-container .fl-container.fl-error .fl-icon {
  background-color: #dc2626
}
.fl-main-container .fl-container.fl-error .fl-progress-bar {
  background-color: #f8d6d6
}
.fl-main-container .fl-container.fl-error .fl-progress-bar .fl-progress {
  background-color: #dc2626
}
.fl-main-container .fl-container.fl-flasher.fl-error {
  border: 1px solid #dc2626;
  border-left: 8px solid #dc2626
}
.fl-main-container .fl-container.fl-flasher.fl-error.fl-rtl {
  border: 1px solid #dc2626;
  border-right: 8px solid #dc2626
}
.fl-main-container .fl-container.fl-flasher.fl-error:not(.fl-rtl) {
  border: 1px solid #dc2626;
  border-left: 8px solid #dc2626;
}
.fl-main-container .fl-container.fl-flasher.fl-error .fl-title {
  color: #dc2626
}
.fl-main-container .fl-container .fl-icon {
  border-radius: 50%;
  box-sizing: border-box;
  color: #fff;
  display: inline-block;
  height: 1em;
  margin: 0;
  min-height: 1em;
  min-width: 1em;
  position: relative;
  transition: all 1s;
  width: 1em
}
.fl-main-container .fl-container .fl-icon:after, .fl-main-container .fl-container .fl-icon:before {
  border-width: 0;
  box-sizing: border-box;
  content: "";
  position: absolute;
  transition: all 1s
}
.fl-main-container .fl-container.fl-success .fl-icon:after, .fl-main-container .fl-container.fl-success .fl-icon:before {
  background-color: currentColor;
  border-radius: .1em;
  height: .6em;
  left: .35em;
  top: .6em;
  transform: rotate(-135deg);
  transform-origin: .08em .08em;
  width: .16em
}
.fl-main-container .fl-container.fl-success .fl-icon:after {
  height: .16em;
  width: .4em
}
.fl-main-container .fl-container.fl-info .fl-icon:after, .fl-main-container .fl-container.fl-info .fl-icon:before {
  background-color: currentColor;
  border-radius: .03em;
  left: 50%;
  transform: translateX(-50%);
  width: .15em
}
.fl-main-container .fl-container.fl-info .fl-icon:before {
  height: .38em;
  top: .4em
}
.fl-main-container .fl-container.fl-info .fl-icon:after {
  box-shadow: -.06em .19em, -.06em .44em, .06em .44em;
  height: .13em;
  top: .21em
}
.fl-main-container .fl-container.fl-warning .fl-icon:after, .fl-main-container .fl-container.fl-warning .fl-icon:before {
  background-color: currentColor;
  border-radius: .03em;
  left: 50%;
  transform: translateX(-50%);
  width: .15em
}
.fl-main-container .fl-container.fl-warning .fl-icon:before {
  height: .38em;
  top: .21em
}
.fl-main-container .fl-container.fl-warning .fl-icon:after {
  height: .13em;
  top: .65em
}
.fl-main-container .fl-container.fl-error .fl-icon:after, .fl-main-container .fl-container.fl-error .fl-icon:before {
  background-color: currentColor;
  border-radius: .1em;
  height: .7em;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) rotate(-135deg);
  width: .16em
}
.fl-main-container .fl-container.fl-error .fl-icon:after {
  transform: translate(-50%, -50%) rotate(-45deg)
}
.fl-main-container .fl-container.fl-flasher {
  background-color: #fff;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);
  color: #4b5563;
  cursor: pointer;
  line-height: 1.5;
  margin-top: 15px;
  margin-right: 15px;
  word-break: break-word
}
.fl-main-container .fl-container.fl-flasher.fl-rtl {
  border-radius: 0 .375em .375em 0
}
.fl-main-container .fl-container.fl-flasher:not(.fl-rtl) {
  border-radius: 4px;
}
.fl-main-container .fl-container.fl-flasher .fl-content {
  align-items: center;
  display: flex;
  padding: .75em
}
.fl-main-container .fl-container.fl-flasher .fl-icon {
  font-size: 2.5em
}
.fl-main-container .fl-container.fl-flasher .fl-message, .fl-main-container .fl-container.fl-flasher .fl-title {
  display: block;
  line-height: 1.25em;
  margin-left: 1em;
  margin-right: 1em
}
.fl-main-container .fl-container.fl-flasher .fl-message:first-letter, .fl-main-container .fl-container.fl-flasher .fl-title:first-letter {
  text-transform: uppercase
}
.fl-main-container .fl-container.fl-flasher .fl-title {
  font-size: 1em;
  font-weight: 700
}
.fl-main-container .fl-container.fl-flasher .fl-message {
  font-size: .875em;
  margin-top: .25em
}