中心字体垂直的令人敬畏的图标

Question

如何调整this page右上角的字体真棒社交图标的高度，使它们位于黑条的中间而不是底部？添加padding-bottom：to .social会提升它们，但也会增加黑条的深度，这是我不想要的。在其他位置添加填充底部无效。谢谢!!

     .social {
padding: 0;
margin: 0;
font-size: 0;
height: 28px;
}
.image-caption .social {
height: 33px;
padding:top: 10px;

}
.social li {
display: inline-block;
margin-right: 15px;
margin-left: 15px;

}
.footer .widget.single .social li {
margin: 0 3px
}
.text-center .social li {
margin: 0 2px
}
.social li a {
display: table
}
.social li a i {
text-align: center;
padding-top: 7px;
display: table-cell;
vertical-align: middle;
color: #aaa;
background: none;
border: 1px solid #aaa;
width: 28px;
height: 28px !important;
line-height: 1;
font-size: 13px;
-webkit-transition: all 200ms ease-in;
-o-transition: all 200ms ease-in;
-moz-transition: all 200ms ease-in;
}

.social a:hover a:hover i {
background-color: #FFF
}
.social a:hover i {
color: #FFF
}