/* Added fallbacks to help with CLS, feel free to remove if it doesn't help on your project */
/* Colours */
/* Fluid heading sizes - set your min/max sizes and you're done! */
/* Some device sizes to use with min-width */
/* adjusted breakpoints for above */
/* 100% widths look better than "Snapping" IMO */
/* Utility */
/* Additional Spacers -- don't think you'll need more than 7, but if you do -- maybe just use a custom class  :)  */
.product-cats {
  padding: 100px 0; }
  .product-cats h2 {
    color: #EE9F16;
    margin-bottom: 2.5rem; }
  .product-cats .cards-row .card {
    z-index: 9;
    padding: 8px 8px; }
    .product-cats .cards-row .card a {
      box-shadow: 0px 0px 10px #00000029;
      text-align: center;
      display: flex;
      flex-direction: column;
      background-color: #FFFFFF;
      padding: 2rem 2.8rem;
      height: 100%; }
      .product-cats .cards-row .card a p:first-of-type {
        margin-bottom: 1rem; }
        .product-cats .cards-row .card a p:first-of-type i {
          font-size: 52px;
          color: #EE9F16; }
      .product-cats .cards-row .card a p:nth-of-type(2) {
        font-size: 18px; }
      .product-cats .cards-row .card a p:last-of-type {
        margin-top: auto; }
      .product-cats .cards-row .card a h3 {
        margin-bottom: 1rem; }
      .product-cats .cards-row .card a span {
        background-color: #EE9F16;
        padding: 12px 1.5rem;
        color: #FFFFFF;
        display: inline-block;
        font-size: 18px; }
      .product-cats .cards-row .card a:hover {
        background-color: #EE9F16; }
        .product-cats .cards-row .card a:hover i,
        .product-cats .cards-row .card a:hover h3,
        .product-cats .cards-row .card a:hover p {
          color: #FFFFFF !important; }
        .product-cats .cards-row .card a:hover span {
          background-color: #FFFFFF;
          color: #EE9F16; }
  .product-cats .product-cat-slider {
    position: relative; }
    .product-cats .product-cat-slider .owl-nav {
      position: absolute;
      top: 32%;
      left: 10px;
      display: flex;
      justify-content: space-between;
      padding: 0;
      width: 100%; }
      .product-cats .product-cat-slider .owl-nav button {
        height: 48px;
        width: 48px;
        background-color: #EE9F16 !important;
        border-radius: 50%;
        box-shadow: 0px 3px 6px #00000029; }
        .product-cats .product-cat-slider .owl-nav button.owl-prev {
          margin-left: -25px !important; }
        .product-cats .product-cat-slider .owl-nav button.owl-next {
          margin-right: -8px !important; }
        .product-cats .product-cat-slider .owl-nav button i {
          color: #FFFFFF;
          font-size: 22px; }
    .product-cats .product-cat-slider .owl-stage-outer {
      margin-bottom: 50px;
      padding: 0; }
    .product-cats .product-cat-slider .owl-dots {
      margin-bottom: 0px; }
      .product-cats .product-cat-slider .owl-dots button span {
        height: 24px !important;
        width: 24px !important;
        background-color: #C2BFBF !important; }
      .product-cats .product-cat-slider .owl-dots button.active span {
        background-color: #EE9F16 !important; }