footer {
  background: white;
  padding: $medium 0 $large 0;
  text-align: center;

  .footer-info {
    @media screen and (min-width: $tablet) {
      float: left;
      margin-right: $small;
    }
    p {
      color: $grey;
      font-family: $roboto;
      font-size: 12px;
      opacity: 0.5;
    }
    a {
      color: $grey;
    }
  }

  .social-buttons {
    margin-bottom: $small;
    @media screen and (min-width: $tablet) {
      float: left;
      margin-right: $small;
    }
    a {
      padding: $micro $tiny $micro $tiny;
      margin-right: $micro;
      background-color: $lightishGrey;
      color: white;
      border-radius: $borderRadius;
    }
    a:hover {
      background-color: $darkGreen;
    }
    a:active {
      background-color: $darkerGreen;
    }
  }
}