<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="row"> <div class="social"> <ul> <li><a title="Мы в Facebook" target="_blank" href="https://www.facebook.com/profile.php?id=100024941808505&hc_ref=ARRq_17BxZ6FN4pjk3mcKO6afw6-XvtY_FvlSST11uXhXMgBAR6y02P-h8CyZouqFf8"><i class="fa fa-lg fa-facebook"></i></a></li> <li><a title="Мы в Вконтакте" target="_blank" href="https://vk.com/club163871652"><i class="fa fa-lg fa-vk"></i></a></li> <li><a title="Мы в Instagram" target="_blank" href="https://www.instagram.com/abitech.ru/"><i class="fa fa-lg fa-instagram"></i></a></li> <li><a title="Мы на YouTube" target="_blank" href="https://www.youtube.com/channel/UCl8QyLnAp4cOc2wOF6Eozlw"><i class="fa fa-lg fa-youtube"></i></a></li> </ul> </div> </div>

@import "//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css"; .social { position:fixed; left:5px; } .social ul { padding: 1px; } .social ul li { list-style-type: none; } .social i { margin:2px; float:left; width: 3vw; height: 3vw; color: #FFF; background-color: #03318B; font-size: 2vw; text-align:center; padding-top: 0.7vw; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; -o-border-radius: 50%; transition: all ease 0.3s; -moz-transition: all ease 0.3s; -webkit-transition: all ease 0.3s; -o-transition: all ease 0.3s; -ms-transition: all ease 0.3s; } .social i:hover { color: #FFF; text-decoration: none; transition: all ease 0.3s; -moz-transition: all ease 0.3s; -webkit-transition: all ease 0.3s; -o-transition: all ease 0.3s; -ms-transition: all ease 0.3s; } .social .fa-facebook:hover {background: #4060A5;} .social .fa-instagram:hover {background: #375989;} .social .fa-stack-overflow:hover {background: #FEA501;} .social .fa-vk:hover {background: #597da3;} .social .fa-youtube:hover {background: #FF1F25;} .social .fa-youtube-play:hover {background: #DF192A;}