@font-face { font-family: 'icomoon'; src:url('../fonts/icomoon.eot'); src:url('../fonts/icomoon.eot?#iefix') format('embedded-opentype'), url('../fonts/icomoon.woff') format('woff'), url('../fonts/icomoon.ttf') format('truetype'), url('../fonts/icomoon.svg#icomoon') format('svg'); font-weight: normal; font-style: normal; } @media screen and (-webkit-min-device-pixel-ratio:0) { @font-face { font-family: 'icomoon'; src: url('../fonts/icomoon.svg#icomoon') format('svg'); } } /* Use the following CSS code if you want to use data attributes for inserting your icons */ [data-icon]:before { font-family: 'icomoon'; content: attr(data-icon); speak: none; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; } /* Use the following CSS code if you want to have a class per icon */ /* Instead of a list of all class selectors, you can use the generic selector below, but it's slower: [class*="icon-"] { */ .icon-twitter, .icon-feed, .icon-instagram, .icon-facebook, .icon-google-plus, .icon-github { font-family: 'icomoon'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; } .icon-twitter:before { content: "\e000"; } .icon-feed:before { content: "\e003"; } .icon-instagram:before { content: "\e004"; } .icon-facebook:before { content: "\e001"; } .icon-google-plus:before { content: "\e002"; } .icon-github:before { content: "\e005"; }