/* CSS Document */

html, body {
	margin:0;
	padding:0;
	border:0;
	background-color:#DEF;
	font-size:12px;
}

body {
	padding-bottom:60px;
}


div, article, aside, dialog, figure, footer, header, hgroup, nav, section, span, h1, h2, h3, h4, h5, h6, p, blockquote, a, image, strike, strong, pre, em, font, img, small, strong, sub, ul, ol, li, table, caption, tbody, tfoot, thead, dl, dt, dd, fieldset, form, label, legend, tr, th, td, input, select, textarea
{
	margin:0; padding:0; border:0; outline:0;
	vertical-align: baseline;
	background: transparent;
}

sup { font-size: x-small; }

article, aside, dialog, figure, footer, header, hgroup, nav, section {
	display:block;
}

h1, h2, h3, h4, h5, h6, p, blockquote, td, th, a, caption, b, u, strike {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 100%;
	font-weight: normal;
	font-style: normal;
	line-height: 1;
	text-indent: 0;
	text-decoration: none;
	text-align: left;
	color: #000; 
}

li {font-family:Arial, Helvetica, sans-serif; 
	font-size: 100%;
	font-weight: normal;
	font-style: normal;
	line-height: 1;
	text-indent: 0;
	text-decoration: none;
	text-align: left;
	color: #000; 
}

a:link      {color: #000; }
a:visited      {color: #000; }
a:active     {color: #000; }
a:focus      {color: #000; } 
a:hover     {color:#C00; } 

strong { font-weight: bold; }
em, i  { font-style: italic; }

ul, ol
{
	font-style: none; list-style: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
	margin-left: auto;
	margin-right: auto;
}

table[align="center"] { margin-left: auto; margin-right: auto; }
table[align="left"]   { margin-left: 0; margin-right: auto; }
table[align="right"]  { margin-left: auto; margin-right: 0; }

img, fieldset
{
	border:0;
}

.footer-text   {font-size:12px; font-style:normal; color:#000; text-align:center; }

#outer		{width:auto; background-color:#DEF; }
#outer::after	{content:''; display:table; clear:both; }

#pagetitle	{clear:both; }
#pagetitle	{margin: 0px auto; background-color:#DEF; text-align: center; } 

#sidenav	{clear:both; }
#sidenav	{float: left; display: inline-block; position: relative; margin-top: 20px;}
#sidenav ul	{padding: 10px;  }
#sidenav ul li	{display: list-item; }
#sidenav ul li	{font-family:Arial, Helvetica, sans-serif; font-size:18px; color:#000; }
#sidenav ul li a span {display: inline-block; border: 1px solid blue; border-radius: 4px; line-height: 26px; padding: 5px 9px; background-color: aliceblue; margin-bottom: 7px;}
#sidenav hover	{color: #000; }

#facebook_link	{margin: 14px 8px 0; padding-top: 12px; border-top: 1px solid #b0b8c4; text-align: center; }
#facebook_link a	{display: block; text-decoration: none; }
#facebook_link img	{display: block; width: 100%; height: auto; border-radius: 4px;
			 opacity: 0.88; -webkit-transition: opacity .15s; transition: opacity .15s; }
#facebook_link a:hover img	{opacity: 1; }
#facebook_link span	{display: block; font-family: Arial, Helvetica, sans-serif; font-size: 12px;
			 color: #1877f2; font-weight: bold; margin-top: 5px; text-align: center; }

#visitor_counter	{clear:both; }
#visitor_counter	{float:right; margin-right: 20px;  }

#curpic		{margin-left: 425px; }
#slideshow	{margin-left: 475px;  }

#indexnarr	{clear:both; }
#indexnarr	{margin-top: -200px; margin-bottom:10px; margin-left: 150px; margin-right: 125px; }
#indexnarr	{font-family:Arial, Helvetica, sans-serif; font-size:24px; }

#indexnarr3	{clear:both; }
#indexnarr3	{margin-top: 40px; margin-bottom:10px; margin-left: 150px; margin-right: 125px; }
#indexnarr3	{font-family:Arial, Helvetica, sans-serif; font-size:24px; }

#indexnarr1	{clear:both; }
#indexnarr1	{margin-top: 0px; margin-bottom:10px; margin-left: 150px; margin-right: 125px; }
#indexnarr1	{font-family:Arial, Helvetica, sans-serif; font-size:18px; }

#pagenarr	{clear:both; }
#pagenarr	{margin:10px; }
#pagenarr	{font-family:Arial, Helvetica, sans-serif; font-size:24px; }

#pics		{clear:both; }
#pics		{margin-left:200px;}
#pics ul	{border-top: solid; border-bottom: solid; border-color: #000; padding:20px 10px;  }
#pics ul li	{display:inline; padding:40px 20px; }		

#backhome	{clear:both; }
#backhome	{margin:20px 500px; font-size:18px; }

.page_title	{ text-align:center; margin: 30px 300px;  }

#subpagetitle	{ clear:both; display: block; }
#subpagetitle	{ text-align:center; font-family:Arial, Helvetica, sans-serif; font-size:36px; font-style:italic; font-weight:bold; }

#previous_pics	{margin-top: 20px; margin-left:270px; margin-right:10px;  }
#previous_pics ul	{padding: 10px 15px;  }
#previous_pics ul li	{display: inline; text-align:right; padding: 10px 15px; }
#previous_pics ul li	 {font-family:Arial, Helvetica, sans-serif; font-size:18px; color:#000; }

#main_page_pic	{margin:10px 330px; }

#gallery	{clear:both; }
#gallery	{float: left; }
#gallery	{margin-top: 20px; margin-left:200px; }
#gallery ul	{padding: 10px 10px;  }
#gallery ul li	{display: inline; padding: 10px 10px; }

.officer_names	{text-align:center; margin: 20px 300px; }
.officer_block        { display: inline-block; text-align: left; }
.officer_row          { margin-bottom: 10px; }
.officer_title        { display: inline-block; min-width: 220px; vertical-align: top; }
.officer_dash         { display: inline-block; width: 80px; overflow: hidden; vertical-align: top; }
.officer_dash::after  { content: "- - - - - - - - - - - - - - - - - - - - - - - - - - - - "; white-space: nowrap; }
.officer_name         { display: inline-block; vertical-align: top; padding-left: 48px; max-width: 380px; }
.officer_section_head { text-align: center; padding: 18px 0 18px; }

#titlepic_narr	{font-family:Arial, Helvetica, sans-serif; font-size:18px; margin-left: 370px;}

#titlepic_narr_ctr	{clear:both; }
#titlepic_narr_ctr	{text-align:center; }
#titlepic_narr_ctr	{font-family:Arial, Helvetica, sans-serif; font-size:18px; }

#text-instruction	{clear:both; }
#text-instruction	{float:left; margin-left:80px; font-size:14px; margin-bottom:10px; }

#husband_title	{clear:both; }
#husband_title	{float: left; margin:10px 0px; margin-left:40px; }
#husband_title	ul	li	{font-size:16px; }
.husband_title	{ font-family:"MS Serif", "New York", serif; font-size: 24px; font-style:italic; }

#children_list	{clear:both; }
#children_list	{float: left; margin:10px 0px; margin-left:40px; }
#children_list	ul	li	{font-size:16px; }
.children_list	{ font-family:"MS Serif", "New York", serif; font-size: 24px; font-style:italic; }

#name_list	{clear:both; }
#name_list	{float: left; margin:10px 0px; margin-left:40px; }
#name_list	ul	li	{font-size:16px; }

.name_list	{ font-family:"MS Serif", "New York", serif; font-size: 24px; font-style:italic; }

#name_index  {clear:both; }
#name_index  {
	margin-top:40px; margin-left:20px; margin-right:20px;
	column-count:3; column-gap:24px;
}
#name_index.cols-4  { column-count:4; }
#name_index  {font-family:Arial, Helvetica, sans-serif; font-size:16px;}
#name_index a, #name_index span { display:block; line-height:1.8; }
#name_index a.has-photo::after  { content:" [pic]"; color:#069; font-size:12px; font-style:italic; }


#index_list  {clear:both; }
#index_list  {
	margin-top:40px; margin-left:40px; margin-right:40px; 

}
#index_list  {font-family:Arial, Helvetica, sans-serif; font-size:16px;}

#helpline	{clear:both; }
#helpline	{
	font-family:"Times New Roman", Times, serif; font-style:italic; font-size:18px; text-align:center;  
}


#working_msg	{clear:both; }
#working_msg	{float:left; margin:20px 300px; font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif; font-size:48px; font-weight:bold; }

#footer		{position:fixed; bottom:0; left:0; right:0; background-color:#DEF; border-top:1px #000 solid; padding:8px 0; text-align:center; z-index:100; }

.footer-text	{margin-top:20px; }

/* ── Global: images never overflow their container ───── */
img { max-width: 100%; height: auto; }

/* ── Mobile layout (phones and small tablets) ────────── */
@media (max-width: 768px) {

  html, body { overflow-x: hidden; }

  /* Home page title — override inline font sizes */
  #pagetitle { height: auto !important; padding: 20px 10px !important; }
  #pagetitle > a > div:first-child  { font-size: 8vw  !important; line-height: 1.2 !important; }
  #pagetitle > a > div:nth-child(2) { font-size: 5.5vw !important; margin-top: 10px !important; }

  /* Sidenav: float off, become horizontal wrapping pills */
  #sidenav              { float: none !important; width: 100% !important; margin-top: 0 !important; }
  #sidenav ul           { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px; }
  #sidenav ul li        { display: inline-block; }
  #sidenav ul li br     { display: none; }
  #sidenav ul li a span { font-size: 14px !important; line-height: 22px !important;
                          padding: 4px 10px !important; margin-bottom: 0 !important; }
  #facebook_link        { display: none; }

  /* Collapse all hardcoded left/right margins */
  #indexnarr, #indexnarr1, #indexnarr2, #indexnarr3 {
    margin-left: 10px !important; margin-right: 10px !important; font-size: 18px !important; }
  #pagenarr             { margin: 10px !important; font-size: 18px !important; }
  #pics, #gallery       { margin-left: 10px !important; margin-right: 10px !important; }
  #curpic, #slideshow   { margin-left: 10px !important; }
  #main_page_pic        { margin: 10px auto !important; text-align: center; }
  #backhome             { margin: 20px 10px !important; }
  .page_title           { margin: 20px 10px !important; }
  .officer_names        { margin: 10px !important; }
  #titlepic_narr        { margin-left: 10px !important; }
  #text-instruction     { margin-left: 10px !important; float: none !important; }
  #husband_title, #children_list, #name_list { margin-left: 10px !important; }

  /* Name index: 2 columns on phone instead of 3-4 */
  #name_index           { column-count: 2 !important; margin: 20px 10px !important; }
  #name_index.cols-4    { column-count: 2 !important; }

  /* Visitor counter */
  #visitor_counter      { float: none !important; clear: both; text-align: center;
                          margin: 10px auto !important; }

  /* Subpage title */
  #subpagetitle         { font-size: 24px !important; }

  /* Working message */
  #working_msg          { float: none !important; margin: 20px 10px !important;
                          font-size: 28px !important; }

  /* Gallery thumbnails: wrap tighter */
  #gallery ul li, #pics ul li { display: inline-block !important; padding: 6px !important; }

  /* Officer layout */
  .officer_title        { min-width: 140px !important; }
  .officer_name         { padding-left: 10px !important; }

  /* Tables: allow horizontal scroll on narrow screens */
  .officer_names        { overflow-x: auto; display: block; }
}