/* Div that contains each product */
.productItem {
    border-style: solid;
    border-color: dimgrey;
    border-radius: .5em;
    padding: .25em;
    margin: auto;
    margin-bottom: .5em;
    max-width: 50em;
    display: grid;
    grid-template-columns: 10% 80% 10%;
    grid-template-areas:
    'image title price'
    'image description price';
}

/* Image div */
.productImageContainer {
    grid-area: image;
    position: relative;
}

/* Product Image */
.productImage {
    max-width: 50px;
    max-height: 50px;
    display: block;
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

/* Title div */
.productTitle {
    grid-area: title;
}

/* Price div */
.productPrice {
    grid-area: price;
    text-align: center;
    margin: auto;
}

/* Price text */
.productPrice * {
}

/* Description div */
.productDescription {
    grid-area: description;
}
