<social-links>
    <div class="social d-flex justify-content-center align-middle">
        <a rel=prefetch class="mx-2" href="https://discord.gg/pVNnTDA"><i class="fab fa-discord fa-2x"></i></a>

        <a rel=prefetch class="mx-2" href="https://www.youtube.com/wompmacho"><i class="fab fa-youtube fa-2x"></i></a>
        <a rel=prefetch class="mx-2" href="https://www.twitch.com/wompmacho/"><i class="fab fa-twitch fa-2x"></i></a>
        <a rel=prefetch class="mx-2" href="https://www.facebook.com/wompmacho"><i class="fab fa-facebook fa-2x"></i></a>

        <a rel=prefetch class="mx-2" href="https://twitter.com/wompmacho"><i class="fab fa-twitter fa-2x"></i></a>
        <a rel=prefetch class="mx-2" href="https://www.instagram.com/wompmacho/"><i class="fab fa-instagram fa-2x"></i></a>

        <a rel=prefetch class="mx-2" href="https://www.linkedin.com/in/wompmacho/"><i class="fab fa-linkedin fa-2x"></i></a>
        <a rel=prefetch class="mx-2" href="https://github.com/wompmacho"><i class="fab fa-github fa-2x"></i></a>

    </div>
</social-links>

<style>
    a{
        color: #00ff00;
    }
    a:hover{
        color: red;
    }

    @media only screen and (max-width: 769px) {
		.social{
			padding: 1em;
		}
    }
</style>