Custom Font Awesome Icons with A tags breaking web page

I have added custom code to a page of the site in the custom code block and script in the page settings/advanced and everything below that section on the page loses css styling. Screenshot attached, "Ready to Work with us?" should be centered and both buttons should be same size

Code for Page Settings/Advanced: 

<script src="https://kit.fontawesome.com/##########.js" crossorigin="anonymous"></script>

Code Block on page: 

<div style=text-align:center; class="fa-2x">
  <a href="mailto:email@email.com" target="_blank">
<i style=padding:15px; aria-hidden:"true"; class="fa fa-envelope-o"></i></a> 
  <a href="https://www.linkedin.com/" target="_blank">
<i style=padding:15px; aria-hidden:"true"; class="fa fa-linkedin"></i></a>
 <a href="tel:##########">
   <i style=padding:15px; aria-hidden:"true"; class="fa-solid fa-phone center-phone-icon" ></i><a/>
</div> 

Does style need to live in custom css section and not in the code block?

@ZiggyI cleaned up the code like posted but still having issues with the block below it not showing correct styling

Can you share your website URL and this page?

momentumrecruiters.com/about

@Ziggy password shared privately

I don't see why that would be causing these issues, can you remove the code temporarily and send me a screenshot of what it looks like then?

@Ziggy It might be something with the phone number link or icon. I kept the other two and it works but when I have the phone it break it.

@ZiggyIt is working now, not sure what happened. I removed the link for the phone and left icon and page looked fine, then added a tag back and its working now

Glad it's working, can't see why the phone link would be causing the problem though, coding can be funny that way at times!