Hi,
Well, first you have some old CSS that has been removed since a while ago in your HikaShop frontend CSS.
Remove this CSS from there:
.hikashop_previous_product {
background-color: transparent !important;
float:left;
width: 6px;
height: 6px;
background:url(../images/icons/nav_products.png) no-repeat 5px -20px;
margin-bottom:10px;
padding:5px;
border:1px solid #ddd;
border-radius:3px;
margin-right:4px
}
.hikashop_previous_product:hover {
background:url(../images/icons/nav_products.png) no-repeat 5px 3px;
}
.hikashop_next_product {
background-color: transparent !important;
float:left;
width: 6px;
height: 6px;
background:url(../images/icons/nav_products.png) no-repeat -30px -20px;
margin-bottom:10px;
padding:5px;
border:1px solid #ddd;
border-radius:3px;
margin-right:4px;
}
.hikashop_next_product:hover {
background:url(../images/icons/nav_products.png) no-repeat -30px 3px;
}
and you'll see that the next/previous buttons look a lot better:
i.imgur.com/GZh38eh.png
You can do so under the Display tab of the HikaShop configuration.
If you still want to change the icon, it's possible with custom CSS.
For example:
.hikashop_next_product i{ display:none; }
.hikashop_next_product{ background:url(URL_OF_YOUR_IMAGE) no-repeat; }