.icon { flex-shrink: 0; display: inline-flex; justify-content: center; align-items: center; }
.icon:before { content: ""; display: block; background-repeat: no-repeat; background-position: center; background-size: contain; width: 1em; height: 1em; max-width: 100%; max-height: 100%; }
.icon img { width: 1em; height: 1em; }

.icon-close:before { background-image: url(../img/icon/close.svg); }
.icon-trash:before { background-image: url(../img/icon/trash.svg); }
.icon-bugger:before { background-image: url(../img/icon/bugger.svg); }
.icon-search:before { background-image: url(../img/icon/search.svg); }
.icon-block:before { background-image: url(../img/icon/icon-block.svg); }
.icon-hourglass:before { background-image: url(../img/icon/icon-hourglass.svg); }
.icon-exmark:before { background-image: url(../img/icon/icon-exmark.svg); }

.icon-arrow-left:before { background-image: url(../img/icon/arrow-left.svg); }
.icon-arrow-left2:before { background-image: url(../img/icon/arrow-left2.svg); }
.icon-arrow-right:before { background-image: url(../img/icon/arrow-right.svg); }
.icon-arrow-right2:before { background-image: url(../img/icon/arrow-right2.svg); }