Hardest time getting font to actually show up html file

Question

I've been having a issue getting a font to import and actually work on my site. The font is Microgramma, not to be confused with Michroma the google free font (irrelevant, but yea). I bought the license for the .woff and .tff version through letotype. I just want to change my div.logo, footer, & h1. I don't know if it's because I'm not importing it, or some other factor.

Site provided me this code for the font:

@font-face {
font-family: "Microgramma W05 Bold Extended";
src: url("Fonts/5098213/0b230448-6101-4794-9ea9-f219c1a8ca3f.woff2") format("woff2"), 
url("Fonts/5098213/efd98fb1-2129-4b9a-bc42-293757c7b859.woff") format("woff");
}

https://codepen.io/daddchamploo/pen/ZEWNvXN

Answer 1

if you want this font apply to entire page :

  body {
        font-family: Michroma;
    }

and delete this line font-family: "Microgramma W05 Bold Extended"; from
div.logo a and div.logo