Venture theme - thumbnail images

[hunter_official]

Hello, I want to shrink the thumbnail images displayed at the product page, where i can find that code?

using Venture theme.

[suyash1]

@hunter_official  it can shrunk using custom css... can you please share your product page link?

[KetanKumar]

@hunter_official 

Thanks how do you like thum?

[hunter_official]

Yes, here is a link for example: https://hntwarehouse.com/products/summer-palm-t-shirt (pass; monitest)

Original:

wanted:

[KetanKumar]

@hunter_official 

yes, please check.

[hunter_official]

I want to make those thumbnail images SMALLER . 

[suyash1]

@hunter_official - can you please share page link with those thumbnail images?

[hunter_official]

Yes, https://hntwarehouse.com/collections/t-shirts/products/summer-palm-t-shirt (pass: monitest)

I have search some and found this code:

/*================ Product thumbnail layout ================*/
.product-single__thumbnails.slick-vertical .slick-slide {
  border: 0;
  padding: 2px 0;
}

.product-single__thumbnails {
  display: none;
  margin: 0 ($gutter-site * 2) $gutter-site;

  &.slick-initialized {
    display: block;
  }

  @include media-query($medium-up) {
    margin: 0;
  }
}

.product-single__thumbnails--static {
  display: block;
  text-align: center;

  @include media-query($small) {
    .product-single__thumbnail-item {
      display: inline-block;
      width: 45%;
      max-width: 150px;
    }
  }
}

.product-single__thumbnail {
  position: relative;
  display: block;
  height: $product-slider-image-height;
  padding: $product-slider-padding;
  max-width: 200px;
  margin: 0 auto;

  img {
    position: relative;
    top: 50%;
    @include transform(translateY(-50%));
    display: block;
    max-height: $product-slider-image-height - ($product-slider-padding * 2);
    margin: 0 auto;

    .no-csstransforms & {
      top: 0;
    }
  }

  .is-active &:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 3px solid $color-accent;
  }
}

But i don't know what to edit.

I will explain again, i want to SHRINK (make smaller) those thumbnails images.

[suyash1]

you want something like this?

if yes then following css to the end of theme.scss file, adjust numbers as per need

.product-single__thumbnail {height: 60px;    max-width: 60px;}

.product-single__thumbnail img{max-height: 60px;}

[hunter_official]

Thank you, how i can move them closer to the biggest image?

to make it look like this;