/* 1) Set your site-wide serif stack ONCE */
:root { --font-serif: Georgia, Cambria, "Times New Roman", Times, serif; }

table, td, th {
  font: inherit;            /* makes font-family, size, line-height inherit */
}

body {
  font-family: var(--font-serif);
  font-size: 18px;         /* keep your legacy size; consider 16px/1rem later */
  line-height: 1.5;        /* improves readability 1.5 */
}

/* 2) Headings that had an extra font-family: let them inherit */
h2.home { color: black; }

/* 3) Lists (unchanged, but simplified margins) */
ul.normalbullet, ol.normalbullet {
  list-style-image: url(images/bullet_black.gif);
}
ul.checkbox, ol.checkbox {
  list-style-image: url(/images/checkbox10.gif);
  margin: 0;
  padding-left: 1em;
}

/* 4) Links: font-family inherits; just set color/decoration */
a { text-decoration: none; color: #0000B2; }
a:visited { color: #803762; }
a:hover { color: #0000B2; text-decoration: underline; }

/* 5) Table/header variants: only what actually differs */
td.head { font-size: 16px; }

/* 6) Bold styles — fixed a typo and removed redundant font-family */
b.home {
  color: #000000;
  font-size: 130%;
  font-weight: bold;
}
b.boldred {
  color: #6e3730;
  font-weight: bold;
  font-size: 130%;
}

.content-table {
  width: 100%;       /* fill the viewport width */
  max-width: 800px;  /* but never grow beyond 800px */
  margin: 0 auto;    /* center on larger screens */
}

.content-wrapper {
  max-width: 800px;
  margin: 0 auto;     /* centers on desktop */
  padding: 0 12px;    /* optional: small side padding on all devices */
}

/* Sets Default to Desktop for very old browsers */

.desktop { display: block; }
.mobile  { display: none; }

/* === MEDIA QUERY DESKTOP / MOBILE === */
@media screen and (min-width: 801px) {
  .mobile { display: none !important; }
  .desktop { display: block !important; }
}

@media screen and (max-width: 800px) {
  .mobile { display: block !important; }
  .desktop { display: none !important; }
}