Coding for CSS, changing fonts

Site URL: https://www.marymaryflorals.co.uk

Hi all,

I am really struggling to change the text across my whole website and mobile web version to a customised font. I have managed to change the primary navigation header but nothing else, I have written the code but I don't know the code language for sections such as PRODUCTS: DETAILS

Here is my existing code (this hasn't changed anything apart from the primary navigation header)...

@font-face {
font-family: apfel;
src: url(https://static1.squarespace.com/static/5cdd25689bbd500001f4eb0c/t/61d4dd53b09a604e2f0d85a2/1641340243803/ApfelGrotezk-Regular.otf);
}
.Header-nav--primary {
font-family: 'apfel';
}
a.product-title, h1.ProductItem-details-title {
font-family: 'apfel';
}

h1 {
font-family: 'apfel';
}
h2 {
font-family: 'apfel';
}
h3 {
font-family: 'apfel';
}
.sqsrte-large {
font-family: 'apfel';
}
p {
font-family: 'apfel';
}
.sqsrte-small {
font-family: 'apfel';
}
// Site Title //
.header-title-text a {
  font-family: apfel !important;
}
// Site Navigation //
.header-nav-item a {
  font-family: apfel !important;
}

Try this code

@font-face {
    font-family: apfel;
    src: url(https://static1.squarespace.com/static/5cdd25689bbd500001f4eb0c/t/61d4dd53b09a604e2f0d85a2/1641340243803/ApfelGrotezk-Regular.otf)
}

* {
    font-family: apfel !important;
}

It will target every elements on your site

thank you soooooo much