BODY { color: black; background: goldenrod; width: 600pt; }
H1 { text-align: left;
     font-size: 24pt;
     font-weight: bold;
     font-style: regular;
}
H2 { text-align: left;
     font-size: 18pt;
     font-weight: bold;
     font-style: regular;
}
H3, H4, H5 { text-align: left;
     font-size: 24pt;
     font-weight: bold;
     font-style: regular;
}
<!-- any text that has span around it <SPAN>like this</SPAN>
  will be in cyan except that if the class of the span is
  foo <SPAN CLASS="foo">like this</SPAN> then it is in lime.
  There can be only one tag whose name is "bar" or "baz"; if
  the tag called "bar" is a SPAN tag then the text wil be in
  blue but any tag which is called "baz" will be in red: eg
  <SPAN ID="bar">this is in blue</SPAN> and <P ID="baz">this
  is in red</P>
-->
SPAN { color: cyan; }
.foo { color: lime; }
SPAN.bar { color: blue }
#baz { color red; }