[SOLVED] Replace + and - b4 "Add to cart" Button

Hello there

I would like to replace the "+" and "-" Button with my own Buttons (gifs). Because I use the red_style.css, the "+" and "-" is not really visible. In the attached files, you can see what I mean and what I would like todo.

I have added in the red_style.css in the following sections the following code (background-image I mean):

#hikashop_product_quantity_field_change_plus{
	width:15px;
	height:15px;
	display:block;
	background-image:url(../../../images/plus.gif);
}
	
#hikashop_product_quantity_field_change_minus{
	width:15px;
	height:15px;
	display:block;
	background-image:url(../../../images/minus.gif);
}

I made a step: a big mistake from my side was to begin a CSS-Section with a # instead of a .! Don't ask why I did that It seems, that I have no idea what I'm doing in a CSS

Then I had to enlarge the size to 25px by 25px and remove the background color from CSS-Section called "hikashop_product_quantity_field_change" (/** background-color:#c10303; */)

I also removed the whole section: .hikashop_product_quantity_field_change:hover (since it don't look good)

Now there is only 1 problem left:
How do I remove this little red "+" and "-"? (see Screenshoot) that is now printed by some code (not the +/- right side of the arrow!).

Thanks for your help!
Best regards
Mike

The final code blocks are:

.hikashop_product_quantity_field_change_plus{
    width:24px;
    height:24px;
    display:block;
    background-image:url(../../../images/plus.png);
    color:transparent !important;
}

.hikashop_product_quantity_field_change_minus{
    width:24px;
    height:24px;
    display:block;
    background-image:url(../../../images/minus.png);
    color:transparent !important;
}

.hikashop_product_quantity_field_change {
    background-color: #C10303;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: bold;
    margin-right: 15px;
    text-align: center;
}