.category-preview .top-block {
  width: 100%;
}

.category-preview .img-block {
  padding-bottom: 70%;
  width: 100vw;
  position: relative;
  overflow: hidden;
}

.category-preview .img-block a {
  transition: transform .35s cubic-bezier(.3, .86, .36, .95);
  background-size: cover;
  background-position: 50% 50%;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}

.category-preview .img-block a:hover {
  transform: scale(1.08, 1.08);
}

@media (min-width: 768px) {
  .category-previews-list {
    display: flex;
    flex-wrap: wrap;
  }

  .category-previews-list .category-preview {
    width: 50%;
  }

  .category-previews-list .category-preview:nth-child(odd) {
    justify-content: flex-end;
  }

  .category-previews-list .category-preview:nth-child(odd) .top-block {
    padding-right: 20px;
  }

  .category-previews-list .category-preview:nth-child(even) .top-block {
    padding-left: 20px;
  }

  .category-preview {
    display: flex;
    flex-wrap: wrap;
  }

  .category-preview .img-block {
    width: 50vw;
    padding-bottom: 100%;
    flex: 1 0 auto;
  }
}

@media (min-width: 1024px) {
  .category-previews-list .category-preview:nth-child(odd) .top-block {
    padding-right: 39px;
  }

  .category-previews-list .category-preview:nth-child(even) .top-block {
    padding-left: 39px;
  }
}

@media (min-width: 1366px) {
  .category-previews-list .category-preview:nth-child(odd) .top-block {
    padding-right: 84px;
  }

  .category-preview .img-block {
    padding-bottom: 74%;
  }
}

@media (max-width: 767px) {
  .category-preview .img-block {
    left: 50%;
    transform: translateX(-50%);
  }
}

