/** Sample styling for article container */
/*
main {
  display: flex;
  flex-direction: row;
  justify-content: center;
  width: 100%;
}
*/
@font-face { font-family: 'Marcellus-Regular'; src: url('Marcellus-Regular.woff2'); }
article {
  /******************************************/
  /* Variables */
  /******************************************/
  --grid: 8px;

  /** Typography variables */
  --text-font-family: "Marcellus-Regular", serif;
  --heading-font-family: "Marcellus-Regular", sans-serif;

  --h1-font-size: 40px;
  --h2-font-size: 32px;
  --h3-font-size: 24px;
  --text-font-size-default: 20px;
  --text-font-size-small: 18px;
  --code-font-size: 18px;

  --text-line-height: 1.56em;

  /** Color variables */
  --text-primary-color: #121212;
  --text-secondary-color: #767676;
  --text-highlight-color: #ffe082;
  --text-light-background-color: #e0e0e0;

  /** Container sizing variables */
  --container-width: 760px;

  /******************************************/
  /* Template styles */
  /******************************************/
  display: flex;
  flex-direction: column;
  flex: 1;
  align-self: center;

  box-sizing: border-box;
  margin: var(--grid) calc(var(--grid) * 3) calc(var(--grid) * 3);
  padding: 0;
  max-width: var(--container-width);

  font-family: var(--text-font-family);
  font-size: var(--text-font-size-default);
  color: black;
  text-align: left;



  h1 {
    font-family: var(--heading-font-family);
    font-size: var(--h1-font-size);
    font-weight: 800;
    color: white;
    letter-spacing: 0.1px;
    line-height: 1.2em;
    background: black;
    margin: 0;
    padding: 1em;
    text-align: center;
  }

  h2 {
    font-family: var(--heading-font-family);
    font-size: var(--h3-font-size);
    font-weight: 500;
    color: var(--text-primary-color);
    letter-spacing: 0.1px;
    line-height: 1.2em;

    margin: calc(var(--grid) * 3) 0 var(--grid) 0;
    padding: 0;
  }

  .subtitle {
    font-family: var(--heading-font-family);
    color: var(--text-secondary-color);
    font-weight: 400;
    margin: 0 0 calc(var(--grid) * 2) 0;
  }

  p {
    margin: calc(var(--grid) * 2) 0;
    letter-spacing: -0.02px;
    line-height: var(--text-line-height);
  }

  a {
    color: var(--text-primary-color);
    text-decoration: underline;
  }

  ul,
  ol {
    display: flex;
    flex-flow: column;
    margin: var(--grid) 0;

    li {
      margin: var(--grid) 0;
      line-height: var(--text-line-height);
    }
  }

  img {
    width: 100%;
    height: auto;
    margin: calc(var(--grid) * 2) 0;
    padding: 0;
  }

  figure {
    display: flex;
    flex-direction: column;
    margin: calc(var(--grid) * 2) 0;
    padding: 0;
    gap: var(--grid);
    text-align: center;

    img {
      margin: 0;
    }
  }

  figcaption {
    font-size: var(--text-font-size-small);
    font-style: italic;
    color: var(--text-secondary-color);
  }

  mark,
  .highlight {
    background: var(--text-highlight-color);
  }

  blockquote {
    font-style: italic;
    line-height: var(--text-line-height);
    border-left: 4px solid var(--text-primary-color);
    margin: calc(var(--grid) * 2) 0;
    padding: calc(var(--grid) / 2) 0 calc(var(--grid) / 2)
      calc(var(--grid) * 1.5);
  }

  blockquote.large {
    border-left: none;

    font-family: var(--heading-font-family);
    font-size: var(--h2-font-size);
    font-weight: 700;
    padding: 0 calc(var(--grid) * 3);
  }

  code {
    font-size: var(--code-font-size);
    background: var(--text-light-background-color);
    border-radius: 4px;
    padding: 2px 4px;
    line-height: var(--text-line-height);
  }
}
      html,
      body {
        margin: 0;
        padding: 0;
        width: 100%;
      }

      /** Styling for article container */
      main {
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: center;
      }
      article {
	text-align: justify;
      }
      footer {
        text-align: center;
      }
      eenq {
        font-weight: bold;
        color: blue;
      }