Social Links Out Of Place

Hi there

MY social links appear to have moved to the top of the circles on https://www.lhpmerch.com. Can anyone advise how I make them central? Code from the widget below.

Thanks

<div class="menu-social-links-menu-container kkt" style=" float: right;
    margin-top: 125px;">
<ul id="menu-social-links-menu" class="social-links-menu">
<li id="menu-item-25" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-25">
<a href="https://www.facebook.com/lhpmerch" target="_blank">
<span class="screen-reader-text">Facebook</span>
<svg class="icon icon-facebook" aria-hidden="true" role="img">
<use href="#icon-facebook" xlink:href="#icon-facebook">
</svg>
</a>
</li>
<li id="menu-item-288" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-27">
<a href="https://www.lhpmerch.tumblr.com" target="_blank">
<span class="screen-reader-text">tumblr</span>
<svg class="icon icon-tumblr" aria-hidden="true" role="img">
<use href="#icon-tumblr" xlink:href="#icon-tumblr">
</svg>
</a>
</li>
<li id="menu-item-26" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-26">
<a href="https://www.twitter.com/lhpmerch" target="_blank">
<span class="screen-reader-text">Twitter</span>
<svg class="icon icon-twitter" aria-hidden="true" role="img">
<use href="#icon-twitter" xlink:href="#icon-twitter">
</svg>
</a>
</li>
<li id="menu-item-27" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-27">
<a href="https://www.instagram.com/lhpmerch" target="_blank">
<span class="screen-reader-text">Instagram</span>
<svg class="icon icon-instagram" aria-hidden="true" role="img">
<use href="#icon-instagram" xlink:href="#icon-instagram">
</svg>
</a>
</li>
</ul>
</div>