www.gusucode.com > 200套html5精品模板51_75 > 074/css/social.css

    /* Vars ----------------------------------------------------*//* Mixins ----------------------------------------------------*/#social-bar {
  display: block;
  clear: left;
  float: left;
  position: relative;
  margin-top: 10px;
}
#social-bar li {
  display: block;
  float: left;
  position: relative;
  overflow: hidden;
  width: 32px;
  height: 32px;
  margin-left: 5px;
  margin-right: 5px;
  margin-bottom: 5px;
}
#social-bar li a {
  position: absolute;
  height: 64px;
  width: 32px;
  top: 0;
  left: 0px;
  background-repeat: no-repeat;
  -webkit-transition: all 0.15s ease;
  -moz-transition: all 0.15s ease;
  -o-transition: all 0.15s ease;
  transition: all 0.15s ease;
}
#social-bar li a:hover {
  top: -32px;
}
#social-bar .dribbble a {
  background-image: url('../img/social/dribbble.png');
}
#social-bar .facebook a {
  background-image: url('../img/social/facebook.png');
}
#social-bar .flickr a {
  background-image: url('../img/social/flickr.png');
}
#social-bar .forrst a {
  background-image: url('../img/social/forrst.png');
}
#social-bar .github a {
  background-image: url('../img/social/github.png');
}
#social-bar .googleplus a {
  background-image: url('../img/social/googleplus.png');
}
#social-bar .lastfm a {
  background-image: url('../img/social/lastfm.png');
}
#social-bar .linkedin a {
  background-image: url('../img/social/linkedin.png');
}
#social-bar .rss a {
  background-image: url('../img/social/rss.png');
}
#social-bar .twitter a {
  background-image: url('../img/social/twitter.png');
}
#social-bar .vimeo a {
  background-image: url('../img/social/vimeo.png');
}
#social-bar .youtube a {
  background-image: url('../img/social/youtube.png');
}