hero header not loading on mobile

Hi after checking my google mobile-friendly test and it is saying my site is mobile friendly but with a Page partially loaded (Not all page resources could be loaded. This can affect how Google sees and understands your page. Fix availability problems for any resources that can affect how Google understands your page.) I notice on their screen shot as well as my own mobile phone the hero header is not displaying on the home page which is the only page I display it on (Page loading info-1 page resource couldn’t be loaded.. https://fonts.googleapis.com/css?family=Open%20Sans%3A300%2C300italic%2Cregular%2Citalic%2C600%2C600italic%2C700%2C700italic%2C800%2C800italic%7CTimes%20New%20Roman&display=swap Stylesheet - JavaScript console messages - Message Source Time
Refused to apply style from 'https://fonts.googleapis.com/css?family=Open%20Sans%3A300%2C300italic%2Cregular%2Citalic%2C600%2C600italic%2C700%2C700italic%2C800%2C800italic%7CTimes%20New%20Roman&display=swap' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
https://yogaforbeginnersworld.com/:0 {this is what generate press display rules are- Document
Container
Grid
Container
Headline] did I switch something off by mistake Any ideas Thank's Russ