$colorHeader: #652e8f; .new-ico-user { b { width: 30px; height: 30px; background: $colorHeader; border-radius: 100%; font-style: normal; font-weight: normal; color: #fff; display: block; font-size: 12px; text-transform: uppercase; text-align: center; line-height: 30px; float: left; } i { font-style: normal; float: left; color: #777b80; font-size: 12px !important; line-height: 30px; margin-left: 10px; &:first-letter { text-transform: uppercase; } } } @font-face { font-family: 'icomoon'; src: url('../fonts/icomoon.eot?cekg2c'); src: url('../fonts/icomoon.eot?cekg2c#iefix') format('embedded-opentype'), url('../fonts/icomoon.ttf?cekg2c') format('truetype'), url('../fonts/icomoon.woff?cekg2c') format('woff'), url('../fonts/icomoon.svg?cekg2c#icomoon') format('svg'); font-weight: normal; font-style: normal; } @mixin svgIcon { font-family: 'icomoon' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .site_title { span { display: none; } &:before { @include svgIcon; font-size: 36px; color: #fff; content: '\e90a'; //content: '\e900'; line-height: 55px; } } .main_menu { b { color: #7c7c7c; width: 58px; display: inline-block; text-align: center; &:before { @include svgIcon; font-size: 18px; color: #7c7c7c; } } .side-menu { .active { b { &:before { color: #fff; } } } } } b { &.site { &:before { content: '\e900'; } } &.home { &:before { content: '\e901'; } } &.static { &:before { content: '\e902'; } } &.seo { &:before { content: '\e903'; } } &.catalog { &:before { content: '\e904'; } } &.options { &:before { content: '\e905'; } } &.order { &:before { content: '\e906'; } } &.blog { &:before { content: '\e907'; } } &.settings { &:before { content: '\e908'; } } &.slider { &:before { content: '\e909'; } } }