Не работает шрифт на мобильных устройствах

Всем доброго времени суток! Столкнулся с проблемой, подключаю шрифт в css и при этом на мобильных устройствах шрифт не работает.

Подключаю таким образом:

@font-face {
   font-family: 'Lava Pro';
   src: url('fonts/Lava/LavaPro-BoldItalic.eot');
   src: local('Lava Pro Bold Italic'), local('LavaPro-BoldItalic'),
       url('fonts/Lava/LavaPro-BoldItalic.eot?#iefix') format('embedded-opentype'),
       url('fonts/Lava/LavaPro-BoldItalic.woff2') format('woff2'),
       url('fonts/Lava/LavaPro-BoldItalic.woff') format('woff'),
       url('fonts/Lava/LavaPro-BoldItalic.ttf') format('truetype');
   font-weight: bold;
   font-style: italic;
}

.rating-text {
   position: absolute;
   font-family: 'Lava Pro';
   font-weight: bold;
   font-size: 2.2rem;
   line-height: 1.5;
   letter-spacing: 0.5px;
   z-index: 10;
}