various headings

by jshacker

HTML

<div id="heading">traffoon</div>
	<div id="heading1">traffoon</div>
	<div id="heading2">traffoon</div>
	<div id="heading3">traffoon</div>
	<div id="heading4">traffoon</div>
	<div id="heading5">traffoon</div>
	<div id="heading6">traffoon</div>

CSS

div {
  margin: 50px 20px;
}
div:first-of-type {
  margin-top: 30px;
}
div:last-of-type {
  margin-bottom: 30px;
}
#heading {
  font-size: 64px;
  color: black;
  text-shadow:
    2px 2px 4px #900,
    -2px -2px 2px #009,
    -2px 2px 2px #090,
    2px -2px 2px #ff0,
    0 0 4px white;
}
#heading1 {
  font-size: 64px;
  color: white;
  text-shadow:
    2px 2px 4px #900,
    -2px -2px 2px #009,
    -2px 2px 2px #090,
    2px -2px 2px #ff0,
    0 0 4px black;
}
#heading2 {
  font-size: 64px;
  color: black;
  text-shadow:
    4px 0 2px #900,
    -4px 0 2px #009,
    0 4px 2px #090,
    0 -4px 2px #ff0,
    0 0 4px white;
}
#heading3 {
  font-size: 64px;
  color: white;
  text-shadow:
    4px 0 2px #900,
    -4px 0 2px #009,
    0 4px 2px #090,
    0 -4px 2px #ff0,
    0 0 4px black;
}
#heading4 {
  font-size: 64px;
  color: black;
  text-shadow:
    4px 0 10px #900,
    -4px 0 10px #009,
    0 4px 10px #090,
    0 -4px 10px #ff0,
    0 0 10px white;
}
#heading5 {
  font-size: 64px;
  color: black;
}
#heading6 {
  font-size: 64px;
  color: white;
  text-shadow:
    4px 0 10px #900,
    -4px 0 10px #009,
    0 4px 10px #090,
    0 -4px 10px #ff0,
    0 0 10px black;
}