JSFiddle - React, Tailwind, and code Playground

HTML

<div id="show_social">Add to Social Networks
<div id="social_share">
    <p id="socialicons"> <a href="http://www.facebook.com/SuperRodUK"><img src="http://3.bp.blogspot.com/-eG9bPvyOXro/UPBYTmI8VEI/AAAAAAAAJqI/TFBZzBxJ59c/s1600/NBT+facebook+icon.png" /></a>  <a href="http://www.twitter.com/SuperRodUK"><img src="http://4.bp.blogspot.com/-dB0P2JmL6QA/UPBYVfvhyII/AAAAAAAAJqU/HFD5UeTJck8/s1600/NBT+twitter+icon.png" /></a>  <a href="https://plus.google.com/[email protected]"><img src="http://1.bp.blogspot.com/-XU8OI90JZQc/UPBYUKmev_I/AAAAAAAAJqM/FPgdcMimraQ/s1600/NBT+google+plus+icon.png" /></a>  <a href="http://www.feeds.feedburner.com/"><img src="http://4.bp.blogspot.com/-YPkJD-sewC8/UPBYWk9dzBI/AAAAAAAAJqg/D3FVlAJz4VE/s1600/NBT+rss+feed+icon.png" /></a>  <a href="http://www.youtube.com/user/SuperRodUK"><img src="http://1.bp.blogspot.com/-YNToKMeHx9A/UPBYWVeeq5I/AAAAAAAAJqc/HEpC_PsZBsY/s1600/NBT+youtube+icon.png" /></a> 
    </p>
</div>
    </div>

CSS

#show_social{width:400px;background:#272727;color:#fff;text-align:center;font-family:Helvetica;border:1px solid rgba(10,10,10,0.5)}
#social_share{display:none;}
#show_social:hover #social_share{display:block;}
#socialicons img {
     -moz-transition: all 1.0s ease;
     -webkit-transition: all 1.0s ease;
     -o-transition: all 1.0s ease;
     -ms-transition: all 1.0s ease;
     transition: all 1.0s ease;
 }
 #socialicons img:hover {
     -moz-transform: rotate(360deg);
     -webkit-transform: rotate(360deg);
     -o-transform: rotate(360deg);
     -ms-transform: rotate(360deg);
     transform: rotate(360deg);
    -moz-transition: all 1.0s ease-in-out;
     -webkit-transition: all 1.0s ease-in-out;
     -o-transition: all 1.0s ease-in-out;
     -ms-transition: all 1.0s ease-in-out;
     transition: all 1.0s ease-in-out;
 }