/* These styles will be used for the chapter on typography, for example, to style some paragraphs with a specific font to be able to show what it looks like and particularly how it compares to other fonts */ red { color: red; font-weight: 900; } article p .red { color: red; font-weight: 900; } /* Font classes - created so that I can drop little bits of text with different fonts into the page */ .times { font-family: "Times New Roman", "Gotham", "Courier New"; } .gothic { font-family: "Franklin Gothic Bold", "Times New Roman", "Courier New"; } .comic { font-family: "Comic Sans", "Franklin Gothic Bold", "Courier New"; } /* font-weights to show the different possible values in the font-weights table */ #weight100 { font-weight: 100; } #weight200 { font-weight: 200; } #weight300 { font-weight: 300; } #weight400 { font-weight: 400; } #weight500 { font-weight: 500; } #weight600 { font-weight: 600; } #weight700 { font-weight: 700; } #weight800 { font-weight: 800; } #weight900 { font-weight: 900; } #weightighter { font-weight: lighter; } #weightnormal { font-weight: normal; } #weightbold { font-weight: bold; } #weightbolder { font-weight: bolder; } #weightinherit { font-weight: inherit; } #stylenormal { font-style: normal; } #styleoblique { font-style: oblique; } #styleitalic { font-style: italic; } @font-face { font-family: "fjord1"; src: url(../resources/FjordOne-Regular.ttf); } .fjord1normal { font-family: fjord1; font-size: 24px; } .fjord1bold { font-family: fjord1; font-size: 24px; font-weight: 700; } .fjord1normalitalic { font-family: fjord1; font-size: 24px; font-style: italic; } .fjord1bolditalic { font-family: fjord1; font-size: 24px; font-weight: 700; font-style: italic; } .omnium { font-family: omnium; font-size: 24px; color: gold; }