.xrechnung-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/XRechnung.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.diagram-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/Diagramm.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.delete-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/trash.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.historyboard-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/historyboard.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.smartblick-icon {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url(../svgs/Smartblick.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.smartblick-icon-small {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url(../svgs/Smartblick.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
  filter: brightness(0) invert(1);
}

.delete-icon-s {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url(../svgs/trash.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.save-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/save.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.save-icon-s {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url(../svgs/save.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.print-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/printer.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.plus-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/button-filledcircle-add.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.plus-icon-s {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url(../svgs/button-filledcircle-add.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.plus-icon-xs {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url(../svgs/button-filledcircle-add.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.design-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/design.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.first-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/media-play-backward.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.previous-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/media-goto-previous.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.next-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/media-goto-next.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.last-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/media-play-forward.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.customer-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/customer.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.shopping-cart-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/shopping-basket.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.shopping-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/shopping.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.search-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/find.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.add-user-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/add-user-icon.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.add-customer-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/add-customer-icon.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.add-supplier-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/add-supplier-icon.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.cloud-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/cloud-upload.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.istos-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/Istos.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.hoffmann-icon {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url(../svgs/hoffmann-group.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
  filter: brightness(0);
}

.hoffmann-original {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/hoffmann-original.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.hoffmann-success {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/hoffmann-check.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.hoffmann-alert {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/hoffmann-triangle.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.hoffmann-failed {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/hoffmann-x.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.taxcards-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/taxcards.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.handshake-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/handshake.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.copy-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/clipboard-copy.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.pencil-icon {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url(../svgs/tool-pencil.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.refresh-icon {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url(../svgs/symbol-update.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.reload-icon {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url(../svgs/symbol-refresh.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.cancel-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/symbol-cancel.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.cancel-icon-s {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url(../svgs/symbol-cancel.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.hand-holding-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/hand-holding.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.gear-icon {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url(../svgs/gear.svg) 50% 50% no-repeat !important;
  background-size: 100%;
  vertical-align: bottom;
}

.jumpto-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/jumpto.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.jumpto-icon-s {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url(../svgs/jumpto.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.exit-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/Artboard_1.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.calculate-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/document-calculus.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.toInvoice-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/toInvoice.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.toDelivery-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/toDelivery.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.paragraph-icon-s {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url(../svgs/fonts.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.bank-icon {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url(../svgs/bank.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.file-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/archive.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.tax-icon {
  display: inline-block;
  width: 30px;
  height: 30px;
  background: url(../images/favicon.png) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.info-icon-s {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url(../svgs/button-info.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}

.info-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/button-info-tm.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}
.bell-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../svgs/bell.svg) 50% 50% no-repeat;
  background-size: 100%;
  vertical-align: bottom;
}