.hi-icon-wrap{text-align:center;margin:0 auto;}
.hi-icon{display:inline-block;font-size:0px;cursor:pointer;width:90px;height:89px;text-align:center;position:relative;z-index:1;color:#fff;}
.hi-icon:after{pointer-events:none;position:absolute;width:100%;height:100%;border-radius:50%;content:'';-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;}
.hi-icon:before{speak:none;font-size:30px;line-height:90px;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;display:block;-webkit-font-smoothing:antialiased;}
.hi-icon-effect-5 .hi-icon{box-shadow:0 0 0 4px #222;overflow:hidden;-webkit-transition:background 0.3s, color 0.3s, box-shadow 0.3s;-moz-transition:background 0.3s, color 0.3s, box-shadow 0.3s;transition:background 0.3s, color 0.3s, box-shadow 0.3s;text-decoration:none;}
.hi-icon-effect-5 .hi-icon:after{display:none;}
.hi-icon-effect-5 .hi-icon:hover{background:#2d3134;color:#FFF;box-shadow:0 0 0 8px rgba(255,255,255,0.3);}
.hi-icon-effect-5a .hi-icon:hover:before{-webkit-animation:toLeftFromRight 0.3s forwards;-moz-animation:toLeftFromRight 0.3s forwards;animation:toLeftFromRight 0.3s forwards;}
@-webkit-keyframes toLeftFromRight{49%{-webkit-transform:translate(100%);}
50%{opacity:0;-webkit-transform:translate(-100%);}
51%{opacity:1;}
}
@-moz-keyframes toLeftFromRight{49%{-moz-transform:translate(100%);}
50%{opacity:0;-moz-transform:translate(-100%);}
51%{opacity:1;}
}
@keyframes toLeftFromRight{49%{transform:translate(100%);}
50%{opacity:0;transform:translate(-100%);}
51%{opacity:1;}
}