<div class="social_network">
<a href="#" target="_blank"><i class="fa fa-facebook"></i></a>
<a href="#" target="_blank"><i class="fa fa-skype"></i></a>
<a href="#" target="_blank"><i class="fa fa-twitter"></i></a>
<a href="#" target="_blank"><i class="fa fa-youtube-play"></i></a>
<a href="#" target="_blank"><i class="fa fa-linkedin"></i></a>
<a href="#" target="_blank"><i class="fa fa-google-plus"></i></a>
<a href="#" target="_blank"><i class="fa fa-rss"></i></a>
<a href="#" target="_blank"><i class="fa fa-pinterest"></i></a>
</div>
/* social network */
.social_network {
margin: 15px;
}
.social_network .fa:hover {
box-shadow: 0 0 10px #666;
transform:rotateZ(360deg);
-webkit-transform:rotateZ(360deg);
}
.social_network .fa {
width: 35px;
height: 35px;
text-align: center;
padding-top: 8px;
color: #fff;
font-size: 20px;
border-radius: 100%;
transition:all .5s;
-webkit-transition:all .5s;
}
.social_network a {
display: inline-block !important;
}
.social_network .fa.fa-facebook {
background: #3C5B9B;
}
.social_network .fa.fa-twitter {
background: #359BED;
}
.social_network .fa.fa-google-plus {
background: #E33729;
}
.social_network .fa.fa-rss {
background: #FD9F13;
}
.social_network .fa.fa-pinterest {
background: #CB2027;
}
.social_network .fa.fa-linkedin {
background: #027BA5;
}
.social_network .fa.fa-skype {
background: #139FEE;
}
.social_network .fa.fa-youtube-play {
background: #F03434;
}
/* end social network */
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
