@font-face {
    font-family: 'SHOCK icons';
    src: url('../fonts/shock-icons.eot');
    src: url('../fonts/shock-icons.eot?#iefix') format('embedded-opentype'),
         url('../fonts/shock-icons.woff') format('woff'),
         url('../fonts/shock-icons.ttf') format('truetype'),
         url('../fonts/shock-icons.svg#shock-icons') format('svg');
    font-weight: normal;
    font-style: normal;
}
[class*='icon-']:before{
   display: inline-block;
   font-family: 'SHOCK icons';
   font-style: normal;
   font-weight: normal;
   line-height: 1;
   width:1em;          /* ruimte reserveren */
   height:1em; 
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale
}

.icon-heart-fill:before{content:'\0041';}
.icon-heart-outline:before{content:'\0042';}
.icon-close-sharp:before{content:'\0043';}
.icon-close-round:before{content:'\0044';}
.icon-check:before{content:'\0045';}
.icon-arrow-left:before{content:'\0046';}
.icon-arrow-right:before{content:'\0047';}
.icon-cart-filled:before{content:'\0049';}
.icon-filter:before{content:'\004a';}
.icon-cart:before{content:'\004b';}
.icon-cart-bold:before{content:'\004c';}
.icon-heart-outline-bold:before{content:'\004d';}
.icon-account:before{content:'\004e';}
.icon-account-bold:before{content:'\004f';}