Okay, I did the inspect element in the browser, and made a screenshot. The window doesn't show everything, but what it's clipping doesn't mention anything to do with fonts. Indeed, nothing, anywhere in the window ever specifies any font by name. The selected element is suposed to be the Cagliostro font, centered as the h1 element. I moved the h1 rule up higher in the styles list and that got rid of the random serif font that it was displaying earlier. Everything now seems at least to be defaulting to what I specified as the first fallback, but it's still ignoring my webfonts.
Here is the style sheet information. I skipped the rest of the list since that has mainly to do with things like the non-text elements. The only text elements in that portion are to do with styling the button and dropdown text, and I couldn't see that interfering with the h1 and other font information. I'd like to get rid of that href to the Dreamweaver tutorials folder, but am hesitant about simply deleting it.
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Red Hen Publications — A Potterverse Tarot</title>
<link href="file:///Macintosh HD/Users/JOdeliMac/Desktop/Dreamweaver Tutorials/dreamweaver_cib_2021/lesson03/linked.css" rel="stylesheet" type="text/css">
<style type="text/css">
body {
font-size: 100%;
background-image: url(Images/basics/Classic3.jpg);
margin-top: -1px;
width: 1200px;
background-size: 25%
% 0;
background-size: auto auto;
}
a:link {
color: #851010;
text-decoration: none;
}
a:visited {
color: #850101;
text-decoration: none;
}
a:hover {
color: #FFd700;
text-decoration: none;
}
a:active {
color: #000000;
text-decoration: none;
}
/*
font-family: 'Cagliostro', sans-serif;
font-family: 'Flamenco', cursive;
*/
p, h1, h2, h3, h4, h5, h6, li { margin: 10px 0px; }
.content h1 {
font-family: Cagliostro, Arial, Verdana, sans-serif;
color: #000000;
text-align: center;
font-size: 200%;
margin-top: 20px;
margin-bottom: 20px;
}
.content h2 {
color: #000000;
font-family: cagliostro, Arial, Verdana, sans-serif;
}
.content h3 {
font-family: Cagliostro, arial, verdana, sans-serit;
font-size: 1.25em;
color: #000000;}
p {
font-family: flamenco, verdana, sans-serif;
font-weight: bold;
line-height: 125%;
font-size: 1.3em;
}
#topic2 h2 {
color: #7f0101;
}
.text-center {
clear: none;
opacity: 1;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
float: none;
text-align: center;
}
Your stylesheet should NOT be pointing to FILES on your local hard drive.
<link href="file:///Macintosh HD/Users/JOdeliMac/Desktop/Dreamweaver Tutorials/dreamweaver_cib_2021/lesson03/linked.css" rel="stylesheet" type="text/css">
This implies you have not defined your local site folder or your CSS and HTML document are not yet saved to that folder. Go to Site > New Site... enter or browse to your local site folder. Save your document. The link to external CSS file should resolve to the proper path of: "site_folder/file_name.css"
AdChoices