/* Faithful reproduction of the WordPress "Twenty Ten" theme as used on
   omahapolicechaplains.com. Metrics measured from the live site. */

* { box-sizing: border-box; }

body {
  margin: 0;
  background: #3786eb;                 /* custom background color (measured) */
  color: #666;
  font: 16px/24px Georgia, "Bitstream Charter", serif;
}

#wrapper {
  background: #fff;
  margin: 0 auto;
  padding: 0 20px;
  width: 980px;                        /* 940 content + 2x20 padding */
  max-width: 100%;
}

a { color: #0066cc; }
a:hover { color: #0066cc; text-decoration: underline; }
img { max-width: 100%; height: auto; }

/* ---------- Header ---------- */
#header { padding: 30px 0 0; }
#branding::after { content: ""; display: table; clear: both; }

#site-title {
  float: left;
  width: 700px;
  margin: 0 0 18px;
  font: bold 30px/36px "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
}
#site-title a { color: #000; text-decoration: none; }
#site-title a:hover { color: #0066cc; }

#site-description {
  float: right;
  width: 220px;
  margin: 15px 0 18px;
  font: italic 12px/18px Georgia, "Bitstream Charter", serif;
  color: #666;
}

.header-image {
  display: block;
  clear: both;
  width: 940px;
  max-width: 100%;
  height: auto;
  border-top: 1px solid #000;
}

/* ---------- Navigation (#access) ---------- */
#access {
  clear: both;
  background: #000;
  font-size: 13px;
}
#access ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
}
#access li { margin: 0; }
#access a {
  display: block;
  color: #fff;
  padding: 0 10px;
  font: 13px/38px "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
  text-decoration: none;
}
#access a:hover { background: #1b1b1b; color: #fff; }
#access .current_page_item a { background: #1b1b1b; }

/* ---------- Main / columns ---------- */
#main { clear: both; padding: 40px 0 0; overflow: hidden; }
#container { float: left; margin: 0 -240px 0 0; width: 100%; }
#content {
  margin: 0 280px 36px 20px;
  color: #333;
}
.widget-area { float: right; width: 220px; }

/* ---------- Content typography ---------- */
.entry-content p { margin: 0 0 24px; }
.entry-title {
  margin: 0 0 18px;
  color: #000;
  font: bold 21px/27px "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
}
.entry-content h2 {
  margin: 24px 0 8px;
  color: #000;
  font: bold 18px/24px "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
}
.entry-content h3 {
  margin: 20px 0 8px;
  color: #000;
  font: bold 16px/22px "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
}
.entry-content ul,
.entry-content ol { margin: 0 0 24px 24px; padding: 0; }
.entry-content li { margin: 0 0 6px; }
.muted { color: #888; }

/* ---------- Member grid ---------- */
.members {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin: 0 0 24px;
}
.member { margin: 0; width: 150px; text-align: center; }
.member img { display: block; border: 1px solid #ddd; }
.member figcaption {
  margin-top: 6px;
  font: 13px/18px Georgia, "Bitstream Charter", serif;
  color: #333;
}

/* ---------- Minutes ---------- */
.minutes-entry { padding: 18px 0; border-top: 1px solid #e2e2e2; }
.minutes-entry:first-of-type { border-top: none; padding-top: 0; }

/* ---------- Sidebar widgets ---------- */
.widget { margin: 0 0 18px; }
.widget-area img { display: block; }
.widget-area .badge { margin: 0 auto 8px; max-width: 100px; }
.widget-area ul { list-style: none; margin: 0; padding: 0; }
.widget-area li { margin: 0 0 8px; }

/* ---------- Footer ---------- */
#colophon {
  clear: both;
  padding: 18px 0 24px;
  border-top: 1px solid #e2e2e2;
  color: #666;
  font: 12px/18px Georgia, "Bitstream Charter", serif;
}
#colophon p { margin: 0 0 4px; }
#colophon a { color: #0066cc; }

/* ---------- Responsive (keeps it usable on phones) ---------- */
@media (max-width: 980px) {
  #wrapper { width: 100%; }
  #site-title, #site-description { float: none; width: auto; }
  #site-description { margin: 0 0 12px; }
  .header-image { width: 100%; }
  #container { float: none; margin: 0; }
  #content { margin: 0 0 24px; }
  .widget-area { float: none; width: auto; border-top: 1px solid #e2e2e2; padding-top: 16px; }
}
