/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */


.products-container {
  margin-right: auto;
  margin-left: auto;
  width: 100%;
}

.products-container .product-col {
  padding: 1rem;
}

.products-container a {
  text-decoration: none !important;
}

@media only screen and (min-width:320px) {
  .products-container .product-col {
    float: left;
    width: 50%;
    text-align: center;
  }
}

@media only screen and (min-width:960px) {
  .products-container .product-col {
    width: 25%;
    text-align: center;
  }
}

.product-content {
  padding-left: 0.5rem;
  text-align: left;
}

.product-title {
  color: #303938;
  font-weight: 700;
  font-size: 15px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
}

.product-info {
  color: #303938;
  font-size: 13px;
}

.product-price {
  color: #303938;
  font-weight: 700;
  font-size: 15px;
}