@charset "UTF-8";
/* styling for advertising pags are at the bottom  */
:root {
  --maxBodyWidth: 1400px;
  --bodyBackgroundColor: rgb(246, 229, 198);
  --siteNameColor: blue;
}

/* reset styles */
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  background-color: #fff;
  scroll-padding-top: 60px;
}

body {
  background-color: var(--bodyBackgroundColor);
  width: 95%;
  max-width: var(--maxBodyWidth);
  margin: 0 auto;
  margin-block: 2em;
  padding-bottom: 1em;
  border-radius: 15px;

  /* turning off scrool-snap to try to stop the obnoxious scrollung */
  scroll-snap-type: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  text-align: center;
}

h2 {
  font-size: 2.5rem;
}

h3 {
  font-size: 2rem;
}

.headerContainer1 {
  display: none;
}

img {
  display: block;
  margin: 0 auto;
  width: 100%;
}

.fullMenu {
  position: sticky;
  top: 0;
  /* width: auto; */
}

/* took out this margin-top july 30, 2021 */
.content {
  width: 95%;
  margin-inline: auto;
  /* border: solid 2px darkblue; */
  /* margin-top: 7rem; */
}

#showMenu {
  display: block;
}

#hamburger:hover {
  color: white;
}

p {
  font-family: 'Helvetica', 'Arial', sans-serif;
  margin-top: 0.5em;
  font-weight: normal;
  font-size: 1.1em;
  text-indent: 2rem;
  line-height: 1.3;
}

.uppercase {
  text-transform: uppercase;
}

.centered {
  text-align: center;
  text-indent: 0;
}

.centered-photo,
.centeredPhoto {
  display: block;
  margin: 0 auto;
}

.bold {
  font-weight: 550;
}

.photoCredit {
  font-family: sans-serif;
  text-align: right;
  font-size: 0.75rem;
  padding-right: 0.5rem;
}

.centered-text,
.centeredText {
  text-align: center;
}

.textRight {
  text-align: right;
}

.content .ruleBelow::after,
.content .image_detail_under::after,
.content .advert .advert_detail::after {
  display: block;
  margin: 2rem auto;
  height: 3px;
  content: ' ';
  text-shadow: none;
  background-color: rgb(0, 10, 10);
  width: 75%;
}

/* this is to maintain width of the ruleBelow on small screens */
@media (max-width: 700px) {
  .content .ruleBelow::after,
  .content .image_detail_under::after,
  .content .advert .advert_detail::after {
    max-width: 50%;
  }
}

.width15Rem {
  width: 15rem;
}

.width25Percent {
  width: 25%;
}

.width50Percent {
  width: 50%;
}

.width75Percent {
  width: 75%;
}

.width100Percent {
  width: 100%;
}

.allMarg1 {
  margin: 1em;
}

.margTop1,
.tmarg1 {
  margin-top: 1em;
}

.margTop2,
.tmarg2 {
  margin-top: 2em;
}

.bmarg1 {
  margin-bottom: 1em;
}

.bmarg2 {
  margin-bottom: 2rem;
}

.rem1 {
  font-size: 1rem;
}

.rem1pt5 {
  font-size: 1.5rem;
}

.rem2 {
  font-size: 2rem;
}

.paddingQtrEm {
  padding: 0.25em;
}

.paddingHalfEm {
  padding: 0.5em;
}
.paddingOneEm {
  padding: 1em;
}

.imageBorder {
  border: solid 2px black;
}

.outlined {
  outline: solid 2px black;
}

.noUnderline {
  text-decoration: none;
}

.noIndent {
  text-indent: 0;
}

.relative {
  position: relative;
}

.subhed {
  font-weight: bold;
  text-align: center;
}

/* div.image is for photographs and other graphics displayed without the enlargement stuff */
.image {
  /* width: 90%; */
  margin: auto;
}

.image img {
  /* width: 100%; */
  border: solid 1px black;
}

.image p {
  margin-bottom: 2rem;
}

.headerContainer {
  /* background-color: rgba(50, 181, 246, 0.5); */
  background-color: wheat;
}

.floatLeft {
  float: left;
  margin: 1em;
}

.floatRight {
  float: right;
  margin: 1em;
}

.floatRight25Percent {
  width: 25%;
  float: right;
  margin: 1em;
}

.floatLeft25Percent {
  width: 25%;
  float: left;
  margin: 1em;
}

#content p .content p {
  margin-left: 0em;
  margin-right: 0em;
  color: rgb(247, 17, 17);
}

/* .header .siteName {
  font-size: 3rem;
  margin-top: 0%;
  padding-top: 1%;
  text-align: center;
  color: blue;
} */
.siteName {
  font-size: 2em;
  margin-top: 0%;
  padding-top: 1%;
  text-align: center;
  color: var(--siteNameColor);
}

/* #headerPhoto {
  max-width: 90%;
  max-height: 50vh;   
  border: black 2px solid;
  margin: 0 auto;
  display: block;
} */
.headerPhoto {
  width: 90%;
  height: auto;
  border: 2px solid black;
  margin-top: 1em;
}

.headerImage {
  max-width: 100%;
  margin: 1rem auto 2rem auto;
}

.homePageObitImage {
  width: 40%;
  float: left;
  margin-right: 1em;
  margin-top: 1em;
  margin-bottom: 0.5em;
  border: solid 1px black;
}

.homePageMoreLink {
  text-decoration: none;
}

/* I think .sponsor is just used on the home page to limit width  */
.sponsor {
  width: 75%;
}

@media (max-width: 700px) {
  #headerPhoto {
    width: 100%;
  }
}
#homeObit {
  background-color: #eee;
}

.footer .statcounter {
  max-width: 100px;
}

.stats,
.statcounter {
  width: 100px;
  display: block;
  margin: 1rem auto;
}

/* Now on to Individual sections */
/* **************** Obituary Pages OBITS ********************* */

/* Formatting for Index to Obits (PomeroyObitsIndex.htm)     */
.obitIndexWrapper {
  margin-top: 2rem;
  columns: 2;
  text-align: left;
}

.obitIndexWrapper p {
  font-size: 1.25rem;
  column-gap: 3rem;
  text-indent: 0;
}

/* .cap is the CAPital preceding each letter of last name in listing */
.cap {
  background-color: green;
  color: white;
  margin-inline: auto;
  margin-top: 0;
  text-align: center;
  max-width: 50%;
}

/* this is to put a top margin on all letters starting with B */
.cap:not(:first-child) {
  margin-top: 2rem;
}

@media (max-width: 900px) {
  .obitIndexWrapper {
    padding-left: 0;
    columns: 1;
  }
  .obitIndexWrapper p {
    font-size: 1rem;
    text-indent: 0;
  }
}
/* individual obituary layout:
    .obit id="linkname"
      hr full name 
      .obits-grid-image-left | right
        img.obitImage
        .obitStory
      */

/* Now each individual .obit wraps around each individual obituary */

/* Note: I have a 'lower' definition for .obit on 2024Obits and later to change to Display: Grid   */
/* and overwrite this style directly below.  */
/* having a display: grid will need to have obituary words wrapped in a div. */
.obit {
  margin-bottom: 1rem;
  border-bottom: black 0.2rem solid;
  padding-bottom: 1rem;
}

.obitPerson {
  grid-column: span 2;
}

.obitPix {
  grid-column: 1 / 1;
}

.obitText {
  grid-column: 2 /2;
}

.obitTextNoPic {
  /* note that the padding-inline is defined in .obit at the top of the individial obits page */
  grid-column: span 2;
}

.obitSocials {
  grid-column: 2 / 2;
}

/* .obits-grid-image-right {
  display: grid;
  grid-template-areas: 
  "story  story story image";
}
*/

/*.obits-grid-image-left {
  display: grid;
  grid-template-areas: 
   "image story";
}
*/

.obit-grid-no-image {
  display: grid;
  grid-template-columns: 10rem 1fr 10rem;
  grid-template-areas: ' . image image .';
  /* outline: solid 2px darkorange; */
  /* max-width: 34ch; */
}

@media (max-width: 700px) {
  .obits-grid-image-left,
  .obits-grid-image-right {
    grid-template-areas:
      'image'
      'story';
    grid-template-rows: auto;
  }
}

.obitStory {
  grid-area: story;
}

.obitImage {
  grid-area: image;
  max-height: 350px;
  width: auto;
}

/* .obitGrid {
  display: grid;
  grid-template-columns: 3fr 1fr;
  grid-template-rows: auto;
} */

.emptyPage {
  max-width: 40rem;
  height: 35vh;
  margin: auto;
  outline: solid 2px black;
  background-color: hsl(100deg, 50%, 75%);
  display: grid;
  place-items: center;
}

/* I use a larger text size for the obit because they are old people reading?   */
.obits h3,
.obit h3 {
  margin-top: 2rem;
  margin-bottom: 0.2rem;
  font-size: 2.5rem;
  font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}

.obits p {
  text-indent: 4rem;
  line-height: 1.5;
  font-size: 1.25rem;
}

.obit p {
  max-width: 75ch;
  margin-inline: auto;
  font-size: 1.25rem;
  line-height: 1.5;
}

/* this will flip the r/l orientation of a photo */
.flipIt {
  transform: scaleX(-1);
}

.container {
  max-width: 90%;
  margin: 2rem auto 4rem auto;
}

/*   Smaller screens text formatting */
@media (max-width: 900px) {
  .obit p {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    text-indent: 2rem;
    font-size: 1.2rem;
  }
}
/* This is how to get an obit here */
.obits .obit-instructions-hed {
  /* margin-top: 2em; */
  font-size: 2rem;
  font-family: sans-serif;
}

.obits .obit-instructions-text {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1rem;
  text-indent: 0px;
  /* text-align: justify;
  width: 95%;  */
  /* padding-right: 5rem; 
  margin-left: 5rem; 
  padding: 3rem; */
  margin-top: 0%;
  margin-bottom: 2rem;
  line-height: 1.5;
}

.obitLinksWrapper {
  display: flex;
  flex-direction: column;
  width: 66%;
  padding: 2em;
  margin: 0 auto;
  background: darkcyan;
  margin-top: 2rem;
}

.obitLinksHeader {
  font-size: 2rem;
  margin: 0;
  text-indent: 0;
  text-align: center;
  color: #fff;
}

.obitLinks {
  display: flex;
  width: 90%;
  margin: 0 auto;
  /* padding: 1em; */
  justify-content: space-between;
}

@media (max-width: 600px) {
  .obitLinks {
    flex-direction: column;
    text-align: center;
  }
}
.obitLink {
  list-style: none;
}

.obitLink,
.obitLink a {
  font-size: 1.25rem;
  color: white;
  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande',
    'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}

/*  styling for getting listed section of Obituaries     */
.btn-showInstructions {
  display: block;
  margin: 2rem auto;
  font-size: 1.2rem;
  padding: 0.5rem 1rem;
  background: paleturquoise;
  border-radius: 0.5rem;
}

.getListed-modal {
  position: fixed;
  z-index: 10;
  top: 2em;
  bottom: 2em;
  left: 2em;
  right: 2em;
  max-width: var(--maxBodyWidth);
  background: white;
  /* box-shadow: 0 0 0 5em rgba(black, .5);    doesn't seem to be working */
  border: solid 10px black;
  overflow-y: scroll;
  cursor: arrow;
  padding: 0 2rem;
  display: block;
}

.hideModal {
  display: none;
}

/* .showModal {
  display: block;
} */
.portfolio-modal .is-open {
  display: block;
}

.modal-close {
  /* background: transparent; */
  /* position: absolute; */
  position: fixed;
  top: 2em;
  left: 2em;
  border: 0;
  width: 2em;
  height: 2em;
  background: paleturquoise;
  font-size: 2rem;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}

/*  end of styling for getListed section of Obituaries     */
.cutline,
.newsStory .cutline,
.photo .cutline,
.blockquote,
.cutline,
.news .newsquote .cutline {
  text-align: center;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.75em;
  line-height: 1;
  padding: 0.5rem;
  text-indent: 0;
}

.blockquote .photoCredit {
  font-family: sans-serif;
  text-align: right;
  font-size: 0.75rem;
  padding-right: 0.5rem;
}

.creditTo {
  text-align: center;

  font-size: 0.75rem;
  font-weight: 600;
}

.headerContainer {
  display: none;
}

#weatherAndTraffic {
  width: 90%;
  margin: 10px auto;
}

/* ****************  DOWNTOWN *************** */
/***************************************** */
/**** for Historic District Building Pages  **/
/* AS OF jULY 4, 2010, the section from .bldgInvHeader through the last bit of */
/*                     copy is .content .natlDistrict                          */
.bldgInvHeader {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 2rem;
  margin-top: 1rem;
  margin-bottom: 2rem;
  text-align: center;
  letter-spacing: 3px;
  font-weight: 500;
  /* text-transform:uppercase; */
}

.address {
  text-align: center;
  font-size: 1.5rem;
  margin-top: 0.5rem;
  margin-bottom: 0.25rem;
}

.classification {
  text-align: center;
  font-size: 1.5rem;
  margin-bottom: 1.25rem;
}

.changeInBusiness {
  text-align: center;
  font-size: 2rem;
  margin: 1em;
}

.background {
  max-width: 100ch;
  margin: auto;
}

.background p {
  line-height: 1.5;
  /* letter-spacing: 1; */
  /* font-size: 1.25rem; */
}

.caption {
  text-align: center;
  font-style: italic;
  font-size: 0.9rem;
}

/* note is the part Sally Donovan started */
.note {
  margin-bottom: 2rem;
  font-size: 1rem;
  text-align: right;
}

@media (max-width: 800px) {
  .note {
    font-size: 0.75rem;
  }
}

.backToGuide {
  display: block;
  text-align: center;
  padding: 0.5rem 1.5rem;
  margin: 1rem auto 1rem auto;
  background-color: hsl(39, 77%, 83%);
  border-radius: 5px;
  position: sticky;
  bottom: 1rem;

  font-size: 1rem;
  /* right: 10rem; */
}

/*  footnotes are div at end of text on inventory pages  */
.footnotes {
  max-width: 75%;
  margin-inline: auto;
}

.bldgName {
  font-family: sans-serif;
  font-size: 2rem;
  margin-top: 1rem;
}

.twoImageHolder {
  display: flex;
  flex-direction: row;
  max-width: 90%;
}

/* this is the section holding h3 and links */
/*  section.quickLinks */
/*    <h3>Quick Links</h3> */
/*      div.links */
/*       <p><a href="#farmers">Farmers Natl Bank</a></p> */
/*    then end both the div and the section */

/* .links is the wrapper around the various links to businesses on the page */

.quickLinks {
  margin-bottom: 2rem;
  background-color: aliceblue;
  border-radius: 5px;
}
.links {
  margin: 0rem auto;
  max-width: 1000px;
  /* height: 12rem; */
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  grid-gap: 1rem;
  padding: 1rem;
}

.links p {
  text-indent: 0;
  line-height: 1.5;
  font-size: 1rem;
}

.links a {
  background-color: rgb(131, 141, 168);
  color: white;
  padding: 0.5em 1em;
  text-indent: 0;
  text-decoration: none;
  border-radius: 13px;
  overflow: hidden;
}

@media (max-width: 700px) {
  .links {
    width: 100%;
  }
}

/* this '.image p' is to elimate the first line indent on paragraphs used as cutlines. */
.image p {
  text-indent: 0;
}

.content {
  padding: 0rem 2rem;
}

.newBusiness {
  padding: 0.5em;
  margin-block: 1em;
  border: solid 4px #000;
  border-radius: 0.25em;
  background-color: #ddd;
}

@media (max-width: 800px) {
  .newBusiness {
    border: solid 1px #000;
  }

  .newBusiness h2 {
    font-size: 1.5rem;
    /* color: violet; */
  }
}

.news {
  width: 100%;
  max-width: 1100px;
  margin: auto;
  margin-bottom: 3rem;
  /* background-color: #fff;
  border: black 2px solid; */
}

.news p {
  text-indent: 0;
}

.newsquote,
.blockquote {
  width: 90%;
  max-width: var(--maxBodyWidth);
  margin-inline: auto;
  margin-top: 1rem;
  margin-bottom: 2rem;
  /* border-left: #999 dotted 2px; */
  padding: 1em;
  font-size: 1.25rem;
  /* text-align: justify; */
  background-color: rgba(0, 0, 0, 0.05);
  box-shadow: 0.25em 0.25em 0.75em rgba(0, 0, 0, 0.25);
  /* background-color: wheat; */
}

@media (max-width: 800px) {
  .newsquote {
    width: 100%;
  }

  .newsquote h2 {
    font-size: 1.5rem;
  }

  .newsquote h3 {
    font-size: 1.5rem;
    font-weight: 800;
  }

  /* .newsquote > p {
    font-size: 0.5rem;
    color: crimson;
  } */
}

.blockquote p,
.newsquote p {
  font-family: 'Times New Roman', Times, serif;
  font-size: 1.25rem;
  line-height: 1.5;
  text-indent: 1rem;
  margin-bottom: 0;

  max-width: 70ch;
  margin-inline: auto;
}

.newsquote .cite {
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  font-weight: 300;
  font-size: 1rem;
}

.cite {
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  font-weight: 300;
  font-size: 1rem;
}

.citation {
  font-family: 'Times New Roman', Times, serif;
  text-indent: 0;
  font-size: 9rem;
  margin-top: 0.5rem;
}

.citation:before {
  content: '— ';
}

@media (max-width: 801px) {
  .downtown .background {
    padding: 0;
    margin: 0;
  }
  .downtown .bldgInvHeader {
    font-size: 1.5rem;
    text-indent: 0;
    font-weight: 750;
  }
  .downtown .bldgName,
  .bldgName {
    font-family: sans-serif;
    margin-top: 2rem;
    margin-bottom: 1em;
    /* font-size: 1rem;
    color: brown; */
  }
  .content {
    padding: 0;
  }
}

/* link at bottom of pages in Downtown to navigate from bldg to bldg. */

.wandering {
  background-color: hsl(39, 73%, 84%);
  border-radius: 15px;
  padding: 0.5rem;
  padding-bottom: 2px;
  margin-top: 2rem;

  outline: solid 2px hsl(39, 91%, 47%);
}

.wanderingHead {
  text-align: center;
  font-size: 2rem;
  margin-top: 1rem;
  color: hsl(39, 91%, 47%);
}

@media (max-width: 801px) {
  .wanderingHead {
    font-size: 1.5rem;
  }
}

.fullInterPageNav {
  font-family: sans-serif;
  font-weight: 600;
  max-width: 100%;
  margin-top: 2rem;
  margin-bottom: 2rem;
  /* padding: 1rem; */

  display: grid;
  grid-template-columns: 1fr 15% 1fr;
  justify-content: center;
  align-items: center; /* up and down when direction is right-left */
  gap: 1rem;
  flex: 1;
}

.linkBack {
  margin-left: auto;
}

.fullInterPageNav a {
  text-decoration: none;
}

@media (max-width: 801px) {
  .fullInterPageNav {
    grid-template-columns: 100%;
    /* gap: 6px; */
  }

  .fullInterPageNav img {
    max-width: 100px;
  }

  .linkBack,
  .linkNext {
    margin-right: auto;
    margin-left: auto;
    margin-top: 0;
  }
}

/**** END OF Historic District Building Pages  **/
/* **************************************** */
/* ******************************************************* */
/*  the news pages */
.content .RuleAbove::before {
  display: block;
  margin: 2rem auto;
  height: 3px;
  content: ' ';
  text-shadow: none;
  background-color: rgb(247, 17, 17);
  width: 400px;
}

/* note: below is .article-art for screens < 750px */
@media (max-width: 750px) {
  .articleArt {
    display: none;
  }
}
/* plain .folios using flex as of 10/1/22 */

.content .folios {
  display: flex;
  justify-content: space-between;

  margin-block: 1rem;
}

@media (max-width: 925px) {
  .folios {
    display: block;
  }

  .folios > p {
    text-align: center;
    font-weight: 800;
  }
}

.newsFolios {
  display: grid;
  font-size: 1.25rem;
  grid-template-columns: 1fr 1fr;
  grid-template-areas: 'date page';
  margin-top: 2rem;
  margin-bottom: 2rem;
  margin-left: 0;
}

.newsFolios .newspaperDate {
  grid-area: date;
  text-align: left;
  margin: 0;
  text-indent: 0;
}

.newsFolios .newspaperPage {
  grid-area: page;
  text-align: right;
  margin: 0;
}

.columns-2 {
  column-count: 2;
}

.multiColumns {
  column-count: 3;
}

@media (max-width: 1000px) {
  .multiColumns {
    column-count: 2;
  }
}
@media (max-width: 500px) {
  .multiColumns {
    column-count: 1;
  }
  .columns-2 {
    columns: 1;
  }
  .columns-2 p {
    text-indent: 0;
  }
}
/* .columns3,
.newsColumns {
    column-count: 3;
    font-family: 'Times New Roman', Times, serif;
    font-size: .9rem;
    column-gap: 0;
   }

   .columns3 p {
     text-indent: 0;
   }
 */
/* @media (max-width: 800px) {
    .newspaperColumns {
column-count: 2;
    }
  }
 */
#newsPageContent,
.newsPageContent {
  padding: 1rem;
}

.imageFloatLeft {
  float: left;
  width: 20%;
  min-width: 8rem;
  margin: 1rem;
}

.imageFloatLeft33 {
  float: left;
  width: 33%;
  min-width: 8rem;
  margin: 1rem;
}

.imageFloatRight {
  float: right;
  width: 20%;
  min-width: 8rem;
  margin: 1rem;
}

.imageFloatRight33 {
  float: right;
  width: 33%;
  min-width: 8rem;
  margin: 1rem;
}
#newsPageContent {
  display: block;
}

/* used to show a new business in a building **/
.newsPageContent p {
  text-indent: 2rem;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  line-height: 140%;
}

@media (max-width: 600px) {
  .newsPageContent p {
    text-indent: 2rem;
  }
}
.newsPageContent h1.hed::after,
.newsPageContent h2.hed::after,
.newsPageContent h3.hed::after,
.newsPageContent h4.hed::after,
#newsPageContent h2.hed::after,
#newsPageContent h3.hed::after,
#newsPageContent h4.hed::after {
  display: block;
  margin: 2rem auto;
  height: 1px;
  content: ' ';
  text-shadow: none;
  background-color: #000;
  width: 240px;
}

.sans {
  font-family: Arial, Helvetica, sans-serif;
}

.newsStory .courier {
  font-family: 'Courier New', Courier, monospace;
  font-weight: 700;
  margin-top: 3rem;
}

#newsPageContent .subhead {
  font-weight: bold;
  text-align: center;
  margin-top: 1rem;
}

.newsStory .subhead {
  font-weight: bold;
  text-align: center;
  margin-top: 1rem;
}

#newsPageContent h2,
#newsPageContent h3 {
  font-family: serif;
}

.origArticle {
  display: block;
  width: 300px;
}

.flushRight {
  text-align: right;
}

.content .ruleAbove::before {
  content: ' ';
  display: block;
  margin: 2rem auto 1rem auto;
  height: 3px;
  text-shadow: none;
  background-color: rgb(8, 7, 7);
  width: 100px;
}

/*******************************************************/
/*  11/25/2020 for fixing and  */
/* .newsFrom is line just under the header photo */
.newsFrom {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 3rem;
  margin-top: 2rem;
  text-align: center;
  letter-spacing: 3px;
  font-weight: 500;
  /* text-transform:uppercase; */
}

@media (max-width: 800px) {
  .newsFrom {
    font-size: 1.5rem;
    font-stretch: 0;
  }
}

.newsStory h1 {
  font-size: 3rem;
  font-family: Verdana, Geneva, Tahoma, sans-serif;
  font-weight: 400;
  margin-bottom: 2rem;
}

.newsStory p {
  font-family: 'Times New Roman', Times, serif;
  text-indent: 2rem;
  font-size: 1.5rem;
  line-height: 1.5;
  max-width: 75ch;
  margin-inline: auto;
}

@media (max-width: 600px) {
  .newsStory p {
    margin-left: 0rem;
    margin-right: 0rem;
  }
}
.newsStory .byline {
  font-weight: 600;
  font-style: italic;
  font-size: 1.25rem;
  text-align: center;
}

@media (max-width: 701px) {
  .newsStory h1 {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: 2rem;
    margin-bottom: 1rem;
    /* color: aliceblue; */
  }
  .newsStory p {
    font-size: 1rem;
  }
  .columnArt {
    display: none;
  }
}
/*********************************/
/*   Style for smallerr screens    */
/*********************************/
@media (max-width: 701px) {
  /* .origArticle is the scan of the start of the article from the EW */
  .origArticle {
    display: none;
  }
  .newsFrom,
  h2.bldgName {
    font-size: 1.5rem;
  }
  .address {
    font-size: 1rem;
  }
}
/* ***************************************************** */
/*   Folios are used for the EW pages to show dates and page numbers */
.folioLeft,
.folioRight {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1em;
  font-variant: small-caps;
  margin-left: 0;
  text-indent: 0;
}

#newsPageContent .folioLeft,
.newsPageContent .folioLeft,
.newsStory .folios .folioLeft {
  text-align: left;
  float: left;
  margin-left: 0;
}

.folioRight {
  text-align: right;
  float: right;
}

/*  LargerBody  is used in some EW articles */
.LargerBody {
  font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
  font-size: large;
  text-align: left;
  text-indent: 30px;
  margin-right: 10%;
  margin-left: 10%;
}

.subHeader {
  font-weight: bold;
  font-size: 120%;
}

.subSponsor {
  margin-top: 2em;
  margin-bottom: 2em;
}

/* the .Social are for the table at bottom of pages that have facebook and twitter share/like links*/
.SocialTable {
  width: 90%;
  margin: 20px auto;
  /* outline: 2px dotted blue;  */
}

.SocialData {
  width: 100%;
  text-align: center;
  /*    margin-left: 200px;  */
}

.newSocialLinks {
  /* width: 75%; */
  height: 20px;
  width: auto;
  margin: 0 auto;
}

@media (min-width: 701px) {
  .sponsor {
    width: 100%;
  }
}
/* .for the little "you are at ... box" on the bottom of the page */
.acknowledgements {
  font-family: Arial, Helvetica, sans-serif;
  border-style: dotted none none none;
  border-width: thin;
  text-align: center;
  clear: both;
  margin-top: 1rem;
  margin-bottom: 3rem;
  font-size: 75%;
  color: #000;
}

/*********************************/
/*   Style for larger screens    */
/*********************************/
@media (min-width: 800px) {
  /* hide the hamburger menu */
  #hamHeader {
    display: none;
  }
  /* show the across the top menu */
  .headerContainer {
    /* border: 5px solid #ffcc5c; */
    display: flex;
    align-items: center;
    justify-content: space-around;
    width: 100%;
  }
  /* following line moved to default.htm which is only place it is used */
  #content {
    /* display: grid;
    grid-template-columns: 1fr 3fr  .5fr 2fr 1fr;
    grid-column-gap: 1px; */
  }
  #content p,
  #content h3 {
    margin-left: 5%;
    margin-right: 5%;
  }
  #content p {
    text-indent: 25px;
  }
  #content .photo {
    margin-left: 10px;
    margin-right: 10px;
  }
  #photo {
    grid-column: 2/6;
  }
  .mainColumn {
    grid-column: 2/3;
  }
  .sideColumn {
    grid-column: 6/7;
  }
  .rightColumn {
    grid-column: 4/5;
  }
  /* remembering is the obituaries */
  #remembering {
    /* grid-row: 1/2; */
    margin-top: 3%;
  }
  #remembering > image {
    width: 10%;
  }
  /* alibi is an advert */
  /* #alibi {
    grid-row: 2/3;
    grid-column: 6/7;
    margin: 0 auto;
    align-self: center;
  } */
  #castlemoyle {
    align-self: center;
  }
  /* these are the articles */
  #historicNews {
    /* grid-row: 4/5; */
    /* grid-column: 6/7; */
  }
  #ewAds {
    grid-row: 3/4;
    grid-column: 6/7;
  }
  body {
    width: 80%;
  }
  .grid {
    /* display: grid; */
  }
  .content-wrap {
    /* grid-column: 2/5; */
  }
  .content-wrap2 {
    /* grid-column: 5/7;
    grid-row: 1/3; */
  }
  .sponsor {
    grid-column: 2/3;
    width: 100%;
    margin: 0 0 0 0;
    padding: 1em;
  }
  .subSponsor {
    grid-column: 4/5;
    grid-row: 2/3;
    padding: 2em;
    /* width: 100%;
    margin: 0 0 0 0; */
  }
  #homeObit,
  #homeStory1,
  #homeStory2 {
    border: none;
    background-color: wheat;
  }
  #historicNews {
    /* grid-column: 2/4; */
  }
  #castlemoyle {
    /* grid-column: 2/3; */
  }
}
/*   advertising pages    */
.adImage {
  margin: auto;
}

@media (max-width: 600px) {
  .adImage {
    width: 100%;
  }
}
.underAd {
  text-align: center;
  margin-bottom: 1em;
}

#instructions {
  margin-bottom: 1em;
  font-size: 75%;
}

.advert {
  display: block;
  margin: 0 auto;
  width: 75%;
  /* outline: solid 3px forestgreen; */
}

/* .advert_detail has the rule under it., .underAdvert does not  */
.advert_detail,
.underAdvert {
  margin-top: 2%;
  margin-bottom: 1em;
  text-indent: 0%;
  text-align: center;
  max-width: 50em;
}

.advert-100 {
  /* outline: dashed 12px darkorange; */
  width: 75%;
}

.advert-100:hover {
  max-width: 100%;
  transform: scale(1.5);
  transition: all 1s ease-in-out; /* slow transition for scrolling down the page */
}

.advert-100:focus {
  max-width: 100%;
  transform: scale(1.5);
  transition: all 1s ease-in-out;
}

.content .image_detail_under {
  text-align: center;
}

.advert-1col {
  /* width: 32%;
  height: auto; */
  max-height: 500px;
  width: auto;
  transition: all 1s ease;
}

.advert-1col:hover {
  max-width: 100%;
  transform: scale(1.5);
  transition: all 0.5s ease;
}

@media (max-width: 800px) {
  .advert-1col {
    width: 75%;
  }
}

.advert-2col {
  width: 40%;
  height: auto;
  transition: all 0.5s ease;
}

.advert-2col:hover {
  max-width: 100%;
  transform: scale(2);
  transition: all 1s ease-in-out;
}

@media (max-width: 900px) {
  .advert-2col {
    width: 100%;
  }
}

.advert-3col {
  width: 50%;
  height: auto;
}

.advert-3col:hover {
  max-width: 100%;
  transform: scale(1.5);
  transition: all 1s ease-in-out;
}

.advert-4col {
  width: 56%;
}

.advert-4col:hover {
  max-width: 100%;
  transform: scale(1.5);
  transition: all 1s ease-in-out;
}

.advert-5col {
  width: 64%;
  height: auto;
}

.advert-5col:hover {
  max-width: 100%;
  transform: scale(1.5);
  transition: all 1s ease-in-out;
}

.advert-6col {
  max-width: 72%;
  height: auto;
}

.advert-6col:hover {
  max-width: 100%;
  transform: scale(1.5);
  transition: all 1s ease-in-out;
}

/**************  styling for smaller devices  ***************/
@media (max-width: 601px) {
  .advert_detail,
  .underAdvert {
    width: 95%;
  }
  .advert {
    /* width: 100%; */
    /* outline: fuchsia solid 3px; */
    /* max-width: 99%; */
  }
  .advert img {
    max-width: 95%;
  }
  .advert-2col:hover,
  .advert-3col:hover,
  .advert-4col:hover,
  .advert-5col:hover,
  .advert-6col:hover {
    /* width: 90%;
    max-width: 90%; */
  }
  .advert-100:hover {
    /* max-width: 100%;   */
    transform: scale(1.5);
    transition: all 0.5s ease-in-out;
  }
  .content .advert .advert_detail::after {
    width: 70%;
  }
}

/*# sourceMappingURL=historic2019.css.map */