CryptoExchange.Net/docs/assets/sass/_footer.scss

/* =================================== */
/*  6. Footer
/* =================================== */

#footer {
  background: #fff;
  color: #252b33;
  margin-left:260px;
  padding: 66px 0px;
  padding: 4.125rem 0;
  .nav {
    .nav-item {
      display: inline-block;
      line-height: 12px;
      margin: 0;
      .nav-link {
        color: #252b33;
        -webkit-transition: all 0.2s ease;
        transition: all 0.2s ease;
        &:focus {
          color: $primary-color;
          -webkit-transition: all 0.2s ease;
          transition: all 0.2s ease;
        }
      }
	  &:first-child .nav-link {
        padding-left: 0px;
      }
      &:last-child .nav-link{
        padding-right: 0px;
      }
    }
    .nav-link:hover {
      color: $primary-color;
      -webkit-transition: all 0.2s ease;
      transition: all 0.2s ease;
    }
  }
  .footer-copyright {
    border-top: 1px solid #e2e8ea;
    padding: 0px 0px;
    color: #67727c;
    .nav {
      .nav-item .nav-link {
        color: #67727c;
      }
      .nav-link:hover {
        color: $primary-color;
        -webkit-transition: all 0.2s ease;
        transition: all 0.2s ease;
      }
    }
  }
  .nav.flex-column .nav-item {
    padding: 0px;
    .nav-link {
      margin: 0.7rem 0px;
    }
  }
  &.footer-text-light {
    color: rgba(250, 250, 250, 0.8);
    .nav .nav-item .nav-link {
      color: rgba(250, 250, 250, 0.8);
      &:hover {
        color: rgba(250, 250, 250, 1);
      }
    }
    .footer-copyright {
      border-color: rgba(250, 250, 250, 0.15);
      color: rgba(250, 250, 250, 0.5);
    }
    &:not(.bg-primary) .social-icons-light.social-icons li a {
      color: rgba(250, 250, 250, 0.8);
      &:hover {
        color: rgba(250, 250, 250, 1);
      }
    }
    &.bg-primary {
      color: #fff;
      .nav .nav-item .nav-link {
        color: #fff;
        &:hover {
          color: rgba(250, 250, 250, 0.7);
        }
      }
      .footer-copyright {
        border-color: rgba(250, 250, 250, 0.15);
        color: rgba(250, 250, 250, 0.9);
      }
      :not(.social-icons) a {
        color: #fff;
        &:hover {
          color: rgba(250, 250, 250, 0.7);
        }
      }
    }
  }
}

@include media-breakpoint-down(sm) {
#footer {
	margin-left:0px;
}
}


/*=== 6.1 Social Icons ===*/
.social-icons {
  margin: 0;
  padding: 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  list-style: none;
  li {
    margin: 0px 6px;
    padding: 0;
    overflow: visible;
    a {
      display: block;
      height: 26px;
      line-height: 26px;
      width: 26px;
      font-size: 18px;
      text-align: center;
      color: #4d555a;
      text-decoration: none;
	  @include transition(all 0.2s ease);
    }
    i {
      line-height: inherit;
    }
  }
  &.social-icons-sm li{
    margin: 0px 4px;
  }
  &.social-icons-sm li a {
    font-size: 15px;
	width:22px;
  }
  &.social-icons-lg li a {
    width: 34px;
    height: 34px;
    line-height:34px;
    font-size: 22px;
  }
  &.social-icons-light li a {
    color: #eee;
  }
  &.social-icons-muted li a {
    color: #aab1b8;
  }
  li:hover {
    a {
      color: #999;
    }
  }
}


/*=== 6.2 Back to Top ===*/
#back-to-top {
  display: none;
  position: fixed;
  z-index: 1030;
  bottom: 8px;
  right: 10px;
  background-color: rgba(0, 0, 0, 0.22);
  text-align: center;
  color: #fff;
  font-size: 14px;
  width: 36px;
  height: 36px;
  line-height: 34px;
  border-radius:3px;
  @include transition(all 0.3s ease-in-out);
  @include box-shadow(0px 5px 15px rgba(0, 0, 0, 0.15));
  &:hover {
    background-color: $primary-color;
	@include box-shadow(0px 5px 15px rgba(0, 0, 0, 0.25));
	@include transition(all 0.3s ease-in-out);
  }
}

@include media-breakpoint-down(xs) {
  #back-to-top {z-index: 1029;}
}