@import variables

.alert
  padding: 8px 35px 8px 14px
  margin-top: 5px
  margin-bottom: 5px
  color: alert-color('default')
  background-color: alert-bg-color('default')
  border: 1px solid alert-border-color('default')
  border-radius: 4px

.alert-success
  color: alert-color('success')
  background-color: alert-bg-color('success')
  border-color: alert-border-color('success')

.alert-error
  color: alert-color('error')
  background-color: alert-bg-color('error')
  border-color: alert-border-color('error')

.alert-info
  color: alert-color('info')
  background-color: alert-bg-color('info')
  border-color: alert-border-color('info')

.alert-normal
  color: alert-color('normal')
  background-color: alert-bg-color('normal')
  border-color: alert-border-color('normal')

.alert
  ul
    margin-top: 10px
    margin-bottom: 10px
  li
    margin-left: 25px

.alert-fade-out
  text-align: center
  position: fixed
  bottom: 0
  left: 20%
  width: 60%
  padding-top: 5px
  padding-bottom: 5px
  margin-bottom: 0
  border-width: 1px 0 0
  border-radius: 4px 4px 0 0
  z-index: 9999
  opacity: 1
  animation: fadeout 5s linear forwards

@keyframes fadeout
  0%
    opacity: 1
  100%
    opacity: 0