Why isn't my chosen font displaying on my website header?

Technical Q&A
1

Hi,

since 3 days I’m trying to replace only the first header’s font on my website (“Because life is sweet”), but for some reason regardless the font I use in the css file, the header would only change to an “Ariel” looking like font.

Important information:

  • I would like to use “Lobster” as my font
  • The font already exists in the list of fonts, but since it didn’t work, I tried adding it as a custom font-- also didn’t help
  • If I do not use the code (or remove it), the header would be with “Poppins” font as I picked in Theme settings > Typography > Headings and buttons, but when I add the code it turns into a “no font”/“boring” form

I tried the following codes, but nothing worked:

.mega-title–large {
font-family: “Lobster” !important;
}

h2.h1.mega-title.mega-title–large {
font-family: “Lobster” ;
}

Website: https://sugar-free-eu.myshopify.com

Password: eveirt

THE THEME REACTS TO THE CODE BY REMOVING THE POPPINS THEME WITHOUT REPLACING IT WITH LOBSTER