.gh-main-button {
  color: var(--color-buttons-main-text);
  background-color: var(--background-color-button);
  font-size: var(--font-size-main-buttons);
  font-weight: var(--font-weight-button);
  line-height: var(--font-button-line-height);
  border-radius: var(--border-radius-buttons);
  transition: opacity 0.25s ease;
  padding: var(--padding-buttons);
  letter-spacing: var(--letter-spacing-buttons);
  text-transform: var(--text-transform-buttons);
  width: max-content;
}

.gh-main-button:hover {
  opacity: 0.85;
}

.gh-secondary-button {
  color: var(--color-buttons-secondary-text);
  background-color: var(--color-buttons-secondary);
  font-size: var(--font-size-main-buttons);
  font-weight: var(--font-weight-button);
  line-height: var(--font-button-line-height);
  transition: background-color 0.25s ease;
  border-radius: var(--border-radius-buttons);
  padding: var(--padding-buttons);
  letter-spacing: var(--letter-spacing-buttons);
  text-transform: var(--text-transform-buttons);
}

.gh-secondary-button:hover {
  background-color: var(--color-buttons-secondary-hover);
}

.gh-thin-banner-button {
  color: var(--color-buttons-main-text);
  background-color: var(--background-color-button);
  font-size: var(--font-size-main-buttons);
  font-weight: var(--font-weight-button);
  line-height: var(--font-button-line-height);
  border-radius: var(--border-radius-buttons);
  transition: opacity 0.25s ease;
  padding: 20px 28px;
  letter-spacing: var(--letter-spacing-buttons);
  text-transform: var(--text-transform-buttons);
  width: max-content;
}

.gh-thin-banner-button:hover {
  opacity: 0.85;
}
