@font-face not embedding on mobile Safari (iPhone/iPad)

I'm embedding fonts on a mobile website using @font-face (css from FontSquirrel). When I preview in desktop Safari or Chrome, the fonts embed fine, but they don't appear in mobile Safari on the iPhone/iPad. I'm not getting any errors and I can't figure out what's going wrong. Here's my CSS. Any ideas?

@font-face {
    font-family: 'JottingRegular';
    src: url('../fonts/jotting_regular-webfont.eot');
    src: local('☺'),
         url('../fonts/jotting_regular-webfont.woff') format('woff'),
         url('../fonts/jotting_regular-webfont.ttf') format('truetype'),
         url('../fonts/jotting_regular-webfont.svg#webfonttEfFltbI') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'JottingBold';
    src: url('../fonts/jotting_bold-webfont.eot');
    src: local('☺'),
         url('../fonts/jotting_bold-webfont.woff') format('woff'), 
         url('../fonts/jotting_bold-webfont.ttf') format('truetype'), 
         url('../fonts/jotting_bold-webfont.svg#webfontJpUFTHYS') format('svg');
    font-weight: normal;
    font-style: normal;
}