Prevent column-break when using column-count

<ul class="separated">
  <li>
    <strong>Title 1</strong>
    <ul><li>All</li></ul>
  </li>
  <li>
    <strong>Title 2</strong>
    <ul>
      <li>Sub-Title 2-1</li>
    </ul>
  </li>
  <li>
    <strong>Title 3</strong>
    <ul>
      <li>Sub-Title 3-1</li>
    </ul>
  </li>
</ul>

ul.separated {
  -webkit-column-count: 2;
  -moz-column-count: 2;
  -ms-column-count: 2;
  -o-column-count: 2;
  column-count: 2;
  -webkit-column-gap: 20px;
  -moz-column-gap: 20px;
  -ms-column-gap: 20px;
  -o-column-gap: 20px;
  column-gap: 20px;
  list-style: inside none;
  padding: 0;
}

ul.separated li {
  font-size: 12px;
  font-size: 1.2rem;
  -webkit-column-break-inside: avoid;
  column-break-inside: avoid;
  page-break-inside: avoid; 
}