.site-footer {
  @include clearfix();

  @include media-breakpoint-down(xs) {
    height: auto;
  }
  height: $site-footer-height;
  padding: $site-footer-vertical-padding $page-horizontal-padding;
  background-color: $site-footer-bg;
  border-top: 1px solid $site-footer-divider-color;

  &-legal {
    float: left;
  }

  &-actions {
    float: right;
  }

  &-right {
    float: right;
  }

  .scroll-to-top {
    color: $text-color;

    &, &:hover, &:active {
      text-decoration: none;
    }
  }

  &-legal, &-right, &-actions {
    @include media-breakpoint-down(xs) {
      display: block;
      float: none;
      text-align: center;
    }
  }
}