Hi,
First of disable the "GZIP" compression to see which element is controlled by which CSS file.
Then take a look at this forum thread to make the CSS changes:
www.flexiblewebdesign.com/forum-virtuemart-2-template-puremart-support/342-using-firebug-for-customization-or-troubleshooting
You should start using "Firebug" for CSS modification (changing the background of elements or changing the font size).
The CSS file you are going to make the change is this:
cornilleau.com.pl/templates/yoo_capture/html/com_virtuemart/assets/css/flexibleVM2Global.css
And the CSS rules;
- To change the background color of add to cart button:
Change the
background: rule. You should better use a Gradient CSS3 background color. To create your own, you can use this website:
www.colorzilla.com/gradient-editor/
.FlexibleCSS3ButtonInner {
overflow: hidden;
-webkit-border-radius: 40px;
-moz-border-radius: 40px;
border-radius: 40px;
position: relative;
display: block;
height: 40px;
background: rgb(143,200,0);
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzhmYzgwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM2NjhlMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, rgba(143,200,0,1) 0%, rgba(102,142,0,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(143,200,0,1)), color-stop(100%, rgba(102,142,0,1)));
background: -webkit-linear-gradient(top, rgba(143,200,0,1) 0%, rgba(102,142,0,1) 100%);
background: -o-linear-gradient(top, rgba(143,200,0,1) 0%, rgba(102,142,0,1) 100%);
background: -ms-linear-gradient(top, rgba(143,200,0,1) 0%, rgba(102,142,0,1) 100%);
background: linear-gradient(top, rgba(143,200,0,1) 0%, rgba(102,142,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8fc800', endColorstr='#668e00', GradientType=0 );
-webkit-box-shadow: 0px 0px 7px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(188,188,188,0.1);
-moz-box-shadow: 0px 0px 7px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(188,188,188,0.1);
box-shadow: 0px 0px 7px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(188,188,188,0.1);
-webkit-transition: box-shadow 0.3s ease-in-out;
-moz-transition: box-shadow 0.3s ease-in-out;
-o-transition: box-shadow 0.3s ease-in-out;
transition: box-shadow 0.3s ease-in-out;
}
- To change the font size of add to cart button:
(change the
font-size:14px; and make it smaller)
input.FlexibleCSS3Button-text, a.FlexibleCSS3Button-text, span.FlexibleCSS3Button-text {
font-size: 14px;
color: #fff;
font-weight: bold;
text-shadow: 1px 1px rgba(0,0,0,0.2);
text-transform: uppercase;
display: block;
border: none !important;
background: none !important;
width: 100% !important;
box-shadow: none !important;
margin: 0px !important;
padding: 0px 10px 0px 60px !important;
height: 40px !important;
z-index: 1;
position: relative;
}
But "Firebug" will tell you these already. I am just giving you a hint as a start.
I browsed your website with Chrome but didn't see any problem with the "social buttons" layout. Everything looks good to me.
Attachment ScreenShot2013-12-03at6.08.52AM.png not found
Regards,
Support.