.footer {
  margin-top: auto;
  background-color: $gray4;

  &__container {
    color: rgba($black, .5);
    font-size: 12px;
    position: relative;
    z-index: 1;
  }

  &__columns,
  &__list {
    display: flex;
    align-items: center;
  }

  &__columns {
    justify-content: space-between;
  }

  &__list {
    padding-left: 0;
    margin: 0;
    list-style: none;
  }

  &__item {
    &+& {
      margin-left: 20px;
    }
  }

  &__link {
    color: rgba($black, .5);
    text-decoration: underline;
    transition: color .3s ease;

    &:hover,
    &:focus,
    &:active {
      color: rgba($black, 1);
    }
  }

  @media (max-width:1200px) {
    &__columns {
      max-width: 320px;
      margin: 0 auto;
      text-align: center;
      color: $black;
    }

    &__columns,
    &__list,
    &__item-span {
      display: block;
    }

    &__item {
      margin-bottom: 15px;

      &+& {
        margin-left: 0;
      }
    }

    &__link {
      color: rgba($black, 1);
  
      &:hover,
      &:focus,
      &:active {
        color: rgba($black, .5);
      }
    }
  }
}