@import url(margins.css);
.icon-premium,
.icon-premium-sq,
.premium-icon {
    display: inline-flex;
    align-items: center;
    background: url(img/icons/premium-qq.svg);
    width: 67px;
    height: 16px;
}

.icon-premium-sq {
    background: url(img/icons/premium-sq.svg);
    height: 15px;
    width: 15px;
}

.icon-premium:after,
.icon-premium-sq:after {
    display: none;
}

[class*='mask-icon'],
.xmessage-config,
.dynamic-img-remove:before,
.x-icon,
.caret {
    width: 12px;
    height: 12px;
    display: inline-flex;
    align-items: center;
    background: var(--color-grey);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
}

.caret {
    width: 17px;
    height: 17px;
}

.mask-icon-var {
    visibility: hidden;
}

.has-check .mask-icon-var,
.has-error .mask-icon-var {
    visibility: visible;
}


/**icons**/

.mask-icon-calendar {
    -webkit-mask-image: url('img/icons/calendar.svg');
    mask-image: url('img/icons/soft/calendar.svg');
}

.mask-icon-photoshop {
    -webkit-mask-image: url('img/icons/soft/ps.svg');
    mask-image: url('img/icons/soft/ps.svg');
}

.mask-icon-illustrator {
    -webkit-mask-image: url('img/icons/soft/ai.svg');
    mask-image: url('img/icons/soft/ai.svg');
}

.mask-icon-after-effects {
    -webkit-mask-image: url('img/icons/soft/ae.svg');
    mask-image: url('img/icons/soft/ae.svg');
}

.mask-icon-cinema-4d {
    -webkit-mask-image: url('img/icons/soft/c4.svg');
    mask-image: url('img/icons/soft/c4.svg');
}

.mask-icon-premiere-pro {
    -webkit-mask-image: url('img/icons/soft/pr.svg');
    mask-image: url('img/icons/soft/pr.svg');
}

.mask-icon-check,
.has-check .mask-icon-var {
    -webkit-mask-image: url('img/icons/check.svg');
    mask-image: url('img/icons/check.svg');
}

.mask-icon-check-check {
    -webkit-mask-image: url('img/icons/checkdouble.svg');
    mask-image: url('img/icons/checkdouble.svg');
}

.mask-icon-reply {
    -webkit-mask-image: url('img/icons/reply.svg');
    mask-image: url('img/icons/reply.svg');
}

.mask-icon-telegram {
    -webkit-mask-image: url('img/icons/telegram.svg');
    mask-image: url('img/icons/telegram.svg');
}

.mask-icon-smile {
    -webkit-mask-image: url('img/icons/smile.svg');
    mask-image: url('img/icons/smile.svg');
}

.mask-icon-smile-minus {
    -webkit-mask-image: url('img/icons/smile-minus.svg');
    mask-image: url('img/icons/smile-minus.svg');
}

.mask-icon-dots {
    -webkit-mask-image: url('img/icons/3-dot.svg');
    mask-image: url('img/icons/3-dot.svg');
}

.mask-icon-error,
.mask-icon-remove,
.has-error .mask-icon-var,
.dynamic-img-remove:before {
    -webkit-mask-image: url('img/icons/error.svg');
    mask-image: url('img/icons/error.svg');
}

.mask-icon-pen,
.mask-icon-pen-1,
.mask-icon-pen-2,
.mask-icon-pen-3 {
    -webkit-mask-image: url('img/icons/blog.svg');
    mask-image: url('img/icons/blog.svg');
}

.mask-icon-like {
    -webkit-mask-image: url('img/icons/heart-fill.svg');
    mask-image: url('img/icons/heart-fill.svg');
}

.mask-icon-like-stroke {
    -webkit-mask-image: url('img/icons/like.svg');
    mask-image: url('img/icons/like.svg');
}

.mask-icon-camera,
.mask-icon-kamera {
    -webkit-mask-image: url('img/icons/camera.svg');
    mask-image: url('img/icons/camera.svg');
}

.mask-icon-buter {
    -webkit-mask-image: url('img/icons/butter.svg');
    mask-image: url('img/icons/buter.svg');
}

.mask-icon-sort,
.xmessage-icon-karma:after {
    -webkit-mask-image: url('img/icons/sort.svg');
    mask-image: url('img/icons/sort.svg');
}

.mask-icon-fullscreen {
    -webkit-mask-image: url('img/icons/fullscreen.svg');
    mask-image: url('img/icons/fullscreen.svg');
}

.mask-icon-fullscreen-exit {
    -webkit-mask-image: url('img/icons/fullscreen-exit.svg');
    mask-image: url('img/icons/fullscreen-exit.svg');
}

.mask-icon-filter {
    -webkit-mask-image: url('img/icons/filter.svg');
    mask-image: url('img/icons/filter.svg');
}

.mask-icon-level {
    -webkit-mask-image: url('img/icons/level.svg');
    mask-image: url('img/icons/level.svg');
}

.mask-icon-menu {
    -webkit-mask-image: url('img/icons/menu.svg');
    mask-image: url('img/icons/menu.svg');
}

.mask-icon-comments,
.xmessage-icon-reply:after {
    -webkit-mask-image: url('img/icons/messge.svg');
    mask-image: url('img/icons/messge.svg');
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
}

.mask-icon-discus {
    -webkit-mask-image: url('img/icons/discus.svg');
    mask-image: url('img/icons/discus.svg');
}

.mask-icon-frozen {
    -webkit-mask-image: url('img/icons/frozen.svg');
    mask-image: url('img/icons/frozen.svg');
}

.mask-icon-print {
    -webkit-mask-image: url('img/icons/print.svg');
    mask-image: url('img/icons/print.svg');
}

.mask-icon-search {
    -webkit-mask-image: url('img/icons/search.svg');
    mask-image: url('img/icons/search.svg');
}

.mask-icon-caret,
.caret {
    -webkit-mask-image: url('img/icons/down.svg');
    mask-image: url('img/icons/down.svg');
}

.mask-icon-box {
    -webkit-mask-image: url('img/icons/iskhodnik.svg');
    mask-image: url('img/icons/iskhodnik.svg');
}

.mask-icon-sound-on {
    -webkit-mask-image: url('img/icons/sound-on.svg');
    mask-image: url('img/icons/sound-on.svg');
}

.mask-icon-sound-off {
    -webkit-mask-image: url('img/icons/sound-off.svg');
    mask-image: url('img/icons/sound-off.svg');
}

.mask-icon-lessons {
    -webkit-mask-image: url('img/icons/lessons.svg');
    mask-image: url('img/icons/lessons.svg');
}

.mask-icon-express-course {
    -webkit-mask-image: url('img/icons/express-course.svg');
    mask-image: url('img/icons/express-course.svg');
}

.mask-icon-translation {
    -webkit-mask-image: url('img/icons/translation.svg');
    mask-image: url('img/icons/translation.svg');
}

.mask-icon-share {
    -webkit-mask-image: url('img/icons/share.svg');
    mask-image: url('img/icons/share.svg');
}

.mask-icon-site {
    -webkit-mask-image: url('img/icons/site.svg');
    mask-image: url('img/icons/site.svg');
}

.mask-icon-flag {
    -webkit-mask-image: url('img/icons/flag.svg');
    mask-image: url('img/icons/flag.svg');
}

.mask-icon-close-circle {
    -webkit-mask-image: url('img/icons/close.svg');
    mask-image: url('img/icons/close.svg');
}

.mask-icon-lock {
    -webkit-mask-image: url('img/icons/closed.svg');
    mask-image: url('img/icons/closed.svg');
}

.mask-icon-login {
    -webkit-mask-image: url('img/icons/enter.svg');
    mask-image: url('img/icons/enter.svg');
}

.mask-icon-redirect {
    -webkit-mask-image: url('img/icons/redirect.svg');
    mask-image: url('img/icons/redirect.svg');
}

.mask-icon-unlock {
    -webkit-mask-image: url('img/icons/open.svg');
    mask-image: url('img/icons/open.svg');
}

.mask-icon-copy {
    -webkit-mask-image: url('img/icons/copy.svg');
    mask-image: url('img/icons/copy.svg');
}

.mask-icon-posts {
    -webkit-mask-image: url('img/icons/post.svg');
    mask-image: url('img/icons/post.svg');
}

.mask-icon-favorites,
.mask-icon-collection {
    -webkit-mask-image: url('img/icons/bookmark.svg');
    mask-image: url('img/icons/bookmark.svg');
    height: 10px;
}

.mask-icon-source {
    -webkit-mask-image: url('img/icons/addon.svg');
    mask-image: url('img/icons/addon.svg');
}

.mask-icon-star {
    -webkit-mask-image: url('img/icons/star.svg');
    mask-image: url('img/icons/star.svg');
}

.mask-icon-star-fill {
    -webkit-mask-image: url('img/icons/star-fill.svg');
    mask-image: url('img/icons/star-fill.svg');
}

.mask-icon-exit {
    -webkit-mask-image: url('img/icons/exit.svg');
    mask-image: url('img/icons/exit.svg');
}

.mask-icon-view {
    -webkit-mask-image: url('img/icons/view.svg');
    mask-image: url('img/icons/view.svg');
    position: relative;
}

.mask-icon-view-no {
    -webkit-mask-image: url('img/icons/no-view.svg');
    mask-image: url('img/icons/no-view.svg');
    position: relative;
}

.mask-icon-plus-round {
    -webkit-mask-image: url('img/icons/plus-round.svg');
    mask-image: url('img/icons/plus-round.svg');
}

.mask-icon-minus-round {
    -webkit-mask-image: url('img/icons/minus-round.svg');
    mask-image: url('img/icons/minus-round.svg');
}

.mask-icon-plus {
    -webkit-mask-image: url('img/icons/plus.svg');
    mask-image: url('img/icons/plus.svg');
}

.mask-icon-minus {
    -webkit-mask-image: url('img/icons/minus.svg');
    mask-image: url('img/icons/minus.svg');
}

.mask-icon-next,
.mask-icon-prev {
    -webkit-mask-image: url('img/icons/rigth.svg');
    mask-image: url('img/icons/rigth.svg');
}

.mask-icon-config,
.xmessage-config {
    -webkit-mask-image: url('img/icons/setting.svg');
    mask-image: url('img/icons/setting.svg');
}

.mask-icon-partner {
    -webkit-mask-image: url('img/icons/partnerka.svg');
    mask-image: url('img/icons/partnerka.svg');
}

.mask-icon-clock {
    -webkit-mask-image: url('img/icons/clock.svg');
    mask-image: url('img/icons/clock.svg');
}

.mask-icon-future {
    -webkit-mask-image: url('img/icons/timer.svg');
    mask-image: url('img/icons/timer.svg');
}

.mask-icon-pinit {
    -webkit-mask-image: url('img/icons/pinit.svg');
    mask-image: url('img/icons/pinit.svg');
    background: var(--color-red);
}

.mask-icon-complaint {
    -webkit-mask-image: url('img/icons/zhaloba.svg');
    mask-image: url('img/icons/zhaloba.svg');
}

.mask-icon-trash {
    -webkit-mask-image: url('img/icons/icon-trash.svg');
    mask-image: url('img/icons/icon-trash.svg');
}

.mask-icon-edit {
    -webkit-mask-image: url('img/icons/blog-master.svg');
    mask-image: url('img/icons/blog-master.svg');
}

.mask-icon-info {
    -webkit-mask-image: url('img/icons/infa.svg');
    mask-image: url('img/icons/infa.svg');
}

.mask-icon-pinned {
    -webkit-mask-image: url('img/icons/pinned.svg');
    mask-image: url('img/icons/pinned.svg');
}

.mask-icon-order {
    -webkit-mask-image: url('img/icons/order.svg');
    mask-image: url('img/icons/order.svg');
}

.mask-icon-save {
    -webkit-mask-image: url('img/icons/save.svg');
    mask-image: url('img/icons/save.svg');
}

.mask-icon-citate {
    -webkit-mask-image: url('img/icons/citate.svg');
    mask-image: url('img/icons/citate.svg');
}

.mask-icon-feed {
    -webkit-mask-image: url('img/icons/feed.svg');
    mask-image: url('img/icons/feed.svg');
}

.mask-icon-attach {
    -webkit-mask-image: url('img/icons/attach.svg');
    mask-image: url('img/icons/attach.svg');
}

.mask-icon-addon {
    -webkit-mask-image: url('img/icons/addon.svg');
    mask-image: url('img/icons/addon.svg');
    background: #f44af8;
}

.mask-icon-home {
    -webkit-mask-image: url('img/icons/home.svg');
    mask-image: url('img/icons/home.svg');
}

.mask-icon-alarm {
    -webkit-mask-image: url('img/icons/alarm.svg');
    mask-image: url('img/icons/alarm.svg');
}

.mask-icon-left,
.mask-icon-right {
    -webkit-mask-image: url('img/icons/left.svg');
    mask-image: url('img/icons/left.svg');
}

.mask-icon-right {
    transform: rotate(180deg);
}

.mask-icon-starcircle,
.dt-icon {
    -webkit-mask-image: url('img/icons/premium.svg');
    mask-image: url('img/icons/premium.svg');
}

.mask-icon-academ,
.dt-icon.dt-icon-blog-post-0 {
    -webkit-mask-image: url('img/icons/course.svg');
    mask-image: url('img/icons/course.svg');
}

.mask-icon-video,
.dt-icon-articles-lesson {
    -webkit-mask-image: url('img/icons/video.svg');
    mask-image: url('img/icons/video.svg');
}

.mask-icon-user {
    -webkit-mask-image: url('img/icons/user.svg');
    mask-image: url('img/icons/user.svg');
}

.mask-icon-users {
    -webkit-mask-image: url('img/icons/users.svg');
    mask-image: url('img/icons/users.svg');
}

.mask-icon-image,
.mask-icon-images {
    -webkit-mask-image: url('img/icons/gallery.svg');
    mask-image: url('img/icons/gallery.svg');
}

.mask-icon-playlist {
    -webkit-mask-image: url('img/icons/playlist.svg');
    mask-image: url('img/icons/playlist.svg');
}

.mask-icon-download {
    -webkit-mask-image: url('img/icons/download.svg');
    mask-image: url('img/icons/download.svg');
}

.mask-icon-link {
    -webkit-mask-image: url('img/icons/links.svg');
    mask-image: url('img/icons/links.svg');
}

.mask-icon-coins {
    -webkit-mask-image: url('img/icons/money.svg');
    mask-image: url('img/icons/money.svg');
}

.mask-icon-mail {
    -webkit-mask-image: url('img/icons/mail.svg');
    mask-image: url('img/icons/mail.svg');
}

.mask-icon-wallet {
    -webkit-mask-image: url('img/icons/wallet.svg');
    mask-image: url('img/icons/wallet.svg');
}

.mask-icon-stat {
    -webkit-mask-image: url('img/icons/statistic.svg');
    mask-image: url('img/icons/statistic.svg');
}

.mask-icon-links {
    -webkit-mask-image: url('img/icons/links.svg');
    mask-image: url('img/icons/links.svg');
}

.mask-icon-arrow {
    -webkit-mask-image: url('img/icons/perehod.svg');
    mask-image: url('img/icons/perehod.svg');
}

.mask-icon-help-circle {
    -webkit-mask-image: url('img/icons/help.svg');
    mask-image: url('img/icons/help.svg');
}

.mask-icon-fire {
    -webkit-mask-image: url('img/icons/fire.svg');
    mask-image: url('img/icons/fire.svg');
}

.mask-icon-fire-color {
    background-image: url('img/icons/fire-color.svg');
    background-color: transparent;
}

.mask-icon-dark {
    -webkit-mask-image: url('img/icons/dark.svg');
    mask-image: url('img/icons/dark.svg');
}

.mask-icon-live {
    background: #ff4646 !important;
    border-radius: 50%;
    animation: live 3s linear infinite;
}

.mask-icon-bold {
    -webkit-mask-image: url('img/icons/bold.svg');
    mask-image: url('img/icons/bold.svg');
}

.mask-icon-italic {
    -webkit-mask-image: url('img/icons/italik.svg');
    mask-image: url('img/icons/italik.svg');
}

.mask-icon-list {
    -webkit-mask-image: url('img/icons/list.svg');
    mask-image: url('img/icons/list.svg');
}

.mask-icon-line {
    -webkit-mask-image: url('img/icons/line.svg');
    mask-image: url('img/icons/line.svg');
}

.mask-icon-quotes {
    -webkit-mask-image: url('img/icons/quotes.svg');
    mask-image: url('img/icons/quotes.svg');
}

.mask-icon-slider {
    -webkit-mask-image: url('img/icons/slider.svg');
    mask-image: url('img/icons/slider.svg');
}

.mask-icon-undo,
.mask-icon-redo {
    -webkit-mask-image: url('img/icons/tuda.svg');
    mask-image: url('img/icons/tuda.svg');
}

.mask-icon-redo {
    transform: rotate(180deg);
}


.mask-icon-instagram {
    -webkit-mask-image: url('img/icons/insta.svg');
    mask-image: url('img/icons/insta.svg');
}

.mask-icon-vk {
    -webkit-mask-image: url('img/icons/vk.svg');
    mask-image: url('img/icons/vk.svg');
}


.mask-icon-creativo {
    -webkit-mask-image: url('img/icons/creativo.svg');
    mask-image: url('img/icons/creativo.svg');
}


/**endicons**/

.xmessage-icon-reply:after,
.xmessage-icon-karma:after {
    content: '';
}

.dt-icon.dt-icon-blog-post-0 {
    background: var(--color-blue-2);
}

.dt-icon-articles-lesson {
    background: var(--color-lightred);
}

.mask-icon-trash,
.mask-icon-edit {
    margin-right: 3px;
}

.mask-icon-prev {
    transform: rotate(90deg);
}

.mask-icon-next {
    transform: rotate(-90deg);
}


/**animate**/

@keyframes live {
    0% {
        opacity: 1;
        animation-timing-function: cubic-bezier(0.7116, 0.2095, 0.8159, 0.6876);
    }
    50% {
        opacity: 0.5;
        animation-timing-function: cubic-bezier(0.7116, 0.2095, 0.8159, 0.6876);
    }
    100% {
        opacity: 1;
        animation-timing-function: cubic-bezier(0.7116, 0.2095, 0.8159, 0.6876);
    }
}


/**size**/

.mask-icon-10-10 {
    width: 10px;
    height: 10px;
}

.mask-icon-12-12 {
    width: 12px;
    height: 12px;
}

.mask-icon-16-16 {
    width: 16px;
    height: 16px;
}

.mask-icon-18-18 {
    width: 18px;
    height: 18px;
}

.mask-icon-20-20 {
    width: 2rem;
    height: 2rem;
}

.mask-icon-24-24 {
    width: 2.4rem;
    height: 2.4rem;
}

.mask-icon-24x {
    width: 24px;
    height: 24px;
}

.mask-icon-32-32 {
    width: 3.2rem;
    height: 3.2rem;
}

.mask-icon-42-42 {
    width: 4.2rem;
    height: 4.2rem;
}

.mask-icon-56-56 {
    width: 5.6rem;
    height: 5.6rem;
}

.mask-icon-64-64 {
    width: 6.4rem;
    height: 6.4rem;
}


/**colors**/

.liked .mask-icon,
.mask-icon-red {
    background: var(--color-red) !important;
}

.mask-icon-lightred {
    background: var(--color-lightred);
}

.mask-icon-lightblue {
    background: var(--color-lightblue);
}

.mask-icon-white {
    background: var(--color-white);
}

.mask-icon-white-white {
    background: #fff;
}

.mask-icon-blue,
.btn-primary-border .mask-icon {
    background: var(--color-blue);
    color: var(--color-blue);
}

.mask-icon-grey {
    background: var(--color-grey);
}

.mask-icon-green {
    background: var(--color-green);
}

.mask-icon-yellow {
    background: var(--color-yellow);
}

.mask-icon-blue-2 {
    background: var(--color-blue-2);
}

.mask-icon-seagreen {
    background: var(--color-seagreen);
}

.mask-icon-blue-3 {
    background: var(--color-blue-3);
}

.mask-icon-yellow-2 {
    background: var(--color-yellow-2);
}

.mask-icon-black {
    background: var(--color-black);
}

.mask-icon-black-black {
    background: #000;
}

.mask-icon-dark-grey {
    background: var(--color-dark-grey);
}