html {
  margin: 0.2em;
  border: 0.6em double brown;
  padding: 0.2em;
  background-color: #F88;
}

body {
  margin: 0;
  border: 0.6em double brown;
  padding: 0.5em;
  background-color: white;
  background-image: url(Flourish-whitehatch.png);
  font-family: Skia, "Gill Sans", "Hoefler Text";
}

h1, h2, h3 {
  margin: 0.5em 0;
  border: none;
  padding: 0;
  font-family: Copperplate;
  text-align: center;
}

p {
  margin: 1em 0;
  border: none;
  padding: 0;
}
/* #supportingText p:first-letter {
  float: left;
  font-size: 2.4em;
  margin: -0.05em 0 -0.23em 0;
} */


[title] { 
  border: none;
  color: #007;
  font-style: inherit;
  text-decoration: none;
}


:link { color: brown; text-decoration: none; }
:link:before, :visited:before { content: "\ab"; }
:link:after, :visited:after { content: "\bb"; }

:visited { color: inherit; text-decoration: none; }

:link:hover, :visited:hover { color: red; text-decoration: underline; }



/* hey it would be nice if there was a class for these */
#pageHeader, #quickSummary, #preamble, #explanation, #participation, #benefits, #requirements, #footer, #lselect, #lfavorites, #larchives, #lresources {
  margin: 0.5em;
  border: none;
  padding: 0 0.5em;
  border: 0.5em double brown;
  border-width: 0.5em 0 0 0;
}

@media all {
  #pageHeader, #quickSummary, #preamble {
    text-align: center;
    border-width: 0 0.5em 0 0;
    margin-left: 0;
  }
  #pageHeader p, #quickSummary p, #preamble p {
    font-size: 110%;
  }
  #explanation, #participation, #benefits, #requirements, #footer {
    text-align: left;
    border-width: 0.5em 0 0 0;
  }
  #footer { padding: 0.5em; }
  #lselect, #lfavorites, #larchives, #lresources {
    text-align: center;
    border-width: 0 0 0 0.5em;
    margin-right: 0;
  }
}

#pageHeader, #lselect {
  border-top: 1em double #FAFAFA;
  border-top-color: transparent;
  margin-top: 0;
  padding-top: 0;
}
#pageHeader :first-child, #lselect :first-child {
  margin-top: 0;
  padding-top: 0;
}

#preamble, #lresources {
  border-bottom: 4em double #FAFAFA;
  border-bottom-color: transparent;
}


#footer {
  text-align: center;
}

#linkList ul {
  margin; 1em 0;
  border: none;
  padding: 0;
}
#linkList li {
  display: block;
  margin: 0.6em 0;
  border: none;
  padding: 0;
  text-align: right;
}
#linkList a {
  display: block;
  text-align: left;
}
#linkList a.c { display: inline; }

@media all {
  #container {
    margin: 0.5em 0 0 0;
    border: none;
    padding: 0;
    display: table;
  }

  #linkList, #supportingText, #intro {
    margin: 0;
    border: none;
    padding: 0;
    display: table-cell;
    vertical-align: top;
  }

  #linkList, #intro {
    width: 25%;
  }
  #supportingText { width: 50%; }
}