.usa-alert { @include media($medium-screen) { background-size: 5.2rem; } background-color: #eeeeee; background-position: 1rem 2rem; background-repeat: no-repeat; background-size: 4rem; margin-top: 1.5em; padding: 1em; ul { margin: { bottom: 0; top: 1em; } } } .usa-alert-icon { display: table-cell; padding-right: 1rem; } .usa-alert-body { @include media($medium-screen) { padding-left: 5rem; } display: table-cell; padding-left: 3.5rem; vertical-align: top; } .usa-alert-heading { @include media($medium-screen) { margin-top: .3rem; } margin: { bottom: .3rem; top: 0; } } .usa-alert-text { font-family: $font-sans; margin: { bottom: 0; top: 0; } } .usa-alert-success { background-color: #E5FCDE; background-image: url('../img/alerts/success.png'); background-image: url('../img/alerts/success.svg'); } .usa-alert-warning { background-color: #FDF7DC; background-image: url('../img/alerts/warning.png'); background-image: url('../img/alerts/warning.svg'); } .usa-alert-error { background-color: #F9DEDE; background-image: url('../img/alerts/error.png'); background-image: url('../img/alerts/error.svg'); } .usa-alert-info { background-color: #E8F5FA; background-image: url('../img/alerts/info.png'); background-image: url('../img/alerts/info.svg'); } .usa-alert-no_icon { background-image: none; }