Vorlage:Hinweisbox/styles.css

/* Infoboxes */
.hw-messagebox {
padding: 14px;
margin: 2em 0 1em 0;
display: block;
position:relative;
clear:both;
}
.hw-messagebox.icon {
padding-left: 35px;
}
.hw-messagebox.icon:before {
position: absolute;
font-size: 1.6em;
top: 8px;
font-family: "fontawesome";
left:8px;
}
.hw-messagebox p {
	margin:0
}
.notification-note, .notification-Hinweis {
border-left: solid 4px #2b80ea;
background:#dfecfc;
}
.boxlabel {	
font-weight:bold;
padding-right:0.5em;
}
.notification-note.icon::before, .notification-Hinweis.icon::before{
content: "\f05a ";
color: #2b80ea;
}
.notification-tip,.notification-Tipp {
border-left: solid 4px #359f5d;
background:#e3fcef;
}
.notification-tip.icon::before, .notification-Tipp.icon::before{
font-family: "bootstrap-icons"!important;
content: "\f26a";
color: #359f5d;
font-size: 1.2em;
margin-left: 5px;
top:12px;
}
.notification-warning, .notification-Warnung  {
border-left: solid 4px #bd1d1d;
background: #f5dcdc;
}
.notification-warning.icon::before, .notification-Warnung.icon::before{
content: "\f071";
color: #bd1d1d;
}
.notification-important, .notification-Wichtig {
border-left: solid 4px #ffa406;
background: #fedb9c;
margin-left: 2px;
}
.notification-important.icon::before, .notification-Wichtig.icon::before{
content: "\f06a";
color: #ffa406;
}
.notification-example, .notification-Beispiel {
border-left: solid 4px #94c11f;
background: #eff6dd;
}
.notification-example.icon::before, .notification-Beispiel.icon::before{
content: "\f0a4";
color: #94c11f;
}
.notification-neutral, .notification-Neutral {
border-left: solid 4px #747474;
background:#f1f3f9; 
padding:14px;
}
.notification-neutral.icon::before, .notification-Neutral.icon::before{
content: "\f0a9 ";
color: #747474;
left: 10px;
top: 8px;
}
.notification-neutral .boxlabel, .notification-Neutral .boxlabel {
display:none;
}