.tx-vc-vhb-category-pages {
  max-width: 846px;
  margin: auto;

  &[data-cardslayout="4"] {
    max-width: 1144px;

    .box {
      max-width: 250px;
      width: 25%;

      &:nth-child(4) {
        margin-top: 0;
      }
    }
  }

  .box {
    max-width: 250px;
    width: 33%;
    margin-top: 30px;
    padding:0;

    &:nth-child(1),
    &:nth-child(2),
    &:nth-child(3) {
      margin-top: 0;
    }
  }

  .opacity-box {
    position: relative;
  }

  .box-image {
    opacity: 1;
    display: block;
    min-width: 100%;
    height: auto;
    transition: .5s ease;
    backface-visibility: hidden;
  }

  .opacity-box-text {
    transition: .5s ease;
    opacity: 0;
    position: absolute;
    top: 0;
    font-weight: 600;
  }

  .opacity-box:hover {
    .box-image {
      opacity: 0.25;
      background-color: rgba(245, 218, 95, 1);
      filter: blur(5px);
    }

    .opacity-box-text {
      opacity: 1;
    }
  }
}

@media (max-width: 1081px) {
  .tx-vc-vhb-category-pages {
    .box {
      max-width: 50%;
      width: 50%;
      padding: 0 5px!important;

      &:nth-child(3) {
        margin-top: 30px;
      }
    }

    .opacity-box:hover {
      .box-image {
        opacity: 1;
        background-color: none;
        filter: none;
      }
    }

    .opacity-box-text {
      opacity: 1;
      position: initial;
    }

    &[data-cardslayout="4"] {

      .box {
        &:nth-child(1) {
          margin-top: 30px;
        }
      }
    }
  }
}