.logo_promo_slider-group {
  .logo_promo_slider-row {
    display: flex;
    justify-content: center;

    &.full-width {
      .logo_promo_slider {
        max-width: none;
      }
    }

    &.no-text-center {
      .logo_promo_slider {
        .title, .paragraph {
          text-align: left;
        }
      }
    }

    .logo_promo_slider {
      width: 100%;
      max-width: calculateRem(1200);

      .title, .paragraph {
        text-align: center;
        max-width: calculateRem(900);
        margin-left: auto;
        margin-right: auto;

        &:not(.animated) {
          visibility: hidden;
        }
      }

      .logos-container {
        display: flex;
        justify-content: center;
        align-items: center;

        position: relative;

        &.logos-1 {
          .logo {
            @include breakpoint(mobile) {
              width: 100%;
            }

            @include breakpoint(tablet) {
              width: 75%;
            }

            @include breakpoint(laptop)  {
              width: 25%;
            }
          }
        }

        &.logos-2 {
          .logo {
            @include breakpoint(mobile) {
              width: 100%;
            }

            @include breakpoint(tablet) {
              width: calc(50% - 15px);
            }

            @include breakpoint(laptop) {
              width: calc(25% - 15px);
            }

            &:first-child {
              @include breakpoint(tablet) {
                margin-right: calculateRem(30);
              }
            }
          }
        }

        &.logos-3 {
          .logo {
            @include breakpoint(mobile) {
              width: 100%;
            }

            @include breakpoint(tablet) {
              width: calc(33.333333% - 20px);
            }

            @include breakpoint(laptop) {
              width: calc(25% - 20px);
            }

            &:not(:nth-child(3)) {
              @include breakpoint(tablet) {
                margin-right: calculateRem(30);
              }
            }
          }
        }

        .icon-container {
          position: absolute;
          top: 45%;

          display: flex;
          justify-content: center;
          align-items: center;

          height: calculateRem(35);
          width: calculateRem(35);

          z-index: 99;

          border-radius: 50%;

          background-color: rgba($mid-gray, 0.81);

          &.next {
            right: calculateRem(-25);
          }

          &.previous {
            left: calculateRem(-25);
          }

          cursor: pointer;

          i {
            font-size: calculateRem(14);
            line-height: calculateRem(35);
          }
        }

        .logo {
          @include breakpoint(mobile) {
            width: 100%;
          }

          @include breakpoint(tablet) {
            width: calc(33.333333% - 20px);
          }

          @include breakpoint(laptop) {
            width: calc(25% - 22.5px);
          }

          &:not(:nth-child(3n)) {
            @include breakpoint(tablet) {
              margin-right: calculateRem(30);
            }
            @include breakpoint(laptop) {
              margin-right: 0;
            }
          }

          &:not(:nth-child(4n)) {
            @include breakpoint(laptop) {
              margin-right: calculateRem(30);
            }
          }

          &:not(.animated) {
            visibility: hidden;
          }

          &.animated {
            &:nth-of-type(1) {
              animation-delay: 0ms;
            }
            &:nth-of-type(2) {
              animation-delay: 300ms;
            }
            &:nth-of-type(3) {
              animation-delay: 600ms;
            }
            &:nth-of-type(4) {
              animation-delay: 900ms;
            }
          }

          .image-container {
            width: 100%;

            img {
              width: 100%;
            }
          }
        }
      }
    }
  }
}