.icon {
  width: 1rem;
  height: 1rem;
  display: inline-block;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-size: contain;
          mask-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.icon-arrow-right-thin {
  -webkit-mask-image: url("../images/icons/arrow-right-thin.svg");
          mask-image: url("../images/icons/arrow-right-thin.svg");
  background-color: #252525;
  background-color: var(--black-color);
}

.icon-search {
  -webkit-mask-image: url("../images/icons/search.svg");
          mask-image: url("../images/icons/search.svg");
  background-color: #8d8d8d;
  background-color: var(--gray-color);
}

.icon-timer {
  -webkit-mask-image: url("../images/icons/timer.svg");
          mask-image: url("../images/icons/timer.svg");
  background-color: #252525;
  background-color: var(--black-color);
}

.icon-advan-first {
  background-image: url("../images/icons/advan-1.svg");
}

.icon-advan-second {
  background-image: url("../images/icons/advan-2.svg");
}

.icon-advan-third {
  background-image: url("../images/icons/advan-3.svg");
}

.icon-rating-star {
  -webkit-mask-image: url("../images/icons/star.svg");
          mask-image: url("../images/icons/star.svg");
  background-color: #e16a02;
  background-color: var(--main-color);
}

.icon-rating-star-empty {
  -webkit-mask-image: url("../images/icons/star.svg");
          mask-image: url("../images/icons/star.svg");
  background-color: #d2d2d2;
}

.icon-x {
  background-image: url("../images/icons/social/x.svg");
}
.icon-x:hover {
  background-image: url("../images/icons/social/x-hover.svg");
}
.icon-x--gray {
  background-image: url("../images/icons/social/x-gray.svg");
}
.icon-x--gray:hover {
  background-image: url("../images/icons/social/x-hover.svg");
}

.icon-fb {
  background-image: url("../images/icons/social/fb.svg");
}
.icon-fb:hover {
  background-image: url("../images/icons/social/fb-hover.svg");
}
.icon-fb--gray {
  background-image: url("../images/icons/social/fb-gray.svg");
}
.icon-fb--gray:hover {
  background-image: url("../images/icons/social/fb-hover.svg");
}

.icon-yt {
  background-image: url("../images/icons/social/youtube.svg");
}
.icon-yt:hover {
  background-image: url("../images/icons/social/youtube-hover.svg");
}
.icon-yt--gray {
  background-image: url("../images/icons/social/youtube-gray.svg");
}
.icon-yt--gray:hover {
  background-image: url("../images/icons/social/youtube-hover.svg");
}

.icon-linkedin {
  background-image: url("../images/icons/social/linkedin.svg");
}
.icon-linkedin:hover {
  background-image: url("../images/icons/social/linkedin-hover.svg");
}
.icon-linkedin--gray {
  background-image: url("../images/icons/social/linkedin-gray.svg");
}
.icon-linkedin--gray:hover {
  background-image: url("../images/icons/social/linkedin-hover.svg");
}

.icon-notification {
  -webkit-mask-image: url("../images/icons/notification.svg");
          mask-image: url("../images/icons/notification.svg");
  background-color: #171717;
}

.icon-close {
  -webkit-mask-image: url("../images/icons/close.svg");
          mask-image: url("../images/icons/close.svg");
  background-color: #fff;
  background-color: var(--black-color);
}

.icon-flag-ua {
  background-image: url("../images/icons/flag/ua.svg");
}

.icon-arrow-down {
  -webkit-mask-image: url("../images/icons/arrow-down.svg");
          mask-image: url("../images/icons/arrow-down.svg");
  background-color: #252525;
  background-color: var(--black-color);
}

.icon-eye {
  -webkit-mask-image: url("../images/icons/eye.svg");
          mask-image: url("../images/icons/eye.svg");
  background-color: #868a8a;
}

.icon-eye-active {
  -webkit-mask-image: url("../images/icons/eye-active.svg");
          mask-image: url("../images/icons/eye-active.svg");
  background-color: #868a8a;
}

.icon-add-square {
  -webkit-mask-image: url("../images/icons/add-square.svg");
          mask-image: url("../images/icons/add-square.svg");
  background-color: #252525;
  background-color: var(--black-color);
}

.icon-receipt-edit {
  -webkit-mask-image: url("../images/icons/receipt-edit.svg");
          mask-image: url("../images/icons/receipt-edit.svg");
  background-color: #252525;
  background-color: var(--black-color);
}

.icon-mx{
  background-image: url("../images/flag/mx.png"); }

.icon-br{
  background-image: url("../images/flag/br.png"); }

.icon-ng{
  background-image: url("../images/flag/ng.png"); }

.icon-ja{
  background-image: url("../images/flag/ja.png"); }

.icon-id{
  background-image: url("../images/flag/id.png"); }

.icon-folder {
  -webkit-mask-image: url("../images/icons/folder.svg");
          mask-image: url("../images/icons/folder.svg");
  background-color: #252525;
  background-color: var(--black-color);
}

.icon-arrow-right {
  -webkit-mask-image: url("../images/icons/icon-right.svg");
          mask-image: url("../images/icons/icon-right.svg");
  background-color: #252525;
  background-color: var(--black-color);
}
.icon-arrow-right--left {
  -webkit-transform: scaleX(-1);
      -ms-transform: scaleX(-1);
          transform: scaleX(-1);
  -webkit-mask-image: url("../images/icons/icon-right.svg");
          mask-image: url("../images/icons/icon-right.svg");
  background-color: #252525;
  background-color: var(--black-color);
}

.icon-plus {
  -webkit-mask-image: url("../images/icons/plus.svg");
          mask-image: url("../images/icons/plus.svg");
  background-color: #252525;
  background-color: var(--black-color);
}

.icon-minus {
  -webkit-mask-image: url("../images/icons/minus.svg");
          mask-image: url("../images/icons/minus.svg");
  background-color: #252525;
  background-color: var(--black-color);
}

.icon-arrow-big-left {
  -webkit-mask-image: url("../images/icons/arrow-big.svg");
          mask-image: url("../images/icons/arrow-big.svg");
  background-color: #252525;
  background-color: var(--black-color);
}
.icon-arrow-big-left:hover {
  background-color: #e16a02;
  background-color: var(--main-color);
}
.icon-arrow-big-right {
  -webkit-transform: scaleX(-1);
      -ms-transform: scaleX(-1);
          transform: scaleX(-1);
  -webkit-mask-image: url("../images/icons/arrow-big.svg");
          mask-image: url("../images/icons/arrow-big.svg");
  background-color: #252525;
  background-color: var(--black-color);
}
.icon-arrow-big-right:hover {
  background-color: #e16a02;
  background-color: var(--main-color);
}

.icon-shield-tick {
  -webkit-mask-image: url("../images/icons/shield-tick.svg");
          mask-image: url("../images/icons/shield-tick.svg");
  background-color: #4bcf31;
}

.icon-arrow-bold {
  -webkit-mask-image: url("../images/icons/arrow-bold.svg");
          mask-image: url("../images/icons/arrow-bold.svg");
  background-color: #252525;
  background-color: var(--black-color);
}
.icon-arrow-bold--right {
  -webkit-transform: scaleX(-1);
      -ms-transform: scaleX(-1);
          transform: scaleX(-1);
  -webkit-mask-image: url("../images/icons/arrow-bold.svg");
          mask-image: url("../images/icons/arrow-bold.svg");
  background-color: #252525;
  background-color: var(--black-color);
}

.icon-tech {
  -webkit-mask-image: url("../images/icons/tech.svg");
          mask-image: url("../images/icons/tech.svg");
  background-color: #fff;
  background-color: var(--white-color);
}

.icon-like-tag {
  -webkit-mask-image: url("../images/icons/like-tag.svg");
          mask-image: url("../images/icons/like-tag.svg");
  background-color: #fff;
  background-color: var(--white-color);
}

.icon-question {
  -webkit-mask-image: url("../images/icons/question.svg");
          mask-image: url("../images/icons/question.svg");
  background-color: #252525;
  background-color: var(--black-color);
}

.icon-check {
  -webkit-mask-image: url("../images/icons/check.svg");
          mask-image: url("../images/icons/check.svg");
  background-color: rgb(75, 207, 49);
}

.icon-star-slide {
  -webkit-mask-image: url("../images/icons/star-slide.svg");
          mask-image: url("../images/icons/star-slide.svg");
  background-color: #efd40b;
}

.icon-information {
  -webkit-mask-image: url("../images/icons/information.svg");
          mask-image: url("../images/icons/information.svg");
  background-color: #252525;
  background-color: var(--black-color);
}

.icon-call {
  -webkit-mask-image: url("../images/icons/call.svg");
          mask-image: url("../images/icons/call.svg");
  background-color: #252525;
  background-color: var(--black-color);
}

.icon-location {
  -webkit-mask-image: url("../images/icons/location.svg");
          mask-image: url("../images/icons/location.svg");
  background-color: #252525;
  background-color: var(--black-color);
}

.icon-online {
  -webkit-mask-image: url("../images/icons/online.svg");
          mask-image: url("../images/icons/online.svg");
  background-color: #4bcf31;
}

.icon-youtube {
  background-image: url("../images/icons/youtube.svg");
}

.icon-video-circle {
  -webkit-mask-image: url("../images/icons/video-circle.svg");
          mask-image: url("../images/icons/video-circle.svg");
  background-color: #fff;
  background-color: var(--white-color);
}

.icon-arrow-square-down {
  -webkit-mask-image: url("../images/icons/arrow-square-down.svg");
          mask-image: url("../images/icons/arrow-square-down.svg");
  background-color: #252525;
  background-color: var(--black-color);
}

.icon-home {
  -webkit-mask-image: url("../images/icons/home.svg");
          mask-image: url("../images/icons/home.svg");
  background-color: #252525;
  background-color: var(--black-color);
}

.icon-comment {
  -webkit-mask-image: url("../images/icons/comment.svg");
          mask-image: url("../images/icons/comment.svg");
  background-color: #aaa;
}

.icon-like {
  -webkit-mask-image: url("../images/icons/like.svg");
          mask-image: url("../images/icons/like.svg");
  background-color: #aaa;
}

.icon-undo {
  -webkit-mask-image: url("../images/icons/wysiwyg/undo.svg");
          mask-image: url("../images/icons/wysiwyg/undo.svg");
  background-color: #7c7c7c;
}
.icon-undo--right {
  -webkit-transform: scaleX(-1);
      -ms-transform: scaleX(-1);
          transform: scaleX(-1);
  -webkit-mask-image: url("../images/icons/wysiwyg/undo.svg");
          mask-image: url("../images/icons/wysiwyg/undo.svg");
  background-color: #7c7c7c;
}

.icon-bold {
  -webkit-mask-image: url("../images/icons/wysiwyg/bold.svg");
          mask-image: url("../images/icons/wysiwyg/bold.svg");
  background-color: #7c7c7c;
}

.icon-cursive {
  -webkit-mask-image: url("../images/icons/wysiwyg/cursiv.svg");
          mask-image: url("../images/icons/wysiwyg/cursiv.svg");
  background-color: #7c7c7c;
}

.icon-align-left {
  -webkit-mask-image: url("../images/icons/wysiwyg/align.svg");
          mask-image: url("../images/icons/wysiwyg/align.svg");
  background-color: #7c7c7c;
}
.icon-align-center {
  -webkit-mask-image: url("../images/icons/wysiwyg/align-center.svg");
          mask-image: url("../images/icons/wysiwyg/align-center.svg");
  background-color: #7c7c7c;
}
.icon-align-right {
  -webkit-transform: scaleX(-1);
      -ms-transform: scaleX(-1);
          transform: scaleX(-1);
  -webkit-mask-image: url("../images/icons/wysiwyg/align.svg");
          mask-image: url("../images/icons/wysiwyg/align.svg");
  background-color: #7c7c7c;
}

.icon-list-dot {
  -webkit-mask-image: url("../images/icons/wysiwyg/list-dot.svg");
          mask-image: url("../images/icons/wysiwyg/list-dot.svg");
  background-color: #7c7c7c;
}

.icon-list-num {
  -webkit-mask-image: url("../images/icons/wysiwyg/list-num.svg");
          mask-image: url("../images/icons/wysiwyg/list-num.svg");
  background-color: #7c7c7c;
}

.icon-archive-add {
  -webkit-mask-image: url("../images/icons/archive-add.svg");
          mask-image: url("../images/icons/archive-add.svg");
  background-color: #aaa;
}

.icon-send {
  -webkit-mask-image: url("../images/icons/send.svg");
          mask-image: url("../images/icons/send.svg");
  background-color: #aaa;
}

.icon-send-2 {
  -webkit-mask-image: url("../images/icons/send-2.svg");
          mask-image: url("../images/icons/send-2.svg");
  background-color: #e16a02;
  background-color: var(--main-color);
}

.icon-folder-add {
  -webkit-mask-image: url("../images/icons/folder-add.svg");
          mask-image: url("../images/icons/folder-add.svg");
  background-color: #e16a02;
  background-color: var(--main-color);
}

.icon-tasks {
  -webkit-mask-image: url("../images/icons/tasks.svg");
          mask-image: url("../images/icons/tasks.svg");
  background-color: #252525;
  background-color: var(--black-color);
}

.icon-gallery-slash {
  -webkit-mask-image: url("../images/icons/gallery-slash.svg");
          mask-image: url("../images/icons/gallery-slash.svg");
  background-color: #bfbfbf;
}

.icon-video-slash {
  -webkit-mask-image: url("../images/icons/video-slash.svg");
          mask-image: url("../images/icons/video-slash.svg");
  background-color: #bfbfbf;
}

.icon-arrow-slide-right {
  -webkit-transform: scaleX(-1);
      -ms-transform: scaleX(-1);
          transform: scaleX(-1);
  -webkit-mask-image: url("../images/icons/arrow-slide-left.svg");
          mask-image: url("../images/icons/arrow-slide-left.svg");
  background-color: #fff;
  background-color: var(--white-color);
}

.icon-arrow-slide-left {
  -webkit-mask-image: url("../images/icons/arrow-slide-left.svg");
          mask-image: url("../images/icons/arrow-slide-left.svg");
  background-color: #fff;
  background-color: var(--white-color);
}

.icon-theme-light {
  -webkit-mask-image: url("../images/icons/theme-light.svg");
          mask-image: url("../images/icons/theme-light.svg");
  background-color: #fff;
  background-color: var(--white-color);
}

.icon-theme-dark {
  -webkit-mask-image: url("../images/icons/theme-dark.svg");
          mask-image: url("../images/icons/theme-dark.svg");
  background-color: #fff;
  background-color: var(--white-color);
}

.icon-info {
    -webkit-mask-image: url("../images/icons/info.svg");
    mask-image: url("../images/icons/info.svg");
    background-color: var(--main-color)
}

.icon-orders {
    -webkit-mask-image: url("../images/icons/orders.svg");
    mask-image: url("../images/icons/orders.svg");
    background-color: var(--main-color)
}

.icon-user {
    -webkit-mask-image: url("../images/icons/account.svg");
    mask-image: url("../images/icons/account.svg");
    background-color: var(--main-color)
}

.icon-contacts {
    -webkit-mask-image: url("../images/icons/contacts.svg");
    mask-image: url("../images/icons/contacts.svg");
    background-color: var(--main-color)
}

.icon-payments {
    -webkit-mask-image: url("../images/icons/card.svg");
    mask-image: url("../images/icons/card.svg");
    background-color: var(--main-color)
}

.icon-services {
    -webkit-mask-image: url("../images/icons/calc.svg");
    mask-image: url("../images/icons/calc.svg");
    background-color: var(--main-color)
}

.icon-reviews {
    -webkit-mask-image: url("../images/icons/rev.svg");
    mask-image: url("../images/icons/rev.svg");
    background-color: var(--main-color)
}

.icon-notifications {
    -webkit-mask-image: url("../images/icons/notif.svg");
    mask-image: url("../images/icons/notif.svg");
    background-color: var(--main-color)
}

.icon-auctions {
    -webkit-mask-image: url("../images/icons/auctions.svg");
    mask-image: url("../images/icons/auctions.svg");
    background-color: var(--main-color)
}

.icon-partner {
    -webkit-mask-image: url("../images/icons/partners.svg");
    mask-image: url("../images/icons/partners.svg");
    background-color: var(--main-color)
}

.icon-photo {
    -webkit-mask-image: url("../images/icons/photo.svg");
    mask-image: url("../images/icons/photo.svg");
    background-color: var(--main-color)
}

.icon-plused {
    -webkit-mask-image: url("../images/icons/plused.svg");
    mask-image: url("../images/icons/plused.svg");
    background-color: var(--main-color)
}

.icon-feedback {
    -webkit-mask-image: url("../images/icons/feedback.svg");
    mask-image: url("../images/icons/feedback.svg");
    background-color: var(--main-color)
}

.icon-settings {
    -webkit-mask-image: url("../images/icons/settings.svg");
    mask-image: url("../images/icons/settings.svg");
    background-color: var(--main-color)
}

.icon-logout {
    -webkit-mask-image: url("../images/icons/logout.svg");
    mask-image: url("../images/icons/logout.svg");
    background-color: var(--main-color)
}

.icon-loaded {
    -webkit-mask-image: url("../images/icons/loaded.svg");
    mask-image: url("../images/icons/loaded.svg");
    background-color: var(--black-color)
}

.icon-warning {
    -webkit-mask-image: url("../images/icons/warning.svg");
    mask-image: url("../images/icons/warning.svg");
    background-color: var(--main-color)
}

.icon-tel {
    -webkit-mask-image: url("../images/icons/social/tel.svg");
    mask-image: url("../images/icons/social/tel.svg");
    background-color: var(--main-color)
}

.icon-mail {
    -webkit-mask-image: url("../images/icons/social/mail.svg");
    mask-image: url("../images/icons/social/mail.svg");
    background-color: var(--main-color)
}

.icon-link {
    -webkit-mask-image: url("../images/icons/social/link.svg");
    mask-image: url("../images/icons/social/link.svg");
    background-color: var(--main-color)
}

.icon-telegram {
    -webkit-mask-image: url("../images/icons/social/telegram.svg");
    mask-image: url("../images/icons/social/telegram.svg");
    background-color: var(--main-color)
}

.icon-viber {
    -webkit-mask-image: url("../images/icons/social/viber.svg");
    mask-image: url("../images/icons/social/viber.svg");
    background-color: var(--main-color)
}

.icon-whatsapp {
    -webkit-mask-image: url("../images/icons/social/whatsapp.svg");
    mask-image: url("../images/icons/social/whatsapp.svg");
    background-color: var(--main-color)
}

.icon-facebook {
    -webkit-mask-image: url("../images/icons/social/facebook.svg");
    mask-image: url("../images/icons/social/facebook.svg");
    background-color: var(--main-color)
}

.icon-in {
    -webkit-mask-image: url("../images/icons/social/in.svg");
    mask-image: url("../images/icons/social/in.svg");
    background-color: var(--main-color)
}

.icon-x {
    -webkit-mask-image: url("../images/icons/social/X.svg");
    mask-image: url("../images/icons/social/X.svg");
    background-color: var(--main-color);
    background-image: none
}

.icon-pinterest {
    -webkit-mask-image: url("../images/icons/social/pinterest.svg");
    mask-image: url("../images/icons/social/pinterest.svg");
    background-color: var(--main-color)
}

.icon-plus {
    -webkit-mask-image: url("../images/icons/plus.svg");
    mask-image: url("../images/icons/plus.svg");
    background-color: var(--acc-grey)
}

.icon-gear {
    -webkit-mask-image: url("../images/icons/gear.svg");
    mask-image: url("../images/icons/gear.svg");
    background-color: var(--white-color)
}

/* .icon-search {
    -webkit-mask-image: url("../images/icons/search.svg");
    mask-image: url("../images/icons/search.svg");
    background-color: var(--acc-grey)
} */

.icon-filter {
    -webkit-mask-image: url("../images/icons/filter.svg");
    mask-image: url("../images/icons/filter.svg");
    background-color: var(--acc-grey)
}

.icon-trash {
    -webkit-mask-image: url("../images/icons/trash.svg");
    mask-image: url("../images/icons/trash.svg");
    background-color: var(--acc-grey)
}

.icon-more-vertical {
    -webkit-mask-image: url("../images/icons/more-vertical.svg");
    mask-image: url("../images/icons/more-vertical.svg");
    background-color: var(--black-color)
}

.icon-sort-text {
    -webkit-mask-image: url("../images/icons/sort-text.svg");
    mask-image: url("../images/icons/sort-text.svg");
    background-color: var(--black-color)
}

.icon-grid {
    -webkit-mask-image: url("../images/icons/grid.svg");
    mask-image: url("../images/icons/grid.svg");
    background-color: var(--black-color)
}

.icon-calendar {
    -webkit-mask-image: url("../images/icons/calendar.svg");
    mask-image: url("../images/icons/calendar.svg");
    background-color: var(--black-color)
}

.icon-star-2 {
    -webkit-mask-image: url("../images/icons/star-2.svg");
    mask-image: url("../images/icons/star-2.svg");
    background-color: var(--black-color)
}

.icon-star-2--active {
    -webkit-mask-image: url("../images/icons/star-2.svg");
    mask-image: url("../images/icons/star-2.svg");
    background-color: var(--main-color)
}

.icon-star-2--disabled {
    -webkit-mask-image: url("../images/icons/star-2.svg");
    mask-image: url("../images/icons/star-2.svg");
    background-color: var(--gray-color)
}

.icon-star-2--half {
    -webkit-mask-image: url("../images/icons/star-2-half.svg");
    mask-image: url("../images/icons/star-2-half.svg");
    background-color: transparent
}

.icon-send {
    -webkit-mask-image: url("../images/icons/send.svg");
    mask-image: url("../images/icons/send.svg");
    background-color: var(--black-color)
}

.icon-add {
    -webkit-mask-image: url("../images/icons/add.svg");
    mask-image: url("../images/icons/add.svg");
    background-color: var(--black-color)
}

.icon-list {
    -webkit-mask-image: url("../images/icons/list.svg");
    mask-image: url("../images/icons/list.svg");
    background-color: var(--black-color)
}

.icon-order {
    -webkit-mask-image: url("../images/icons/order.svg");
    mask-image: url("../images/icons/order.svg");
    background-color: var(--black-color)
}

.icon-journal {
    -webkit-mask-image: url("../images/icons/journal.svg");
    mask-image: url("../images/icons/journal.svg");
    background-color: var(--black-color)
}

.icon-play {
    -webkit-mask-image: url("../images/icons/play.svg");
    mask-image: url("../images/icons/play.svg");
    background-color: var(--black-color)
}

.icon-stop {
    -webkit-mask-image: url("../images/icons/pause.svg");
    mask-image: url("../images/icons/pause.svg");
    background-color: var(--black-color)
}

.icon-theme-light {
    -webkit-mask-image: url("../images/icons/theme-light.svg");
    mask-image: url("../images/icons/theme-light.svg");
    background-color: var(--white-color)
}

.icon-theme-dark {
    -webkit-mask-image: url("../images/icons/theme-dark.svg");
    mask-image: url("../images/icons/theme-dark.svg");
    background-color: var(--white-color)
}

.icon-restore {
    -webkit-mask-image: url("../images/icons/restore.svg");
    mask-image: url("../images/icons/restore.svg");
    background-color: var(--black-color)
}

.icon-dice {
    -webkit-mask-image: url("../images/icons/dice.svg");
    mask-image: url("../images/icons/dice.svg");
    background-color: var(--black-color)
}

.icon-karma {
    -webkit-mask-image: url("../images/icons/karma.svg");
    mask-image: url("../images/icons/karma.svg");
    background-color: var(--black-color)
}

.icon-download {
    -webkit-mask-image: url("../images/icons/download.svg");
    mask-image: url("../images/icons/download.svg");
    background-color: var(--black-color)
}

.icon-file {
    -webkit-mask-image: url("../images/icons/file.svg");
    mask-image: url("../images/icons/file.svg");
    background-color: var(--black-color)
}

.icon-globe{
  -webkit-mask-image: url("../images/icons/globe.svg");
  mask-image: url("../images/icons/globe.svg");
  background-color: var(--black-color)
}