Custom Site Title Font Brine Template

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

Blog: beautybyjessika.com | NO PASSWORD

Hello,

I'm trying to use a custom font I uploaded to change my blog's site title/header branding. I've tried all the codes (header-branding, site-title) but none are responding. I suspect it has something to do with the template I'm using or an oversight resulting in a user error, lol. 

Here's the code I currently have:

@font-face {
  font-family:"celesse";
  src: url(https://static1.squarespace.com/static/55f4f0c9e4b08f0fd06083d8/t/5ebd87054cb3491b4103a54d/1589479173816/Celesse-Regular.otf), url(https://static1.squarespace.com/static/55f4f0c9e4b08f0fd06083d8/t/5ebd870b09bd893bf0bb49df/1589479179316/Celesse-Regular.ttf); 
}
/* Font Celesse Site Title */
.header-nav-item a {
   font-family: 'celesse' !important;
}
/* Font Nav */
div#topNav a {
   font-family: 'celesse' !important;
}

Your help is appreciated.

Jessika

Add to Home > Design > Custom CSS

@font-face {
  font-family: celesse;
  src: url(https://static1.squarespace.com/static/55f4f0c9e4b08f0fd06083d8/t/5ebd87054cb3491b4103a54d/1589479173816/Celesse-Regular.otf), url(https://static1.squarespace.com/static/55f4f0c9e4b08f0fd06083d8/t/5ebd870b09bd893bf0bb49df/1589479179316/Celesse-Regular.ttf); 
}
a.Header-branding, a.Mobile-bar-branding {
    font-family: celesse !important;
}

Thank you, tuanphan! It worked. 

Many thanks!