article {
      max-width: 70em;
      background: white;
      padding: 2em;
      margin: 1em auto;
    }

    .article-contents {
      float: right;
      width: 85%;
      background: #eee;
      font-size: 1em;
      padding: 0 2em;
      margin: 0 0 0.5em 0.5em;
    }
    
    /* margin top, right */
    
    .toc_wrapper {
      float: left;
      width: 25%;
      background: white;  /* #eee */
      font-size: 0.8em;
      padding: 1em 2em;
      margin: 1em 0 0 0.5em;
      /* margin: 0 0 0.5em 0.5em; */
    }
    .table-of-contents ul {
      padding: 0;
    }
    .table-of-contents li {
      margin: 0 0 0 1em;
    }
    .table-of-contents a {
      text-decoration: none;
    }
    .table-of-contents a:hover,
    .table-of-contents a:active {
      text-decoration: underline;
    }

    h3:target {
      animation: highlight 1s ease;
    }

    @keyframes highlight {
      from { background: yellow; }
      to { background: white; }
    }