.text-end .alert {
    text-align: left;
    float: left;
}
.alert {
    position: relative;
    padding: $alert-padding-y $alert-padding-x $alert-padding-y 3rem;
    margin-bottom: $line-height-computed;

    &:before {
        @include fonttype(solid);
        position: absolute;
        left: $alert-padding-x;
        top: 0.5625rem; // 9px;
        font-size: $font-size-base * 1.25; // 20px;
    }

    h2 {
        font-size: $font-size-base * 1.25; // 20px
    }

    h1, h2, h3, h4, h5, h6 {
        margin-top: 0;
        margin-bottom: $spacing-base;
        color: inherit;
        font-family: $font-family-base;
        font-weight: $font-weight-bold;
    }
    ul {
        padding-left: $spacing-xl;
    }
    .table {
        margin-top: $spacing-base;
        color: inherit;
        background-color: rgba($body-bg, 0.75);
        >thead{
            color: inherit;
        }
        >thead>tr>th {
            color: inherit;
            vertical-align: bottom;
            border-bottom: $table-border-width solid rgba($table-border-color, 0.05);
        }
        >thead>tr>th,
        >thead>tr>td,
        >tbody>tr>th,
        >tbody>tr>td,
        >tfoot>tr>th,
        >tfoot>tr>td {
            border-top: $table-border-width solid $table-border-color;
            &:first-child {
                padding-left:0;
            }
        }
    }
    a {
        font-weight: $font-weight-bold;
        text-decoration: underline;

        &:hover,
        &:focus {
            text-decoration: underline;
        }
    }
}

.alert-default {
    background-color: rgba($body-bg, 0.4);
    border: $alert-border-width solid scale-color($gray-400, $lightness: 8%);
    color: $theme-text-midtone-color;
    padding-left: 1.25rem;
}

// overrides bootstrap calculations so this is same as states
.alert-success {
    color: scale-color($success, $lightness: -30%);
    background-color: scale-color($success, $lightness: 70%);
    border-color: scale-color($success, $lightness: 50%);
    &:before {
      content: fa-content($fa-var-check);
      color: scale-color($success, $lightness: -30%);
    }
    a {
        color: scale-color($success, $lightness: -30%);
    }
}
.alert-pending {
    color: scale-color($info, $lightness: -30%);
    background-color: scale-color($info, $lightness: 70%);
    border-color: scale-color($info, $lightness: 50%);
    &:before {
      content: fa-content($fa-var-spinner);
      color: scale-color($info, $lightness: -30%);
      animation: fa-spin 1s infinite steps(8);
    }
    a {
        color: scale-color($info, $lightness: -30%);
    }
}
.alert-info {
    color: scale-color($info, $lightness: -30%);
    background-color: scale-color($info, $lightness: 70%);
    border-color: scale-color($info, $lightness: 50%);
    &:before {
      content: fa-content($fa-var-info-circle);
      color: scale-color($info, $lightness: -30%);
    }
    a {
        color: scale-color($info, $lightness: -30%);
    }
}
.alert-warning {
    color: scale-color($warning, $lightness: -40%);
    background-color: scale-color($warning, $lightness: 85%);
    border-color: scale-color($warning, $lightness: 50%);
    &:before {
      content: fa-content($fa-var-exclamation-triangle);
      color: scale-color($warning, $lightness: -40%);
    }
    a {
        color: scale-color($warning, $lightness: -40%);
    }
}
.alert-danger {
    color: scale-color($danger, $lightness: -30%);
    background-color: scale-color($danger, $lightness: 70%);
    border-color: scale-color($danger, $lightness: 50%);
    &:before {
      content: fa-content($fa-var-times);
      color: scale-color($danger, $lightness: -30%);
    }
    a {
        color: scale-color($danger, $lightness: -30%);
    }
}
.alert-submitted {
    background-color: $state-submitted-bg;
    border: $alert-border-width solid $state-submitted-border;
    color: $state-submitted-text;
    padding-left: 1.25rem;
    a {
        color: $state-submitted-text;
    }
}

// people search when nobody is selected and edit button is pressed
#nousersselected {
  margin-top: 1rem;
}

// alerts in list-group-item like plugin administration
.list-group-item .alert {
  margin: .5rem 0 0 0;
}
