/*
 * DO NOT EDIT THIS FILE.
 * It's generated automatically by 'npm run build' command.
 * @preserve
 */

  .card-item-product-or-customer {
  padding: 0;
  height: 21.4375rem;
}

  /* // Override gutters for product/customer card grid. */
  .card-item-product-or-customer[class*="col-"] {
    padding: 0 0.625rem;
    margin: 0.625rem 0;
  }
  @media (max-width: 1199.98px) {

  .card-item-product-or-customer {
    height: 14.625rem
}
  }
  @media (max-width: 1023.98px) {

  .card-item-product-or-customer {
    height: 21.4375rem
}
  }
  .card-item-product-or-customer__container {
    padding: 1.25rem 1.875rem 0.3125rem;
    position: absolute;
    height: auto;
    min-height: 7.8125rem;
    max-width: 100%;
    width: 100%;
    bottom: 0;
    color: var(--colors-white-10);
    transition: height 0.25s, opacity 0.3s;
    z-index: 1;
  }
  .card-item-product-or-customer__image {
    position: absolute;
    height: 100%;
    width: 100%;
    z-index: 0;
    transition: all 0.5s ease;
  }
  .card-item-product-or-customer__image img {
      height: 100%;
      -o-object-fit: cover;
      object-fit: cover;
      width: 100%;
    }
  .card-item-product-or-customer__info {
    position: relative;
    z-index: 1;
  }
  .card-item-product-or-customer__title-alignment {
    position: relative;
    display: block;
    width: 100%;
    text-align: left;
  }
  .card-item-product-or-customer__title-alignment--center {
    text-align: center;
  }
  .card-item-product-or-customer__title-alignment--right {
    text-align: right;
  }
  .card-item-product-or-customer__title {
    font: var(--font-primary-h5-default);
    display: block;
    width: 100%;
    margin: 0;
  }
  .card-item-product-or-customer__description {
    font: var(--font-primary-caption-default);
    opacity: 1;
  }
  @media (min-width: 1024px) {
  .card-item-product-or-customer__description {
      font-size: 0;
      opacity: 0
  }
    }
  .card-item-product-or-customer__description * {
    font: var(--font-primary-caption-default);
  }
  @media (min-width: 1024px) {
  .card-item-product-or-customer__description * {
      font-size: 0;
      line-height: normal
  }
    }
  .card-item-product-or-customer__shading {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    opacity: 0.77;
    background: var(--colors-white-10);
  }
  .card-item-product-or-customer__shading + div h3,
    .card-item-product-or-customer__shading + div p,
    .card-item-product-or-customer__shading + .card-item-product-or-customer__info {
      color: var(--colors-black-suede-60);
    }
  .card-item-product-or-customer__shading--white {
      background: var(--colors-white-10);
    }
  .card-item-product-or-customer__shading--white + div h3,
      .card-item-product-or-customer__shading--white + div p,
      .card-item-product-or-customer__shading--white + .card-item-product-or-customer__info {
        color: var(--colors-black-suede-60);
      }
  .card-item-product-or-customer__shading--blue {
      background: var(--colors-blue-60);
    }
  .card-item-product-or-customer__shading--blue + div h3,
      .card-item-product-or-customer__shading--blue + div p,
      .card-item-product-or-customer__shading--blue + .card-item-product-or-customer__info {
        color: var(--colors-white-10);
      }
  .card-item-product-or-customer__shading--black {
      background: rgba(0,0,0,0.77);
    }
  .card-item-product-or-customer__shading--black + div h3,
      .card-item-product-or-customer__shading--black + div p,
      .card-item-product-or-customer__shading--black + .card-item-product-or-customer__info {
        color: var(--colors-white-10);
      }
  .card-item-product-or-customer a {
    position: relative;
    height: 100%;
    width: 100%;
    overflow: hidden;
    display: block;
  }
  .card-item-product-or-customer a:hover {
      outline: solid 0.125rem var(--colors-sea-green-60);
      box-shadow: 0 0 0.5625rem 0 rgba(0, 0, 0, 0.77);
      text-decoration: none;
    }
  .card-item-product-or-customer a:hover .card-item-product-or-customer__container {
        opacity: 1;
        height: 100%;
        transition: height 0.25s;
      }
  .card-item-product-or-customer a:hover .card-item-product-or-customer__info {
        top: 50%;
        transition: all .5s ease;
        transform: translateY(-50%);
      }
  .card-item-product-or-customer a:hover .card-item-product-or-customer__shading-hover--black {
        background: var(--colors-black-60);
      }
  .card-item-product-or-customer a:hover .card-item-product-or-customer__shading-hover--black + div h3,
        .card-item-product-or-customer a:hover .card-item-product-or-customer__shading-hover--black + div p,
        .card-item-product-or-customer a:hover .card-item-product-or-customer__shading-hover--black + .card-item-product-or-customer__info {
          color: var(--colors-white-10);
        }
  .card-item-product-or-customer a:hover .card-item-product-or-customer__shading-hover--grey {
        background: var(--colors-black-suede-60);
      }
  .card-item-product-or-customer a:hover .card-item-product-or-customer__shading-hover--grey + div h3,
        .card-item-product-or-customer a:hover .card-item-product-or-customer__shading-hover--grey + div p,
        .card-item-product-or-customer a:hover .card-item-product-or-customer__shading-hover--grey + .card-item-product-or-customer__info {
          color: var(--colors-white-10);
        }
  .card-item-product-or-customer a:hover .card-item-product-or-customer__description {
        transition: font-size 0.25s, opacity 0.5s 0.25s
      }
  @media (min-width: 1024px) {
        .card-item-product-or-customer a:hover .card-item-product-or-customer__description {
          font: var(--font-primary-caption-default);
          opacity: 1;
        }

        .card-item-product-or-customer a:hover .card-item-product-or-customer__description * {
          font: var(--font-primary-caption-default);
        }
      }
  @media (min-width: 1024px) {
        .card-item-product-or-customer__size--50 a .card-item-product-or-customer__container {
          align-content: center;
          align-items: flex-start;
          display: flex;
          flex-direction: row;
          flex-wrap: wrap;
          justify-content: flex-start;
          height: 100%;
          width: 50%;
        }

        .card-item-product-or-customer__size--50 a .card-item-product-or-customer__info {
          flex: 0 1 100%;
        }

        .card-item-product-or-customer__size--50 a .card-item-product-or-customer__description {
          transition: opacity 0.25s, font-size 0.5s 0.25s;
        }
          .card-item-product-or-customer__size--50 a:hover .card-item-product-or-customer__info {
            top: 0;
            transform: none;
          }
    }
  .card-item-product-or-customer__text-position--right .card-item-product-or-customer__container {
      float: right;
    }