html {
  font-family: "Helvetica", sans-serif;
  font-size: 16px;
  padding: 0;
  border: 0;
  margin: 0;
  height: 100%;
  
  a {
    color: #2a361e;
  }

  a:hover {
    text-decoration: none;
  }
 

  body {
    padding: 0;
    border: 0;
    margin: 0;
    background-image: url(images/bg.gif), url(images/bg.gif);
    background-repeat: space, repeat;
    background-size: 32px, 17px;
    background-position: 0px 0px, 13px 13px;
    background-blend-mode: darken, luminosity;
    height: 100%;
    min-height: 100vh;
    display: grid;
    grid-template-rows: auto 1fr auto;

    header, footer, article {
      margin-left: 10px;
      margin-right: 10px;
    }

    header, footer, section {
      background: #ffffff99;
      padding: 5px 20px;
    }
    
    header {
      font-size: 1.5em;
      font-variant: small-caps;
      margin-top: 10px;
    }
    article {
      margin-top: 20px;
      section {
        margin-bottom: 10px;
        img {
          max-width: 100%;
          margin: 0 auto;
          display: block;
        }
      }
    }
    
    footer {
      display: flex;
      margin-bottom: 10px;
      margin-top: 20px;
      img {
        image-rendering: auto;
        image-rendering: crisp-edges;
        image-rendering: pixelated;
        image-rendering: -webkit-optimize-contrast;
        margin-right: 10px;
      }
    }
    
    .email {
      font-family: monospace;
    }
  }
  
  flex-gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5em;
    text-align: center;
    justify-content: center;
  }
}