Problema para cargar fuentes en css3

Tengo un problema que al intentar cargar fuentes en una página que estoy haciendo. Tengo una carpeta donde tengo mi index.html, img,css, js y fonts.
Al intentar cargar mi fuentes se muestran, no se porque razón.
Se que en css3 debo de hacer algo así:
}
@font-face {
font-family: 'vagrounded-bold';
src: url('/fonts/.eot'); /* Para Internet Explorer */
src: local('vagrounded-bold'), /* Para el resto de navegadores */
url('/fonts/vagrounded-bold.ttf') format('truetype'),
url('/fonts/vagrounded-bold.woff') format('woff'),
url('/fonts/vagrounded-bold.svg') format('svg');

y lo llamo desde el css con el nombre :
.datos2{
margin: 4% auto;
max-width:700px;
width:90%;
text-align:center;
}
.datos2 h2{
font-size:35px;
color:#000000;
font-family:"vagrounded-bold";
margin:0px 0px 20px 0px;
}
y en página :
<div class="datos2">
<h2>BALANCE VIDA-TRABAJO</h2>
<img src="images\datos_balance.png" alt="BALANCE VIDA-TRABAJO" title="BALANCE VIDA-TRABAJO">
<p>“Las empresas ecuatorianas, <span>necesitan escuchar con más atención</span> a estos estudios y a sus propios trabajadores, sobre la <span>importancia y beneficios</span> de tener un adecuado <span>balance en la vida laboral y personal.</span>”</p>
</div>

</div><!--.story-->
</div> <!--#balance-->

No se por cual razon no se ve el tipo de letra en mi página, esta muy raro el problema, ya que tengo otra página y se cargan correctamente.

Agradeceria mucho su amable orientación.
 
Si el nombre esta bien escrito, con mayusculas incluidas.. el error puede estar en las url, tienen una barra al comienzo y puede que eso haga que no funcione.

Intenta pasar de esto:
url('/fonts/vagrounded-bold.svg')

a esto:
url('fonts/vagrounded-bold.svg')

Saludos
 
Arriba