1- Yes there is;
Open this JPG background image:
ROOt//templates/<yourjoomlatemplate>/html/com_virtuemart/assets/images/Flexible/checkoutBack.jpg
And change to whatever you want.
The shopping cart elements use this DIV element: <div class="checkout-content">
This DIV CLASS defined as:
.checkout-content {
border-left:thin solid #a5a5a5;
border-right:thin solid #a5a5a5;
border-bottom:thin solid #a5a5a5;
padding:15px;
margin-top:-10px;
margin-bottom:10px;
background: url(../images/Flexible/checkoutBack.jpg) repeat-x #e2ddd9;
}
in
ROOT/templates/<yourjoomlatemplate>/html/com_virtuemart/assets/css/flexibleVM2Global.css
You would see this in couple seconds if you were using "firebug" to investigate your website.
More more info about "firebug" look at this topic:
www.flexiblewebdesign.com/forum-virtuemart-2-template-puremart-support/342-using-firebug-for-customization-or-troubleshooting
2- to remove the background from category boxes; in this CSS file:
ROOT/templates/<yourjoomlatemplate>/html/com_virtuemart/assets/css/flexibleVM2Global.css
Find this CSS rules and modify them as you wish
.FWcategorybox {
background: url("../images/Flexible/categorybox-back.png") repeat scroll 0 0 transparent;
border: thin solid #E3E3E3;
margin:0 2px 2px 0;
text-align:center;
}
.FWcategorybox:hover {
-moz-box-shadow:inset 0px 0px 10px #bdbdbd;
-webkit-box-shadow:inset 0px 0px 10px #bdbdbd;
box-shadow:inset 0px 0px 10px #bdbdbd;
-webkit-transition: all 250ms ease-in 0ms; /* property duration timing-function delay */
-moz-transition: all 250ms ease-in 0ms;
-o-transition: all 250ms ease-in 0ms;
transition: all 250ms ease-in 0ms;
}
3- You can't unless you are familiar with CSS, and looks like you are not.
But here is my guide to you, I can't give you the full instruction because it is a custom modification, and our free support doesn't cover custom modifications.
Open this CSS file:
ROOT/templates/<yourjoomlatemplate>/html/com_virtuemart/assets/css/flexibleVM2Global.css
Find this CSS rule:
div.addtocart-bar span.FlexibleCSS3Button input.addtocart-button, div.FlexibleWebaddtocart-area div.Flexibleaddtocart-bar span.FlexibleCSS3Button input.addtocart-button{
padding-top:5px;
display:block;
font-size:12px;
white-space:nowrap;
color:#fff;
-webkit-transition:all 0.3s linear;
-moz-transition:all 0.3s linear;
-o-transition:all 0.3s linear;
transition:all 0.3s linear;
background:none;
border:none;
height:28px;
padding:0 20px;
cursor:pointer;
}
And in this CSS rule add these 3 rules:
background: url(the url of the image you want to replace the text with an icon);
overflow:hidden; (this is necessary to get rid of the TEXT)
padding-top:100px; (you are moving the add-to-cart TEXT to 100px down, and since there is overflow:hidden; exist, the text will be invisible.
Regards.
Forum Support.