Space between List and top of the page

I am using a design I found on a website and it looks really cool but I wanted to alter it to look like what I need it to be.

The original demo looked like this

but I needed them to be side by side, so i created a table that was a width of 100% and two columns. I placed both of the lists in the table but something strange happened.

I have checked and there isn't a padding on the top nor is there another object there. The list and table are both set to v-align. I have attached a jFiddle for better reference and help.

JSFiddle

Thank you all so much!

<table width="100%" border="0">
<tbody valign="top">
<tr valign="top">
  <td valign="top">
  <ul class="tabs">
      <li class="tabs__item color1">
        <h2><span>[Review] The New LG G18</span></h2>
        <p class="tabs__stats">Content</p>
      </li>
      <li class="tabs__item color2">
        <h2><span>[ROM][8.3.1] SlimSaber R31</span> </h2>
        <p class="tabs__stats">Content</p>
      </li>
      <li class="tabs__item color3">
        <h2><span>[APP] Goo Simulator Extreme</span></h2>
        <p class="tabs__stats">Content</p>
      </li>
      <li class="tabs__item color4">
        <h2><span>[Tutorial] Pooping Your Pants</span></h2>
        <p class="tabs__stats">Content</p>
      </li>
      <div class="views-toggle views-toggle--hidden">
        <svg fill="white" viewBox="0 0 24 24">
          <path d="M16.59 8.59l-4.59 4.58-4.59-4.58-1.41 1.41 6 6 6-6z"/>
          <path d="M0 0h24v24h-24z" fill="none"/>
        </svg>
      </div>
    </ul>
    <script       src="http://ift.tt/19puDaP"></script> 
    <script src="js/index.js"></script> 
  </td>
  <td valign="top">
  <ul class="tabs">
      <li class="tabs__item color1">
        <h2><span>[Review] The New LG G18</span></h2>
        <p class="tabs__stats">Content</p>
      </li>
      <li class="tabs__item color2">
        <h2><span>[ROM][8.3.1] SlimSaber R31</span> </h2>
        <p class="tabs__stats">Content</p>
      </li>
      <li class="tabs__item color3">
        <h2><span>[APP] Goo Simulator Extreme</span></h2>
        <p class="tabs__stats">Content</p>
      </li>
      <li class="tabs__item color4">
        <h2><span>[Tutorial] Pooping Your Pants</span></h2>
        <p class="tabs__stats">Content</p>
      </li>
      <div class="views-toggle views-toggle--hidden">
        <svg fill="white" viewBox="0 0 24 24">
          <path d="M16.59 8.59l-4.59 4.58-4.59-4.58-1.41 1.41 6 6 6-6z"/>
          <path d="M0 0h24v24h-24z" fill="none"/>
        </svg>
      </div>
    </ul>
    <script src="http://ift.tt/19puDaP"></script> 
    <script src="js/index.js"></script> 
  </td>
 </tr>
 </tbody>
  </table>