body, html {
  margin: 0;
  border: none;
  padding: 0;
}
body { 
  font-family: "Arial MT Condensed Light", "Arial Narrow", "Arial", sans-serif;
  background: white;
  color: #113;
}

h1, h2, h3, h4, h5, h6, div#footer {
  text-align: center;
}

h1, h2, h3, h4, h5, h6, p, ul, blockquote, div#footer {
  margin: 0;
  border-style: solid;
  border-width: 0.7em 0;
  padding: 0 0.7em;
}
h1, h2, h3, h4, h5, h6 {
  padding: 0;
}
p { padding: 0 1.5em; }
p > span {
  display: block;
  margin: auto;
  border: none;
  padding: 0;
  max-width: 28em;
}

:link, :visited {
  text-decoration: none;
  font-weight: normal;
}
:link { color: blue; }
:visited { color: purple; }
:link:hover, :visited:hover {
  text-decoration: underline;
}

abbr, acronym {
  font-family: inherit;
  font-style: normal;
  border-bottom: none;
}
.accesskey {
  /*border: 1px solid #a3a347;*/
  text-decoration: underline;
}

/* Python code to generate the color gradient below:
selectors = [
  'h3, h1, #footer',
  'h3 + p, h3 + ul, h1 + h2',
  'h3 + p + p,     #quickSummary > p',
  'h3 + p + p + p, #quickSummary > p + p',
  'h3 + p + p + p + p',
  'h3 + p + p + p + p + p',
  'h3 + p + p + p + p + p + p',
]
colors = iter(["%2x%2x%2x" % (i,i,(0xFF-(0xFF-i)*2)) for i in range(0xFF, 0x00, -0x4)])
colors = iter(["%2x%2x%2x" % ((0xFF-(0xFF-i)*2),(0xFF-(0xFF-i)*2),i) for i in range(0xFF, 0x00, -0x2)])
colors.next() # discard white

for selector in selectors:
  (colorTop, colorMid, colorBot) = (colors.next(), colors.next(), colors.next())
  print selector
  print "{ background: #%s; border-color: #%s red #%s red; }" % (colorMid, colorTop, colorBot)

*/

h3, h1, #footer
{ background: #f7f7fb; border-color: #fbfbfd red #f3f3f9 red; }
h3 + p, h3 + ul, h1 + h2
{ background: #ebebf5; border-color: #efeff7 red #e7e7f3 red; }
h3 + p + p,     #quickSummary > p
{ background: #dfdfef; border-color: #e3e3f1 red #dbdbed red; }
h3 + p + p + p, #quickSummary > p + p
{ background: #d3d3e9; border-color: #d7d7eb red #cfcfe7 red; }
h3 + p + p + p + p
{ background: #c7c7e3; border-color: #cbcbe5 red #c3c3e1 red; }
h3 + p + p + p + p + p
{ background: #bbbbdd; border-color: #bfbfdf red #b7b7db red; }
h3 + p + p + p + p + p + p
{ background: #afafd7; border-color: #b3b3d9 red #ababd5 red; }

#preamble, #supportingText, #linkList {
  border: 0px solid #ababd5;
}

#pageHeader, #quickSummary {
  text-align: center;
}

#preamble, #supportingText {
  margin: 0 10% 0 0;
  border-width: 0 1px;
  clear: right;
  float: right;
  width: 60%;
}

/*
#lselect ul, #lfavorites ul, #larchives ul, #lresources ul {
  display: none;
}
div#lselect:hover ul, div#lfavorites:hover ul, div#larchives:hover ul, div#lresources:hover ul {
  display: block;
}*/

#linkList {
  margin: 0 70% 0 10%;
  border-width: 0 0 1px 1px;
  padding: 0;
  text-align: right;
}
#linkList li {
  display: block;
  margin: 0;
  border: none;
  padding: 0 0 0.5em 0;
}

#lselect a, #lfavorites a {
  display: block;
  font-size: 1.1em;
}
#lselect a.c, #lfavorites a.c {
  display: inline;
  font-size: 0.8em;
}

@media print {
  #linkList {
    margin: auto;
    border-width: 0 1px;
    text-align: inherit;
    max-width: 20em;
  }
  #linkList, #footer {
    display: none;
  }
  #preamble, #supportingText {
    float: none;
    width: auto;
    margin-right: 0;
    border: none;
  }
  #pageHeader, #quickSummary, #preamble, #explanation, #participation, #benefits, #requirements, #lselect, #lfavorites, #larchives, #lresources, p { /* gack */
    page-break-inside: avoid;
  }
}