Css for adding Canvas v5.2 social icons to the Primary Navigation Area

gistfile1.css

#navigation .social {float:right;margin:0.35em 0.5em 0 0;}
 
#navigation .social a {
  filter: alpha(opacity=@opacity * 100);
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  opacity: 0.8;
  -webkit-transition: all ease-in-out 0.2s;
  -moz-transition: all ease-in-out 0.2s;
  -o-transition: all ease-in-out 0.2s;
  transition: all ease-in-out 0.2s;
}
#navigation .social a:hover {
  filter: alpha(opacity=@opacity * 100);
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}
#navigation .social a:hover {
  text-decoration: none;
}
#navigation .social a:before {
  font-family: Social;
  font-size: 1.1em;
  line-height: 1;
  margin: 0 0.2em 0.35em 0;
  padding: .53em;
  display: inline-block;
  -webkit-border-radius: 300px;
  -moz-border-radius: 300px;
  border-radius: 300px;
  color: #fff;
  text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.1);
}
#navigation .social a.subscribe:before {
  content: '\e001';
  background-color: #FF6600;
}
#navigation .social a.twitter:before {
  content: '\e002';
  background-color: #00aced;
}
#navigation .social a.facebook:before {
  content: '\e003';
  background-color: #3b5998;
}
#navigation .social a.youtube:before {
  content: '\e004';
  background-color: #af2b26;
}
#navigation .social a.flickr:before {
  content: '\e005';
  background-color: #ff0084;
}
#navigation .social a.linkedin:before {
  content: '\e006';
  background-color: #71c5ef;
}
#navigation .social a.delicious:before {
  content: '\e007';
  background-color: #285da7;
}
#navigation .social a.googleplus:before {
  content: '\e008';
  background-color: #2d2d2d;
  font-weight: bold;
}
#navigation .social a.dribbble:before {
  content: '\e009';
  background-color: #ea4c89;
}
#navigation .social a.instagram:before {
  content: '\e010';
  background-color: #517fa4;
}
#navigation .social a.vimeo:before {
  content: '\e011';
  background-color: #33454E;
}
#navigation .social a.pinterest:before {
  content: '\e012';
  background-color: #cb2027;
}