/* Malli: @include icon($facebook)*/
.product-card {
  display: block;
  background-color: #ffffff;
  text-decoration: none;
  border-top: 0.125rem solid #585858;
  border-bottom: 0.125rem solid #585858;
  border-left: 0.125rem solid #585858;
  border-right: 0.125rem solid #585858;
  border-radius: 0.25rem;
  box-shadow: none;
  position: relative;
  transition: all 0.2s; }
  .product-card:hover, .product-card:active, .product-card:focus {
    text-decoration: none;
    box-shadow: none; }
    .product-card:hover .product-card-image-wrapper .product-card-image-container, .product-card:active .product-card-image-wrapper .product-card-image-container, .product-card:focus .product-card-image-wrapper .product-card-image-container {
      transform: scale(1.08); }
  .product-card:hover .product-card-content-wrapper .product-card-title, .product-card:active .product-card-content-wrapper .product-card-title, .product-card:focus .product-card-content-wrapper .product-card-title {
    color: #222222; }
  .product-card .product-card-image-wrapper {
    height: calc(15rem + 0.125rem);
    width: calc(100% + (0.125rem + 0.125rem));
    position: relative;
    top: calc(0.125rem * -1);
    left: calc(0.125rem * -1);
    background-color: #f2f2f2;
    overflow: hidden;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem; }
  @media screen and (max-width: 31.1875em) {
    .product-card .product-card-image-wrapper {
      height: calc(15rem * 0.8); } }
  .product-card .product-card-image-wrapper .product-card-image-container {
    transition: transform 1.3s;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem; }
  .product-card .product-card-image-wrapper .product-card-tag {
    position: absolute;
    top: 0.9375rem;
    bottom: initial;
    left: 0;
    right: initial;
    background-color: #f77c78;
    padding: 0.8125rem 0.9375rem 0.8125rem 0.8125rem;
    border-top-left-radius: 0rem;
    border-top-right-radius: 1.25rem;
    border-bottom-left-radius: 0rem;
    border-bottom-right-radius: 1.25rem;
    color: #ffffff;
    font-family: 'Assistant', Arial, Helvetica, sans-serif;
    font-size: 0.9375rem;
    line-height: 1;
    font-weight: 700;
    font-style: normal;
    letter-spacing: 0rem;
    text-transform: initial; }
  .product-card .product-card-image-wrapper .product-card-sale-tag {
    position: absolute;
    top: 0.9375rem;
    bottom: initial;
    left: initial;
    right: 0;
    background-color: #f77c78;
    padding: 0.8125rem 0.9375rem 0.8125rem 0.8125rem;
    border-top-left-radius: 1.25rem;
    border-top-right-radius: 0rem;
    border-bottom-left-radius: 1.25rem;
    border-bottom-right-radius: 0rem;
    color: #ffffff;
    font-family: 'Assistant', Arial, Helvetica, sans-serif;
    font-size: 0.9375rem;
    line-height: 1;
    font-weight: 700;
    font-style: normal;
    letter-spacing: 0rem;
    text-transform: initial; }
  .product-card .product-card-content-wrapper {
    padding: 1.875rem 1.875rem 0 1.875rem;
    overflow: hidden; }
  @media screen and (max-width: 31.1875em) {
    .product-card .product-card-content-wrapper {
      padding: calc(1.875rem * 0.75) calc(1.875rem * 0.75) 0 calc(1.875rem * 0.75); } }
  .product-card .product-card-content-wrapper .product-card-title {
    margin-top: 0;
    margin-bottom: 1.25rem;
    text-align: left;
    color: #222222;
    transition: all 0.2s; }
    .product-card .product-card-content-wrapper .product-card-title:last-child {
      margin-bottom: 0; }
  .product-card .product-card-content-wrapper .product-card-prices {
    margin-bottom: 1.25rem;
    text-align: left; }
    .product-card .product-card-content-wrapper .product-card-prices .main-price {
      display: inline-block;
      color: #222222;
      margin: 0 0 0rem 0; }
    .product-card .product-card-content-wrapper .product-card-prices .sub-price {
      color: #222222;
      display: block;
      margin: 0 0 0 0rem; }
    .product-card .product-card-content-wrapper .product-card-prices .line-through {
      text-decoration: line-through; }
  .product-card .product-card-bottom-wrapper {
    padding: 0 1.875rem 1.875rem 1.875rem; }
  @media screen and (max-width: 31.1875em) {
    .product-card .product-card-bottom-wrapper {
      padding: 0 calc(1.875rem * 0.75) calc(1.875rem * 0.75) calc(1.875rem * 0.75); } }
  .product-card .product-card-bottom-wrapper .product-card-stock-info {
    text-align: left;
    margin: 0; }
    .product-card .product-card-bottom-wrapper .product-card-stock-info .stock {
      color: #222222;
      margin: 0;
      line-height: 1; }
      .product-card .product-card-bottom-wrapper .product-card-stock-info .stock::before {
        content: '';
        display: inline-block;
        width: 0.9375rem;
        height: 0.9375rem;
        border-radius: 50%;
        margin-right: 0.5rem;
        position: relative;
        top: 0.125rem; }
        .product-card .product-card-bottom-wrapper .product-card-stock-info .stock.in-stock::before {
          background-color: #3adb76; }
      .product-card .product-card-bottom-wrapper .product-card-stock-info .stock.available-on-backorder::before {
        background-color: #ffae00; }
    .product-card .product-card-bottom-wrapper .product-card-stock-info .stock.out-of-stock::before {
      background-color: #cc342e; }

@media screen and (min-width: 64em) {
  .product-card-list-columns-4 .product-card-image-wrapper {
    height: calc(12.5rem + 0.125rem); }
  .product-card-list-columns-4 .product-card-content-wrapper {
    padding: 1.5625rem 1.5625rem 0 1.5625rem; }
  .product-card-list-columns-4 .product-card-bottom-wrapper {
    padding: 0 1.5625rem 1.5625rem 1.5625rem; } }

.product-cards-carousel-wrapper {
  margin-bottom: -0.9375rem;
  width: calc(100% + 1.875rem);
  position: relative;
  left: -0.9375rem;
  margin-top: -0.9375rem; }
  .product-cards-carousel-wrapper .product-card {
    margin: 0.9375rem; }
  .product-cards-carousel-wrapper.dots-on {
    margin-bottom: 2.5rem; }
  @media screen and (max-width: 87.5em) {
    .product-cards-carousel-wrapper {
      margin-bottom: 2.5rem; } }
@media screen and (max-width: 31.1875em) {
  .product-cards-carousel-wrapper {
    margin-bottom: calc(2.5rem * 0.7); } }