There are several default fonts that are available in all browsers. These generic font families include <code>monospace</code>, <code>serif</code> and <code>sans-serif</code>
When one font isn't available, you can tell the browser to "degrade" to another font.
For example, if you wanted an element to use the <code>Helvetica</code> font, but degrade to the <code>sans-serif</code> font when <code>Helvetica</code> wasn't available, you will specify it as follows:
Generic font family names are not case-sensitive. Also, they do not need quotes because they are CSS keywords.
</section>
## Instructions
<sectionid='instructions'>
To begin with, apply the <code>monospace</code> font to the <code>h2</code> element, so that it now has two fonts - <code>Lobster</code> and <code>monospace</code>.
In the last challenge, you imported the <code>Lobster</code> font using the <code>link</code> tag. Now comment out that import of the <code>Lobster</code> font(using the HTML comments you learned before) from Google Fonts so that it isn't available anymore. Notice how your <code>h2</code> element degrades to the <code>monospace</code> font.
<strong>Note</strong><br>If you have the Lobster font installed on your computer, you won't see the degradation because your browser is able to find the font.
testString: assert(/\s*h2\s*\{\s*font-family\:\s*(\'|")?Lobster(\'|")?,\s*monospace\s*;\s*\}/gi.test(code), 'Your h2 element should degrade to the font <code>monospace</code> when <code>Lobster</code> is not available.');
- text: Comment out your call to Google for the <code>Lobster</code> font by putting <code><!--</code> in front of it.
testString: assert(new RegExp("<!--[^fc]", "gi").test(code), 'Comment out your call to Google for the <code>Lobster</code> font by putting <code><!--</code> in front of it.');
- text: Be sure to close your comment by adding <code>-->!</code>.
testString: assert(new RegExp("[^fc]-->", "gi").test(code), 'Be sure to close your comment by adding <code>-->!</code>.');