.icon-logo, .tap-icon {
  display: block;
  text-indent: -9999px;
  background-size: contain;
  background-repeat: no-repeat;
  border-radius: var(--css-dimensions-border-radius);
}

.tap-icon:not(.square) {border-radius: var(--css-dimensions-border-radius-circle);}

.tap-icon.icon-letter {
  text-indent: 0;
  text-align: center;
  text-transform: uppercase;
  padding: 0;
  align-items: center;
  display: flex;
  justify-content: center;
  padding: 1px 0 0 1px;
  overflow: hidden;
  font-weight: 16px;
  line-height: 16px;
}

.tap-icon {width: 35px; height: 35px; background-position: 50%;}

.icon-xs {width: 25px; height: 25px; background-size: 12px; }
.icon-s {width: 30px; height: 30px; background-size: 20px; }
.icon-m {width: 35px; height: 35px;background-size: 24px; }
.icon-l {width: 40px; height: 40px; background-size: 32px; }
.icon-xl {width: 45px; height: 45px; background-size: 40px; }
.icon-xxl {width: 64px; height: 64px; background-size: 48px; }
.icon-xxxl {width: 128px; height: 128px; background-size: 96px; }

/*
.icon-xs.transparent {background-size: 16px; }
.icon-s.transparent {background-size: 24px; }
.icon-m.transparent {background-size: 32px; }
.icon-l.transparent {background-size: 40px; }
.icon-xl.transparent {background-size: 48px; }
.icon-xxl.transparent {background-size: 64px; }
.icon-xxxl.transparent {background-size: 128px; }
*/

.icon-up {transform: rotate(-90deg);}
.icon-down {transform: rotate(90deg);}
.icon-left, .icon-back {transform: rotate(180deg);}

.icon-logo-p {background-image:url(../img/logo-p.svg)}
.icon-briefcase-business {background-image:url(../icons/light/business.svg)}
.icon-utensils {background-image:url(../icons/light/food.svg)}
.icon-heart-pulse {background-image:url(../icons/light/tourist-attractions.svg)}
.icon-map {background-image:url(../icons/light/travels.svg)}
.icon-ticket {background-image:url(../icons/light/events.svg)}
.icon-cpu {background-image:url(../icons/light/world.svg)}
.icon-logo-monster {background-image:url(../img/logo-monster.svg)}
.icon-logo-monster-twins {background-image:url(../img/logo-monster-twins.svg)}

/* light mode */
.icon-up {background-image:url(../icons/light/arrow.svg);}
.icon-right, .icon-next, .rows > .content > ul > li > a.tap-icon {background-image:url(../icons/light/arrow.svg);}
.icon-down {background-image:url(../icons/light/arrow.svg);}
.icon-left, .icon-back {background-image:url(../icons/light/arrow.svg);}
.icon-accommodation {background-image:url(../icons/light/accommodation.svg)}
.icon-add {background-image:url(../icons/light/add.svg)}
.icon-arrow {background-image:url(../icons/light/arrow.svg)}
.icon-business {background-image:url(../icons/light/business.svg)}
.icon-call {background-image:url(../icons/light/call.svg)}
.icon-camera {background-image:url(../icons/light/camera.svg)}
.icon-check {background-image:url(../icons/light/check.svg)}
.icon-close {background-image:url(../icons/light/close.svg)}
.icon-copy {background-image:url(../icons/light/copy.svg)}
.icon-default {background-image:url(../icons/light/default.svg)}
.icon-dots {background-image:url(../icons/light/dots.svg)}
.icon-email {background-image:url(../icons/light/email.svg)}
.icon-events {background-image:url(../icons/light/events.svg)}
.icon-favourite-off {background-image:url(../icons/light/favourite-off.svg)}
.icon-favourite-on {background-image:url(../icons/light/favourite-on.svg)}
.icon-find-on-map {background-image:url(../icons/light/find-on-map.svg)}
.icon-fixes {background-image:url(../icons/light/fixes.svg)}
.icon-food {background-image:url(../icons/light/food.svg)}
.icon-friends {background-image:url(../icons/light/friends.svg)}
.icon-fullscreen {background-image:url(../icons/light/fullscreen.svg)}
.icon-home {background-image:url(../icons/light/home.svg)}
.icon-image {background-image:url(../icons/light/image.svg)}
.icon-info {background-image:url(../icons/light/info.svg)}
.icon-item-get {background-image:url(../icons/light/item-get.svg)}
.icon-item-send {background-image:url(../icons/light/item-send.svg)}
.icon-list {background-image:url(../icons/light/list.svg)}
.icon-localize {background-image:url(../icons/light/localize.svg)}
.icon-apple {background-image:url(../icons/light/logo-apple.svg)}
.icon-facebook {background-image:url(../icons/light/logo-facebook.svg)}
.icon-google {background-image:url(../icons/light/logo-google.svg)}
.icon-menu {background-image:url(../icons/light/menu.svg)}
.icon-microphone {background-image:url(../icons/light/microphone.svg)}
.icon-note {background-image:url(../icons/light/note.svg)}
.icon-offline {background-image:url(../icons/light/offline.svg)}
.icon-password {background-image:url(../icons/light/password.svg)}
.icon-person-circle {background-image:url(../icons/light/person-circle.svg)}
.icon-pin {background-image:url(../icons/light/pin.svg)}
.icon-pro {background-image:url(../icons/light/pro.svg)}
.icon-qr {background-image:url(../icons/light/qr.svg)}
.icon-save {background-image:url(../icons/light/save.svg)}
.icon-search, #search-bar .field-input > input {background-image:url(../icons/light/search.svg)}
.icon-services {background-image:url(../icons/light/services.svg)}
.icon-share {background-image:url(../icons/light/share.svg)}
.icon-share-2 {background-image:url(../icons/light/share-2.svg)}
.icon-share-3 {background-image:url(../icons/light/share-3.svg)}
.icon-success {background-image:url(../icons/light/success.svg)}
.icon-survey {background-image:url(../icons/light/survey.svg)}
.icon-tourist-attractions {background-image:url(../icons/light/tourist-attractions.svg)}
.icon-travels {background-image:url(../icons/light/travels.svg)}
.icon-trending {background-image:url(../icons/light/trending.svg)}
.icon-user {background-image:url(../icons/light/user.svg)}
.icon-video {background-image:url(../icons/light/video.svg)}
.icon-world {background-image:url(../icons/light/world.svg)}
.icon-eye-close {background-image:url(../icons/light/eye-close.svg)}
.icon-eye-open {background-image:url(../icons/light/eye-open.svg)}
.icon-contacts {background-image:url(../icons/light/contacts.svg)}
.icon-link {background-image:url(../icons/light/link.svg)}
.icon-google-play {background-image:url(../icons/light/google-play.svg)}

/* dark mode */
body.dark .icon-up:not(.primary) {background-image:url(../icons/dark/arrow.svg);}
body.dark .icon-right:not(.primary), body.dark .icon-next:not(.primary), body.dark .rows > .content > ul > li > a.tap-icon:not(.primary) {background-image:url(../icons/dark/arrow.svg);}
body.dark .icon-down:not(.primary) {background-image:url(../icons/dark/arrow.svg);}
body.dark .icon-left:not(.primary), body.dark .icon-back:not(.primary) {background-image:url(../icons/dark/arrow.svg);}
body.dark .icon-accommodation:not(.primary) {background-image:url(../icons/dark/accommodation.svg)}
body.dark .icon-add:not(.primary) {background-image:url(../icons/dark/add.svg)}
body.dark .icon-arrow:not(.primary) {background-image:url(../icons/dark/arrow.svg)}
body.dark .icon-business:not(.primary) {background-image:url(../icons/dark/business.svg)}
body.dark .icon-call:not(.primary) {background-image:url(../icons/dark/call.svg)}
body.dark .icon-camera:not(.primary) {background-image:url(../icons/dark/camera.svg)}
body.dark .icon-check:not(.primary) {background-image:url(../icons/dark/check.svg)}
body.dark .icon-close:not(.primary) {background-image:url(../icons/dark/close.svg)}
body.dark .icon-copy:not(.primary) {background-image:url(../icons/dark/copy.svg)}
body.dark .icon-default:not(.primary) {background-image:url(../icons/dark/default.svg)}
body.dark .icon-dots:not(.primary) {background-image:url(../icons/dark/dots.svg)}
body.dark .icon-email:not(.primary) {background-image:url(../icons/dark/email.svg)}
body.dark .icon-events:not(.primary) {background-image:url(../icons/dark/events.svg)}
body.dark .icon-favourite-off:not(.primary) {background-image:url(../icons/dark/favourite-off.svg)}
body.dark .icon-favourite-on:not(.primary) {background-image:url(../icons/dark/favourite-on.svg)}
body.dark .icon-find-on-map:not(.primary) {background-image:url(../icons/dark/find-on-map.svg)}
body.dark .icon-fixes:not(.primary) {background-image:url(../icons/dark/fixes.svg)}
body.dark .icon-food:not(.primary) {background-image:url(../icons/dark/food.svg)}
body.dark .icon-friends:not(.primary) {background-image:url(../icons/dark/friends.svg)}
body.dark .icon-fullscreen:not(.primary) {background-image:url(../icons/dark/fullscreen.svg)}
body.dark .icon-home:not(.primary) {background-image:url(../icons/dark/home.svg)}
body.dark .icon-image:not(.primary) {background-image:url(../icons/dark/image.svg)}
body.dark .icon-info:not(.primary) {background-image:url(../icons/dark/info.svg)}
body.dark .icon-item-get:not(.primary) {background-image:url(../icons/dark/item-get.svg)}
body.dark .icon-item-send:not(.primary) {background-image:url(../icons/dark/item-send.svg)}
body.dark .icon-list:not(.primary) {background-image:url(../icons/dark/list.svg)}
body.dark .icon-localize:not(.primary) {background-image:url(../icons/dark/localize.svg)}
body.dark .icon-apple:not(.primary) {background-image:url(../icons/dark/logo-apple.svg)}
body.dark .icon-facebook:not(.primary) {background-image:url(../icons/dark/logo-facebook.svg)}
body.dark .icon-google:not(.primary) {background-image:url(../icons/dark/logo-google.svg)}
body.dark .icon-menu:not(.primary) {background-image:url(../icons/dark/menu.svg)}
body.dark .icon-microphone:not(.primary) {background-image:url(../icons/dark/microphone.svg)}
body.dark .icon-note:not(.primary) {background-image:url(../icons/dark/note.svg)}
body.dark .icon-offline:not(.primary) {background-image:url(../icons/dark/offline.svg)}
body.dark .icon-password:not(.primary) {background-image:url(../icons/dark/password.svg)}
body.dark .icon-person-circle:not(.primary) {background-image:url(../icons/dark/person-circle.svg)}
body.dark .icon-pin:not(.primary) {background-image:url(../icons/dark/pin.svg)}
body.dark .icon-pro:not(.primary) {background-image:url(../icons/dark/pro.svg)}
body.dark .icon-qr:not(.primary) {background-image:url(../icons/dark/qr.svg)}
body.dark .icon-save:not(.primary) {background-image:url(../icons/dark/save.svg)}
body.dark .icon-search:not(.primary), body.dark #search-bar .field-input > input {background-image:url(../icons/dark/search.svg)}
body.dark .icon-services:not(.primary) {background-image:url(../icons/dark/services.svg)}
body.dark .icon-share:not(.primary) {background-image:url(../icons/dark/share.svg)}
body.dark .icon-share-2:not(.primary) {background-image:url(../icons/dark/share-2.svg)}
body.dark .icon-share-3:not(.primary) {background-image:url(../icons/dark/share-3.svg)}
body.dark .icon-success:not(.primary) {background-image:url(../icons/dark/success.svg)}
body.dark .icon-survey:not(.primary) {background-image:url(../icons/dark/survey.svg)}
body.dark .icon-tourist-attractions:not(.primary) {background-image:url(../icons/dark/tourist-attractions.svg)}
body.dark .icon-travels:not(.primary) {background-image:url(../icons/dark/travels.svg)}
body.dark .icon-trending:not(.primary) {background-image:url(../icons/dark/trending.svg)}
body.dark .icon-user:not(.primary) {background-image:url(../icons/dark/user.svg)}
body.dark .icon-video:not(.primary) {background-image:url(../icons/dark/video.svg)}
body.dark .icon-world:not(.primary) {background-image:url(../icons/dark/world.svg)}
body.dark .icon-eye-close:not(.primary) {background-image:url(../icons/dark/eye-close.svg)}
body.dark .icon-eye-open:not(.primary) {background-image:url(../icons/dark/eye-open.svg)}
body.dark .icon-contacts:not(.primary) {background-image:url(../icons/dark/contacts.svg)}
body.dark .icon-link:not(.primary) {background-image:url(../icons/dark/link.svg)}
body.dark .icon-google-play:not(.primary) {background-image:url(../icons/dark/google-play.svg)}
body.dark .icon-briefcase-business:not(.primary) {background-image:url(../icons/dark/business.svg)}
body.dark .icon-utensils:not(.primary) {background-image:url(../icons/dark/food.svg)}
body.dark .icon-heart-pulse:not(.primary) {background-image:url(../icons/dark/tourist-attractions.svg)}
body.dark .icon-map:not(.primary) {background-image:url(../icons/dark/travels.svg)}
body.dark .icon-ticket:not(.primary) {background-image:url(../icons/dark/events.svg)}
body.dark .icon-cpu:not(.primary) {background-image:url(../icons/dark/world.svg)}
