Font not working on Safari

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

I've just moved my site to 7.1 and am having a bit of trouble with fonts. I am using Adorn Garland for the site tagline and for collection summary title fonts - both added using custom CSS. They are showing as I want them to in Chrome but not in Safari or IOS where font is defaulting to a set header font. 

Can someone please suggest how I may fix this? I've included the custom CSS coding I used below in case that helps.

Thanks,
Catherine

// Site Title Tagline //

.header-title:after {
  content: 'Walk with me';
  font-family: adorn garland;
  font-size: 26px;
  padding-top: 14px;
  
  color: ##858585;
  display: block;
}

For collection summary title fonts I added

}
.collection-type-blog article .date { 
display: none; 
}
h2 {
    font-size: 1.7em !important;
    font-family: adorn garland;
font-weight: 400;
    color: #000000;
}

Your font name is incorrect, use this new code

.header-title:after {
    content: 'Walk with me';
    font-family: 'adorn-garland';
    font-size: 26px;
    padding-top: 14px;
    color: #858585;
    display: block;
}

Thank you Tuan! As always, you have the answers.

Very much appreciated, 

Catherine