.icon {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.icon:before {
    content: '';
    position: relative;
    background-color: #252525;
    height: 20px;
    width: 20px;
}

.icon.icon_arrow:before {
    -webkit-mask: url(../icons/arrow.svg) no-repeat center;
    mask: url(../icons/arrow.svg) no-repeat center;
    -webkit-mask-size: 6px;
    mask-size: 6px;
    height: 12px;
    width: 12px;
}

.icon.icon_arrow.icon_arrow_bottom:before {
    transform: rotate(-90deg);
}

.icon.icon_arrow.icon_arrow_top:before {
    transform: rotate(90deg);
}

.icon.icon_arrow.icon_arrow_left:before {
    transform: rotate(0deg);
}

.icon.icon_arrow.icon_arrow_right:before {
    transform: rotate(180deg);
}

.icon.icon_special:before {
    -webkit-mask: url(../icons/special.svg) no-repeat center;
    mask: url(../icons/special.svg) no-repeat center;
    -webkit-mask-size: 16px;
    mask-size: 16px;
}

.icon.icon_setting:before {
    -webkit-mask: url(../icons/setting.svg) no-repeat center;
    mask: url(../icons/setting.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_search:before {
    -webkit-mask: url(../icons/search.svg) no-repeat center;
    mask: url(../icons/search.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_tools:before {
    -webkit-mask: url(../icons/tools.svg) no-repeat center;
    mask: url(../icons/tools.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_cart:before {
    -webkit-mask: url(../icons/basket.svg) no-repeat center;
    mask: url(../icons/basket.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_add_cart:before {
    -webkit-mask: url(../icons/basket_plus.svg) no-repeat center;
    mask: url(../icons/basket_plus.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_p1:before {
    -webkit-mask: url(../icons/p1.svg) no-repeat center;
    mask: url(../icons/p1.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_p2:before {
    -webkit-mask: url(../icons/p2.svg) no-repeat center;
    mask: url(../icons/p2.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_p3:before {
    -webkit-mask: url(../icons/p3.svg) no-repeat center;
    mask: url(../icons/p3.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_link:before {
    -webkit-mask: url(../icons/href.svg) no-repeat center;
    mask: url(../icons/href.svg) no-repeat center;
    width: 16px;
    height: 16px;
    -webkit-mask-size: 16px;
    mask-size: 16px;
}

.icon.icon_plus:before {
    -webkit-mask: url(../icons/plus.svg) no-repeat center;
    mask: url(../icons/plus.svg) no-repeat center;
    width: 8px;
    height: 8px;
    -webkit-mask-size: 8px;
    mask-size: 8px;
}

.icon.icon_s1:before {
    -webkit-mask: url(../icons/s1.svg) no-repeat center;
    mask: url(../icons/s1.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_s2:before {
    -webkit-mask: url(../icons/s2.svg) no-repeat center;
    mask: url(../icons/s2.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_s3:before {
    -webkit-mask: url(../icons/s3.svg) no-repeat center;
    mask: url(../icons/s3.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_s4:before {
    -webkit-mask: url(../icons/s4.svg) no-repeat center;
    mask: url(../icons/s4.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_instagram:before {
    -webkit-mask: url(../icons/instagram.svg) no-repeat center;
    mask: url(../icons/instagram.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_instagram:before {
    -webkit-mask: url(../icons/instagram.svg) no-repeat center;
    mask: url(../icons/instagram.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_tiktok:before {
    -webkit-mask: url(../icons/tiktok.svg) no-repeat center;
    mask: url(../icons/tiktok.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_youtube:before {
    -webkit-mask: url(../icons/youtube.svg) no-repeat center;
    mask: url(../icons/youtube.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_partners:before {
    -webkit-mask: url(../icons/partners.svg) no-repeat center;
    mask: url(../icons/partners.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_menu:before {
    -webkit-mask: url(../icons/menu.svg) no-repeat center;
    mask: url(../icons/menu.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_quantity_minus:before {
    -webkit-mask: url(../icons/quantity_minus.svg) no-repeat center;
    mask: url(../icons/quantity_minus.svg) no-repeat center;
    -webkit-mask-size: 14px;
    mask-size: 14px;
}

.icon.icon_quantity_plus:before {
    -webkit-mask: url(../icons/quantity_plus.svg) no-repeat center;
    mask: url(../icons/quantity_plus.svg) no-repeat center;
    -webkit-mask-size: 16px;
    mask-size: 16px;
}

.icon.icon_filter:before {
    -webkit-mask: url(../icons/filter.svg) no-repeat center;
    mask: url(../icons/filter.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_promocode:before {
    -webkit-mask: url(../icons/promocode.svg) no-repeat center;
    mask: url(../icons/promocode.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_trash:before {
    -webkit-mask: url(../icons/trash.svg) no-repeat center;
    mask: url(../icons/trash.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_info:before {
    -webkit-mask: url(../icons/info.svg) no-repeat center;
    mask: url(../icons/info.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_air_1:before {
    -webkit-mask: url(../icons/a1.svg) no-repeat center;
    mask: url(../icons/a1.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_air_2:before {
    -webkit-mask: url(../icons/a2.svg) no-repeat center;
    mask: url(../icons/a2.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_air_3:before {
    -webkit-mask: url(../icons/a3.svg) no-repeat center;
    mask: url(../icons/a3.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_blog_fc:before {
    -webkit-mask: url(../icons/blog_fc.svg) no-repeat center;
    mask: url(../icons/blog_fc.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}
.icon.icon_blog_twitter:before {
    -webkit-mask: url(../icons/blog_twitter.svg) no-repeat center;
    mask: url(../icons/blog_twitter.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_blog_pinterest:before {
    -webkit-mask: url(../icons/blog_pinterest.svg) no-repeat center;
    mask: url(../icons/blog_pinterest.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_blog_share:before {
    -webkit-mask: url(../icons/blog_share.svg) no-repeat center;
    mask: url(../icons/blog_share.svg) no-repeat center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
}

.icon.icon_np:before {
    -webkit-mask: initial;
    mask: initial;
    -webkit-mask-size: initial;
    mask-size: initial;
    background: url(../icons/np.svg) no-repeat center;
    background-size: contain;
}

.icon.icon_up:before {
    -webkit-mask: initial;
    mask: initial;
    -webkit-mask-size: initial;
    mask-size: initial;
    background: url(../icons/up.svg) no-repeat center;
    background-size: contain;
}

.icon.icon_mst:before {
    -webkit-mask: initial;
    mask: initial;
    -webkit-mask-size: initial;
    mask-size: initial;
    background: url(../icons/mst.svg) no-repeat center;
    background-size: contain;
}

.icon.icon_logo:before {
    -webkit-mask: initial;
    mask: initial;
    -webkit-mask-size: initial;
    mask-size: initial;
    background: url(../img/icon.svg) no-repeat center;
    background-size: contain;
}