.github-button {
  @include themify() {
    @extend %button;
    & path {
      color: getThemifyVariable('primary-text-color');
    }
    &:hover path, &:active path {
      fill: $white;
    }
    &:hover, &:active {
      background-color: getThemifyVariable('secondary-text-color');
      border-color: getThemifyVariable('secondary-text-color');
    }
  }
  width: #{300 / $base-font-size}rem;
  display: flex;
  justify-content: center;
  align-items: center;
}

.github-icon {
  margin-right: #{10 / $base-font-size}rem;
}


.google-button {
  @include themify() {
    @extend %button;
    & path {
      color: getThemifyVariable('primary-text-color');
    }
    &:hover path, &:active path {
      fill: $white;
    }
    &:hover, &:active {
      background-color: getThemifyVariable('secondary-text-color');
      border-color: getThemifyVariable('secondary-text-color');
    }
  }
  margin-top: #{4 / $base-font-size}rem;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: #{300 / $base-font-size}rem;
}

.google-icon {
  width: #{32 / $base-font-size}rem;
  height: #{32 / $base-font-size}rem;
  margin-right: #{10 / $base-font-size}rem;
}