Style Guide Product Card

Product Title:

font-size: 1.4rem;
font-weight: 400;
color: #333;
font-family: 'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;
font-style: normal;
display: block;
hyphens: auto;
margin: 5px 0;
word-wrap: break-word;

Price Label:
color: #666;
font-size: 12px;

Price:

font-size: 1.4rem;
font-weight: 700;
color: #333;

Hover:

background: #fff;
box-shadow: 3px 4px 4px 0 rgba(0,0,0,0.3);
border: 1px solid #bbb;
margin: -10px;
padding: 9px;
position: relative;
z-index: 2;

Once the product is hovered over a primary style button, add to wishlist, and add to compare show up below the price.

The majority of products will show one price, there are a few exceptions though.

Bundle products will show a From price and a To price, giving it a range based on which options the customer chooses.

Grouped products will show a Starting at price depending on what products are put in the group. Each product can be purchased separately, or as part of the group.

While there are no options for the individual card there are options for the area where the cards are contained.