.hsocial a { font-family: "Roboto", Arial, sans-serif; color: #000; font-size: 10px;}
.hsocial { list-style:none; padding:0; position:relative;left: 100px;}
.hsocial ul { padding: 0; margin: 0; }
.hsocial li {  padding:0; float:left; margin: 0 5px 0 0; }
.hsocial li a { display:block; width:25px; height:25px; position:relative; }
.hsocial li a strong { position: absolute; left: 0px; top: -25px;}

li.hsearch { background:url("/framework/img/zoom-16.png") #17456b; background-repeat:no-repeat; background-position:center; }
li.hfb { background:url("/framework/img/facebook-16.png") #17456b; background-repeat:no-repeat; background-position:center; }
li.htwitter { background:url("/framework/img/twitter-x-16.png") #17456b; background-repeat:no-repeat; background-position:center; }
li.hlinkedin { background:url("/framework/img/linkedin-16.png") #17456b; background-repeat:no-repeat; background-position:center; }
li.hpinterest { background:url("/framework/img/pinterest-16.png") #17456b; background-repeat:no-repeat; background-position:center; }
li.hinstagram { background:url("/framework/img/instagram-16.png") #17456b; background-repeat:no-repeat; background-position:center; }
li.hwsp { background:url("/framework/img/whatsapp-16.png") #17456b; background-repeat:no-repeat; background-position:center; }

.hsocial:hover li { opacity:0.3; }
.hsocial li { transition-property: opacity; transition-duration: 500ms; }
.hsocial li a strong { opacity:0; transition-property: opacity, top; transition-duration: 250ms;}
.hsocial li:hover { opacity:1; }
.hsocial li:hover a strong { opacity:1; }