.container
  h1 No slider
  .items.no-slick
    div
      .item
        .item-content hover me
        .item-bottom
    div
      .item
        .item-content hover me
        .item-bottom
    div
      .item
        .item-content hover me
        .item-bottom
    div
      .item
        .item-content hover me
        .item-bottom
    div
      .item
        .item-content hover me
        .item-bottom
  h1 Slider
  .items.slick
    div
      .item
        .item-content hover me
        .item-bottom
    div
      .item
        .item-content hover me
        .item-bottom
    div
      .item
        .item-content hover me
        .item-bottom
    div
      .item
        .item-content hover me
        .item-bottom
    div
      .item
        .item-content hover me
        .item-bottom
  h1 title

.container {
  margin-top: 30px;
  max-width: 1170px;
  margin-left: auto;
  margin-right: auto;
}

.items {
  display: flex;
}

.no-slick > div {
  width: calc(25% - 30px);
  margin: 0 15px;
}

.slick > div {
  width: 100%;
}

.item {
  margin: 0 15px;
  border: 1px solid #909090;
  position: relative;
  &:hover {
    .item-bottom {
      display: block;
    }
  }
  &-content {
    height: 40px;
    background: #e6e6e6;
  }
  &-bottom {
    height: 60px;
    background: #131313;
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    display: none;
  }
}

.slick > div {
width: 100%;
height: 200px;
}

$('.slick').slick({
  slidesToShow: 4,
  autoplay: true,
  autoplaySpeed: 1000,
})