.logos-slider {
  .all-logos {
    background: $white-color;

    .slick-list {
      margin: 0 60px;
      padding: 20px 0;
    }

    .slick-arrow {
      outline: none;
      top: calc(50% - 20px);
      width: 40px;
      height: 40px;
      color: transparent;
      font-size: 0;
      line-height: 40px;
      border-radius: 50%;
      border: none;
      background-color: rgba(0, 0, 0, .2);
      padding: 0;
      position: absolute;
      transition: all 0.3s ease-in-out;

      &:hover {
        background-color: $main-color;
      }

      &::before {
        content: "";
        top: 13px;
        width: 13px;
        height: 13px;
        border-style: solid;
        border-color: $white-color;
        position: absolute;
      }

      &.slick-prev {
        left: 10px;

        &::before {
          left: 16px;
          border-width: 0 0 2px 2px;
          transform: rotate(45deg);
        }
      }

      &.slick-next {
        right: 10px;

        &::before {
          left: 11px;
          border-width: 0 2px 2px 0;
          transform: rotate(-45deg);
        }
      }
    }

    .slide-item {
      outline: none;
      border: 1px solid rgba(0, 0, 0, .1);
      margin: 0 5px;

      &:hover {
        box-shadow: 0 3px 20px 1.2px rgba(0, 0, 0, .2);
      }

      &__block {
        padding: 30px 0;

        a {
          outline: none;
        }

        p {
          margin: 0;
        }

        img {
          max-width: 100px;
          max-height: 100px;
          margin: 0 auto;
        }
      }
    }
  }
}