How to add @font-face to style sheet?

Hi

I put all new fonts to "Themes\Motion\Content\font".

then add @font-face to styles.css ,for example :
@font-face {
    font-family: 'droid_arabic_naskhregular';
    src: url('../font/droid_naskh_regular-webfont.eot');
    src: url('../font/droid_naskh_regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/droid_naskh_regular-webfont.woff') format('woff'),
         url('../font/droid_naskh_regular-webfont.ttf') format('truetype'),
         url('../font/droid_naskh_regular-webfont.svg#droid_arabic_naskhregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

then add font-family to body:
    font-family: droid_arabic_naskhregular;
and edit this line :
    font: normal 400 12px "Open Sans", sans-serif;
to :
    font: normal 400 12px droid_arabic_naskhregular;

but not work :-(

notic : if in this line put local font name.it work fine. but not work with font-face.

help me

Hi,

Can you send us link yo your website, so we can investigate your problem there, because the code you have sent us looks correct,

NIkola Dragiev

NopTemplatesTeam

thanks for answer. but i run my website on localhost. not yet upload my site on server.

Is it possible that the problem is related to the run on localhost?

in this line :
font: normal 400 12px "Open Sans", sans-serif;
if I use any font from my font folder on windows directory it work fine.
but if font not was in windows font folder,and use font face not work :-(

I try use simple html and css for test on localhost and om my comuter and its work fine.

you can see this :

http://8pic.ir/images/u2prpnb0ev93jgtb389h.png

but on nop-template not work :-(

I've found a solution to the problem.

The font files were not converted correctly. :-)

I use other converter and its work fine.