.btn, .form-submit, .btn-secondary, .btn-border {
  background: linear-gradient(#D7DE03, #1B9331) center bottom no-repeat;
  background-size: 100% 200%;
  color: white;
  padding: 1.8rem 5.8rem;
  border-radius: 5rem;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  cursor: pointer;
  text-decoration: none;
  border: none;
  min-width: 18rem;
  display: inline-block;
  line-height: 1.2;
  transition: background-position 0.3s ease-in-out 0s, background-color 0.5s ease-out 0s;
  background-repeat: no-repeat;
  will-change: background-position; }
  .btn:hover, .btn:focus, .form-submit:hover, .form-submit:focus, .btn-secondary:hover, .btn-secondary:focus, .btn-border:hover, .btn-border:focus {
    background-position: center top;
    background-color: var(--secondary-color); }

.btn-border {
  background-color: unset;
  border: var(--primary-color) solid 1px;
  color: var(--primary-color); }
  .btn-border:hover, .btn-border:focus {
    color: white; }

.arrow-link {
  color: var(--primary-color);
  border: none;
  background: none;
  cursor: pointer;
  border-bottom: solid 1px currentColor;
  font-weight: 300;
  font-size: 2rem;
  display: inline-block;
  text-decoration: none;
  transition: border-color 0.15s ease-in-out 0s; }
  .arrow-link::before {
    content: '\f105';
    font-family: 'Font Awesome 5 Pro';
    font-weight: 300;
    margin-right: 1rem; }
  .arrow-link:hover, .arrow-link:focus {
    border-color: transparent; }

.btn-down {
  height: 4rem;
  line-height: 4rem;
  width: 4rem;
  position: relative;
  text-indent: -999em;
  overflow: hidden;
  text-align: left;
  color: var(--primary-color);
  background: rgba(255, 255, 255, 0.9) url("../../img/deco-arrow@2x.png ") center no-repeat;
  background-size: auto 24px;
  border: none;
  cursor: pointer;
  border-radius: 50%;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  transition: background-color 0.15s ease-in-out 0s; }
  .btn-down:hover, .btn-down:focus {
    background-color: white; }

/*# sourceMappingURL=buttons.css.map */