MODULAR: Likes & Dislikes 1.0-ReColor

  <!-- LIKES AND DISLIKES START
If you want this to be two text boxes side by side instead of lists, delete everything between the two <p></p> tags then write as desired.
Make sure to keep the <p> tags though, <p> is a paragraph tag.
Indented bullet points:
	<ul><li><div style="color:#161B33">Text</div></li></ul>
-->
  <div class="row">
    <!-- LIKES START -->
    <div class="col-md-6 col-sm-12 p-2">
      <div style="background-color:#F1DAC4" class="p-3">
        <div class="text-uppercase d-flex justify-content-between" style="letter-spacing:3px; font-size:20px; color:#0D0C1D">
          Likes
        </div>
        <hr style="border-color: #474973;" class="w-100">
        <div class="table-responsive p-1"  style="color:#707EC2">
          <p>
          <ul>
            <li><div style="color:#161B33">big long item one that is very big and long</div></li>
            <li><div style="color:#161B33">two</div></li>
            <ul><li><div style="color:#161B33">indented three</div></li></ul>
            <li><div style="color:#161B33">four</div></li>
          </ul>
          </p>
      </div>
    </div>
  </div>
  <!-- LIKES END -->


  <!-- DISLIKES START -->
  <div class="col-md-6 col-sm-12 p-2">
    <div style="background-color:#E1DDE3" class="p-3">
      <div class="text-uppercase d-flex justify-content-between" style="letter-spacing:3px; font-size:20px; color:#0D0C1D">
        Dislikes
      </div>
      <hr style="border-color: #474973;" class="w-100">
      <div class="table-responsive p-1"  style="color:#707EC2">
        <p>
          <ul>
            <li><div style="color:#161B33">big long item one that is very big and long</div></li>
            <li><div style="color:#161B33">two</div></li>
            <ul><li><div style="color:#161B33">indented three</div></li></ul>
            <li><div style="color:#161B33">four</div></li>
          </ul>
        </p>
    </div>
  </div>
</div>
<!-- DISLIKES END -->
</div>
<!-- LIKES AND DISLIKES END -->