CORS policy not working

Hello.
I have been using Cyberpanel for almost all of my sites. And everything is going absolutely fine.
But, recently I happened to find an issue.
That is, when I try to implement CDN for my sites, the fonts don’t load in any way.
For example, my site is www.thepetsmedia.com and I am using a subdomain cdn0.thepetsmedia.com as the CDN.
But whenever I enable CDN mapping and revisit my site, everything else loads just fine. But the fonts become broken and the icons get boxed.
I found out that it is a CORS problem when I looked at Inspect element=>Console=>

“Access to font at ‘https://cdn0.thepetsmedia.com/wp-content/themes/Newspaper/images/icons/newspaper.woff?17’ from origin ‘https://www.thepetsmedia.com’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.”

I have already tried adding the CORS header in the .htaccess file but no luck.
Can anyone please help me out here?
Thanks in advance.

This worked for me

https://support.cloudflare.com/hc/en-us/articles/200308847-Using-cross-origin-resource-sharing-CORS-with-Cloudflare#4vknA9IbgW57oiclaPv4QP