CSS for a form in WPForms doesn't style markup correctly

Hey John,
Thanks for your patience and the link to your site, I tested the HTML and CSS from the article that you posted in the code block on your test page and it worked correctly, so please use this instead of the WPForm shortcode that you had there. I’m not sure why the WPForm shortcode didn’t work correctly but the HTML and CSS from the article does.
For future readers this is the working HTML and CSS in a code block element:

<style>
     /* legal list styles */
  #legal-list {
    counter-reset: section;
  }
  #legal-list h2:before {
    counter-increment: section;
    content: counter(section) ". ";
    margin: 0 0.5em 0 0;
  }
  #legal-list ol {
    counter-reset: clause;
    list-style: none outside none;
    text-indent: -2em;
  }
  #legal-list ol li {
    counter-increment: clause;
  }
  #legal-list ol li:before {
    content: counter(section) "." counters(clause, ".") ". ";
    margin: 0 0.5em 0 0;
  }
</style>

<div id="legal-list">
    <h1>Sample of Legal List Numbering using CSS</h1>
    <h2>Section One</h2>
    <ol>
      <li>Clause One</li>
      <li>Clause Two
        <ol>
          <li>Clause Two sub One</li>
          <li>Clause Two sub Two</li>
          <li>Clause Two sub Three</li>
        </ol>
      </li>
      <li>Clause Three</li>
    </ol>
    <h2>Section Two</h2>
    <ol>
      <li>Clause One</li>
      <li>Clause Two</li>
      <li>Clause Three
        <ol>
	  <li>Clause Three sub One
            <ol>
              <li>Clause Three sub One sub One </li>
              <li>Clause Three sub One sub Two</li>
              <li>Clause Three sub One sub Three</li>
            </ol>
          </li>
          <li>Clause Three sub Two</li>
          <li>Clause Three sub Three</li>
        </ol>
      </li>
    </ol>
  </div> 

and the results:

Best regards,
Mike

Hi,
I’m not sure we are talking about the same thing, your test page is a plain HTML page, my test page above is a page built with the theme Advanced Layout Builder on a theme page, it is not an external page.
My point in demonstrating this is the theme is displaying the legal list correctly and the WPForm plugin is not.
I’m not sure why WPForm is not displaying the legal list correctly, seems to be something in their css but I don’t know.
Anyways since the theme page is working correctly why not just use this instead of adding the list to the WPForm plugin and then adding the plugin shortcode to the theme page, if you add the list directly to the theme page you are saving a step in the process, doesn’t that make sense?

Best regards,
Mike