// This file has been autogenerated by grunt task lessToSass. Any changes will be overwritten.

.alert {
  border: 0;
  border-radius: 0;
  position: relative;
  padding: 20px 15px;
  line-height: 20px;
  margin-bottom: 20px;

  .notifications & {
    margin-bottom: 0;
  }

  b {
    font-weight: $font-weight-bold;
    text-transform: uppercase;
    font-size: $font-size-small;
  }

  @include alert-color($gray-color);

  &.alert-info {
    @include alert-color(lighten($brand-info, 5%));
  }

  &.alert-danger {
    @include alert-color(lighten($brand-danger, 5%));
  }

  &.alert-primary {
    @include alert-color(lighten($brand-primary, 5%));
  }

  &.alert-warning {
    @include alert-color(lighten($brand-warning, 5%));
  }

  &.alert-success {
    @include alert-color(lighten($brand-success, 5%));
  }

  &-info,
  &-danger,
  &-warning,
  &-success {
    color: $mdb-text-color-light;
  }

  &-default {
    a,
    .alert-link {
      color: $mdb-text-color-primary;
    }
  }

  .close {
    float: right;
    font-size: inherit;
    font-weight: 700;
    line-height: 1;
    color: $white-color;
    opacity: 0.9;
    background-color: transparent;
    border: 0;
    cursor: pointer;
  }

  i[data-notify="icon"] {
    font-size: 30px;
    display: block;
    left: 15px;
    position: absolute;
    top: 50%;
    margin-top: -15px;
  }

  span {
    display: block;
    max-width: 89%;
  }

  .alert-icon {
    display: block;
    float: left;
    margin-right: $margin-base;

    i {
      margin-top: -7px;
      top: 5px;
      position: relative;
    }
  }
}

.alert.alert-with-icon {
  padding-left: 65px;
}
