/* Social - Feeds */
.social-feeds {
  width: 100%;
  text-align: center;
  background: $primary-color;
  overflow: hidden;
  padding: 110px 0;

  h2{
    text-transform: none;
  }

  .row {
    padding: 0 0 40px 0;
    margin: 0 -5px -10px -5px;

    &:last-child {
      padding-bottom: 0;
    }

    > div {
      padding: 0 5px 10px 5px;
      margin: 0;

      .figure {
        width: 100%;
        text-align: center;
        overflow: hidden;

        img {
          width: 100%;
          -webkit-transition-duration: 0.3s;
          transition-duration: 0.3s;
          -webkit-transition-property: transform;
          transition-property: transform;
          -webkit-transform: translateZ(0);
          transform: translateZ(0);
        }

        a {
          width: 100%;
          float: left;
          font-weight: inherit;
          text-decoration: $link-hover-decoration-none;
        }

        a:hover img,
        a:focus img,
        a:active img {
          -webkit-transform: scale(1.1);
          transform: scale(1.1);
        }
      }
    }
  }


  @include media-breakpoint-up(md) {
    .container {
      max-width: 1050px;
    }

    .row {
      padding-bottom: 60px;
      margin: 0 -15px -30px -15px;

      > div {
        padding: 0 15px 30px 15px;
      }
    }
  }


  @include media-breakpoint-between(md, lg) {
    .row {
      padding: 0 0 50px 0;
      margin: 0 -10px -20px -10px;

      > div {
        padding: 0 10px 20px 10px;
      }
    }
  }

  @include media-breakpoint-down(xl) {
    padding: 80px 0;
  }

  @include media-breakpoint-down(md) {
    padding: 60px 0;
  }
}

/* Social - Links */
.social-links {
  width: 100%;
  float: none;
  display: inline-block;
  vertical-align: top;
  text-align: center;

  p {
    font-weight: $font-weight-bold;
    font-size: $font-size-18;
    color: $primary-color;
    line-height: $line-height-20;
    padding-bottom: 20px;

    &:last-child {
      padding-bottom: 0;
    }
  }

  ul {
    float: none;
    display: inline-block;
    vertical-align: middle;
    padding: 0;
    margin: 0 -8px -20px -8px;

    li {
      float: none;
      display: inline-block;
      vertical-align: middle;
      padding: 0;
      margin: 0 8px 20px 8px;

      &:before {
        display: none;
      }

      img {
        max-height: 80px;
        height: 80px;
      }

      a {
        text-decoration: $link-hover-decoration-none;

        &:hover,
        &:focus,
        &:active {
          opacity: .90;
        }
      }
    }
  }

  @include media-breakpoint-down(xxl) {
    ul {
      margin: 0 -10px -10px -10px;

      li {
        margin: 0 3px 10px 3px;

        img {
          max-height: 60px;
          max-width: 60px
        }
      }
    }
  }

  @include media-breakpoint-down(md) {
    ul {
      li {
        img {
          max-height: 60px;
          max-width: 60px;
        }
      }
    }
  }

  @media (max-width: 389px) {
    ul {
      li {
        img {
          max-height: 55px;
        }
      }
    }
  }
}