html {
    scroll-behavior: smooth;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-weight: 300;
    margin: 8px;
  }

  h1 {
    text-transform: uppercase;
    font-weight: 300;
  }

  header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
  }

  main {
    display: grid;
    grid-gap: 30px;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    grid-auto-rows: max-content;
    grid-auto-flow: row dense;
  }

  .article h2 {
    font-family: Georgia, 'Times New Roman', Times, serif;
  }

  .article a,
  .article a:visited {
    text-decoration: none;
    color: inherit;
  }

  .article img {
    width: 100%;

  }


  a {
    text-decoration: underline;
    color:darkgreen;
    font-weight: bold;
    cursor: pointer;
  }

  .dblue {
    color:darkblue;
    font-weight: bold;
  }

  .member {
    background-color:lightblue;
    margin-right: 2px;
    margin-left:2px;
    margin-bottom: -20px;
    margin-top: -2px;
    padding-right: 5px;
    padding-left: 5px;
    padding-bottom: 1px;
    padding-top: 1px;
    border: 1px solid black;
    border-radius: 8px;
  }

  .spouse {
      color: darkgreen;
      font-weight:bold;
  }

  .shadow {
      -moz-box-shadow: 5px 6px 8px grey;
      -webkit-box-shadow: 5px 6px 8px grey;
      box-shadow: 5px 6px 8px grey;
  }

  #header {
    position:fixed;
    top:0; left:0;
    padding : 3px;
    height:100px;
    width: 100%;
    background-color: #270772;
    color: white;
    z-index:999;
}