IMG {
  border:0;
}
IMG.photo {
  border:solid 1px #200C08;
}
.left IMG.photo.fullright {
  border-width:3px 2px 1px 7px;
  border-bottom-color:#C0C0C0;
  border-right-color:#C0C0C0;
  position:absolute;
  top:-21px;
  left:-19px;
}
.right IMG.photo.fullright {
  border-width:3px 1px 1px 0px;
  border-bottom-color:#C0C0C0;
  position:absolute;
  top:-22px;
  left:-22px;
}

TABLE {
  border-spacing:0;
}
/* IE doesn't understand border-spacing, but setting border-collapse to
 * collapse sets border-spacing to zero in IE. same as cellspacing="0" 
 */
* HTML TABLE {
  border-collapse:collapse;
}

BODY {
  padding:0px;
  margin:0px;
  background:#BC8C54 url('http://heathstreet.s3.amazonaws.com/images/site/background_panel.jpg');
  font-family:arial,helvetica,sans-serif;
  font-size:93.75%;
  line-height:1.4em;
  text-align:center; /* necessary for content centering in IE */
  color:#200C08;
}
BODY * {
  text-align:left;
}

HR {
  clear:both;
  height:0px;
  color:#FFFFFF;
  border:none;
  border-bottom: 1px solid #CCCCFF;
}

PRE {
  margin:0 0 0 0;
  font-family:arial,helvetica,sans-serif;
}
P {
  margin-top:0px;
  margin-bottom:1.5em;
}
UL, OL {
  line-height:1.32em;
}

H1, H2, H3, H4, H5, H6 {
  margin:0px;
  color:#341010;
}
H2.page_title {
}
H3 {
  font-family:arial,helvetica,sans-serif;
  padding-bottom:10px;
  padding-top:0px;
  margin:0px;
  font-size:15px;
}
H4 {
  font-family:arial,helvetica,sans-serif;
  padding-bottom:.8em;
  margin-bottom:0;
  font-size:1.0em;
}
A {
  color:#7C1C18;
  text-decoration:none;
}
A:visited {
  // color:#0000AA;
}
A:hover {
  text-decoration:underline;
}
A.blockLink {
  display:block;
}
A.blockLink, A.blockLink:hover {
  text-decoration:none;
}
A.blockLink:hover DIV {
  text-decoration:underline;
}
A.blockLink .linkText {
  text-align:center;
}
A.blockLink.followed {
  margin-bottom:15px;
}

DIV {
  margin:0px;
  padding:0px;
}
#content { 
  margin:0px auto;
  padding-bottom:100px;
  width:800px;
  background:url('http://heathstreet.s3.amazonaws.com/images/site/middle_slice.jpg'); 
  position:relative;
}

DIV.left {
  float:left; 
  width:350px;
  padding-bottom:150px; /* separate from head overlay */
  position:relative;
}
DIV.right {
  float:right;
  width:340px;
  position:relative;
}
DIV.main {
  float:left;
  width:690px;
  position:relative;
  padding-bottom:150px; /* separate from head overlay */
}
DIV.clearer {
  clear:both;
  color:#FFFFFF;
  border:0;
  clear:both;
  margin:0px;
  padding:0px;
  width:1px;
  height:1px;
  font-size:1px;
}

UL {
  margin-top:0;
  padding-top:0;
  margin-left:8px;
  padding-left:8px;
  list-style-type:circle;
}
LI {
  margin-bottom:8px;
}
UL.unstyled {
  margin:0px;
  padding:0px;
}
UL.unstyled LI {
  list-style:none;
}

.error {
  color:#FF0000;
}
.notice {
  color:#303080;
}

FORM {
  margin:0px;
  padding:0px;
}

TD, TH {
  vertical-align:top;
}

/* Shared form properties. */
.fieldList, .recordList, .recordDisplay, .formBox, .errorExplanation {
  margin-bottom:15px;
  clear:left;
}
.fieldList TABLE, .recordList TABLE, .recordDisplay TABLE {
  width:100%; /* expand to fill parent div */
}
.fieldList TABLE, .recordList TABLE, .recordDisplay TABLE, .errorExplanation {
  /* this makes it look great in FF, does it work in IE? */
  padding:5px 0px 6px;
  border:1px #A04C28 solid;
  border-top:4px #A04C28 solid;
  background-color:#F4E4D4;
}
.errorExplanation {
}
.errorExplanation H2 {
  font-size:16px;
  margin:0px 12px 0px 6px;
}
.errorExplanation P {
  display:none;
}
.errorExplanation UL {
  margin:0px 12px 0px 21px;
  padding:0px;
}
.errorExplanation UL LI {
  margin:0px;
  padding:0px;
}
.fieldList SPAN.required, .recordList SPAN.required {
  color:#FF0000;
}
.fieldList P.error, .recordList P.error {
  margin-bottom:5px;
}

// recordDisplay
// used for displaying a single record in a series of fields with header cells
// to the left of the data cells.
.recordDisplay table {
  /* no top border because each row has its own border */
  border-top-width:0px;
}
/* don't make this align top by default. it doesn't look good. */
.recordDisplay TH, .recordDisplay TD {
  padding:5px 12px 4px 6px;
  border-top:1px #D8D8D8 solid;
}
.recordDisplay th {
  font-weight:bold;
  vertical-align:top;
  padding-top:6px;
}

/* fieldList
 * used for a form containing a list of fields arranged vertically with
 * header cells to the left of input elements.
 */
/* don't make this align top by default. it doesn't look good. */
.fieldList TH, .fieldList TD {
  font-size:12px;
  padding:4px 12px 2px 0px;
}
.fieldList TH {
  padding-top:8px;
  font-weight:bold;
  vertical-align:top;
}
.fieldList TH, .fieldList TD.noTH {
  padding-left:8px;
}

.controls {
  text-align:right;
}

.show {
  margin:0px 0px 35px;
}
.show .show_date {
  font-size:14px;
  font-weight:bold;
  float:left;
  font-variant:small-caps;
}
.show .show_location {
  font-size:14px;
  font-weight:bold;
  float:right;
  font-variant:small-caps;
}
.show .show_venue {
  padding:12px 0px; /* can't use margin with clear? */
  font-size:16px;
  font-weight:bold;
  text-align:center;
}
.show .show_desc {
}
.show .clearer.show {
  width:100%;
  background:#200C08;
  background:#BC8C54;
}

.musing {
  margin:0px 0px 35px;
}
.musing_date {
  font-size:14px;
  font-weight:bold;
  font-variant:small-caps;
}
.musing .musing_date {
  float:left;
}
.musing_title {
  font-size:16px;
  font-weight:bold;
}
.musing .musing_title {
  padding:12px 0px 8px; /* can't use margin with clear? */
  text-align:center;
}
.musing .musing_text {
}
.musing .musing_link {
  text-align:right;
}
.musing .clearer.musing {
  width:100%;
  background:#200C08;
  background:#BC8C54;
}

.musing_comment {
  margin:0px 0px 35px;
}
.musing_comment_date {
  font-size:14px;
  font-weight:bold;
  font-variant:small-caps;
  float:right;
}
.musing_comment_name {
  font-size:14px;
  font-weight:bold;
  font-variant:small-caps;
  float:left;
}
.musing_comment .clearer.musing_comment {
  width:100%;
  background:#200C08;
  background:#BC8C54;
}

#footer_links {
  position:absolute;
  bottom:8px;
  left:250px;
  color:#BC8850;
  color:#FFFFEC;
}
#footer_links A, #footer_links A:hover {
  color:#FFFFEC;
}

INPUT, TEXTAREA {
  background:#FFFFEF;
  padding:2px 3px;

  /* whatever font-size of parent element is */
  font-size:1em;

  /* gotta duplicate all this junk from BODY */
  font-family:arial,helvetica,sans-serif;
  line-height:1.15em;
  color:#200C08;
}