Intalar fuente otf en template. No me funciona

Quiero instalar una fuente que no es google font en una template. He copiado todos los archivos a la carpeta fonts de la template. El listado de archivos es:
-Gibson-Regular
-Gibson-Bold
-Gibson-Light
-Gibson-Italic
-Gibson-Semibold
Todos son archivos .otf (Opentype)

Posteriormente he añadido el siguiente codigo al fichero que utilizo para personalizar la plantilla custom.css:
@font-face {
font-family: Gibson-Regular;
src: url("fonts/Gibson.otf") format("opentype");
}

@font-face {
font-family: Gibson-Light;
src: url("fonts/Gibson-Light.otf") format("opentype");
}

body {
font-family: 'Gibson-Light', serif;
font-size: 18px;
}

1. El tema es porque no me coge la fuente en la web.
2- ¿Las fuentes .otf son compatibles con todos los navegadores o tengo que instalar alguna fuente mas?

gracias

URL del sitio: Contenido solo visible a usuarios registrados