.login-navigation {
  margin: 24px auto;
  max-width: 1296px;
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}

.login-navigation .button--secondary {
  border: 1px solid #e0e0e0;
}

.login-navigation .button--secondary:hover {
  border: 1px solid rgba(var(--color-button-text),var(--alpha-button-background));
  color: rgba(var(--color-button-text),var(--alpha-button-background));
}

.login-navigation .button {
  padding: 10px;
}

@media screen and (min-width: 768px) {
  .login-navigation {
    gap: 24px;
  }

  .login-navigation .button {
    padding: 10px 30px;
  }
}