CSS font faces from imported files

So i have got font face

@font-face {
    font-family:Butler;
    src: url(../fonts/OpenSans-Light.ttf);
}

And two files user.css and options.css so how can i use this font in both of them without adding this code in every file. I tried creating new file font.css with @font-face {

 @font-face {
    font-family:Butler;
    src: url(../fonts/OpenSans-Light.ttf);
}

And then import it in my user.css,but it did not work for me