<ol>
  <li>primary</li>
  <li>secondary</li>
  <li>
    tertiary
    <ol>
      <li>primary</li>
      <li>secondary</li>
    </ol>
  </li>
  <li>quaternary</li>
  <li>quinary</li>
</ol>
body {
  padding: 2em;
}
ol, li {
  margin: 0;
  padding: 0;
}
ol {
  counter-reset: num;
  list-style: none;
}
ol li:before {
  content: counters(num, '-') '. ';
  counter-increment: num;
}
ol li {
  margin-top: .5em;
  padding-left: 1.25em;
  text-indent: -1.25em;
}
ol li li {
  padding-left: 2.25em;
  text-indent: -2.25em;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.