@import 'colors';
@import 'icons';

.notice-default {
  padding: 1em;
  margin: .5em;
  color: $dark_grey;
  background-color: $yellow;
  overflow: auto;
  line-height: 1.5;

  a.dismiss {
    margin-top: 0.25em;
    float: right;
    @extend .icon-x-large;
    text-indent: 100%;
    overflow: hidden;
    width: 2em;
    height: 2em;
  }
}

.notice-success {
  @extend .notice-default;
  color: $white;
  background-color: $lime;
}

.notice-warning {
  @extend .notice-default;
  color: $white;
  background-color: $orange;
}

.notice-danger {
  @extend .notice-default;
  color: $white;
  background-color: $dark_red;
}

@import 'colors';
@import 'icons';

.notice-default {
  padding: 1em;
  margin: .5em;
  color: $dark_grey;
  background-color: $yellow;
  overflow: auto;
  line-height: 1.5;

  a.dismiss {
    margin-top: 0.25em;
    float: right;
    @extend .icon-x-large;
    text-indent: 100%;
    overflow: hidden;
  }
}

.notice-success {
  @extend .notice-default;
  color: $white;
  background-color: $lime;

  a.dismiss {
    @include icon-white;
  }
}

.notice-warning {
  @extend .notice-success;
  color: $white;
  background-color: $orange;
}

.notice-danger {
  @extend .notice-success;
  color: $white;
  background-color: $dark_red;
}

Use white icons now that we have 'em
Use white icons now that we have 'em
