CSS @font-face is not working properly (2nd Issue)

Question

When I use my computer with Firefox or IE, the font doesn't work, only when using Chrome. Also, when I use my cellphone even with chrome, the font doesn't work.

Please consider my code below, with a huge help from Gerardo BLANCO.

@font-face {
  font-family: Signika;
  src: url('cllean-directory/fonts/Signika-Regular.ttf') format('truetype'), url('cllean-directory/fonts/Signika-Regular.woff') format('woff'), url('cllean-directory/fonts/Signika-Regular.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: Signika;
  src: url('cllean-directory/fonts/Signika-Bold.ttf') format('truetype'), url('cllean-directory/fonts/Signika-Bold.woff') format('woff'), url('cllean-directory/fonts/Signika-Bold.woff2') format('woff2');
  font-weight: bolder;
  font-style: normal;
}

@font-face {
  font-family: Signika;
  src: url('cllean-directory/fonts/Signika-Light.ttf') format('truetype'), url('cllean-directory/fonts/Signika-Light.woff') format('woff'), url('cllean-directory/fonts/Signika-Light.woff2') format('woff2');
  font-weight: lighter;
  font-style: normal;
}

@font-face {
  font-family: Signika;
  src: url('cllean-directory/fonts/Signika-Semibold.ttf') format('truetype'), url('cllean-directory/fonts/Signika-Semibold.woff') format('woff'), url('cllean-directory/fonts/Signika-Semibold.woff2') format('woff2');
  font-weight: bold;
  font-style: normal;
}
  font-family: SignikaS;
}

Answer 1

Few mistakes on your part. 1) It is better to name all of you font families as one. 2) You need to declare its respective weight and style. 3) Personal one -> Always put the family first

Hope this helps

@font-face {
  font-family: Signika;
  src: url('fonts/Signika-Regular.ttf') format('truetype'), url('fonts/Signika-Regular.woff') format('woff'), url('fonts/Signika-Regular.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: Signika;
  src: url('fonts/Signika-Bold.ttf') format('truetype'), url('fonts/Signika-Bold.woff') format('woff'), url('fonts/Signika-Bold.woff2') format('woff2');
  font-weight: bold;
  font-style: normal;
}

p {
  font-family: Signika;
}

<p>Hi</p>
<p style="font-weight:bold">Hi</p>