.button,
input[type="submit"],
.p-button,
.p-button--sm {
  height: 3rem;
  padding: 0 1.5rem;
  margin: calc( var(--v-spacing__p) / 2 ) 0;

  color: var(--v-color__2);
  background-color: var(--v-color__4);

  font-size: 85%;
  text-decoration: none;

  display: inline-block;

  border: 1px solid var(--v-color__4);
  border-radius: var(--v-border-radius__lg);

  cursor: pointer;
  transition: var(--v-transition__default);

  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
}

.button:hover,
input[type="submit"]:hover,
.p-button:hover {
  background-color: var(--v-color__4--alt1);
  border-color: var(--v-color__4--alt1);
}

.p-button--alt1 {
  background-color: transparent;
  border-color: var(--v-color__4);
  color: var(--v-color__4);
}

.p-button--alt1:hover {
  color: var(--v-color__2);
}


.p-button--alt2 {
  background-color: var(--v-color__5--alt2);
  border-color: var(--v-color__5--alt2);
}

.p-button--form {
  height: var(--v-form-field__height);
}

.p-button--full {
  width: 100%;
}

.p-button--spacing {
  margin-left: calc( var(--v-spacing__p) / 4 );
  margin-right: calc( var(--v-spacing__p) / 4 );
}