.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(//probeach.ru/wp-content/plugins/uxui-attention-codes/assets/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(//probeach.ru/wp-content/plugins/uxui-attention-codes/assets/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(//probeach.ru/wp-content/plugins/uxui-attention-codes/assets/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(//probeach.ru/wp-content/plugins/uxui-attention-codes/assets/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;
}
}