Custom Font for Heading on Image Poster dosent show up on mobile

Site URL: https://www.superpowerss.com/

Hi, 

I have created a code for all the headers and for header for the images and it dosent show up on mobile. 

What would be the code for that? thanks!

Which code did you insert?

i got the header to work but now my body text is all overlapping over one another like this below 

code for body text is this 

font-family: 'CASLON';

       src: url('Fonthttps://static1.squarespace.com/static/5aef419ff2e6b1f9aa3ea218/t/5fb7df66f36a8448ed62c7e1/1605885800018/Caslon540.ttfURL');

  }

P {font-family: 'FontTitlehttps://static1.squarespace.com/static/5aef419ff2e6b1f9aa3ea218/t/5fb7df66f36a8448ed62c7e1/1605885800018/Caslon540.ttf';}

to change the header for mobile i used this 

.mobile-bar-wrapper * {
   font-family: 'Turnpike';
   font-size: 18px;
}

h1 {
  font-family: 'Turnpike';
  font-size: 18px;
}