/*
	file name:	sd_menu.css
	author:	Eric McClafferty
	date:	12/14/2022
	Revised: 5/22/2025
*/
*		{margin: 0; padding: 0;}
body *	{font-family: Verdana, Geneva, sans-serif; font-size: 100%;
		font-weight: bold; line-height: 1.4em; vertical-align: baseline;}
body	{background-color: #f6f6f6;}
article, aside, figure, figcaption, footer, header, nav, section {display: block;}
#wrapper	{max-width: 960px; margin: 0 auto; background-color: #f0f0f0;}
h1, h2, h3, address  { color: #484848;}
nav		{height: 30px; width: 100%; background-color: #e0e0e0; padding-bottom: 6px;}
#gohome  {float: left; padding-left: 2%;}
#gohome:hover  {background-color: #f6f6f6;}
#site_name  {font-family: "Times New Roman", serif; color:#484848;
		    font-size: 1.3em; font-variant: small-caps; font-weight: bold;
		    letter-spacing: 2px; line-height: 1.7em; margin-left: 20%; display: none;}
.break	{display: inline;}
h1, h2 {clear: both; text-align: center}
h1 {font-size: 1.7em; padding: 0.3em 0 0.3em 0;}
#date {font-size: 0.7em;}
h2 {font-size: 1.35em; padding-bottom: 1em;}
h3 {clear: both; font-size: 1.15em;padding: 0 0 0.2em 1em;}
img	{width: 100%; outline: 1px solid #bbb;}
figure {float: left;}
figcaption {font-size: 0.9em; text-align: center;}
div {clear: both;}
#pane_01, #pane_02, #pane_03, #pane_04 {width: 100%;}
    #pane_01 > figure:nth-of-type(odd)  {float: left; width:41.5%; padding: 1% 4%;}
    #pane_01 > figure:nth-of-type(even) {float: right; width: 38.3%; padding: 1% 3% 1% 4%;}
    #pane_02 > figure:nth-of-type(odd)  {float: left; width: 36%; padding: 1% 1% 1% 2.5%;}
    #pane_02 > figure:nth-of-type(even) {float: right; width: 59.5%; padding: 1% 0;}
    #pane_03 > figure:nth-of-type(odd)  {float: left; width: 69.6%;padding: 1% 1% 1% 1.5%;}
    #pane_03 > figure:nth-of-type(even) {float: right; width: 22.6%;padding: 1% 1% 1% 3%;}
    #pane_04 > figure:nth-of-type(odd)  {float: left; width: 39.4%; padding: 1% 6%;}
    #pane_04 > figure:nth-of-type(even) {float: right; width: 31.6%; padding: 1% 6%;}
address {clear: both; text-align: center; font-size: 0.8em; padding: 0.7em 0 1em 0;}
@media screen and (min-width: 481px) and (max-width: 667px)
  {
    #pane_01, #pane_02, #pane_03, #pane_04, footer, header, nav {width: 480px; margin: 0 auto;}
  }
@media screen and (min-width: 668px)
  {
    #wrapper  {outline: 1px solid #bbb ;}
    #site_name {display: inline;}
    .break {display: none;}
     header	{width: 98%; padding: 0 1%; float: left;}
#pane_01, #pane_02, #pane_03, #pane_04 {display: inline-block;}
#pane_01, #pane_04 {width: 49%;}
#pane_02, #pane_03 {width: 49%;}
  }

