/**
 * @file
 * Visual styles for buttons.
 */
/* ===== CALL-TO-ACTION BUTTON STYLES ===== */
.button,
.cta-button a {
  font-family: "Oswald", Arial, Helvetica, sans-serif;
  display: inline-block;
  padding: 1rem 2.75rem;
  color: #fff;
  font-size: 1.15vw;
  font-weight: 500;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid #69951c;
  border-radius: 5px;
  background: #69951c;
  background: linear-gradient(
    180deg,
    rgba(105, 149, 28, 1) 0%,
    rgba(31, 76, 3, 1) 100%
  );
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
}

@media only screen and (max-width: 900px) {
  .cta-button a {
    font-size: 1.75vw;
    padding: 0.75rem 2.25rem;
  }
}

@media only screen and (max-width: 768px) {
  .cta-button a {
    font-size: 1.5vw;
    padding: 0.5rem 1.5rem;
  }
}

@media only screen and (max-width: 600px) {
  .cta-button a {
    font-size: 2vw;
  }
}

.button:hover,
.cta-button a:hover {
  color: #fff;
  background: #537f17;
  background: linear-gradient(
    180deg,
    rgba(83, 127, 23, 1) 0%,
    rgba(31, 76, 3, 1) 100%
  );
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
}
