Header HTML Not Working Correctly?

Hi all, I have been working on redesigning a website and opted to go with a nice header menu inspired by an amazing idea I found online and I revamped it a bit to my liking.

This is what I want it to look like: https://wp.me/a33ve1-eJD
I can get everything in there, which is already functioning on the website, but I cannot seem to get the logo so half of it is on the green and the other half overlaps the website. You can see what I have so far here: https://daytongliders.com/

The logo is messing the entire layout of the header up, and I tried messing with the size, but it didn’t seem to work. These are the two versions of the image I made: https://wp.me/a33ve1-eJA and https://wp.me/a33ve1-eJB

Also, here is the code I tried using, please let me know if it is just human error, which it probably is!

<div class="header" style="background-image: url('https://daytongliders.com/wp-content/uploads/2014/01/Header.jpg'); background-repeat:repeat-x; width: 100%; height: 150px;">
<table>
<tr>
<td width="22.20577%">
<center><img src="https://daytongliders.com/wp-content/uploads/2014/01/logo2.png" /></center>
</td>
<td width="77.79423%">
<a href="https://daytongliders.com/#"><img onmouseover="this.src='https://daytongliders.com/wp-content/uploads/2014/01/gliders21.jpg'" onmouseout="this.src='https://daytongliders.com/wp-content/uploads/2014/01/gliders2.jpg'" src="https://daytongliders.com/wp-content/uploads/2014/01/gliders2.jpg" /></a>

<a href="https://daytongliders.com/#"><img onmouseover="this.src='https://daytongliders.com/wp-content/uploads/2014/01/care2.jpg'" onmouseout="this.src='https://daytongliders.com/wp-content/uploads/2014/01/care1.jpg'" src="https://daytongliders.com/wp-content/uploads/2014/01/care1.jpg" /></a>

<a href="https://daytongliders.com/#"><img onmouseover="this.src='https://daytongliders.com/wp-content/uploads/2014/01/contact2.jpg'" onmouseout="this.src='https://daytongliders.com/wp-content/uploads/2014/01/contact1.jpg'" src="https://daytongliders.com/wp-content/uploads/2014/01/contact1.jpg" /></a>

<a href="https://daytongliders.com/#"><img onmouseover="this.src='https://daytongliders.com/wp-content/uploads/2014/01/reviews2.jpg'" onmouseout="this.src='https://daytongliders.com/wp-content/uploads/2014/01/reviews.jpg'" src="https://daytongliders.com/wp-content/uploads/2014/01/reviews.jpg" /></a>

<a href="https://daytongliders.com/#"><img onmouseover="this.src='https://daytongliders.com/wp-content/uploads/2014/01/shop2.jpg'" onmouseout="this.src='https://daytongliders.com/wp-content/uploads/2014/01/shop.jpg'" src="https://daytongliders.com/wp-content/uploads/2014/01/shop.jpg" /></a>

<a href="https://daytongliders.com/#"><img onmouseover="this.src='https://daytongliders.com/wp-content/uploads/2014/01/blog2.jpg'" onmouseout="this.src='https://daytongliders.com/wp-content/uploads/2014/01/blog.jpg'" src="https://daytongliders.com/wp-content/uploads/2014/01/blog.jpg" /></a>
</td>
</tr>
</table>

</div>