Custom fonts no longer working on mobile and safari

Hi - Our site has been working with custom fonts well for years! But a few weeks ago they stopped working. I added "important" tags which seemed to fix the issue but now they're working on Google Chrome but not on Safari or Mobile.

Can you help? Please see CSS below.

@font-face {
font-family: 'FOXLOW' !important;
  
src: url(https://static1.squarespace.com/static/5e6ac9bd7466fc1d7a1dce95/t/5e71fe3fae3bfc6fb939447c/1584528962738/Foxlow_Regular.ttf) ;
}
  
@font-face {
font-family: 'ANTONE' !important;   
src: url(https://static1.squarespace.com/static/5e6ac9bd7466fc1d7a1dce95/t/5e71fee43aea850a091dc7d4/1584529128524/Block.ttf) ,
    url(https://static1.squarespace.com/static/5e6ac9bd7466fc1d7a1dce95/t/5e85d015fa251819b06fcd46/1585827862025/block-webfont.woff)  ,
    url(https://static1.squarespace.com/static/5e6ac9bd7466fc1d7a1dce95/t/5e85d023b3bbf8771dd4c6f1/1585827875523/block-webfont.woff2) ;
}

@font-face {   
font-family: 'SPECTRAL';   
src: url(https://static1.squarespace.com/static/5e6ac9bd7466fc1d7a1dce95/t/5e716be662b4b250032fa9a5/1584491498347/Spectral-Regular.ttf) ;
}  

h1 {font-family: 'FOXLOW' !important;}
h2 {font-family: 'FOXLOW' !important;}
h3 {font-family: 'ANTONE' !important;}
h4 {font-family: 'ANTONE' !important;}
p {font-family: 'SPECTRAL' !important;}

.button, .sqs-block-button-element--small, .btn {font-family: 'ANTONE' !important;}

.sqs-block-button-element--large, .sqs-button-element--secondary {
  font-family: 'ANTONE' !important;
}

.button, .sqs-block-button-element--medium, .btn {font-family: 'ANTONE' !important;}

.blog-title, .blog-item-wrapper .blog-item-title h1.entry-title {font-family: 'FOXLOW' !important;}

.sqs-block-button .sqs-block-button-element--small {
 width: 80%;
}

Remove !important from @font-face code