/*
* STYLES FOR UXUI ATTENTION CODES PLUGIN BY UXUI.MEDIA
*/

.attention-blue,
.attention-border,
.attention-green,
.attention-orange,
.attention-red,
.attention-yellow,
.attention-grey {
    margin: 1.5em 0;
    padding: 1em;
    overflow: hidden;
}

.attention-border {
    background: #fff;
    border: 1px solid #777
}

.attention-red {
    background: #ffe6e6;
    border-left: 4px solid red
}

.attention-blue {
    background: #e5f5fa;
    border-left: 6px solid #00a0d2
}

.attention-orange,
.attention-yellow {
    background: #fff5e6;
    border-left: 4px solid #f90
}

.attention-green {
    background: #ebfaeb;
    border-left: 4px solid #3c3
}

.attention-grey {
    background: #bcbcbc;
    border-left: 4px solid #565656
}

.attention-ino {
    margin: 0 0 1em;
    padding: 1em;
    overflow: hidden;
    border-left: 4px solid #56c2b1
}

.attention-ino a {
    font-weight: 600
}

.attention-ino:before {
    display: inline-block;
    width: 48px;
    height: 48px;
    content: " ";
    margin-right: 10px;
    background-image: url(../images/ino.svg);
    background-repeat: no-repeat;
    vertical-align: middle
}

.attention-zip {
    margin: 0 0 1em;
    padding: 1em;
    overflow: hidden;
    border-left: 4px solid #dbab27
}

.attention-zip a {
    font-weight: 600
}

.attention-zip:before {
    display: inline-block;
    width: 48px;
    height: 48px;
    content: " ";
    margin-right: 10px;
    background-image: url(../images/zip.svg);
    background-repeat: no-repeat;
    vertical-align: middle
}

.attention-git {
    margin: 0 0 1em;
    padding: 1em;
    overflow: hidden;
    border-left: 4px solid #dbab27
}

.attention-git a {
    font-weight: 600
}

.attention-git:before {
    display: inline-block;
    width: 48px;
    height: 48px;
    content: " ";
    margin-right: 10px;
    background-image: url(../images/git.svg);
    background-repeat: no-repeat;
    vertical-align: middle
}

.attention-pdf {
    margin: 0 0 1em;
    padding: 1em;
    overflow: hidden;
    border-left: 4px solid #c00
}

.attention-pdf a {
    font-weight: 600
}

.attention-pdf:before {
    display: inline-block;
    width: 48px;
    height: 48px;
    content: " ";
    margin-right: 10px;
    background-image: url(../images/pdf.svg);
    background-repeat: no-repeat;
    vertical-align: middle
}

@media (min-width: 992px) {
    .attention-blue,
    .attention-border,
    .attention-green,
    .attention-orange,
    .attention-red,
    .attention-yellow, {
    .attention-grey {
        font-size: 1.15em;
    }
}