Change the font colour on discount prices

How can I change the font color on discounted items to RED, that is I would like the old price to be crossed out in red and the new price to be displayed in red.



-- url of the page with the problem -- : samorahouse.com
-- HikaShop version -- : 2.3.0 (Free version)
-- Joomla version -- : 2.5.19
-- PHP version -- : x.x.x
-- Browser(s) name and version -- : XXXXX x.x.x
-- Error-message(debug-mod must be tuned on) -- : Error_message

There is many way in css to have this. I give you somecode to adpat to your own code
I put the CSS inline but you can use the class name i put in the code to remove the inline css code .
a--use image overlay
b-use the HTML code ❌ to show a cross
b1 put this symbol inside a html tag p with selector and place the p box over the price like image overlay
b2 put in the box around the value you want the cross by using pseudo element after


a-- use an image overlay on top of the text ( z-index) . the image could be SVG ot png


<div class="cross" style="position:relative;width:100px;height:100px">
.......... <div class="price" style="position:absolute;top:0">20€</div>
...........<div class="old" style="position:absolute;bottom:0;right:0;color:red;">
.....................30€
.................... <div class="overlay" style="position: absolute; z-index: 999; background: url(cross.png);
............................. background-repeat: no-repeat; bottom: -71px; right: -56px; width: 88px; height: 100px;">
......................</div>
...........</div>
</div>


b2-- use CSS :before :after with an icon with font-face item set for content : X; that embed a cross symbol
Wingdings symbol http://all-free-download.com/free-vector/cross-check-mark.html .
perhaps the unicode value is this value &#x274c; rendering like ❌ see http://www.fileformat.info/info/unicode/char/274c/index.htm .
so the CSS code ll look like
selectorName:after {
content :"&#x274c;" ;
left: value;
to do position .....}

I hope the code ll help you