html	{width: 100%;margin: 0;padding: 0;}
body	{font-family: times; width: 100%;margin: 0;padding: 0; background-color:#FEFFF4; color:#204000;font-size: 18px;line-height: 22px;box-sizing: border-box;}

a 	{color: #0028ff;text-decoration: none;}
a:hover	{text-decoration:underline;color: #5f04e3;}

#header	{background-color:rgb(135, 39, 34); height: 200px;overflow: hidden;position: relative;border-top: 4px solid black;border-bottom: 1px solid black;}

#footer	{background-color:rgb(135, 39, 34); position: relative;    bottom: 0;    width: 100%;}

#footerLeft	{float:left;width:50%;height:100px;}
#footerRight	{float:left;width:50%;text-align:right;height:100px;padding: 20px 0 0 0;box-sizing: border-box;}

#footerRight a	{color:#F1D366;}

#wethepeople	{opacity:.9;}
#whenwhere	{color:#F1D366;position: absolute;top: 130px;left: 450px;}
#zquote		{position: absolute; color: blanchedalmond;
    top: 120px;
    left: 400px;
    display: inline-block;}

#topText	{margin:12px 16px;font-size:1.2em;font-weight:bold;}
#introText	{margin:12px 16px 20px 16px;}

.displayAdv	{display: inline-block;min-width:100px;min-height: 300px;float: right;margin: 0px 10px 0 0;}

.sidebarAd {float:right;width:260px;text-align: center;margin-right: 12px;}

#logo1	{position: absolute;    top: 30px;    left: 390px;    font-size: 4em;color: rgb(252, 230, 112);}

#logo2	{position: absolute;    top: 88px;    left: 420px;    font-size: 2.2em;color: rgb(252, 230, 112);}

#intro		{margin:0 0 0 10px;}
#pickem		{margin:8px 0 12px 10px;}
#pickState	{margin:0 10px 0 10px;}
.stateMap	{max-width:100%;}

#map-container	{max-width:1000px;margin: 0 12px;}

#selectState	{margin:0 0 0 10px;}	
#usaStates	{margin:0 10px 0 10px;}
#usaMap		{max-width:100%;margin: 0 0 10px 0;}	

.nationalArchivesLink	{}
.nationalArchivesLink a	{color:black;text-decoration:none;}
.nationalArchivesLink img {width:16px;}


.anattrib	{margin:0 0 6px 0;}

.attrib	{width: unset;
    text-align: left;
    display: block;margin: 0 0 0 10px;font-weight:bold;}

.attribT	{
    text-align: left;
    display: block;margin: 0 0 0 30px;}

.listing	{box-sizing: border-box;width:calc(100% - 300px); margin:10px 10px 20px 10px;background-color: #e3e9eab3;border:1px solid #a27777; overflow:hidden;box-shadow: 0px 1px 6px 0px #1c1a1a;}
.listing	{display:flex;}

.listheader	{box-sizing: border-box;padding:10px;background-color: #cab795e6;width:50%;float:left;}
.listattrib	{box-sizing: border-box;padding:10px 0 10px 0;width:50%;float:left;line-height:20px;font-size: 16px;}

.photoBox	{float:right;width: 100%;max-width: 600px;background-color: white;padding: 4px;box-sizing: border-box;margin-top: 10px;}
.photoBoxImage	{object-fit: cover;width: 100%;}
.photoCredit	{font-size: .72em;line-height: 1em;padding: 2px 0 0 0;width: 100%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;opacity:.6;}
.photoCredit a	{color:unset;}
.photoCredit:hover {overflow: visible; white-space: normal; height:auto; }
.comingSoon	{max-width:400px;}
.noPhoto	{opacity:.3;}

#selectCounty	{padding:10px;}
#selectState	{padding:10px;}

.county		{display:inline-block;margin:0 16px 0 0 ;font-size:.96em;}
.state		{display:inline-block;margin:0 16px 0 0 ;font-size:.96em;}

.return2top	{padding:10px;}

.return2home	{padding:10px;}

.bar		{margin:0 10px 0 10px;max-width:90%;}

#topmenuleft	{margin:0 0 0 8px;}

.topmenu	{box-shadow:2px 2px 4px #000000a1;margin: 0 2px 0px 2px; display: inline-block;line-height: 28px;color:#ffe037; background-color: #3c270082; padding: 0px 8px;border-radius: 0 0 10px 10px;border: 0px solid black;  border-top-width: 2px;border-top-width: 0; font-size:22px;}

.menuoff	{background-color: #beb899;color: #7b6445;}

.menuon:hover	{background-color: #8a853582;color: #fbff73;}

@media (max-width: 320px) {


.listing	{width:unset;}

#footerLeft	{float:unset;width:unset;}
#footerRight	{float:unset;width:unset;}

}

@media (max-width: 824px) {
.anattrib	{margin:0 0 6px 0;}
.attrib	{width: unset;
    text-align: left;
    display: block;margin: 0 0 0 10px;font-weight:bold;}
.attribT	{
    text-align: left;
    display: block;margin: 0 0 0 30px;}
.listheader	{width:100%;}
.listing	{display:block;}
}

@media (max-width: 1024px) {
#wethepeople {    opacity: .9;    position: relative;    left: -120px;}
#logo1 {    top: 30px;    left: 350px;    font-size: 3em;}
#logo2 {    top: 88px;    left: 400px;    font-size: 2em;}
#zquote {    top: 120px;    left: 350px;}
#whenwhere	{top: 130px;left: 450px;}
}

@media (max-width: 824px) {

#wethepeople {    opacity: .9;    position: relative;    left: -160px;}
#logo1 {    top: 20px;    left: 240px;    font-size: 2.5em;}
#logo2 {    top: 70px;    left: 300px;    font-size: 1.8em;}
#zquote {    top: 100px;    left: 250px;    line-height: 18px}
#whenwhere	{top: 130px;left: 300px;}
.topmenu	{font-size:18px;}
}

@media (max-width: 640px) {
body	{font-size: 22px;line-height: 36px;box-sizing: border-box;}
.county		{margin:0 26px 0 0 ;font-size:1em;}
.state		{margin:0 26px 0 0 ;font-size:1em;}
#logo1 {    top: 30px;    left: 20px;    font-size: 2em;}
#logo2 {    top: 60px;    left: 60px;    font-size: 1.6em;}
#logo1 {    top: 20px;    left: 10px;    font-size: 2.5em;}
#logo2 {    top: 70px;    left: 30px;    font-size: 1.8em;}
#zquote {position: absolute;    color: blanchedalmond;    top: 110px;    left: 30px;    display: inline-block;}
#whenwhere	{color:#F1D366;position: absolute;top: 120px;left: 40px;}
.topmenu	{font-size:16px;line-height: 48px;}
#topText	{margin:12px 16px;font-size:.96em;font-weight:bold;}
#wethepeople	{display:none;}
}
@media (max-width: 420px) {
#logo1 {    top: 30px;    left: 20px;    font-size: 2em;}
#logo2 {    top: 60px;    left: 60px;    font-size: 1.6em;}
#logo1 {    top: 20px;    left: 10px;    font-size: 2em;}
#logo2 {    top: 70px;    left: 30px;    font-size: 1.6em;}
#zquote {position: absolute;    color: blanchedalmond;    top: 110px;    left: 30px;    display: inline-block;}
#whenwhere	{color:#F1D366;position: absolute;top: 120px;left: 40px;}

}

@media (max-width: 420px) {
.topmenu	{font-size:22px;width:100%;margin:0;border-radius:0;box-sizing: border-box;box-shadow: unset;}
#topmenuleft	{margin:0;}

}


@media (max-width: 640px) {
.listing	{width:unset;}
}

@media (max-width: 824px) {
.anattrib	{margin:0 0 6px 0;}
.attrib	{width: unset;    text-align: left;    display: block;margin: 0 0 0 10px;font-weight:bold;}
.attribT	{    text-align: left;    display: block;margin: 0 0 0 30px;}
.listingheader	{width:100%;}
}

@media (max-width: 1024px) {
.listing	{width:unset;}
#footerLeft	{float:unset;width:unset;}
#footerRight	{float:unset;width:unset;}
#footerRight	{padding:0 0 0 0;box-sizing: border-box;}
}