/* Иконки «Алые паруса» — маски через currentColor.
   Подключение: <link rel="stylesheet" href="icons.css">
   Использование: <span class="ap-icon ap-icon-ship" aria-hidden="true"></span>
   Размер — font-size или width/height, цвет — color. */

.ap-icon {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
  background-color: currentColor;
  -webkit-mask: var(--icon) no-repeat center / contain;
  mask: var(--icon) no-repeat center / contain;
}
.ap-icon-address-book { --icon: url('svg/address-book.svg'); }
.ap-icon-anchor { --icon: url('svg/anchor.svg'); }
.ap-icon-attach { --icon: url('svg/attach.svg'); }
.ap-icon-bell { --icon: url('svg/bell.svg'); }
.ap-icon-bottle { --icon: url('svg/bottle.svg'); }
.ap-icon-calendar { --icon: url('svg/calendar.svg'); }
.ap-icon-car { --icon: url('svg/car.svg'); }
.ap-icon-check { --icon: url('svg/check.svg'); }
.ap-icon-chevron-down { --icon: url('svg/chevron-down.svg'); }
.ap-icon-chevron-right { --icon: url('svg/chevron-right.svg'); }
.ap-icon-close { --icon: url('svg/close.svg'); }
.ap-icon-coin { --icon: url('svg/coin.svg'); }
.ap-icon-compass { --icon: url('svg/compass.svg'); }
.ap-icon-document { --icon: url('svg/document.svg'); }
.ap-icon-download { --icon: url('svg/download.svg'); }
.ap-icon-edit { --icon: url('svg/edit.svg'); }
.ap-icon-eye { --icon: url('svg/eye.svg'); }
.ap-icon-flag { --icon: url('svg/flag.svg'); }
.ap-icon-gauge { --icon: url('svg/gauge.svg'); }
.ap-icon-hourglass { --icon: url('svg/hourglass.svg'); }
.ap-icon-info { --icon: url('svg/info.svg'); }
.ap-icon-key { --icon: url('svg/key.svg'); }
.ap-icon-lighthouse { --icon: url('svg/lighthouse.svg'); }
.ap-icon-logout { --icon: url('svg/logout.svg'); }
.ap-icon-mail { --icon: url('svg/mail.svg'); }
.ap-icon-map-pin { --icon: url('svg/map-pin.svg'); }
.ap-icon-phone { --icon: url('svg/phone.svg'); }
.ap-icon-plus { --icon: url('svg/plus.svg'); }
.ap-icon-qr { --icon: url('svg/qr.svg'); }
.ap-icon-scroll { --icon: url('svg/scroll.svg'); }
.ap-icon-seal { --icon: url('svg/seal.svg'); }
.ap-icon-shield { --icon: url('svg/shield.svg'); }
.ap-icon-ship { --icon: url('svg/ship.svg'); }
.ap-icon-spyglass { --icon: url('svg/spyglass.svg'); }
.ap-icon-ticket { --icon: url('svg/ticket.svg'); }
.ap-icon-user { --icon: url('svg/user.svg'); }
.ap-icon-warning { --icon: url('svg/warning.svg'); }
.ap-icon-wave { --icon: url('svg/wave.svg'); }
.ap-icon-wheel { --icon: url('svg/wheel.svg'); }